fix: 【工作流】--回退的高亮和api地址更换

Author: tritiumtech

src/api/bpm/task/index.ts

@@ -54,6 +54,6 @@ export const getReturnList = async (params) => {
  * 确认回退
  * @param params
  */
-export const okRollback = async (data) => {
-  return await request.put({ url: '/bpm/task/rollback', data })
+export const okReturnTask = async (data) => {
+  return await request.put({ url: '/bpm/task/return', data })
 }

src/components/bpmnProcessDesigner/package/designer/ProcessViewer.vue

@@ -11,6 +11,7 @@ import BpmnViewer from 'bpmn-js/lib/Viewer'
 import DefaultEmptyXML from './plugins/defaultEmpty'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { formatDate } from '@/utils/formatTime'
+import { isEmpty } from '@/utils/is'
 
 defineOptions({ name: 'MyProcessViewer' })
 
@@ -85,6 +86,7 @@ const createNewDiagram = async (xml) => {
     // console.error(`[Process Designer Warn]: ${e?.message || e}`);
   }
 }
+
 /* 高亮流程图 */
 // TODO 芋艿：如果多个 endActivity 的话，目前的逻辑可能有一定的问题。https://www.jdon.com/workflow/multi-events.html
 const highlightDiagram = async () => {
@@ -97,6 +99,9 @@ const highlightDiagram = async () => {
   let canvas = bpmnModeler.get('canvas')
   let todoActivity: any = activityList.find((m: any) => !m.endTime) // 找到待办的任务
   let endActivity: any = activityList[activityList.length - 1] // 获得最后一个任务
+  let findProcessTask = false //是否已经高亮了进行中的任务
+  //进行中高亮之后的任务 key 集合，用于过滤掉 taskList 进行中后面的任务，避免进行中后面的数据 Hover 还有数据
+  let removeTaskDefinitionKeyList = []
   // debugger
   bpmnModeler.getDefinitions().rootElements[0].flowElements?.forEach((n: any) => {
     let activity: any = activityList.find((m: any) => m.key === n.id) // 找到对应的活动
@@ -110,9 +115,17 @@ const highlightDiagram = async () => {
       if (!task) {
         return
       }
+      //进行中的任务已经高亮过了，则不高亮后面的任务了
+      if (findProcessTask) {
+        removeTaskDefinitionKeyList.push(n.id)
+        return
+      }
       // 高亮任务
       canvas.addMarker(n.id, getResultCss(task.result))
-
+      //标记是否高亮了进行中任务
+      if (task.result === 1) {
+        findProcessTask = true
+      }
       // 如果非通过，就不走后面的线条了
       if (task.result !== 2) {
         return
@@ -212,6 +225,11 @@ const highlightDiagram = async () => {
       }
     }
   })
+  if (!isEmpty(removeTaskDefinitionKeyList)) {
+    taskList.value = taskList.value.filter(
+      (item) => !removeTaskDefinitionKeyList.includes(item.definitionKey)
+    )
+  }
 }
 const getActivityHighlightCss = (activity) => {
   return activity.endTime ? 'highlight' : 'highlight-todo'
@@ -276,9 +294,9 @@ const elementHover = (element) => {
   console.log(element.value, 'element.value')
   const activity = activityLists.value.find((m) => m.key === element.value.id)
   console.log(activity, 'activityactivityactivityactivity')
-  // if (!activity) {
-  //   return
-  // }
+  if (!activity) {
+    return
+  }
   if (!elementOverlayIds.value[element.value.id] && element.value.type !== 'bpmn:Process') {
     let html = `<div class="element-overlays">
             <p>Elemet id: ${element.value.id}</p>

src/views/bpm/processInstance/detail/TaskRollbackDialogForm.vue renamed to src/views/bpm/processInstance/detail/TaskReturnDialogForm.vue

@@ -11,9 +11,9 @@
         <el-select v-model="formData.targetDefinitionKey" clearable style="width: 100%">
           <el-option
             v-for="item in returnList"
-            :key="item.taskDefinitionKey"
+            :key="item.definitionKey"
             :label="item.name"
-            :value="item.taskDefinitionKey"
+            :value="item.definitionKey"
           />
         </el-select>
       </el-form-item>
@@ -68,7 +68,7 @@ const submitForm = async () => {
   // 提交请求
   formLoading.value = true
   try {
-    await TaskApi.okRollback(formData.value)
+    await TaskApi.okReturnTask(formData.value)
     message.success('回退成功')
     dialogVisible.value = false
     // 发送操作成功的事件

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

@@ -92,7 +92,7 @@
     <!-- 弹窗：转派审批人 -->
     <TaskUpdateAssigneeForm ref="taskUpdateAssigneeFormRef" @success="getDetail" />
     <!-- 弹窗，回退节点 -->
-    <TaskRollbackDialog ref="taskRollbackRef" @success="getDetail" />
+    <TaskReturnDialog ref="taskReturnDialogRef" @success="getDetail" />
   </ContentWrap>
 </template>
 <script lang="ts" setup>
@@ -105,7 +105,7 @@ import * as TaskApi from '@/api/bpm/task'
 import TaskUpdateAssigneeForm from './TaskUpdateAssigneeForm.vue'
 import ProcessInstanceBpmnViewer from './ProcessInstanceBpmnViewer.vue'
 import ProcessInstanceTaskList from './ProcessInstanceTaskList.vue'
-import TaskRollbackDialog from './TaskRollbackDialogForm.vue'
+import TaskReturnDialog from './TaskReturnDialogForm.vue'
 import { registerComponent } from '@/utils/routerHelper'
 
 defineOptions({ name: 'BpmProcessInstanceDetail' })
@@ -176,10 +176,10 @@ const handleDelegate = async (task) => {
 }
 
 //回退弹框组件
-const taskRollbackRef = ref()
+const taskReturnDialogRef = ref()
 /** 处理审批退回的操作 */
 const handleBack = async (task) => {
-  taskRollbackRef.value.open(task.id)
+  taskReturnDialogRef.value.open(task.id)
 }
 
 /** 获得详情 */