<template>
	<view >
		<view v-if="data" class="receiveBody">
			<view class="titleValue1">
				<span class="title">商品编号：</span>
				<span class="value">{{orderNoList[0].bgGoodNo || '-'}}</span>
			</view>
			<view class="titleValue1">
				<span class="title">商品名称：</span>
				<span class="value">{{orderNoList[0].bgGoodName || '-'}}</span>
			</view>
			<view class="titleValue1">
				<span class="title">规&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;格：</span>
				<span class="value">{{orderNoList[0].bgSpecifications || '-'}}</span>
			</view>
			<view class='recommend'>
			  <text class='recommend-title'>收货数量确认</text>
			</view>
			<view class="orderList" v-for="item in orderNoList">
				<view class="titleValue">
					<span class="title">单据编号：</span>
					<span class="value">{{item.orderNo|| '-'}}</span>
				</view>
				<view class="titleValue">
					<span class="title">收货数量：</span>
						<view style="width: 80px;">
							<u-input v-model="item.actualQty" @input="changeValue" border placeholder="请输入件装量" width="110" @click="choosePackage">
							</u-input>	
						</view>
					<span class="title" style="margin-left: 15px;">未收：{{item.ableQty}}</span>
				</view>	
			</view>
			<view class="titleValue" style="margin-top: 44px;">
				<span class="title" style="font-size: 22px;font-weight: 600;width: 120px;">收货数量:</span>
				<span style="font-size: 22px;font-weight: 600;width: 120px;">{{receiptNum}}</span>
			</view>
			
			<view class="enter-button">
				<button class="smell-button" @click="confirmSave">确认收货</button>
			</view>
		<!-- 	<view class="footer">
				<u-button type="primary" @click="confirmSave">确认收货</u-button>
			</view> -->
		</view>
	<!-- 	<u-modal v-model="showNearFuture" :show-cancel-button="true" :mask-close-able="true" content="该商品为近效期商品，请确认是否继续收货">
			
		</u-modal>
		<u-modal v-model="showOverdue" :show-cancel-button="true" :mask-close-able="true" content="该商品已过期，请确认是否继续收货">

		</u-modal> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				showNearFuture: false,
				showOverdue: false,
				barCode: '',
				receivingStatusValue: '',
				reasonValue: '',
				receiptNum:0,
				dataForm: {
					packageQty: 0, //件装量
					actualQty: 0, //收货数量
					actualCaseQty: "", //整件数量
					batchNo: "", //批号
					actualPieceQty: 0, //零散数
					containerCode: "", //容器
					// productionDate: "请选择生产日期",
					// expiredDate: "请选择有效期",
					storageId: null, //库别id
					reason: "", //处理原因
					receivingStatus: "", //收货结论
				},
				goodId: "",
				storageName: "", //库别名称
				resust: false,
				receonclusion: false,
				kube: false,
				starttime: false,
				endtime: false,
				detailIds:[],
				allableQty:0,
				allactualQty:0,
				data: {
					businInOrderDVo: {
						ableQty: '',
					}
				}, //数据
				test: "",
				storageList: [], //库别下拉
				stockBasic: "", //库存基础信息
				dicOptions: [],
				packages: "", //包装数量
				recelist: [],
				resustlist: [],
				sid: '',
				detailId: '',
				toDay: null,
				dicOptions: [],
				// billsList:[
				// 			{
				// 				"orderNo":'PA2023090001',
				// 				"packageQty":55,
				// 				"ableQty":80
								
				// 			},
				// 			{
				// 				"orderNo":'PA2023090003',
				// 				"packageQty":66,
				// 				"ableQty":99
								
				// 			},
				// 		],
			};
		},
		onLoad: function(option) {
			// console.log(option);
			if (JSON.stringify(option) !== "{}") {
				if (option.packageQty !== null && option.packageQty !== undefined) {
					this.dataForm.packageQty = option.packageQty;
				} else {
					this.$u.vuex("vuex_sid", option.sid); //汇总id
					this.$u.vuex("vuex_detailId", option.detailId); //明细id
					this.$u.vuex("vuex_detailIds", option.detailIds); //明细ids
					this.$u.vuex("vuex_orderNoList", option.orderNoList); //明细ids
				}
			}
			this.sid = option?.sid
			this.detailId = option?.detailId
			this.detailIds =JSON.parse(option?.detailIds)
			this.orderNoList =JSON.parse(option?.orderNoList)
			// this.allableQty = option?.allableQty
			this.allactualQty = option?.actualQty
			if (option.packageId) {
				this.dataForm.packageId = option.packageId
			}
			this.changeValue()
			// this.loadList();
			this.loadStorageList(); //加载库别列表
			this.getDic(); //获取字典
	
	
		},
		methods: {
			changeValue(){
				// console.log(2222);	
				this.receiptNum=0
				this.orderNoList.forEach(item=>{
					this.receiptNum+=Number(item.actualQty)
				})
			},
			getDays(strDateStart, strDateEnd) {
				var strSeparator = "-";
				//日期分隔符   
				var oDate1;   var oDate2;   
				var iDays;
				oDate1 = strDateStart.split(strSeparator);
				oDate2 = strDateEnd.split(strSeparator);
				var strDateS = new Date(oDate1[0], oDate1[1] - 1, oDate1[2]);
				var strDateE = new Date(oDate2[0], oDate2[1] - 1, oDate2[2]);
				iDays = parseInt(Math.abs(strDateS - strDateE) / 1000 / 60 / 60 / 24)
				//把相差的毫秒数转换为天数   
				return iDays;
			},


			loadList() {
				this.$u.api.recevie.getOrder({
					sid: this.vuex_sid || this.sid,
					did: this.vuex_detailId || this.detailId,
					barCode: this.barCode
				}).then(res => {
					if(res.code===200) {
						// console.log(res);
						res.data.businInOrderDVo.ableQty=this.allableQty
						res.data.businInOrderDVo.actualQty=this.allactualQty
						this.data = res.data;
						this.test = res.data;
						if (res.data !== null) {
							// //加载包装资料，如果只有一条，直接加载件装量数据，如果有多条，需要点击件装量，从多条包装资料中选取一条
							this.goodId = this.data.businInOrderDVo.goodId;
							// 包装id
							this.dataForm.packageId = this.data.businInOrderDVo.packageId
							// 件装量
							this.dataForm.packageQty = this.data.businInOrderDVo.packageQty
							this.loadPackage();
						}
					} else {
						this.$u.toast(res.msg)
					}
					
				});
			},
			loadPackage() {
				this.$u.api.recevie.queryBasPackageByGoodId({
					goodId: this.goodId
				}).then(res => {
					if(res.code===200) {
						this.packages = res.data.length;
					} else {
						this.$u.toast(res.msg)
					}
				});
			},
			loadStorageList() {
				this.storageList = [];
				this.$u.api.storageList().then(res => {
					let dataArry = res.data;
					for (var i = 0; i < dataArry.length; i++) {
						var obj = {
							value: dataArry[i].id,
							label: dataArry[i].storageName,
						};
						this.storageList.push(obj);
					}
				});
			},
			//点击件装量
			choosePackage() {
			},
			//计算收货数量 = 件装量 * 件数 + 零散量
			sumActualQty(val) {
				this.dataForm.actualQty = val * this.dataForm.packageQty + Number(this.dataForm.actualPieceQty ? this.dataForm.actualPieceQty : 0)
			},
			// 零散数改变
			changePiece(val) {
				this.dataForm.actualQty = this.dataForm.packageQty * this.dataForm.actualCaseQty + Number(val)
			},
			//输入或扫描商品条码
			searchByGoodNo(val) {
				this.loadList();
			},
			choosedStartDate() {
				this.starttime = true
			},
			
			confirmKube(e) {
				this.kube = false
				this.storageName = e[0].label;
				this.dataForm.storageId = e[0].value
			},
			confirmClusion(e) {
				this.receonclusion = false
				this.dataForm.receivingStatus = e[0].value
				this.receivingStatusValue = e[0].label
			},
			confirmResult(e) {
				this.resust = false
				this.reasonValue = e[0].label
				this.dataForm.reason = e[0].value
			},
			getDic() {
				this.$u.api.getByDicType().then(res => {
					this.dicOptions = res.data;
				});
			},
			transUnit(unit) {
				for (let dic in this.dicOptions) {
					if (this.dicOptions[dic].dictValue === unit) {
						return this.dicOptions[dic].dictLabel;
					}
				}
			},
			//确认保存数据
			confirmSave() {
			for(var i=0;i<this.orderNoList.length;i++){
				if(this.orderNoList[i].actualQty === null
				|| this.orderNoList[i].actualQty === '' 
				|| this.orderNoList[i].actualQty === 0
				|| this.orderNoList[i].actualQty === undefined
				|| this.orderNoList[i].actualQty ==='undefined'){
					this.$u.toast('输入数量不能为0/空');
					return; 
				}
			}	for(var i=0;i<this.orderNoList.length;i++){
				if(this.orderNoList[i].actualQty > this.orderNoList[i].ableQty ){
					this.$u.toast('收货数量大于未收数量');
					return; 
				}
			}
				this.$u.api.recevie.multipleConfirmReceivingList(this.orderNoList).then((res) => {
					if (res.code === 200) {
						this.$u.toast('收货成功！');
						setTimeout(()=>{
							this.$u.route({
								url: 'pages/receive/index',
								type: 'navigateTo'
							})
						},1000)
						
						setTimeout()
						
					} else {
						this.$u.toast(res.msg);
					}
				})
				
				
			}
		}
	}
