admin/lx-admin-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

!209 新增通过前端显示流程图方式和新增办理人转换接口

Browse Source 
Merge pull request !209 from 晓华/dev
This commit is contained in:
疯狂的狮子Li 2025-05-27 09:02:28 +00:00 committed by Gitee
commit ba78f8cc0d
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
11 changed files with 34 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/api/workflow/workflowCommon/index.ts
View File

@ -8,7 +8,8 @@ export default {
query: {
id: routerJumpVo.businessId,
type: routerJumpVo.type,
taskId: routerJumpVo.taskId
taskId: routerJumpVo.taskId,
instanceId: routerJumpVo.instanceId
}
});
}

1
src/api/workflow/workflowCommon/types.ts
View File

@ -4,6 +4,7 @@ export interface RouterJumpVo {
type: string;
formCustom: string;
formPath: string;
instanceId: string | number;
}
export interface StartProcessBo {

10
src/components/Process/approvalRecord.vue
View File

@ -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) {

79
src/components/Process/flowChart.vue
View File

@ -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>

2
src/views/workflow/leave/leaveEdit.vue
View File

@ -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 () => {

5
src/views/workflow/processInstance/index.vue
View File

@ -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);
};

3
src/views/workflow/task/allTaskWaiting.vue
View File

@ -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);
};

5
src/views/workflow/task/myDocument.vue
View File

@ -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);
};

3
src/views/workflow/task/taskCopyList.vue
View File

@ -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);
};

3
src/views/workflow/task/taskFinish.vue
View File

@ -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);
};

3
src/views/workflow/task/taskWaiting.vue
View File

@ -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);
};