<!-- 发料任务详情 -->
<template>
	<page-meta root-font-size="16px"></page-meta>
	<view class="">
		<view class="top_card">
			<com-job-scan-detail :jobContent="datacontent" :allCount="allCount" :scanCount="scanCount">
			</com-job-scan-detail>
		</view>
		<scroll-view :scroll-top="scrollTop" scroll-y="true" @scrolltoupper="upper" @scrolltolower="lower"
			@scroll="scroll" class="scroll-detail">

			<view class="detail-list margin_top" v-for="(item, index) in details" :key="item.id">
				<view class="detail-content">
					<view class="choose_main">
						<view class="ljh_box">
							<view class="tit_ljh">{{ item.itemCode }}</view>
							<view class="ljh_left desc_ljh">
								<view class="font_xs text_lightblue">{{ item.itemName }}</view>
								<view class="font_xs text_lightblue">{{ item.itemDesc1 }}</view>
							</view>
						</view>
						<view class="list_form">
							<view class="uni-container">
								<uni-table style="overflow-x: hidden;">
									<uni-tr>
										<!-- <uni-th width="90"></uni-th>
										<uni-th width="100" align="center">推荐</uni-th>
										<uni-th width="100" align="center">实际</uni-th> -->
										<uni-th width="50"></uni-th>
										<uni-th width="120" align="center">推荐</uni-th>
										<uni-th width="120" align="center">实际</uni-th>
									</uni-tr>
									<uni-tr>
										<uni-th width="50">数量</text></uni-th>
										<uni-th width="120" align="center">
											<text class="text_black">{{item.recommendQty}}({{item.uom}})</text>
										</uni-th>
										<uni-th width="120" align="center">
											<view v-if="item.scaned"
												style="display: flex;flex-direction: row;justify-content:center;align-items: center;">

												<com-number-box :ref="'comNumberBox_'+index" v-model="item.handledQty"
													:max="99999" :min="0" style='width: 100px;'
													@change="qtyChanged($event,item,index)">
												</com-number-box>
												<text class="text_black">({{item.uom}})</text>
											</view>
										</uni-th>
									</uni-tr>
									<uni-tr>
										<uni-th width="50">箱码</uni-th>
										<uni-th width="120" align="center">
											<view class="text_packingCode">
												{{ item.recommendPackingCode }}
											</view>
										</uni-th>
										<uni-th width="120" align="center">
											<view v-if="item.scaned" class="text_packingCode">
												{{ item.handledPackingCode }}
											</view>
										</uni-th>
									</uni-tr>
									<uni-tr>
										<uni-th width="50">批次</uni-th>
										<uni-th width="120" align="center">
											<view class="text_black">{{item.recommendLot }}</view>
										</uni-th>
										<uni-th width="120" align="center">
											<view v-if="item.scaned" class="text_black">{{item.handledLot }}</view>
										</uni-th>
									</uni-tr>
									<uni-tr>
										<uni-th width="60">库位</uni-th>
										<uni-th width="100" align="center">
											<view class="text_black">{{ item.recommendFromLocationCode }}</view>
										</uni-th>
										<uni-th width="100" align="center">
											<view class="text_black" v-if="item.scaned">
												{{ item.handledFromLocationCode }}
											</view>
										</uni-th>
									</uni-tr>
								</uni-table>
							</view>
						</view>
					</view>
					<view class="choose_marked" v-if="item.scaned">
						<image src="@/static/image_marked.svg"></image>
					</view>
				</view>
			</view>
		</scroll-view>
		<view class="uni-flex uni-row new_btn_bot">
			<button class="new_clear_btn btn_double" @click="clear()">清空</button>
			<button class="new_save_btn btn_double" @click="submit()">提交</button>
		</view>
		<com-balance ref='issueitems' @selectedItem='selectedBalanceItem'></com-balance>
		<win-scan-button @goScan='openScanPopup'></win-scan-button>
		<win-scan-by-pack ref="scanPopup" @getScanResult='getScanResult'></win-scan-by-pack>

		<com-balance ref="balanceItems" @selectedItem='selectedBalanceItem'></com-balance>
		<com-message ref="comMessage" @afterCloseCommitMessage='closeCommitMessage()'
			@afterCloseScanMessage='closeScanMessage'></com-message>
	</view>
</template>

