<template>
	<view class="goIn">
		<view class="" style="padding-bottom:300rpx">
			
			<view class="dtl" v-if="isScanCode">
				<view class="">
					二维码编号：{{dtlData.qrCode}}
				</view>
				<view class="">
					物料编码：{{dtlData.materialCode}}
				</view>
				<view class="">
					物料名称：{{dtlData.materialName}}
				</view>
				<view class="">
					绑定数量：{{dtlData.quantity}}
				</view>
				<view class="">
					绑定时间：{{dtlData.createTime}}
				</view>
				<view class="">
					供应商：{{dtlData.supplierName}}
				</view>
				<view class="">
					合同编号：{{dtlData.purchaseBillNo}} <span style="margin-left: 20rpx;">批次号：{{dtlData.batchNo}}</span>
				</view>
			</view>
			<view class="commons-title">
				入库明细
			</view>
			<view class="addQrcode-list" v-for="(i,index) in qrCodeList" :key="i,index">
				<view class="fl" @click="toRouter(index)">
					<view class="code">
						<view class="">
							二维码编号:{{i.qrCode}}
						</view>
						<view class="" style="margin-top: 20rpx;">
							绑定数量:{{i.quantity}}
						</view>
					</view>
				</view>
				<view class="fr">
					<uni-icons type="trash-filled" color="red" size="30" @click="delelte(index)"></uni-icons>
				</view>
			</view>
			<button size="mini" type="default" style="width: 500rpx;margin: 30rpx auto;display: block;"
				@click="scanCode(true)">
				扫码添加
			</button>
		</view>
		<view class="submit-box">
			<view class="" style="line-height: 80rpx;text-align: center;">
				合计：{{quantitytol}} | {{qrCodeList.length}}件
			</view>
			<picker @change="bindPickerChange"  :range="stockHouseData" range-key="name">
				<button style="background: #0066CC;color:#fff;margin-bottom: 30rpx;">提交</button>
			</picker>
		</view>
		<uni-popup ref="popup" background-color="#fff" :is-mask-click="false">
			<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
				<view class="popup-input-warp">
					<view class="commons-title">
						扫码入库
					</view>
					<view class="" style="margin: 20rpx;">
						请选择入库类型
					</view>
					<button
						v-if="userData.roleKey == 'storekeeper' || userData.roleKey == ' supervisor' || userData.roleKey == 'admin'"
						style="background: #0066CC;color:#fff;margin-bottom: 30rpx;" @click="scanCode">到货入库</button>
					<button @click="toWithdrawal">退仓</button>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import {
		getInfo
	} from "@/util/api.js";
	import Vue from 'vue'
	export default {
		data() {
			return {
				listData: [],
				formData: {
					number: 0,
					quantity: 0,
				},
				req: {
					qrCodeList: [],
					stockHouseId: null,
				},
				btnType: 1,
				isScanCode: false,
				userData: {},
				dtlData: null,
				qrCodeList:[],
				index: 0,
				stockHouseData:[],
				quantitytol:0,
			}
		},
		onLoad(option) {
			const v = this
			this.$refs.popup.open('bottom')
			v.userData = Vue.prototype.$userInfo
			v.$post('/wx/common/getStockHouse',{}).then(res=>{
				v.stockHouseData =  res.data
			})
		},
		methods: {
			toWithdrawal(){
				const v = this
				uni.navigateTo({
					url: '/pages/goIn/withdrawal'
				})
			},
			delelte(index){
				const v = this
				uni.showModal({
					title:"提示",
					content:"你确定删除此信息么？",
					success(res) {
						if(res.confirm){
							v.quantitytol =  v.quantitytol - v.qrCodeList[index].quantity
							v.qrCodeList.splice(index,1)
						}
					}
				})
				
			},
			bindPickerChange(e){
				const v = this
				if(v.qrCodeList.length == 0){
					uni.showToast({
						icon: "error",
						title: '请添加物料信息',
						duration: 2000
					});
					return
				}
				v.req.qrCodeList = []
				v.req.stockHouseId = v.stockHouseData[e.detail.value].id
				for (var i = 0; i < v.qrCodeList.length; i++) {
					v.req.qrCodeList.push(v.qrCodeList[i].qrCode)
				}
				v.$post('/wx/codeScanIn/addWarehousingInfo',v.req).then(res=>{
					if(res.code == 200){
						uni.showToast({
							title:'入库成功，跳转中！'
						})
						setTimeout(()=>{
							wx.reLaunch({
								url: '/pages/home'
							})
						},1000)
					}
					console.log(res)
				})
				console.log(v.req)
			},
			scanCode(_isReload) {
				const v = this
				uni.scanCode({
					onlyFromCamera: true,
					success: function(res) {
						uni.showToast({
							icon: "loading",
							title: '加载中',
							duration: 1500
						});
						v.$post('/wx/common/gerMaterialInfoByQrcode', {
							qrCode: res.result
						}).then(res => {
							if(res.data.stockHouseId){
								uni.showToast({
									icon:'none',
									title: '此物料已入库',
									duration: 2000
								});
								return
							}
							if (v.dtlData) {
								for (var i = 0; i < v.qrCodeList.length; i++) {
									if(v.qrCodeList[i].qrCode == res.data.qrCode){
										uni.showToast({
											icon:'none',
											title: '此二维码已扫描',
											duration: 2000
										});
										return
									}
								}
								if(v.dtlData.purchaseBillNo != res.data.purchaseBillNo){
									uni.showToast({
										icon:'none',
										title: '合同不一致！',
										duration: 2000
									});
									return
								}
								if(v.dtlData.materialCode != res.data.materialCode){
									uni.showToast({
										icon:'none',
										title: '物料编码不一致！',
										duration: 2000
									});
									return
								}
								if(v.dtlData.batchNo != res.data.batchNo){
									uni.showToast({
										icon:'none',
										title: '批次不一致！',
										duration: 2000
									});
									return
								}
							} else {
								v.dtlData = res.data
							}
							
							v.quantitytol = res.data.quantity + v.quantitytol
							v.qrCodeList.push(res.data)
							v.isScanCode = true
							v.$refs.popup.close()
							if(_isReload){
								v.scanCode(_isReload)
							}
						})
					}
				});
			},


		},
	}
</script>

<style lang="less">
	.popup-input-warp {
		padding: 30rpx 40rpx;
	}

	.submit-box {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		padding: 0 30rpx;
		background: #fff;
	}

	.dtl {
		padding: 30rpx;
		border-bottom: 1rpx solid #dcdcdc;
		font-size: 26rpx;
		line-height: 40rpx;
	}

	.addQrcode-list {
		height: 80rpx;
		display: flex;
		justify-content: space-between;
		padding: 15rpx;
		border-bottom: 1rpx solid #dcdcdc;
		font-size: 24rpx;

		.fl {
			display: flex;

			.code {
				margin-right: 20rpx;
			}
		}

		.fr {
			line-height: 80rpx;
		}
	}
</style>
