feat(shopOrder): 补充订单商品明细显示并优化列表数据加载

- 引入订单商品明细接口listShopOrderGoods以获取详细商品数据
- 修改商品汇总显示,增加规格信息展示(商品名(规格) x 数量)
- 优化订单列表加载,针对每笔订单单独请求商品明细数据补全
- 解决订单列表接口不返回orderGoods字段的问题,保证商品明细完整显示
- 确保异步获取商品详情失败时,使用空数组避免页面错误
This commit is contained in:
2026-07-23 07:56:19 +08:00
parent a4107e212a
commit 708bc7fc80

View File

@@ -98,6 +98,7 @@ import {message} from 'ant-design-vue';
import useSearch from '@/utils/use-search';
import {ShopOrder, ShopOrderParam} from '@/api/shop/shopOrder/model';
import {listShopOrder} from '@/api/shop/shopOrder';
import {listShopOrderGoods} from '@/api/shop/shopOrderGoods';
import {getPayType} from '@/utils/shop';
const props = withDefaults(
@@ -218,11 +219,14 @@ const getDeliveryStatusLabel = (s?: number) => {
}
};
// 商品明细汇总(商品名 x 数量)
// 商品明细汇总(商品名(规格) x 数量)
const getGoodsSummary = (goods?: any[]) => {
if (!goods || !goods.length) return '';
return goods
.map((g) => `${g.goodsName || '未知商品'} x${g.totalNum || 1}`)
.map((g) => {
const spec = g.spec ? `(${g.spec})` : '';
return `${g.goodsName || '未知商品'}${spec} x${g.totalNum || 1}`;
})
.join('');
};
@@ -256,16 +260,24 @@ const handleExport = async () => {
];
await listShopOrder({ ...where, statusFilter: props.statusFilter })
.then((list) => {
.then(async (list) => {
orders.value = list;
list?.forEach((d: ShopOrder) => {
// 列表接口不返回 orderGoods按订单逐个补齐商品明细含名称/规格/数量)
const goodsList = await Promise.all(
(list ?? []).map((d) =>
d.orderId
? listShopOrderGoods({ orderId: d.orderId }).catch(() => [])
: Promise.resolve([])
)
);
list?.forEach((d: ShopOrder, idx: number) => {
array.push([
`${d.orderNo || ''}`,
`${d.realName || ''}`,
`${d.phone || d.mobile || ''}`,
`${d.address || ''}`,
`${getDeliveryTypeLabel(d.deliveryType)}`,
`${getGoodsSummary(d.orderGoods)}`,
`${getGoodsSummary(goodsList[idx])}`,
`${d.totalNum ?? ''}`,
`${d.payPrice || ''}`,
`${