From a614dee5c62433437fe343521f99f2b0c9e190b0 Mon Sep 17 00:00:00 2001
From: warm <290631660@qq.com>
Date: Tue, 27 May 2025 16:58:18 +0800
Subject: [PATCH] =?UTF-8?q?feat=20=E6=96=B0=E5=A2=9E=E9=80=9A=E8=BF=87?=
 =?UTF-8?q?=E5=89=8D=E7=AB=AF=E6=98=BE=E7=A4=BA=E6=B5=81=E7=A8=8B=E5=9B=BE?=
 =?UTF-8?q?=E6=96=B9=E5=BC=8F=20feat=20=E5=8A=9E=E7=90=86=E4=BA=BA?=
 =?UTF-8?q?=E6=9D=83=E9=99=90=E5=A4=84=E7=90=86=E5=99=A8=EF=BC=8C=E6=96=B0?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=9E=E7=90=86=E4=BA=BA=E8=BD=AC=E6=8D=A2=E6=8E=A5?=
 =?UTF-8?q?=E5=8F=A3=EF=BC=8C=E6=AF=94=E5=A6=82=E8=A7=92=E8=89=B2=E8=BD=AC?=
 =?UTF-8?q?=E7=94=A8=E6=88=B7=20update=20=E5=8D=87=E7=BA=A7warm-flow-1.7.3?=
 =?UTF-8?q?-m1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/workflow/workflowCommon/index.ts     |  3 +-
 src/api/workflow/workflowCommon/types.ts     |  1 +
 src/components/Process/approvalRecord.vue    | 10 +--
 src/components/Process/flowChart.vue         | 79 +++-----------------
 src/views/workflow/leave/leaveEdit.vue       |  2 +-
 src/views/workflow/processInstance/index.vue |  5 +-
 src/views/workflow/task/allTaskWaiting.vue   |  3 +-
 src/views/workflow/task/myDocument.vue       |  5 +-
 src/views/workflow/task/taskCopyList.vue     |  3 +-
 src/views/workflow/task/taskFinish.vue       |  3 +-
 src/views/workflow/task/taskWaiting.vue      |  3 +-
 11 files changed, 34 insertions(+), 83 deletions(-)

diff --git a/src/api/workflow/workflowCommon/index.ts b/src/api/workflow/workflowCommon/index.ts
index 0f5ce1b2..696312e6 100644
--- a/src/api/workflow/workflowCommon/index.ts
+++ b/src/api/workflow/workflowCommon/index.ts
@@ -8,7 +8,8 @@ export default {
       query: {
         id: routerJumpVo.businessId,
         type: routerJumpVo.type,
-        taskId: routerJumpVo.taskId
+        taskId: routerJumpVo.taskId,
+        instanceId: routerJumpVo.instanceId
       }
     });
   }
