From f40d1de62a7cee36fd36afd8dcb210ef84bcb684 Mon Sep 17 00:00:00 2001
From: kehaiyou <tritiumtech@outlook.com>
Date: Sun, 24 Sep 2023 19:42:53 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E3=80=90=E5=B7=A5=E4=BD=9C=E6=B5=81?=
=?UTF-8?q?=E3=80=91--=E5=9B=9E=E9=80=80=E7=9A=84=E9=AB=98=E4=BA=AE?=
=?UTF-8?q?=E5=92=8Capi=E5=9C=B0=E5=9D=80=E6=9B=B4=E6=8D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/api/bpm/task/index.ts | 4 +--
.../package/designer/ProcessViewer.vue | 26 ++++++++++++++++---
...ialogForm.vue => TaskReturnDialogForm.vue} | 6 ++---
.../bpm/processInstance/detail/index.vue | 8 +++---
4 files changed, 31 insertions(+), 13 deletions(-)
rename src/views/bpm/processInstance/detail/{TaskRollbackDialogForm.vue => TaskReturnDialogForm.vue} (95%)
diff --git a/src/api/bpm/task/index.ts b/src/api/bpm/task/index.ts
index 126f01eb..43bcceab 100644
--- a/src/api/bpm/task/index.ts
+++ b/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 })
}
diff --git a/src/components/bpmnProcessDesigner/package/designer/ProcessViewer.vue b/src/components/bpmnProcessDesigner/package/designer/ProcessViewer.vue
index dd4c8456..0b1f8078 100644
--- a/src/components/bpmnProcessDesigner/package/designer/ProcessViewer.vue
+++ b/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>
diff --git a/src/views/bpm/processInstance/detail/TaskRollbackDialogForm.vue b/src/views/bpm/processInstance/detail/TaskReturnDialogForm.vue
similarity index 95%
rename from src/views/bpm/processInstance/detail/TaskRollbackDialogForm.vue
rename to src/views/bpm/processInstance/detail/TaskReturnDialogForm.vue
index 168fd1a8..4d9fc5d8 100644
--- a/src/views/bpm/processInstance/detail/TaskRollbackDialogForm.vue
+++ b/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
// 发送操作成功的事件
diff --git a/src/views/bpm/processInstance/detail/index.vue b/src/views/bpm/processInstance/detail/index.vue
index 6b57242d..fbadad4c 100644
--- a/src/views/bpm/processInstance/detail/index.vue
+++ b/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)
}
/** 获得详情 */