fix: 区分兼容bpmn设计器与simple设计器不同传参与不同处理方式

Author: GoldenZqqq

src/views/bpm/model/form/ProcessDesign.vue

@@ -49,57 +49,23 @@ const modelData = computed({
   set: (val) => emit('update:modelValue', val)
 })
 
-/** 表单校验 */
-const validate = async () => {
-  try {
-    // 根据流程类型获取对应的编辑器引用
-    const editorRef =
-      modelData.value.type === BpmModelType.BPMN ? bpmnEditorRef.value : simpleEditorRef.value
-    if (!editorRef) {
-      throw new Error('流程设计器未初始化')
-    }
-
-    // 获取最新的XML数据
-    const bpmnXml = await getXmlString()
-    console.warn(bpmnXml, 'bpmnXml')
-    if (!bpmnXml) {
-      throw new Error('请设计流程')
-    }
-
-    return true
-  } catch (error) {
-    throw error
-  }
-}
-
-/** 获取当前XML字符串 */
-const getXmlString = async () => {
+/** 获取当前流程数据 */
+const getProcessData = async () => {
   try {
     if (modelData.value.type === BpmModelType.BPMN) {
       // BPMN设计器
       if (bpmnEditorRef.value) {
         const { xml } = await bpmnEditorRef.value.saveXML()
         if (xml) {
-          // 更新本地数据
-          modelData.value = {
-            ...modelData.value,
-            bpmnXml: xml
-          }
+          return xml
         }
-        return xml
       }
     } else {
       // Simple设计器
       if (simpleEditorRef.value) {
         const flowData = await simpleEditorRef.value.getCurrentFlowData()
         if (flowData) {
-          const jsonData = JSON.stringify(flowData)
-          // 更新本地数据
-          modelData.value = {
-            ...modelData.value,
-            bpmnXml: jsonData
-          }
-          return jsonData
+          return flowData // 直接返回流程数据对象，不需要转换为字符串
         }
       }
     }
@@ -110,14 +76,45 @@ const getXmlString = async () => {
   }
 }
 
+/** 表单校验 */
+const validate = async () => {
+  try {
+    // 根据流程类型获取对应的编辑器引用
+    const editorRef =
+      modelData.value.type === BpmModelType.BPMN ? bpmnEditorRef.value : simpleEditorRef.value
+    if (!editorRef) {
+      throw new Error('流程设计器未初始化')
+    }
+
+    // 获取最新的流程数据
+    const processData = await getProcessData()
+    if (!processData) {
+      throw new Error('请设计流程')
+    }
+
+    return true
+  } catch (error) {
+    throw error
+  }
+}
+
 /** 处理设计器保存成功 */
-const handleDesignSuccess = (bpmnXml?: string) => {
-  if (bpmnXml) {
-    modelData.value = {
-      ...modelData.value,
-      bpmnXml
+const handleDesignSuccess = (data?: any) => {
+  if (data) {
+    if (modelData.value.type === BpmModelType.BPMN) {
+      modelData.value = {
+        ...modelData.value,
+        bpmnXml: data,
+        simpleModel: null
+      }
+    } else {
+      modelData.value = {
+        ...modelData.value,
+        bpmnXml: null,
+        simpleModel: data
+      }
     }
-    emit('success', bpmnXml)
+    emit('success', data)
   }
 }
 
@@ -128,6 +125,6 @@ const showDesigner = computed(() => {
 
 defineExpose({
   validate,
-  getXmlString
+  getProcessData
 })
 </script>

src/views/bpm/model/form/index.vue

@@ -177,7 +177,7 @@ const validateAllSteps = async () => {
       currentStep.value = 0
       throw new Error('请完善基本信息')
     }
-
+    
     // 表单设计校验
     await formDesignRef.value?.validate()
     if (formData.value.formType === 10 && !formData.value.formId) {
@@ -191,15 +191,15 @@ const validateAllSteps = async () => {
       currentStep.value = 1
       throw new Error('请完善自定义表单信息')
     }
-
+    
     // 流程设计校验
     await processDesignRef.value?.validate()
-    const bpmnXml = processDesignRef.value?.getXmlString()
-    if (!bpmnXml) {
+    const processData = await processDesignRef.value?.getProcessData()
+    if (!processData) {
       currentStep.value = 2
       throw new Error('请设计流程')
     }
-
+    
     return true
   } catch (error) {
     throw error
@@ -211,22 +211,28 @@ const handleSave = async () => {
   try {
     // 保存前校验所有步骤的数据
     await validateAllSteps()
-
+    
     // 获取最新的流程设计数据
-    const bpmnXml = await processDesignRef.value?.getXmlString()
-    if (!bpmnXml) {
+    const processData = await processDesignRef.value?.getProcessData()
+    if (!processData) {
       throw new Error('获取流程数据失败')
     }
 
     // 更新表单数据
-    formData.value = {
-      ...formData.value,
-      bpmnXml: bpmnXml
+    const modelData = {
+      ...formData.value
     }
-
+    if (formData.value.type === BpmModelType.BPMN) {
+      modelData.bpmnXml = processData
+      modelData.simpleModel = null
+    } else {
+      modelData.bpmnXml = null
+      modelData.simpleModel = processData // 直接使用流程数据对象
+    }
+    
     if (formData.value.id) {
       // 修改场景
-      await ModelApi.updateModel(formData.value)
+      await ModelApi.updateModel(modelData)
       message.success('修改成功')
       // 询问是否发布流程
       try {
@@ -238,7 +244,7 @@ const handleSave = async () => {
       }
     } else {
       // 新增场景
-      const result = await ModelApi.createModel(formData.value)
+      const result = await ModelApi.createModel(modelData)
       formData.value.id = result
       message.success('新增成功')
       try {
@@ -275,24 +281,30 @@ const handleDeploy = async () => {
 
     // 校验所有步骤
     await validateAllSteps()
-
+    
     // 获取最新的流程设计数据
-    const bpmnXml = await processDesignRef.value?.getXmlString()
-    if (!bpmnXml) {
+    const processData = await processDesignRef.value?.getProcessData()
+    if (!processData) {
       throw new Error('获取流程数据失败')
     }
 
     // 更新表单数据
-    formData.value = {
-      ...formData.value,
-      bpmnXml: bpmnXml
+    const modelData = {
+      ...formData.value
+    }
+    if (formData.value.type === BpmModelType.BPMN) {
+      modelData.bpmnXml = processData
+      modelData.simpleModel = null
+    } else {
+      modelData.bpmnXml = null
+      modelData.simpleModel = processData // 直接使用流程数据对象
     }
 
     // 先保存所有数据
     if (formData.value.id) {
-      await ModelApi.updateModel(formData.value)
+      await ModelApi.updateModel(modelData)
     } else {
-      const result = await ModelApi.createModel(formData.value)
+      const result = await ModelApi.createModel(modelData)
       formData.value.id = result.id
     }