<script>
	import {
		getIssueDetail,
		takeIssueJob,
		cancelTakeIssueJob,
		finshIssueJob,
		issueBalances
	} from '@/api/index.js';
	import {
		getJobStatuStyle,
		getJobStatuDesc,
		showConfirmMsg,
		goHome,
		compareDesc,
		compareStr
	} from '@/common/basic.js';
	import comMessage from '@/mycomponents/common/comMessage.vue'
	import winScanButton from '@/mycomponents/wincom/winScanButton.vue'
	import winMulitScan from '@/mycomponents/wincom/winMulitScan.vue'
	import comBalance from '@/mycomponents/common/comBalance.vue'
	import comJobScanDetail from '@/mycomponents/comjob/comJobScanDetail.vue'
	import winScanByPack from '@/mycomponents/wincom/winScanByPack.vue'
	import comNumberBox from '@/mycomponents/common/comNumberBox.vue';

	export default {
		components: {
			comMessage,
			winScanButton,
			winMulitScan,
			comBalance,
			comJobScanDetail,
			winScanByPack,
			comNumberBox
		},
		data() {
			return {
				id: "",
				datacontent: {},
				details: {},
				toLocation: '',
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				ispending: false,
				balancesItem: null,
				currentItem: null,
				received: false,
				currentScanLebel: null,
				allCount: 0,
				scanCount: 0,
				byFIFO: false,
				isPack: true,
				titleArray: ['箱标签'],
			}
		},
		filters: {
			statusStyle: function(val) {
				return getJobStatuStyle(val);
			},
			statusColor: function(val) {
				return getJobStatuDesc(val);
			}
		},
		props: {
			itemCode: "",
		},
		onLoad(param) {
			this.id = param.id;
			this.byFIFO = param.isByFIFO === 'true' ? true : false;
			if (param.jobStatus == 1) {
				this.receive((callback => {
					this.received = true;
					this.getDetail();
				}));
			} else {
				this.getDetail();
			}
		},
		onReady() {
			// if (this.byFIFO) {
			// 	uni.setNavigationBarTitle({
			// 		title: '发料任务详情'
			// 	})
			// } else {
			// 	uni.setNavigationBarTitle({
			// 		title: '非FIFO发料任务详情'
			// 	})
			// }
		},
		//返回首页
		onNavigationBarButtonTap(e) {
			if (e.index === 0) {
				goHome();
			}else if(e.index === 1){
				window.location.reload();
			}
		},
		//拦截返回按钮事件
		onBackPress(e) {
			if (this.received) {
				//取消承接任务	
				cancelTakeIssueJob(this.id)
					.then(res => {})
					.catch(err => {
						this.showMessage(err.message);
					});
			}
		},
		mounted() {
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: "#5A7CF3 !important"
			})
		},
		methods: {
			openScanPopup() {
				// if (this.allCount === this.scanCount) {
				// 	this.showMessage("零件已经全部扫描完成");
				// 	return;
				// }
				this.$refs.scanPopup.openScanPopup();
			},
			//加载零件信息
			getDetail() {
				let that = this;
				if (that.id == undefined) {
					return;
				}
				uni.showLoading({
					title: '加载中...',
					mask: true
				})
				let params = {
					id: that.id,
				};
				getIssueDetail(params)
					.then(item => {
						console.log('item', item);
						that.datacontent = item;
						that.details = item.details;
						if (that.details != null) {
							that.details.forEach(
								r => {
									r.scaned = false;
									r.scanDate = new Date()
								}
							);
							that.ispending = item.jobStatus === 2;
							// if (that.toLocation === '') {
							// 	that.toLocation = item.details[0].requestLocationCode;
							// }
							this.allCount = that.details.length;
							this.scanCount = 0;

						}
						uni.hideLoading();
					})
					.catch(err => {
						this.showMessage('未查找到详细信息')

						uni.hideLoading();
					});
			},

			getScanResult(result) {
				//零件是否已经被扫描过
				let item = this.details.find(r => r.recommendPackingCode === result.data.packingCode && r
					.scanPackingCode != result.data.packingCode);
				if (item != undefined && item.scaned) {
					showConfirmMsg('扫描的箱码【' + result.data.packingCode + '】匹配到任务中的【' + item.scanPackingCode +
						'】箱,是否要重新匹配任务中的【' + item.scanPackingCode + '】箱?',
						confirm => {
							if (confirm) {
								this.handledPackCode(result, true);
							} else {
								return;
							}
						})
				} else {
					if (this.allCount === this.scanCount) {
						this.showMessage("零件已经全部扫描完成");
						return;
					}
					this.handledPackCode(result, false);
				}
				this.scrollToTop();
			},

			//处理箱标签
			//scaned是否是重新匹配
			handledPackCode(result, scaned) {
				//获取标签信息
				let that = this;
				that.currentScanLebel = result;
				let scanItem = this.details.find(r => r.scanItemCode === that.currentScanLebel.data.itemCode &&
					r.scanPackingCode === that.currentScanLebel.data.packingCode &&
					r.scanLot === that.currentScanLebel.data.lot &&
					r.scaned == true)
				if (scanItem != undefined) {
					this.showScanMessage('箱码【' + that.currentScanLebel.data.packingCode + '】已经扫描,请扫描下一箱零件');
				} else {
					this.dyIssue(result, scaned);
				}
			},

			dyIssue(result, scaned) {
				let that = this;
				var itemCode = that.details.find(r => {
					return r.itemCode === result.data.itemCode&&
					r.scaned === scaned
				})
				if (itemCode == undefined) {
					that.showScanMessage('所扫描的箱码【' + result.data.code + '】对应的物料【' + result.data.itemCode + '】不在任务中');
				}else {
					//零件号相同、箱码相同
					var itemCode1 = that.details.find(r => {
						return r.itemCode === result.data.itemCode&&
						r.recommendPackingCode === result.data.code
						r.scaned === scaned
					})
					//零件号相同、箱码不相同
					if(itemCode1 == undefined){
						var itemCode2 = that.details.find(r => {
							return r.itemCode === result.data.itemCode&&
							r.recommendLot === result.data.lot 
							&&r.scaned === scaned
						})
						//零件号相同、箱码不相同、批次相同
						if(itemCode2==undefined){
							//零件号相同、箱码不相同、批次不相同
							console.log("零件号相同、箱码不相同、批次不相同")
							setTimeout(res => {
								showConfirmMsg(itemCode.recommendPackingCode+'未执行先进先出或不是最先批次,是否继续?', confirm => {
									if (confirm) {
										that.currentItem = itemCode;
										that.afterScanPackLabel(result);
									} else {
										that.scanPopupGetFocus();
									}
								});
							}, 100)
							
						}else {
							console.log("零件号相同、箱码不相同、批次相同")
							//零件号相同、箱码不相同、批次相同
							that.currentItem = itemCode2;
							that.afterScanPackLabel(result);
						}
						
						
					}else {
						//零件号相同、箱码相同、批次相同
						var itemCode3 = that.details.find(r => {
							return r.itemCode === result.data.itemCode&&
							r.recommendPackingCode === result.data.code&&
							r.recommendLot === result.data.lot 
							&&r.scaned === scaned
						})
						if(itemCode3==undefined){
							//零件号相同、箱码相同、批次不同
							console.log("零件号相同、箱码相同、批次不同")
							setTimeout(res => {
								showConfirmMsg(itemCode1.recommendPackingCode+'未执行先进先出或不是最先批次,是否继续?', confirm => {
									if (confirm) {
										that.currentItem = itemCode1;
										that.afterScanPackLabel(result);
									} else {
										that.scanPopupGetFocus();
									}
								});
							}, 100)
							
						}else {
							console.log("零件号相同、箱码相同、批次相同")
							//零件号相同、箱码相同、批次相同
							that.currentItem = itemCode3;
							that.afterScanPackLabel(result);
						}
					}
				}
				

				// that.currentItem = that.details.find(r => {
				// 	return r.itemCode === result.data.itemCode &&
				// 		r.recommendPackingCode === result.data.code &&
				// 		r.recommendLot === result.data.lot &&
				// 		r.scaned === scaned
				// });
				
				

				// //没找到符合的箱码、零件号、箱码、批次都相等
				// if (that.currentItem === undefined) {
				// 	var itemCode = that.details.find(res => {
				// 		return res.itemCode === result.data.itemCode &&
				// 			res.scaned === scaned
				// 	})
				// 	//零件号相等
				// 	if (itemCode != undefined) {
				// 		var lot = that.details.find(res => {
				// 			return res.itemCode === result.data.itemCode &&
				// 				res.recommendLot === result.data.lot &&
				// 				res.scaned === scaned
				// 		})
				// 		if (lot != undefined) {
				// 			//通过
				// 			that.currentItem = lot;
				// 			that.afterScanPackLabel(result);
				// 		} else {
				// 			//批次不相等
				// 			// 提示未执行先进先出或者不是最先批次。
				// 			setTimeout(res => {
				// 				showConfirmMsg('未执行先进先出或不是最先批次,是否继续?', confirm => {
				// 					if (confirm) {
				// 						that.currentItem = itemCode;
				// 						that.afterScanPackLabel(result);
				// 					} else {
				// 						that.scanPopupGetFocus();
				// 					}
				// 				});
				// 			}, 100)

				// 		}
				// 	} else {
				// 		//零件号不相等
				// 		var lot = that.details.find(res => {
				// 			return res.recommendLot === result.data.lot &&
				// 				res.scaned === scaned
				// 		})
				// 		//批次相等
				// 		if (lot != undefined) {
				// 			// 在该任务中未找到零件。
				// 			that.showScanMessage('在该任务中未找到零件');
				// 		} else {
				// 			//零件号不相等,批次不相等
				// 			that.showScanMessage('所扫描的物料不在任务中');
				// 		}
				// 	}
				// } else {
				// 	that.afterScanPackLabel(result);
				// }
			},

			afterScanPackLabel(result) {
				let that = this;
				that.getBalance(result, res => {
					if (res.totalCount === 1) {
						that.balancesItem = res.items[0];
						if (that.balancesItem != null || that.balancesItem != undefined) {
							that.setBalanceInfo(this.currentItem, that.balancesItem);
							that.scanPopupGetFocus();
						}
					} else {
						this.$refs['issueitems'].openPopup(res.items);
					}
				});
			},

			//查询库存记录
			getBalance(result, callback) {
				uni.showLoading({
					title: '扫描中...',
					mask: true
				})
				let params = {
					pageSize: 1000,
					pageIndex: 1,
					packingCode: result.data.code,
					itemCode: result.data.itemCode,
					lot: result.data.lot,
					inventoryStatus: 2, //库存状态默认2
					locationTypes: [2, 3],
					sortBy: 'PackingCode asc'
				};
				issueBalances(params)
					.then(res => {
						if (res.totalCount === 0) {
							this.showScanMessage('按零件号【' + result.data.itemCode + '】箱码【' + result.data.code + '】批次【' +
								result
								.data.lot + '】在【原料库、半成品库】未查询到库存信息');
						} else {
							callback(res);
						}
						uni.hideLoading();
					})
					.catch(err => {
						this.showScanMessage(err.message);
						uni.hideLoading();
					});
			},

			setBalanceInfo(item, balanceItem) {
				item.scaned = true;
				item.scanDate = new Date() //增加扫描信息属性
				item.fromLocationCode = balanceItem.locationCode;
				item.fromLocationErpCode = balanceItem.locationErpCode;
				item.toLocationCode = item.locationCode;
				item.toLocationErpCode = item.locationErpCode;

				//实际库存数量
				item.handledContainerCode = balanceItem.containerCode;
				item.handledPackingCode = balanceItem.packingCode;
				item.handledBatch = balanceItem.batch;
				item.handledLot = balanceItem.lot;

				item.defaultHandleQty = balanceItem.qty;
				item.handledQty = balanceItem.qty;
				item.handledFromLocationCode = balanceItem.locationCode;
				item.handledFromLocationArea = balanceItem.locationArea;
				item.handledFromLocationGroup = balanceItem.locationErpCode;
				item.handledFromLocationErpCode = balanceItem.locationGroup;
				item.handledFromWarehouseCode = balanceItem.warehouseCode;

				item.toLocationArea = balanceItem.locationArea;
				item.toLocationGroup = balanceItem.locationGroup;
				item.toLocationErpCode = balanceItem.locationErpCode;

				//当前扫描标签的信息
				item.scanItemCode = this.currentScanLebel.data.itemCode;
				item.scanPackingCode = this.currentScanLebel.data.code;
				item.scanLot = this.currentScanLebel.data.lot;

				item.worker = localStorage.userName_CN ==""?localStorage.userName:localStorage.userName_CN;
				item.uom = balanceItem.uom;

				this.details.sort(compareDesc('scanDate')); //按扫描信息排
				this.calcScanCount(); //计算扫描的数量
				this.$forceUpdate();
			},

			selectedBalanceItem(balanceItem) {
				this.setBalanceInfo(this.currentItem, balanceItem);

			},
			// //接收
			receive(callback) {
				let params = {
					id: this.id
				};
				takeIssueJob(params)
					.then(res => {
						callback(true);
					})
					.catch(err => {
						this.showMessage(err.message);
						callback(false);
					});
			},

			submit() {
				let that = this;
				if (that.datacontent.details.length === 0) {
					this.showMessage('该任务没有要上架的零件');
					return;
				}
				let checkItems = that.details.filter(r => r.scaned === true);
				if (checkItems.length < that.details.length) {
					showConfirmMsg('还有未扫描的零件,是否继续发料', confirm => {
						if (confirm) {
							that.finsh();
						}
					});
				} else {
					that.finsh();
				}
			},

			handleLocation() {
				let that = this;
				if (that.details[0].requestLocationCode != that.toLocation) {
					showConfirmMsg('目标库位【' + that.toLocation + '】与需求库位不一致,是否要将以上零件发到目标库位?', confirm => {
						if (confirm) {
							that.handledPackingCode();
						} else {
							that.clearScanLocation();
						}
					});
				} else {
					showConfirmMsg('是否要将以上零件发到目标库位:【' + that.toLocation + "】", confirm => {
						if (confirm) {
							that.handledPackingCode();
						} else {
							that.clearScanLocation();
						}
					});
				}
			},

			//判断是否有推荐箱码为空的情况
			handledPackingCode() {
				let that = this;
				let items = this.details.filter(r => {
					return r.scaned && (r.handledPackingCode === null || r.handledPackingCode === '')
				})

				if (items.length > 0) {
					let packingCodes = '';
					items.forEach(r => {
						packingCodes += r.recommendPackingCode + ','
					})
					showConfirmMsg('以下箱码对应的实际箱码为空,是否要继续发料?【' + packingCodes + "】", confirm => {
						if (confirm) {
							that.finsh();
						} else {
							that.clearScanLocation();
						}
					});
				} else {
					that.finsh();
				}
			},

			finsh() {
				let that = this;
				uni.showLoading({
					title: "提交中...",
					mask: true
				});
				that.datacontent.completeUserId = localStorage.getItem('userId')
				that.datacontent.completeUserName = localStorage.getItem('userName_CN')
				that.datacontent.completeTime = new Date();
				that.datacontent.worker = localStorage.userName_CN ==""?localStorage.userName:localStorage.userName_CN;
				that.datacontent.details = that.details;
				let params = JSON.stringify(that.datacontent);
				finshIssueJob(that.id, params)
					.then(res => {
						uni.hideLoading();
						if (res != null) {
							that.showCommitSuccessMessage();
							that.backJobList(1000);
						}
					})
					.catch(err => {
						that.showMessage(err.message);
						uni.hideLoading();
					});
			},

			//返回任务列表页
			backJobList(delay) {
				if (this.byFIFO) {
					setTimeout(() => {
						uni.navigateTo({
							url: './issueByFIFO'
						})
					}, 1000)
				} else {
					setTimeout(() => {
						uni.navigateTo({
							url: './issueNoFIFO'
						})
					}, 1000)
				}
			},

			clear() {
				this.scanCount = 0;
				this.currentItem = null;
				this.currentScanLebel = null;
				this.getDetail();
			},
			clearScanLocation() {
				this.currentItem = null;
			},
			showMessage(message) {
				this.$refs.comMessage.showMessage(message);
			},
			showScanMessage(message) {
				this.$refs.comMessage.showScanMessage(message);
			},

			closeScanMessage() {
				this.$refs.scanPopup.getfocus();
			},

			calcScanCount() {
				this.scanCount = this.details.filter(r => r.scaned === true).length;
				this.closeScanPopup();
			},

			showCommitSuccessMessage() {
				this.$refs.comMessage.showCommitSuccess();
			},

			closeCommitMessage() {
				this.backJobList(0); //点关闭直接返回列表
				uni.hideLoading();
			},

			closeScanPopup() {
				if (this.allCount == this.scanCount) {
					this.$refs.scanPopup.closeScanPopup();
				}
			},

			closeScanMessage() {
				this.scanPopupGetFocus();
			},

			scanPopupGetFocus() {
				this.$refs.scanPopup.getfocus();
			},

			scrollToTop() {
				let that = this;
				// 解决view层不同步的问题
				that.scrollTop = that.old.scrollTop
				this.$nextTick(function() {
					that.scrollTop = 0
				});
			},

			upper: function(e) {
				// console.log(e)
			},
			lower: function(e) {
				// console.log(e)
			},
			scroll: function(e) {
				// console.log(e)
				this.old.scrollTop = e.detail.scrollTop;
			},
			qtyChanged(value, item, index) {
				if (value <= 0) {
					this.showMessage('发料数量不能小于或等于0')
					item.handledQty = item.defaultHandleQty
					this.$refs['comNumberBox_' + index][0].setValue(item.handledQty);
				} else if (value > item.defaultHandleQty) {
					item.handledQty = item.defaultHandleQty
					this.showMessage('发料数量不能大于库存数量:' + item.handledQty)
					this.$refs['comNumberBox_' + index][0].setValue(item.handledQty);
				}
			},
		}
	}
</script>

<style scoped lang="scss">
</style>
