-
+ :class="[
+ currentStep === index
+ ? 'text-[#3473ff] border-[#3473ff] border-b-2 border-b-solid'
+ : 'text-gray-500'
+ ]"
+ @click="handleStepClick(index)"
+ >
+
{{ index + 1 }}
{{ step.title }}
@@ -37,23 +52,31 @@
-
+
+
+
-
+
+
+
-
+ @success="handleDesignSuccess"
+ />
@@ -61,7 +84,6 @@
-
-
diff --git a/src/views/bpm/model/form/index.vue b/src/views/bpm/model/form/index.vue
index f0178447..7c152a6b 100644
--- a/src/views/bpm/model/form/index.vue
+++ b/src/views/bpm/model/form/index.vue
@@ -228,14 +228,20 @@ const handleStepClick = async (index: number) => {
return
}
}
- // 校验当前步骤
- try {
- if (typeof steps[currentStep.value].validator === 'function') {
- await steps[currentStep.value].validator()
+
+ // 只有在向后切换时才进行校验
+ if (index > currentStep.value) {
+ try {
+ if (typeof steps[currentStep.value].validator === 'function') {
+ await steps[currentStep.value].validator()
+ }
+ currentStep.value = index
+ } catch (error) {
+ message.warning('请先完善当前步骤必填信息')
}
+ } else {
+ // 向前切换时直接切换
currentStep.value = index
- } catch (error) {
- message.warning('请先完善当前步骤必填信息')
}
}
@@ -244,6 +250,7 @@ const handleDesignSuccess = (bpmnXml?: string) => {
if (bpmnXml) {
formData.value.bpmnXml = bpmnXml
}
+ handleSave() // 自动保存
message.success('保存成功')
}
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 4/7] =?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('保存成功')
}
/** 初始化 */
From f86bd0df0b4375665d568ce2107d99582997880f Mon Sep 17 00:00:00 2001
From: GoldenZqqq <1361001127@qq.com>
Date: Wed, 25 Dec 2024 09:52:19 +0800
Subject: [PATCH 5/7] =?UTF-8?q?fix:=20=E7=AC=AC=E4=B8=80=E6=AD=A5=E9=AA=A4?=
=?UTF-8?q?=E4=B8=ADtooltip=20icon=E6=9C=AA=E5=B1=95=E7=A4=BA=E9=97=AE?=
=?UTF-8?q?=E9=A2=98=E4=BF=AE=E5=A4=8D=E4=B8=8E=E6=A0=B7=E5=BC=8F=E7=BB=86?=
=?UTF-8?q?=E8=8A=82=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/views/bpm/model/form/BasicInfo.vue | 31 ++++++++++++++------------
src/views/bpm/model/form/index.vue | 8 ++-----
2 files changed, 19 insertions(+), 20 deletions(-)
diff --git a/src/views/bpm/model/form/BasicInfo.vue b/src/views/bpm/model/form/BasicInfo.vue
index b063921d..532ec786 100644
--- a/src/views/bpm/model/form/BasicInfo.vue
+++ b/src/views/bpm/model/form/BasicInfo.vue
@@ -7,19 +7,22 @@
class="mt-20px w-600px"
>
-
-
-
-
-
-
-
+
+
+
+
+
+
-
-
+
+
From a82862be475daa6ea8fa7822dc7c4f5d48873ad5 Mon Sep 17 00:00:00 2001
From: GoldenZqqq <1361001127@qq.com>
Date: Wed, 25 Dec 2024 14:10:16 +0800
Subject: [PATCH 6/7] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9=E6=B5=81=E7=A8=8B?=
=?UTF-8?q?=E6=97=B6=EF=BC=8C=E4=BF=AE=E6=94=B9=E4=BA=86=E6=B5=81=E7=A8=8B?=
=?UTF-8?q?=E8=AE=BE=E8=AE=A1=E4=BF=9D=E5=AD=98=E4=B8=8D=E7=94=9F=E6=95=88?=
=?UTF-8?q?=E9=97=AE=E9=A2=98=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/views/bpm/model/form/ProcessDesign.vue | 31 ++++++++++++++++------
src/views/bpm/model/form/index.vue | 4 +--
2 files changed, 25 insertions(+), 10 deletions(-)
diff --git a/src/views/bpm/model/form/ProcessDesign.vue b/src/views/bpm/model/form/ProcessDesign.vue
index 4cbd40c2..7ee58092 100644
--- a/src/views/bpm/model/form/ProcessDesign.vue
+++ b/src/views/bpm/model/form/ProcessDesign.vue
@@ -47,11 +47,15 @@ const modelData = computed({
})
// 监听modelValue变化,确保XML数据同步
-watch(() => props.modelValue, (newVal) => {
- if (newVal.bpmnXml) {
- xmlString.value = newVal.bpmnXml
- }
-}, { immediate: true, deep: true })
+watch(
+ () => props.modelValue,
+ (newVal) => {
+ if (newVal.bpmnXml) {
+ xmlString.value = newVal.bpmnXml
+ }
+ },
+ { immediate: true, deep: true }
+)
/** 处理设计器保存成功 */
const handleDesignSuccess = (bpmnXml?: string) => {
@@ -67,6 +71,11 @@ const handleDesignSuccess = (bpmnXml?: string) => {
/** 表单校验 */
const validate = async () => {
+ // 修改场景下，如果已有 modelData.bpmnXml 则不需要重新校验
+ if (modelData.value.id && modelData.value.bpmnXml) {
+ return true
+ }
+ // 新增场景或无 bpmnXml 时才校验
if (!xmlString.value) {
throw new Error('请设计流程')
}
@@ -75,11 +84,17 @@ const validate = async () => {
/** 是否显示设计器 */
const showDesigner = computed(() => {
- return Boolean(modelData.value.key && modelData.value.name)
+ return Boolean(modelData.value?.key && modelData.value?.name)
})
+/** 获取当前XML字符串 */
+const getXmlString = () => {
+ // 优先返回最新的 xmlString
+ return xmlString.value || modelData.value?.bpmnXml
+}
+
defineExpose({
validate,
- getXmlString: () => xmlString.value
+ getXmlString
})
-
+
diff --git a/src/views/bpm/model/form/index.vue b/src/views/bpm/model/form/index.vue
index 59279842..47016ac3 100644
--- a/src/views/bpm/model/form/index.vue
+++ b/src/views/bpm/model/form/index.vue
@@ -52,7 +52,7 @@
-
+
-
+
From 36157a8f24502d84e31696a5a258da33580a3bba Mon Sep 17 00:00:00 2001
From: GoldenZqqq <1361001127@qq.com>
Date: Wed, 25 Dec 2024 14:33:21 +0800
Subject: [PATCH 7/7] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E6=96=B0=E5=A2=9E?=
=?UTF-8?q?=E6=B5=81=E7=A8=8B=E6=97=B6=E6=97=A0=E6=B3=95=E9=80=9A=E8=BF=87?=
=?UTF-8?q?=E7=AC=AC=E4=B8=89=E6=AD=A5=E7=9A=84bpm=E5=BF=85=E5=A1=AB?=
=?UTF-8?q?=E6=A0=A1=E9=AA=8C=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/views/bpm/model/form/ProcessDesign.vue | 22 ++++++-----
src/views/bpm/model/form/index.vue | 46 +++++++++++-----------
2 files changed, 35 insertions(+), 33 deletions(-)
diff --git a/src/views/bpm/model/form/ProcessDesign.vue b/src/views/bpm/model/form/ProcessDesign.vue
index 7ee58092..2e8f94c9 100644
--- a/src/views/bpm/model/form/ProcessDesign.vue
+++ b/src/views/bpm/model/form/ProcessDesign.vue
@@ -50,7 +50,7 @@ const modelData = computed({
watch(
() => props.modelValue,
(newVal) => {
- if (newVal.bpmnXml) {
+ if (newVal?.bpmnXml) {
xmlString.value = newVal.bpmnXml
}
},
@@ -61,24 +61,29 @@ watch(
const handleDesignSuccess = (bpmnXml?: string) => {
if (bpmnXml) {
xmlString.value = bpmnXml
- emit('update:modelValue', {
+ modelData.value = {
...modelData.value,
bpmnXml
- })
+ }
emit('success', bpmnXml)
}
}
/** 表单校验 */
const validate = async () => {
- // 修改场景下，如果已有 modelData.bpmnXml 则不需要重新校验
- if (modelData.value.id && modelData.value.bpmnXml) {
+ // 获取最新的XML数据
+ const currentXml = xmlString.value || modelData.value?.bpmnXml
+
+ // 如果是修改场景且有XML数据（无论是新的还是原有的）
+ if (modelData.value.id && currentXml) {
return true
}
- // 新增场景或无 bpmnXml 时才校验
- if (!xmlString.value) {
+
+ // 新增场景必须有XML数据
+ if (!currentXml) {
throw new Error('请设计流程')
}
+
return true
}
@@ -89,8 +94,7 @@ const showDesigner = computed(() => {
/** 获取当前XML字符串 */
const getXmlString = () => {
- // 优先返回最新的 xmlString
- return xmlString.value || modelData.value?.bpmnXml
+ return xmlString.value || modelData.value?.bpmnXml || ''
}
defineExpose({
diff --git a/src/views/bpm/model/form/index.vue b/src/views/bpm/model/form/index.vue
index 47016ac3..f6c2ef2a 100644
--- a/src/views/bpm/model/form/index.vue
+++ b/src/views/bpm/model/form/index.vue
@@ -169,19 +169,24 @@ 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
+ // 保存前确保所有步骤的数据都已经验证通过
+ for (const step of steps) {
+ if (step.validator) {
+ await step.validator()
}
}
-
+
+ // 如果是在第三步，需要先获取最新的流程设计数据
+ if (currentStep.value === 2) {
+ await nextTick()
+ const bpmnXml = processDesignRef.value?.getXmlString()
+ // 确保有XML数据
+ if (!bpmnXml) {
+ throw new Error('请设计流程')
+ }
+ formData.value.bpmnXml = bpmnXml
+ }
+
if (formData.value.id) {
await ModelApi.updateModel(formData.value)
message.success('修改成功')
@@ -193,6 +198,7 @@ const handleSave = async () => {
} catch (error) {
console.error('保存失败:', error)
message.error(error.message || '保存失败')
+ throw error
}
}
@@ -200,24 +206,14 @@ const handleSave = async () => {
const handleDeploy = async () => {
try {
await message.confirm('是否确认发布该流程？')
- // 发布时才进行全部校验
- for (const step of steps) {
- if (step.validator) {
- 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('发布成功')
router.push({ name: 'BpmModel' })
} catch (error) {
+ console.error('发布失败:', error)
if (error instanceof Error) {
// 校验失败时,跳转到对应步骤
const failedStep = steps.findIndex((step) => {
@@ -231,6 +227,8 @@ const handleDeploy = async () => {
if (failedStep !== -1) {
currentStep.value = failedStep
message.warning('请完善必填信息')
+ } else {
+ message.error(error.message || '发布失败')
}
}
}