<template>
	<view>
	<u-navbar back-text="返回" title="出库确认" :background="background"></u-navbar>
	<u-form ref="testForm">
		<u-form-item :border-bottom="false">
			<p>单号:</p>
			<u-select v-model="dlistShow" mode="single-column" value-name="id" :list="dlist" @confirm="selErpAllVoice" confirm-text="确认选择" />
			<u-input :focus="focusReceiveRequest" :border="true" v-model="ReceiveRequestName" 
			placeholder="请扫描单号" @confirm="serachMaterialList" />
		</u-form-item>
		<u-form-item :border-bottom="false">
			<p>扫码:</p>
			<u-input :border="true" v-model="barCode" placeholder="请扫描货物标签" :focus="focusBarCode"
				@confirm="confirmBarcode" />
		</u-form-item>
		<u-form-item :border-bottom="false">
			<!--<p>绑定 IFID:</p>
			<u-input :border="true" v-model="barCode" placeholder="请扫描IFID编码" :focus="focusBarCode"
				@confirm="confirmBarcode" />-->
		</u-form-item>
	</u-form>
			<uni-table ref="ConfirmTable"   border stripe type="false" height="650" style="width: 100%">
					<uni-tr>
						<uni-th align="center">S/N</uni-th>
						<uni-th align="center">批次</uni-th>
						<uni-th align="center">料号</uni-th>
						<uni-th align="center">物料名称</uni-th>
						<uni-th align="center">库位</uni-th>
						<uni-th align="center">货架</uni-th>
						<uni-th align="center">批次</uni-th>
						<uni-th align="center">数量</uni-th>
						<uni-th align="center">校验标识</uni-th>
					</uni-tr>
					<uni-tr v-for="(item, index) in ReserveTableList" :key="index" :style="{ backgroundColor: item.ISCHECK != '' ? 'yellowgreen' : 'white' }"><!-- :style="getStyle(index)"--><!--:style="{ backgroundColor: item.color === 0 ? 'white' : 'blue' }" -->
						<uni-td align="center">{{ item.MATERIALPACKINGNAME}}</uni-td>
						<uni-td align="center">{{ item.SUPERMATERIALPACKINGNAME}}</uni-td>
						<uni-td align="center">{{ item.MATERIALSPECNAME}}</uni-td>
						<uni-td align="center">{{ item.DESCRIPTION}}</uni-td>
						<uni-td align="center">{{ item.ERPLOCATION }}</uni-td>
						<uni-td align="center">{{ item.LOCATIONNAME }}</uni-td>
						<uni-td align="center">{{ item.CHARGE }}</uni-td>
						<uni-td align="center">{{ item.MATERIALQUANTITY }}</uni-td>
						<uni-td align="center">{{ item.ISCHECK }}</uni-td>
					</uni-tr>
				</uni-table>	
			
	<u-form>
		<u-form-item>
			<u-button @click="ConfirmButton" type="primary" size = "mini" style = "background-color: green;width: 90%;">出库确认</u-button>
			<!--<u-button @click="CancelConfirmButton" type="primary" size = "mini" style = "background-color: yellowithe;width: 30%;">出库取消</u-button>-->
		</u-form-item>
	</u-form>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				dlist: [], //选择内容
				dlistShow: false, //是否显示选择框				
				ReserveTableList:[],
				ReceiveRequestName : "",
				barCode : "",
				background: {
					backgroundImage: 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))'
				},
				focusBarCode: false, //焦点是否被选中
				focusReceiveRequest: true, //默认焦点在单号
			}

		},

		methods: {
			tableRowStyleName({
				row
			}) {
				if (row.ISCHECK == 'Y') {
					return 'background-color: yellowgreen;';
				}
			},
			selErpAllVoice(e) {
				this.ReceiveRequestName = e[0].value;
				this.serachMaterialList();
			},
			selectErpAllVoice() {
				this.dlist = []; 
				this.$MyRequest('/allocation/getErpAllocationList', {
					ReceiveRequestName: this.ReceiveRequestName
				}).then(res => {
					console.log("************************************")
					console.log(res.data)
					if (res.data.success) {
						console.log("************************************")
						console.log(res.data.resultObj.length)
						for (var i = 0; i <= res.data.resultObj.length; i++) {
							console.log(res.data.resultObj[i].RECEIVEREQUESTNAME)
						this.dlist.push({
							id: res.data.resultObj[i].RECEIVEREQUESTNAME,
							label: res.data.resultObj[i].RECEIVEREQUESTNAME
						});
									console.log(this.dlist);
									this.dlistShow = true;
					}
					
					}
						
				}).catch(err => {
					this.$showMessage(err)
				})
			},
			serachMaterialList () {
				this.$MyRequest('/allocation/getErpAllocationDetail', {
					ReceiveRequestName: this.ReceiveRequestName
				}).then(res => {
					if (res.data.success) {
						console.log(res.data)
						this.ReserveTableList = res.data.resultObj //接数据
					}
						this.focusBarCode = true
						this.focusReceiveRequest = false
				}).catch(err => {
					this.$showMessage(err)
				})
			},
			confirmBarcode () {
				let list = this.ReserveTableList;
				for (var i = 0; i < list.length; ++ i) {
					var LbarCode = this.barCode;
					if (this.ReserveTableList[i]['MATERIALPACKINGNAME'] === LbarCode || this.ReserveTableList[i]['SUPERMATERIALPACKINGNAME'] === LbarCode) {
						this.ReserveTableList[i]['ISCHECK'] = "Y"
						this.barCode = ""
					}
					this.focusBarCode = true
				}
				
				
			},
			ConfirmButton () {
				let list = this.ReserveTableList;
				if (list <= 0 ) {
					this.$showMessage("不存在需要提交的信息") 
					return;
				}
				for (var i = 0; i < list.length; ++ i) {
					var judge = this.ReserveTableList[i]['ISCHECK']
					if (judge != "Y") {
						this.$showMessage("存在未审核确认的信息") 
						return;
					}
				}
				this.$MyRequest('/allocation/ConfirmErpAllocationDetail', {
					ReceiveRequestName: this.ReceiveRequestName
				}).then(res=>{
					     this.$showMessage(res.data.message) //执行出库后返回的消息
					    this.ReserveTableList = null; //清空条码，继续扫
					     this.focusReceiveRequest = true//获取焦点，好继续扫描
					}).catch(err=>{
						this.ReserveTableList = null;//请空条码
						this.focusReceiveRequest = true
						this.$showMessage(err)
						})
			},
			CancelConfirmButton () {
				this.$MyRequest('/allocation/CancelConfirmErpAllocationDetail', {
					ReceiveRequestName: this.ReceiveRequestName
				}).then(res=>{
					     this.$showMessage(res.data.message) //执行出库后返回的消息
					     this.ReserveTableList = null; //清空条码，继续扫
					     this.focusReceiveRequest = true//获取焦点，好继续扫描
					}).catch(err=>{
						this.ReserveTableList = null;//请空条码
						this.focusReceiveRequest = true
						this.$showMessage(err)
						})
			}
			

		}
	}
</script>
<!-- <style>
	@import url("//unpkg.com/element-ui@2.15.13/lib/theme-chalk/index.css");
</style> -->

