常用字段管理

src/api/archivesConfig/field.js

@@ -0,0 +1,26 @@
+import request from '@/utils/request'
+
+export function getDicts() {
+  return request({
+    url: 'api/dict/all',
+    method: 'get'
+  })
+}
+
+export function add(data) {
+  return request({
+    url: 'api/field/edit',
+    method: 'post',
+    data
+  })
+}
+
+export function edit(data) {
+  return request({
+    url: 'api/field/edit',
+    method: 'post',
+    data
+  })
+}
+
+export default { add, edit }

src/views/archivesConfig/commonFields/index.vue

@@ -6,12 +6,19 @@
       说明
     </div>
     <!--表格渲染-->
-    <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
+    <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
       <el-table-column type="selection" width="55" />
       <el-table-column type="index" label="序号" />
-      <el-table-column prop="name" label="中文名称" />
-      <el-table-column prop="name" label="字段标识" />
-      <el-table-column prop="sort" label="数据类型" />
+      <el-table-column prop="field_cn_name" label="中文名称" />
+      <el-table-column prop="field_name" label="字段标识" />
+      <el-table-column label="数据类型">
+        <template slot-scope="scope">
+          <span v-if="scope.row.is_data_type === 1">字符</span>
+          <span v-if="scope.row.is_data_type === 2">数字</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="is_column_length" label="字段长度" />
+      <el-table-column prop="is_default_value" label="默认值" />
     </el-table>
     <!--表单渲染-->
     <eForm />
@@ -19,7 +26,7 @@
 </template>
 
 <script>
-import crudCommonFields from '@/api/system/job'
+import crudFields from '@/api/archivesConfig/field'
 import eForm from './module/form'
 import CRUD, { presenter } from '@crud/crud'
 import crudOperation from '@crud/CRUD.operation'
@@ -30,14 +37,17 @@ export default {
   cruds() {
     return CRUD({
       title: '常用字段',
-      url: 'api/commonFields',
-      crudMethod: { ...crudCommonFields },
+      url: 'api/field/findGroupType',
+      crudMethod: { ...crudFields },
       optShow: {
         add: true,
         edit: true,
         del: false,
         download: false,
         group: false
+      },
+      query: {
+        is_type: 2
       }
     })
   },
@@ -49,9 +59,32 @@ export default {
         edit: ['admin', 'commonFields:edit']
       }
     }
+  },
+  methods: {
+    clickRowHandler(row) {
+      this.$refs.table.clearSelection()
+      this.$refs.table.toggleRowSelection(row)
+    },
+    selectionChangeHandler(val) {
+      let finalVal
+      if (val.length > 1) {
+        // 取出最后val的最后一个返回出来
+        finalVal = val.pop()
+        // 清除所有选中
+        this.$refs.table.clearSelection()
+        // 给最后一个加上选中
+        this.$refs.table.toggleRowSelection(finalVal)
+      } else {
+        finalVal = val
+      }
+      this.crud.selectionChangeHandler(finalVal)
+    }
   }
 }
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
+::v-deep thead .el-table-column--selection .cell {
+  display: none;
+}
 </style>

src/views/archivesConfig/commonFields/module/form.vue

@@ -1,65 +1,29 @@
 <template>
-  <el-dialog
-    :close-on-click-modal="false"
-    :before-close="crud.cancelCU"
-    :visible="crud.status.cu > 0"
-    :title="crud.status.title"
-    width="500px"
-  >
-    <el-form
-      ref="form"
-      :model="form"
-      :rules="rules"
-      size="small"
-      label-width="80px"
-    >
-      <el-form-item
-        label="中文名称"
-        prop="name"
-      >
-        <el-input
-          v-model="form.name"
-          style="width: 370px;"
-        />
+  <el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title" width="500px">
+    <el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
+      <el-form-item label="中文名称" prop="field_cn_name">
+        <el-input v-model="form.field_cn_name" style="width: 370px;" />
       </el-form-item>
-      <el-form-item
-        label="字段标识"
-        prop="name"
-      >
-        <el-input
-          v-model="form.name"
-          style="width: 370px;"
-        />
+      <el-form-item label="字段标识" prop="field_name">
+        <el-input v-model="form.field_name" style="width: 370px;" />
       </el-form-item>
-      <el-form-item
-        label="数据类型"
-        prop="name"
-      >
-        <el-select v-model="value" placeholder="请选择">
-          <el-option
-            v-for="item in options"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
+      <el-form-item label="数据类型" prop="is_data_type">
+        <el-select v-model="form.is_data_type" 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="is_column_length">
+        <el-input-number v-model="form.is_column_length" controls-position="right" style="width: 370px;" />
+      </el-form-item>
+      <el-form-item label="默认值" prop="is_default_value">
+        <el-input v-model="form.is_default_value" style="width: 370px;" />
+      </el-form-item>
     </el-form>
-    <div
-      slot="footer"
-      class="dialog-footer"
-    >
-      <el-button
-        type="text"
-        @click="crud.cancelCU"
-      >
+    <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 :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">
         确认
       </el-button>
     </div>
@@ -71,30 +35,53 @@ import { form } from '@crud/crud'
 
 const defaultForm = {
   id: null,
-  name: '',
-  jobSort: 999,
-  enabled: true
+  field_cn_name: '',
+  field_name: '',
+  is_data_type: 1,
+  is_column_length: 100,
+  is_default_value: ''
 }
 export default {
   mixins: [form(defaultForm)],
   data() {
+    var checkMaxLength = (rule, value, callback) => {
+      if (!Number.isInteger(value) || value <= 0) {
+        callback(new Error('请输入正整数数字值'))
+      } else {
+        if (this.form.is_data_type === 1 && value > 2000) {
+          callback(new Error('字符最大长度不能超过2000位'))
+        } else if (this.form.is_data_type === 2 && value > 11) {
+          callback(new Error('数字最大长度不能超过11位'))
+        } else {
+          callback()
+        }
+      }
+    }
     return {
       rules: {
-        name: [
-          { required: true, message: '请输入名称', trigger: 'blur' }
+        field_cn_name: [
+          { required: true, message: '请输入中文名称', trigger: 'blur' }
         ],
-        jobSort: [
-          { required: true, message: '请输入序号', trigger: 'blur', type: 'number' }
+        field_name: [
+          { required: true, message: '请输入字段标识', trigger: 'blur' }
+        ],
+        is_data_type: [
+          { required: true, message: '请选择数据类型', trigger: 'blur' }
+        ],
+        is_column_length: [
+          { validator: checkMaxLength, trigger: 'blur' }
         ]
       },
       options: [
         {
-          value: 'varchar',
-          label: '字符串'
+          value: 1,
+          label: '字符',
+          maxlength: 2000
         },
         {
-          value: 'number',
-          label: '数字'
+          value: 2,
+          label: '数字',
+          maxlength: 11
         }
       ]
     }
@@ -103,7 +90,7 @@ export default {
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
- ::v-deep .el-input-number .el-input__inner {
-    text-align: left;
-  }
+::v-deep .el-input-number .el-input__inner {
+  text-align: left;
+}
 </style>