Food/food_wechat
3
0
Fork 0
Code Issues 18 Pull Requests Actions Packages Projects Releases Wiki Activity

【类 型】：feat

Browse Source 
【原  因】：
【过  程】：订单列表元素组件 对应的按钮显示 对应的状态显示 如：未付款订单显示 立即支付按钮 状态写待支付
【影  响】：

# 类型 包含:
# feat：新功能（feature）
# fix：修补bug
# docs：文档（documentation）
# style： 格式（不影响代码运行的变动）
# refactor：重构（即不是新增功能，也不是修改bug的代码变动）
# test：增加测试
# chore：构建过程或辅助工具的变动
This commit is contained in:
sszdot 2024-12-23 20:30:16 +08:00
parent c8018ceb97
commit 1ff0ee1ed0
2 changed files with 63 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
components/orderItem/orderItem.vue
View File

@ -12,7 +12,7 @@
</view>
</view>
<view class="flex1 flex column md">
<view class="fz28 fb fcm l-h-18">{{order.shipment_status}}</view>
<view class="fz28 fb fcm l-h-18">{{ orderStatusDisplay }}</view>
<view class="priceBox fz36 fb">
¥{{Number(order.transport_price) + Number(order.pack_price) + Number(order.total_price) | formatPrice}}
</view>
@ -20,16 +20,16 @@
</view>
</view>
<view class="m-t-24 flex mr">
<view class="nullBut bg-m fci rad8 fz28 flex mac mc m-l-24" :key="foodSn">
<view v-if="showPayButton" class="nullBut bg-m fci rad8 fz28 flex mac mc m-l-24">
立即支付
</view>
<view class="numberBut bg-m fci rad8 fz28 fb flex mac mc m-l-24" :key="foodSn">
<view v-if="showPickupNumber" class="numberBut bg-m fci rad8 fz28 fb flex mac mc m-l-24">
{{ foodSn }}
</view>
<view class="nullBut border fcb rad8 fz28 flex mac mc m-l-24">
<view v-if="showAfterSaleButton" class="nullBut border fcb rad8 fz28 flex mac mc m-l-24">
申请售后
</view>
<view class="nullBut border fcb rad8 fz28 flex mac mc m-l-24">
<view v-if="showRefundDetailsButton" class="nullBut border fcb rad8 fz28 flex mac mc m-l-24">
退款详情
</view>
</view>
@ -49,7 +49,7 @@
intervalId: null, // 存储定时器ID，用于清除定时器
}
},
onReady() {
created() {
this.intervalId = setInterval(() => {
this.foodSn = this.foodSn === '取餐号' ? this.order.food_sn : '取餐号'
}, 1200)
@ -58,6 +58,60 @@
// 清除定时器，避免内存泄漏
clearInterval(this.intervalId);
},
computed: {
// 计算属性：是否显示 "立即支付" 按钮
showPayButton() {
return this.order.main_status === '未付款';
},
// 计算属性：是否显示 "取餐号"
showPickupNumber() {
return this.order.main_status === '已付款' && this.order.refund_status === '未申请';
},
// 计算属性：是否显示 "申请售后" 按钮
showAfterSaleButton() {
return this.order.main_status === '已付款' && this.order.refund_status === '未申请';
},
// 计算属性：是否显示 "退款详情" 按钮
showRefundDetailsButton() {
return this.order.refund_status !== '未申请' && this.order.main_status !== '已完成';
},
// 计算属性：显示订单状态
orderStatusDisplay() {
if (this.order.main_status === '未付款') {
return '待支付';
}
if (this.order.main_status === '已付款' && this.order.refund_status === '未申请') {
return this.order.shipment_status;
}
switch (this.order.refund_status) {
case '申请中':
return '申请中';
case '已同意':
return '商家同意退款';
case '主动退':
return '商家退单';
case '拒绝退':
return '商家拒绝退款';
default:
return '';
}
},
// 计算属性：显示退款状态
refundStatusDisplay() {
switch (this.order.refund_status) {
case '申请中':
return '申请中';
case '已同意':
return '商家同意退款';
case '主动退':
return '商家退单';
case '拒绝退':
return '商家拒绝退款';
default:
return '';
}
},
},
props: {
order: {
type: Object,

6
pages/main/order.vue
View File

@ -73,9 +73,9 @@
},
//已付款 已完成 并且没有申请退款的订单
orderList_paid() {
return this.$store.state.orderList.filter(item => {
(item.main_status === '已付款' || item.main_status === '已完成') && item.refund_status === '未申请'
})
return this.$store.state.orderList.filter(item => {
return item.main_status === '已付款' && item.refund_status === '未申请';
})
},
//申请中 已同意 主动退 拒绝退 等退款相关的订单
orderList_refund() {