emis-app/pages/tms/coPackingScanning.vue

<template>
	<tpx-page>
		<tpx-layout>
			<template v-slot:body>
				<view class="blcok-white-noradius" style="margin-top: 0;">
					<u-row justify="between">
						<view style="flex:1;">
							<tpx-scan-input v-model:value="submitParam.billCode" placeholder="运单号, 请输入或扫码"
								phyTrigger="focus" @scanChange="handleScanValChange" :showConfirm="true" @confirmClick="handleScanValChange" iconPos="left"></tpx-scan-input>
						</view>
					</u-row>
					<u-row custom-style="margin-top:20rpx;">
						<view style="flex: 1;">
							<tpx-select v-model:resObject="siteRes" :getListFun="getNextStationList" :transKeyVal="{valKey: 'destSite',titleKey: 'destSiteName'}" v-model:value="submitParam.preOrNextStationCode" mode="drop" placeholder="请选择下一网点"></tpx-select>
						</view>
					</u-row>
					<u-row custom-style="margin-top:20rpx;">
						<view style="flex: 1;">
							<tpx-scan-input v-model:value="submitParam.bagNo" placeholder="合包号, 请输入或扫码"
								phyTrigger="focus" iconPos="left"></tpx-scan-input>
						</view>
						<!-- <view class="pl-10">
							<u-button  @click="handleCreatePaNo()"
								custom-style="font-size: 28rpx;padding:0 10rpx;height: 74rpx;" :plain="true" >系统生成</u-button>
						</view> -->
					</u-row>
					<u-row custom-style="margin-top:20rpx;">
						<tpx-input v-model:value="submitParam.scanWeight" placeholder="合包重量" _digit="5" suffix="KG"></tpx-input>
					</u-row>
					
					<view class="mt-20">合包件数：{{resData.list.length}}</view>
					
					<u-button @click="handleSubmit" custom-style="height:74rpx;font-size: 28rpx;margin-top: 30rpx;" type="primary">合包完成</u-button>
				</view>
				
				<view class="blcok-white-noradius">
					<bo-operator-tmp :list="resData.list">
						<template v-slot:titleRight>
						</template>
					</bo-operator-tmp>
				</view>
				
				
				<view class="blcok-white-noradius">
					<bo-scanlist-tmp :resData="resData" :canDel="true"></bo-scanlist-tmp>
				</view>
				
			</template>
			<!-- <template v-slot:footer>
				<view class="pos-rlt blcok-white" style="border-radius: 0;margin-top: 0;">
					<u-row>
						<u-button size="large" shape="circle"
							custom-style="width: 500rpx;height:80rpx;font-size: 30rpx;" type="primary">打印合包条码</u-button>
					</u-row>
				</view>
			</template> -->
		</tpx-layout>
	</tpx-page>
</template>

<script>
	import { debounce } from "@/common/util"
	import dayjs from "dayjs"
	import BoOperatorTmp from "@/components/buns-order-templates/bo-operator-tmp"
	import BoScanlistTmp from "@/components/buns-order-templates/bo-scanlist-tmp"
	import * as apiService from "@/common/api"
	import { scanTypeEnum, getScanParams, ansScanResponse, preCheckScan, confirmScanUpload } from "@/common/scanUtil"
	import { checkParams } from "@/common/validate"
	
	export default {
		components:{ BoOperatorTmp, BoScanlistTmp },
		props: {
			// hasLeftWin: {
			// 	type: Boolean
			// }
		},
		computed: {
			
		},
		data() {
			return {
				queryOption: {
					billCode: '', // 运单id
				},
				resData: { list: [] },
				siteRes: { list: [] },
				cpackRes: { list: [] },
				submitParam: {
					billCode: '',
					preOrNextStationCode: '',
					bagNo: '',
					scanWeight: ''
				},
				submitValidConfig: {
					preOrNextStationCode: { required: true, requiredMsg: '请选择下一网点' },
					bagNo: { required: true, requiredMsg: '请选择合包号' },
					scanWeight: { required: true, requiredMsg: '合包重量不能为空' },
					billCode: { required: true, requiredMsg: '运单号不能为空' },
				},
			}
		},
		onShareAppMessage() {
			return {
			}
		},
		onLoad(option) {
			this.queryOption = option
			this.initData();
		},
		onUnload() {
		
		},
		methods: {
			getNextStationList: apiService.getNextStationList,
			getPackCodeList: apiService.getPackCodeList,
			initData() {
				this.submitParam.billCode = this.queryOption.billCode
			},
			async handleCreatePaNo() {
				let res = await apiService.getPackNo()
				this.submitParam.bagNo = res.data
			},
			async handleSubmit() {
				let extParam = {}
				let param = JSON.parse(JSON.stringify(this.submitParam))
				param.billCode = this.resData.list.map(t=>t.billCode).join(",")
				await checkParams(param, this.submitValidConfig)
				let scCfBl = await confirmScanUpload({ scanType: scanTypeEnum.heBao, param,  list: this.resData.list })
				if(scCfBl) {
					this.showToast('合包操作成功')
					this.resetForm()
				}
			},
			handleScanValChange: debounce(async function(){
				let preBl = await preCheckScan({ scanType: scanTypeEnum.heBao, param: { ...this.submitParam },  list: this.resData.list })
				if(preBl) {
					this.submitParam.billCode = ''	
				}
			}),
			resetForm() {
				this.submitParam = {
					billCode: '',
					preOrNextStationCode: '',
					bagNo: '',
					scanWeight: ''
				}
				this.resData.list = []
			}
		}
	}
</script>

<style lang="scss">
	@import '@/common/uni-nvue.scss';

	page {
		background-color: #F6F6F6;
		height: 100% !important;
	}
</style>
<style scoped lang="scss">
	.yditem{
		margin-top: 20rpx;
		padding: 20rpx;
		border-radius: 20rpx;
		background-color: #F6F6F6;
		&:first-child{
			margin-top: 0;
		}
		.lbwth{
			display: inline-block;
			width: 120rpx;
		}
	}
</style>