fix(shopOrder): 默认tab改为全部,订单详情页增支付凭证图

- 将 shopOrder 选项卡默认值从 'undelivered' 改为 'all',确保首页展示全部订单数据
- 修正初次加载时因缺少 statusFilter 导致数据不符的问题
- 订单详情页新增“支付凭证”显示,支持线下付款上传凭证图片预览
- 引入确保完整URL显示的工具函数 ensureFullUrl,配合压缩图像展示
- form reactive 新增 paymentVoucher 字段,符合 ShopOrder 模型定义
- 仅线下付款订单显示该凭证图,条件渲染自然处理
This commit is contained in:
2026-07-15 15:53:14 +08:00
parent d5e040b1e6
commit 071a3bf110
3 changed files with 34 additions and 2 deletions

View File

@@ -202,6 +202,19 @@
</template>
</a-tooltip>
</a-descriptions-item>
<a-descriptions-item
v-if="form.paymentVoucher"
label="支付凭证"
:span="3"
:labelStyle="{ width: '90px', color: '#808080' }"
>
<a-image
:width="120"
:src="getCompressedImageUrl(form.paymentVoucher, { width: 750 })"
:preview-src-list="[ensureFullUrl(form.paymentVoucher)]"
style="cursor: pointer"
/>
</a-descriptions-item>
<a-descriptions-item
label="开票状态"
:labelStyle="{ width: '90px', color: '#808080' }"
@@ -425,7 +438,7 @@
import { updateShopOrder, removeShopOrder, refundShopOrder } from '@/api/shop/shopOrder';
import { message, Modal } from 'ant-design-vue';
import DeliveryModal from './deliveryModal.vue';
import {getCompressedImageUrl} from "@/utils/image";
import {getCompressedImageUrl, ensureFullUrl} from "@/utils/image";
const useForm = Form.useForm;
@@ -593,6 +606,8 @@
invoiceNo: undefined,
// 支付时间
payTime: undefined,
// 线下收款支付凭证(图片地址,确认线下收款时上传)
paymentVoucher: undefined,
// 退款时间
refundTime: undefined,
// 申请退款时间

View File

@@ -443,7 +443,7 @@
const validTabs = ['all', 'unpaid', 'undelivered', 'unreceived', 'completed', 'refunded', 'cancelled'];
const tabFromQuery = route.query.tab as string;
const activeKey = ref<string>(
validTabs.includes(tabFromQuery) ? tabFromQuery : 'undelivered'
validTabs.includes(tabFromQuery) ? tabFromQuery : 'all'
);
// ============ 新订单提醒 ============