storage-wechat/pages/addQrcode/addBatch.vue

<template>
	<view class="addBatch">
		<uni-search-bar @confirm="getData" v-model="req.keyword" @cancel="reload">
		</uni-search-bar>
		<view class="dtl">
			<view class="">
				物料编码：{{option.code}}
			</view>
			<view class="">
				物料名称：{{option.name}}
			</view>
			<view class="">
				供应商：{{option.supplierName || '无'}}
			</view>
			<view class="">
				合同编号：{{option.purchaseBillNo}} <span>{{option.batch}}</span>
			</view>
			<view class="" style="color:#02A7F0">
				待入库：{{option.notArrivalQty}}
			</view>
		</view>
		<view class="addQrcode-list" v-for="(i,index) in req.stockTagList" :key="i,index">
			<view class="fl" @click="toRouter(index)">
				<view class="code">
					<view class="">
						编号:{{index + 1}}
					</view>
					<view class="">
						绑定数量:{{i.quantity * 1}}
					</view>
				</view>
			</view>
			<view class="fr">
				<uni-icons type="trash-filled" size="30" @click="delelte(index)"></uni-icons>
			</view>
		</view>
		<view class="" style="margin:40rpx">
			<button size="mini" type="default" style="width: 500rpx;margin: 0 auto;display: block;"
				@click="toggle('bottom','1')">
				添加明细
			</button>
			<button size="mini" type="default" style="width: 500rpx;margin: 30rpx auto;display: block;"
				@click="toggle('bottom','2')">
				批量添加
			</button>
			<uni-popup ref="popup" background-color="#fff">
				<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
					<view class="popup-input-warp">
						<uni-forms :modelValue="formData">
							<uni-forms-item label="绑定数量" name="name">
								<uni-easyinput type="number" v-model="formData.quantity" placeholder="请输入绑定数量" />
							</uni-forms-item>
							<uni-forms-item label="二维码个数" name="name" v-if="btnType == '2'">
								<uni-easyinput type="number" v-model="formData.num" placeholder="请输入二维码个数" />
							</uni-forms-item>
						</uni-forms>
						<button @click="submitForm">确定</button>
					</view>
				</view>
			</uni-popup>
			<!-- 提示信息弹窗 -->
			<uni-popup ref="message" type="message">
				<uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message>
			</uni-popup>
		</view>
		<button type="primary" style="margin: 0 30rpx;" @click="addBatch()">
			提交
		</button>
	</view>
</template>

<script>
	import {
		getInfo
	} from "@/util/api.js";
	export default {
		data() {
			return {
				listData: [],
				req: {
					keyword: null,
					materialId: null
				},
				option: {},
				formData: {
					number: 1,
					quantity: 0,
				},
				req: {
					stockTagList: [],
					purchaseContractDetailsId: null,
				},
				btnType: 1,
			}
		},
		onLoad(option) {
			const v = this
			v.option = JSON.parse(decodeURIComponent(option.data))
			console.log(v.option)
			v.req.purchaseContractDetailsId = v.option.contractDetailsId


		},
		methods: {
			delelte(index){
				this.req.stockTagList.splice(index,1)
			},
			addBatch(){
				const v = this
				if (v.req.stockTagList.length == 0) {
					uni.showToast({
						icon: "error",
					 title: '请添加明细',
						duration: 2000
					});
					return
				}
				uni.showToast({
					icon: "loading",
					title: '加载中',
					duration: 2000
				});
				v.$post('/wx/createQrcode/addBatch',v.req).then(res=>{
					if(res.code == 200){
						uni.showToast({
							title:'生成成功，跳转中！'
						})
						setTimeout(()=>{
							wx.reLaunch({
								url: '/pages/home'
							})
						},1500)
					}
					
				})
			},
			submitForm() {
				const v = this
				if (v.formData.quantity == 0) {
					uni.showToast({
						icon: "none",
					 title: '请输入绑定数量',
						duration: 2000
					});
					return
				}
				var total = 0
				for (var i = 0; i < v.req.stockTagList.length; i++) {
					total += v.req.stockTagList[i].quantity * 1
					
				}
				if (v.btnType == 1) {
					if((total + v.formData.quantity * 1) > v.option.notArrivalQty * 1.05){
						uni.showToast({
							icon: "none",
							title: '已超过总数的105%,请重新输入',
							duration: 2000
						});
						return
					}
					v.req.stockTagList.push({
						quantity: v.formData.quantity
					})

				} else {
					if((total + v.formData.quantity * v.formData.num)  > v.option.notArrivalQty * 1.05){
						uni.showToast({
							icon: "none",
							title: '已超过总数的105%,请重新输入',
							duration: 2000
						});
						return
					}
					if (v.formData.num == 0 || !v.formData.num) {
						uni.showToast({
							icon: "none",
							title: '请输入二维码个数',
							duration: 2000
						});
						return
					}
					for (var i = 0; i < v.formData.num; i++) {
						v.req.stockTagList.push({
							quantity: v.formData.quantity
						})
					}
				}
				console.log(v.req.stockTagList)
			},
			toggle(type, btnType) {
				this.type = type
				this.btnType = btnType
				console.log(this.btnType)
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup.open(type)
			},

			reload() {
				this.req.keyword = null
				this.getData()
			},
			getData() {
				const v = this
				v.$post('/wx/createQrcode/getPurchaseByMaterialIdList', v.req).then(res => {
					v.listData = res.data

				})
			},
			toRouter(i) {
				const v = this
				console.log(i)
				v.option = Object.assign(v.option, v.listData[i])
				uni.navigateTo({
					url: '/pages/addQrcode/addBatch?data=' + encodeURIComponent(JSON.stringify(v.option))
				})
				// uni.navigateTo({
				// 	url: '/pages/addQrcode/selectQrcode?id=' + i.materialId
				// })
			},
		},
	}
</script>

<style lang="less">
	.addBatch {
		font-size: 28rpx;

		.dtl {
			padding: 30rpx;
			border-bottom: 1rpx solid #dcdcdc;
		}

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

			.fl {
				display: flex;
				padding-left: 20rpx;

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

			.fr {
				line-height: 100rpx;
			}
		}
	}

	.popup-input-warp {
		padding: 30rpx 40rpx;
	}
</style>