<template>
	<view class="">
		<uni-popup ref="popup" :maskClick="false">
			<view class="uni-flex uni-column pop_customer">
				<view class="" style="padding:10rpx">
					<view class="uni-flex u-col-center uni-row space-between" style="padding: 10rpx 10rpx 20rpx 10rpx">
						<view class="" style="font-size: 35rpx;">
							{{title}}
						</view>
						<image style="width: 35rpx;height: 35rpx;" src="/static/icons/icons_close.svg"
							@click="closeRequestPopup()"></image>
					</view>
					<view class='split_line'></view>
					<view class="uni-flex uni-column" style="background-color: white; ">
						<view class="uni-flex uni-column">

							<view class="title " style="display: flex; align-items: center;padding: 10rpx;">
								<text style=" flex-shrink: 0;width: 25%;">生产线：</text>
								<view class="customerBorder" @click="showSelectLine">
									{{productionLineName}}
								</view>
								<u-select v-model="showProductLineSelect" mode="mutil-column-auto"
									:list="productLineList" @confirm="confirmSelectLine"></u-select>

								<view class="">
									<image src="/static/icons/down.svg" mode=""
										style=" width: 40rpx;height: 40rpx;margin-left: 20rpx;" @click="showSelectLine">
									</image>
								</view>
							</view>
							<view class='split_line'></view>
							<view class="title " style="display: flex; align-items: center;padding: 10rpx;">
								<text style=" flex-shrink: 0;width: 25%;">计划日期：</text>
								<view class="customerBorder" @click="showSelectDate">
									{{planDate}}
								</view>
								<u-select v-model="showDateSelect" mode="mutil-column-auto"
									:list="planDateList" @confirm="confirmSelectDate"></u-select>
							
								<view class="">
									<image src="/static/icons/down.svg" mode=""
										style=" width: 40rpx;height: 40rpx;margin-left: 20rpx;" @click="showSelectDate">
									</image>
								</view>
							</view>
							<view class='split_line'></view>
							<view class="title " style="display: flex;align-items: center;padding: 10rpx;">
								<text style=" flex-shrink: 0; width: 25%;">物料代码：</text>
								<view class="customerBorder">
									{{itemCode}}
								</view>
								<view v-if="planQty>0">{{planQty}}({{getUomInfo(uom)}})</view>
								<u-select v-model="showItemCodeSelect" mode="single-column" :list="itemCodeList"
									@confirm="confirmSelectItem"></u-select>
								<view class="">
									<image src="/static/icons/down.svg" mode=""
										style=" width: 40rpx;height: 40rpx;margin-left: 20rpx;"
										@click="showSelectItemCode">
									</image>
								</view>
							</view>
							
							<!-- <view class="title " style="display: flex;align-items: center;padding: 10rpx;">
								<text style=" flex-shrink: 0; width: 25%;">计划数量：</text>
								<view class="customerBorder">
									{{planQty}}
								</view>
								<view class="">
									<image src="" mode="" style=" width: 40rpx;height: 40rpx;margin-left: 20rpx;">
									</image>
								</view>
							</view> -->
							<view class='split_line'></view>
							<view class="title " style="display: flex;align-items: center;padding: 10rpx;">
								<text style=" flex-shrink: 0; width: 25%;">包装规格：</text>
								<view class="customerBorder">
									{{packUnitName}}
								</view>
								<u-select v-model="showPackUnitSelect" mode="single-column" :list="packUnitList"
									@confirm="confirmSelectPackUnit"></u-select>
								<view class="">
									<image src="/static/icons/down.svg" mode=""
										style=" width: 40rpx;height: 40rpx;margin-left: 20rpx;"
										@click="showSelectPackUnit">
									</image>
								</view>
							</view>
							<view class='split_line'></view>
							
							<view class="title " style="display: flex;align-items: center;padding: 10rpx;">
								<text style=" flex-shrink: 0; width: 25%;">批次：</text>
								<uni-easyinput v-model="batch"></uni-easyinput>
								<view class="">
									<image src="" mode="" style=" width: 40rpx;height: 40rpx;margin-left: 20rpx;"
										@click="showSelectLine">
									</image>
								</view>
							</view>

							<view class='split_line'></view>
						</view>
					</view>
				</view>
				<view class="uni-flex uni-row hide_border">
					<button class="btn_edit_big_cancle" hover-class="btn_edit_big_after" @click="cancel()">取消</button>
					<button class="btn_edit_big_confirm" hover-class="btn_edit_big_after" @click="confirm()">确认</button>
				</view>
			</view>
		</uni-popup>
		<comMessage ref="comMessage"></comMessage>
	</view>
</template>

