<template>
	<view class="page">
		<StickyNavBar>
			<NavBar title="采购入库扫描"></NavBar>
			<FactorySelect v-model="warehouseCode" @change="warehouseChange" />
			<view class="btn">
				<uni-easyinput v-if="vuex_user_factory !== '1010'" prefixIcon="search" class="topSearch" v-model="nlpla"
					focus placeholder="请扫描仓位" @change="handleInputNlpla"></uni-easyinput>
				<uni-easyinput prefixIcon="search" confirm-type="search" :disabled="isDisabled" v-model="wxparams"
					:focus="isFocus" placeholder="请扫描产品包装条码/外箱码" @confirm="handleConfirm"></uni-easyinput>
			</view>
			<view class="total">
				<view class="left">入库明细</view>
				<view class="right">
					批次数：
					<text class="blue">{{ chargaArr.length }}</text>
					<text class="line">|</text>
					总数量：
					<text class="blue">{{ totalNum }}</text>
				</view>
			</view>
		</StickyNavBar>
		<ContentLoadingMore class="cardbox" :list='chargaArr'>
			<view class="cardContent" v-for="(item, index) in chargaArr">
				<listItem :item="item" :goodsList="goodsList" :nlpla="nlpla" @deleGonds="deleGonds" />
			</view>
		</ContentLoadingMore>
		<BottomBtn :btnArr="btnArr" @getBtnHandle="getBtnHandle"></BottomBtn>
	</view>
</template>

