<template>
	<view class="">
		<win-blank-view @goScan='openScanPopup' v-if="containerCode==''"></win-blank-view>

		<view class="top_card" v-if="containerCode">
			<view class="device-detail">
				<view class="ljh_box nopad">
					<view class="tit_ljh">
						<text class="text_black">{{containerCode}}</text>
					</view>
				</view>
				<view class="cell_box uni-flex uni-row margin_top">
					<view class="cell_info" style="margin-bottom: 0;">
						<view class="text_lightblue">生产线</view>
						<view class="text_black text_bold">{{prodLine.prodLineCode}}</view>
						<!-- 生产线 -->
					</view>
					<view class="cell_info cell_long" style="margin-bottom: 0;">
						<view class="text_lightblue">原料库位</view>
						<view class="text_black text_bold">{{prodLine.rawLocation}}</view>
						<!-- 原料库位 -->
					</view>
					<view class="cell_info cell_long" style="margin-bottom: 0;">
						<view class="text_lightblue">成品库位</view>
						<view class="text_black text_bold">
							{{prodLine.productLocation==null?'无':prodLine.productLocation}}
						</view>
					</view>
				</view>
				<!-- <view class="font_sm">
					线边库位:
					<text class="text_bold">{{prodLine.rawLocation}}</text>
				</view> -->
			</view>
		</view>

		<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-detail">
			<view v-if="fData.length>0" class="recept_form" style="padding-bottom: 10rpx;">
				<view class="recept_form_info">
					<view class="form_title">
						<image class="icon_normal" src="@/static/icons_ui/icon_form.svg"></image>
						<text class="text_bold">上层({{fCount}})</text>
					</view>
					<com-tj-product :tableData='fData' style='margin: 20rpx 16rpx 0;'></com-tj-product>
				</view>
			</view>

			<view v-if="rData.length>0" class="recept_form">
				<view class="recept_form_info">
					<view class="form_title">
						<image class="icon_normal" src="@/static/icons_ui/icon_form.svg"></image>
						<text class="text_bold">下层({{rCount}})</text>
					</view>
					<com-tj-product :tableData='rData' style='margin: 10px;'></com-tj-product>
				</view>
			</view>
		</scroll-view>

		<view class="uni-flex uni-row new_btn_bot" v-if="containerCode">
			<button type="primary" class="new_clear_btn btn_double" @click="clear()">清空</button>
			<button class="new_save_btn btn_double" @click="submit()">提交</button>
		</view>
		<win-scan-button @goScan='openScanPopup' v-if="containerCode!=''"></win-scan-button>
		<com-scan-tj-receipt ref='scanPopup' @getContainerResult='getContainerResult' @getDoorResult='getDoorResult'>
		</com-scan-tj-receipt>
		<comMessage ref="comMessage"></comMessage>
	</view>
</template>

