修改提交

ruoyi-ui/src/views/JiHeExpressway/components/FormConfig/components/MultipleLabelItem.vue

@@ -3,7 +3,10 @@
     <div v-for="(item, index) in options" :key="`${item.key}|${index}`" class="item">
       <span v-if="item.prefix" :style="item.prefix.style">{{ item.prefix.text }}</span>
       <!-- <component class="unknown" :is="getComponent(item.type)" v-bind="getBindData(item)" v-model="data[item.key]" /> -->
-      <ProxyCom class="unknown" :value="getValue(item)" :item="item" @update:value="data => updateValue(item, data)" />
+      <ElFormItem :prop="item.key"
+        :rules="getRules({ ...item, label: item.label || _config.label, required: _config.required })">
+        <ProxyCom class="unknown" :value="getValue(item)" :item="item" @update:value="data => updateValue(item, data)" />
+      </ElFormItem>
 
       <span v-if="item.suffix" :style="item.suffix.style">{{ item.suffix.text }}</span>
     </div>
@@ -15,7 +18,7 @@ import ProxyCom from "./../Proxy.vue"
 
 export default {
   name: 'MultipleLabelItem',
-  inject: ['getComponent', 'getBindData', 'getValue', 'updateValue'],
+  inject: ['getComponent', 'getBindData', 'getValue', 'updateValue', "getRules"],
   components: {
     ProxyCom
   },
@@ -27,12 +30,16 @@ export default {
     data: {
       type: [Object, Array],
       default: () => ({})
+    },
+    _config: {
+      type: Object,
+      default: () => ({})
     }
   },
   model: {
     prop: 'data',
     event: "update:value"
-  },
+  }
 }
 </script>
 

ruoyi-ui/src/views/JiHeExpressway/components/FormConfig/index.vue

@@ -1,8 +1,10 @@
 <template>
-  <ElForm :style="getStyle()" :label-width="labelWidth" class="FormConfig" size="mini">
+  <ElForm :style="getStyle()" :model="modelFormData" :label-width="labelWidth" class="FormConfig" ref="ElFormRef"
+    size="mini">
     <template v-for="(item, index) in formList">
       <ElFormItem class="formItem" :rules="getRules(item)" v-if="formItemVisible(item)" :key="`${item.key}|${index}`"
-        :label="item.label" :style="gridStyle(item, index)">
+        :label="item.label" :style="gridStyle(item, index)" :prop="item.type !== 'MultipleLabelItem' ? item.key : void 0"
+        :required="item.required">
         <slot :name="item.key" :data="item" :formData="modelFormData">
           <ProxyCom :value="getValue(item)" :item="item" @update:value="data => updateValue(item, data)" />
           <!-- <component :is="getComponent(item.type)" v-bind="getBindData(item)" v-model="modelFormData[item.key]"
@@ -42,7 +44,8 @@ export default {
       getFormData: () => this.modelFormData,
       getValue: this.getValue,
       updateValue: this.updateValue,
-      parent: this
+      parent: this,
+      getRules: this.getRules
     }
   },
   props: {
@@ -160,17 +163,31 @@ export default {
       return components[componentKey] || components[ElComponentKey] || ElComponentKey;
     },
     getRules(item) {
-      if (this.rules?.[item.key]) return this.rules[item.key];
+      // if (this.rules?.[item.key]) return this.rules[item.key];
 
-      if (item.rules) return item.rules;
+      // if (item.rules) return item.rules;
+
+      // console.log(item.required)
 
       if (item.required) return [
         {
-          required: true,
-          message: `${item.options?.placeholder || `${item.label}不能为空`}`,
+          validator: (_, __, callback) => {
+            const value = pathGet(this.modelFormData, item.key)
+            if (!value && typeof value === 'object') return callback(new Error(`${item.options?.placeholder || `${item.label}不能为空`}`))
+
+            callback()
+          },
           trigger: "blur",
         },
       ]
+    },
+    validate() {
+      return new Promise((resolve, reject) => {
+        this.$refs.ElFormRef.validate((bool, data) => {
+          if (bool) resolve(data)
+          else reject()
+        })
+      })
     }
   }
 }