<template>
	<view style="padding-left: 2px;padding-right: 2px;">
		<!-- <view style="flex-direction: row;display: flex;padding: 1px;margin-top: 5px;">
			<text style="align-self: center;font-size: 35rpx;color: darkslategray;">出库任务单号：</text>
			<text style="align-self: center;font-size: 35rpx;word-wrap: break-word;width: 200px;font-weight: bold;">{{outTaskDtlMd.outTaskNo}}</text>
		</view> -->
		<view style="flex-direction: row;display: flex;padding: 2px;margin-top: 5px;">
			<text style="align-self: center;font-size: 35rpx;color: darkslategray;">生产令号：</text>
			<text style="align-self: center;font-size: 35rpx;word-wrap: break-word;width: 200px;font-weight: bold;">{{outTaskDtlMd.bomNo}}</text>
		</view>
		<view style="flex-direction: row;display: flex;padding: 2px;margin-top: 5px;">
			<text style="align-self: center;font-size: 35rpx;color: darkslategray;">物料号：</text>
			<text style="align-self: center;font-size: 35rpx;word-wrap: break-word;width: 200px;font-weight: bold;">{{outTaskDtlMd.materialCode}}</text>
		</view>
		<view style="flex-direction: row;display: flex;padding: 2px;margin-top: 5px;margin-bottom: 5px;">
			<text style="align-self: center;font-size: 35rpx;color: darkslategray;">物料名称：</text>
			<text style="align-self: center;font-size: 35rpx;word-wrap: break-word;width: 200px;font-weight: bold;">{{outTaskDtlMd.materialName}}</text>
		</view>
		<view style="flex-direction: row;display: flex;padding: 2px;margin-top: 5px;">
			<text style="align-self: center;font-size: 35rpx;color: darkslategray;">规格型号/图号：</text>
			<text style="align-self: center;font-size: 35rpx;word-wrap: break-word;width: 200px;font-weight: bold;">{{outTaskDtlMd.materialSpec}}</text>
		</view>
		<view style="flex-direction: row;flex-direction: row;display: flex;padding: 2px;margin-top: 5px;">
			<text style="align-self: center;font-size: 35rpx;color: darkslategray;width: 260rpx;">需求数量：</text>
			<text style="align-self: center;font-size: 50rpx;font-weight: bold;color: blue;">{{outTaskDtlMd.qty - outTaskDtlMd.outQty}}</text>
		</view>
		<!-- <view style="flex-direction: row;display: flex;padding: 1px;">
			<text style="align-self: center;font-size: 35rpx;color: #0000ff;font-weight: bold;width: 260rpx;">规格型号\图号：</text>
			<input class="uni-input" style="font-size: 40rpx;font-weight: bold;" disabled="true" v-model="scanMaterialCode" :focus="foucusIndex === 0" @confirm="foucusChange0" @focus="getFoucus(0)"/>
		</view> -->
		<view style="flex-direction: row;display: flex;padding: 2px;margin-top: 5px;">
			<text style="align-self: center;font-size: 35rpx;color: #0000ff;font-weight: bold;width: 260rpx;">BN/SN码：</text>
			<input class="uni-input" style="font-size: 40rpx;font-weight: bold;" v-model="scanBnSnCode" :focus="foucusIndex === 1" @confirm="foucusChange1" @focus="getFoucus(1)"/>
		</view>
		<view style="flex-direction: row;display: flex;padding: 2px;margin-top: 5px;">
			<text style="align-self: center;font-size: 35rpx;color: #0000ff;font-weight: bold;width: 260rpx;">出库数量：</text>
			<input class="uni-input" type="number" style="font-size: 40rpx;font-weight: bold;color: red;" v-model="outNum" :focus="foucusIndex === 2" @confirm="foucusChange2" @focus="getFoucus(2)"/>
		</view>
		<view class="my-tips-view" style="margin-top: 15px;">{{tipMsg}}</view>
		<button type="primary" style="margin-top: 45px;" @click="resetData">重置</button>
		<button type="primary" style="margin-top: 15px;" @click="submitResult">出库结果提交</button>
		
		<!-- 提示信息弹窗 -->
		<!-- <view>
			<uni-popup ref="message" type="message">
				<uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message>
			</uni-popup>
		</view> -->
		<view>
			<!-- 普通弹窗 -->
			<uni-popup ref="popup" background-color="#fff" @change="change" :mask-click="isMaskClick" @maskClick="maskClickFun">
				<view class="popup-content" style="flex-direction: column;display: flex;">
					<text class="text" style="color: red;font-weight: bold;">{{popTitleMsg}}</text>
					<text style="color: #333;font-size: 16px;margin-top: 15px;">{{popMsg}}</text>
				</view>
			</uni-popup>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				outTaskDtlMd: {},
				scanMaterialCode: '',
				scanBnSnCode: '',
				outNum: 0,
				foucusIndex: 1,
				tipMsg: '等待扫码确认物料号......',
				popTitleMsg: '请重新扫码！！',
				popMsg: '',
				isMaskClick: true,
				stockQty: 0
			}
		},
		onUnload() {
			
		},
		onLoad() {
			uni.$once('sendCheckedDeliverDtlData', (data) => {
				this.outTaskDtlMd = data
				this.outNum = data.qty - data.outQty
				this.scanMaterialCode = data.materialSpec
			})
			this.foucusIndex = 1
		},
		methods: {
			maskClickFun() {
				if(this.foucusIndex === 0 && (this.scanMaterialCode !== this.outTaskDtlMd.materialCode)) {
					this.scanMaterialCode = ''
				}
				else if(this.foucusIndex === 1 && (this.scanMaterialCode !== this.outTaskDtlMd.materialCode)) {
					if(this.isEmptyStr(this.scanMaterialCode)) {
						this.scanBnSnCode = ''
						this.foucusIndex = 0
					}
					else if(this.isEmptyStr(this.scanBnSnCode)) {
						this.foucusIndex = 1
					}
					else {
						this.scanBnSnCode = ''
						this.scanMaterialCode = ''
						this.resetFoucus(0)
					}
				}
			},
			change(e) {
				if(e.show) {
					
				}
				else {
					this.resetFoucus(this.foucusIndex)
				}
			},
			input(e) {
				if(e !== this.outTaskDtlMd.materialCode) {
					this.isMaterialCodeErr = true;
				}
				else {
					this.isMaterialCodeErr = false;
				}
			},
			async submitResult() {
				if(this.outNum <= 0) {
					this.popTitleMsg = '错误提示！！'
					this.popMsg = '出库数量不能为0'
					this.$refs.popup.open('center')
					this.foucusIndex = 2
					return;
				}
				if(this.stockQty <= 0) {
					this.popTitleMsg = '错误提示!!'
					this.popMsg = '库存数量为：0,无法出库'
					this.$refs.popup.open('center')
					return;
				}
				if((this.outTaskDtlMd.qty - this.outTaskDtlMd.outQty) < this.outNum) {
					this.popTitleMsg = '错误提示!!'
					this.popMsg = `出库数量【${this.outNum}】大于需求数量【${this.outTaskDtlMd.qty - this.outTaskDtlMd.outQty}】,无法出库`
					this.$refs.popup.open('center')
					return;
				}
				if(this.stockQty < this.outNum) {
					this.popTitleMsg = '错误提示!!'
					this.popMsg = `出库数量【${this.outNum}】大于库存数量【${this.stockQty}】,无法出库`
					this.$refs.popup.open('center')
					return;
				}
				
				uni.showLoading({
					title: "正在提交数据...",
					mask: true,
				})
				let tmpMd = this.outTaskDtlMd;
				tmpMd.outStoreQty = Number(this.outNum);
				tmpMd.OutNum = Number(this.outNum);
				tmpMd.BnSnCode = this.scanBnSnCode;
				let parm = {
					url : '/business/OutOutstoreRecord/AddOutstoreRecord',
					data: tmpMd,
					method: 'POST',
					isHaveToken : true
				}
				let retData = await getApp().RequestData(parm)
				if(retData.isSuccess) {
					if(retData.data.code == 200) {
						uni.navigateBack({
							url: '/pages/Outstore/outstoreDtlNew',
							success: () => {
								uni.hideLoading()
								uni.$emit('addOutstoreData',tmpMd);
							}
						});
						// console.log(retData.data)
					}
					else {
						uni.hideLoading()
						// console.log(retData.data)
						uni.showToast({
							title: '接口错误！' + retData.data.msg,
							icon: 'none',
							duration: 1500,
							mask:true,
						})
					}
				}
				else {
					uni.hideLoading()
					// console.log(retData)
					uni.showToast({
						title: '接口异常！' + retData.retMsg,
						icon: 'none',
						duration: 1500,
						mask:true,
					})
				}
			},
			isEmptyStr(s) {
				if (s == undefined || s === '') {
					return true
				}
				return false
			},
			foucusChange0(event) {
				if(this.isEmptyStr(this.scanMaterialCode)) {
					this.popTitleMsg = '请重新扫码！！'
					this.popMsg = '物料号不能为空'
					this.$refs.popup.open('center')
					return;
				}
				if(this.scanMaterialCode !== this.outTaskDtlMd.materialSpec) {
					this.popTitleMsg = '请重新扫码！！'
					this.popMsg = '物料号扫码确认错误'
					this.$refs.popup.open('center')
					return
				}
				
				let str = event.detail.value
				if(str.length !== 0) {
					this.foucusIndex = 1
				}
				else {
					this.resetFoucus(0)
				}
				
				this.tipMsg = "等待扫码 BN/SN码......"
			},
			foucusChange1(event) {
				if(this.isEmptyStr(this.scanMaterialCode)) {
					this.popTitleMsg = '请重新扫码！！'
					this.popMsg = '物料号不能为空'
					this.$refs.popup.open('center')
					return;
				}
				if(this.isEmptyStr(this.scanBnSnCode)) {
					this.popTitleMsg = '请重新扫码！！'
					this.popMsg = 'BN/SN码不能为空'
					this.$refs.popup.open('center')
					//this.resetFoucus(1)
					return
				}
				if(this.scanMaterialCode !== this.outTaskDtlMd.materialSpec) {
					this.popTitleMsg = '请重新扫码！！'
					this.popMsg = '物料号扫码确认错误'
					this.$refs.popup.open('center')
					return
				}
				// let str = event.detail.value
				// if(str.length !== 0) {
				// 	this.foucusIndex = 2
				// }
				this.tipMsg = "正在查询库存数据......"
				this.isMaskClick = false;
				this.popTitleMsg = '提示'
				this.popMsg = '正在查询库存数据......'
				this.$refs.popup.open('center')
				// let that = this
				
				
				let parm = {
					url : '/business/StkBalanceDtl/GetStkBalanceDtlList',
					data: {
						BomNo: this.outTaskDtlMd.bomNo,
						MaterialCode: this.scanMaterialCode,
						BnSnCode: this.scanBnSnCode,
					},
					method: 'GET',
					isHaveToken : true
				}
				getApp().RequestData(parm).then((res)=>{
					console.log(res)
					let retData = res;
					if(retData.isSuccess) {
						if(retData.data.code == 200) {
							if(retData.data.data.length === 0) {
								this.stockQty = 0
								setTimeout(() => {
									this.tipMsg = '库存数量为：' + this.stockQty
									this.$refs.popup.close()
									this.isMaskClick = true
									this.scanBnSnCode = ''
									// this.foucusIndex = 2
									this.resetFoucus(1)
								}, 1000)
							}
							else {
								this.stockQty = retData.data.data
								setTimeout(() => {
									this.tipMsg = '库存数量为：' + this.stockQty
									this.$refs.popup.close()
									this.isMaskClick = true
									// this.foucusIndex = 2
									this.resetFoucus(2)
								}, 1000)
							}
						}
						else {
							this.stockQty = 0
							this.tipMsg = '获取库存数量发生错误！！'
							this.$refs.popup.close()
							this.isMaskClick = true;
							this.scanBnSnCode = ''
							// this.foucusIndex = 1
							this.resetFoucus(1)
						}
					}
					else {
						this.stockQty = 0
						this.tipMsg = '获取库存数量发生错误！！'
						this.$refs.popup.close()
						this.isMaskClick = true;
						this.scanBnSnCode = ''
						// this.foucusIndex = 1
						this.resetFoucus(1)
					}
				});
			},
			foucusChange2(event) {
				if(this.outNum <= 0) {
					this.popTitleMsg = '错误提示！！'
					this.popMsg = '出库数量不能为0'
					this.$refs.popup.open('center')
					this.foucusIndex = 2
					return;
				}
				let str = event.detail.value
				if(str.length !== 0) {
					this.foucusIndex = 3
				}
				this.submitResult()
			},
			resetData() {
				this.resetFoucus(1)
				this.scanBnSnCode = ''
				// this.scanMaterialCode = ''
				this.outNum = this.outTaskDtlMd.qty - this.outTaskDtlMd.outQty
				this.stockQty = 0
				this.tipMsg = '等待扫码确认物料号......'
			},
			isEmptyStr(s) {
				if (s == undefined || s === '') {
					return true
				}
				return false
			},
			resetFoucus(index) {
				this.foucusIndex = 3
				setTimeout(() => {
				   this.foucusIndex = index;
				}, 5)
			},
			getFoucus(index) {
				this.foucusIndex = index
			}
		}
	}
</script>

<style lang="scss">
	@import '@/common/uni-nvue.css';
	
	.my-tips-view {
		margin-top: 5px;
		text-align: center;
		color: #aa007f;
		font-size: 20px;
		font-weight: bold;
	}
	.popup-content {
		// @include flex;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 15px;
		// height: 50px;
		background-color: #fff;
	}
	.text {
		font-size: 22px;
		color: #333;
	}

</style>