<script>
	import {
		getIssueJobByProductionline,
		getPlaneInfoByproductLine,
		getPackUnitByItemCode,
		getProductionlineAndWorkStation
	} from '@/api/request2.js';
	import {
		getPackUnitName,
		getUomInfo
	} from '@/common/directory.js';

	import {
		getCurrDate,
		getBatch8,
		dateFormatData,
		lastThreeDays
	} from '@/common/basic.js';

	import {
		calc
	} from '@/common/calc.js';

	import uom from '@/mycomponents/qty/uom.vue'
	import packQty from '@/mycomponents/qty/packQty.vue'
	import balanceStatus from '@/mycomponents/status/balanceStatus.vue'
	import winScanItem from '@/mycomponents/scan/winScanItem.vue'

	export default {
		components: {
			uom,
			balanceStatus,
			winScanItem,
			packQty,
		},
		data() {
			return {
				itemCode: '请选择物料信息',
				uom: "",
				qty: null,
				planQty: 0,
				goodQty: 0,
				planNumber: "",
				productLineCode: "",
				showProductLineSelect: false,
				productLineList: [],
				productionLineName: "请选择生产线",
				productionLineCode: "",
				batch: "",
				packUnitName: "请选择包装规格",
				packUnit: "",
				packUnitList: [],
				packQtyHint: "",
				packQty: 0,
				showPackUnitSelect: false,
				itemCodeList: [],
				showItemCodeSelect: false,
				workStationCode: "",
				planDate: '',
				showDateSelect:false,
				planDateList:[],
				fgLocationCode:"",
				rawLocationCode:""
			}
		},
		props: {
			title: {
				type: String,
				default: '开工阶段'
			},
			itemCodeTypeList: {
				type: Array,
				default: []
			},
		},
		methods: {

			openRequestPopup() {
				this.initData();
				this.planDate =getCurrDate()
				this.batch = getBatch8()
				this.$refs.popup.open('bottom')
			},
			initData() {
				this.itemCode = '请选择物料信息';
				this.uom = ""
				this.planQty = 0
				this.goodQty = 0;
				this.packQty = 0;
				this.planNumber = ""
				this.productLineCode = ""
				this.showProductLineSelect = false
				this.productLineList = []
				this.productionLineName = "请选择生产线"
				this.productionLineCode = ""
				this.batch = ""
				this.packUnitName = "请选择包装规格"
				this.packUnit = "",
				this.packQtyHint = ""
				this.showPackUnitSelect = false
				// this.packUnitList = []
				this.itemCodeList = []
				this.showItemCodeSelect = false
				this.workStationCode = ""
				this.planDate=""
				this.showDateSelect =false
				this.planDateList=[]
				this.fgLocationCode=""
				this.rawLocationCode=""

			},

			closeRequestPopup() {
				this.$refs.popup.close()
			},
			itemCodeLoseFocus() {
				this.itemCodeFocus = false;
			},

			confirm() {
				if (!this.planDate) {
					this.showErrorMessage('请先选择计划日期');
					return;
				}
				
				if (this.productionLineName == "请选择生产线") {
					this.showErrorMessage("请选择生产线")
					return
				}

				if (!this.batch) {
					this.showErrorMessage("请输入批次例如:20200101")
					return
				}

				if (this.itemCode == "请选择物料信息") {
					this.showErrorMessage("请选择物料信息")
					return
				}

				if (this.packUnitName == "请选择包装规格") {
					this.showErrorMessage("请选择包装规格")
					return
				}

				this.callback();
			},

			callback() {
				let item = {
					productionLineName: this.productionLineName,
					productionLineCode: this.productionLineCode, //生产线
					itemCode: this.itemCode,
					uom: this.getUomInfo(this.uom),
					batch: this.batch,
					packUnitName: this.packUnitName,
					packUnit: this.packUnit,
					packQtyHint: this.packQtyHint,
					packQty: this.packQty,
					planQty: this.planQty,
					goodQty: this.goodQty,
					planNumber: this.planNumber,
					workStationCode: this.workStationCode,
					fgLocationCode:this.fgLocationCode,
					rawLocationCode:this.rawLocationCode
				};
				this.closeRequestPopup();
				this.$emit("confirm", item);
			},

			showErrorMessage(message, type) {
				setTimeout(r => {
					this.$refs.comMessage.showErrorMessage(message, res => {})
				})
			},
			cancel(e) {
				this.closeRequestPopup();
			},

			confirmSelectLine(data) {
				this.productionLineName = data[0].label + "—" + data[1].label
				this.productionLineCode = data[0].value
				this.workStationCode = data[1].value
				var parent =this.productLineList.filter(res=>res.value==this.productionLineCode)
				var fgLocation =parent[0].children.filter(children=>children.value==this.workStationCode)
				this.fgLocationCode= fgLocation[0].fgLocationCode;
				this.clearItemCode()
				this.clearPackUnit()
				
			},
			clearItemCode(){
				this.planDate =getCurrDate()
				this.itemCode ="请选择物料信息"
				this.uom = ""
				this.planQty = 0;
				this.goodQty = 0
				this.planNumber = ""
			},
			
			confirmSelectDate(data) {
				this.planDate=data[0].label
			},
			
			showSelectDate(){
				this.showDateSelect =true;
				var list =lastThreeDays(3);
				this.planDateList=[]
				list.forEach(res=>{
					this.planDateList.push({
						label :res,
						value:""
					})
				})
			},

			showSelectLine() {
				if (this.productLineList.length == 0) {
					uni.showLoading({
						title: "加载中",
						mask: true
					})
					getProductionlineAndWorkStation().then(res => {
						uni.hideLoading()
						if (res.data && res.data.length > 0) {
							this.productLineList = res.data
							this.showProductLineSelect = true
						} else {
							this.showErrorMessage('未查找到生产线信息');
						}

					}).catch(error => {
						uni.hideLoading()
						this.showErrorMessage(error);
					})
				} else {
					this.showProductLineSelect = true
				}


			},
			showSelectItemCode() {
				if (!this.planDate) {
					this.showErrorMessage('请先选择计划日期');
					return;
				}
				if (!this.productionLineCode) {
					this.showErrorMessage('请先选择生产线');
					return;
				}
				uni.showLoading({
					title: "加载中",
					mask: true
				})
				getPlaneInfoByproductLine(this.productionLineCode, this.planDate).then(res => {
					uni.hideLoading()
					if (res.data && res.data.length > 0) {
						res.data.forEach(item => {
							item.label = item.itemCode + "（" + item.planQty + this.getUomInfo(item.uom) + ")" 
							item.value = item
						})
						this.itemCodeList = res.data
						this.showItemCodeSelect = true
					} else {
						this.showErrorMessage('未查找到物料信息');
					}

				}).catch(error => {
					uni.hideLoading()
					this.showErrorMessage(error);
				})
			},
			confirmSelectItem(data) {
				let productionPlan = data[0].value;
				this.itemCode = productionPlan.itemCode;
				this.uom = productionPlan.uom
				this.planQty = productionPlan.planQty;
				this.goodQty = productionPlan.goodQty
				this.planNumber = productionPlan.number
				
				//清除其他数据
				this.clearPackUnit();
				uni.showLoading({
					title: "加载中",
					mask: true
				})
				getPackUnitByItemCode(this.itemCode).then(res => {
					uni.hideLoading()
					if (res.data && res.data.list.length > 0) {
						res.data.list.forEach(item => {
							item.value = item.packUnit
							item.label = getPackUnitName(item.packUnit) + "(" + item.packQty + this
								.getUomInfo(item.uom) + ")";
						})
						this.packUnitList = res.data.list
						var defaultData =res.data.list.filter(item=>item.defaultPackageunit=="TRUE")
						this.confirmSelectPackUnit(defaultData)
					} 
				
				}).catch(error => {
					uni.hideLoading()
				})
			},
			
			clearPackUnit(){
				this.packUnitName = "请选择包装规格"
				this.packUnit = ""
				let pack = this.packUnitList.filter(r => r.packUnit == this.packUnit);
				this.packQtyHint = "";
				this.packQty = 0
			},

			showSelectPackUnit() {
				if (this.itemCode == "请选择物料信息") {
					this.showErrorMessage('请先选择物料');
					return;
				}

				uni.showLoading({
					title: "加载中",
					mask: true
				})
				getPackUnitByItemCode(this.itemCode).then(res => {
					uni.hideLoading()
					if (res.data && res.data.list.length > 0) {
						res.data.list.forEach(item => {
							item.value = item.packUnit
							item.label = getPackUnitName(item.packUnit) + "(" + item.packQty + this
								.getUomInfo(item.uom) + ")";
						})
						this.packUnitList = res.data.list
						this.showPackUnitSelect = true
					} else {
						this.showErrorMessage('未查找到包装信息');
					}

				}).catch(error => {
					uni.hideLoading()
					this.showErrorMessage(error);
				})

			},

			confirmSelectPackUnit(data) {
				this.packUnitName = data[0].label
				this.packUnit = data[0].value
				let pack = this.packUnitList.filter(r => r.packUnit == this.packUnit);
				this.packQtyHint = pack[0].packQty + "(" + this
					.getUomInfo(pack[0].uom) + ")";
				this.packQty = pack[0].packQty
			},
			getUomInfo(uom) {
				let item = getUomInfo(uom);
				if (item == '') {
					return uom;
				} else {
					return item.label
				}
			},





		}
	}
</script>

<style lang="scss">
	.title {
		font-size: 30rpx;
	}

	.customerBorder {
		width: 100%;
		border: 1rpx solid lightgray;
		border-radius: 5rpx;
		padding: 15rpx;
	}
</style>