From c9a6f7cbb5209415e626df29c7572cf40fe92b66 Mon Sep 17 00:00:00 2001
From: houzhongjian <houzhongyi@126.com>
Date: 星期一, 06 一月 2025 11:44:50 +0800
Subject: [PATCH] 1、工作流程功能优化，解决流程图模拟功能simulation不生效的bug 2、system menu等页面修改 3、Footer copyright年份修改为动态
---
src/components/bpmnProcessDesigner/package/penal/PropertiesPanel.vue | 142 +++++++++++++++++++++++++++++++---------------
1 files changed, 95 insertions(+), 47 deletions(-)
diff --git a/src/components/bpmnProcessDesigner/package/penal/PropertiesPanel.vue b/src/components/bpmnProcessDesigner/package/penal/PropertiesPanel.vue
index 96e8b08..e426eb6 100644
--- a/src/components/bpmnProcessDesigner/package/penal/PropertiesPanel.vue
+++ b/src/components/bpmnProcessDesigner/package/penal/PropertiesPanel.vue
@@ -1,6 +1,6 @@
<template>
- <div class="process-panel__container" :style="{ width: `${width}px`,maxHeight: '700px' }">
- <el-collapse v-model="activeTab">
+ <div class="process-panel__container" :style="{ width: `${width}px` }">
+ <el-collapse v-model="activeTab" v-if="isReady">
<el-collapse-item name="base">
<!-- class="panel-tab__title" -->
<template #title>
@@ -26,8 +26,10 @@
<template #title><Icon icon="ep:list" />表单</template>
<element-form :id="elementId" :type="elementType" />
</el-collapse-item>
- <el-collapse-item name="task" v-if="elementType.indexOf('Task') !== -1" key="task">
- <template #title><Icon icon="ep:checked" />任务（审批人）</template>
+ <el-collapse-item name="task" v-if="isTaskCollapseItemShow(elementType)" key="task">
+ <template #title
+ ><Icon icon="ep:checked" />{{ getTaskCollapseItemName(elementType) }}</template
+ >
<element-task :id="elementId" :type="elementType" />
</el-collapse-item>
<el-collapse-item
@@ -35,8 +37,12 @@
v-if="elementType.indexOf('Task') !== -1"
key="multiInstance"
>
- <template #title><Icon icon="ep:help-filled" />多实例（会签配置）</template>
- <element-multi-instance :business-object="elementBusinessObject" :type="elementType" />
+ <template #title><Icon icon="ep:help-filled" />多人审批方式</template>
+ <element-multi-instance
+ :id="elementId"
+ :business-object="elementBusinessObject"
+ :type="elementType"
+ />
</el-collapse-item>
<el-collapse-item name="listeners" key="listeners">
<template #title><Icon icon="ep:bell-filled" />执行监听器</template>
@@ -54,9 +60,13 @@
<template #title><Icon icon="ep:promotion" />其他</template>
<element-other-config :id="elementId" />
</el-collapse-item>
- <el-collapse-item name="customConfig" v-if="elementType.indexOf('Task') !== -1" key="customConfig">
- <template #title><Icon icon="ep:circle-plus-filled" />自定义配置</template>
- <element-custom-config :id="elementId" :type="elementType" />
+ <el-collapse-item name="customConfig" key="customConfig">
+ <template #title><Icon icon="ep:tools" />自定义配置</template>
+ <element-custom-config
+ :id="elementId"
+ :type="elementType"
+ :business-object="elementBusinessObject"
+ />
</el-collapse-item>
</el-collapse>
</div>
@@ -72,6 +82,7 @@
import ElementProperties from './properties/ElementProperties.vue'
// import ElementForm from './form/ElementForm.vue'
import UserTaskListeners from './listeners/UserTaskListeners.vue'
+import { getTaskCollapseItemName, isTaskCollapseItemShow } from './task/data'
defineOptions({ name: 'MyPropertiesPanel' })
@@ -108,24 +119,16 @@
const conditionFormVisible = ref(false) // 流转条件设置
const formVisible = ref(false) // 表单配置
const bpmnElement = ref()
+const isReady = ref(false)
provide('prefix', props.prefix)
provide('width', props.width)
-const bpmnInstances = () => (window as any)?.bpmnInstances
-// 监听 props.bpmnModeler 然后 initModels
-const unwatchBpmn = watch(
- () => props.bpmnModeler,
- () => {
- // 避免加载时 流程图 并未加载完成
- if (!props.bpmnModeler) {
- console.log('缺少props.bpmnModeler')
- return
- }
-
- console.log('props.bpmnModeler 有值了！！！')
- const w = window as any
- w.bpmnInstances = {
+// 初始化 bpmnInstances
+const initBpmnInstances = () => {
+ if (!props.bpmnModeler) return false
+ try {
+ const instances = {
modeler: props.bpmnModeler,
modeling: props.bpmnModeler.get('modeling'),
moddle: props.bpmnModeler.get('moddle'),
@@ -137,9 +140,45 @@
selection: props.bpmnModeler.get('selection')
}
- console.log(bpmnInstances(), 'window.bpmnInstances')
- getActiveElement()
- unwatchBpmn()
+ // 检查所有实例是否都存在
+ const allInstancesExist = Object.values(instances).every(instance => instance)
+ if (allInstancesExist) {
+ const w = window as any
+ w.bpmnInstances = instances
+ return true
+ }
+ return false
+ } catch (error) {
+ console.error('初始化 bpmnInstances 失败:', error)
+ return false
+ }
+}
+
+const bpmnInstances = () => (window as any)?.bpmnInstances
+
+// 监听 props.bpmnModeler 然后 initModels
+const unwatchBpmn = watch(
+ () => props.bpmnModeler,
+ async () => {
+ // 避免加载时 流程图 并未加载完成
+ if (!props.bpmnModeler) {
+ console.log('缺少props.bpmnModeler')
+ return
+ }
+
+ try {
+ // 等待 modeler 初始化完成
+ await nextTick()
+ if (initBpmnInstances()) {
+ isReady.value = true
+ await nextTick()
+ getActiveElement()
+ } else {
+ console.error('modeler 实例未完全初始化')
+ }
+ } catch (error) {
+ console.error('初始化失败:', error)
+ }
},
{
immediate: true
@@ -147,6 +186,8 @@
)
const getActiveElement = () => {
+ if (!isReady.value || !props.bpmnModeler) return
+
// 初始第一个选中元素 bpmn:Process
initFormOnChanged(null)
props.bpmnModeler.on('import.done', (e) => {
@@ -164,8 +205,11 @@
}
})
}
+
// 初始化数据
const initFormOnChanged = (element) => {
+ if (!isReady.value || !bpmnInstances()) return
+
let activatedElement = element
if (!activatedElement) {
activatedElement =
@@ -173,32 +217,36 @@
bpmnInstances().elementRegistry.find((el) => el.type === 'bpmn:Collaboration')
}
if (!activatedElement) return
- console.log(`
- ----------
- select element changed:
- id: ${activatedElement.id}
- type: ${activatedElement.businessObject.$type}
- ----------
- `)
- console.log('businessObject: ', activatedElement.businessObject)
- bpmnInstances().bpmnElement = activatedElement
- bpmnElement.value = activatedElement
- elementId.value = activatedElement.id
- elementType.value = activatedElement.type.split(':')[1] || ''
- elementBusinessObject.value = JSON.parse(JSON.stringify(activatedElement.businessObject))
- conditionFormVisible.value = !!(
- elementType.value === 'SequenceFlow' &&
- activatedElement.source &&
- activatedElement.source.type.indexOf('StartEvent') === -1
- )
- formVisible.value = elementType.value === 'UserTask' || elementType.value === 'StartEvent'
+
+ try {
+ console.log(`
+ ----------
+ select element changed:
+ id: ${activatedElement.id}
+ type: ${activatedElement.businessObject.$type}
+ ----------
+ `)
+ console.log('businessObject: ', activatedElement.businessObject)
+ bpmnInstances().bpmnElement = activatedElement
+ bpmnElement.value = activatedElement
+ elementId.value = activatedElement.id
+ elementType.value = activatedElement.type.split(':')[1] || ''
+ elementBusinessObject.value = JSON.parse(JSON.stringify(activatedElement.businessObject))
+ conditionFormVisible.value = !!(
+ elementType.value === 'SequenceFlow' &&
+ activatedElement.source &&
+ activatedElement.source.type.indexOf('StartEvent') === -1
+ )
+ formVisible.value = elementType.value === 'UserTask' || elementType.value === 'StartEvent'
+ } catch (error) {
+ console.error('初始化表单数据失败:', error)
+ }
}
onBeforeUnmount(() => {
const w = window as any
w.bpmnInstances = null
- console.log(props, 'props1')
- console.log(props.bpmnModeler, 'props.bpmnModeler1')
+ isReady.value = false
})
watch(
--
Gitblit v1.9.3