</script>

<style lang="scss">
	.orderList{
		margin: 22px 5px;
		.titleValue{
			
		.value{
			font-weight: 600;
		}
		}
	}
	.receiveBody{
		height: 550px;
	}
	.goodsNumber {
		padding: 20rpx 50rpx;
		display: flex;
		align-items: center;

		.goodsNumberCode {
			color: #333333;
			font-size: 36rpx;
			margin-right: 20rpx;
		}
	}

	.goodsInfo {
		width: 95%;
		margin: 0 auto;
		background-color: #f2f2f2;
		padding: 20rpx 30rpx;
		line-height: 40rpx;
		margin-bottom: 20rpx;

		.goodsInfoItem {
			display: flex;
			align-items: center;
			color: #333333;

			.goodsItemLabel {
				width: 120rpx;
				font-size: 24rpx;
			}

			.goodsItemValue {
				font-size: 28rpx;
				font-weight: 600;
			}
		}

		.itemsContend {
			display: flex;
			justify-content: space-between;

			.items {
				width: 50%;
				display: flex;
				font-size: 24rpx;
				color: #555555;

				.itemsLabel {
					width: 120rpx;
				}

				.itemsValue {}
			}
		}
	}
	
	.titleValue1 {
		display: flex;
		align-items: center;
		font-size: 28rpx;
		padding: 15px 50rpx;
		// margin: 15px 10px 15px 5px;
		
		.title {
			// color: red;
			width: 160rpx;
			text-align: left;
		}
	
		.value {
			color: #666666;
		}
	}

