feat: [BPM 工作流] Simple 模型 - 流程设计校验

apps/web-antd/src/views/bpm/model/form/index.vue

@@ -216,7 +216,8 @@ const validateAllSteps = async () => {
     await validateBasic();
   } catch {
     currentStep.value = 0;
-    throw new Error('请完善基本信息');
+    message.warning('请完善基本信息');
+    return false;
   }
 
   // 表单设计校验
@@ -224,25 +225,19 @@ const validateAllSteps = async () => {
     await validateForm();
   } catch {
     currentStep.value = 1;
-    throw new Error('请完善自定义表单信息');
+    message.warning('请完善自定义表单信息');
+    return false;
   }
 
-  // 流程设计校验 TODO
-
+  // 流程设计校验
   try {
     await validateProcess();
   } catch {
     currentStep.value = 2;
-    throw new Error('请设计流程');
+    return false;
   }
 
-  // 表单设计校验
-  try {
-    await validateProcess();
-  } catch {
-    currentStep.value = 2;
-    throw new Error('请设计流程');
-  }
+  // TODO 更多设置校验
 
   return true;
 };
@@ -251,7 +246,10 @@ const validateAllSteps = async () => {
 const handleSave = async () => {
   try {
     // 保存前校验所有步骤的数据
-    await validateAllSteps();
+    const result = await validateAllSteps();
+    if (!result) {
+      return;
+    }
 
     // 更新表单数据
     const modelData = {
@@ -297,7 +295,7 @@ const handleSave = async () => {
     }
   } catch (error: any) {
     console.error('保存失败:', error);
-    message.warning(error.message || '请完善所有步骤的必填信息');
+    // message.warning(error.msg || '请完善所有步骤的必填信息');
   }
 };
 
@@ -347,23 +345,13 @@ const handleStepClick = async (index: number) => {
     if (index !== 2) {
       await validateProcess();
     }
-
     // 切换步骤
     currentStep.value = index;
-
-    // 如果切换到流程设计步骤，等待组件渲染完成后刷新设计器
-    if (index === 2) {
-      // TODO 后续加
-      // await nextTick();
-      // // 等待更长时间确保组件完全初始化
-      // await new Promise((resolve) => setTimeout(resolve, 200));
-      // if (processDesignRef.value?.refresh) {
-      //   await processDesignRef.value.refresh();
-      // }
-    }
   } catch (error) {
     console.error('步骤切换失败:', error);
-    message.warning('请先完善当前步骤必填信息');
+    if (currentStep.value !== 2) {
+      message.warning('请先完善当前步骤必填信息');
+    }
   }
 };
 

apps/web-antd/src/views/bpm/model/form/modules/process-design.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { Ref } from 'vue';
 
-import { computed, inject, nextTick } from 'vue';
+import { computed, inject, nextTick, ref } from 'vue';
 
 import { BpmModelType } from '#/utils';
 
@@ -13,12 +13,21 @@ const modelData = defineModel<any>();
 
 const processData = inject('processData') as Ref;
 
+const simpleDesign = ref();
+
 /** 表单校验 */
 const validate = async () => {
   // 获取最新的流程数据
   if (!processData.value) {
     throw new Error('请设计流程');
   }
+  if (modelData.value.type === BpmModelType.SIMPLE) {
+    // 简易设计器校验
+    const validateResult = await simpleDesign.value?.validateConfig();
+    if (!validateResult) {
+      throw new Error('请完善设计配置');
+    }
+  }
   return true;
 };
 /** 处理设计器保存成功 */
@@ -41,9 +50,7 @@ const handleDesignSuccess = async (data?: any) => {
 const showDesigner = computed(() => {
   return Boolean(modelData.value?.key && modelData.value?.name);
 });
-defineExpose({
-  validate,
-});
+defineExpose({ validate });
 </script>
 <template>
   <div class="h-full">
@@ -61,6 +68,7 @@ defineExpose({
         :start-user-ids="modelData.startUserIds"
         :start-dept-ids="modelData.startDeptIds"
         @success="handleDesignSuccess"
+        ref="simpleDesign"
       />
     </template>
   </div>

apps/web-antd/src/views/bpm/model/form/modules/simple-model-design.vue

@@ -17,12 +17,17 @@ defineProps<{
 const emit = defineEmits(['success']);
 const designerRef = ref();
 
-// 修改成功回调
+/** 保存成功回调 */
 const handleSuccess = (data?: any) => {
   if (data) {
     emit('success', data);
   }
 };
+/** 设计器配置校验 */
+const validateConfig = async () => {
+  return await designerRef.value.validate();
+};
+defineExpose({ validateConfig });
 </script>
 <template>
   <ContentWrap :body-style="{ padding: '20px 16px' }">