<template>
  <div class="container resource close-left-menu" style="min-height: 599px;">

  <div class="pop-banner clearfix">
    <div class="operate-btns">
      <a href="javascript:void(0)" class="fbtn fb-save" @click="save">保存</a>
      <a class="fbtn fb-return" href="javascript:history.go(-1)">返回</a>
    </div>
    <h3 class="current-module">商品主数据审核</h3>
  </div>
  <!--supply-productview start-->
  <div class="supply-productview clearfix">
  
    <div class="pd-form">
      <div class="group-row">
        <div class="form-group">
          <label for="" class="label">商品编号</label>
          <div class="control input-has-btn">
            <input type="text" placeholder="商品编号" title="商品编号">
            <!-- <span class="input-state">已对码</span> -->
          </div>
        </div>
        <div class="form-group">
          <label for="" class="label">商品名称</label>
          <div class="control">
            <input type="text" placeholder="商品名称" title="商品名称" v-model="list.goodsname">
          </div>
        </div>
      </div>
      <div class="group-row">
        <div class="form-group">
          <label for="" class="label">生产厂商</label>
          <div class="control">
            <input type="text" placeholder="生产厂商" title="生产厂商" v-model="list.producer">
          </div>
        </div>
        <div class="form-group">
          <label for="" class="label">批准文号／注册证号</label>
          <div class="control">
            <input type="text" placeholder="批准文号／注册证号" title=">批准文号／注册证号" v-model="list.registkey">
          </div>
        </div>
      </div>
      <div class="group-row">
        <div class="form-group">
          <label for="" class="label">规格</label>
          <div class="control">
            <input type="text" placeholder="规格" title="规格" v-model="list.goodsspec">
          </div>
        </div>
        <div class="form-group">
          <label for="" class="label">产地</label>
          <div class="control">
           <input type="text" placeholder="产地" title="产地" v-model="list.productionaddress">
          </div>
        </div>
      </div>
      <div class="group-row">
        <div class="form-group">
          <label for="" class="label">品牌</label>
          <div class="control">
            <input type="text" placeholder="品牌" title="品牌" v-model="list.brand">
          </div>
        </div>
         <div class="form-group">
          <label class="label">生产来源</label>
          <div class="control">
            <div class="radio-control">
              <input type="radio" id="radio01" name="radioio" value="1" v-model='list.importedflag'>
              <label class="radio" for="radio01">国产</label>
              <input type="radio" name="radioio" id="radio02" value="2" v-model='list.importedflag'>
              <label class="radio" for="radio02">进口</label>
            </div>
          </div>
        </div>
      </div>
      <div class="group-row">
        <div class="form-group">
          <label for="" class="label">商品大类</label>
          <div class="control">
            <input type="text" placeholder="商品大类" title="商品大类" v-model="list.goodscate">
          </div>
        </div>
        <div class="form-group">
          <label for="" class="label">计量单位</label>
          <div class="control">
            <input type="text" placeholder="计量单位" title="计量单位" v-model="list.unitstyle">
          </div>
        </div>
      </div>
      <div class="group-row">
        <div class="form-group">
           <label for="" class="label">药品本位码</label>
           <div class="control">
            <input type="text" placeholder="药品本位码" title="药品本位码" v-model="list.productstandardcode">
          </div>
        </div>
        <div class="form-group">
          <label for="" class="label">器械产品DI</label>
          <div class="control">
            <input type="text" placeholder="器械产品DI" title="器械产品DI" v-model="list.specstandardcode">
          </div>
        </div>
      </div>
      <div class="package-form clearfix">
        <div class="package-item package-sm" style="margin-left:84px;">
          <h3>小包装</h3>
          <div class="package-msg">
            <label for="" class="label">包装含量</label>
            <input type="text" placeholder="包装含量" title="包装含量" v-model="list.minunitqty">
          </div>
          <div class="package-msg">
            <label for="" class="label">包装单位</label>
            <input type="text" placeholder="包装单位" title="包装单位" v-model="list.minunitstyle">
          </div>
          <div class="package-msg">
            <label for="" class="label">包装条码</label>
            <input type="text" placeholder="包装条码" title="包装条码" v-model="list.litbcd">
          </div>
        </div>
        <div class="package-item package-lg">
          <h3>大包装</h3>
          <div class="package-msg">
            <label for="" class="label">包装含量</label>
            <input type="text" placeholder="包装含量" title="包装含量" v-model="list.bigunitstyle" style="width:120px;">
            <label for="" class="label">长(cm)</label>
            <input type="text" placeholder="长(cm)" title="长(cm)" style="margin-left:20px;" v-model="list.length">
             <label for="" class="label">净重(kg)</label>
            <input type="text" placeholder="净重(kg)" title="净重(kg)" style="margin-left:20px;" v-model="list.netweight">
          </div>
          <div class="package-msg">
            <label for="" class="label">包装单位</label>
            <input type="text" placeholder="包装单位" title="包装单位" v-model="list.bigunitqty" style="width:120px;">
            <label for="" class="label">宽(cm)</label>
            <input type="text" placeholder="宽(cm)" title="宽(cm)" style="margin-left:20px;" v-model="list.width">
            <label for="" class="label">毛重(kg)</label>
            <input type="text" placeholder="毛重(kg)" title="毛重(kg)" style="margin-left:20px;" v-model="list.grossweight">
          </div>
          <div class="package-msg">
            <label for="" class="label">包装条码</label>
            <input type="text" placeholder="包装条码" title="包装条码" v-model="list.bigbcd"  style="width:120px;">
            <label for="" class="label">高(cm)</label>
            <input type="text" placeholder="高(cm)" title="高(cm)" style="margin-left:20px;" v-model="list.height">
          </div>
        </div>
      </div>

      <div class="form-group">
        <label for="cn10" class="label">备注</label>
        <div class="control">
          <textarea  rows="3" placeholder="备注" title="备注" class="textarea" v-model="list.memo"></textarea>
        </div>
      </div>
    </div>
    

  <div class="fheader no-bottom mt-20">
    <h4 class="fh-notes no-l-icon">对码结果</h4>
  </div>

  <table class="itable itable-thead-13px itable-td-long-text table-bg">
    <thead>
      <tr>
        <th class="w50"></th>
        <th class="w60">序号</th>
        <th class="w130">商品<br>名称</th>
        <th class="w80">规格</th>
        <th class="w130">注册证号/<br>批准文号</th>
        <th class="w130">生产<br>厂商</th>
        <th class="w60">生产<br>来源</th>
        <th class="w60">小包装<br>单位</th>
      </tr>
    </thead>
    <tbody>
      <tr v-if="result && resultFlag">
        <td><a class="btn-d btn-d-activate btn-d-grey" href="javascript:;" @click="cancel">取消</a><div class="text-color-red">已配对</div></td>
        <td>{{1}}
          <span class="star-group" v-if="0 <= result.score*10 && result.score*10<= 80">
            <span></span>
            <span></span>
            <span></span>
          </span>
          <span class="star-group" v-if="80 < result.score*10 && result.score*10<=90">
            <span class="group-yellow"></span>
            <span></span>
            <span></span>
          </span>
          <span class="star-group" v-if="90 < result.score*10 && result.score*10<=95">
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
            <span></span>
          </span>
          <span class="star-group" v-if="95<result.score*10">
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
          </span>
        </td>
        <td>{{{result.goodsName}}}</td>
        <td>{{{result.goodsSpec}}}</td>
        <td>{{{result.registKey}}}</td>
        <td>{{{result.producer}}}</td>
        <td>{{result.importedFlag==1?'国产':result.importedFlag==0?'进口':''}}</td>
        <td>{{{result.minUnitStyle}}}</td>
      </tr>
    </tbody>
  </table>

  <div class="m-20-0">
    <button class="btn-d btn-d-activate btn-d-lg" @click="parisons">智能对码</button>
  </div>

  <div class="itable-tit table-no-border">
    <h3 class="primary-text">建立系统映射关系</h3>
 <!--    <div class="fr">
      <span class="text-color-red">找不到？您可以</span>
    </div> -->
  </div>
  <table class="itable itable-thead-13px itable-td-long-text">
    <thead>
      <tr>
        <th class="w50"></th>
        <th class="w60">序号</th>
        <th class="w130">商品<br>名称</th>
        <th class="w90">规格</th>
        <th class="w160">注册证号/<br>批准文号</th>
        <th class="w130">生产<br>厂商</th>
        <th class="w50">生产<br>来源</th>
        <th class="w60">小包装<br>单位</th>
      </tr>
    </thead>
    <tbody>
      <tr  v-if="result && resultFlag">
        <td><a class="btn-d btn-d-activate btn-d-grey" href="javascript:;">取消</a><div class="text-color-red">已配对</div></td>
        <td>{{1}}
          <span class="star-group" v-if="0 <= result.score*10 && result.score*10<= 80">
            <span></span>
            <span></span>
            <span></span>
          </span>
          <span class="star-group" v-if="80 < result.score*10 && result.score*10<=90">
            <span class="group-yellow"></span>
            <span></span>
            <span></span>
          </span>
          <span class="star-group" v-if="90 < result.score*10 && result.score*10<=95">
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
            <span></span>
          </span>
          <span class="star-group" v-if="95 < result.score*10">
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
          </span>
        </td>
        <td>{{{result.goodsName}}}</td>
        <td>{{{result.goodsSpec}}}</td>
        <td>{{{result.registKey}}}</td>
        <td>{{{result.producer}}}</td>
        <td>{{result.importedFlag==1?'国产':result.importedFlag==0?'进口':''}}</td>
        <td>{{{result.minUnitStyle}}}</td>
      </tr>      
      <tr v-for="gooddm in goodsDMList">
        <td>
          <a class="btn-d btn-d-activate" href="javascript:void(0);" @click="mate($index)">配对</a>
        </td>
        <td  v-if="result && resultFlag">{{$index+2}}
          <span class="star-group" v-if="0 <= gooddm.score*10 && gooddm.score*10<= 80">
            <span></span>
            <span></span>
            <span></span>
          </span>
          <span class="star-group" v-if="80 < gooddm.score*10 && gooddm.score*10<=90">
            <span class="group-yellow"></span>
            <span></span>
            <span></span>
          </span>
          <span class="star-group" v-if="90 < gooddm.score*10 && gooddm.score*10<=95">
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
            <span></span>
          </span>
          <span class="star-group" v-if="95<gooddm.score*10">
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
          </span>
        </td>
        <td v-else>{{$index+1}}
          <span class="star-group" v-if="0 <= gooddm.score*10 && gooddm.score*10<= 80">
            <span></span>
            <span></span>
            <span></span>
          </span>
          <span class="star-group" v-if="80 < gooddm.score*10 && gooddm.score*10<=90">
            <span class="group-yellow"></span>
            <span></span>
            <span></span>
          </span>
          <span class="star-group" v-if="90 < gooddm.score*10 && gooddm.score*10<=95">
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
            <span></span>
          </span>
          <span class="star-group" v-if="95<gooddm.score*10">
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
            <span class="group-yellow"></span>
          </span>
        </td>
        <td>
          <div class="p-lr-10">{{{gooddm.goodsName}}}</div>
        </td>
        <td>
          <div class="p-lr-10">{{{gooddm.goodsSpec}}}</div>
        </td>
        <td>
          <div class="p-lr-10">{{{gooddm.registKey}}}</div>
        </td>
        <td>
          <div class="p-lr-10">{{{gooddm.producer}}}</div>
        </td>
        <td>{{gooddm.importedFlag==1?'国产':gooddm.importedFlag==0?'进口':''}}</td>
        <td>{{{gooddm.minUnitStyle}}}</td>
      </tr>
      <tr v-if="goodsDMList.length==0">
        <td colspan="99">暂无数据！</td>
      </tr> 
    </tbody>
  </table>

  <div class="pagination page-line m-20-0" v-if="goodsDMList.length!=0">
    <em>为您智能匹配出共有
      <i>{{totalCount}}</i>个选项</em>
      <ul>
        <li>
          <span @click="truePage(-1)">上一页</span>
        </li>
        <li>
          <span @click="truePage(1)">下一页</span>
        </li>
      </ul>
    <em class="page">第{{searchDM.from/10+1}}页</em>
    <em>共{{pageCount}}页</em>
  </div>

  </div>
  <!--supply-productview end-->

