|
|
@@ -126,7 +126,7 @@
|
|
|
<script setup lang="ts">
|
|
|
import { ref, reactive, onMounted } from 'vue';
|
|
|
import { useRouter, useRoute } from 'vue-router';
|
|
|
-import { ArrowLeft, Document, User, CircleCheck, Picture, Clock, Warning } from '@element-plus/icons-vue';
|
|
|
+import { ArrowLeft, Document, User, CircleCheck, Picture } from '@element-plus/icons-vue';
|
|
|
import { getOrderInfo, getOrderProducts, getOrderFlowNodes } from '@/api/pc/enterprise/order';
|
|
|
import { getAddressInfo } from '@/api/pc/enterprise/address';
|
|
|
import { getInvoiceList } from '@/api/pc/enterprise/invoice';
|
|
|
@@ -155,13 +155,10 @@ const formatTime = (timeStr: string): string => {
|
|
|
const orderId = ref<any>(0);
|
|
|
const currentStep = ref(1);
|
|
|
const loading = ref(false);
|
|
|
+const orderStatus = ref<number>(0);
|
|
|
|
|
|
const progressSteps = ref<{ title: string; icon: any; desc: string; time: string; reviewStatus?: number }[]>([
|
|
|
- { title: '待支付', icon: Document, desc: '等待买家支付', time: '', reviewStatus: 2 },
|
|
|
- { title: '待确认', icon: Warning, desc: '等待商家确认', time: '', reviewStatus: 2 },
|
|
|
- { title: '待发货', icon: Clock, desc: '等待商家发货', time: '', reviewStatus: 2 },
|
|
|
- { title: '部分发货', icon: Clock, desc: '部分商品已发货', time: '', reviewStatus: 2 },
|
|
|
- { title: '发货完成', icon: CircleCheck, desc: '所有商品已发货', time: '', reviewStatus: 2 },
|
|
|
+ { title: '提交订单', icon: Document, desc: '订单已提交', time: '', reviewStatus: 2 },
|
|
|
{ title: '完成', icon: CircleCheck, desc: '交易完成', time: '', reviewStatus: 0 }
|
|
|
]);
|
|
|
|
|
|
@@ -198,14 +195,48 @@ const loadFlowNodes = async () => {
|
|
|
if (res.code === 200) {
|
|
|
const apiNodes: OrderCustomerFlowNodeLink[] = res.data || [];
|
|
|
|
|
|
- // 设置当前步骤:根据订单状态进度到哪一步
|
|
|
- // orderStatus: 0=待支付, 1=待确认, 2=待发货, 3=部分发货, 4=发货完成
|
|
|
- currentStep.value = orderInfo.orderStatus;
|
|
|
+ // 提交订单节点:显示订单的 createTime
|
|
|
+ const steps: { title: string; icon: any; desc: string; time: string; reviewStatus?: number }[] = [
|
|
|
+ { title: '提交订单', icon: Document, desc: '订单已提交', time: formatTime(orderTimeInfo.createTime), reviewStatus: 2 }
|
|
|
+ ];
|
|
|
|
|
|
- // 如果订单状态为已完成(orderStatus == 5),激活最后一步
|
|
|
- if (orderInfo.orderStatus == 5) {
|
|
|
- currentStep.value = progressSteps.value.length - 1;
|
|
|
+ // 并行解析所有节点的审批人名称
|
|
|
+ const handlerNames = await Promise.all(apiNodes.map((node) => resolveHandlerName(node.handlerId || node.handlerName || '')));
|
|
|
+
|
|
|
+ apiNodes.forEach((node, idx) => {
|
|
|
+ steps.push({
|
|
|
+ title: node.nodeName || '审批',
|
|
|
+ icon: User,
|
|
|
+ desc: handlerNames[idx] || '',
|
|
|
+ time: formatTime(node.updateTime || ''),
|
|
|
+ reviewStatus: node.reviewStatus ?? 0
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ // 完成节点:显示订单的 updateTime
|
|
|
+ steps.push({ title: '完成', icon: CircleCheck, desc: '交易完成', time: formatTime(orderTimeInfo.updateTime), reviewStatus: 0 });
|
|
|
+
|
|
|
+ progressSteps.value = steps;
|
|
|
+
|
|
|
+ // 计算当前步骤:找最后一个已处理节点的索引(reviewStatus > 0)
|
|
|
+ let lastActiveIndex = 0;
|
|
|
+ steps.forEach((step, idx) => {
|
|
|
+ if (step.reviewStatus && step.reviewStatus > 0) {
|
|
|
+ lastActiveIndex = idx;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ // 若所有中间节点均已完成(reviewStatus === 2),则激活结束节点
|
|
|
+ const middleNodes = steps.slice(1, steps.length - 1);
|
|
|
+ if (middleNodes.length > 0 && middleNodes.every((s) => s.reviewStatus === 2)) {
|
|
|
+ lastActiveIndex = steps.length - 1;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 检查订单状态,如果状态=5,则强制激活完成步骤
|
|
|
+ if (orderStatus.value == 5) {
|
|
|
+ lastActiveIndex = steps.length - 1;
|
|
|
}
|
|
|
+
|
|
|
+ currentStep.value = lastActiveIndex;
|
|
|
}
|
|
|
} catch (error) {
|
|
|
console.error('加载流程节点失败', error);
|
|
|
@@ -224,8 +255,7 @@ const orderInfo = reactive({
|
|
|
purchaseReason: '',
|
|
|
expenseType: '',
|
|
|
costType: '',
|
|
|
- remark: '',
|
|
|
- orderStatus: 0
|
|
|
+ remark: ''
|
|
|
});
|
|
|
|
|
|
const invoiceInfo = reactive({
|
|
|
@@ -252,20 +282,15 @@ const loadOrderDetail = async () => {
|
|
|
orderInfo.purchaseReason = order.purchaseReason || '';
|
|
|
orderInfo.remark = order.remark || '';
|
|
|
orderInfo.expenseType = order.expenseType || '';
|
|
|
- orderInfo.orderStatus = order.orderStatus || 0;
|
|
|
|
|
|
// 保存订单时间信息(用于流程节点时间显示)
|
|
|
orderTimeInfo.createTime = order.createTime || '';
|
|
|
orderTimeInfo.updateTime = order.updateTime || '';
|
|
|
+ orderStatus.value = order.orderStatus || 0;
|
|
|
if (order.orderStatus == 5) {
|
|
|
- // 1. 设置当前步骤为最后一个
|
|
|
+ // 激活完成这一步
|
|
|
currentStep.value = progressSteps.value.length - 1;
|
|
|
-
|
|
|
- // 2. 修改最后一个元素的时间
|
|
|
progressSteps.value[progressSteps.value.length - 1].time = formatTime(order.updateTime);
|
|
|
- } else {
|
|
|
- // 设置当前步骤:根据订单状态进度到哪一步
|
|
|
- currentStep.value = order.orderStatus;
|
|
|
}
|
|
|
// 获取商品信息
|
|
|
const productsRes = await getOrderProducts([orderId.value]);
|