<script>
	import {
		tjproductreceipt,
	} from '@/api/index.js';
	import {
		showConfirmMsg,
		goHome
	} from '@/common/basic.js';

	import winBlankView from '@/mycomponents/wincom/winBlankView.vue'
	import winScanButton from '@/mycomponents/wincom/winScanButton.vue'
	import comScanTjReceipt from '@/mycomponents/scan/comScanTjReceipt.vue'
	import comTjProduct from '@/mycomponents/coms/comTjProduct.vue'
	import comMessage from '@/mycomponents/common/comMessage.vue'
	import moment from 'moment'
	
	export default {
		name: 'tjReceipt',
		components: {
			winScanButton,
			winBlankView,
			comScanTjReceipt,
			comTjProduct,
			comMessage,
		},
		data() {
			return {  
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				pageSize: 100,
				pageIndex: 1,
				containerCode: '',
				produceDate: '',
				prodLine: {},
				locationCode: 'FG',
				fData: [], //上层门板数据列表
				rData: [], //下层门板数据列表
				fCount: 0, //上层门板数量
				rCount: 0, //下次门板数量
				postion: '', //L R
				containerItem: {} //器具对象
			};
		},
		props: {
			//是否按序收货
			isOrderReceipt: {
				type: Boolean,
				value: false
			}
		},
		mounted: function() {
			console.log('isOrderReceipt', this.isOrderReceipt == true ? '是' : '否')
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: "#5A7CF3 !important"
			})
		},
		onLoad() {

		},
		//返回首页
		onNavigationBarButtonTap(e) {
			if (e.index === 0) {
				goHome();
			}else if(e.index === 1){
				window.location.reload();
			}
		},
		methods: {
			openScanPopup() {
				this.$refs.scanPopup.openScanPopup(this.containerCode, this.containerItem, this.postion);
			},

			getContainerResult(code, containerItem, prodLine) {
				this.containerItem = containerItem;
				this.containerCode = code;
				this.prodLine = prodLine;
			},

			getDoorResult(type, items) {
				this.postion = type;
				if (type === 'F') { //上层门板
					this.fData = items;
					this.fCount = items.filter(r => r.itemCode != 'N').length;
				} else if (type === 'R') { //下层门板
					this.rData = items;
					this.rCount = items.filter(r => r.itemCode != 'N').length;
				}
			},

			submit() {
				let that = this;
				if (this.prodLine === null) {
					this.showMessage('生产线为空,请重新扫描器具编号');
					return;
				}
				if (that.containerCode === '') {
					this.showMessage('请扫描器具编号');
					return;
				}
				if (that.fData.length === 0) {
					this.showMessage('请扫描前门板二维码');
					return;
				}

				if (that.rData.length === 0) {
					this.showMessage('请扫描后门板二维码');
					return;
				}

				uni.showLoading({
					title: '提交中...',
					mask: true
				})
				 
				let receiptItem = {
					worker: localStorage.userName,
					warehouseCode: localStorage.warehouseCode,
					number: "",
					productionPlanNumber: "",
					jobNumber: "",
					completeTime: new Date(),
					Company: localStorage.company,
					// WorkShop: 'a', //车间
					WorkShop: that.prodLine.workShop, //车间
					prodLine: this.prodLine.prodLineCode,
					locationCode: this.prodLine.productLocation,
					rawLocation: this.prodLine.rawLocation, //线边
					details: [] //子表
				};

				let rdateDetails = that.createDetail(that.rData);
				let fdateDetails = that.createDetail(that.fData);

				rdateDetails.forEach(r => {
					receiptItem.details.push(r);
				})

				fdateDetails.forEach(r => {
					receiptItem.details.push(r);
				})

				that.receipt(receiptItem);
			},

			createDetail(datas) {
				let details = [];
				datas.forEach(r => {
					if (r.itemCode != 'N') {

						let itemCode = r.itemCode;
						let detail = {
							seqNo: r.seq,
							itemCode: r.itemCode,
							item: {
								id: 'FE2E4416-E5DC-B869-38DA-3A05028BE27D', //默认的零件Id,
								name: '',
								desc1: '',
								desc2: ''
							},

							prodLine: this.prodLine.prodLineCode,
							lot: r.lot,
							position: r.position,
							productNo: r.produceNo,
							projectCode: this.containerItem.projectNo,
							// program: r.projectNo,
							batch: {
								supplierBatch: '',
								produceDate: this.produceDate + "T00:00:00",
							},
							packingCode: r.produceNo + r.itemCode, //
							containerCode: this.containerCode,
							warehouseCode: localStorage.warehouseCode,
							qty: {
								uom: "",
								qty: 1
							},
							shift: '',
							bomVersion: '',
							locationCode: this.prodLine.productLocation,
							rawLocation: this.prodLine.rawLocation, //线边
							worker: localStorage.userName,
							status: 2 //默认赋值成合格
							// locationCode: that.prodLine.value,
							// rawLocation: that.prodLine.value1,
						};
						details.push(detail)
					}
				})
				return details;
			},

			receipt(receiptItem) {
				let that = this;
				let params = JSON.stringify(receiptItem);
				console.log('param', params);
				tjproductreceipt(params)
					.then(res => {
						that.showMessage('提交成功')
						that.clearItems();
						that.clearContainerCode();
						that.hideLoading();
					})
					.catch(err => {
						that.showMessage(err.message)
						that.hideLoading();
					});
			},

			hideLoading() {
			 
				uni.hideLoading();
			},
			clearItems() {
				this.containerCode = '';
				this.prodLine = {};
				this.postion = '';
				this.rData = [];
				this.fData = [];
				this.rCount = 0;
				this.fCount = 0;
			},

			clear() {
				showConfirmMsg('是否要清空所有数据?', confirm => {
					if (confirm) {
						this.clearItems();
					}
				})
			},

			showMessage(message) {
				this.$refs.comMessage.showMessage(message);
			},

			upper: function(e) {
				// console.log(e)
			},
			lower: function(e) {
				// console.log(e)
			},
			scroll: function(e) {
				// console.log(e)
				this.old.scrollTop = e.detail.scrollTop;
			},
		}
	};
</script>

<style scoped lang="scss">
	.display-input {
		padding: 5rpx 5rpx;
	}

	.display-text {
		color: #666666;
		font-size: 16px;
	}

	/deep/ .input-value {
		font-size: 16px;
	}

	/deep/ .uni-collapse-item__title-text {
		font-size: 16px;
	}
</style>