.recommend {
  text-align: center;
  height: 50rpx;
  margin-top: 80rpx;
  margin-bottom: 25px;
}

.recommend-title {
  display: table;
  width: 100%;
  line-height: 50rpx;
  white-space: nowrap;
  border-spacing: 2rem 0;
  font-size: 32rpx;
  color: gray
}
.recommend-title::before, .recommend-title::after {
  display: table-cell;
  content: "";
  width: 50%;
  background: linear-gradient(#eee, #eee) repeat-x center;
  
  background-size: 0.1rem 0.1rem;
}

	.titleValue {
		display: flex;
		align-items: center;
		font-size: 28rpx;
		padding: 0 50rpx;
		margin-bottom: 20rpx;

		.title {
			color: #555555;
			width: 160rpx;
			text-align: left;
		}

		.value {
			color: #666666;
		}
	}
	
	// .enter-button{
	// 	display: flex;
	// 	flex: 2;
	// 	height: 70px;
	// 	width: 100%;
	// 	z-index: 100px;
	// 	background-color: #fff;
	// 	position: fixed;
	// 	bottom: 0px;
	// 	.smell-button{
	// 		display: block;
	// 		margin: 19px auto;
	// 		height: 35px;
	// 		line-height: 35px;
	// 		width: 45%;
	// 		background-color: skyblue;
			
	// 	}
	// }
	.enter-button{
		display: flex;
		flex: 2;
		height: 70px;
		width: 100%;
		z-index: 100px;
		background-color: #fff;
		position: fixed;
		bottom: 0px;
		.smell-button{
			display: block;
			color: #fff;
			margin: 19px auto;
			height: 35px;
			line-height: 35px;
			width: 45%;
			background-color: #19be6b;
			
		}
	}
	.footer {
		padding: 20rpx 40rpx;
		display: flex;
		justify-content: space-between;
	}
</style>
