<template>
	<div class="container resource close-left-menu contaNEW">
      <div class="pop-banner clearfix">
        <div class="operate-btns">   
          <a @click="newCatalogue()" v-link="{ path:'/XNnewCatalogue/'}" class="fbtn fb-add" >新增采购目录</a> 
          <a @click="importCatalog()" v-link="{ path:'/XNprocurementCatalogImport/'}" class="fbtn fb-upload ">导入采购目录</a> 
          <a v-on:click="exportTrmedplan()" class="fbtn fb-download ml-20">导出</a>

        </div>  
        <h3 class="current-module">采购目录清单</h3> 
      </div>
      <!--采购目录 start-->
       <div class="purchase-plan">
        <div class="pd-form fast-search-form">
          <div class="group-row">
            <div class="form-group form-label"> 
              <!-- <label class="label" for="cn1" >商品信息</label> -->
              <div class="control">
                <input type="text" id="cn1" v-model='proList.goodsinfo' title='商品信息' placeholder="商品信息"> </div>
            </div>
            <div class="form-group form-label">
              <!-- <label class="label" for='cn2'>供应商名称</label> -->
              <div class="control">
                <input type="text" id="cn2"  v-model="proList.suppliername" title='供应商名称' placeholder="供应商名称"> </div>
            </div>
          </div> 
          <div class="group-row">
            <div class="form-group w920">
              <label class="label w80 fl">业务状态</label>
              <div class="control control-filtering control-filtering-green fl w800">
                <a class="option" 
                :class="{'all active':proList.contentstate==''}"
                href="javascript:void(0)" @click="proList.contentstate=''">全部</a> 
                <a class="option" 
                :class="{'all active':proList.contentstate=='P2'}"
                href="javascript:void(0)" @click="proList.contentstate='P2'">已发布</a>
                <a class="option" 
                :class="{'all active':proList.contentstate=='P5'}"
                href="javascript:void(0)" @click="proList.contentstate='P5'">已勾对</a>
                <a class="option" 
                :class="{'all active':proList.contentstate=='P6'}"
                href="javascript:void(0)" @click="proList.contentstate='P6'">已审批</a> 
                <a class="option" 
                :class="{'all active':proList.contentstate=='P7'}"
                href="javascript:void(0)" @click="proList.contentstate='P7'">供应商放弃供应</a> 
