From 3019463a2f55e7a4a7fb137a36ec12a5b756cb89 Mon Sep 17 00:00:00 2001
From: z_yu <1534695664@qq.com>
Date: Mon, 30 May 2022 11:23:54 +0800
Subject: [PATCH] =?UTF-8?q?=E9=97=A8=E7=B1=BB=E7=AE=A1=E7=90=86=20?=
 =?UTF-8?q?=E6=B5=8F=E8=A7=88=E6=8E=92=E5=BA=8F=E8=A7=84=E5=88=99=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE=20=E6=A1=A3=E5=8F=B7=E8=A7=84=E5=88=99=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/styles/index.scss                  |   1 +
 src/views/archivesConfig/dict/index.vue       |   2 +-
 src/views/category/baseInfo/index.vue         |   2 +-
 src/views/category/fieldManage/index.vue      |  32 ++--
 src/views/category/fileNoFormat/index.vue     | 162 ++++++++++++++++++
 .../category/fileNoFormat/module/form.vue     | 107 ++++++++++++
 src/views/category/index.vue                  |  10 +-
 src/views/category/orderingRule/index.vue     | 162 ++++++++++++++++++
 .../category/orderingRule/module/form.vue     | 107 ++++++++++++
 9 files changed, 566 insertions(+), 19 deletions(-)
 create mode 100644 src/views/category/fileNoFormat/index.vue
 create mode 100644 src/views/category/fileNoFormat/module/form.vue
 create mode 100644 src/views/category/orderingRule/index.vue
 create mode 100644 src/views/category/orderingRule/module/form.vue

diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index 783496c..7469f0d 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -201,6 +201,7 @@ ul{
 /**滚动条的宽度*/
 ::-webkit-scrollbar {
   width: 4px;
+  height: 4px;
 }
 
 //滚动条的滑块
diff --git a/src/views/archivesConfig/dict/index.vue b/src/views/archivesConfig/dict/index.vue
index 6575b8d..c804111 100644
--- a/src/views/archivesConfig/dict/index.vue
+++ b/src/views/archivesConfig/dict/index.vue
@@ -35,7 +35,7 @@
     </el-dialog>
     <!-- 字典列表 -->
     <el-row class="container-main" :gutter="20">
-      <el-col class="container-left" :xs="10" :sm="8" :md="5" :lg="6" :xl="4">
+      <el-col class="container-left curd-in-out" :xs="10" :sm="8" :md="5" :lg="6" :xl="4">
         <span class="right-top-line" />
         <span class="left-bottom-line" />
         <crudOperation :permission="permission">
diff --git a/src/views/category/baseInfo/index.vue b/src/views/category/baseInfo/index.vue
index 7402729..9fd495c 100644
--- a/src/views/category/baseInfo/index.vue
+++ b/src/views/category/baseInfo/index.vue
@@ -68,7 +68,7 @@ export default {
   }
 }
 .base-info {
-  padding: 30px;
+  padding: 20px;
 }
 .input-width {
   width: 360px;
diff --git a/src/views/category/fieldManage/index.vue b/src/views/category/fieldManage/index.vue
index e9f513a..79466c4 100644
--- a/src/views/category/fieldManage/index.vue
+++ b/src/views/category/fieldManage/index.vue
@@ -4,53 +4,53 @@
       <crudOperation :permission="permission" />
     </div>
     <!--表格渲染-->
-    <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" height="calc(100vh - 263px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
+    <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="min-width: 100%;" height="calc(100vh - 302px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
       <el-table-column type="selection" width="55" />
       <el-table-column type="index" label="序号" width="55" />
-      <el-table-column prop="fieldCnName" label="字段名称" />
-      <el-table-column prop="fieldName" label="字段标识" />
-      <el-table-column label="数据类型">
+      <el-table-column prop="fieldCnName" label="字段名称" min-width="85" />
+      <el-table-column prop="fieldName" label="字段标识" min-width="85" />
+      <el-table-column label="数据类型" min-width="85">
         <template slot-scope="scope">
           <span v-if="scope.row.isDataType === 1">字符</span>
           <span v-if="scope.row.isDataType === 2">数字</span>
         </template>
       </el-table-column>
-      <el-table-column prop="isColumnLength" label="字段长度" />
-      <el-table-column prop="isColumnLength" label="著录形式" />
-      <el-table-column prop="isColumnLength" label="对应字典" />
-      <el-table-column prop="isColumnLength" label="显示长度" />
-      <el-table-column label="显示一整行">
+      <el-table-column prop="isColumnLength" label="字段长度" min-width="85" />
+      <el-table-column prop="isColumnLength" label="著录形式" min-width="85" />
+      <el-table-column prop="isColumnLength" label="对应字典" min-width="85" />
+      <el-table-column prop="isColumnLength" label="显示长度" min-width="85" />
+      <el-table-column label="显示一整行" min-width="110">
         <template slot-scope="scope">
           <el-checkbox v-model="scope.row.isDefaultValue" :disabled="true" />
         </template>
       </el-table-column>
-      <el-table-column label="输入字段">
+      <el-table-column label="输入字段" min-width="85">
         <template slot-scope="scope">
           <el-checkbox v-model="scope.row.isDefaultValue" :disabled="true" />
         </template>
       </el-table-column>
-      <el-table-column label="必填字段">
+      <el-table-column label="必填字段" min-width="85">
         <template slot-scope="scope">
           <el-checkbox v-model="scope.row.isDefaultValue" :disabled="true" />
         </template>
       </el-table-column>
-      <el-table-column label="自动生成">
+      <el-table-column label="自动生成" min-width="85">
         <template slot-scope="scope">
           <el-checkbox v-model="scope.row.isDefaultValue" :disabled="true" />
         </template>
       </el-table-column>
-      <el-table-column label="自动加一">
+      <el-table-column label="自动加一" min-width="85">
         <template slot-scope="scope">
           <el-checkbox v-model="scope.row.isDefaultValue" :disabled="true" />
         </template>
       </el-table-column>
-      <el-table-column label="自动补零">
+      <el-table-column label="自动补零" min-width="85">
         <template slot-scope="scope">
           <el-checkbox v-model="scope.row.isDefaultValue" :disabled="true" />
         </template>
       </el-table-column>
-      <el-table-column prop="isColumnLength" label="位数" />
-      <el-table-column label="值不重复">
+      <el-table-column prop="isColumnLength" label="位数" min-width="55" />
+      <el-table-column label="值不重复" min-width="85">
         <template slot-scope="scope">
           <el-checkbox v-model="scope.row.isDefaultValue" :disabled="true" />
         </template>
diff --git a/src/views/category/fileNoFormat/index.vue b/src/views/category/fileNoFormat/index.vue
new file mode 100644
index 0000000..f3d8143
--- /dev/null
+++ b/src/views/category/fileNoFormat/index.vue
@@ -0,0 +1,162 @@
+<template>
+  <div class="format-main">
+    <div class="format-main-left">
+      <div class="head-container">
+        <el-button v-permission="permission.add" size="mini" icon="el-icon-plus" @click="crud.toAdd">
+          新增
+        </el-button>
+      </div>
+      <!--表格渲染-->
+      <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 350px;" height="calc(100vh - 302px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column type="index" label="序号" width="55" align="center" />
+        <el-table-column prop="fieldCnName" label="隐藏字段" align="center" />
+      </el-table>
+      <!--表单渲染-->
+      <eForm />
+    </div>
+    <div class="format-main-right">
+      <div class="head-container">
+        <crudOperation :permission="permission">
+          <template v-slot:right>
+            <el-button v-permission="permission.sort" icon="el-icon-sort" size="mini" :loading="sortLoading" :disabled="!crud.selections[0]||!crud.selections[0].childMenus || crud.selections[0].childMenus.length <= 1" @click="toSort(crud.selections)">排序</el-button>
+          </template>
+        </crudOperation>
+      </div>
+      <!--表格渲染-->
+      <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="min-width: 100%;" height="calc(100vh - 302px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column type="index" label="序号" width="55" align="center" />
+        <el-table-column prop="fieldCnName" label="组成字段" align="center" />
+        <el-table-column prop="fieldCnName" label="组成符号" align="center" />
+      </el-table>
+      <!--表单渲染-->
+      <eForm />
+    </div>
+  </div>
+</template>
+
+<script>
+import { add, edit } from '@/api/archivesConfig/field'
+import eForm from './module/form'
+import CRUD, { presenter } from '@crud/crud'
+import crudOperation from '@crud/CRUD.operation'
+
+export default {
+  components: { eForm, crudOperation },
+  mixins: [presenter()],
+  cruds() {
+    return CRUD({
+      url: 'api/field/findGroupType',
+      crudMethod: { add, edit },
+      optShow: {
+        add: false,
+        edit: true,
+        del: true,
+        download: false,
+        group: false
+      },
+      queryOnPresenterCreated: false
+    })
+  },
+  data() {
+    return {
+      permission: {
+        add: ['admin', this.permissionStr + ':add'],
+        edit: ['admin', this.permissionStr + ':edit']
+      },
+      verifyDialogVisible: false,
+      form: {
+        verifyCode: ''
+      },
+      formLabelWidth: '110px',
+      btn: '',
+      showVerifyDialog: true
+    }
+  },
+  created() {
+    // this.crud.title = this.title
+    // this.crud.query = {
+    //   isType: this.isType
+    // }
+    // this.crud.toQuery()
+  },
+  methods: {
+    // [CRUD.HOOK.beforeToCU](crud, form, btn) {
+    //   if (this.showVerifyDialog) {
+    //     // 打开输入验证码对话框
+    //     this.verifyDialogVisible = true
+    //     this.btn = btn
+    //     return false
+    //   }
+    // },
+    // [CRUD.HOOK.beforeToEdit](crud, form, btn) {
+    //   if (form.isColumnLength === null) {
+    //     form.isColumnLength = undefined
+    //   }
+    // },
+    handleConfirm() {
+      // verifyMaintenance(encrypt(this.form.verifyCode)).then((res) => {
+      //   if (res) {
+      //     // 关闭输入验证码对话框
+      //     this.verifyDialogVisible = false
+      //     this.form.verifyCode = ''
+      //     this.showVerifyDialog = false
+      //     if (this.btn === 'add') {
+      //       this.crud.toAdd()
+      //     } else if (this.btn === 'edit') {
+      //       this.crud.toEdit(this.crud.selections[0])
+      //     }
+      //     this.showVerifyDialog = true
+      //   } else {
+      //     this.$message.error('验证码错误！')
+      //   }
+      // })
+    },
+    handleClose(done) {
+      this.form.verifyCode = ''
+      done()
+    },
+    clickRowHandler(row) {
+      this.$refs.table.clearSelection()
+      this.$refs.table.toggleRowSelection(row)
+    },
+    selectionChangeHandler(val) {
+      if (val.length > 1) {
+        // 取出最后val的最后一个返回出来
+        const finalVal = val.pop()
+        // 清除所有选中
+        this.$refs.table.clearSelection()
+        // 给最后一个加上选中
+        this.$refs.table.toggleRowSelection(finalVal)
+        this.crud.selectionChangeHandler([finalVal])
+      } else {
+        this.crud.selectionChangeHandler(val)
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+::v-deep thead .el-table-column--selection .cell {
+  display: none;
+}
+::v-deep div.el-dialog__footer {
+  text-align: center;
+}
+.format-main {
+  display: flex;
+  justify-content: flex-start;
+  .format-main-left,
+  .format-main-right {
+    height: calc(100vh - 231px);
+  }
+  .format-main-left {
+    padding-right: 10px;
+  }
+  .format-main-right {
+    flex-grow: 1;
+  }
+}
+</style>
diff --git a/src/views/category/fileNoFormat/module/form.vue b/src/views/category/fileNoFormat/module/form.vue
new file mode 100644
index 0000000..f2d6b14
--- /dev/null
+++ b/src/views/category/fileNoFormat/module/form.vue
@@ -0,0 +1,107 @@
+<template>
+  <el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title">
+    <span class="dialog-right-top" />
+    <span class="dialog-left-bottom" />
+    <div class="setting-dialog">
+      <el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
+        <el-form-item label="中文名称" prop="fieldCnName">
+          <el-input v-model="form.fieldCnName" style="width: 370px;" />
+        </el-form-item>
+        <el-form-item label="字段标识" prop="fieldName">
+          <el-input v-model="form.fieldName" style="width: 370px;" />
+        </el-form-item>
+        <el-form-item label="数据类型" prop="isDataType">
+          <el-select v-model="form.isDataType" placeholder="请选择">
+            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="字段长度" prop="isColumnLength">
+          <el-input-number v-model="form.isColumnLength" controls-position="right" style="width: 370px;" />
+        </el-form-item>
+        <el-form-item label="默认值" prop="isDefaultValue">
+          <el-input v-model="form.isDefaultValue" style="width: 370px;" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="text" @click="crud.cancelCU">
+          取消
+        </el-button>
+        <el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">
+          确认
+        </el-button>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { form } from '@crud/crud'
+
+const defaultForm = {
+  id: null,
+  fieldCnName: '',
+  fieldName: '',
+  isDataType: 1,
+  isColumnLength: 100,
+  isDefaultValue: ''
+}
+export default {
+  mixins: [form(defaultForm)],
+  data() {
+    var checkMaxLength = (rule, value, callback) => {
+      if (value !== undefined && (!Number.isInteger(value) || value <= 0)) {
+        callback(new Error('请输入正整数数字值'))
+      } else {
+        if (this.form.isDataType === 1 && value > 2000) {
+          callback(new Error('字符最大长度不能超过2000位'))
+        } else if (this.form.isDataType === 2 && value > 11) {
+          callback(new Error('数字最大长度不能超过11位'))
+        } else {
+          callback()
+        }
+      }
+    }
+    var checkFieldName = (rule, value, callback) => {
+      const reg = /^[A-Za-z][A-Za-z_]+[a-zA-Z]*$/
+      if (reg.test(value)) {
+        callback()
+      } else {
+        callback(new Error('字段标识只能由字母、字符“_”组成，并且必须以字母开头和结尾'))
+      }
+    }
+    return {
+      rules: {
+        fieldCnName: [
+          { required: true, message: '请输入中文名称', trigger: 'blur' }
+        ],
+        fieldName: [
+          { required: true, message: '请选择字段标识', trigger: 'blur' },
+          { validator: checkFieldName, trigger: 'blur' }
+        ],
+        isDataType: [
+          { required: true, message: '请选择数据类型', trigger: 'blur' }
+        ],
+        isColumnLength: [
+          { validator: checkMaxLength, trigger: 'blur' }
+        ]
+      },
+      options: [
+        {
+          value: 1,
+          label: '字符'
+        },
+        {
+          value: 2,
+          label: '数字'
+        }
+      ]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+::v-deep .el-input-number .el-input__inner {
+  text-align: left;
+}
+</style>
diff --git a/src/views/category/index.vue b/src/views/category/index.vue
index 37172ab..1bcd5dd 100644
--- a/src/views/category/index.vue
+++ b/src/views/category/index.vue
@@ -67,12 +67,14 @@ import sortDialog from './sortDialog'
 import baseInfo from './baseInfo/index'
 import fieldManage from './fieldManage/index'
 import descriptionPreview from './descriptionPreview/index'
+import orderingRule from './orderingRule/index'
+import fileNoFormat from './fileNoFormat/index'
 import crudOperation from '@crud/CRUD.operation'
 import { findSubsetById } from '@/api/archivesConfig/dictDetail'
 
 export default {
   name: 'Category',
-  components: { crudOperation, eForm, sortDialog, baseInfo, fieldManage, descriptionPreview },
+  components: { crudOperation, eForm, sortDialog, baseInfo, fieldManage, descriptionPreview, orderingRule, fileNoFormat },
   cruds() {
     return [
       CRUD({
@@ -126,6 +128,12 @@ export default {
         return 'fieldManage'
       } else if (this.activeIndex === 2) {
         return 'descriptionPreview'
+      } else if (this.activeIndex === 3) {
+        return 'fieldManage'
+      } else if (this.activeIndex === 4) {
+        return 'orderingRule'
+      } else if (this.activeIndex === 5) {
+        return 'fileNoFormat'
       }
       return 'baseInfo'
     }
diff --git a/src/views/category/orderingRule/index.vue b/src/views/category/orderingRule/index.vue
new file mode 100644
index 0000000..e33f861
--- /dev/null
+++ b/src/views/category/orderingRule/index.vue
@@ -0,0 +1,162 @@
+<template>
+  <div class="format-main">
+    <div class="format-main-left">
+      <div class="head-container">
+        <el-button v-permission="permission.add" size="mini" icon="el-icon-plus" @click="crud.toAdd">
+          新增
+        </el-button>
+      </div>
+      <!--表格渲染-->
+      <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 350px;" height="calc(100vh - 302px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column type="index" label="序号" width="55" align="center" />
+        <el-table-column prop="fieldCnName" label="隐藏字段" align="center" />
+      </el-table>
+      <!--表单渲染-->
+      <eForm />
+    </div>
+    <div class="format-main-right">
+      <div class="head-container">
+        <crudOperation :permission="permission">
+          <template v-slot:right>
+            <el-button v-permission="permission.sort" icon="el-icon-sort" size="mini" :loading="sortLoading" :disabled="!crud.selections[0]||!crud.selections[0].childMenus || crud.selections[0].childMenus.length <= 1" @click="toSort(crud.selections)">排序</el-button>
+          </template>
+        </crudOperation>
+      </div>
+      <!--表格渲染-->
+      <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="min-width: 100%;" height="calc(100vh - 302px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column type="index" label="序号" width="55" align="center" />
+        <el-table-column prop="fieldCnName" label="显示字段" align="center" />
+        <el-table-column prop="fieldCnName" label="排序" align="center" />
+      </el-table>
+      <!--表单渲染-->
+      <eForm />
+    </div>
+  </div>
+</template>
+
+<script>
+import { add, edit } from '@/api/archivesConfig/field'
+import eForm from './module/form'
+import CRUD, { presenter } from '@crud/crud'
+import crudOperation from '@crud/CRUD.operation'
+
+export default {
+  components: { eForm, crudOperation },
+  mixins: [presenter()],
+  cruds() {
+    return CRUD({
+      url: 'api/field/findGroupType',
+      crudMethod: { add, edit },
+      optShow: {
+        add: false,
+        edit: true,
+        del: true,
+        download: false,
+        group: false
+      },
+      queryOnPresenterCreated: false
+    })
+  },
+  data() {
+    return {
+      permission: {
+        add: ['admin', this.permissionStr + ':add'],
+        edit: ['admin', this.permissionStr + ':edit']
+      },
+      verifyDialogVisible: false,
+      form: {
+        verifyCode: ''
+      },
+      formLabelWidth: '110px',
+      btn: '',
+      showVerifyDialog: true
+    }
+  },
+  created() {
+    // this.crud.title = this.title
+    // this.crud.query = {
+    //   isType: this.isType
+    // }
+    // this.crud.toQuery()
+  },
+  methods: {
+    // [CRUD.HOOK.beforeToCU](crud, form, btn) {
+    //   if (this.showVerifyDialog) {
+    //     // 打开输入验证码对话框
+    //     this.verifyDialogVisible = true
+    //     this.btn = btn
+    //     return false
+    //   }
+    // },
+    // [CRUD.HOOK.beforeToEdit](crud, form, btn) {
+    //   if (form.isColumnLength === null) {
+    //     form.isColumnLength = undefined
+    //   }
+    // },
+    handleConfirm() {
+      // verifyMaintenance(encrypt(this.form.verifyCode)).then((res) => {
+      //   if (res) {
+      //     // 关闭输入验证码对话框
+      //     this.verifyDialogVisible = false
+      //     this.form.verifyCode = ''
+      //     this.showVerifyDialog = false
+      //     if (this.btn === 'add') {
+      //       this.crud.toAdd()
+      //     } else if (this.btn === 'edit') {
+      //       this.crud.toEdit(this.crud.selections[0])
+      //     }
+      //     this.showVerifyDialog = true
+      //   } else {
+      //     this.$message.error('验证码错误！')
+      //   }
+      // })
+    },
+    handleClose(done) {
+      this.form.verifyCode = ''
+      done()
+    },
+    clickRowHandler(row) {
+      this.$refs.table.clearSelection()
+      this.$refs.table.toggleRowSelection(row)
+    },
+    selectionChangeHandler(val) {
+      if (val.length > 1) {
+        // 取出最后val的最后一个返回出来
+        const finalVal = val.pop()
+        // 清除所有选中
+        this.$refs.table.clearSelection()
+        // 给最后一个加上选中
+        this.$refs.table.toggleRowSelection(finalVal)
+        this.crud.selectionChangeHandler([finalVal])
+      } else {
+        this.crud.selectionChangeHandler(val)
+      }
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+::v-deep thead .el-table-column--selection .cell {
+  display: none;
+}
+::v-deep div.el-dialog__footer {
+  text-align: center;
+}
+.format-main {
+  display: flex;
+  justify-content: flex-start;
+  .format-main-left,
+  .format-main-right {
+    height: calc(100vh - 231px);
+  }
+  .format-main-left {
+    padding-right: 10px;
+  }
+  .format-main-right {
+    flex-grow: 1;
+  }
+}
+</style>
diff --git a/src/views/category/orderingRule/module/form.vue b/src/views/category/orderingRule/module/form.vue
new file mode 100644
index 0000000..f2d6b14
--- /dev/null
+++ b/src/views/category/orderingRule/module/form.vue
@@ -0,0 +1,107 @@
+<template>
+  <el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title">
+    <span class="dialog-right-top" />
+    <span class="dialog-left-bottom" />
+    <div class="setting-dialog">
+      <el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
+        <el-form-item label="中文名称" prop="fieldCnName">
+          <el-input v-model="form.fieldCnName" style="width: 370px;" />
+        </el-form-item>
+        <el-form-item label="字段标识" prop="fieldName">
+          <el-input v-model="form.fieldName" style="width: 370px;" />
+        </el-form-item>
+        <el-form-item label="数据类型" prop="isDataType">
+          <el-select v-model="form.isDataType" placeholder="请选择">
+            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="字段长度" prop="isColumnLength">
+          <el-input-number v-model="form.isColumnLength" controls-position="right" style="width: 370px;" />
+        </el-form-item>
+        <el-form-item label="默认值" prop="isDefaultValue">
+          <el-input v-model="form.isDefaultValue" style="width: 370px;" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="text" @click="crud.cancelCU">
+          取消
+        </el-button>
+        <el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">
+          确认
+        </el-button>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { form } from '@crud/crud'
+
+const defaultForm = {
+  id: null,
+  fieldCnName: '',
+  fieldName: '',
+  isDataType: 1,
+  isColumnLength: 100,
+  isDefaultValue: ''
+}
+export default {
+  mixins: [form(defaultForm)],
+  data() {
+    var checkMaxLength = (rule, value, callback) => {
+      if (value !== undefined && (!Number.isInteger(value) || value <= 0)) {
+        callback(new Error('请输入正整数数字值'))
+      } else {
+        if (this.form.isDataType === 1 && value > 2000) {
+          callback(new Error('字符最大长度不能超过2000位'))
+        } else if (this.form.isDataType === 2 && value > 11) {
+          callback(new Error('数字最大长度不能超过11位'))
+        } else {
+          callback()
+        }
+      }
+    }
+    var checkFieldName = (rule, value, callback) => {
+      const reg = /^[A-Za-z][A-Za-z_]+[a-zA-Z]*$/
+      if (reg.test(value)) {
+        callback()
+      } else {
+        callback(new Error('字段标识只能由字母、字符“_”组成，并且必须以字母开头和结尾'))
+      }
+    }
+    return {
+      rules: {
+        fieldCnName: [
+          { required: true, message: '请输入中文名称', trigger: 'blur' }
+        ],
+        fieldName: [
+          { required: true, message: '请选择字段标识', trigger: 'blur' },
+          { validator: checkFieldName, trigger: 'blur' }
+        ],
+        isDataType: [
+          { required: true, message: '请选择数据类型', trigger: 'blur' }
+        ],
+        isColumnLength: [
+          { validator: checkMaxLength, trigger: 'blur' }
+        ]
+      },
+      options: [
+        {
+          value: 1,
+          label: '字符'
+        },
+        {
+          value: 2,
+          label: '数字'
+        }
+      ]
+    }
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+::v-deep .el-input-number .el-input__inner {
+  text-align: left;
+}
+</style>