<template>
  <div class="container resource" style="min-height: 447px;" class="active">
      <div class="pop-banner clearfix">
        <div class="operate-btns">{{dual}}
          <a href="javascript:;" class="fbtn fb-add" v-if="disabledAdd" @click="addNewdictionarypack">添加</a>
          <a href="javascript:;" class="fbtn fb-add"   v-if="!disabledAdd ">添加</a>
      
         <a href="javascript:;" class="fbtn fb-save" @click="save"  v-if="'/operator/dataadmin:saveMfsupplygoodsunit'  | myqx !disabled ">保存</a>
          <a href="javascript:;" class="fbtn fb-save"  style="color:#DCDCDC" v-if="'/operator/dataadmin:saveMfsupplygoodsunit'  | myqx disabled " v:disabled="disabled">保存</a>


        </div>
        <h3 class="current-module">包装单位</h3>
      </div> 
 <div class="pd-form fast-search-form">
    <div class="group-row">
      <div class="form-group">
        <label for="cn1" class="label">包装单位</label>
        <div class="control">
          <input type="text" value="" id="cn1" v-model='search.search_LIKE_unit' v-rule>
        </div>

      </div>
      <div class="form-group">
         <button class="fast-search-form-btn btn-d btn-d-lg btn-d-activate btn-d-circle fr"  @click="getData(true)">查 询</button>
      </div>
    </div>
  </div>


 <table class="itable itable-thead-13px itable-bordertop">
   <thead>
      <tr>
         <th class="w170">序号</th>
         <th class="w210">包装单位名称</th>
            <th ></th>
          </tr>
        </thead>
        <tbody >
          <tr v-if="showInput">
             <td colspan="2" class="td-name"><input type="text" v-model="mfsupplygoodsunit.unit" placeholder="请输入包装单位名称"></td>
          </tr>
          <tr v-for="(index, mfsupplygoodsunit) in listMfsupplygoodsunit">
             <td>{{index > 8 ? '' : '0'}}{{index + 1}}</td>
             <td class="td-name">{{mfsupplygoodsunit.unit}}</td>
             <td></td>
          </tr>
        </tbody>
      </table>
    <pagination 
   @page-change="getData" 
   :class="['m-20-0']"
   :page-no.sync="search.page" 
   :total-pages.sync="search.totalPages"></pagination>
</template>
<script>
module.exports={
  data: function(){
    return {
        readonly:"disabled",
      disabled:false,
      listMfsupplygoodsunit: [],
      search: {
        pageSize: 10,
        page: 1,
        totalPages: 0,
        search_LIKE_unit: '',
      },
     mfsupplygoodsunit:{
      unit:'',
     },
      // 正在编辑的行
      disabledAdd:true,
      disabledSave:false,
      showInput:false,
      mfsupplygoodsunitUnit:'',
      unit:'',
      authoritySetting: {
          oneSaveFlag:false,
          oneAddFlag:false,

        
      },
    };
  },
 
  methods: {
    getData: function(isRefresh){
      var self = this;
      if(isRefresh) {
        this.search.page = 1;
      }
      Ajax.get('/dictionary/listMfsupplygoodsunit', this.search)
        .then(function (response){
          var data = response.data.data;
          self.$set('listMfsupplygoodsunit',data.list);
          self.search.totalPages = data.totalPages;
        })
      self.$set('disabledAdd',true);
      self.$set('disabledSave',false);
    },
    // 保存
    save: function () {
      var self = this;
      var count=0;    
      if (self.mfsupplygoodsunit.unit =="") {
          layer.msg('请输入单位名称!')
          return ;
        } 
        Ajax.post('/dictionary/saveMfsupplygoodsunit',self.mfsupplygoodsunit)
          .then(function (response) {
             var data = response.data.data;
          if (response.data.errorCode == 0) {
              layer.msg('保存成功！');
            } else {
              layer.msg(response.data.message);
            }
         self.getData();
          });
          self.$set('showInput',false);
    },

    addNewdictionarypack: function () {
    	var self = this;
      this.listMfsupplygoodsunit.push({});
      self.$set('disabledAdd',false);
      self.$set('disabledSave',true);
      self.$set('showInput',true);  
    }
  },
    route:{
      activate : function(){
        this.getData();
      }
    }

};
</script>