<script>
	import listItem from "@/pages/purchaseStorage/listItem.vue"
	import StickyNavBar from '@/components/StickyNavBar/index.vue';
	import ContentLoadingMore from '@/components/ContentLoadingMore/index.vue';
	import BottomBtn from '@/components/BottomBtn/index.vue';
	import FactorySelect from '@/components/FactorySelect/FactorySelect.vue'
	import {
		parseTime
	} from "@/utils/ruoyi";
	export default {
		components: {
			StickyNavBar,
			ContentLoadingMore,
			BottomBtn,
			listItem,
			FactorySelect
		},
		data() {
			return {
				number: 0,
				totalNum: 0,
				show: true,
				nlpla: '',
				wxparams: '',
				warehouseCode: '',
				btnArr: [{
						style: '',
						type: 'warning',
						text: '返回',
						way: 'goBack'
					},
					{
						style: '',
						type: 'primary',
						text: '提交',
						way: 'goSubmit'
					}
				],
				goodsList: [],
				isFocus: false,
				isDisabled: false,
				chargaArr: []
			};
		},
		created() {
			// this.getPlnr('100001240428000002|00100000000000014.000|10002442800002');
			// this.getPlnr('100001240428000002|00100000000000019.500|10002442800001');
		},
		methods: {
			warehouseChange(e) {
				console.log(this.warehouseCode, '----');
			},
			deleGonds(detail) {
				this.goodsList.forEach((ele, idx) => {
					if (detail.PLNR === ele.PLNR) {
						this.goodsList.splice(idx, 1);
					}
				});
				this.totalNum = 0;
				this.goodsList.forEach((ele) => {
					this.totalNum += ele.TOMNG - 0
					ele.cardNum = 0
				});
				this.handleData()
			},
			getBtnHandle(row) {
				this[row.way]();
			},
			goBack() {
				uni.navigateBack();
			},
			goSubmit() {
				// 根据不同工厂，不同选择
				if (this.goodsList.length === 0) {
					return;
				}
				const data = JSON.parse(JSON.stringify(this.goodsList))
				data.forEach(ele => {
					ele.ERFMG = ele.TOMNG
					ele.ERFME = ele.MEINS
					// 添加仓库别
					ele.UMLGO = this.warehouseCode
				});
				this.$u.api.sapApi
					.sapRrm([{
						BLDAT: parseTime(new Date(), '{y}{m}{d}'),
						BUDAT: parseTime(new Date(), '{y}{m}{d}'),
						ZENCODE: 'A014',
						TYPE: 'CG',
						ITEM: data
					}], 300)
					.then((res) => {
						this.loading = false;
						if (!Array.isArray(res)) {
							return
						}
						if (res && res.every((item) => item.TYPE === 'S')) {
							this.goodsList = [];
							this.chargaArr = []
							this.totalNum = 0;
							this.nlpla = '';
							this.wxparams = '';
							this.$u.toast('提交成功');
						}
						const foundObject = res.find(item => item.TYPE === 'E');
						if (foundObject && foundObject.MESSAGE) {
							this.$u.toast(foundObject.MESSAGE);
						}
					});
			},
			handleConfirm(e) {
				this.isFocus = false;
				// e&& e.length > 79 && this.getPlnr(e);
				// console.log(e);
				e && this.getPlnr(e);
			},
			handleInputNlpla(e) {
				if (e) {
					// this.nlpla = e;
					// this.goodsList.forEach((ele) => {
					// 	this.totalNum += ele.TOMNG-0;
					// 	ele.NLPLA = ele.NLPLA || this.nlpla;
					// });
				}
			},
			getPlnr(plnr) {
				this.isDisabled = true;
				if (!this.nlpla && this.vuex_user_factory !== '1010') {
					this.$u.toast('请先扫描仓位');
					setTimeout(() => {
						this.wxparams = '';
						this.isFocus = true;
						this.isDisabled = false;
					}, 1000);
					return
				}
				this.$u.api.sapApi
					.sapPlnr({
						plnr,
						zType: '001'
					}, 300)
					.then((res) => {
						if (res && res.RESULT.TYPE === 'S') {
							if (this.goodsList.some((item) => item.PLNR === plnr)) {
								setTimeout(() => {
									this.isFocus = true;
									this.isDisabled = false;
									this.wxparams = '';
								}, 1000);
								this.$u.toast('已经存在当前条码');
								return
							}
							const arr = [{
								...res.DATA[0],
								NLPLA: this.nlpla
							}]
							this.goodsList = this.goodsList.concat(arr);
							this.totalNum = 0;
							this.goodsList.forEach((ele) => {
								this.totalNum += ele.TOMNG - 0
								ele.cardNum = 0
							});
							this.handleData()
							setTimeout(() => {
								this.wxparams = '';
								this.isFocus = true;
								this.isDisabled = false;
							}, 1000);
						} else {
							setTimeout(() => {
								this.isFocus = true;
								this.isDisabled = false;
								this.wxparams = '';
							}, 1000);
							this.$u.toast(res.RESULT.MESSAGE);
						}
						this.loading = false;
					});
			},
			handleData() {
				this.chargaArr = this.goodsList.filter((item, index, self) => {
					return self.findIndex(t => t.CHARG === item.CHARG) === index;
				});
				this.chargaArr.forEach((ele, idx) => {
					this.goodsList.forEach(item => {
						if (ele.CHARG === item.CHARG) {
							ele.cardNum += (item.TOMNG - 0)
							this.$set(this.chargaArr, idx, {
								...ele
							})
						}
					});
				});
			},
		}
	};
</script>

<style lang="scss" scoped>
	.btn {
		padding: 20rpx;
		background: #fff;

		.topSearch {
			margin-bottom: 20rpx;
		}
	}

	.bottomBtn {
		position: sticky;
		padding: 20rpx;
		display: flex;
		justify-content: space-between;
		background: #fff;
		bottom: 0rpx;
		margin-top: 20rpx;

		.u-btn {
			width: 300rpx;
		}
	}

	.blue {
		color: #3f9dcc;
	}

	.total {
		background: #fff;
		color: #000;
		padding: 0rpx 40rpx;
		display: flex;
		justify-content: space-between;
		font-size: 32rpx;

		.line {
			margin: 0px 10rpx;
		}
	}

	.cardbox {
		min-height: calc(100vh - 540rpx);
		padding: 0rpx 20rpx;
		margin-top: 20rpx;
	}

	.cardContent {
		border-radius: 8px;
		background: #fff;
		margin-bottom: 20rpx;
	}

	/deep/ .u-sticky {
		top: 0 !important;
		background: #fff;
	}
</style>