Merge branch 'feature/bpm' of https://gitee.com/yudaocode/yudao-ui-admin-vue3 into feature/bpm

src/assets/svgs/bpm/end.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1729949323056" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12570" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M0 0h1024v1024H0z" fill="#333333" opacity=".01" p-id="12571"></path><path d="M512 0a32 32 0 0 0-32 32v448a32 32 0 0 0 64 0v-448A32 32 0 0 0 512 0zM282.688 109.696a32 32 0 0 0-44.544-7.936 480 480 0 1 0 549.12 0.96 32 32 0 1 0-36.8 52.352 416 416 0 1 1-475.776-0.832 32 32 0 0 0 8-44.544z" fill="#e6e6e6" p-id="12572" data-spm-anchor-id="a313x.search_index.0.i5.3c163a81TFKD3L" class="selected"></path></svg>

src/views/bpm/processInstance/detail/ProcessInstanceTimeline.vue

@@ -3,7 +3,7 @@
   <el-timeline class="pt-20px">
     <!-- 遍历每个审批节点 -->
     <el-timeline-item
-      v-for="(activity, index) in approveNodes"
+      v-for="(activity, index) in activityNodes"
       :key="index"
       size="large"
       :icon="getApprovalNodeIcon(activity.status, activity.nodeType)"
@@ -107,7 +107,10 @@
                 </div>
               </div>
               <div
-                v-if="task.reason && activity.nodeType === NodeType.USER_TASK_NODE"
+                v-if="
+                  task.reason &&
+                  [NodeType.USER_TASK_NODE, NodeType.END_EVENT_NODE].includes(activity.nodeType)
+                "
                 class="text-#a5a5a5 text-13px mt-1 w-full bg-#f8f8fa p2 rounded-md"
               >
                 审批意见：{{ task.reason }}
@@ -131,10 +134,11 @@ import auditorSvg from '@/assets/svgs/bpm/auditor.svg'
 import copySvg from '@/assets/svgs/bpm/copy.svg'
 import conditionSvg from '@/assets/svgs/bpm/condition.svg'
 import parallelSvg from '@/assets/svgs/bpm/parallel.svg'
+import endSvg from '@/assets/svgs/bpm/end.svg'
 
 defineOptions({ name: 'BpmProcessInstanceTimeline' })
 defineProps<{
-  approveNodes: ProcessInstanceApi.ApprovalNodeInfo[] // 审批节点信息
+  activityNodes: ProcessInstanceApi.ApprovalNodeInfo[] // 审批节点信息
 }>()
 
 // 审批节点
@@ -189,7 +193,9 @@ const nodeTypeSvgMap = {
   // 条件分支节点
   [NodeType.CONDITION_NODE]: { color: '#14bb83', svg: conditionSvg },
   // 并行分支节点
-  [NodeType.PARALLEL_BRANCH_NODE]: { color: '#14bb83', svg: parallelSvg }
+  [NodeType.PARALLEL_BRANCH_NODE]: { color: '#14bb83', svg: parallelSvg },
+  // 结束节点
+  [NodeType.END_EVENT_NODE]: { color: '#ffffff', svg: endSvg }
 }
 
 // 只有只有状态是 -1、0、1 才展示头像右小角状态小icon
@@ -205,7 +211,11 @@ const getApprovalNodeIcon = (taskStatus: number, nodeType: NodeType) => {
     return statusIconMap[taskStatus]?.icon
   }
 
-  if (nodeType === NodeType.START_USER_NODE || nodeType === NodeType.USER_TASK_NODE) {
+  if (
+    nodeType === NodeType.START_USER_NODE ||
+    nodeType === NodeType.USER_TASK_NODE ||
+    nodeType === NodeType.END_EVENT_NODE
+  ) {
     return statusIconMap[taskStatus]?.icon
   }
 }

src/views/bpm/processInstance/detail/index.vue

@@ -65,7 +65,7 @@
                   </el-col>
                   <el-col :span="7">
                     <!-- 审批记录时间线 -->
-                    <ProcessInstanceTimeline ref="timelineRef" :approve-nodes="approveNodes" />
+                    <ProcessInstanceTimeline ref="timelineRef" :activity-nodes="activityNodes" />
                   </el-col>
                 </el-row>
               </el-scrollbar>
@@ -229,7 +229,7 @@ const getApprovalDetail = async () => {
     }
 
     // 获取审批节点，显示 Timeline 的数据
-    approveNodes.value = data.approveNodes
+    activityNodes.value = data.activityNodes
 
     // 获取待办任务显示操作按钮
     operationButtonRef.value?.loadTodoTask(data.todoTask)
@@ -239,7 +239,7 @@ const getApprovalDetail = async () => {
 }
 
 // 审批节点信息
-const approveNodes = ref<ProcessInstanceApi.ApprovalNodeInfo[]>([])
+const activityNodes = ref<ProcessInstanceApi.ApprovalNodeInfo[]>([])
 /**
  * 设置表单权限
  */