From 6d515bc5ea69bac73a656dfacee920aab85b1660 Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Tue, 20 Jan 2026 16:28:15 +0800
Subject: [PATCH] feat:更新
---
applications/task-work-order/src/views/orderView/orderDataManage/supplyAdd/auditRecord.vue | 151 ++++++++++++++++++++++---------------------------
1 files changed, 68 insertions(+), 83 deletions(-)
diff --git a/applications/task-work-order/src/views/orderView/orderDataManage/supplyAdd/auditRecord.vue b/applications/task-work-order/src/views/orderView/orderDataManage/supplyAdd/auditRecord.vue
index e200a51..902375c 100644
--- a/applications/task-work-order/src/views/orderView/orderDataManage/supplyAdd/auditRecord.vue
+++ b/applications/task-work-order/src/views/orderView/orderDataManage/supplyAdd/auditRecord.vue
@@ -2,7 +2,7 @@
<div class="audit-record-container">
<div class="label">审批记录</div>
<el-steps :active="activeStep" direction="vertical" align-center>
- <el-step v-for="(step, index) in steps" :key="index" :title="step.title">
+ <el-step v-for="(step, index) in displayedSteps" :key="step.status" :title="step.title">
<template #description>
<div class="step-person">{{ step.person }}</div>
<div class="step-time">{{ step.time }}</div>
@@ -13,7 +13,7 @@
</template>
<script setup>
-import { ref, watch } from 'vue'
+import { ref, watch, computed } from 'vue'
import { gdSupplyDemandAuditListApi } from '@/views/orderView/orderDataManage/supplyAdd/supplyAddApi'
const props = defineProps({
@@ -24,14 +24,64 @@
})
const detailDemandStatus = inject('detailDemandStatus')
const reasonForRejection = inject('reasonForRejection')
-// 步骤条数据
-const steps = ref([
- { title: '需求申请', person: '', time: '' },
- { title: '审核通过', person: '', time: '' }
+
+// 所有可能的步骤配置
+const allStepConfigs = ref([
+ { title: '需求申请', status: '0', person: '', time: '' },
+ { title: '审核通过', status: '1', person: '', time: '' },
+ { title: '拒绝申请', status: '2', person: '', time: '' }
])
+
+// 步骤条数据
+const stepResponse = ref([])
// 当前激活步骤
const activeStep = ref(0)
+
+// 计算要显示的步骤
+const displayedSteps = computed(() => {
+ // 创建一个映射，将状态映射到审核记录
+ const statusToRecord = {};
+ stepResponse.value.forEach(record => {
+ statusToRecord[record.auditStatus] = record;
+ });
+
+ // 根据审核记录筛选并构建要显示的步骤
+ return allStepConfigs.value.filter(stepConfig => {
+ // 如果是需求申请步骤，始终显示
+ if (stepConfig.status === '0') {
+ return true;
+ }
+ // 其他步骤只有在有对应状态的审核记录时才显示
+ return statusToRecord.hasOwnProperty(stepConfig.status);
+ }).map(stepConfig => {
+ // 获取对应状态的审核记录
+ const record = statusToRecord[stepConfig.status];
+ if (record) {
+ // 如果有审核记录，使用记录中的信息
+ return {
+ ...stepConfig,
+ person: record.createUser ? `${record.createUser}` : '',
+ time: record.createTime ? record.createTime : ''
+ };
+ }
+ // 如果没有审核记录，使用默认信息
+ return stepConfig;
+ });
+})
+
+// 计算当前激活步骤
+const calculateCurrentStep = () => {
+ if (stepResponse.value.length === 0) {
+ return 0;
+ }
+
+ // 获取最新的审核记录
+ const latestRecord = stepResponse.value[stepResponse.value.length - 1];
+ // 查找最新状态在显示步骤中的索引
+ const stepIndex = displayedSteps.value.findIndex(step => step.status === latestRecord.auditStatus);
+ return stepIndex !== -1 ? stepIndex : 0;
+}
// 监听 demandId 变化
watch(() => props.demandId, (newVal) => {
@@ -45,87 +95,22 @@
try {
const res = await gdSupplyDemandAuditListApi({ demandId })
const auditRecords = res?.data?.data ?? []
-
- // 查找拒绝原因（auditStatus为2的记录的auditOpinion）
- const rejectedRecord = auditRecords.find(record => record.auditStatus === '2')
- reasonForRejection.value = rejectedRecord?.auditOpinion || ''
- console.log('reasonForRejection', reasonForRejection.value)
- // 处理审核记录为步骤格式
- processAuditRecords(auditRecords)
+ // 按创建时间排序（最新的在最后）
+ stepResponse.value = [...auditRecords].sort((a, b) => new Date(a.createTime) - new Date(b.createTime))
+
+ // 查找拒绝原因（auditStatus为2的记录的auditOpinion）
+ const rejectedRecord = stepResponse.value.find(record => record.auditStatus === '2')
+ reasonForRejection.value = rejectedRecord?.auditOpinion || ''
+
+ // 计算当前激活步骤
+ activeStep.value = calculateCurrentStep()
} catch (error) {
console.error('加载审核记录失败:', error)
- // 保持默认步骤
+ // 重置步骤数据
+ stepResponse.value = []
activeStep.value = 0
reasonForRejection.value = ''
- }
-}
-
-// 处理审核记录为步骤格式
-function processAuditRecords(records) {
- // 重置为默认步骤结构
- steps.value = [
- { title: '需求申请', person: '', time: '' },
- { title: '审核通过', person: '', time: '' }
- ]
-
- if (!records || records.length === 0) {
- // 没有审核记录，保持默认步骤
- activeStep.value = 0
- return
- }
-
- // 按创建时间排序（最新的在最后）
- const sortedRecords = [...records].sort((a, b) => new Date(a.createTime) - new Date(b.createTime))
-
- // 处理需求申请步骤（第一个步骤）
- const demandRecord = sortedRecords.find(record => record.auditStatus === '0') || sortedRecords[0]
- if (demandRecord) {
- steps.value[0] = {
- title: '需求申请',
- person: demandRecord.createUser ? `${demandRecord.createUser}` : '',
- time: demandRecord.createTime ? demandRecord.createTime : ''
- }
- }
-
- // 处理审核步骤（第二个步骤）
- const latestRecord = sortedRecords[sortedRecords.length - 1]
- if (latestRecord) {
- // 根据最新审核结果设置标题
- let auditTitle = '审核通过'
- if (latestRecord.auditStatus === '2') {
- auditTitle = '拒绝申请'
- // 更新第二个步骤的标题为拒绝申请
- steps.value[1].title = auditTitle
- }
-
- // 添加审核意见（如果有）
- if (latestRecord.auditOpinion) {
- steps.value[1].title
- }
-
- // 更新审核步骤的信息
- steps.value[1].person = latestRecord.createUser ? `${latestRecord.createUser}` : ''
- steps.value[1].time = latestRecord.createTime ? latestRecord.createTime : ''
-
- // 根据最新审核结果设置activeStep
- switch (latestRecord.auditStatus) {
- case '0':
- // 审核中，高亮第一个步骤
- activeStep.value = 0
- break
- case '1':
- // 审核通过，高亮第二个步骤
- activeStep.value = 1
- break
- case '2':
- // 拒绝申请，高亮第二个步骤
- activeStep.value = 1
- break
- default:
- // 默认高亮第一个步骤
- activeStep.value = 0
- }
}
}
@@ -149,7 +134,7 @@
}
:deep(.el-step) {
- margin-bottom: 90px;
+ margin-bottom: 20px;
}
:deep(.el-step__title) {
--
Gitblit v1.9.3