cloud-web-corejs 1.0.18 → 1.0.20

package/src/views/user/form/form_ins_list/edit.vue

@@ -1,421 +1,421 @@
-<template>
-  <div class="detail-wrap">
-    <el-form ref="editForm" :model="formInsList">
-      <div class="d-header clearfix">
-        <div class="fl">
-          <i class="el-icon-info"/>
-          查看表单实例列表字段定义
-        </div>
-        <div class="fr">
-          <el-button type="primary" plain class="button-sty" @click="$baseReload()" icon="el-icon-refresh-right">重置
-          </el-button>
-          <el-button type="primary" class="button-sty" icon="el-icon-check" @click="saveData">保存</el-button>
-        </div>
-      </div>
-      <baseTabs>
-        <baseTabPane label="基本信息">
-          <template #default>
-            <table class="table-detail">
-              <tbody>
-              <tr>
-                <th>模板编码</th>
-                <td>
-                  {{ formInsList.formCode }}
-                </td>
-              </tr>
-              <tr>
-                <th>
-                  脚本
-                  <!--                  <scriptDescriptionButton path="static/readme/ExportTemplate.txt"></scriptDescriptionButton>-->
-                  <scriptTestButton :script.sync="formInsList.script"></scriptTestButton>
-                </th>
-                <td colspan="7">
-                  <el-form-item prop="script" :rules="[{ required: false, trigger: 'blur' }]">
-                    <code-editor mode="java" :readonly="!1" v-model="formInsList.script"
-                                 v-if="showCodeEditor"></code-editor>
-                  </el-form-item>
-                </td>
-              </tr>
-              <tr>
-                <th>创建人</th>
-                <td>{{ formInsList.createBy }}</td>
-                <th>创建时间</th>
-                <td>{{ formInsList.createDate }}</td>
-                <th>更新人</th>
-                <td>{{ formInsList.modifyBy }}</td>
-                <th>更新时间</th>
-                <td>{{ formInsList.modifyDate }}</td>
-              </tr>
-              </tbody>
-            </table>
-          </template>
-        </baseTabPane>
-        <baseTabPane label="列表信息">
-          <template #button>
-            <el-button class="button-sty" @click="addItem0()" icon="el-icon-plus">自定义新增</el-button>
-            <el-button class="button-sty" @click="addItem0(true)" icon="el-icon-plus">表单列新增</el-button>
-          </template>
-          <template #default>
-            <vxe-grid
-              ref="table-m0"
-              :data="formInsList.formInsListField0DTOs"
-              v-bind="vxeOption0"
-              @resizable-change="$vxeTableUtil.onColumnWitchChange"
-              @custom="$vxeTableUtil.customHandle"
-            ></vxe-grid>
-          </template>
-        </baseTabPane>
-        <baseTabPane label="查询信息">
-          <template #button>
-            <el-button class="button-sty" @click="addItem1()" icon="el-icon-plus">自定义新增</el-button>
-            <el-button class="button-sty" @click="addItem1(true)" icon="el-icon-plus">表单列新增</el-button>
-          </template>
-          <template #default>
-            <vxe-grid
-              ref="table-m1"
-              :data="formInsList.formInsListField1DTOs"
-              v-bind="vxeOption1"
-              @resizable-change="$vxeTableUtil.onColumnWitchChange"
-              @custom="$vxeTableUtil.customHandle"
-            ></vxe-grid>
-          </template>
-        </baseTabPane>
-      </baseTabs>
-    </el-form>
-    <formTemplateFieldDialog v-if="showFormTemplateFieldDialog" :visiable.sync="showFormTemplateFieldDialog"
-                             :formCode="formCode"
-                             @confirm="confirmFormTemplateFieldDialog"/>
-  </div>
-</template>
-
-<script>
-import formTemplateFieldDialog from "../../../../views/user/form/form_template_field/dialog";
-
-
-export default {
-  name: 'form_ins_listEdit',
-  props: {
-    formCode: String
-  },
-  components: {
-    formTemplateFieldDialog
-  },
-  data() {
-    return {
-      isEdit: false,
-      tabIndex: 'first',
-      dataId: '',
-      formInsList: {
-        formCode: null,
-        script: null,
-        formInsListField0DTOs: [],
-        formInsListField1DTOs: [],
-        formInsListFieldDTOs: []
-      },
-      showCodeEditor: false,
-      vxeOption0: {},
-      vxeOption1: {},
-      showFormTemplateFieldDialog: false,
-      operateType: 0
-    };
-  },
-  created() {
-    // if (this._dataId) this.dataId = this._dataId;
-  },
-  mounted() {
-    this.getData();
-    this.initTable0();
-    this.initTable1();
-  },
-  methods: {
-    getData() {
-      this.isEdit = true;
-      this.$commonHttp({
-        url: USER_PREFIX + `/form_ins_list/getByFormCode`,
-        method: `post`,
-        data: {
-          stringOne: this.formCode
-        },
-        isLoading: true,
-        modalStrictly: true,
-        success: res => {
-          let formInsList = res.objx || {
-            formCode: this.formCode,
-            script: null
-          };
-          formInsList.formInsListField0DTOs = [];
-          formInsList.formInsListField1DTOs = [];
-          formInsList.formInsListFieldDTOs = [];
-          this.formInsList = formInsList;
-          this.getFields();
-          this.showCodeEditor = true;
-        }
-      });
-    },
-    getFields() {
-      this.$http({
-        url: USER_PREFIX + `/form_ins_list/getFields`,
-        method: `post`,
-        data: {
-          stringOne: this.formCode
-        },
-        isLoading: true,
-        modalStrictly: true,
-        success: res => {
-          let formInsListFieldDTOs = res.objx || [];
-          let formInsListField0DTOs = formInsListFieldDTOs.filter(formInsListFieldDTO => formInsListFieldDTO.fieldType == 0);
-          let formInsListField1DTOs = formInsListFieldDTOs.filter(formInsListFieldDTO => formInsListFieldDTO.fieldType == 1);
-
-          let formInsList = this.formInsList;
-          formInsList.formInsListField0DTOs = formInsListField0DTOs;
-          formInsList.formInsListField1DTOs = formInsListField1DTOs;
-          formInsList.formInsListFieldDTOs = formInsListField0DTOs.concat(formInsListField1DTOs);
-        }
-      });
-    },
-    saveData() {
-      this.$refs.editForm.$baseValidate(valid => {
-        if (valid) {
-          this.$baseConfirm('您确定要保存吗？').then(() => {
-            let formInsList = this.$baseLodash.cloneDeep(this.formInsList);
-            formInsList.formInsListFieldDTOs = formInsList.formInsListField0DTOs.concat(formInsList.formInsListField1DTOs);
-            delete formInsList.formInsListField0DTOs;
-            delete formInsList.formInsListField1DTOs;
-            var url = USER_PREFIX + `/form_ins_list/save`;
-            this.$http({
-              url: url,
-              method: `post`,
-              data: formInsList,
-              isLoading: true,
-              success: res => {
-                this.$message({
-                  message: res.content,
-                  type: 'success',
-                  duration: 500,
-                  onClose: t => {
-                    this.$baseReload();
-                  }
-                });
-              }
-            });
-          });
-        }
-      });
-    },
-    openFormTemplateFieldDialog(fieldType) {
-      this.operateType = fieldType;
-      this.showFormTemplateFieldDialog = true;
-    },
-    confirmFormTemplateFieldDialog(rows) {
-      if (rows.length) {
-        let tableData;
-        let operateType = this.operateType;
-        if (operateType === 0) {
-          tableData = this.formInsList.formInsListField0DTOs;
-        } else if (operateType === 1) {
-          tableData = this.formInsList.formInsListField1DTOs;
-        }
-        let fieldNames = tableData.map(item => item.fieldName);
-        let items = rows.filter(row => !fieldNames.includes(row.fieldName)).map(row => {
-          return {
-            fieldName: row.fieldName,
-            fieldDesc: row.fieldDesc,
-            fieldType: operateType
-          }
-        });
-        tableData.push(...items);
-      }
-    },
-    addItem0(flag) {
-      if (flag === true) {
-        this.operateType = 0;
-        this.showFormTemplateFieldDialog = true;
-      } else {
-        this.formInsList.formInsListField0DTOs.push({
-          formCode: this.formInsList.formCode,
-          fieldType: 0,
-          fieldName: null,
-          fieldDesc: null
-        })
-      }
-    },
-    addItem1(flag) {
-      if (flag === true) {
-        this.operateType = 1;
-        this.showFormTemplateFieldDialog = true;
-      } else {
-        this.formInsList.formInsListField1DTOs.push({
-          formCode: this.formInsList.formCode,
-          fieldType: 1,
-          fieldName: null,
-          fieldDesc: null
-        })
-      }
-    },
-    initTable0() {
-      const tableOption = {
-        vue: this,
-        tableRef: 'table-m0',
-        tableName: 'form-formInsList-edit-m0',
-        columns: [
-          {type: 'checkbox', fixed: 'left', width: 48, resizable: false},
-          {
-            title: '字段描述',
-            field: 'fieldDesc',
-            width: 150,
-            slots: {
-              default: ({row, rowIndex, $table}) => {
-                return [
-                  <el-form-item prop={'formInsListField0DTOs.' + rowIndex + '.fieldDesc'}
-                                rules={[{required: true, trigger: ['blur', 'change']}]}>
-                    <el-input v-model={row.fieldDesc} clearable/>
-                  </el-form-item>
-                ];
-              }
-            }
-          },
-          {
-            title: '字段名',
-            field: 'fieldName',
-            width: 150,
-            slots: {
-              default: ({row, rowIndex, $table}) => {
-                return [
-                  <el-form-item prop={'formInsListField0DTOs.' + rowIndex + '.fieldName'}
-                                rules={[{required: true, trigger: ['blur', 'change']}]}>
-                    <el-input v-model={row.fieldName} clearable/>
-                  </el-form-item>
-                ];
-              }
-            }
-          },
-          {
-            title: '排序',
-            field: 'orders',
-            width: 150,
-            slots: {
-              default: ({row, rowIndex, $table}) => {
-                return [
-                  <el-form-item prop={'formInsListField0DTOs.' + rowIndex + '.orders'}
-                                rules={[{required: false, trigger: ['blur', 'change']}]}>
-                    <base-input-number v-model={row.orders} scale={0} />
-                  </el-form-item>
-                ];
-              }
-            }
-          },
-          {
-            width: 47,
-            fixed: 'right',
-            title: '',
-            sortable: false,
-            slots: {
-              default: ({row, rowIndex, $table}) => {
-                return [
-                  <a
-                    href="javascript:void(0);"
-                    class="a-link"
-                    onclick={() => {
-                      this.formInsList.formInsListField0DTOs.splice(rowIndex, 1);
-                    }}
-                  >
-                    <el-tooltip enterable={false} effect="dark" content="删除" placement="top"
-                                popper-class="tooltip-skin">
-                      <i class="el-icon-delete"/>
-                    </el-tooltip>
-                  </a>
-                ];
-              }
-            }
-          }
-        ]
-      };
-      this.$vxeTableUtil.initVxeTable(tableOption).then(opts => {
-        this.vxeOption0 = opts;
-      });
-    },
-    initTable1() {
-      const tableOption = {
-        vue: this,
-        tableRef: 'table-m1',
-        tableName: 'form-formInsList-edit-m1',
-        columns: [
-          {type: 'checkbox', fixed: 'left', width: 48, resizable: false},
-          {
-            title: '字段描述',
-            field: 'fieldDesc',
-            width: 150,
-            slots: {
-              default: ({row, rowIndex, $table}) => {
-                return [
-                  <el-form-item prop={'formInsListField1DTOs.' + rowIndex + '.fieldDesc'}
-                                rules={[{required: true, trigger: ['blur', 'change']}]}>
-                    <el-input v-model={row.fieldDesc} clearable/>
-                  </el-form-item>
-                ];
-              }
-            }
-          },
-          {
-            title: '字段名',
-            field: 'fieldName',
-            width: 150,
-            slots: {
-              default: ({row, rowIndex, $table}) => {
-                return [
-                  <el-form-item prop={'formInsListField1DTOs.' + rowIndex + '.fieldName'}
-                                rules={[{required: true, trigger: ['blur', 'change']}]}>
-                    <el-input v-model={row.fieldName} clearable/>
-                  </el-form-item>
-                ];
-              }
-            }
-          },
-          {
-            title: '排序',
-            field: 'orders',
-            width: 150,
-            slots: {
-              default: ({row, rowIndex, $table}) => {
-                return [
-                  <el-form-item prop={'formInsListField0DTOs.' + rowIndex + '.orders'}
-                                rules={[{required: false, trigger: ['blur', 'change']}]}>
-                    <base-input-number v-model={row.orders} scale={0} />
-                  </el-form-item>
-                ];
-              }
-            }
-          },
-          {
-            width: 47,
-            fixed: 'right',
-            title: '',
-            sortable: false,
-            slots: {
-              default: ({row, rowIndex, $table}) => {
-                return [
-                  <a
-                    href="javascript:void(0);"
-                    class="a-link"
-                    onclick={() => {
-                      this.formInsList.formInsListField1DTOs.splice(rowIndex, 1);
-                    }}
-                  >
-                    <el-tooltip enterable={false} effect="dark" content="删除" placement="top"
-                                popper-class="tooltip-skin">
-                      <i class="el-icon-delete"/>
-                    </el-tooltip>
-                  </a>
-                ];
-              }
-            }
-          }
-        ]
-      };
-      this.$vxeTableUtil.initVxeTable(tableOption).then(opts => {
-        this.vxeOption1 = opts;
-      });
-    },
-  }
-};
-</script>
+<template>
+  <div class="detail-wrap">
+    <el-form ref="editForm" :model="formInsList">
+      <div class="d-header clearfix">
+        <div class="fl">
+          <i class="el-icon-info"/>
+          查看表单实例列表字段定义
+        </div>
+        <div class="fr">
+          <el-button type="primary" plain class="button-sty" @click="$baseReload()" icon="el-icon-refresh-right">{{$t1('重置')}}
+          </el-button>
+          <el-button type="primary" class="button-sty" icon="el-icon-check" @click="saveData">{{$t1('保存')}}</el-button>
+        </div>
+      </div>
+      <baseTabs>
+        <baseTabPane :label="$t1('基本信息')">
+          <template #default>
+            <table class="table-detail">
+              <tbody>
+              <tr>
+                <th>模板编码</th>
+                <td>
+                  {{ formInsList.formCode }}
+                </td>
+              </tr>
+              <tr>
+                <th>
+                  脚本
+                  <!--                  <scriptDescriptionButton path="static/readme/ExportTemplate.txt"></scriptDescriptionButton>-->
+                  <scriptTestButton :script.sync="formInsList.script"></scriptTestButton>
+                </th>
+                <td colspan="7">
+                  <el-form-item prop="script" :rules="[{ required: false, trigger: 'blur' }]">
+                    <code-editor mode="java" :readonly="!1" v-model="formInsList.script"
+                                 v-if="showCodeEditor"></code-editor>
+                  </el-form-item>
+                </td>
+              </tr>
+              <tr>
+                <th>{{ $t1('创建人') }}</th>
+                <td>{{ formInsList.createBy }}</td>
+                <th>{{ $t1('创建时间') }}</th>
+                <td>{{ formInsList.createDate }}</td>
+                <th>{{ $t1('更新人') }}</th>
+                <td>{{ formInsList.modifyBy }}</td>
+                <th>{{ $t1('更新时间') }}</th>
+                <td>{{ formInsList.modifyDate }}</td>
+              </tr>
+              </tbody>
+            </table>
+          </template>
+        </baseTabPane>
+        <baseTabPane label="列表信息">
+          <template #button>
+            <el-button class="button-sty" @click="addItem0()" icon="el-icon-plus">自定义新增</el-button>
+            <el-button class="button-sty" @click="addItem0(true)" icon="el-icon-plus">表单列新增</el-button>
+          </template>
+          <template #default>
+            <vxe-grid
+              ref="table-m0"
+              :data="formInsList.formInsListField0DTOs"
+              v-bind="vxeOption0"
+              @resizable-change="$vxeTableUtil.onColumnWitchChange"
+              @custom="$vxeTableUtil.customHandle"
+            ></vxe-grid>
+          </template>
+        </baseTabPane>
+        <baseTabPane label="查询信息">
+          <template #button>
+            <el-button class="button-sty" @click="addItem1()" icon="el-icon-plus">自定义新增</el-button>
+            <el-button class="button-sty" @click="addItem1(true)" icon="el-icon-plus">表单列新增</el-button>
+          </template>
+          <template #default>
+            <vxe-grid
+              ref="table-m1"
+              :data="formInsList.formInsListField1DTOs"
+              v-bind="vxeOption1"
+              @resizable-change="$vxeTableUtil.onColumnWitchChange"
+              @custom="$vxeTableUtil.customHandle"
+            ></vxe-grid>
+          </template>
+        </baseTabPane>
+      </baseTabs>
+    </el-form>
+    <formTemplateFieldDialog v-if="showFormTemplateFieldDialog" :visiable.sync="showFormTemplateFieldDialog"
+                             :formCode="formCode"
+                             @confirm="confirmFormTemplateFieldDialog"/>
+  </div>
+</template>
+
+<script>
+import formTemplateFieldDialog from "../../../../views/user/form/form_template_field/dialog";
+
+
+export default {
+  name: 'form_ins_listEdit',
+  props: {
+    formCode: String
+  },
+  components: {
+    formTemplateFieldDialog
+  },
+  data() {
+    return {
+      isEdit: false,
+      tabIndex: 'first',
+      dataId: '',
+      formInsList: {
+        formCode: null,
+        script: null,
+        formInsListField0DTOs: [],
+        formInsListField1DTOs: [],
+        formInsListFieldDTOs: []
+      },
+      showCodeEditor: false,
+      vxeOption0: {},
+      vxeOption1: {},
+      showFormTemplateFieldDialog: false,
+      operateType: 0
+    };
+  },
+  created() {
+    // if (this._dataId) this.dataId = this._dataId;
+  },
+  mounted() {
+    this.getData();
+    this.initTable0();
+    this.initTable1();
+  },
+  methods: {
+    getData() {
+      this.isEdit = true;
+      this.$commonHttp({
+        url: USER_PREFIX + `/form_ins_list/getByFormCode`,
+        method: `post`,
+        data: {
+          stringOne: this.formCode
+        },
+        isLoading: true,
+        modalStrictly: true,
+        success: res => {
+          let formInsList = res.objx || {
+            formCode: this.formCode,
+            script: null
+          };
+          formInsList.formInsListField0DTOs = [];
+          formInsList.formInsListField1DTOs = [];
+          formInsList.formInsListFieldDTOs = [];
+          this.formInsList = formInsList;
+          this.getFields();
+          this.showCodeEditor = true;
+        }
+      });
+    },
+    getFields() {
+      this.$http({
+        url: USER_PREFIX + `/form_ins_list/getFields`,
+        method: `post`,
+        data: {
+          stringOne: this.formCode
+        },
+        isLoading: true,
+        modalStrictly: true,
+        success: res => {
+          let formInsListFieldDTOs = res.objx || [];
+          let formInsListField0DTOs = formInsListFieldDTOs.filter(formInsListFieldDTO => formInsListFieldDTO.fieldType == 0);
+          let formInsListField1DTOs = formInsListFieldDTOs.filter(formInsListFieldDTO => formInsListFieldDTO.fieldType == 1);
+
+          let formInsList = this.formInsList;
+          formInsList.formInsListField0DTOs = formInsListField0DTOs;
+          formInsList.formInsListField1DTOs = formInsListField1DTOs;
+          formInsList.formInsListFieldDTOs = formInsListField0DTOs.concat(formInsListField1DTOs);
+        }
+      });
+    },
+    saveData() {
+      this.$refs.editForm.$baseValidate(valid => {
+        if (valid) {
+          this.$baseConfirm(this.$t1('您确定要保存吗？')).then(() => {
+            let formInsList = this.$baseLodash.cloneDeep(this.formInsList);
+            formInsList.formInsListFieldDTOs = formInsList.formInsListField0DTOs.concat(formInsList.formInsListField1DTOs);
+            delete formInsList.formInsListField0DTOs;
+            delete formInsList.formInsListField1DTOs;
+            var url = USER_PREFIX + `/form_ins_list/save`;
+            this.$http({
+              url: url,
+              method: `post`,
+              data: formInsList,
+              isLoading: true,
+              success: res => {
+                this.$message({
+                  message: res.content,
+                  type: 'success',
+                  duration: 500,
+                  onClose: t => {
+                    this.$baseReload();
+                  }
+                });
+              }
+            });
+          });
+        }
+      });
+    },
+    openFormTemplateFieldDialog(fieldType) {
+      this.operateType = fieldType;
+      this.showFormTemplateFieldDialog = true;
+    },
+    confirmFormTemplateFieldDialog(rows) {
+      if (rows.length) {
+        let tableData;
+        let operateType = this.operateType;
+        if (operateType === 0) {
+          tableData = this.formInsList.formInsListField0DTOs;
+        } else if (operateType === 1) {
+          tableData = this.formInsList.formInsListField1DTOs;
+        }
+        let fieldNames = tableData.map(item => item.fieldName);
+        let items = rows.filter(row => !fieldNames.includes(row.fieldName)).map(row => {
+          return {
+            fieldName: row.fieldName,
+            fieldDesc: row.fieldDesc,
+            fieldType: operateType
+          }
+        });
+        tableData.push(...items);
+      }
+    },
+    addItem0(flag) {
+      if (flag === true) {
+        this.operateType = 0;
+        this.showFormTemplateFieldDialog = true;
+      } else {
+        this.formInsList.formInsListField0DTOs.push({
+          formCode: this.formInsList.formCode,
+          fieldType: 0,
+          fieldName: null,
+          fieldDesc: null
+        })
+      }
+    },
+    addItem1(flag) {
+      if (flag === true) {
+        this.operateType = 1;
+        this.showFormTemplateFieldDialog = true;
+      } else {
+        this.formInsList.formInsListField1DTOs.push({
+          formCode: this.formInsList.formCode,
+          fieldType: 1,
+          fieldName: null,
+          fieldDesc: null
+        })
+      }
+    },
+    initTable0() {
+      const tableOption = {
+        vue: this,
+        tableRef: 'table-m0',
+        tableName: 'form-formInsList-edit-m0',
+        columns: [
+          {type: 'checkbox', fixed: 'left', width: 48, resizable: false},
+          {
+            title: '字段描述',
+            field: 'fieldDesc',
+            width: 150,
+            slots: {
+              default: ({row, rowIndex, $table}) => {
+                return [
+                  <el-form-item prop={'formInsListField0DTOs.' + rowIndex + '.fieldDesc'}
+                                rules={[{required: true, trigger: ['blur', 'change']}]}>
+                    <el-input v-model={row.fieldDesc} clearable/>
+                  </el-form-item>
+                ];
+              }
+            }
+          },
+          {
+            title: '字段名',
+            field: 'fieldName',
+            width: 150,
+            slots: {
+              default: ({row, rowIndex, $table}) => {
+                return [
+                  <el-form-item prop={'formInsListField0DTOs.' + rowIndex + '.fieldName'}
+                                rules={[{required: true, trigger: ['blur', 'change']}]}>
+                    <el-input v-model={row.fieldName} clearable/>
+                  </el-form-item>
+                ];
+              }
+            }
+          },
+          {
+            title: '排序',
+            field: 'orders',
+            width: 150,
+            slots: {
+              default: ({row, rowIndex, $table}) => {
+                return [
+                  <el-form-item prop={'formInsListField0DTOs.' + rowIndex + '.orders'}
+                                rules={[{required: false, trigger: ['blur', 'change']}]}>
+                    <base-input-number v-model={row.orders} scale={0}/>
+                  </el-form-item>
+                ];
+              }
+            }
+          },
+          {
+            width: 47,
+            fixed: 'right',
+            title: '',
+            sortable: false,
+            slots: {
+              default: ({row, rowIndex, $table}) => {
+                return [
+                  <a
+                    href="javascript:void(0);"
+                    class="a-link"
+                    onclick={() => {
+                      this.formInsList.formInsListField0DTOs.splice(rowIndex, 1);
+                    }}
+                  >
+                    <el-tooltip enterable={false} effect="dark" content="删除" placement="top"
+                                popper-class="tooltip-skin">
+                      <i class="el-icon-delete"/>
+                    </el-tooltip>
+                  </a>
+                ];
+              }
+            }
+          }
+        ]
+      };
+      this.$vxeTableUtil.initVxeTable(tableOption).then(opts => {
+        this.vxeOption0 = opts;
+      });
+    },
+    initTable1() {
+      const tableOption = {
+        vue: this,
+        tableRef: 'table-m1',
+        tableName: 'form-formInsList-edit-m1',
+        columns: [
+          {type: 'checkbox', fixed: 'left', width: 48, resizable: false},
+          {
+            title: '字段描述',
+            field: 'fieldDesc',
+            width: 150,
+            slots: {
+              default: ({row, rowIndex, $table}) => {
+                return [
+                  <el-form-item prop={'formInsListField1DTOs.' + rowIndex + '.fieldDesc'}
+                                rules={[{required: true, trigger: ['blur', 'change']}]}>
+                    <el-input v-model={row.fieldDesc} clearable/>
+                  </el-form-item>
+                ];
+              }
+            }
+          },
+          {
+            title: '字段名',
+            field: 'fieldName',
+            width: 150,
+            slots: {
+              default: ({row, rowIndex, $table}) => {
+                return [
+                  <el-form-item prop={'formInsListField1DTOs.' + rowIndex + '.fieldName'}
+                                rules={[{required: true, trigger: ['blur', 'change']}]}>
+                    <el-input v-model={row.fieldName} clearable/>
+                  </el-form-item>
+                ];
+              }
+            }
+          },
+          {
+            title: '排序',
+            field: 'orders',
+            width: 150,
+            slots: {
+              default: ({row, rowIndex, $table}) => {
+                return [
+                  <el-form-item prop={'formInsListField0DTOs.' + rowIndex + '.orders'}
+                                rules={[{required: false, trigger: ['blur', 'change']}]}>
+                    <base-input-number v-model={row.orders} scale={0}/>
+                  </el-form-item>
+                ];
+              }
+            }
+          },
+          {
+            width: 47,
+            fixed: 'right',
+            title: '',
+            sortable: false,
+            slots: {
+              default: ({row, rowIndex, $table}) => {
+                return [
+                  <a
+                    href="javascript:void(0);"
+                    class="a-link"
+                    onclick={() => {
+                      this.formInsList.formInsListField1DTOs.splice(rowIndex, 1);
+                    }}
+                  >
+                    <el-tooltip enterable={false} effect="dark" content="删除" placement="top"
+                                popper-class="tooltip-skin">
+                      <i class="el-icon-delete"/>
+                    </el-tooltip>
+                  </a>
+                ];
+              }
+            }
+          }
+        ]
+      };
+      this.$vxeTableUtil.initVxeTable(tableOption).then(opts => {
+        this.vxeOption1 = opts;
+      });
+    },
+  }
+};
+</script>