emis-app/pages/tabBar/order/order.vue
2024-09-02 14:01:37 +08:00

343 lines
9.2 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<tpx-page>
<tpx-layout>
<template v-slot:header>
<view class="">
<view class="" style="padding: 20rpx;background-color:#B12D29;border-radius: 0;">
<u-row v-if="staticDataList.length > 0" justify="between">
<template v-for="(mbItem, mIndex) in staticDataList">
<u-row>
<text class="clr-wht font-26" style="opacity: 0.8;">{{mbItem.title}}</text>
<text class="pl-10 clr-wht font-38 font-weight">{{mbItem.subTitle}}</text>
</u-row>
</template>
</u-row>
</view>
</view>
<view class="com-jianju" style="padding-top: 16rpx;">
<u-row justify="between">
<view style="width: 140rpx;" class="font-weight">运单号</view>
<view style="flex:1;">
<tpx-scan-input v-model:value="searchParam.billCode" placeholder="请输入或扫码"
@scanChange="handleSearch" iconPos="right"></tpx-scan-input>
</view>
</u-row>
<u-row justify="between" custom-style="margin-top:16rpx;">
<view style="width: 140rpx;" class="font-weight">日期</view>
<view style="flex:1;">
<tpx-date-input v-model:value="searchParam._date" placeholder="请选择时间"></tpx-date-input>
</view>
</u-row>
<view class="mt-20">
<u-button type="primary" size="large" shape="square" plain="true" @click="handleSearch"
custom-style="height:66rpx;font-size: 30rpx;border-radius: 14rpx;">查询</u-button>
</view>
</view>
<view class="com-jianju" style="padding-top: 16rpx;">
<u-row justify="between" align="top">
<u-col span="12">
<!-- 订单状态 -->
<tpx-tabs :list="dicData.emis_waybill_stat_type"
v-model:value="searchParam.params.waybillStatType" @tabchange="handleSearch"
v-slot="curOrdTab">
<text slot>
(<text>{{ staticInfo.orderStat[curOrdTab.item.val] || 0 }}</text>)
</text>
</tpx-tabs>
</u-col>
</u-row>
</view>
</template>
<template v-slot:body>
<view class="pos-abt-all">
<tpx-scroll-view v-model:resObject="resData" :searchParam="searchParam" :getListFun="getListFun"
ref="listRef" :autoReload="false" @onListReload="listenListReload">
<view class="pgb-cont">
<!-- 列表数据 -->
<view v-for="(item) in resData.list" class="ord-list-item">
<view class="mt-10">
<bpd-send-reciever-tmp :value="item" :showInfoBtn="false"></bpd-send-reciever-tmp>
</view>
<u-line color="#DEDEDE" margin="30rpx 0 0 0"></u-line>
<u-row justify="end" custom-style="margin-top:20rpx;">
<view style="display: inline-block;white-space: nowrap;">
<u-row>
<u-button v-if="item.pickupMethod == 1 && item.intoWarehouseBillCode"
@click="handleDealItem(item, { type: 6 })" shape="circle" type="primary"
:plain="true" custom-style="height: 54rpx;margin-left: 12rpx;">进仓单</u-button>
<template v-if="item.orderStatus == 0">
<u-button @click="handleDealItem(item, { type: 2 })" shape="circle"
type="primary" :plain="true" custom-style="height: 54rpx;margin-left: 12rpx;">接单</u-button>
<u-button @click="handleDealItem(item, { type: 3 })" shape="circle"
type="primary" :plain="true" custom-style="height: 54rpx;margin-left: 12rpx;">取消</u-button>
</template>
<template v-if="item.orderStatus == 1">
<u-button v-if="item.waybillStatus == 0"
@click="handleDealItem(item, { type: 2 })" shape="circle"
type="primary" :plain="true" custom-style="height: 54rpx;margin-left: 12rpx;">立即开单</u-button>
<u-button v-if="item.waybillStatus == 0"
@click="handleDealItem(item, { type: 4 })" shape="circle"
type="primary" :plain="true" custom-style="height: 54rpx;margin-left: 12rpx;">揽收</u-button>
<u-button v-if="item.waybillStatus == 40"
@click="handleDealItem(item, { type: 5 })" shape="circle"
type="primary" :plain="true" custom-style="height: 54rpx;margin-left: 12rpx;">签收扫描</u-button>
</template>
</u-row>
</view>
</u-row>
</view>
</view>
</tpx-scroll-view>
</view>
</template>
</tpx-layout>
<tpx-com-dialog v-model:show="cancelModal.show" ref="cancelRef" title="确认取消">
<template v-slot:body>
<u-textarea v-model="cancelModal.data.orderRemark" border="surround" height="120" placeholder="请输入"
maxlength="300" count></u-textarea>
</template>
</tpx-com-dialog>
</tpx-page>
</template>
<script>
import {
dateRangeList
} from "@/common/enum"
import * as apiService from "@/common/api"
import BpdSendRecieverTmp from "@/components/buns-post-detail-templates/bpd-send-reciever-tmp"
import {
getAuthList,
authCodeEnum
} from "@/common/authCode"
export default {
props: {},
computed: {
dicData() {
return this.$store.getters.dicData
},
staticDataList() {
let {
commStat
} = this.staticInfo
let list = [{
title: '待处理订单',
subTitle: commStat.waitDoNum || 0,
url: '',
code: authCodeEnum.dingDanGaiKuang
},
{
title: '累计处理订单',
subTitle: commStat.hasDoNum || 0,
url: '',
code: authCodeEnum.dingDanGaiKuang
}
]
list = getAuthList({
list,
_thisPage: this
})
return list
},
},
components: {
BpdSendRecieverTmp
},
data() {
let {
dicData
} = this.$store.getters
return {
authCodeEnum,
...JSON.parse(JSON.stringify({
dateRangeList
})),
searchParam: {
billCode: '',
_date: [],
params: {
waybillStatType: dicData?.emis_waybill_stat_type?.[0]?.val,
}
},
queryOption: {
},
staticInfo: {
commStat: {},
orderStat: {},
},
resData: {
list: []
},
cancelModal: {
show: false,
data: {
orderRemark: ''
}
}
}
},
onShareAppMessage() {
return {
// title: '',
// path: 'TODO'
}
},
onShow() {
this.triggerListReload()
this.initData()
},
onLoad(option) {
this.queryOption = option
},
onUnload() {},
methods: {
transSearchPm(param) {
let cpParam = JSON.parse(JSON.stringify(param))
cpParam.params.beginDate = cpParam?._date?.[0]
cpParam.params.endDate = cpParam?._date?.[1]
return cpParam
},
async getListFun(param) {
let cpParam = this.transSearchPm(param)
let res = await apiService.getOrderList(cpParam)
return res
},
initData() {
},
handleSearch() {
setTimeout(() => {
this.triggerListReload()
}, 300)
},
listenListReload(params) {
// list重置到第一页,需重新查询统计数据
this.getStaticData(params)
},
async getStaticData(params) {
let cpParam = this.transSearchPm(params)
const staRes = await apiService.getWaybillStatMap(cpParam)
let {
hasDoNum,
waitDoNum,
statNumList
} = staRes.data
this.staticInfo.commStat = {
hasDoNum,
waitDoNum
}
let orderStat = {}
statNumList.map(t => {
orderStat[t.statType] = t.statNum
})
this.staticInfo.orderStat = orderStat
},
triggerListReload() {
this?.$refs?.listRef?.getDataList?.(true) // 重置到第一页数据
},
async handleDealItem(item, deal = { type: '1' }) {
let itemQuery = `?billCode=${item.billCode || ''}&orderSn=${item.orderSn || ''}`
switch (deal.type) {
case 1: // 接单
let conBl = await this.confirmModal('确认要接单吗?')
if (conBl) {
await apiService.confirmOrder({
orderSn: item.orderSn
})
this.showToast('操作成功')
this.triggerListReload()
}
break;
case 2: // 立即开单
this.goto(`post/openorder${itemQuery}`)
break;
case 3: // 取消
let canBl = await this.$refs.cancelRef.getConfirmResult()
if (canBl) {
await apiService.cancelOrder({
orderSn: item.orderSn,
...this.cancelModal.data
})
this.triggerListReload()
}
this.cancelModal.data = {}
this.cancelModal.show = false
break;
case 4: // 揽收
this.goto(`deliveryDeal/pickUp${itemQuery}`)
break;
case 5: // 签收扫描
this.goto(`deliveryDeal/signedScanning${itemQuery}`)
break;
case 6: // 进仓单详情
this.goto(`warehousing/detail${itemQuery}&inNo=${item.intoWarehouseBillCode}`)
break;
default:
break;
}
}
}
}
</script>
<style lang="scss">
@import '@/common/uni-nvue.scss';
page {
background-color: #fff !important;
height: 100% !important;
}
</style>
<style scoped lang="scss">
.pgb-cont {
padding: 30rpx;
}
.ord-list-item {
border: 2px solid #F6F6F6;
box-shadow: 0rpx 3rpx 12rpx 0rpx rgba(139, 139, 139, 0.06);
border-radius: 20rpx;
padding: 22rpx 30rpx;
background-color: #fff;
margin-bottom: 30rpx;
}
.search-more-panel {
overflow: hidden;
position: absolute;
left: 0;
right: 0;
height: calc(70vh);
z-index: 200;
}
.smp-body {
padding: 30rpx;
display: flex;
flex-direction: column;
height: 100%;
background-color: #FFF;
border-radius: 0 0 30rpx 30rpx;
box-sizing: border-box;
}
.smp-content {
flex: 1;
position: relative;
}
</style>