<!--跟台高值：直接选择商品-->
<script >
  import model_tab from './include_model_tab.vue';
  

  module.exports = {
    data: function () {
      return {
        // 当前标签页
        tab_index: 1,
        // 采购单位 - 医院
        medList: [],
        // 科室：科室/库房 - 对应某家医院的
        keshiList:[],
        // 库房：科室/库房 - 对应某家医院的
        kufangList:[],
        // 查询科室或者医院的条件
        searchDept:{
          med_guid:'',// 医院guid
          h_name:'',// 医院名称
          category:this.ctns.meddepttype2,// 类别：科室/库房,默认为科室
        },
        // 某医院的跟台高值商品信息
        hvGoodsList:[],
        // 图片数据
        imgcache:[],
        addSign: [],  
        imgarr:[],
        detailImgarr:[],                    // 添加商品标识

        // 勾选过的商品信息
        chGoodsList:[],
        chGoodsListListener:[],
        // 查询高值商品
        searchGoods:{
          //total: 0,
          pageNo: 1,
          pageSize: 51,
          totalPages: 0,
          param:{
              
            goodsname:'',// 商品名称
            s_guid:'',// 供应商guid - 该字段由后台赋值
            userid:'',// 业务员guid - 该字段由后台赋值
          }
          
        },
        // 模板信息
        model:{
          name:'',
          isSelect:'',
        },
        // 出库单信息
        postData:{
        },
        // 出库单信息
        trhvdo:{
          billtype:this.ctns.billtype02,       
          medguid:'',// 采购医院guid
          medname:'',// 采购医院名称
          meddeptguid:'',// 订货科室guid
          meddeptname:'',// 订货科室名称
          medstoreguid:'',// 订货库房guid
          medstorename:'',// 订货库房名称
        },
        readonlyFlag:false,
      };
    },
    methods: {
      // 获得初始化数据
      getData: function () {
        var self = this;
        // 置空全局中的数据
        self.$store.state.postdata = {};          
          
      },
      addresslist: function(guid) {
        var self = this;   
        for(var i = 0; i<self.kufangList.length; i++){
            if(self.kufangList[i].value == guid ){  
              self.$set("trhvdo.address", self.kufangList[i].storeroomaddress); 
            }
        } 
      },
      // 获得供应商的高值耗材的供应关系中的医院
      getMedListRelation:function(){
        var self = this;
        Ajax.get('/trhv/getMedListRelation')
           .then(function (response){
            var data = response.data;
            if(data.errorCode == 0){
              self.medList = _.map(data.data, function (item) {
                   return {
                       label: item.name,
                       value: item.guid
                   };
              });
            }else{
              layer.msg(data.message);
            }
        })
      },
      // 科室：获得某个医院的可以订货的科室，或者库房
      getMedDeptList:function(category){   
        var self = this;
        // 首先判断医院是否选择了，如果没有选择，那么需要提示
        if((self.searchDept.med_guid||'')==''){
          self.keshiList = null;
          self.kufangList = null;
          return ;
        }
        self.searchDept.category = category;
        Ajax.get('/trhv/getMedDeptList',this.searchDept)
           .then(function (response){
            var data = response.data;
            if(data.errorCode == 0){
              // 科室
              if(self.ctns.meddepttype2==category){
                self.keshiList = _.map(data.data, function (item) {
                   return {
                       label: item.hdeptname,
                       // value: (item.guid+'@'+item.hdeptname)
                       value:item.guid,
                       storeroomaddress:item.storeroomaddress
                   };
                });
              }else{// 库房
                self.kufangList = _.map(data.data, function (item) {
                   return {
                       label: item.hdeptname,
                       // value: (item.guid+'@'+item.hdeptname)
                       value: item.guid,
                       storeroomaddress: item.storeroomaddress
                   };
                });
              }              
            }else{
              layer.msg(data.message);
            }
        })
      },
      // 对应该医院供应关系中的跟台高值商品
      getMedListRelation:function(){
        var self = this;
        Ajax.get('/trhv/getMedListRelation')
           .then(function (response){
            var data = response.data;
            if(data.errorCode == 0){
              self.medList = _.map(data.data, function (item) {
                   return {
                       label: item.name,
                       value: (item.guid+'@'+item.name)
                   };
              });
            }else{
              layer.msg(data.message);
            }
        })
      },
      // 查询供应某医院的高值商品
      listGoods:function(){
        var self = this;
        // 首先判断医院是否选择了，如果没有选择，那么需要提示
        if((self.searchDept.med_guid||'')==''){
          layer.msg('请先选择采购单位!');
          return ;
        } 
        // 科室必须选择，库房可以不选
        if((self.trhvdo.meddeptguid||'')==''){
          layer.msg('请先选择要货科室!');
          return ;
        }
        
        // 查询后边的数据
        self.searchGoods.param.med_guid = self.searchDept.med_guid;
        self.searchGoods.param.med_ks=self.trhvdo.meddeptguid;
        self.searchGoods.param.med_kf=self.trhvdo.medstoreguid;

        Ajax.post('/trhv/listHvGoods', this.searchGoods)
          .then(function (response) {
            var data = response.data;

            if(data.errorCode==0){
              self.$set('hvGoodsList', data.data.list);

              self.searchGoods.pageNo = data.data.pageNo;
              self.searchGoods.totalPages = data.data.totalPages;
              self.searchGoods.total = data.data.total;

              // 封存商品图片信息
              var sen=response.data.senData;
              for(var key in sen){
                self.imgcache[key] =  sen[key];
              }
              // 其他
              
                var addSignTemp = [];
                for(var i=0;i<self.hvGoodsList.length;i++){
                  addSignTemp.push(false);
                }
                self.$set('addSign',addSignTemp); 
                }
         });
      },
      // 添加商品
      addMfmedgoods: function(){
        var self = this;
        var flg = true;  
        for(var i=0;i<self.hvGoodsList.length;i++){

          if(self.addSign[i]){ 
            if(self.chGoodsList.length == 0){ 
              self.chGoodsList.push(self.hvGoodsList[i]);  
              self.detailImgarr.push(self.imgarr[i]);
            }else{
              for(var j=0;j<self.chGoodsList.length;j++){ 
                if(self.hvGoodsList[i].supplierGoodsguid == self.chGoodsList[j].supplierGoodsguid && self.hvGoodsList[i].supplierGoodsname == self.chGoodsList[j].supplierGoodsname){
                  flg = false;
                  break;
                } else {
                  flg = true; 
                }
              }
              if (flg) {
                self.chGoodsList.push(self.hvGoodsList[i]);
                self.detailImgarr.push(self.imgarr[i]);
              }
            }
          }
        }
      },
      deleteAddGoods: function(index) {
        this.chGoodsList.splice(index, 1);
      },
      // 查询
      searchListGoods:function(){
          var self = this;
        if(self.searchGoods.param.goodsname.indexOf(" ") != -1){
          self.searchGoods.param.goodsname=self.searchGoods.param.goodsname.trim();
        }
          self.searchGoods.pageNo = 1;
          self.listGoods(); 
      },
      // 下一步生成出库单
      goGenTrhvdo:function(){
        var self = this;
        // 首先判断医院是否选择了，如果没有选择，那么需要提示
        if(self.chGoodsList.length==0){
          layer.msg('没有选中的商品，不需要生成出库单!');
          return ;
        }

        // 没有填写出库日期
        if((self.trhvdo.dodate||'')==''){
          layer.msg('请填写出库日期!');
          return ;
        }

        // 赋值出库单信息
        self.postData.trhvdo = self.trhvdo;
        // 选择的商品信息
        self.postData.chGoodsList = self.chGoodsList;
        // 模板信息
        self.postData.model = self.model;

        // 判断是否选择了收藏为模板
        if(self.model.isSelect  && self.model.name==''){          
          // 没办法先放入全局变量中吧
          self.$store.state.postdata = self.postData;
          self.$route.router.go('/trhv/orderHighout3');
        }else if(self.model.isSelect  && self.model.name!=''){
          // 需要判断模板是否存在 
          Ajax.post('/trhv/isExistHv', {name:self.model.name})
            .then(function (response) {
              var isexist = response.data.data;
              if(isexist!='Y'){
                self.genTrhvdo(self.postData);
              }else{
                layer.msg('模板名称已经存在，请更换一个!');
              }
          });
          return ;  
        }else{
          // 直接生成订单
          self.genTrhvdo(self.postData);
        } 
      },
      // 支撑上边的方法：生成出库单
      genTrhvdo:function(postdata){
        var self = this;
        self.MessageBox({
            title: '提示',
            message: '您是否确定要生成出库单？',
            type: 'success',
            showCancelButton: true
          },function(action) {
            // 到后台需要判断是否需要生成模板
            if(action=='confirm'){
              Ajax.post('/trhv/genTrhvdo', postdata)
                .then(function (response) {
                  if(response.data.errorCode==0){
                    var billno = response.data.data || '';  
                    if(billno!=''){
                      layer.msg('生成订单成功！');
                      self.$route.router.go('/trhv/orderHighout4/'+billno);
                    }else{
                      layer.msg('出库单悄悄的溜走了！');
                    }                    
                  }else{
                      layer.msg('生成订单异常！');
                  }
              });
              return ;
            } 
          });  
      },
      // 验证金额
      checkInfotaxprice: function(taxprice, index, code) {
        var self = this;   
        if (taxprice < 0) {
            self.MessageBox({title:'警告', message:"包装价格不能为负数!", type: 'alert'},function(action){
          self.$set('chGoodsList['+index+'].supplierPrice', '');
          }); 
        } 
      },
      // 计算商品的金额
      calAmount:function(guid,mx){
        var self=this;
        // 取到刚刚输入的数据
        var newValue = $("#"+guid).val();
        // 判断输入的是不是数值
        if(isNaN(newValue)){
          layer.msg('请输入数字!');
          $("#"+guid).val('0');
          $("#"+guid).focus();
          return ;
        }
        //判断是否为负数
        if(newValue<0){
          layer.msg('出货数不能为负数!');
          $("#"+guid).val('0');
          return ;
        }
        // 判断是否为整数
        if(parseInt(newValue)!=newValue){
          layer.msg('请输入整数!');
          $("#"+guid).val('0');
          return ;
        }
        // mx.do_supplier_pesentqty = newValue;
        // 转换成医院端应该出库的数量(XXXXXXX 火狐浏览器是5舍6入，很坑爹 XXXXXXXXXXXXX)
        mx.amount =  Math.round(mx.supplierPrice * mx.supplierPesentqty);                  
      }
    },
    route: {
      activate: function () {
        this.getData();
        this.getMedListRelation();
        var now=new Date();

        //this.$set('trhvdo.dodate',now.toLocaleDateString().replace(/\//g,'-'));

        var Year = 0; 
        var Month = 0; 
        var Day = 0; 
        var CurrentDate = ""; 
        //初始化时间 
        Year= now.getFullYear();//ie火狐下都可以 
        Month= now.getMonth()+1; 
        Day = now.getDate(); 
        CurrentDate += Year + "-"; 
        if (Month >= 10 ){ 
          CurrentDate += Month + "-"; 
        }else { 
          CurrentDate += "0" + Month + "-"; 
        } 
        if (Day >= 10 ) { 
          CurrentDate += Day ; 
        }else { 
          CurrentDate += "0" + Day ; 
        } 
        this.$set('trhvdo.dodate',CurrentDate);
      }
    },
    components: {
        model_tab
    },
    watch:{
      // 选择医院
      'selectMed': function (val) {
        var self = this;
        if(val!=''){
          // 医院guid
          self.$set('trhvdo.medguid',val.split("@")[0]);
          // 医院名称
          self.$set('trhvdo.medname',val.split("@")[1]);
        }else{
          // 医院guid
          self.$set('trhvdo.medguid','');
          // 医院名称
          self.$set('trhvdo.medname','');
        }
        self.$set('searchDept.med_guid',self.trhvdo.medguid);

        self.getMedDeptList(self.ctns.meddepttype2);    
        self.getMedDeptList(self.ctns.meddepttype1); 

        // 重新选择医院之后，需要清空之前的选择的数据、放到缓存中的图片数据
        self.chGoodsList=[];
        self.hvGoodsList=[];
        self.imgcache=[];
        // self.listGoods();            
      },
      // 选择科室
      'selectKeshi': function (val) {
        var self = this;
        if(val!=''){
          // 医院guid
          self.$set('trhvdo.meddeptguid',val.split("@")[0]);
          // 医院名称
          self.$set('trhvdo.meddeptname',val.split("@")[1]);
        }else{
          // 医院guid
          self.$set('trhvdo.meddeptguid','');
          // 医院名称
          self.$set('trhvdo.meddeptname','');
        }
        // self.listGoods();   

      },
      // 选择库房
      'selectKufang': function (val) {
        var self = this;
        if(val!=''){
          // 医院guid
          self.$set('trhvdo.medstoreguid',val.split("@")[0]);
          // 医院名称
          self.$set('trhvdo.medstorename',val.split("@")[1]);
        }else{
          // 医院guid
          self.$set('trhvdo.medstoreguid','');
          // 医院名称
          self.$set('trhvdo.medstorename','');
        }
        // self.listGoods();
      },
      // 实时监听复选框勾选变化
      // 'chGoodsListListener': function (val) {
      //   var self = this;

      //   //封装业务员授权书资料信息
      //     for(var j=0;j<self.hvGoodsList.length;j++){
      //       var hvGood =self.hvGoodsList[j];
      //     if(JSON.stringify(val).indexOf(hvGood.supplierGoodsguid)!=-1 && JSON.stringify(self.chGoodsList).indexOf(hvGood.supplierGoodsguid)==-1){  
      //       self.chGoodsList.push(hvGood);
      //     }
      //   }

      //   if(self.chGoodsListListener.length==0){
      //          self.chGoodsList=[];
      //     }else{
      //       for(var i=0;i<self.chGoodsList.length;i++){
      //         if(JSON.stringify(self.chGoodsListListener).indexOf(self.chGoodsList[i].supplierGoodsguid)==-1) {
      //           self.chGoodsList.splice(i,1);
      //        }
      //      }
      //    }

       



      // },
    },
  };