diff --git a/src/api/workflow/workflowCommon/types.ts b/src/api/workflow/workflowCommon/types.ts
index 3e7a71d5..2d091157 100644
--- a/src/api/workflow/workflowCommon/types.ts
+++ b/src/api/workflow/workflowCommon/types.ts
@@ -4,6 +4,7 @@ export interface RouterJumpVo {
   type: string;
   formCustom: string;
   formPath: string;
+  instanceId: string | number;
 }
 
 export interface StartProcessBo {
diff --git a/src/components/Process/approvalRecord.vue b/src/components/Process/approvalRecord.vue
index e70d289b..96108f7d 100644
--- a/src/components/Process/approvalRecord.vue
+++ b/src/components/Process/approvalRecord.vue
@@ -3,7 +3,7 @@
     <el-dialog v-model="visible" draggable title="审批记录" :width="props.width" :height="props.height" :close-on-click-modal="false">
       <el-tabs v-model="tabActiveName" class="demo-tabs">
         <el-tab-pane v-loading="loading" label="流程图" name="image" style="height: 68vh">
-          <flowChart :defJson="defJson" v-if="defJson != ''" />
+          <flowChart :ins-id="insId" v-if="insId != ''" />
         </el-tab-pane>
         <el-tab-pane v-loading="loading" label="审批信息" name="info">
           <div>
@@ -73,20 +73,18 @@ const loading = ref(false);
 const visible = ref(false);
 const historyList = ref<Array<any>>([]);
 const tabActiveName = ref('image');
-const imgUrl = ref('');
-const defJson = ref<any>('');
+const insId = ref(null);
 
 //初始化查询审批记录
-const init = async (businessId: string | number) => {
+const init = async (businessId: string | number, instanceId: string | number) => {
   visible.value = true;
   loading.value = true;
   tabActiveName.value = 'image';
   historyList.value = [];
+  insId.value = instanceId;
   flowImage(businessId).then((resp) => {
     if (resp.data) {
       historyList.value = resp.data.list;
-      imgUrl.value = 'data:image/gif;base64,' + resp.data.image;
-      defJson.value = resp.data.defChart.defJson;
       if (historyList.value.length > 0) {
         historyList.value.forEach((item) => {
           if (item.ext) {
diff --git a/src/components/Process/flowChart.vue b/src/components/Process/flowChart.vue
index d5cd2c15..f0afe466 100644
--- a/src/components/Process/flowChart.vue
+++ b/src/components/Process/flowChart.vue
@@ -1,84 +1,29 @@
 <template>
   <div>
-    <el-header style="border-bottom: 1px solid rgb(218 218 218); height: auto">
-      <div style="display: flex; padding: 10px 0px; justify-content: space-between">
-        <div>
-          <el-tooltip effect="dark" content="自适应屏幕" placement="bottom">
-            <el-button size="small" icon="Rank" @click="zoomViewport(1)">自适应屏幕</el-button>
-          </el-tooltip>
-          <el-tooltip effect="dark" content="放大" placement="bottom">
-            <el-button size="small" icon="ZoomIn" @click="zoomViewport(true)">放大</el-button>
-          </el-tooltip>
-          <el-tooltip effect="dark" content="缩小" placement="bottom">
-            <el-button size="small" icon="ZoomOut" @click="zoomViewport(false)">缩小</el-button>
-          </el-tooltip>
-        </div>
-        <div>
-          <el-button size="small" style="border: 1px solid #000">未完成</el-button>
-          <el-button size="small" style="background-color: #fff8dc; border: 1px solid #ffcd17">进行中</el-button>
-          <el-button size="small" style="background-color: #f0ffd9; border: 1px solid #9dff00">已完成</el-button>
-        </div>
-      </div>
-    </el-header>
-    <div class="container" ref="container"></div>
+    <div :style="'height:' + height">
+      <iframe :src="iframeUrl" style="width: 100%; height: 100%" />
+    </div>
   </div>
 </template>
 
 <script setup lang="ts">
-import LogicFlow from '@logicflow/core';
 import '@logicflow/core/lib/style/index.css';
-import Start from './js/start.js';
-import Between from './js/between.js';
-import Serial from './js/serial.js';
-import Parallel from './js/parallel.js';
-import End from './js/end.js';
-import Skip from './js/skip.js';
-import { json2LogicFlowJson } from './js/tool.js';
+import { getToken } from '@/utils/auth';
 
 // Props 定义方式变化
 const props = defineProps({
-  defJson: {
-    type: Object,
-    default: () => ({})
+  insId: {
+    type: [String, Number],
+    default: null
   }
 });
 
-const container = ref(null);
-const lf = ref(null);
-const register = () => {
-  lf.value.register(Start);
-  lf.value.register(Between);
-  lf.value.register(Serial);
-  lf.value.register(Parallel);
-  lf.value.register(End);
-  lf.value.register(Skip);
-};
-const zoomViewport = async (zoom) => {
-  lf.value.zoom(zoom);
-  // 将内容平移至画布中心
-  lf.value.translateCenter();
-};
+const height = document.documentElement.clientHeight - 94.5 + 'px';
+const iframeUrl = ref('');
+const baseUrl = import.meta.env.VITE_APP_BASE_API;
 
 onMounted(async () => {
-  if (props.defJson) {
-    const data = json2LogicFlowJson(props.defJson);
-    lf.value = new LogicFlow({
-      container: container.value,
-      grid: false,
-      isSilentMode: true,
-      textEdit: false
-    });
-    register();
-    lf.value.render(data);
-    lf.value.translateCenter();
-  }
+  const url = baseUrl + `/warm-flow-ui/index.html?id=${props.insId}&type=FlowChart`;
+  iframeUrl.value = url + '&Authorization=Bearer ' + getToken() + '&clientid=' + import.meta.env.VITE_APP_CLIENT_ID;
 });
 </script>
-
-<style scoped>
-/* 样式部分保持不变 */
-.container {
-  width: 100%;
-  height: 500px;
-}
-</style>
diff --git a/src/views/workflow/leave/leaveEdit.vue b/src/views/workflow/leave/leaveEdit.vue
index d68a0f2a..bebb1f92 100644
--- a/src/views/workflow/leave/leaveEdit.vue
+++ b/src/views/workflow/leave/leaveEdit.vue
@@ -270,7 +270,7 @@ const handleStartWorkFlow = async (data: LeaveForm) => {
 };
 //审批记录
 const handleApprovalRecord = () => {
-  approvalRecordRef.value.init(form.value.id);
+  approvalRecordRef.value.init(form.value.id, routeParams.value.instanceId);
 };
 //提交回调
 const submitCallback = async () => {
diff --git a/src/views/workflow/processInstance/index.vue b/src/views/workflow/processInstance/index.vue
index 9265c524..97767220 100644
--- a/src/views/workflow/processInstance/index.vue
+++ b/src/views/workflow/processInstance/index.vue
@@ -159,7 +159,7 @@
         <template #header>
           <div class="clearfix">
             <span
-              >流程定义名称：<el-tag>{{ processDefinitionName }}</el-tag></span
+            >流程定义名称：<el-tag>{{ processDefinitionName }}</el-tag></span
             >
           </div>
         </template>
@@ -371,7 +371,8 @@ const handleView = (row) => {
     taskId: row.id,
     type: 'view',
     formCustom: row.formCustom,
-    formPath: row.formPath
+    formPath: row.formPath,
+    instanceId: row.instanceId
   });
   workflowCommon.routerJump(routerJumpVo, proxy);
 };
diff --git a/src/views/workflow/task/allTaskWaiting.vue b/src/views/workflow/task/allTaskWaiting.vue
index cf1ca528..026628a4 100644
--- a/src/views/workflow/task/allTaskWaiting.vue
+++ b/src/views/workflow/task/allTaskWaiting.vue
@@ -227,7 +227,8 @@ const handleView = (row) => {
     taskId: row.id,
     type: 'view',
     formCustom: row.formCustom,
-    formPath: row.formPath
+    formPath: row.formPath,
+    instanceId: row.instanceId
   });
   workflowCommon.routerJump(routerJumpVo, proxy);
 };
diff --git a/src/views/workflow/task/myDocument.vue b/src/views/workflow/task/myDocument.vue
index 18f3c398..c7cfcd72 100644
--- a/src/views/workflow/task/myDocument.vue
+++ b/src/views/workflow/task/myDocument.vue
@@ -80,7 +80,7 @@
                   </el-col>
                   <el-col :span="1.5" v-if="scope.row.flowStatus === 'waiting'">
                     <el-button type="primary" size="small" icon="Notification" @click="handleCancelProcessApply(scope.row.businessId)"
-                      >撤销</el-button
+                    >撤销</el-button
                     >
                   </el-col>
                 </el-row>
@@ -239,7 +239,8 @@ const handleOpen = async (row, type) => {
     taskId: row.id,
     type: type,
     formCustom: row.formCustom,
-    formPath: row.formPath
+    formPath: row.formPath,
+    instanceId: row.instanceId
   });
   workflowCommon.routerJump(routerJumpVo, proxy);
 };
diff --git a/src/views/workflow/task/taskCopyList.vue b/src/views/workflow/task/taskCopyList.vue
index 673960fd..9df09217 100644
--- a/src/views/workflow/task/taskCopyList.vue
+++ b/src/views/workflow/task/taskCopyList.vue
@@ -125,7 +125,8 @@ const handleView = (row) => {
     taskId: row.id,
     type: 'view',
     formCustom: row.formCustom,
-    formPath: row.formPath
+    formPath: row.formPath,
+    instanceId: row.instanceId
   });
   workflowCommon.routerJump(routerJumpVo, proxy);
 };
diff --git a/src/views/workflow/task/taskFinish.vue b/src/views/workflow/task/taskFinish.vue
index 786202a7..79f25e5f 100644
--- a/src/views/workflow/task/taskFinish.vue
+++ b/src/views/workflow/task/taskFinish.vue
@@ -158,7 +158,8 @@ const handleView = (row: FlowTaskVO) => {
     taskId: row.id,
     type: 'view',
     formCustom: row.formCustom,
-    formPath: row.formPath
+    formPath: row.formPath,
+    instanceId: row.instanceId
   });
   workflowCommon.routerJump(routerJumpVo, proxy);
 };
diff --git a/src/views/workflow/task/taskWaiting.vue b/src/views/workflow/task/taskWaiting.vue
index 31feb902..4a26afab 100644
--- a/src/views/workflow/task/taskWaiting.vue
+++ b/src/views/workflow/task/taskWaiting.vue
@@ -160,7 +160,8 @@ const handleOpen = async (row: FlowTaskVO) => {
     taskId: row.id,
     type: 'approval',
     formCustom: row.formCustom,
-    formPath: row.formPath
+    formPath: row.formPath,
+    instanceId: row.instanceId
   });
   workflowCommon.routerJump(routerJumpVo, proxy);
 };
-- 
Gitee