<style scoped>
	.pic-list p{
		margin:0;
		padding: 0;
		font-size: 14px;
		text-align: left;
		text-indent: 1em;
		width: 260px;
		word-wrap: break-word;
		word-break: normal;
	}
	.pic-list p em{
		font-size: 22px;
		font-weight: bold;
		font-style: normal;
	}
	.pro-pics-tit {
	    padding-bottom: 10px;
	}
	.product-pics {
		width:400px;
		padding-top:10px;
		height: 210px;
	}
	.pro-pics .pic-list{
		width: 370px;
		height: 160px;
	}
	.pic-container{
		height: 160px;
	}
	.ctable .ct-row .row-line>.ct-col{
		line-height: 15px;
		word-wrap: break-word;
		word-break: normal;
		white-space: normal;
	}
	.close-left-menu .pro-pics .pic-list>li{
		width: 80px;
    	height: 70px;
    	margin-right: 0px;
    	padding: 0;
	}
</style>
<template>
	<div>
		<div class="container resource close-left-menu clearfix" style="min-height: 600px;">
			<div class="pop-banner clearfix">
				<div class="operate-btns">
					<a class="fbtn fb-return"  href="javascript:history.go(-1)">返回</a>
				</div>
				<h3 class="current-module">出库单详情</h3>
			</div>
			<!--suppliername start 分配供应商-->
			<div class="fl" style='width:550px;padding-right:20px;border-right:1px solid  #e8ebef;'>
				<div class="purchase-add-plan">
					<div class="supplylist clearfix supply-select">
						<div class="supplylist-table ml-0">
							<div class="min-search min-search-green " style="display: inline-block;border-right:0px; margin: 10px 0px;">
								<input class="min-search-txt" v-model="search.name" style="border-right:0px;width:300px;" 
								placeholder="商品搜索">
								<button class="min-search-btn" v-on:click="getData(true)" style="margin-left:0px;"></button>
							</div>
							<div id="leftCtable" class="ctable ct-parentr" style='border-bottom:1px solid  #e8ebef;'>
								<div class="ct-head">
									<span class="ct-col w60">序号</span>
									<span class="ct-col w150">商品	</span>
									<span class="ct-col w150">出库情况</span>
									<span class="ct-col w70">审核人</span>
									<span class="ct-col w70">审核状态</span>
								</div>
								<div class="ct-row" v-if="list.length==null || list.length==0">
									<div class="row-line">
										<span class="ct-col" style="width: 100%;">    暂无数据    </span>
									</div>
								</div>
								<div class="ct-row" id="div1{{$index}}" v-for="item in list">
									<div class="row-line" @click='invoice(item.supplierdobillno,item.supplierdorowno,item.guid,item.checkstate,item.rowno)'>
										<span class="ct-col w60"> {{$index + 1}}       </span>
										<span class="ct-col w150 pr10 t-left">
											{{item.goodscode}}
											<br>
											<span class="p-tit-green">{{item.goodsname}}</span>
											<br>
											{{item.goodsspec}}
											<br>
											{{item.manufacturer}} 
											<br>
											{{item.registkey}}
										</span>
										<span class="ct-col w150 t-left">{{item.qty}}{{item.unit}} * {{item.price}}元 
											<br> {{item.amount | numDigit 2}}元
										</span>
										<span class="ct-col w70">{{item.operatername}}
										</span>
										<span class="ct-col w70" :class='{"text-color-red":item.checkstate==2}'>{{item.checkstate | Gcheckstate}}
										</span>
										
									</div>
								</div>
							</div>

						</div>
						<pagination 
					   @page-change="getData" 
					   :class="['m-20-0']"
					   :page-no.sync="search.page" 
					   :total-pages.sync="search.totalPages"></pagination>
					</div>
				</div>
			</div>
			<div class="fr">
				<div class="product-pics clearfix mt-10" v-for='item in manList'>
				    <div class="pro-pics-tit clearfix">
				      <h3 style='font-size:16px;color:#4AA8E5;padding-left:18px;'>厂家发票</h3>
				      <div class="pro-ctrl">
				      </div>
				    </div>
				    <div class="pro-pics" style='padding:0;margin:0;min-height: 120px;'>
			      	   <div class="pic-container">
				        <ul class="pic-list clearfix">
				          <li class="has-image">
				            <div class="pic-contain" :style="'background:url( '+item.path+') no-repeat;width:70px;height:60px;background-size:contain;'">
				            </div>
				          </li>
				          <div style='width:260px;height:120px;' class="fl">
				          	<p><em>{{item.supdobillno}}</em></p>
				          	<!-- <p><em>{{item.invoicenum}}</em> 元</p> -->
				          	<p><em>{{item.invoicenum}}</em> {{item.unit}}</p>
				          	<p>开票时间  {{item.invoicedate | getYMD}}</p>
				          </div>
				          <div class="fl" style='margin-left:110px;'>
				          	<a class="btn-d btn-d-activate fl" href="javascript:void(0);" style='margin-top:1px;'>
				          		<imagebox v-bind:imgarr="[{img:item.original}]"> 检验发票</imagebox>
				          	</a>
				          	<a class="btn-d btn-d-activate" href="javascript:void(0);">查看资质</a>
				          </div>
				          
				        </ul>
				      </div>
				    </div>
				  </div>
				<div class="product-pics clearfix mt-10" v-for='item in terList'>
				    <div class="pro-pics-tit clearfix">
				      <h3 style='font-size:16px;color:#4AA8E5;padding-left:18px;'>终端发票</h3>
				      <div class="pro-ctrl">
				      </div>
				    </div>
				    
				    <div class="pro-pics" style='padding:0;margin:0;min-height: 120px;'>
			      	   <div class="pic-container">
				        <ul class="pic-list clearfix">
				          <li class="has-image">
				            <div class="pic-contain" :style="'background:url( '+item.path+') no-repeat;width:70px;height:60px;background-size:contain;'">
				            </div>
				          </li>
				          <div style='width:260px;height:120px;' class="fl">
				          	<p><em>{{item.supdobillno}}</em></p>
				          	<!-- <p><em>223</em> 元</p> -->
				          	<p><em>{{item.invoicemoney | numDigit 2}}</em> 元</p>
				          	<p>开票时间  {{item.invoicedate | getYMD}}</p>
				          </div>
				          <div class="fl" style='margin-left:110px;'>
				          	 
				          	<a class="btn-d btn-d-activate fl" href="javascript:void(0);" style='margin-top:2px;'>
				          		<imagebox v-bind:imgarr="[{img:item.original}]"> 检验发票</imagebox>
				          	</a>
				          	 
				          	<a class="btn-d btn-d-activate" href="javascript:void(0);">查看资质</a>
				          </div>
				          
				        </ul>
				      </div>
				    </div>
				  </div>
				  <div class="fl" style='width:400px;padding-left: 130px;padding-top: 30px;' 
				   v-if='falg'>
				  	<a class="btn-d btn-d-activate" href="javascript:void(0);" @click='audit'>审核通过</a>
				  	<a class="btn-d btn-d-red" href="javascript:void(0);" v-link='{path:"/registerError/"+supguid+"/"+rowno+"/"+supplierdorowno+"/"+supplierdobillno}'>登记异常</a>
				  </div> 
			</div>
		</div> 
		<div class="roll-bg" v-show='requestS'>
	        <div class="w60" style="margin:0 auto;">
	          <img src="/images/roll.gif">
	        </div>
	        <div class="container resource t-center text-color-red">
	          正在处理中，请勿关闭！
	        </div>
	     </div>
	</div>
