fix: 修复子表单内标签不验证数据的问题。#190

src/components/VueFormMaking/components/GenerateForm.vue

@@ -10,17 +10,15 @@
       :label-width="data.config.labelWidth + 'px'"
     >
       <template v-for="item in data.list">
-
         <template v-if="item.type == 'grid'">
           <el-row
-            :key="item.key"
+            :key="item.model"
             type="flex"
             :gutter="item.options.gutter ? item.options.gutter : 0"
             :justify="item.options.justify"
             :align="item.options.align"
           >
             <el-col v-for="(col, colIndex) in item.columns" :key="colIndex" :span="col.span">
-
               <template v-for="citem in col.list">
                 <el-form-item v-if="citem.type=='blank'" :key="citem.key" :label="citem.name" :prop="citem.model">
                   <slot :name="citem.model" :model="models" />
@@ -31,9 +29,9 @@
                   :preview="preview"
                   :models.sync="models"
                   :remote="remote"
-                  :rules="rules"
                   :widget="citem"
                   :data="data"
+                  :prop-value="citem.model"
                   @input-change="onInputChange"
                 />
               </template>
@@ -47,18 +45,18 @@
           </el-form-item>
         </template>
         <!-- 子表单 -->
-        <template v-if="item.type === 'subform'">
+        <template v-else-if="item.type === 'subform'">
           <el-form-item
             :key="item.key"
             :label-width="!item.options.labelWidthStatus?'0px': item.options.labelWidth + 'px'"
             :label="!item.options.labelWidthStatus?'':item.name"
-            :prop="item.model"
           >
             <el-table
               :data="models[item.model]"
               border
               style="width: 100%"
               :header-cell-style="{padding: '5px 0'}"
+              size="mini"
             >
               <el-table-column
                 v-if="!preview"
@@ -71,7 +69,6 @@
                 <template slot-scope="scope">
                   <i style="font-size: 25px; color: red" class="el-icon-remove" @click="delSubformCol(item, scope.$index)" />
                 </template>
-
               </el-table-column>
               <template v-for="(c, i) in item.columns">
                 <div :key="i">
@@ -84,9 +81,9 @@
                   >
                     <template slot-scope="scope">
                       <genetate-form-item
+                        :prop-value="item.model + '.' + scope.$index + '.' + v.model"
                         :preview="preview"
                         :models.sync="models"
-                        :rules="rules"
                         :widget="v"
                         :remote="remote"
                         :data="data"
@@ -106,9 +103,9 @@
         <template v-else>
           <genetate-form-item
             :key="item.key"
+            :prop-value="item.model"
             :preview="preview"
             :models.sync="models"
-            :rules="rules"
             :widget="item"
             :remote="remote"
             :data="data"
@@ -169,6 +166,20 @@ export default {
           } else {
             subformFields[l.model] = ""
           }
+
+          if (this.rules[item.model] === undefined) {
+            this.rules[item.model] = []
+          }
+          if (this.rules[item.model][this.models[item.model].length] === undefined) {
+            this.rules[item.model][this.models[item.model].length] = {}
+          }
+          this.rules[item.model][this.models[item.model].length][l.model] = [...l.rules.map(item => {
+            if (item.pattern) {
+              return { ...item, pattern: eval(item.pattern) }
+            } else {
+              return { ...item }
+            }
+          })]
         }
       }
       this.models[item.model].push(subformFields)
@@ -206,19 +217,6 @@ export default {
                   return { ...item }
                 }
               })]
-            } else if (genList[i].type === 'subform') {
-              console.log(genList[i].columns)
-              for (var c of genList[i].columns) {
-                // for (var l of c.list) {
-                //   this.rules[l.model] = [...l.rules.map(item => {
-                //     if (item.pattern) {
-                //       return { ...item, pattern: eval(item.pattern) }
-                //     } else {
-                //       return { ...item }
-                //     }
-                //   })]
-                // }
-              }
             } else {
               this.rules[genList[i].model] = [...genList[i].rules.map(item => {
                 if (item.pattern) {
@@ -228,8 +226,6 @@ export default {
                 }
               })]
             }
-
-            // console.log(this.models)
           }
         }
       }

src/components/VueFormMaking/components/GenerateFormItem.vue

@@ -3,7 +3,7 @@
     v-if="showStatus"
     :label-width="isLabel===false||!widget.options.labelWidthStatus?'0px': widgetLabelWidth + 'px'"
     :label="isLabel===false||widget.type==='divider' || !widget.options.labelWidthStatus?'':widget.name"
-    :prop="widget.model"
+    :prop="propValue"
     :style="subformIndex !== undefined?{'margin-bottom': '0'}: {}"
   >
     <template v-if="preview">
@@ -335,7 +335,7 @@ export default {
     FileUpload
   },
   /* eslint-disable */
-  props: ['widget', 'models', 'rules', 'remote', 'data', 'disabled', 'preview', 'isLabel', 'subformIndex', 'subformModel'],
+  props: ['widget', 'models', 'propValue', 'remote', 'data', 'disabled', 'preview', 'isLabel', 'subformIndex', 'subformModel'],
   data() {
     return {
       showStatus: true,
@@ -396,7 +396,7 @@ export default {
         })
       })
     }
-    
+
     if (this.widget.type === 'imgupload' && this.widget.options.isQiniu) {
       this.remote[this.widget.options.tokenFunc]((data) => {
         this.widget.options.token = data