<!--                 <a class="option" 
                :class="{'all active':proList.contentstate=='P8'}"
                href="javascript:void(0)" @click="proList.contentstate='P8'">驳回</a>  -->
                <a class="option" 
                :class="{'all active':proList.contentstate=='P9'}"
                href="javascript:void(0)" @click="proList.contentstate='P9'">已废弃</a> 
              </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>

        <table class="itable  itable-thead-13px ">
          <thead id="t_header">
            <tr>
              <th class="w50">序号</th>
              <th class="w50"></th>
              <th class="w150">商品</th>
              <th class="w90">单位转换系数</th>
              <th class="w100">采购价</th>
              <th class="w100">供应商</th>
              <th class="w100">优先级</th>
              <th class="w100">结算方式</th>
              <th class="w80">状态</th>
              <th class="w110">操作</th>
            </tr>
          </thead>
          <tbody v-if="getMedcontentList.length==0">
             <tr><td colspan="11">暂无数据！</td></tr>
          </tbody>
          <tbody v-for="pro in getMedcontentList"> 
            <tr>
              <td>{{$index + 1}}</td>
              <td> <span class="table-detail-icon icon-green">医</span></td>
              <td class="t-left pr10">
              {{pro.medgoodscode}}<br>
                  <span class="p-tit-green">{{pro.medgoodsname}}</span><br>
              {{pro.medgoodsspec}}<br>
              {{pro.medproducer}}<br>
              {{pro.medregistkey}}
              </td>
              <!-- <td class="t-left pr10">
                {{pro.supgoodscode}}<br>
                {{pro.supgoodsname}}<br>
                {{pro.supgoodsspec}}<br>
                {{pro.supproducer}}<br>
                {{pro.supregistkey}}
              </td> -->
   <!--            <td>
                <span class="ct-col w30">
                 
                  <span class="table-detail-icon icon-green mt-10">供</span>
                </span>
                </td> -->
              <td class="pr10"> 
                    {{pro.purconverratio}}{{pro.medunistyle}}
                    <!-- <br> -->
                  <!-- {{pro.supconverratio}}{{pro.supunitstyle}} -->
              </td>

              <td class="pr10">
                 <span class="table-detail-text" v-show="!sh[$index]">  
                    <input type="text" :value='pro.price | numDigit 2 | numFmt' style='width:80px;' class="t-right" readonly="readonly">元
                 </span>
                 <span  class="table-detail-text" v-show="sh[$index]">  
                    <input type="text" v-model='pro.price | numDigit 2 | numFmt' style='width:80px;' class="t-right">元
                 </span>
              </td>
              <td class="t-left pr10 pl10">{{pro.suppliername }}</td>
              <td v-if='pro.contentstate=="P6"'>{{pro.priority}}</td>
              <td v-else>无</td>
              <td>{{pro.settlemethod | method}}</td>
              <td>{{pro.contentstate | xncontent_state }}</td>
              <td >
                  <div class="from-button" v-if="pro.contentstate =='P6'">
                     <a href="javascript:;" class="green-button p-lr-10" v-if="!sh[$index]" @click='updateList($index)'>修改<i>|</i></a>
                     <a href="javascript:;" class="green-button p-lr-10" v-if="sh[$index]" @click='saveList($index,pro.guid,pro.rowno,pro.price,pro.suppliername,pro.supgoodsname,pro.contentstate,pro.supplierguid,pro.medgoodsguid)'>保存<i>|</i></a>
                     <a href="javascript:;" class="red-button p-lr-10" v-if="pro.contentstate =='P7' || pro.contentstate =='P6'" @click='delList($index,pro.guid,pro.rowno,pro.suppliername,pro.supgoodsname,pro.contentstate,pro.supplierguid,pro.supexcguid)' >废弃</a>
                     <a href="javascript:;" class="red-button p-lr-10 text-color-custom readonly-gray" v-else>废弃</a>
                  </div> 
                  <div v-else class="table-detail-text"> 
                      <div class="from-button" >
                         <a href="javascript:;" class="green-button p-lr-10 text-color-custom readonly-gray">修改<i>|</i></a> 
                         <a href="javascript:;" class="red-button p-lr-10" v-if="pro.contentstate =='P7' || pro.contentstate =='P6'">废弃</a>
                         <a href="javascript:;" class="red-button p-lr-10 text-color-custom readonly-gray" v-else>废弃</a>
                      </div>  
                  </div> 
              </td>
            </tr> 
            <tr v-show='pro.contentstate!="P2" && pro.contentstate!="P9"'>
              <td></td>
              <td>
                 <span class="table-detail-icon icon-green mt-10">供</span>
              </td>
              <td class="t-left pr10">
                {{pro.supgoodscode}}<br>
                {{pro.supgoodsname}}<br>
                {{pro.supgoodsspec}}<br>
                {{pro.supproducer}}<br>
                {{pro.supregistkey}}
              </td>
               <td class="pr10"> 
                    <!-- {{pro.purconverratio}}{{pro.medunistyle}}<br> -->
                  {{pro.supconverratio}}{{pro.supunitstyle}}
              </td>
              <td></td>
              <td></td>
              <td></td>
              <td></td>
              <td></td>
              <td></td>
            </tr>       
          </tbody>
        </table>       
          <div class="pagination m-20-0">
              <em class="page">明细条目数【{{ search.total }}】</em>
              <pagination
                @page-change="getData()"
                :class="['m-20-0']"
                :page-no.sync="search.page"
                :total-pages.sync="search.totalPages">
              </pagination>
            </div>  
      </div>
      <!--采购目录 end-->
    </div>
