【新增】增加字典接口 增加字段校验

src/api/modules/dictionary.js

@@ -1,6 +1,7 @@
 import { instance as request } from '@/utils/request'
 
 export default {
+  //外层
   addDic (data) {
     return request({
       url: '/api/sys/dict/add',
@@ -29,4 +30,33 @@ export default {
       params:data
     })
   },
+  //内层
+  addItemDic (data) {
+    return request({
+      url: '/api/sys/dictItem/add',
+      method: 'post',
+      data
+    })
+  },
+  editItemDic (data) {
+    return request({
+      url: '/api/sys/dictItem/edit',
+      method: 'put',
+      data
+    })
+  },
+  getItemDic (data) {
+    return request({
+      url: '/api/sys/dictItem/page',
+      method: 'get',
+      params:data
+    })
+  },
+  delItemDic (data) {
+    return request({
+      url: '/api/sys/dictItem/delete',
+      method: 'delete',
+      params:data
+    })
+  },
 }

src/views/System/dataDictionary.vue

@@ -60,8 +60,8 @@
     <el-dialog :title="dialogTitle" :visible.sync="dialogUser" width="750px" :close-on-click-modal="false"
                :close-on-press-escape="false" modal-append-to-body append-to-body>
       <div class="user-form">
-        <el-form :model="form" label-width="186px" :disabled="mode === 'view'">
+        <el-form ref="dicRef" :rules="formRule" :model="form" label-width="186px" :disabled="mode === 'view'">
-          <el-form-item label="数据字典编码:" required>
+          <el-form-item label="数据字典编码:" prop="dicCode">
             <el-input v-model="form.dicCode" :disabled="mode === 'view' || mode === 'modify' "  maxlength="20" show-word-limit placeholder="请输入数据字典编码"></el-input>
           </el-form-item>
           <!--<el-form-item label="密码:" :required="mode === 'add'" v-if="mode !== 'view'">-->
@@ -70,12 +70,12 @@
           <!--<el-form-item label="确认密码:" :required="mode === 'add'" v-if="mode !== 'view'">-->
           <!--<el-input v-model="repassword" maxlength="20" type="password" placeholder="请确认密码"></el-input>-->
           <!--</el-form-item>-->
-          <el-form-item label="数据字典名称:">
+          <el-form-item label="数据字典名称:" prop="dicName">
-            <el-input v-model="form.dicName" placeholder="请输入数据字典名称"></el-input>
+            <el-input v-model="form.dicName" placeholder="请输入数据字典名称"  maxlength="20" show-word-limit></el-input>
           </el-form-item>
 
-          <el-form-item label="描述:" required>
+          <el-form-item label="描述:" >
-            <el-input v-model="form.description" maxlength="20" show-word-limit placeholder="请输入描述"></el-input>
+            <el-input type="textarea" v-model="form.description" maxlength="500" show-word-limit placeholder="请输入描述"></el-input>
           </el-form-item>
         </el-form>
         <div class="done">
@@ -107,6 +107,23 @@ export default {
         dicName:'',
         description:''
       },
+      formRule:{
+        dicCode:[
+          {
+            required:true,
+            message:'数据字典编码不能为空',
+            trigger:'change'
+          }
+        ],
+        dicName:[
+          {
+            required:true,
+            message:'数据字典名称不能为空',
+            trigger:'change'
+          }
+        ],
+
+      },
       repassword: '',
       roleList: []
     }
