emis-app/pages/tms/customsClearanceScanning.vue
2024-05-30 18:33:54 +08:00

150 lines
3.7 KiB
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>
<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" :isWhite="true" placeholder="请选择下一网点"></tpx-select>
</view>
</u-row>
<view class="mt-30">
<u-button @click="handleSubmit()" type="primary" size="large" shape="square"
custom-style="height:80rpx;font-size: 30rpx;border-radius: 14rpx;">确定</u-button>
</view>
</view>
<view class="blcok-white-noradius">
<bo-operator-tmp :list="resData.list"></bo-operator-tmp>
</view>
<view class="blcok-white-noradius">
<tpx-scroll-view v-model:resObject="resData"
>
<view class="">
<view class="pb-20">
<u-row>
<u-col span="8">
<text class="font-weight">运单号</text>
</u-col>
<u-col span="4">
<text class="font-weight">扫描时间</text>
</u-col>
</u-row>
</view>
<view v-for="(item, index) in resData.list" class="yditem">
<u-row>
<u-col span="8">
<text class="">{{item.billCode}}</text>
</u-col>
<u-col span="4">
<text class="clr-sub">{{item.scanDate}}</text>
</u-col>
</u-row>
</view>
</view>
</tpx-scroll-view>
</view>
</template>
<template v-slot:footer>
</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 * as apiService from "@/common/api"
import { scanTypeEnum, getScanParams, ansScanResponse } from "@/common/scanUtil"
export default {
components:{ BoOperatorTmp },
props: {
},
computed: {
},
data() {
return {
submitParam: {
billCode: '',
preOrNextStationCode: '',
},
pageLoading: true,
queryOption: {
billCode: '', // 运单id
},
resData: {
list: []
},
siteRes: {
list: []
},
curScanItem: {},
}
},
onShareAppMessage() {
return {
}
},
onLoad(option) {
this.queryOption = option
this.initData();
},
onUnload() {
},
methods: {
getNextStationList: apiService.getNextStationList,
initData() {
this.submitParam.billCode = this.queryOption.billCode
},
async handleSubmit(val) {
let extParam = {}
val && (extParam.billCode = val);
let scnParam = getScanParams(scanTypeEnum.qingGuan, { ...this.submitParam, ...extParam })
let res = await apiService.scanRecord({...scnParam, _loading: true})
let { bl, resItem } = ansScanResponse({ res, title: "清关" })
if(bl) {
this.curScanItem = resItem
this.resData.list.unshift({ ...resItem })
this.resetForm()
}
},
handleScanValChange: debounce(function(val){
val && (this.handleSubmit(val))
}),
resetForm() {
this.submitParam.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>