</script>
<template>
  <div class="container resource close-left-menu contaNEW">
    <div class="pop-banner clearfix">
    <div class="operate-btns"></div>
    <h3 class="current-module">跟台高值出库</h3>
  </div>
  <div class="order-highout">
    <!--跟台高值出库Tab页-->
    <model_tab :tab_index="tab_index"></model_tab>

    <div class="fpart pd-form ">
      <!--pd-form-lg-label-->
      <div class="fheader gray-bottom">
        <h4 class="fh-notes">出库基本信息</h4>
        <div class="fr pap-tit-right">
          <div class="checkbox-control checkbox-inline">
            <input type="checkbox" name="cb" id="cball" value="Y" v-model="model.isSelect" checked="checked">
            <label class="checkbox" for="cball">收藏为订单模板</label>
          </div>
          请为模板起个好名字
          <input class="" type="text" v-model="model.name"></div>
      </div>
      <div class="group-row">
        <div class="form-group"> 
          <div class="control form-required">
            <datepicker :target.sync="trhvdo.dodate" :readonly="readonlyFlag" style='height:34px;line-height:34px;'></datepicker>
          </div>
        </div>
        <div class="form-group form-label">
          <label for="cn1" class="label">采购单位</label>
          <div class="control select-style">
            <select-ui :list="medList" v-model='selectMed' class="inp4" id='cn1'></select-ui>
          </div>
        </div>
      </div>
      <div class="group-row">
        <div class="form-group form-label">
          <label for="cn2" class="label">要货科室</label>
          <div class="control">
            <select-ui :list="keshiList" v-model='selectKeshi' class="inp4" id='cn2'></select-ui>
          </div>
        </div>
        <div class="form-group form-label">
          <label for="cn3" class="label">要货库房</label>
          <div class="control">            
            <!-- <select-ui :list="kufangList" v-model='selectKufang' class="inp4" id='cn3'></select-ui> -->
            <select v-model="selectKufang" @change="addresslist(selectKufang)" class="inp4"> 
                <option v-for="option in kufangList" v-bind:value="option.value">
                  {{option.label}}
                </option>
              </select>
          </div>
        </div>


      </div>
      <div class="form-group form-label">
        <label for="cn4" class="label">收货地点</label>
        <div class="control input-bottom-txt">
          <input type="text" v-model="trhvdo.address" class="inp4" id='cn4'>
          <div class="input-txt mt-5 mb-10">提示：长度不能超过30个汉字</div>
        </div>
      </div>
      <div class="group-row">
        <div class="form-group form-label">
          <label for="cn5" class="label">单据类型</label>
          <div class="control">
            <input type="text" value="跟台高值" readonly="readonly" class="inp4" id='cn5'></div>
        </div>
      </div>
    </div>
    <div class="fpart">
      <div class="fheader mb-20">
        <h4 class="fh-select">选择商品</h4>
      </div>
      <div class="mb-30 clearfix">  
        <div action="###" class="search-bar fl"> 
          <input type="text" v-model="searchGoods.param.goodsname" placeholder="输入商品名称" class="ipt">
          <div class="search-btn" @click="searchListGoods">
          <input type="button">
          </div> 
        </div>
        <!-- <button class="btn-icon-add btn-d btn-d-lg btn-d-circle fr  btn button-green fr icon add">添 加</button> -->
        <button class="fr btn button-green fr icon add"@click="addMfmedgoods">添 加</button>
      </div>
      <!--跟台高值商品列表-->
      <ul class="select-product clearfix">
        <li  v-for="(index,good) in hvGoodsList" >
          <div v-bind:class="{'product-item active' : addSign[index], 'product-item' :!addSign[index]}">
            <div class="product-item-l">              
              <div class="pro-pic pro-pic-lg" v-if="good.pictcontent != null && good.pictcontent != undefined && good.pictcontent != ''">
                <imagebox v-bind:imgarr="imgcache[good.supplierGoodsguid] | original">
                  <img class="pro-pic pro-pic-lg" style="margin-top: 0px;" 
                    v-bind:src="imgcache[good.supplierGoodsguid] | thumbnail">
                  <span class="pic-max blue-search">
                  </span>
                </imagebox>
              </div>
              <div v-else>
                <img class="pro-pic pro-pic-lg" src="/images/default.jpg">
              </div>
              <div class="checkbox-control">
                <input type="checkbox" id="good{{$index}}"  
                 v-model="addSign[index]">
                <label class="checkbox" for="good{{$index}}">选择</label>
              </div>
            </div>
            <div class="product-item-r">
              {{good.supplierGoodscode}}
              <br/>
              <span class="text-color-green">{{good.supplierGoodsname}}</span>
              <br/>
              <!--包装规格-->
              {{good.supplierGoodsspec}}
              <br/>
              <!--生产厂商-->
              {{good.manufacturer}}
              <br/>
              <!--注册证号-->
              {{good.registkey}}
              <br/>
              {{good.suppliername}}
            </div>
            <div class="clear"></div>
          </div>
        </li>
      </ul>
      <div class="pagination m-20-0">
        <pagination
           @page-change="listGoods"
           :page-no.sync="searchGoods.pageNo"
           :total-pages.sync="searchGoods.totalPages">          
        </pagination>
      </div>
    </div>
    <div class="fheader no-bottom">
      <h4 class="fh-returns-list">已选商品明细</h4>
    </div>
    <table class="itable itable-bordertop itable-td-long-text ">
      <thead>
        <tr>
          <th class="w50">序号</th>
          <th class="w260 t-left">
            <div class="p-lr-10">商品</div>
          </th>
          <th class="w80">出货数</th>
          <th class="w80">出库单位</th>
          <th class="w80">包装价格</th>
          <th class="w100">含税金额</th>
          <th class="w70">操作</th>
        </tr>
      </thead>
      <tbody>
        <tr  v-if="chGoodsList.length==0" >
          <td colspan="8">
            暂无选中的高值商品!
          </td>
        </tr>
        <tr  v-for="chGood in chGoodsList" >
          <td>
            {{$index+1 | getIndex}}
           <div class="pro-pic" v-if="trmedplandetail.pictcontent != null && trmedplandetail.pictcontent != undefined && trmedplandetail.pictcontent != ''">
                <imagebox v-bind:imgarr="imgcache[chGood.supplierGoodsguid] | original">
                  <img 
                    class="pro-pic" style="margin-top:0px;"
                    v-bind:src="imgcache[chGood.supplierGoodsguid] | thumbnail">
                  <span class="pic-max blue-search">
                  </span>
                </imagebox>  
                </div>
                <div v-else>
                  <img class="pro-pic" style="margin-top:0px;" src="/images/default.jpg">
                </div>
          </td>
          <td class="w260 t-left">
            <div class="p-lr-10">
              <!--供应商商品编码-->
               {{chGood.supplierGoodscode}}
              <br/>
              <span class="p-tit-green">{{chGood.supplierGoodsname}}</span>
              <br/>
              <!--包装规格-->
              {{chGood.supplierGoodsspec}}
              <br/>
              <!--生产厂商-->
              {{chGood.manufacturer}}
              <br/>
              <!--注册证号-->
              {{chGood.registkey}}
            </div>
          </td>
          <td class="pt40">
            <input type="text" class="edit-number"
              v-on:change="calAmount($index,chGood)"
              id="{{$index}}" v-model="chGood.supplierPesentqty"></td>
          <td class="pt40">{{chGood.supplierUnit}}</td>
          <td class="pt40"><input type="text" class="edit-number" v-model="chGood.supplierPrice" v-on:change="checkInfotaxprice(chGood.supplierPrice,$index,chGood)"><!-- {{chGood.supplierPrice | numDigit 6 | numFmt}} -->元</td>
          <td class="pt40" v-if="chGood.supplierPesentqty != null && chGood.supplierPesentqty != ''">{{chGood.supplierPesentqty*chGood.supplierPrice | numDigit 2 | numFmt}}元</td>
          <td v-else>{{0 * chGood.supplierPrice | numDigit 2 | numFmt}}元</td>
          <td class="pt40">
            <!-- <a href="javascript:;" class="btn-d btn-d-activate">作废</a> -->
            <a href="javascript:;" class="btn button-red"  @click="deleteAddGoods($index)">删除</a>
          </td>
        </tr>
      </tbody>
    </table>
    <div class="step-btn">
      <a v-on:click="goGenTrhvdo()"
        v-if="'/supplier/trhv:genTrhvdo' | myqx">下一步，生成出库单>></a>
    </div>
  </div>
</div>
</template>