</template>
<style type="text/css">
	.filed1::-ms-input-placeholder {
		text-align: right;
	}
	
	.filed1::-webkit-input-placeholder {
		text-align: right;
	}
</style>
<script>
	module.exports = {
		data: function() {
			return {
				falg:false,
				manList:[],
				terList:[],
				list:[],
				// 分页
				search: {
					pageSize: 20,
		          	page: 1,
		          	totalPages: 0,
		          	guid:'',
		          	name:'',
		          	rowno:''
				},
				// 医院分页
				hosSearch: {
					pageSize: 50,
					page: 1,
					totalPages: 0,
					medname: ''
				},
				getHosList: [],
				getSupList: '',
				goodsInfo: '',
				oParamList: [],
				checkArr: [], //复选框数组
				checkArrList: [],
				supCode: [],
				isShowPage: true,
				selectSup: [],
				allSelect: [],
				requestS:false
			};
		},
		methods: {
			// 加载数据
			getData: function(state) {
				if(state){
					this.search.page=1;
				}
				 Ajax.post('/api/getTrGovInvCheckDetail',this.search).then(function(res){
			          var result=res.data;
	
			          if(result.errorCode==0){
			          	
			          	this.$set('list',result.data.list);
			          	this.search.totalPages=result.data.totalPages;

			          }else{
			          	this.MessageBox.alert(result.message);
			          }
			          
			      }.bind(this))		
			},
			invoice:function(supplierdobillno,supplierdorowno,guid,checkstate,rowno){
				if(checkstate==0){
					this.falg=true;
					this.supguid=guid;
					this.rowno=rowno;
					this.search.rowno=rowno;
					this.checkstate=checkstate;
					this.supplierdorowno=supplierdorowno;
					this.supplierdobillno=supplierdobillno;
				}
				// 获取厂商发票
					this.query(supplierdobillno,supplierdorowno,1);
					
				// 获取终端发票
					this.query(supplierdobillno,supplierdorowno,2);

			},
			query:function(billno,rowno,state){
				var obj={};
				obj.supplierdobillno=billno;
				obj.supplierdorowno=rowno;
				obj.invoicestate=state;
				Ajax.post('/api/getTrDoInvoice',obj).then(function(res){
			          var result=res.data;
					  var imgReg = /\.(jpg|jpeg|png|gif|bmp)$/i; //判断字符串是否为图片路径;
			          if(result.errorCode==0){

			    		if(state==1){
			    			for (let a=0;a<result.data.length;a++) {
							   var img=JSON.parse(result.data[a].invoicepic);
							   if(!result.data[a].invoicepic){
					                  continue;
					              }
							   result.data[a].path= imgReg.test(img[0].thumbnail.path) ? img[0].thumbnail.path : img[0].thumbnail.path+img[0].thumbnail.name;
							   result.data[a].original=imgReg.test(img[0].original.path) ? img[0].original.path : img[0].original.path+img[0].original.name;
							   
							}
			    			this.$set('manList',result.data);
			    		}else{
			    			
							for (let a=0;a<result.data.length;a++) {
								 if(!result.data[a].invoicepic){
					                  continue;
					              }
							   var img=JSON.parse(result.data[a].invoicepic);
							   result.data[a].path= imgReg.test(img[0].thumbnail.path) ? img[0].thumbnail.path : img[0].thumbnail.path+img[0].thumbnail.name;
							   result.data[a].original=imgReg.test(img[0].original.path) ? img[0].original.path : img[0].original.path+img[0].original.name;
							}
			    			this.$set('terList',result.data);
			    		
			    		}
			          	

			          }else{
			          	this.MessageBox.alert(result.message);
			          }
			          
			      }.bind(this))	
			},
			audit:function(){
				this.requestS=true;
				 Ajax.post('/api/getTrGovInvCheckPass',this.search)
				 .then(function(res){

				 	 var result=res.data;
	
			          if(result.errorCode==0){
			          	this.MessageBox.alert('审核成功');
			          	this.$router.go({ 'path': '/invoiceQuery' });
			          }else{
			          	this.MessageBox.alert(result.message);
			          }
			          this.requestS=false;
				 }.bind(this))
					
			}
		},
		route: {
			data: function() {
				this.$set('manList',[]);
				this.$set('terList',[]);
				this.falg=false;
				this.search.guid=this.$route.params.guid;
				this.getData(true);
			}
		}

	};
</script>