From 357955ce246fa307d76a328996081e5271ee1c22 Mon Sep 17 00:00:00 2001
From: Lesan <1960681385@qq.com>
Date: Fri, 21 Feb 2025 16:07:13 +0800
Subject: [PATCH 1/3] =?UTF-8?q?feat:=20=E5=AD=90=E6=B5=81=E7=A8=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/svgs/bpm/async-child-process.svg   |   1 +
 src/assets/svgs/bpm/child-process.svg         |   1 +
 .../src/NodeHandler.vue                       |  31 ++
 .../src/ProcessNodeTree.vue                   |  11 +-
 .../SimpleProcessDesignerV2/src/consts.ts     |  42 ++-
 .../nodes-config/ChildProcessNodeConfig.vue   | 330 ++++++++++++++++++
 .../src/nodes/ChildProcessNode.vue            | 104 ++++++
 .../theme/iconfont.ttf                        | Bin 4360 -> 4808 bytes
 .../theme/iconfont.woff                       | Bin 2860 -> 3176 bytes
 .../theme/iconfont.woff2                      | Bin 2328 -> 2628 bytes
 .../theme/simple-process-designer.scss        |  24 ++
 .../create/ProcessDefinitionDetail.vue        |  36 +-
 .../detail/ProcessInstanceSimpleViewer.vue    |   4 +-
 .../detail/ProcessInstanceTimeline.vue        |  10 +-
 14 files changed, 571 insertions(+), 23 deletions(-)
 create mode 100644 src/assets/svgs/bpm/async-child-process.svg
 create mode 100644 src/assets/svgs/bpm/child-process.svg
 create mode 100644 src/components/SimpleProcessDesignerV2/src/nodes-config/ChildProcessNodeConfig.vue
 create mode 100644 src/components/SimpleProcessDesignerV2/src/nodes/ChildProcessNode.vue

diff --git a/src/assets/svgs/bpm/async-child-process.svg b/src/assets/svgs/bpm/async-child-process.svg
new file mode 100644
index 00000000..2a27773d
--- /dev/null
+++ b/src/assets/svgs/bpm/async-child-process.svg
@@ -0,0 +1 @@
+<svg t="1740116978908" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1356" width="200" height="200"><path d="M860.544 633.856c-82.368 0-152.128 69.632-158.464 152h-354.88c-31.616 0-63.296-31.68-63.296-63.296V437.376c12.608 0 25.344 6.4 44.288 6.4h380.16c12.672 69.696 76.032 126.656 152.128 126.656 88.704 0 158.336-69.696 158.336-158.4s-69.632-158.4-158.336-158.4c-76.096 0-139.456 57.024-152.128 126.656h-361.216c-31.616 0-63.296-31.68-63.296-63.296v-133.12h164.736c31.68 0 63.296-22.848 63.296-54.528a55.04 55.04 0 0 0-56-56h-380.16c-31.68 0-70.72 17.984-70.72 56s31.68 54.528 63.36 54.528h133.056v538.624c0 69.696 57.088 126.656 126.72 126.656h386.56c25.344 57.088 82.368 101.376 145.728 101.376a156.8 156.8 0 0 0 158.336-158.4 156.608 156.608 0 0 0-158.208-158.272z m0-316.8c50.624 0 94.912 44.288 94.912 94.976s-44.288 94.976-94.912 94.976c-50.752 0-95.104-44.288-95.104-94.976s44.352-94.976 95.104-94.976z m0 570.24c-50.752 0-95.104-44.352-95.104-95.04s44.352-95.04 95.104-95.04c50.624 0 94.912 44.352 94.912 95.04s-44.288 95.04-94.912 95.04z" p-id="1357" fill="#ffffff"></path></svg>
\ No newline at end of file
diff --git a/src/assets/svgs/bpm/child-process.svg b/src/assets/svgs/bpm/child-process.svg
new file mode 100644
index 00000000..249723f7
--- /dev/null
+++ b/src/assets/svgs/bpm/child-process.svg
@@ -0,0 +1 @@
+<svg t="1740116949537" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1153" width="200" height="200"><path d="M440.32 296.96h283.30496v145.92h66.56V230.4H440.32V17.92H17.92v424.96H440.32V296.96zM373.76 376.32H84.48v-291.84H373.76v291.84zM586.24 588.8v143.36512H298.66496V586.24h-66.56v212.48512H586.24V1013.76H1008.64v-424.96h-422.4z m355.84 358.4h-289.28v-291.84H942.08v291.84z" p-id="1154" fill="#ffffff"></path></svg>
\ No newline at end of file
diff --git a/src/components/SimpleProcessDesignerV2/src/NodeHandler.vue b/src/components/SimpleProcessDesignerV2/src/NodeHandler.vue
index ab5b6271..2b600c68 100644
--- a/src/components/SimpleProcessDesignerV2/src/NodeHandler.vue
+++ b/src/components/SimpleProcessDesignerV2/src/NodeHandler.vue
@@ -63,6 +63,18 @@
             </div>
             <div class="handler-item-text">触发器</div>
           </div>
+          <div class="handler-item" @click="addNode(NodeType.CHILD_PROCESS_NODE)">
+            <div class="handler-item-icon child-process">
+              <span class="iconfont icon-size icon-child-process"></span>
+            </div>
+            <div class="handler-item-text">子流程</div>
+          </div>
+          <div class="handler-item" @click="addNode(NodeType.ASYNC_CHILD_PROCESS_NODE)">
+            <div class="handler-item-icon async-child-process">
+              <span class="iconfont icon-size icon-async-child-process"></span>
+            </div>
+            <div class="handler-item-text">异步子流程</div>
+          </div>
         </div>
         <template #reference>
           <div class="add-icon"><Icon icon="ep:plus" /></div>
@@ -283,6 +295,25 @@ const addNode = (type: number) => {
     }
     emits('update:childNode', data)
   }
+  if (type === NodeType.CHILD_PROCESS_NODE) {
+    const data: SimpleFlowNode = {
+      id: 'Activity_' + generateUUID(),
+      name: NODE_DEFAULT_NAME.get(NodeType.CHILD_PROCESS_NODE) as string,
+      showText: '',
+      type: NodeType.CHILD_PROCESS_NODE,
+      childNode: props.childNode,
+      childProcessSetting: {
+        calledElement: '',
+        calledElementName: '',
+        async: false,
+        skipStartUserNode: false,
+        startUserSetting: {
+          type: 1
+        }
+      }
+    }
+    emits('update:childNode', data)
+  }
 }
 </script>
 
diff --git a/src/components/SimpleProcessDesignerV2/src/ProcessNodeTree.vue b/src/components/SimpleProcessDesignerV2/src/ProcessNodeTree.vue
index cdb54032..dddeda69 100644
--- a/src/components/SimpleProcessDesignerV2/src/ProcessNodeTree.vue
+++ b/src/components/SimpleProcessDesignerV2/src/ProcessNodeTree.vue
@@ -54,12 +54,18 @@
     :flow-node="currentNode"
     @update:flow-node="handleModelValueUpdate"
   />