@@ -148,6 +165,7 @@ export default {
     },
     // 新增
     add () {
+
       this.mode = 'add'
       this.form = {
         dicCode:'',
@@ -156,6 +174,10 @@ export default {
       }
       this.repassword = ''
       this.dialogUser = true
+      this.$nextTick(()=>{
+        this.$refs.dicRef.clearValidate()
+
+      })
     },
     // // 启用/禁用
     // sysUserIsUse (val, row) {
@@ -174,23 +196,30 @@ export default {
     // },
     // 删除
     deleteRow (row) {
-      this.deleteUser([row.id])
+      this.deleteUser(row.id)
     },
     // 新增用户
     sysUserAddUser () {
-      if(this.mode=='add'){
+      this.$refs.dicRef.validate(v=>{
-        this.$api.dictionary.addDic(this.form).then((res)=>{
+        if(v){
-          this.$message.success("新增成功")
+          if(this.mode=='add'){
-          this.sysUserList()
+            this.$api.dictionary.addDic(this.form).then((res)=>{
-        })
+              this.$message.success("新增成功")
-      }else{
+              this.sysUserList()
-        this.$api.dictionary.editDic(this.form).then((res)=>{
+            })
-          this.$message.success("编辑成功")
+          }else{
-          this.sysUserList()
+            this.$api.dictionary.editDic(this.form).then((res)=>{
-        })
+              this.$message.success("编辑成功")
-      }
+              this.sysUserList()
+            })
+          }
+
+          this.dialogUser = false
+        }else{
+          this.$message.warning("请检查表单")
+        }
+      })
 
-      this.dialogUser = false
     },
     // 编辑查看用户
     openRowData (mode, row) {
@@ -200,7 +229,8 @@ export default {
           path:'/system/dicdeatil',
           query:{
             id:this.$route.query.id,
-            pId:row.id
+            pId:row.id,
+            pName: row.dicName
           }
         })
       }else if(mode=='add'){
@@ -224,7 +254,7 @@ export default {
       if (!users.length) {
         return this.$message.warning('请选择数据后在进行操作')
       }
-      const ids = users.map(item => item.id)
+      const ids = users.map(item => item.id).join(',')
       this.deleteUser(ids)
     },
     // 删除用户
@@ -347,7 +377,7 @@ export default {
     padding-right: 79px;
 
     .el-form-item {
-      margin-bottom: 10px;
+      //margin-bottom: 10px;
 
       .el-form-item__label {
         height: 36px;

src/views/System/dictionaryDetail.vue

@@ -5,15 +5,15 @@
        <span  class="back" title="返回" @click="back"><i class="el-icon-back" ></i>
           </span>
       <div class="title">
-        {{dictionaryName}}
+        {{dicName}}
-        ddfdddd</div>
+     </div>
     </div>
     <div class="search">
       <el-row>
         <el-col :span="20">
           <div class="search-box-left">
             <label>选项:</label>
-            <el-input v-model="q.account" placeholder="请输入选项"></el-input>
+            <el-input v-model="q.itemName" placeholder="请输入选项"></el-input>
           </div>
         </el-col>
         <el-col :span="4" align="right">
@@ -39,9 +39,11 @@
             {{ rowIndex + (q.pageNo - 1) * q.pageSize + 1 }}
           </template>
         </vxe-column>
-        <vxe-column show-overflow show-header-overflow field="ACCOUNT" title="选项"></vxe-column>
+        <vxe-column show-overflow show-header-overflow field="itemName" title="选项"></vxe-column>
-        <vxe-column show-overflow show-header-overflow field="CELLPHONE_NUMBER" title="值"></vxe-column>
+        <vxe-column show-overflow show-header-overflow field="itemValue" title="选项值"></vxe-column>
-        <vxe-column show-overflow show-header-overflow field="CREATEDATE" title="排序"></vxe-column>
+        <vxe-column show-overflow show-header-overflow field="itemOrder" title="排序"></vxe-column>
+        <vxe-column show-overflow show-header-overflow field="itemDescription" title="描述"></vxe-column>
+
         <!--                <vxe-column show-overflow show-header-overflow title="启用/禁用" width="100" fixed="right">-->
         <!--                    <template #default="{ row }">-->
         <!--                        <el-switch v-model="row.ISUSE" active-value="1" inactive-value="0"-->
@@ -69,21 +71,22 @@
     <el-dialog :title="dialogTitle " :visible.sync="dialogUser" width="750px" :close-on-click-modal="false"
                :close-on-press-escape="false" modal-append-to-body append-to-body>
       <div class="user-form">
-        <el-form :model="form" label-width="186px" :disabled="mode === 'view'">
+        <el-form ref="addForm" :model="form" label-width="186px" :disabled="mode === 'view'"
-          <el-form-item label="选项:" props="account">
+        :rules="formRule">
-            <el-input v-model="form.account" maxlength="20" show-word-limit placeholder="请输入选项"></el-input>
+          <el-form-item label="选项:" prop="itemName">
+            <el-input v-model="form.itemName" maxlength="20" show-word-limit placeholder="请输入选项"></el-input>
+          </el-form-item>
+          <el-form-item label="选项值:" prop="itemValue" >
+          <el-input v-model="form.itemValue" maxlength="20"  placeholder="请输入值" show-word-limit></el-input>
           </el-form-item>
-          <!--<el-form-item label="密码:" :required="mode === 'add'" v-if="mode !== 'view'">-->
-          <!--<el-input v-model="form.password" maxlength="20" type="password" placeholder="请输入密码"></el-input>-->
-          <!--</el-form-item>-->
           <!--<el-form-item label="确认密码:" :required="mode === 'add'" v-if="mode !== 'view'">-->
           <!--<el-input v-model="repassword" maxlength="20" type="password" placeholder="请确认密码"></el-input>-->
           <!--</el-form-item>-->
-          <el-form-item label="排序:">
+          <el-form-item label="排序:" prop="itemOrder">
-            <el-input v-model="form.cellPhoneNumber" placeholder="请输入排序"></el-input>
+            <el-input v-model="form.itemOrder"show-word-limit maxlength="10" placeholder="请输入排序"></el-input>
           </el-form-item>
-          <el-form-item label="备注:">
+          <el-form-item label="备注:" prop="itemDescription">
-            <el-input v-model="form.department" maxlength="50" show-word-limit placeholder="请输入备注"></el-input>
+            <el-input type="textarea" v-model="form.itemDescription" maxlength="500" show-word-limit placeholder="请输入备注"></el-input>
           </el-form-item>
         </el-form>
         <div class="done">
@@ -99,55 +102,105 @@
 export default {
   name: 'standLawsAttrDetails',
   data(){
+    const validateData= (rule, value, callback) =>{
+      let test=/^[0-9]*$/
+      if (!test.test(value)) {
+        callback(new Error('请输入数字值'));
+      }else{
+        callback()
+      }
+    }
     return{
       form:{
-
+        itemName:'',
+        itemValue:'',
+        itemDescription:'',
+        itemOrder:''
       },
       total:0,
       q:{
         pageNo:1,
         pageSize:10,
-        account:''
+        itemName:''
       },
       tableData:[{inde:1}],
       mode:'',
-      dialogUser:false
+      dialogUser:false,
+      dicId:'',
+      dicName:'',
+      formRule:{
+        itemName:[{
+          required:true,
+          message:'选项不能为空',
+          trigger:'change'
+        }],
+        itemValue:[{
+          required:true,
+          message:'选项值不能为空',
+          trigger:'change'
+        }],
+        itemOrder:[{
+          required:true,
+          message:'排序不能为空',
+          trigger:'change'
+        },{
+          validator:validateData, trigger:'change'
 
+        }],
+      }
     }
   },
+  mounted() {
+      this.dicName=this.$route.query.pName
+      this.dicId=this.$route.query.pId
+    this.loadData()
+  },
   methods:{
     // 编辑查看用户
     openRowData (mode, row) {
       this.mode = mode
-      this.form = {
+      this.form=JSON.parse(JSON.stringify(row))
-        account: row.ACCOUNT, // 用户名
-        cellPhoneNumber: row.CELLPHONE_NUMBER, // 手机号
-        department: row.DEPARTMENT, // 部门
-        email: row.EMAIL, // 邮箱
-        password: '', // 密码
-        usid: row.USID, // 用户ID
-        usname: row.USNAME, // 姓名
-        roleIdList: [row.ROLEID] // 角色
-      }
       this.dialogUser = true
     },
     sysUserAddUser(){
+      this.$refs.addForm.validate(v=>{
+        if(v){
+          if(this.mode=='add'){
+            this.$api.dictionary.addItemDic(this.form).then((res)=>{
+              this.$message.success("新增成功")
+              this.loadData()
+            })
+          }else{
+            this.$api.dictionary.editItemDic(this.form).then((res)=>{
+              this.$message.success("编辑成功")
+              this.loadData()
+            })
+          }
+
+          this.dialogUser = false
+        }else{
+          this.$message.warning("请检查表单")
+        }
+      })
+
+
 
     },
     // 新增
     add () {
       this.mode = 'add'
       this.form = {
-        account: '', // 用户名
+        itemName:'',
-        cellPhoneNumber: '', // 手机号
+        itemValue:'',
-        department: '', // 部门
+        itemDescription:'',
-        email: '', // 邮箱
+        itemOrder:'',
-        password: '', // 密码
+        dicId:this.dicId
-        usid: '',
-        usname: '', // 姓名
-        roleIdList: [''] // 角色
       }
       this.dialogUser = true
+      this.$nextTick(()=>{
+        this.$refs.addForm.clearValidate()
+
+      })
     },
     // 批量删除
     getSelectUser () {
@@ -169,9 +222,9 @@ export default {
         cancelButtonText: '取消',
         type: 'warning'
       }).then(() => {
-        this.$api.user.sysUserDelete({ ids }).then(_ => {
+        this.$api.dictionary.delItemDic({ ids }).then(_ => {
           this.$message.success('操作成功')
-          this.sysUserList()
+          this.loadData()
         })
       })
     },
@@ -184,7 +237,10 @@ export default {
       this.loadData()
     },
     loadData(){
-
+      this.$api.dictionary.getItemDic({...this.q,dicId:this.dicId}).then((res)=>{
+        this.tableData = res.data.records
+        this.total=res.data.total
+      })
     },
     search() {
       this.q.pageNo = 1
@@ -194,7 +250,8 @@ export default {
       this.q = {
         pageNo:1,
         pageSize:10,
-        account:''
+        itemName:'',
+        dicId: this.dicId
       }
       this.loadData()
     },
@@ -312,7 +369,7 @@ export default {
     padding-right: 79px;
 
     .el-form-item {
-      margin-bottom: 10px;
+      //margin-bottom: 10px;
 
       .el-form-item__label {
         height: 36px;