<template>
  <div class="container resource close-left-menu contaNEW">
   <div class="pop-banner clearfix">
    <div class="operate-btns">
      <a href="javascript:;" class="fbtn fb-add" v-link='{"path":"/supplyRelation2"}'>添加</a>
      <a href="javascript:;" class="fbtn fb-batch-remove" @click='relieveS'>批量解除</a>
    </div>
     <h3 class="current-module">商品供应关系</h3>
    </div>
  <!--supply-productlist start-->
    <div class="supply-productlist clearfix">

      <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" id="cn1" maxlength="50" v-rule v-model="search.goodname" title='商品信息' placeholder="商品信息">
           </div>
         </div>
         <div class="form-group">
           <!-- <label for="cn2" class="label">供应商名称</label> -->
            <div class="control">
              <input type="text" id="cn2" maxlength="20" v-rule v-model="search.suppliername" title='供应商名称' placeholder="供应商名称">
           </div>
         </div>
        </div>

       <div class="group-row t-right">
          <button class="fast-search-form-btn btn-d btn-d-lg btn-d-activate btn-d-circle" @click="getData">查 询</button>
        </div>
      </div>

     <div class="search-result">
       <div class="statistics">您当前共有<em class="b">{{total}}</em>个商品</div>
     </div>
     <table class=" itable itable-thead-13px itable-td-long-text">
        <thead id='t_header'>
          <tr>
           <th class="w60">序号</th>
           <th class="w200">商品</th>
           <!--<th class="w140">商品</th>-->
           <th class="w100">生产厂商</th>
           <!--<th class="w130">注册证号／<br>批准文号</th>-->
           <th class="w50">生产来源</th>
           <th class="w70">产地</th>
           <th class="w100">供应商</th>
           <th class="w90">操作</th>
          </tr>
       </thead>
       <tbody>
         <tr v-for="hospitalProduct in hospitalProductList">
           <td>
              <div class="checkbox-control checkbox-inline">
                <input type="checkbox" :id="hospitalProduct.supplygoodsguid" v-model="hospitalProduct.checked">
                <label class="checkbox mr-0" :for="hospitalProduct.supplygoodsguid">{{$index+1| getIndex}}</label>
              </div>
          </td>
           <td class="t-left">

               {{hospitalProduct.goodscode}} <br>
               <span class="product-tit p-tit-green">{{hospitalProduct.goodsname}}</span><br>
               {{hospitalProduct.registkey}}<br>
               {{hospitalProduct.unitstyle}}<br>
               {{hospitalProduct.minunitqty}}{{hospitalProduct.minunitstyle}}

           </td>
           <!--<td>-->
              <!--<div class="pr10 t-left">{{hospitalProduct.goodsname}}<br>{{hospitalProduct.unitstyle}}-->
                <!--<br>{{hospitalProduct.minunitqty}}{{hospitalProduct.minunitstyle}}-->
              <!--</div>-->
           <!--</td>-->
           <td class="t-left pr10">{{hospitalProduct.producer}}</td>
           <!--<td class="t-left pr10">{{hospitalProduct.registkey}}</td>-->
           <td>{{hospitalProduct.importedflag | IMPORTEDFLAG}}</td>
           <td>{{hospitalProduct.productionaddress}}</td>
           <td class="t-left pr10">{{hospitalProduct.suppliername }}</td>
           <td class="pt7"><a class="btn button-red p-lr-10" @click='relieve(hospitalProduct.supplygoodsguid)'>解除供应商</a></td>
         </tr>
       </tbody>
      </table>
      <pagination
      @page-change="getData"
      :class="['m-20-0']"
      :page-no.sync="search.page"
      :total-pages.sync="search.totalPages"
      v-if='search' ></pagination>
    </div>
  </div>
</template>
<script>
module.exports={
  data: function(){
    return {
      hospitalProductList: [],
      search: {
        pageSize: 50,
        page: 1,
        totalPages: 0,
        goodname: '',
        suppliername: '',
      },
      medGuid:'',
      total:0,
    };
  },
  methods: {
    getData: function(){
      var self = this;

      Ajax.post('/supplyProduct/querySupplyGoods', this.search)
        .then(function (response){
          var data = response.data.data;
          if (response.data.errorCode == 0) {
            self.$set('hospitalProductList',data.list);
            self.search.totalPages = data.totalPages;
            self.total = data.total;
          }
        })
    },
    relieve:function(supplygoodsguid){
        var self=this;
        var guid=supplygoodsguid;

          self.MessageBox({
           title:'提示',
           message:'是否确定解除供应商',
           type:'alert',
           showCancelButton: true
          },function(action){

             if (action=="confirm") {
                Ajax.post('/supplyProduct/delRelationGoods',JSON.stringify([{'supplygoodsguid':guid}])).
                  then(function(response){
                    var result=response.data;
                    if(result.errorCode==0){
                        layer.msg(result.message);
                        self.getData();
                    }else{
                      layer.msg(result.message);
                    }
                })
              }
          })
    },
    relieveS:function(){
      var self=this;
      var arr=[];

      for(var i=0;i<self.hospitalProductList.length;i++){
            if(this.hospitalProductList[i].checked==1){
              arr.push(this.hospitalProductList[i]);
            }
          };
        self.MessageBox({
           title:'提示',
           message:'是否确定解除供应商',
           type:'alert',
           showCancelButton: true
          },function(action){
             arr=JSON.stringify(arr);
             if (action=="confirm") {
                Ajax.post('/supplyProduct/delRelationGoods',arr).
                  then(function(response){
                    var result=response.data;
                    if(result.errorCode==0){
                        layer.msg(result.message);
                        self.getData();
                    }else{
                       layer.msg(result.message);
                    }
                })
              }
          })
    }
  },
  route:{
    activate : function(){
      this.getData();
    }
  }
};
</script>