-   <!-- 触发器节点 -->
-   <TriggerNode
+  <!-- 触发器节点 -->
+  <TriggerNode
     v-if="currentNode && currentNode.type === NodeType.TRIGGER_NODE"
     :flow-node="currentNode"
     @update:flow-node="handleModelValueUpdate"
   />
+  <!-- 子流程节点 -->
+  <ChildProcessNode
+    v-if="currentNode && currentNode.type === NodeType.CHILD_PROCESS_NODE"
+    :flow-node="currentNode"
+    @update:flow-node="handleModelValueUpdate"
+  />
   <!-- 递归显示孩子节点  -->
   <ProcessNodeTree
     v-if="currentNode && currentNode.childNode"
@@ -85,6 +91,7 @@ import InclusiveNode from './nodes/InclusiveNode.vue'
 import DelayTimerNode from './nodes/DelayTimerNode.vue'
 import RouterNode from './nodes/RouterNode.vue'
 import TriggerNode from './nodes/TriggerNode.vue'
+import ChildProcessNode from './nodes/ChildProcessNode.vue'
 import { SimpleFlowNode, NodeType } from './consts'
 import { useWatchNode } from './node'
 defineOptions({
diff --git a/src/components/SimpleProcessDesignerV2/src/consts.ts b/src/components/SimpleProcessDesignerV2/src/consts.ts
index 7270b104..e9d0bde5 100644
--- a/src/components/SimpleProcessDesignerV2/src/consts.ts
+++ b/src/components/SimpleProcessDesignerV2/src/consts.ts
@@ -38,6 +38,16 @@ export enum NodeType {
    */
   TRIGGER_NODE = 15,
 
+  /**
+   * 触发器节点
+   */
+  CHILD_PROCESS_NODE = 20,
+
+  /**
+   * 触发器节点
+   */
+  ASYNC_CHILD_PROCESS_NODE = 21,
+
   /**
    * 条件节点
    */
@@ -128,6 +138,8 @@ export interface SimpleFlowNode {
   reasonRequire?: boolean
   // 触发器设置
   triggerSetting?: TriggerSetting
+  // 子流程
+  childProcessSetting?: ChildProcessSetting
 }
 // 候选人策略枚举 （ 用于审批节点。抄送节点 )
 export enum CandidateStrategy {
@@ -512,6 +524,7 @@ NODE_DEFAULT_TEXT.set(NodeType.DELAY_TIMER_NODE, '请设置延迟器')
 NODE_DEFAULT_TEXT.set(NodeType.ROUTER_BRANCH_NODE, '请设置路由节点')
 NODE_DEFAULT_TEXT.set(NodeType.TRIGGER_NODE, '请设置触发器')
 NODE_DEFAULT_TEXT.set(NodeType.TRANSACTOR_NODE, '请设置办理人')
+NODE_DEFAULT_TEXT.set(NodeType.CHILD_PROCESS_NODE, '请设置子流程')
 
 export const NODE_DEFAULT_NAME = new Map<number, string>()
 NODE_DEFAULT_NAME.set(NodeType.USER_TASK_NODE, '审批人')
@@ -522,6 +535,7 @@ NODE_DEFAULT_NAME.set(NodeType.DELAY_TIMER_NODE, '延迟器')
 NODE_DEFAULT_NAME.set(NodeType.ROUTER_BRANCH_NODE, '路由分支')
 NODE_DEFAULT_NAME.set(NodeType.TRIGGER_NODE, '触发器')
 NODE_DEFAULT_NAME.set(NodeType.TRANSACTOR_NODE, '办理人')
+NODE_DEFAULT_NAME.set(NodeType.CHILD_PROCESS_NODE, '子流程')
 
 // 候选人策略。暂时不从字典中取。 后续可能调整。控制显示顺序
 export const CANDIDATE_STRATEGY: DictDataVO[] = [
@@ -750,7 +764,7 @@ export enum TriggerTypeEnum {
   /**
    * 流程表单更新触发器
    */
-  FORM_UPDATE = 2 
+  FORM_UPDATE = 2
 }
 
 /**
@@ -785,3 +799,29 @@ export const TRIGGER_TYPES: DictDataVO[] = [
   { label: 'HTTP 请求', value: TriggerTypeEnum.HTTP_REQUEST },
   { label: '修改表单数据', value: TriggerTypeEnum.FORM_UPDATE }
 ]
+
+/**
+ * 子流程节点结构定义
+ */
+export type ChildProcessSetting = {
+  calledElement: string
+  calledElementName: string
+  async: boolean,
+  inVariable?: IOParameter[],
+  outVariable?: IOParameter[],
+  skipStartUserNode: boolean,
+  startUserSetting: StartUserSetting,
+}
+
+export type IOParameter = {
+  source: string
+  sourceExpression: string
+  target: string
+  targetExpression: string
+}
+
+export type StartUserSetting = {
+  type: number
+  formField?: string
+  emptyHandleType?: number
+}
diff --git a/src/components/SimpleProcessDesignerV2/src/nodes-config/ChildProcessNodeConfig.vue b/src/components/SimpleProcessDesignerV2/src/nodes-config/ChildProcessNodeConfig.vue
new file mode 100644
index 00000000..26df65ef
--- /dev/null
+++ b/src/components/SimpleProcessDesignerV2/src/nodes-config/ChildProcessNodeConfig.vue
@@ -0,0 +1,330 @@
+<template>
+  <el-drawer
+    :append-to-body="true"
+    v-model="settingVisible"
+    :show-close="false"
+    :size="550"
+    :before-close="saveConfig"
+  >
+    <template #header>
+      <div class="config-header">
+        <input
+          v-if="showInput"
+          type="text"
+          class="config-editable-input"
+          @blur="blurEvent()"
+          v-mountedFocus
+          v-model="nodeName"
+          :placeholder="nodeName"
+        />
+        <div v-else class="node-name">
+          {{ nodeName }} <Icon class="ml-1" icon="ep:edit-pen" :size="16" @click="clickIcon()" />
+        </div>
+        <div class="divide-line"></div>
+      </div>
+    </template>
+    <el-tabs type="border-card" v-model="activeTabName">
+      <el-tab-pane label="子流程" name="child">
+        <div>
+          <el-form ref="formRef" :model="configForm" label-position="top" :rules="formRules">
+            <el-form-item label="选择子流程" prop="calledElement">
+              <el-select
+                v-model="configForm.calledElement"
+                clearable
+                @change="handleCalledElementChange"
+              >
+                <el-option
+                  v-for="(item, index) in childProcessOptions"
+                  :key="index"
+                  :label="item.name"
+                  :value="item.key"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="是否自动跳过子流程发起节点" prop="skipStartUserNode">
+              <el-switch
+                v-model="configForm.skipStartUserNode"
+                active-text="跳过"
+                inactive-text="不跳过"
+              />
+            </el-form-item>
+            <el-form-item label="主→子变量传递" prop="inVariable">
+              <div class="flex pt-2" v-for="(item, index) in configForm.inVariable" :key="index">
+                <div class="mr-2">
+                  <el-form-item
+                    :prop="`inVariable.${index}.source`"
+                    :rules="{
+                      required: true,
+                      message: '变量不能为空',
+                      trigger: 'blur'
+                    }"
+                  >
+                    <el-select class="w-200px!" v-model="item.source">
+                      <el-option
+                        v-for="(field, fIdx) in formFieldOptions"
+                        :key="fIdx"
+                        :label="field.title"
+                        :value="field.field"
+                      />
+                    </el-select>
+                  </el-form-item>
+                </div>
+                <div class="mr-2">
+                  <el-form-item
+                    :prop="`inVariable.${index}.target`"
+                    :rules="{
+                      required: true,
+                      message: '变量不能为空',
+                      trigger: 'blur'
+                    }"
+                  >
+                    <el-select class="w-200px!" v-model="item.target">
+                      <el-option
+                        v-for="(field, fIdx) in childFormFieldOptions"
+                        :key="fIdx"
+                        :label="field.title"
+                        :value="field.field"
+                      />
+                    </el-select>
+                  </el-form-item>
+                </div>
+                <div class="mr-1 flex items-center">
+                  <Icon
+                    icon="ep:delete"
+                    :size="18"
+                    @click="deleteVariable(configForm.inVariable, index)"
+                  />
+                </div>
+              </div>
+              <el-button type="primary" text @click="addVariable(configForm.inVariable)">
+                <Icon icon="ep:plus" class="mr-5px" />添加一行
+              </el-button>
+            </el-form-item>
+            <el-form-item
+              v-if="currentNode.childProcessSetting?.async === false"
+              label="子→主变量传递"
+              prop="outVariable"
+            >
+              <div class="flex pt-2" v-for="(item, index) in configForm.outVariable" :key="index">
+                <div class="mr-2">
+                  <el-form-item
+                    :prop="`outVariable.${index}.source`"
+                    :rules="{
+                      required: true,
+                      message: '变量不能为空',
+                      trigger: 'blur'
+                    }"
+                  >
+                    <el-select class="w-200px!" v-model="item.source">
+                      <el-option
+                        v-for="(field, fIdx) in childFormFieldOptions"
+                        :key="fIdx"
+                        :label="field.title"
+                        :value="field.field"
+                      />
+                    </el-select>
+                  </el-form-item>
+                </div>
+                <div class="mr-2">
+                  <el-form-item
+                    :prop="`outVariable.${index}.target`"
+                    :rules="{
+                      required: true,
+                      message: '变量不能为空',
+                      trigger: 'blur'
+                    }"
+                  >
+                    <el-select class="w-200px!" v-model="item.target">
+                      <el-option
+                        v-for="(field, fIdx) in formFieldOptions"
+                        :key="fIdx"
+                        :label="field.title"
+                        :value="field.field"
+                      />
+                    </el-select>
+                  </el-form-item>
+                </div>
+                <div class="mr-1 flex items-center">
+                  <Icon
+                    icon="ep:delete"
+                    :size="18"
+                    @click="deleteVariable(configForm.outVariable, index)"
+                  />
+                </div>
+              </div>
+              <el-button type="primary" text @click="addVariable(configForm.outVariable)">
+                <Icon icon="ep:plus" class="mr-5px" />添加一行
+              </el-button>
+            </el-form-item>
+            <el-form-item label="子流程发起人" prop="startUserType">
+              <el-radio-group v-model="configForm.startUserType">
+                <el-radio :value="1">同主流程发起人</el-radio>
+                <el-radio :value="2">表单</el-radio>
+              </el-radio-group>
+            </el-form-item>
+            <el-form-item
+              v-if="configForm.startUserType === 2"
+              label="当子流程发起人为空时"
+              prop="startUserType"
+            >
+              <el-radio-group v-model="configForm.startUserEmptyType">
+                <el-radio :value="1">同主流程发起人</el-radio>
+                <el-radio :value="2">子流程管理员</el-radio>
+                <el-radio :value="3">主流程管理员</el-radio>
+              </el-radio-group>
+            </el-form-item>
+            <el-form-item
+              v-if="configForm.startUserType === 2"
+              label="发起人表单"
+              prop="startUserFormField"
+            >
+              <el-select class="w-200px!" v-model="configForm.startUserFormField">
+                <el-option
+                  v-for="(field, fIdx) in formFieldOptions"
+                  :key="fIdx"
+                  :label="field.title"
+                  :value="field.field"
+                />
+              </el-select>
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+    <template #footer>
+      <el-divider />
+      <div>
+        <el-button type="primary" @click="saveConfig">确 定</el-button>
+        <el-button @click="closeDrawer">取 消</el-button>
+      </div>
+    </template>
+  </el-drawer>
+</template>
+<script setup lang="ts">
+import { getModelList } from '@/api/bpm/model'
+import { getForm } from '@/api/bpm/form'
+import { SimpleFlowNode, NodeType } from '../consts'
+import { useWatchNode, useDrawer, useNodeName, useFormFieldsAndStartUser } from '../node'
+import { parseFormFields } from '@/components/FormCreate/src/utils'
+defineOptions({
+  name: 'ChildProcessNodeConfig'
+})
+const props = defineProps({
+  flowNode: {
+    type: Object as () => SimpleFlowNode,
+    required: true
+  }
+})
+// 抽屉配置
+const { settingVisible, closeDrawer, openDrawer } = useDrawer()
+// 当前节点
+const currentNode = useWatchNode(props)
+// 节点名称
+const { nodeName, showInput, clickIcon, blurEvent } = useNodeName(NodeType.CHILD_PROCESS_NODE)
+// 激活的 Tab 标签页
+const activeTabName = ref('child')
+// 子流程表单配置
+const formRef = ref() // 表单 Ref
+// 表单校验规则
+const formRules = reactive({
+  calledElement: [{ required: true, message: '子流程不能为空', trigger: 'change' }],
+  skipStartUserNode: [
+    { required: true, message: '是否自动跳过子流程发起节点不能为空', trigger: 'change' }
+  ],
+  startUserType: [{ required: true, message: '子流程发起人不能为空', trigger: 'change' }],
+  startUserEmptyType: [
+    { required: true, message: '当子流程发起人为空时不能为空', trigger: 'change' }
+  ],
+  startUserFormField: [{ required: true, message: '发起人表单不能为空', trigger: 'change' }]
+})
+const configForm = ref({
+  calledElement: '',
+  skipStartUserNode: false,
+  inVariable: [],
+  outVariable: [],
+  startUserType: 1,
+  startUserEmptyType: 1,
+  startUserFormField: ''
+})
+const childProcessOptions = ref()
+const formFieldOptions = useFormFieldsAndStartUser()
+const childFormFieldOptions = ref()
+
+// 保存配置
+const saveConfig = async () => {
+  activeTabName.value = 'child'
+  if (!formRef) return false
+  const valid = await formRef.value.validate()
+  if (!valid) return false
+  const childInfo = childProcessOptions.value.find(
+    (option) => option.key === configForm.value.calledElement
+  )
+  currentNode.value.name = nodeName.value!
+  if (currentNode.value.childProcessSetting) {
+    currentNode.value.childProcessSetting.calledElement = childInfo.key
+    currentNode.value.childProcessSetting.calledElementName = childInfo.name
+    currentNode.value.childProcessSetting.skipStartUserNode = configForm.value.skipStartUserNode
+    currentNode.value.childProcessSetting.inVariable = configForm.value.inVariable
+    currentNode.value.childProcessSetting.outVariable = configForm.value.outVariable
+    currentNode.value.childProcessSetting.startUserSetting.type = configForm.value.startUserType
+    currentNode.value.childProcessSetting.startUserSetting.emptyHandleType =
+      configForm.value.startUserEmptyType
+    currentNode.value.childProcessSetting.startUserSetting.formField =
+      configForm.value.startUserFormField
+  }
+  currentNode.value.showText = `调用子流程：${childInfo.name}`
+  settingVisible.value = false
+  return true
+}
+// 显示子流程节点配置， 由父组件传过来
+const showChildProcessNodeConfig = (node: SimpleFlowNode) => {
+  nodeName.value = node.name
+  if (node.childProcessSetting) {
+    configForm.value.calledElement = node.childProcessSetting.calledElement
+    configForm.value.skipStartUserNode = node.childProcessSetting.skipStartUserNode
+    configForm.value.inVariable = node.childProcessSetting.inVariable
+    configForm.value.outVariable = node.childProcessSetting.outVariable
+    configForm.value.startUserType = node.childProcessSetting.startUserSetting.type
+    configForm.value.startUserEmptyType =
+      node.childProcessSetting.startUserSetting.emptyHandleType ?? 1
+    configForm.value.startUserFormField = node.childProcessSetting.startUserSetting.formField ?? ''
+  }
+  loadFormInfo()
+}
+
+defineExpose({ openDrawer, showChildProcessNodeConfig }) // 暴露方法给父组件
+
+const addVariable = (arr) => {
+  arr.push({
+    source: '',
+    target: ''
+  })
+}
+const deleteVariable = (arr, index: number) => {
+  arr.splice(index, 1)
+}
+const handleCalledElementChange = () => {
+  configForm.value.inVariable = []
+  configForm.value.outVariable = []
+  loadFormInfo()
+}
+const loadFormInfo = async () => {
+  const childInfo = childProcessOptions.value.find(
+    (option) => option.key === configForm.value.calledElement
+  )
+  const formInfo = await getForm(childInfo.formId)
+  childFormFieldOptions.value = []
+  if (formInfo.fields) {
+    formInfo.fields.forEach((fieldStr: string) => {
+      parseFormFields(JSON.parse(fieldStr), childFormFieldOptions.value)
+    })
+  }
+  console.log(childFormFieldOptions.value)
+}
+
+onMounted(async () => {
+  childProcessOptions.value = await getModelList(undefined)
+})
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/components/SimpleProcessDesignerV2/src/nodes/ChildProcessNode.vue b/src/components/SimpleProcessDesignerV2/src/nodes/ChildProcessNode.vue
new file mode 100644
index 00000000..987f0949
--- /dev/null
+++ b/src/components/SimpleProcessDesignerV2/src/nodes/ChildProcessNode.vue
@@ -0,0 +1,104 @@
+<template>
+  <div class="node-wrapper">
+    <div class="node-container">
+      <div
+        class="node-box"
+        :class="[
+          { 'node-config-error': !currentNode.showText },
+          `${useTaskStatusClass(currentNode?.activityStatus)}`
+        ]"
+      >
+        <div class="node-title-container">
+          <div
+            :class="`node-title-icon ${currentNode.childProcessSetting?.async === true ? 'async-child-process' : 'child-process'}`"
+          >
+            <span
+              :class="`iconfont ${currentNode.childProcessSetting?.async === true ? 'icon-async-child-process' : 'icon-child-process'}`"
+            >
+            </span>
+          </div>
+          <input
+            v-if="!readonly && showInput"
+            type="text"
+            class="editable-title-input"
+            @blur="blurEvent()"
+            v-mountedFocus
+            v-model="currentNode.name"
+            :placeholder="currentNode.name"
+          />
+          <div v-else class="node-title" @click="clickTitle">
+            {{ currentNode.name }}
+          </div>
+        </div>
+        <div class="node-content" @click="openNodeConfig">
+          <div class="node-text" :title="currentNode.showText" v-if="currentNode.showText">
+            {{ currentNode.showText }}
+          </div>
+          <div class="node-text" v-else>
+            {{ NODE_DEFAULT_TEXT.get(NodeType.CHILD_PROCESS_NODE) }}
+          </div>
+          <Icon v-if="!readonly" icon="ep:arrow-right-bold" />
+        </div>
+        <div v-if="!readonly" class="node-toolbar">
+          <div class="toolbar-icon"
+            ><Icon color="#0089ff" icon="ep:circle-close-filled" :size="18" @click="deleteNode"
+          /></div>
+        </div>
+      </div>
+
+      <!-- 传递子节点给添加节点组件。会在子节点前面添加节点 -->
+      <NodeHandler
+        v-if="currentNode"
+        v-model:child-node="currentNode.childNode"
+        :current-node="currentNode"
+      />
+    </div>
+    <ChildProcessNodeConfig
+      v-if="!readonly && currentNode"
+      ref="nodeSetting"
+      :flow-node="currentNode"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { SimpleFlowNode, NodeType, NODE_DEFAULT_TEXT } from '../consts'
+import NodeHandler from '../NodeHandler.vue'
+import { useNodeName2, useWatchNode, useTaskStatusClass } from '../node'
+import ChildProcessNodeConfig from '../nodes-config/ChildProcessNodeConfig.vue'
+defineOptions({
+  name: 'ChildProcessNode'
+})
+const props = defineProps({
+  flowNode: {
+    type: Object as () => SimpleFlowNode,
+    required: true
+  }
+})
+// 定义事件，更新父组件。
+const emits = defineEmits<{
+  'update:flowNode': [node: SimpleFlowNode | undefined]
+}>()
+// 是否只读
+const readonly = inject<Boolean>('readonly')
+// 监控节点的变化
+const currentNode = useWatchNode(props)
+// 节点名称编辑
+const { showInput, blurEvent, clickTitle } = useNodeName2(currentNode, NodeType.CHILD_PROCESS_NODE)
+const nodeSetting = ref()
+// 打开节点配置
+const openNodeConfig = () => {
+  if (readonly) {
+    return
+  }
+  nodeSetting.value.showChildProcessNodeConfig(currentNode.value)
+  nodeSetting.value.openDrawer()
+}
+
+// 删除节点。更新当前节点为孩子节点
+const deleteNode = () => {
+  emits('update:flowNode', currentNode.value.childNode)
+}
+</script>
+
+<style scoped></style>
diff --git a/src/components/SimpleProcessDesignerV2/theme/iconfont.ttf b/src/components/SimpleProcessDesignerV2/theme/iconfont.ttf
index 58f31c36179719bbeed7b42238b838ff9c3d4d49..06f4e31c4b4ce9868cd39b25f6beb1fd5884ff9c 100644
GIT binary patch
delta 961
zcmZvZTSydP6vxk*SzU7--ECcG+}*aFS#@(Am)wh#w@N|usi+4dic&LI@CF)a1pAPI
zRFt_7fsja9(OV>ifrUy$(Nm=bL1qNsM)s1>Ll<W|vs3iaH~hYHneUwQ&3{Ifr^RF2
z<Acv%TL3sO(bm~LeB%7W&Rzi16o5sFb+jH2ynVa{09J|07$wXr{6+HTh@x1};827d
z0Q^E*q`R-Z)i!BgrTP(y-94>C{iwiQdM{Dz?QQMpuwJjZ1CTdM^E&(c286-SKd09K
zHhby7t;=)1T>>Dv#DhoQ2ae{|d;^P#5&$3H&C^Z)+Em;G{CNtqfYY<I^g1Eo!5`yX
zRzl+JI~UU_{jz-8Q^{u2xkWI+7#((kRnIVB9CNc_Hp=d@1@?-qCysHVkoJ;}q?lYw
zr4lc=!Z1?B{~v%1FvBLugdFP4rRP~_R@TfsCt!SvhUqH@fRWLm0vc;TrNG<<)CAbD
z0ks1*YLKoaB^f~@fGrs4U(a3{&{$yW2Koml9R_hA;gX_(u0WC$*CFwYH3Ii>Kdy71
z_}%<8|I$=qn#d@~xS%&oJ>!4zJD?u+!eP=*$wjlQltgVIu^=paxNxWrBSG~2$=6~y
zR2eDp$%;8MUo5CbTfPV5bdd6OTqMZxArI!~q7uYN9oh|Jr1&GHjpe*{Rq|)%ShMl8
zxol6d+8hWptHpcD%-R*ne?#)iqBi1ki1{|>SznccXYBie-fC5n)atF0>U63Vs>`Jo
z7V3M29%E){V`+Swh#uagR4IX`gG~Xle(9_?DCb(EdBO&xMrxH*UbU;bT*O+Z8qy1C
z+jv5z%;hR0Uza>}j{nN{(GL<p1Q%%`JHk;pD%)f~VRy(;pF?)YHl8A!MR&b+O*@1)
z>oxxhDofgj25iGy4cdE@xt8(eC9S0ai!}44@#QyoTbsZln2DL9IVdD1tp#orFc&PR
Xy1Khgw#PbpJ1esP`H6eh0|>tXY+u>p

delta 564
zcmZvYze`(D6vw~kzLyu17i&;sG6V^=T}r?opi{s>{{TfC+NBL`nhZ%3XoduYtRV(e
zf?F1GaS-tb;^NY+yWpm@DEAF1-RjUK{oeP64()w>?mhS1`#tA--`AJz=eu()cRhR!
zs1#W$mYW~<R}S6)b_s|amkRk0uXg6Y0Qg3hN=$_BtuA9~@S;?yH?j->`N1h$uD;KY
zcE|eEuW_HM<Qp}~;GE~IkIbihr4T>NodVA$*{@iuejcsAUJcnme2W*ld)G6|E`%Yu
zyzO`1j^%#A<vGX0)zjVIb=b0DZF4^YWwIPb=k})McQ2zRHc$LLa0JVbvRtFQbOIZu
z*%ac;I2u~%v~KFQKG!#1!b^IC;Sl(LzIP^xS)umd53CkKnAM|nB#6+N!+y@iccr9-
zn6ZeqKf^fD3=P!LLjWs4rvq3Ex*5Q#(9{}yE&r(|=I#0>z`W8+1h6~2WB`4@n;CE-
w#*#n!l2Z$+qkdXxt7bjg@9f))n6ns5xuV1pTSDSUSVklwQE?@PUVVJy4<P${IRF3v

diff --git a/src/components/SimpleProcessDesignerV2/theme/iconfont.woff b/src/components/SimpleProcessDesignerV2/theme/iconfont.woff
index f4b4f3de95d8fb8c727b52d9a06b18e22a566d85..0724e75054dc761f7cec794944cc140f3056bebf 100644
GIT binary patch
delta 2664
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
WUgJxV?Vz!E@yx_Zy#aV5Cs_csDBG(5

delta 2364
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

diff --git a/src/components/SimpleProcessDesignerV2/theme/iconfont.woff2 b/src/components/SimpleProcessDesignerV2/theme/iconfont.woff2
index d66f968531f29868912969439cc3634ae976b9c1..c904bb67db38c218b1f3f4292803cbc7fe3a80c6 100644
GIT binary patch
delta 2627
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

delta 2324
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

diff --git a/src/components/SimpleProcessDesignerV2/theme/simple-process-designer.scss b/src/components/SimpleProcessDesignerV2/theme/simple-process-designer.scss
index 62199105..d0adbdbb 100644
--- a/src/components/SimpleProcessDesignerV2/theme/simple-process-designer.scss
+++ b/src/components/SimpleProcessDesignerV2/theme/simple-process-designer.scss
@@ -181,6 +181,14 @@
     color: #330099;
   }
 
+  .child-process {
+    color: #996633;
+  }
+
+  .async-child-process {
+    color: #006666;
+  }
+
   .handler-item-text {
     margin-top: 4px;
     width: 80px;
@@ -302,6 +310,14 @@
           &.transactor-task {
             color: #330099;
           }
+
+          &.child-process {
+            color: #996633;
+          }
+
+          &.async-child-process {
+            color: #006666;
+          }
         }
 
         .node-title {
@@ -800,3 +816,11 @@
 .icon-parallel:before {
   content: "\e688";
 }
+
+.icon-async-child-process:before {
+  content: "\e6f2";
+}
+
+.icon-child-process:before {
+  content: "\e6c1";
+}
diff --git a/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue b/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue
index 0bab7d44..803322e9 100644
--- a/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue
+++ b/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue
@@ -157,24 +157,24 @@ const initProcessInfo = async (row: any, formVariables?: any) => {
 }
 
 /** 预测流程节点会因为输入的参数值而产生新的预测结果值，所以需重新预测一次 */
-watch(
-  detailForm.value,
-  (newValue) => {
-    if (newValue && Object.keys(newValue.value).length > 0) {
-      // 记录之前的节点审批人
-      tempStartUserSelectAssignees.value = startUserSelectAssignees.value
-      startUserSelectAssignees.value = {}
-      // 加载最新的审批详情
-      getApprovalDetail({
-        id: props.selectProcessDefinition.id,
-        processVariablesStr: JSON.stringify(newValue.value) // 解决 GET 无法传递对象的问题，后端 String 再转 JSON
-      })
-    }
-  },
-  {
-    immediate: true
-  }
-)
+// watch(
+//   detailForm.value,
+//   (newValue) => {
+//     if (newValue && Object.keys(newValue.value).length > 0) {
+//       // 记录之前的节点审批人
+//       tempStartUserSelectAssignees.value = startUserSelectAssignees.value
+//       startUserSelectAssignees.value = {}
+//       // 加载最新的审批详情
+//       getApprovalDetail({
+//         id: props.selectProcessDefinition.id,
+//         processVariablesStr: JSON.stringify(newValue.value) // 解决 GET 无法传递对象的问题，后端 String 再转 JSON
+//       })
+//     }
+//   },
+//   {
+//     immediate: true
+//   }
+// )
 
 /** 获取审批详情 */
 const getApprovalDetail = async (row: any) => {
diff --git a/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue b/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue
index 8d1d3fc6..540bb62c 100644
--- a/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue
+++ b/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue
@@ -85,7 +85,9 @@ const setSimpleModelNodeTaskStatus = (
   if (
     simpleModel.type === NodeType.START_USER_NODE ||
     simpleModel.type === NodeType.USER_TASK_NODE ||
-    simpleModel.type === NodeType.TRANSACTOR_NODE
+    simpleModel.type === NodeType.TRANSACTOR_NODE ||
+    simpleModel.type === NodeType.CHILD_PROCESS_NODE ||
+    simpleModel.type === NodeType.ASYNC_CHILD_PROCESS_NODE
   ) {
     simpleModel.activityStatus = TaskStatusEnum.NOT_START
     if (rejectedTaskActivityIds.includes(simpleModel.id)) {
diff --git a/src/views/bpm/processInstance/detail/ProcessInstanceTimeline.vue b/src/views/bpm/processInstance/detail/ProcessInstanceTimeline.vue
index b7891249..f93a2d9c 100644
--- a/src/views/bpm/processInstance/detail/ProcessInstanceTimeline.vue
+++ b/src/views/bpm/processInstance/detail/ProcessInstanceTimeline.vue
@@ -181,6 +181,8 @@ import conditionSvg from '@/assets/svgs/bpm/condition.svg'
 import parallelSvg from '@/assets/svgs/bpm/parallel.svg'
 import finishSvg from '@/assets/svgs/bpm/finish.svg'
 import transactorSvg from '@/assets/svgs/bpm/transactor.svg'
+import childProcessSvg from '@/assets/svgs/bpm/child-process.svg'
+import asyncChildProcessSvg from '@/assets/svgs/bpm/async-child-process.svg'
 
 defineOptions({ name: 'BpmProcessInstanceTimeline' })
 withDefaults(
@@ -249,7 +251,11 @@ const nodeTypeSvgMap = {
   // 条件分支节点
   [NodeType.CONDITION_NODE]: { color: '#14bb83', svg: conditionSvg },
   // 并行分支节点
-  [NodeType.PARALLEL_BRANCH_NODE]: { color: '#14bb83', svg: parallelSvg }
+  [NodeType.PARALLEL_BRANCH_NODE]: { color: '#14bb83', svg: parallelSvg },
+  // 子流程节点
+  [NodeType.CHILD_PROCESS_NODE]: { color: '#14bb83', svg: childProcessSvg },
+  // 异步子流程节点
+  [NodeType.ASYNC_CHILD_PROCESS_NODE]: { color: '#14bb83', svg: asyncChildProcessSvg }
 }
 
 // 只有只有状态是 -1、0、1 才展示头像右小角状态小icon
@@ -269,6 +275,8 @@ const getApprovalNodeIcon = (taskStatus: number, nodeType: NodeType) => {
     nodeType === NodeType.START_USER_NODE ||
     nodeType === NodeType.USER_TASK_NODE ||
     nodeType === NodeType.TRANSACTOR_NODE ||
+    nodeType === NodeType.CHILD_PROCESS_NODE ||
+    nodeType === NodeType.ASYNC_CHILD_PROCESS_NODE ||
     nodeType === NodeType.END_EVENT_NODE
   ) {
     return statusIconMap[taskStatus]?.icon
-- 
Gitee


From 9c9f09fbed4e4d2a8c8e968ca7403d0755cbe4c3 Mon Sep 17 00:00:00 2001
From: Lesan <1960681385@qq.com>
Date: Mon, 24 Feb 2025 09:40:52 +0800
Subject: [PATCH 2/3] =?UTF-8?q?fix:=20=E4=BB=A3=E7=A0=81=E5=AE=A1=E6=9F=A5?=
 =?UTF-8?q?=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/svgs/bpm/async-child-process.svg   |  1 -
 .../src/NodeHandler.vue                       | 10 +--
 .../SimpleProcessDesignerV2/src/consts.ts     | 17 ++--
 .../nodes-config/ChildProcessNodeConfig.vue   | 77 +++++++++++--------
 .../detail/ProcessInstanceSimpleViewer.vue    |  3 +-
 .../detail/ProcessInstanceTimeline.vue        |  4 -
 6 files changed, 53 insertions(+), 59 deletions(-)
 delete mode 100644 src/assets/svgs/bpm/async-child-process.svg

diff --git a/src/assets/svgs/bpm/async-child-process.svg b/src/assets/svgs/bpm/async-child-process.svg
deleted file mode 100644
index 2a27773d..00000000
--- a/src/assets/svgs/bpm/async-child-process.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg t="1740116978908" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1356" width="200" height="200"><path d="M860.544 633.856c-82.368 0-152.128 69.632-158.464 152h-354.88c-31.616 0-63.296-31.68-63.296-63.296V437.376c12.608 0 25.344 6.4 44.288 6.4h380.16c12.672 69.696 76.032 126.656 152.128 126.656 88.704 0 158.336-69.696 158.336-158.4s-69.632-158.4-158.336-158.4c-76.096 0-139.456 57.024-152.128 126.656h-361.216c-31.616 0-63.296-31.68-63.296-63.296v-133.12h164.736c31.68 0 63.296-22.848 63.296-54.528a55.04 55.04 0 0 0-56-56h-380.16c-31.68 0-70.72 17.984-70.72 56s31.68 54.528 63.36 54.528h133.056v538.624c0 69.696 57.088 126.656 126.72 126.656h386.56c25.344 57.088 82.368 101.376 145.728 101.376a156.8 156.8 0 0 0 158.336-158.4 156.608 156.608 0 0 0-158.208-158.272z m0-316.8c50.624 0 94.912 44.288 94.912 94.976s-44.288 94.976-94.912 94.976c-50.752 0-95.104-44.288-95.104-94.976s44.352-94.976 95.104-94.976z m0 570.24c-50.752 0-95.104-44.352-95.104-95.04s44.352-95.04 95.104-95.04c50.624 0 94.912 44.352 94.912 95.04s-44.288 95.04-94.912 95.04z" p-id="1357" fill="#ffffff"></path></svg>
\ No newline at end of file
diff --git a/src/components/SimpleProcessDesignerV2/src/NodeHandler.vue b/src/components/SimpleProcessDesignerV2/src/NodeHandler.vue
index 2b600c68..22d113f9 100644
--- a/src/components/SimpleProcessDesignerV2/src/NodeHandler.vue
+++ b/src/components/SimpleProcessDesignerV2/src/NodeHandler.vue
@@ -69,12 +69,6 @@
             </div>
             <div class="handler-item-text">子流程</div>
           </div>
-          <div class="handler-item" @click="addNode(NodeType.ASYNC_CHILD_PROCESS_NODE)">
-            <div class="handler-item-icon async-child-process">
-              <span class="iconfont icon-size icon-async-child-process"></span>
-            </div>
-            <div class="handler-item-text">异步子流程</div>
-          </div>
         </div>
         <template #reference>
           <div class="add-icon"><Icon icon="ep:plus" /></div>
@@ -303,8 +297,8 @@ const addNode = (type: number) => {
       type: NodeType.CHILD_PROCESS_NODE,
       childNode: props.childNode,
       childProcessSetting: {
-        calledElement: '',
-        calledElementName: '',
+        calledProcessDefinitionKey: '',
+        calledProcessDefinitionName: '',
         async: false,
         skipStartUserNode: false,
         startUserSetting: {
diff --git a/src/components/SimpleProcessDesignerV2/src/consts.ts b/src/components/SimpleProcessDesignerV2/src/consts.ts
index e9d0bde5..8e9328ab 100644
--- a/src/components/SimpleProcessDesignerV2/src/consts.ts
+++ b/src/components/SimpleProcessDesignerV2/src/consts.ts
@@ -39,15 +39,10 @@ export enum NodeType {
   TRIGGER_NODE = 15,
 
   /**
-   * 触发器节点
+   * 子流程节点
    */
   CHILD_PROCESS_NODE = 20,
 
-  /**
-   * 触发器节点
-   */
-  ASYNC_CHILD_PROCESS_NODE = 21,
-
   /**
    * 条件节点
    */
@@ -804,11 +799,11 @@ export const TRIGGER_TYPES: DictDataVO[] = [
  * 子流程节点结构定义
  */
 export type ChildProcessSetting = {
-  calledElement: string
-  calledElementName: string
+  calledProcessDefinitionKey: string
+  calledProcessDefinitionName: string
   async: boolean,
-  inVariable?: IOParameter[],
-  outVariable?: IOParameter[],
+  inVariables?: IOParameter[],
+  outVariables?: IOParameter[],
   skipStartUserNode: boolean,
   startUserSetting: StartUserSetting,
 }
@@ -823,5 +818,5 @@ export type IOParameter = {
 export type StartUserSetting = {
   type: number
   formField?: string
-  emptyHandleType?: number
+  emptyType?: number
 }
diff --git a/src/components/SimpleProcessDesignerV2/src/nodes-config/ChildProcessNodeConfig.vue b/src/components/SimpleProcessDesignerV2/src/nodes-config/ChildProcessNodeConfig.vue
index 26df65ef..a7d9aee6 100644
--- a/src/components/SimpleProcessDesignerV2/src/nodes-config/ChildProcessNodeConfig.vue
+++ b/src/components/SimpleProcessDesignerV2/src/nodes-config/ChildProcessNodeConfig.vue
@@ -27,9 +27,16 @@
       <el-tab-pane label="子流程" name="child">
         <div>
           <el-form ref="formRef" :model="configForm" label-position="top" :rules="formRules">
-            <el-form-item label="选择子流程" prop="calledElement">
+            <el-form-item label="是否异步" prop="async">
+              <el-switch
+                v-model="configForm.async"
+                active-text="异步"
+                inactive-text="不异步"
+              />
+            </el-form-item>
+            <el-form-item label="选择子流程" prop="calledProcessDefinitionKey">
               <el-select
-                v-model="configForm.calledElement"
+                v-model="configForm.calledProcessDefinitionKey"
                 clearable
                 @change="handleCalledElementChange"
               >
@@ -48,11 +55,11 @@
                 inactive-text="不跳过"
               />
             </el-form-item>
-            <el-form-item label="主→子变量传递" prop="inVariable">
-              <div class="flex pt-2" v-for="(item, index) in configForm.inVariable" :key="index">
+            <el-form-item label="主→子变量传递" prop="inVariables">
+              <div class="flex pt-2" v-for="(item, index) in configForm.inVariables" :key="index">
                 <div class="mr-2">
                   <el-form-item
-                    :prop="`inVariable.${index}.source`"
+                    :prop="`inVariables.${index}.source`"
                     :rules="{
                       required: true,
                       message: '变量不能为空',
@@ -71,7 +78,7 @@
                 </div>
                 <div class="mr-2">
                   <el-form-item
-                    :prop="`inVariable.${index}.target`"
+                    :prop="`inVariables.${index}.target`"
                     :rules="{
                       required: true,
                       message: '变量不能为空',
@@ -92,23 +99,23 @@
                   <Icon
                     icon="ep:delete"
                     :size="18"
-                    @click="deleteVariable(configForm.inVariable, index)"
+                    @click="deleteVariable(configForm.inVariables, index)"
                   />
                 </div>
               </div>
-              <el-button type="primary" text @click="addVariable(configForm.inVariable)">
+              <el-button type="primary" text @click="addVariable(configForm.inVariables)">
                 <Icon icon="ep:plus" class="mr-5px" />添加一行
               </el-button>
             </el-form-item>
             <el-form-item
-              v-if="currentNode.childProcessSetting?.async === false"
+              v-if="configForm.async === false"
               label="子→主变量传递"
-              prop="outVariable"
+              prop="outVariables"
             >
-              <div class="flex pt-2" v-for="(item, index) in configForm.outVariable" :key="index">
+              <div class="flex pt-2" v-for="(item, index) in configForm.outVariables" :key="index">
                 <div class="mr-2">
                   <el-form-item
-                    :prop="`outVariable.${index}.source`"
+                    :prop="`outVariables.${index}.source`"
                     :rules="{
                       required: true,
                       message: '变量不能为空',
@@ -127,7 +134,7 @@
                 </div>
                 <div class="mr-2">
                   <el-form-item
-                    :prop="`outVariable.${index}.target`"
+                    :prop="`outVariables.${index}.target`"
                     :rules="{
                       required: true,
                       message: '变量不能为空',
@@ -148,11 +155,11 @@
                   <Icon
                     icon="ep:delete"
                     :size="18"
-                    @click="deleteVariable(configForm.outVariable, index)"
+                    @click="deleteVariable(configForm.outVariables, index)"
                   />
                 </div>
               </div>
-              <el-button type="primary" text @click="addVariable(configForm.outVariable)">
+              <el-button type="primary" text @click="addVariable(configForm.outVariables)">
                 <Icon icon="ep:plus" class="mr-5px" />添加一行
               </el-button>
             </el-form-item>
@@ -227,7 +234,8 @@ const activeTabName = ref('child')
 const formRef = ref() // 表单 Ref
 // 表单校验规则
 const formRules = reactive({
-  calledElement: [{ required: true, message: '子流程不能为空', trigger: 'change' }],
+  async: [{ required: true, message: '是否异步不能为空', trigger: 'change' }],
+  calledProcessDefinitionKey: [{ required: true, message: '子流程不能为空', trigger: 'change' }],
   skipStartUserNode: [
     { required: true, message: '是否自动跳过子流程发起节点不能为空', trigger: 'change' }
   ],
@@ -238,10 +246,10 @@ const formRules = reactive({
   startUserFormField: [{ required: true, message: '发起人表单不能为空', trigger: 'change' }]
 })
 const configForm = ref({
-  calledElement: '',
+  calledProcessDefinitionKey: '',
   skipStartUserNode: false,
-  inVariable: [],
-  outVariable: [],
+  inVariables: [],
+  outVariables: [],
   startUserType: 1,
   startUserEmptyType: 1,
   startUserFormField: ''
@@ -257,17 +265,18 @@ const saveConfig = async () => {
   const valid = await formRef.value.validate()
   if (!valid) return false
   const childInfo = childProcessOptions.value.find(
-    (option) => option.key === configForm.value.calledElement
+    (option) => option.key === configForm.value.calledProcessDefinitionKey
   )
   currentNode.value.name = nodeName.value!
   if (currentNode.value.childProcessSetting) {
-    currentNode.value.childProcessSetting.calledElement = childInfo.key
-    currentNode.value.childProcessSetting.calledElementName = childInfo.name
+    currentNode.value.childProcessSetting.async = configForm.value.async
+    currentNode.value.childProcessSetting.calledProcessDefinitionKey = childInfo.key
+    currentNode.value.childProcessSetting.calledProcessDefinitionName = childInfo.name
     currentNode.value.childProcessSetting.skipStartUserNode = configForm.value.skipStartUserNode
-    currentNode.value.childProcessSetting.inVariable = configForm.value.inVariable
-    currentNode.value.childProcessSetting.outVariable = configForm.value.outVariable
+    currentNode.value.childProcessSetting.inVariables = configForm.value.inVariables
+    currentNode.value.childProcessSetting.outVariables = configForm.value.outVariables
     currentNode.value.childProcessSetting.startUserSetting.type = configForm.value.startUserType
-    currentNode.value.childProcessSetting.startUserSetting.emptyHandleType =
+    currentNode.value.childProcessSetting.startUserSetting.emptyType =
       configForm.value.startUserEmptyType
     currentNode.value.childProcessSetting.startUserSetting.formField =
       configForm.value.startUserFormField
@@ -280,13 +289,15 @@ const saveConfig = async () => {
 const showChildProcessNodeConfig = (node: SimpleFlowNode) => {
   nodeName.value = node.name
   if (node.childProcessSetting) {
-    configForm.value.calledElement = node.childProcessSetting.calledElement
+    configForm.value.async =
+      node.childProcessSetting.async
+    configForm.value.calledProcessDefinitionKey =
+      node.childProcessSetting.calledProcessDefinitionKey
     configForm.value.skipStartUserNode = node.childProcessSetting.skipStartUserNode
-    configForm.value.inVariable = node.childProcessSetting.inVariable
-    configForm.value.outVariable = node.childProcessSetting.outVariable
+    configForm.value.inVariables = node.childProcessSetting.inVariables
+    configForm.value.outVariables = node.childProcessSetting.outVariables
     configForm.value.startUserType = node.childProcessSetting.startUserSetting.type
-    configForm.value.startUserEmptyType =
-      node.childProcessSetting.startUserSetting.emptyHandleType ?? 1
+    configForm.value.startUserEmptyType = node.childProcessSetting.startUserSetting.emptyType ?? 1
     configForm.value.startUserFormField = node.childProcessSetting.startUserSetting.formField ?? ''
   }
   loadFormInfo()
@@ -304,13 +315,13 @@ const deleteVariable = (arr, index: number) => {
   arr.splice(index, 1)
 }
 const handleCalledElementChange = () => {
-  configForm.value.inVariable = []
-  configForm.value.outVariable = []
+  configForm.value.inVariables = []
+  configForm.value.outVariables = []
   loadFormInfo()
 }
 const loadFormInfo = async () => {
   const childInfo = childProcessOptions.value.find(
-    (option) => option.key === configForm.value.calledElement
+    (option) => option.key === configForm.value.calledProcessDefinitionKey
   )
   const formInfo = await getForm(childInfo.formId)
   childFormFieldOptions.value = []
diff --git a/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue b/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue
index 540bb62c..e1d11091 100644
--- a/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue
+++ b/src/views/bpm/processInstance/detail/ProcessInstanceSimpleViewer.vue
@@ -86,8 +86,7 @@ const setSimpleModelNodeTaskStatus = (
     simpleModel.type === NodeType.START_USER_NODE ||
     simpleModel.type === NodeType.USER_TASK_NODE ||
     simpleModel.type === NodeType.TRANSACTOR_NODE ||
-    simpleModel.type === NodeType.CHILD_PROCESS_NODE ||
-    simpleModel.type === NodeType.ASYNC_CHILD_PROCESS_NODE
+    simpleModel.type === NodeType.CHILD_PROCESS_NODE
   ) {
     simpleModel.activityStatus = TaskStatusEnum.NOT_START
     if (rejectedTaskActivityIds.includes(simpleModel.id)) {
diff --git a/src/views/bpm/processInstance/detail/ProcessInstanceTimeline.vue b/src/views/bpm/processInstance/detail/ProcessInstanceTimeline.vue
index f93a2d9c..30afe69c 100644
--- a/src/views/bpm/processInstance/detail/ProcessInstanceTimeline.vue
+++ b/src/views/bpm/processInstance/detail/ProcessInstanceTimeline.vue
@@ -182,7 +182,6 @@ import parallelSvg from '@/assets/svgs/bpm/parallel.svg'
 import finishSvg from '@/assets/svgs/bpm/finish.svg'
 import transactorSvg from '@/assets/svgs/bpm/transactor.svg'
 import childProcessSvg from '@/assets/svgs/bpm/child-process.svg'
-import asyncChildProcessSvg from '@/assets/svgs/bpm/async-child-process.svg'
 
 defineOptions({ name: 'BpmProcessInstanceTimeline' })
 withDefaults(
@@ -254,8 +253,6 @@ const nodeTypeSvgMap = {
   [NodeType.PARALLEL_BRANCH_NODE]: { color: '#14bb83', svg: parallelSvg },
   // 子流程节点
   [NodeType.CHILD_PROCESS_NODE]: { color: '#14bb83', svg: childProcessSvg },
-  // 异步子流程节点
-  [NodeType.ASYNC_CHILD_PROCESS_NODE]: { color: '#14bb83', svg: asyncChildProcessSvg }
 }
 
 // 只有只有状态是 -1、0、1 才展示头像右小角状态小icon
@@ -276,7 +273,6 @@ const getApprovalNodeIcon = (taskStatus: number, nodeType: NodeType) => {
     nodeType === NodeType.USER_TASK_NODE ||
     nodeType === NodeType.TRANSACTOR_NODE ||
     nodeType === NodeType.CHILD_PROCESS_NODE ||
-    nodeType === NodeType.ASYNC_CHILD_PROCESS_NODE ||
     nodeType === NodeType.END_EVENT_NODE
   ) {
     return statusIconMap[taskStatus]?.icon
-- 
Gitee


From 2f8f5454b35f67dae717b8bd25773d2cd7ce7101 Mon Sep 17 00:00:00 2001
From: Lesan <1960681385@qq.com>
Date: Mon, 24 Feb 2025 09:54:22 +0800
Subject: [PATCH 3/3] =?UTF-8?q?chore:=20=E6=B7=BB=E5=8A=A0=E5=BF=85?=
 =?UTF-8?q?=E8=A6=81=E6=B3=A8=E9=87=8A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue b/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue
index 803322e9..04f1d0a1 100644
--- a/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue
+++ b/src/views/bpm/processInstance/create/ProcessDefinitionDetail.vue
@@ -157,6 +157,7 @@ const initProcessInfo = async (row: any, formVariables?: any) => {
 }
 
 /** 预测流程节点会因为输入的参数值而产生新的预测结果值，所以需重新预测一次 */
+// TODO @芋艿：这里我执行填写表单的时候不知道为啥一直报错，先注释了
 // watch(
 //   detailForm.value,
 //   (newValue) => {
-- 
Gitee