From 53841a598ff764c39c6182a7b740a2ca1286c94e Mon Sep 17 00:00:00 2001 From: GoldenZqqqq <1361001127@qq.com> Date: Tue, 24 Dec 2024 22:24:54 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E7=AC=AC=E4=B8=89?= =?UTF-8?q?=E6=AD=A5=E9=AA=A4=E6=B5=81=E7=A8=8B=E8=AE=BE=E8=AE=A1=E4=B8=AD?= =?UTF-8?q?=E7=82=B9=E5=87=BB=E4=BF=9D=E5=AD=98=E6=A8=A1=E5=9E=8Bxml?= =?UTF-8?q?=E4=BF=9D=E5=AD=98=E6=97=A0=E6=95=88=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../package/designer/ProcessDesigner.vue | 35 +++++++++++++------ src/views/bpm/model/form/ProcessDesign.vue | 17 +++++++-- src/views/bpm/model/form/index.vue | 23 ++++++++++-- 3 files changed, 59 insertions(+), 16 deletions(-) diff --git a/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue b/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue index 6cbe11fa..ebe85106 100644 --- a/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue +++ b/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue @@ -315,6 +315,20 @@ const props = defineProps({ } }) +// 监听value变化,重新加载流程图 +watch(() => props.value, (newValue) => { + if (newValue && bpmnModeler) { + createNewDiagram(newValue) + } +}, { immediate: true }) + +// 监听processId和processName变化 +watch([() => props.processId, () => props.processName], ([newId, newName]) => { + if (newId && newName && !props.value) { + createNewDiagram(null) + } +}, { immediate: true }) + provide('configGlobal', props) let bpmnModeler: any = null const defaultZoom = ref(1) @@ -666,18 +680,17 @@ const previewProcessJson = () => { } /* ------------------------------------------------ 芋道源码 methods ------------------------------------------------------ */ const processSave = async () => { - // console.log(bpmnModeler, 'bpmnModelerbpmnModelerbpmnModelerbpmnModeler') - const { err, xml } = await bpmnModeler.saveXML() - // console.log(err, 'errerrerrerrerr') - // console.log(xml, 'xmlxmlxmlxmlxml') - // 读取异常时抛出异常 - if (err) { - // this.$modal.msgError('保存模型失败，请重试！') - alert('保存模型失败，请重试！') - return + try { + const { err, xml } = await bpmnModeler.saveXML() + if (err) { + ElMessage.error('保存流程设计失败，请重试！') + return + } + emit('save', xml) + } catch (error) { + console.error(error) + ElMessage.error('保存流程设计失败，请重试！') } - // 触发 save 事件 - emit('save', xml) } /** 高亮显示 */ // const highlightedCode = (previewType, previewResult) => { diff --git a/src/views/bpm/model/form/ProcessDesign.vue b/src/views/bpm/model/form/ProcessDesign.vue index 934de5a8..4cbd40c2 100644 --- a/src/views/bpm/model/form/ProcessDesign.vue +++ b/src/views/bpm/model/form/ProcessDesign.vue @@ -6,6 +6,7 @@ :model-id="modelData.id" :model-key="modelData.key" :model-name="modelData.name" + :value="modelData.bpmnXml" @success="handleDesignSuccess" /> @@ -17,6 +18,7 @@ :model-id="modelData.id" :model-key="modelData.key" :model-name="modelData.name" + :value="modelData.bpmnXml" @success="handleDesignSuccess" /> @@ -44,6 +46,13 @@ const modelData = computed({ set: (val) => emit('update:modelValue', val) }) +// 监听modelValue变化,确保XML数据同步 +watch(() => props.modelValue, (newVal) => { + if (newVal.bpmnXml) { + xmlString.value = newVal.bpmnXml + } +}, { immediate: true, deep: true }) + /** 处理设计器保存成功 */ const handleDesignSuccess = (bpmnXml?: string) => { if (bpmnXml) { @@ -52,8 +61,8 @@ const handleDesignSuccess = (bpmnXml?: string) => { ...modelData.value, bpmnXml }) + emit('success', bpmnXml) } - emit('success', bpmnXml) } /** 表单校验 */ @@ -61,14 +70,16 @@ const validate = async () => { if (!xmlString.value) { throw new Error('请设计流程') } + return true } /** 是否显示设计器 */ const showDesigner = computed(() => { - return Boolean(modelData.value.id || (modelData.value.key && modelData.value.name)) + return Boolean(modelData.value.key && modelData.value.name) }) defineExpose({ - validate + validate, + getXmlString: () => xmlString.value }) diff --git a/src/views/bpm/model/form/index.vue b/src/views/bpm/model/form/index.vue index 7c152a6b..3f105d67 100644 --- a/src/views/bpm/model/form/index.vue +++ b/src/views/bpm/model/form/index.vue @@ -173,6 +173,19 @@ const initData = async () => { /** 保存操作 */ const handleSave = async () => { try { + // 保存前确保当前步骤的数据已经验证通过 + if (typeof steps[currentStep.value].validator === 'function') { + await steps[currentStep.value].validator() + } + + // 如果是第三步，需要先获取最新的流程设计数据 + if (currentStep.value === 2) { + const bpmnXml = processDesignRef.value?.getXmlString() + if (bpmnXml) { + formData.value.bpmnXml = bpmnXml + } + } + if (formData.value.id) { await ModelApi.updateModel(formData.value) message.success('修改成功') @@ -183,6 +196,7 @@ const handleSave = async () => { } } catch (error) { console.error('保存失败:', error) + message.error(error.message || '保存失败') } } @@ -196,6 +210,13 @@ const handleDeploy = async () => { await step.validator() } } + // 如果是第三步，需要先获取最新的流程设计数据 + if (currentStep.value === 2) { + const bpmnXml = processDesignRef.value?.getXmlString() + if (bpmnXml) { + formData.value.bpmnXml = bpmnXml + } + } await handleSave() await ModelApi.deployModel(formData.value.id) message.success('发布成功') @@ -250,8 +271,6 @@ const handleDesignSuccess = (bpmnXml?: string) => { if (bpmnXml) { formData.value.bpmnXml = bpmnXml } - handleSave() // 自动保存 - message.success('保存成功') } /** 初始化 */