</div>
</template>
<script>
module.exports={
  data: function(){
    return {    
      guid:'',
      // resultGUID:'',
      list:{},
      result:{},
      searchDM:{
        "from":0
      },
      goodsDMList:{},
      totalCount:0,
      pageCount:0,
      resultFlag:false,
      mateguid:''

    }; 
  },
  methods: {
    getData: function(){
      var self = this;
      Ajax.get('/mainDataCheck/findProposeDetial',{guid:self.guid}).
          then(function(response){

            var res=response.data.data;
            if(response.data.errorCode==0){
            //   var path;
            // for(var a=0;a<res.length;a++){
            //     var pictcontent=JSON.parse(res[a].pictcontent);
            //     path=pictcontent[0].thumbnail.path+pictcontent[0].thumbnail.name;
            //     res[a].path=path;
            //   }
            
                self.list=res;
                var list=self.list;
                var searchDM= self.searchDM;
                searchDM.goodsName=list.goodsname;
                searchDM.goodsSpec=list.goodsspec;
                searchDM.producer=list.producer;
                searchDM.registKey=list.registkey;
                searchDM.bigUintStyle=list.biguintstyle;
                searchDM.bigUintQty=list.biguintqty;
                searchDM.minUnitStyle=list.minunitstyle;
                searchDM.minUnitQty=list.minunitqty;
            }
        })
        self.detial();    
    },
    detial: function(){
      var self=this;

      Ajax.get('/mainDataCheck/findMfmnsdGoods',{guid:self.guid}).
          then(function(response){
            var res=response.data.data;
            if(response.data.errorCode==0){
            // var path;
            // for(var a=0;a<res.length;a++){
            //     var pictcontent=JSON.parse(res[a].pictcontent)
            //     path=pictcontent[0].thumbnail.path+pictcontent[0].thumbnail.name;
            //     res[a].path=path;
            // }
                self.result=res;
                self.parisons();
            }            
        }) 
    },
    // 对码
    parisons:function(){
        var self=this;

          Ajax.post('/mainDataCheck/goodsDM',self.searchDM)
            .then(function(response){
              var data = response.data;
              self.$set('goodsDMList', data.data);
              self.totalCount=data.totalCount; 
              self.pageCount = Math.ceil(data.totalCount/10);         
          });
      },
    truePage:function(num){
         var self = this;
         var currentFrom=self.searchDM.from;
         if(num==1){
            if(currentFrom+10>self.totalCount){
                layer.msg('已到最后一页！');
                return;
            }
            self.searchDM.from=currentFrom+10;
         }else{
            if(currentFrom-10<0){
                layer.msg('已到第一页！');
                return;
            }
            self.searchDM.from=currentFrom-10;
         }
         self.parisons();
      },
      // 配对
    mate:function(index){
      var self=this;
        // 存在匹配数据
      self.mateguid=self.goodsDMList[index].guid;

      if(!self.result){
        self.resultFlag=true;
        self.result=self.goodsDMList[index];

      }// 没有匹配数据
      else{
        layer.msg('已存在对码结果');
      }

    },
     // 取消对码结果
    cancel:function(){
      var self=this;

      self.result=null;
      self.resultFlag=false;
    },
    save:function(){
      var self=this;
      self.list.productguid=self.mateguid;
      self.MessageBox({
          title:'提示',
          message:'是否确定保存?不可重复保存',
          type:'alert',
          showCancelButton: true
          },function(action){
           //alert(action)
           if(action=="confirm"){
             Ajax.post('/mainDataCheck/addToMainData',self.list)
              .then(function(response){

                var result = response.data;
                if(result.errorCode==0){
                    layer.msg('保存成功');
                   self.$route.router.go('/dataadminGoodsAuditor');
                }else{
                  layer.msg(result.message);
                }
                
              });
            }
          
          })
       
    }

   },
  route:{
    data: function (transition) {
      var self=this;
      var guid = transition.to.params.guid;
      // var resultGUID = transition.to.params.resultGUID;


      self.guid=guid;
      // self.resultGUID=resultGUID;
      self.getData();
      },
  }
};
</script>