From 9005fa4d69a01d942f776403dd79e79501c0e6bd Mon Sep 17 00:00:00 2001
From: LiuHao <liuhaoai545@gmail.com>
Date: Sun, 21 Jan 2024 21:27:57 +0800
Subject: [PATCH] =?UTF-8?q?update=20=E4=BC=98=E5=8C=96=E9=9D=A2=E6=9D=BF?=
 =?UTF-8?q?=E5=B7=A5=E5=85=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/BpmnDesign/PropertyPanel.vue   |  3 ++-
 src/components/BpmnDesign/panel/TaskPanel.vue | 21 +++++++++++++------
 .../panel/property/ExecutionListener.vue      | 16 +++++++-------
 .../panel/property/TaskListener.vue           | 11 +++++-----
 src/types/bpmn.d.ts                           | 11 ++++++++++
 5 files changed, 42 insertions(+), 20 deletions(-)

diff --git a/src/components/BpmnDesign/PropertyPanel.vue b/src/components/BpmnDesign/PropertyPanel.vue
index 9ec083e..f0da6c7 100644
--- a/src/components/BpmnDesign/PropertyPanel.vue
+++ b/src/components/BpmnDesign/PropertyPanel.vue
@@ -80,7 +80,8 @@ const handleModeler = () => {
     }
   });
   props.modeler.on('selection.changed', (e) => {
-    // element.value = null;
+    // 先给null为了让vue刷新
+    element.value = null;
     const newElement = e.newSelection[0];
     if (newElement) {
       nextTick(() => {
diff --git a/src/components/BpmnDesign/panel/TaskPanel.vue b/src/components/BpmnDesign/panel/TaskPanel.vue
index 5d2de6f..21209f3 100644
--- a/src/components/BpmnDesign/panel/TaskPanel.vue
+++ b/src/components/BpmnDesign/panel/TaskPanel.vue
@@ -1,19 +1,28 @@
 <template>
   <div>
     <el-form ref="formRef" v-model="formData" label-width="80px">
-      <el-form-item prop="id" label="节点 id">
-        <el-input v-model="formData.id" placeholder="请输入"> </el-input>
+      <el-form-item prop="id" label="节点 ID">
+        <el-input v-model="formData.id"> </el-input>
       </el-form-item>
+      <el-form-item prop="name" label="节点名称">
+        <el-input v-model="formData.name"> </el-input>
+      </el-form-item>
+      <el-form-item prop="documentation" label="节点描述">
+        <el-input v-model="formData.documentation"> </el-input>
+      </el-form-item>
+      <el-form-item prop="userType" label="人员类型">
+        <el-input v-model="formData.userType"> </el-input>
+      </el-form-item>
+      <el-form-item label="执行监听器" style="margin-bottom: 0"> </el-form-item>
+      <ExecutionListener :modeler="modeler" :element="element"></ExecutionListener>
       <el-form-item label="任务监听器" style="margin-bottom: 0"> </el-form-item>
       <TaskListener :modeler="modeler" :element="element"></TaskListener>
     </el-form>
   </div>
 </template>
 <script setup lang="ts">
-import showConfig from '@/components/BpmnDesign/assets/showConfig';
-import TaskListener from './property/TaskListener.vue';
 import useParseElement from '@/components/BpmnDesign/hooks/useParseElement';
-import { ProcessPanel } from 'bpmnDesign';
+import { TaskPanel } from 'bpmnDesign';
 
 interface PropType {
   modeler: any;
@@ -23,7 +32,7 @@ interface PropType {
 const props = withDefaults(defineProps<PropType>(), {
   categorys: () => []
 });
-const { parse, formData } = useParseElement<ProcessPanel>({
+const { parse, formData } = useParseElement<TaskPanel>({
   modeler: props.modeler,
   element: toRaw(props.element)
 });
diff --git a/src/components/BpmnDesign/panel/property/ExecutionListener.vue b/src/components/BpmnDesign/panel/property/ExecutionListener.vue
index a899b7b..8483494 100644
--- a/src/components/BpmnDesign/panel/property/ExecutionListener.vue
+++ b/src/components/BpmnDesign/panel/property/ExecutionListener.vue
@@ -89,13 +89,6 @@ const props = withDefaults(defineProps<PropType>(), {
 });
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
-const initData: ExecutionListenerVO = {
-  event: '',
-  type: '',
-  className: '',
-  params: []
-};
-const formData = ref<ExecutionListenerVO>(initData);
 
 const selectRow = ref<ExecutionListenerVO | null>();
 const formDialog = useDialog({
@@ -113,7 +106,14 @@ const { showConfig, elementType, updateProperties } = usePanel({
 const listenerParamRef = ref<InstanceType<typeof ListenerParam>>();
 const tableRef = ref<VxeTableInstance<ExecutionListenerVO>>();
 const formRef = ref<ElFormInstance>();
-const currentIndex = ref(0);
+
+const initData: ExecutionListenerVO = {
+  event: '',
+  type: '',
+  className: '',
+  params: []
+};
+const formData = ref<ExecutionListenerVO>({ ...initData });
 const tableData = ref<ExecutionListenerVO[]>([]);
 const tableRules = ref<ElFormRules>({
   event: [{ required: true, message: '请选择', trigger: 'blur' }],
diff --git a/src/components/BpmnDesign/panel/property/TaskListener.vue b/src/components/BpmnDesign/panel/property/TaskListener.vue
index d7a4e83..52bfa0c 100644
--- a/src/components/BpmnDesign/panel/property/TaskListener.vue
+++ b/src/components/BpmnDesign/panel/property/TaskListener.vue
@@ -99,6 +99,11 @@ const { showConfig, elementType, updateProperties } = usePanel({
   modeler: props.modeler,
   element: toRaw(props.element)
 });
+
+const listenerParamRef = ref<InstanceType<typeof ListenerParam>>();
+const tableRef = ref<VxeTableInstance<TaskListenerVO>>();
+const formRef = ref<ElFormInstance>();
+
 const initData: TaskListenerVO = {
   event: '',
   type: '',
@@ -106,11 +111,7 @@ const initData: TaskListenerVO = {
   name: '',
   params: []
 };
-const listenerParamRef = ref<InstanceType<typeof ListenerParam>>();
-const tableRef = ref<VxeTableInstance<TaskListenerVO>>();
-const formRef = ref<ElFormInstance>();
-
-const formData = ref<TaskListenerVO>(initData);
+const formData = ref<TaskListenerVO>({ ...initData });
 const currentIndex = ref(0);
 const tableData = ref<TaskListenerVO[]>([]);
 const tableRules = ref<VxeTablePropTypes.EditRules>({
diff --git a/src/types/bpmn.d.ts b/src/types/bpmn.d.ts
index cf400d6..b7fd9b5 100644
--- a/src/types/bpmn.d.ts
+++ b/src/types/bpmn.d.ts
@@ -21,9 +21,20 @@ declare module 'bpmnDesign' {
   }
 
   export interface ProcessPanel {
+    processCategory: string;
+    id: string;
+    name: string;
+    documentation?: string;
+  }
+
+  export interface TaskPanel {
     processCategory: string;
     id: string;
     name: string;
     documentation: string;
+    userType: string;
+    assignee: string;
+    candidateUsers: string;
+    candidateGroups: string;
   }
 }