</template>
<script>
module.exports={
data:function(){
return{ 
     sh:[],
     getMedcontentList:[], 
      proList:{
        goodsinfo:'',
        suppliername:'',
        contentstate:'',
       },
      search:{
        pageSize:50,
        page:1,
        totalPages:0, 
        total:0, 
        }, 
	};
},
  
 methods:{ 
      //加载数据      
	getData:function(){
      	 var self = this; 
      	 Ajax.post('/procurment/xngetMedcontentList',{'page':self.search.page,'pageSize':self.search.pageSize,'totalPages':self.search.totalPages,'goodsinfo':self.proList.goodsinfo,'suppliername':self.proList.suppliername,'contentstate':self.proList.contentstate})
      		.then(function(response){   
      		var data=response.data.data;
      		self.$set("getMedcontentList",data.list);		
      		self.search.totalPages=data.totalPages;	
                  self.search.total=data.total;   
                  for (var i = 0; i<self.getMedcontentList.length;i++) {
                  self.sh.push(false);
              } 				
      	 })
       },
       //修改价格
       updateList:function(index){
             var self = this;  
             self.sh.splice(index,1,true); 
       }, 
       //保存价格
       saveList:function(index,guid,rowno,price,suppliername,supgoodsname,contentstate,supplierguid,medgoodsguid){
             var self=this;    
             self.MessageBox({
             title: '提示',
             message: '修改后的价格将以消息形式发送给【'+suppliername+'】,确认修改？',
             type: 'success',
             showCancelButton: true
             },function(action) {
             if(action=='confirm'){ 
              Ajax.post('/procurment/xnupdatePrice',{'detailguid':guid,'rowno':rowno,'price':price,'supgoodsname':supgoodsname,'contentstate':contentstate,'supplierguid':supplierguid,'medgoodsguid':medgoodsguid})
              .then(function(response){
              var data=response.data; 
              if(data.data==1){

                layer.msg('保存成功！');
                self.sh.splice(index,1,false); 
                self.getData(); 
              }else{
                layer.msg(data.message);
                self.sh.splice(index,1,false); 
              }
              })  
            } 
          });  
      },

      //废弃
       delList:function(index,guid,rowno,suppliername,supgoodsname,contentstate,supplierguid,supexcguid){
             var self=this;    
             self.MessageBox({
             title: '提示',
             message: '废弃此供应品种关系后将以消息形式发送给【'+suppliername+'】,确认废弃？',
             type: 'success',
             showCancelButton: true
             },function(action) {
             if(action=='confirm'){ 
              Ajax.post('/procurment/abandonContent',{'detailguid':guid,'rowno':rowno,'supgoodsname':supgoodsname,'contentstate':contentstate,'supplierguid':supplierguid,'supexcguid':supexcguid})
              .then(function(response){
              var data=response.data; 
              if(data.data==1){
                layer.msg('废弃成功！');
                self.sh.splice(index,1,false); 
                self.getData(); 
              }else{
                layer.msg(data.message);
                self.sh.splice(index,1,false); 
              }
              })  
            } 
          });  
      },
      	// 导出采购清单
			exportTrmedplan: function() {
				var self = this;
				Ajax.post('/procurment/xnexportMedcontentList', {
						'page': self.search.page,
						'pageSize': self.search.pageSize,
						'totalPages': self.search.totalPages,
						'goodsinfo': self.proList.goodsinfo,
						'suppliername': self.proList.suppliername,
						'contentstate': self.proList.contentstate,
						'medguid': self.proList.operatorguid
					})
					.then(function(response) {
						var data = response.data;
						window.open(data);
					})
			},
 
   },
	
    route:{
        activate : function(){ 
          this.getData();
        }
      },
    watch:{
      'proList.contentstate':function(){
        this.getData();
      }
    }

};
</script>