emis-app/pages/post/updateBillPicture.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="请输入或扫码"
								@change="handleScanValChange" iconPos="left"></tpx-scan-input>
						</view>
					</u-row>
					
					<view class="mt-20">
						<bpe-goodphoto-tmp title="照片" :value="submitParam" filedName="fileUrl"></bpe-goodphoto-tmp>
					</view>
					
				</view>
			</template>
			
			<template v-slot:footer>
				<view class="pos-rlt blcok-white" style="border-radius: 0;margin-top: 0;">
					<u-row>
						<u-button @click="handleSubmit" 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 BpeGoodphotoTmp from "@/components/buns-post-edit-templates/bpe-goodphoto-tmp"
	import { debounce } from "@/common/util"
	import dayjs from "dayjs"
	import * as apiService from "@/common/api"
	import { scanTypeEnum, getScanParams, ansScanResponse } from "@/common/scanUtil"
	import { checkParams } from "@/common/validate"
	
	// attachType: 0-商品图片 1-寄件图片 2-签收图片 3-清关文件
	const pageTypeMap = {
		'1': {
			title: '货物图片',
			extData: {
				attachType: 0
			},
		},
		'2': {
			title: '签收图片',
			extData: {
				attachType: 2
			},
		}
	}
	
	export default {
		components:{ BpeGoodphotoTmp },
		props: {
		},
		computed: {
			dicData() {
			  return this.$store.getters.dicData
			},
		},
		data() {
			return {
				queryOption: {
					type: '', // 1 货物； 2 签收
					billCode: '', // 运单id
				},
				curPageType: {},
				submitParam: {
					billCode: "",
					fileUrl: [],
				},
				submitValidConfig: {
					fileUrl: { required: true, requiredMsg: '图片不能为空' },
					// dispatchOrSendManCode: { required: true, requiredMsg: '请选择派件员' },
					billCode: { required: true, requiredMsg: '运单号不能为空' },
				},
				paiRes: { list: [] },
			}
		},
		onShareAppMessage() {
			return {
			}
		},
		onLoad(option) {
			this.queryOption = option
			this.initData();
		},
		onUnload() {

		},
		methods: {
			getRSDStaffList: apiService.getRSDStaffList,
			initData() {
				this.submitParam.billCode = this.queryOption.billCode
				this.curPageType = pageTypeMap[this.queryOption.type]
				this.setNavigationBarTitle(this.curPageType.title)
			},
			handleScanValChange: debounce(function(val){
				
			}),
			async handleSubmit() {
				await checkParams(this.submitParam, this.submitValidConfig)
				let extParams = {
					...this.curPageType.extData
				}
				extParams.fileUrl = this.submitParam.fileUrl?.join?.(",") || ''
				await apiService.uploadWaybillAttach({ ...this.submitParam, ...extParams, _loading: true })
				this.showToast('操作成功')
				this.resetForm()
			},
			resetForm() {
				this.submitParam = {
					fileUrl: [],
					billCode: ''
				}
			}
		}
	}
</script>

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

	page {
		background-color: #F6F6F6;
		height: 100% !important;
	}
</style>
<style scoped lang="scss">
	.yditem{
		padding: 20rpx 0;
		border-top: 2px solid #F6F6F6;
	}
</style>