feat(jd-order): 添加订单导出功能并优化历史记录显示
- 在订单列表页面添加导出按钮,支持筛选条件导出 - 优化订单历史记录抽屉中的状态显示逻辑 - 更新订单状态文案,将"替换订单"改为"发货" - 引入新的状态枚举类型用于精确判断订单变更类型 - 调整时间轴图标颜色及状态标签颜色以匹配新状态 - 实现基于查询条件的 Excel 文件下载功能
This commit is contained in:
@@ -44,7 +44,7 @@
|
||||
:style="{ color: '#86909c', fontSize: '16px' }"
|
||||
/>
|
||||
<icon-sync
|
||||
v-else-if="item.changeType === 'replace'"
|
||||
v-else-if="isSendType(item.changeType)"
|
||||
:style="{ color: '#722ed1', fontSize: '16px' }"
|
||||
/>
|
||||
<icon-more v-else :style="{ color: '#86909c', fontSize: '16px' }" />
|
||||
@@ -111,6 +111,7 @@ import {
|
||||
} from '@arco-design/web-vue/es/icon';
|
||||
import { jdOrderClient } from '@/api';
|
||||
import type { KamiApiJdCookieV1JdOrderHistoryInfo } from '@/api/generated';
|
||||
import { KamiApiJdCookieV1JdOrderHistoryInfoChangeTypeEnum } from '@/api/generated';
|
||||
|
||||
interface Props {
|
||||
visible: boolean;
|
||||
@@ -191,7 +192,7 @@ const getStatusColor = (changeType?: string): string => {
|
||||
pay: 'green', // 支付
|
||||
expire: 'red', // 过期
|
||||
invalid: 'gray', // 失效
|
||||
replace: 'purple' // 替换
|
||||
send: 'purple' // 替换
|
||||
};
|
||||
return colorMap[changeType || ''] || 'gray';
|
||||
};
|
||||
@@ -205,7 +206,7 @@ const getStatusText = (changeType?: string): string => {
|
||||
pay: '支付完成',
|
||||
expire: '订单过期',
|
||||
invalid: '订单失效',
|
||||
replace: '替换订单'
|
||||
send: '发货'
|
||||
};
|
||||
return textMap[changeType || ''] || '未知状态';
|
||||
};
|
||||
@@ -219,11 +220,16 @@ const getTimelineDotColor = (changeType?: string): string => {
|
||||
pay: '#00b42a', // 支付
|
||||
expire: '#f53f3f', // 过期
|
||||
invalid: '#86909c', // 失效
|
||||
replace: '#722ed1' // 替换
|
||||
send: '#722ed1' // 发货
|
||||
};
|
||||
return colorMap[changeType || ''] || '#86909c';
|
||||
};
|
||||
|
||||
// 检查是否为Send类型
|
||||
const isSendType = (changeType?: any): boolean => {
|
||||
return changeType === KamiApiJdCookieV1JdOrderHistoryInfoChangeTypeEnum.Send;
|
||||
};
|
||||
|
||||
// 格式化时间
|
||||
const formatTime = (time?: string): string => {
|
||||
if (!time) return '-';
|
||||
|
||||
@@ -61,6 +61,12 @@
|
||||
</template>
|
||||
重置
|
||||
</a-button>
|
||||
<a-button type="outline" @click="handleExport">
|
||||
<template #icon>
|
||||
<icon-download />
|
||||
</template>
|
||||
导出
|
||||
</a-button>
|
||||
</a-space>
|
||||
</a-col>
|
||||
</a-row>
|
||||
@@ -246,6 +252,7 @@ import { Pagination } from '@/types/global';
|
||||
import { jdOrderClient } from '@/api';
|
||||
import type { KamiApiJdCookieV1JdOrderInfo } from '@/api/generated';
|
||||
import { getCategoryChineseName } from '@/utils/categoryMapping';
|
||||
import { JDOrderManagementApiFactory } from '@/api/generated';
|
||||
import OrderHistoryDrawer from './components/jd-order-history-drawer.vue';
|
||||
|
||||
const { loading, setLoading } = useLoading(true);
|
||||
@@ -560,6 +567,73 @@ const showHistory = (record: KamiApiJdCookieV1JdOrderInfo): void => {
|
||||
historyVisible.value = true;
|
||||
};
|
||||
|
||||
// 下载功能
|
||||
const handleExport = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
|
||||
// 构建导出参数,复用查询参数
|
||||
const exportParams: any = {};
|
||||
|
||||
// 处理状态筛选
|
||||
if (formModel.status) {
|
||||
exportParams.status = formModel.status;
|
||||
}
|
||||
|
||||
// 处理时间筛选
|
||||
if (formModel.dateRange && formModel.dateRange.length === 2) {
|
||||
const startDate = formModel.dateRange[0];
|
||||
const endDate = formModel.dateRange[1];
|
||||
if (startDate && endDate) {
|
||||
exportParams.startTime =
|
||||
startDate.toISOString().split('T')[0] + ' 00:00:00';
|
||||
exportParams.endTime =
|
||||
endDate.toISOString().split('T')[0] + ' 23:59:59';
|
||||
}
|
||||
}
|
||||
|
||||
// 处理订单ID筛选
|
||||
if (formModel.keyword) {
|
||||
exportParams.orderId = formModel.keyword;
|
||||
}
|
||||
|
||||
// 调用导出API
|
||||
const response =
|
||||
await JDOrderManagementApiFactory().apiJdCookieOrderExportGet(
|
||||
exportParams
|
||||
);
|
||||
|
||||
// 创建下载链接
|
||||
const responseData = response.data as any;
|
||||
const blob =
|
||||
responseData instanceof Blob
|
||||
? responseData
|
||||
: new Blob([responseData], {
|
||||
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
|
||||
});
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.setAttribute(
|
||||
'download',
|
||||
`jd-orders-${new Date().toISOString().slice(0, 19).replace(/[:.]/g, '-')}.xlsx`
|
||||
);
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
|
||||
// 清理
|
||||
document.body.removeChild(link);
|
||||
window.URL.revokeObjectURL(url);
|
||||
|
||||
Message.success('导出成功');
|
||||
} catch (error) {
|
||||
console.error('导出失败:', error);
|
||||
Message.error('导出失败');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
search();
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user