From 401481662fb9a3db7e1206f89f716d7503393d45 Mon Sep 17 00:00:00 2001
From: Lesan <1960681385@qq.com>
Date: Fri, 10 Jan 2025 14:33:59 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=A1=A5=E5=85=85=E7=AD=89=E5=BC=8F?=
 =?UTF-8?q?=E5=B7=A6=E5=8F=B3=E5=80=BCform=E6=A0=A1=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/nodes-config/RouterNodeConfig.vue     | 14 +++++-
 .../src/nodes-config/components/Condition.vue | 46 +++++++++++++------
 2 files changed, 45 insertions(+), 15 deletions(-)

diff --git a/src/components/SimpleProcessDesignerV2/src/nodes-config/RouterNodeConfig.vue b/src/components/SimpleProcessDesignerV2/src/nodes-config/RouterNodeConfig.vue
index 71192ae7..442cf337 100644
--- a/src/components/SimpleProcessDesignerV2/src/nodes-config/RouterNodeConfig.vue
+++ b/src/components/SimpleProcessDesignerV2/src/nodes-config/RouterNodeConfig.vue
@@ -42,7 +42,10 @@
               >
             </div>
           </template>
-          <Condition v-model="routerGroups[index]" />
+          <Condition
+            :ref="($event) => (conditionRef[index] = $event)"
+            v-model="routerGroups[index]"
+          />
         </el-card>
       </el-form>
 
@@ -84,8 +87,17 @@ const { nodeName, showInput, clickIcon, blurEvent } = useNodeName(NodeType.ROUTE
 const routerGroups = ref<RouterCondition[]>([])
 const nodeOptions = ref()
 
+const conditionRef = ref([])
 // 保存配置
 const saveConfig = async () => {
+  // 校验表单
+  let valid = true
+  for (const item of conditionRef.value) {
+    if (!(await item.validate())) {
+      valid = false
+    }
+  }
+  if (!valid) return false
   const showText = getShowText()
   if (!showText) return false
   currentNode.value.name = nodeName.value!
diff --git a/src/components/SimpleProcessDesignerV2/src/nodes-config/components/Condition.vue b/src/components/SimpleProcessDesignerV2/src/nodes-config/components/Condition.vue
index e8fe1d76..85f6e4a0 100644
--- a/src/components/SimpleProcessDesignerV2/src/nodes-config/components/Condition.vue
+++ b/src/components/SimpleProcessDesignerV2/src/nodes-config/components/Condition.vue
@@ -59,15 +59,24 @@
 
           <div class="flex pt-2" v-for="(rule, rIdx) in equation.rules" :key="rIdx">
             <div class="mr-2">
-              <el-select style="width: 160px" v-model="rule.leftSide">
-                <el-option
-                  v-for="(field, fIdx) in fieldOptions"
-                  :key="fIdx"
-                  :label="field.title"
-                  :value="field.field"
-                  :disabled="!field.required"
-                />
-              </el-select>
+              <el-form-item
+                :prop="`conditionGroups.conditions.${cIdx}.rules.${rIdx}.leftSide`"
+                :rules="{
+                  required: true,
+                  message: '左值不能为空',
+                  trigger: 'change'
+                }"
+              >
+                <el-select style="width: 160px" v-model="rule.leftSide">
+                  <el-option
+                    v-for="(field, fIdx) in fieldOptions"
+                    :key="fIdx"
+                    :label="field.title"
+                    :value="field.field"
+                    :disabled="!field.required"
+                  />
+                </el-select>
+              </el-form-item>
             </div>
             <div class="mr-2">
               <el-select v-model="rule.opCode" style="width: 100px">
@@ -80,7 +89,16 @@
               </el-select>
             </div>
             <div class="mr-2">
-              <el-input v-model="rule.rightSide" style="width: 160px" />
+              <el-form-item
+                :prop="`conditionGroups.conditions.${cIdx}.rules.${rIdx}.rightSide`"
+                :rules="{
+                  required: true,
+                  message: '右值不能为空',
+                  trigger: 'blur'
+                }"
+              >
+                <el-input v-model="rule.rightSide" style="width: 160px" />
+              </el-form-item>
             </div>
             <div class="mr-1 flex items-center" v-if="equation.rules.length > 1">
               <Icon icon="ep:delete" :size="18" @click="deleteConditionRule(equation, rIdx)" />
@@ -122,8 +140,8 @@ import {
   ConditionType,
   ProcessVariableEnum
 } from '../../consts'
-import {BpmModelFormType} from '@/utils/constants'
-import {useFormFields} from '../../node'
+import { BpmModelFormType } from '@/utils/constants'
+import { useFormFields } from '../../node'
 
 const props = defineProps({
   modelValue: {
@@ -202,10 +220,10 @@ const addConditionGroup = (conditions) => {
 
 const validate = async () => {
   if (!formRef) return false
-  return await formRef.value.validate();
+  return await formRef.value.validate()
 }
 
-defineExpose({validate})
+defineExpose({ validate })
 </script>
 
 <style lang="scss" scoped>