cy_pda/pages/smallStore/bind.vue

<template>
	<div>
		<u-input class="input" v-model="containerCode" border type="text" placeholder="请扫描周转箱条码"
			placeholder-style="color:#666666" />

		<u-table border class="table">
			<u-tr>
				<u-th width="10%">序号</u-th>
				<u-th width="50%">任务号</u-th>
				<u-th width="10%">品规数</u-th>
				<u-th width="30%">周转箱条码</u-th>
			</u-tr>
			<!-- style="background-color: #3eaf7c;" -->
			<u-tr v-for="(item, index) in resultList" :key="item.pickOrderId" style="height: 80rpx">
				<u-td width="10%">{{ index +1 }}</u-td>
				<u-td width="50%">{{ item.pickOrderId }}</u-td>
				<u-td width="10%">{{item.specificationsQty}}</u-td>
				<u-td width="30%">
					<u-input type="text" v-model="item.containerCode"/>
				</u-td>
			</u-tr>
		</u-table>
		<div class="order">
			<span class="orderText">挑货顺序</span>
			<div>
				<div class="orderInput">
					<u-input v-model="wareHouse" border type="select" placeholder="请选择顺序" prop="wareHouse"
						@click="show = true" />
					<u-select v-model="show" :list="list" @confirm="confirm"></u-select>
				</div>
				<div class="orderTip">正序：从区域内最小货位开始拣货</div>
				<div class="orderTip">倒序：从区域内最大货位开始拣货</div>
			</div>
		</div>
		<view class="footer">
			<u-button type="success" @click="checkOutPick()">刷新</u-button>
			<u-button type="primary" @click="bindTask()">开始拣选</u-button>
		</view>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				wareHouse: '',
				wareHouseValue: '',
				containerCode: '',
				list: [{
						label: '正序',
						value: 0
					},
					{
						label: '倒序',
						value: 1
					}
				],
				resultList: []
			}
		},
		onLoad: function(options) {
			this.resultList = JSON.parse(options.list).map((item)=>({...item,containerCode: null }))
			// console.log(JSON.parse(options.list))
		},
		methods: {
			checkOutPick() {
				this.$u.api.pickingManage.checkOutPick({
					taskType: 0
				}).then(res => {
					if(res.code===200) {
						//  进入索取页面
						if(res.data.pickType===200) {
							// 零货
							this.$u.route({
								url: 'pages/smallStore/index',
								type: 'navigateTo',
								params: {
									list: JSON.stringify(res.data.taskStaticList)
								}
							})
						}
						//进入拣货页面
						if(res.data.pickType===800) {
							// 零货
							this.$u.route({
								url: 'pages/smallStore/picking',
								type: 'navigateTo',
								params: {
									list: JSON.stringify(res.data.businOutPickDTaskVo),
									container: JSON.stringify(res.data.containrList)
								}
							})
						}
						// 进入绑定周转箱页面
						if(res.data.pickType===801) {
							// 零货
							this.$u.route({
								url: 'pages/smallStore/bind',
								type: 'navigateTo',
								params: {
									list: JSON.stringify(res.data.taskAndContainerList)
								}
							})
						}
					}
					
				});
			},
			confirm(e) {
				this.wareHouse = e[0].label
				this.wareHouseValue = e[0].value
			},
			// 任务和周转箱进行绑定
			bindTask() {
				const list = this.resultList.map((item)=>({
					...item,
					pickSortType: this.wareHouseValue
				}))
				this.$u.api.pickingManage.relatePickTaskAndContainer(list).then(res => {
					console.log(res)
					if (res.code === 200) {
						this.$u.toast("绑定成功！");
						this.checkOutPick()
					} else {
						this.$u.toast(res.msg);
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	.input {
		width: 90%;
		margin: 20rpx auto;
	}

	.table {
		width: 90%;
		margin: 40rpx auto;
	}

	.order {
		display: flex;
		width: 90%;
		margin: 20rpx auto;
	}

	.orderText {
		margin-top: 10rpx;
		margin-right: 40rpx;
	}

	.orderInput {
		display: flex;
	}

	.orderTip {
		font-size: 28rpx;
		color: #333333;
		margin-top: 20rpx;
	}

	.footer {
		position: fixed;
		width: 100%;
		bottom: 20rpx;
		display: flex;
		align-items: center;
	}
</style>