[fix]{GenerateForm,CrudTable}: 修复几处bug

src/components/CommonTable/index.vue

@@ -18,7 +18,7 @@
       fit
       highlight-current-row
       @selection-change="selection => emitEvent('selection-change', selection)"
-      @row-click="(row, event, column) => emitEventHandler('row-click', row, event, column)"
+      @row-click="(row, event, column) => emitEvent('row-click', row, event, column)"
     >
      <el-table-column
         v-if="IsMultiple"

src/components/CrudTable/CrudTable.vue

@@ -26,7 +26,7 @@
       @handleSizeChange="Refresh"
       :handleButton="handleButton"
       @selection-change="selection => emitEvent('selection-change', selection)"
-      @row-click="(row, event, column) => emitEventHandler('row-click', row, event, column)"
+      @row-click="(row, event, column) => emitEvent('row-click', row, event, column)"
     >
       <template slot="handleButton" slot-scope="scope">
         <v-btn
@@ -170,17 +170,16 @@ export default {
     Refresh() {
       this.fetchData(this.listQuery);
     },
-    formValueToArray() {
+    formValueToArray(genList) {
       // 如果select,radio,checkbox等组件为多选情况  后台返回逗号分隔字符串 => 数组
-      const genList = this.jsondata.list
       for (let i = 0; i < genList.length; i += 1) {
         if (genList[i].type === 'grid') {
           genList[i].columns.forEach((item) => {
             this.formValueToArray(item.list);
           });
         } else {
           const row = genList[i]
-          if (!Array.isArray(this.formValues[row.model])) {
+          if (row.options.multiple && this.formValues[row.model]) {
             this.formValues[row.model] = this.formValues[row.model].split(',');
           }
         }
@@ -229,16 +228,15 @@ export default {
       this.dialogStatus = 'update';
       const response = await this.crud('detail', this.tableName, { id });
       this.formValues = response.data;
-      this.formValueToArray()
+      this.formValueToArray(this.jsonData.list)
       this.dialogFormVisible = true;
     },
     async Detail(id) {
       this.dialogStatus = 'detail';
       const response = await this.crud('detail', this.tableName, { id });
       this.formValues = response.data;
-      this.formValueToArray()
+      this.formValueToArray(this.jsonData.list)
       this.dialogFormVisible = true;
-      this.disabled = true
     },
   },
 }

src/components/CrudTable/components/props.js

@@ -6,10 +6,7 @@
  */
 
 export default {
-  disabled: {
-    type: Boolean,
-    default: false,
-  },
+
   tableName: String,
   showPagination: {
     type: Boolean,
@@ -50,4 +47,9 @@ export default {
     type: Object,
     default: null,
   },
+  // 表单元素隐藏控制
+  setHidden: {
+    type: Array,
+    default: () => ([]),
+  },
 };

src/components/FormDesigner/GenerateForm.vue

@@ -2,7 +2,6 @@
   <div>
     <el-form
       ref="generateForm"
-      :disabled="disabled"
       :model="models"
       :rules="rules"
       :label-position="data.config.labelPosition"
@@ -36,7 +35,6 @@
                                   :remote="remote"
                                   :rules="rules"
                                   :widget="citem"
-                                  :disabled="disabled"
                                   v-show="!item.hidden"></GenerateFormItem>
               </template>
             </el-col>
@@ -58,7 +56,6 @@
                             :rules="rules"
                             :widget="item"
                             :remote="remote"
-                            :disabled="disabled"
                             v-show="!item.hidden"></GenerateFormItem>
         </template>
 
@@ -81,7 +78,6 @@ export default {
   // data 初始化表单
   // value 表单赋值
   // clear 清空表单
-  // disabled 表单只读
   data() {
     return {
       models: {},
@@ -107,7 +103,7 @@ export default {
   created() {
     this.generateModle(this.data.list);
     this.setFormReadOnly(this.data.list);
-    this.setHidden(this.data.list);
+    this.setFormHidden(this.data.list);
   },
   methods: {
     // 设置只读

src/components/FormDesigner/WidgetConfig.vue

@@ -550,49 +550,46 @@ export default {
     },
   },
   watch: {
-    'data.options.isRange': function (val) {
+    'data.options.isRange': function watchIsRange(val) {
       if (typeof val !== 'undefined') {
         if (val) {
-          this.data.options.defaultValue = null
-        } else if (Object.keys(this.data.options).indexOf('defaultValue') >= 0) { this.data.options.defaultValue = '' }
+          this.data.options.defaultValue = null;
+        } else if (Object.keys(this.data.options).includes('defaultValue')) { this.data.options.defaultValue = ''; }
       }
     },
-    'data.options.required': function (val) {
+    'data.options.required': function watchRequired(val) {
       if (val) {
-        this.validator.required = { required: true, message: `${this.data.name}必须填写` }
+        this.validator.required = { required: true, message: `${this.data.name}必须填写` };
       } else {
-        this.validator.required = null
+        this.validator.required = null;
       }
-
       this.$nextTick(() => {
-        this.generateRule()
-      })
+        this.generateRule();
+      });
     },
-    'data.options.dataType': function (val) {
+    'data.options.dataType': function watchDataType(val) {
       if (!this.show) {
-        return false
+        return false;
       }
-
       if (val) {
-        this.validator.type = { type: val, message: `${this.data.name}格式不正确` }
+        this.validator.type = { type: val, message: `${this.data.name}格式不正确` };
       } else {
-        this.validator.type = null
+        this.validator.type = null;
       }
-
-      this.generateRule()
+      this.generateRule();
+      return null;
     },
-    'data.options.pattern': function (val) {
+    'data.options.pattern': function watchPattern(val) {
       if (!this.show) {
-        return false
+        return false;
       }
-
       if (val) {
-        this.validator.pattern = { pattern: eval(val), message: `${this.data.name}格式不匹配` }
+        this.validator.pattern = { pattern: val, message: `${this.data.name}格式不匹配` };
       } else {
-        this.validator.pattern = null
+        this.validator.pattern = null;
       }
-
-      this.generateRule()
+      this.generateRule();
+      return null;
     },
   },
   methods: {
@@ -637,7 +634,7 @@ export default {
           this.data.options.defaultValue = []
         }
       } else if (this.data.options.defaultValue.length > 0) {
-        this.data.options.defaultValue = this.data.options.defaultValue[0]
+        [this.data.options.defaultValue] = this.data.options.defaultValue;
       } else {
         this.data.options.defaultValue = ''
       }

src/components/Tinymce/components/editorImage.vue

@@ -55,7 +55,7 @@ export default {
       this.dialogVisible = false
     },
     handleSuccess(response, file) {
-      const uid = file.uid
+      const { uid } = file
       const objKeyArr = Object.keys(this.listObj)
       for (let i = 0, len = objKeyArr.length; i < len; i++) {
         if (this.listObj[objKeyArr[i]].uid === uid) {
@@ -66,7 +66,7 @@ export default {
       }
     },
     handleRemove(file) {
-      const uid = file.uid
+      const { uid } = file
       const objKeyArr = Object.keys(this.listObj)
       for (let i = 0, len = objKeyArr.length; i < len; i++) {
         if (this.listObj[objKeyArr[i]].uid === uid) {
@@ -80,10 +80,10 @@ export default {
       const _URL = window.URL || window.webkitURL
       const fileName = file.uid
       this.listObj[fileName] = {}
-      return new Promise((resolve, reject) => {
+      return new Promise((resolve) => {
         const img = new Image()
         img.src = _URL.createObjectURL(file)
-        img.onload = function () {
+        img.onload = function onload() {
           _self.listObj[fileName] = {
             hasSuccess: false, uid: file.uid, width: this.width, height: this.height,
           }