From 457f9c817adef8b003ee6379f493798bae5cbb69 Mon Sep 17 00:00:00 2001 From: zhouwx <1175765986@qq.com> Date: 星期一, 19 五月 2025 09:31:19 +0800 Subject: [PATCH] 修改 --- src/views/Admin/components/userMod.vue | 261 +++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 207 insertions(+), 54 deletions(-) diff --git a/src/views/Admin/components/userMod.vue b/src/views/Admin/components/userMod.vue index e1cb1a1..554fdda 100644 --- a/src/views/Admin/components/userMod.vue +++ b/src/views/Admin/components/userMod.vue @@ -2,6 +2,7 @@ <a-modal :title="title" :visible="visible" + centered :confirm-loading="confirmLoading" width="50%" cancelText="取消" @@ -11,36 +12,36 @@ :afterClose="clearMod" > <a-form-model ref="ruleForm" :rules="rules" :model="form" :label-col="labelCol" :wrapper-col="wrapperCol" :colon="false"> - <a-form-model-item label="姓名" prop="name"> - <a-input v-model="form.name"/> + <a-form-model-item label="姓名" prop="realName"> + <a-input v-model.trim="form.realName"/> </a-form-model-item> <a-form-model-item label="手机号码" prop="phone"> - <a-input v-model="form.phone"/> + <a-input v-model.trim="form.phone"/> </a-form-model-item> - <a-form-model-item label="用户名" prop="userName"> - <a-input v-model="form.userName"/> + <a-form-model-item label="用户名" prop="name"> + <a-input v-model.trim="form.name"/> </a-form-model-item> - <a-form-model-item label="密码" v-if="title== '新增用户'" prop="password"> - <a-input v-model="form.password"/> + <a-form-model-item label="密码" v-if="title== '新增用户'" prop="pwd"> + <a-input v-model="form.pwd"/> </a-form-model-item> - <a-form-model-item label="重复密码" v-if="title== '新增用户'" prop="rePassword"> - <a-input v-model="form.rePassword"/> + <a-form-model-item label="重复密码" v-if="title== '新增用户'" prop="dupPwd"> + <a-input v-model="form.dupPwd"/> </a-form-model-item> <a-form-model-item label="性别" prop="sex"> - <a-radio-group v-model="form.sex" :default-value="0" button-style="solid"> - <a-radio-button :value="0">男</a-radio-button> - <a-radio-button :value="1">女</a-radio-button> + <a-radio-group v-model="form.sex" :default-value="1" button-style="solid"> + <a-radio-button :value="1">男</a-radio-button> + <a-radio-button :value="0">女</a-radio-button> </a-radio-group> </a-form-model-item> - <a-form-model-item label="选择级别" prop="level"> - <a-select v-model="form.level" placeholder="监管级别"> - <a-select-option :value="1"> + <a-form-model-item label="单位层级" prop="unittype"> + <a-select v-model="form.unittype" placeholder="单位层级" @change="changeLevel"> + <a-select-option :disabled="unittype !== 1&&unittype !== null" :value="1"> 省级 </a-select-option> - <a-select-option :value="2"> + <a-select-option :disabled="unittype !== 1&&unittype !== null && unittype !== 2" :value="2"> 地(市、州)级 </a-select-option> - <a-select-option :value="3"> + <a-select-option :disabled="unittype == 4 ? true : false" :value="3"> 区县级 </a-select-option> <a-select-option :value="4"> @@ -48,27 +49,32 @@ </a-select-option> </a-select> </a-form-model-item> - <a-form-model-item label="所属地区" prop="area"> -<!-- <a-cascader v-model="form.area" :options="areaData" expandTrigger="hover" changeOnSelect placeholder="请选择" @change="onChange"/>--> + <a-form-model-item label="所属地区" prop="districtId"> + <!-- <a-cascader v-model="form.area" :options="areaData" expandTrigger="hover" changeOnSelect placeholder="请选择" @change="onChange"/>--> <a-tree-select - v-model="form.area" + v-model="form.districtId" style="width: 100%" :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }" :tree-data="areaData" placeholder="行政区划" + :replaceFields="replaceFields" + @change="changeArea" > </a-tree-select> </a-form-model-item> <a-form-model-item label="所属单位"> - <a-input v-model="unitName"/> + <a-input v-model="form.company"/> </a-form-model-item> - <a-form-model-item label="角色" prop="role"> - <a-select v-model="form.role" placeholder="角色"> - <a-select-option :value="1"> + <a-form-model-item label="角色" prop="roleId"> + <a-select v-model="form.roleId" placeholder="角色"> + <a-select-option :value="2"> + 审批领导 + </a-select-option> + <a-select-option :value="4"> 领导 </a-select-option> - <a-select-option :value="2"> - 公司人员 + <a-select-option :value="3"> + 工作人员 </a-select-option> </a-select> </a-form-model-item> @@ -77,39 +83,80 @@ </template> <script> -import { addUser } from '@/api/user' +import {addUser, updateUser} from '@/api/user' +import {verifyPasswordPowerful, verifyPhone, verifySimplePhone} from "@/util/validate"; export default { name: 'userMod', + props: ['unitType'], data () { + let validatePwd = (rule, value, callback)=>{ + if(value === ''){ + callback(new Error('请输入密码')) + }else{ + if(!verifyPasswordPowerful(value)){ + callback(new Error('密码须包含字母、数字、特殊字符(不包括下划线),长度在6-16之间')) + }else{ + callback() + } + } + } + let validatePhone = (rule, value, callback)=>{ + if(value === ''){ + callback(new Error('请输入手机号')) + }else{ + if(!verifySimplePhone(value)){ + callback(new Error('手机号格式有误')) + }else{ + callback() + } + } + } + let validatePwd2 = (rule, value, callback)=>{ + if(value === ''){ + callback(new Error('请再次输入密码')) + }else if(value !== this.form.pwd){ + callback(new Error('两次输入密码不同')) + }else{ + callback() + } + } return { title: '新增用户', visible: false, + unittype: this.unitType, confirmLoading: false, labelCol: { span: 4 }, wrapperCol: { span: 14 }, areaData: [], - unitName: '', + replaceFields: { + children:'children', + title:'name', + key:'id', + value: 'id' + }, form: { - name: '', + id: null, + realName: '', phone: '', - userName: '', - password: '', - rePassword: '', + name: '', + pwd: '', + dupPwd: '', sex: null, - level: null, - area: null, - role: null + unittype: null, + districtId: null, + roleId: null, + company: '' }, rules: { - name: [{ required: true, message: '请输入姓名', trigger: 'blur'}], - phone: [{ required: true, message: '请输入手机号', trigger: 'blur'}], - userName: [{ required: true, message: '请输入用户名', trigger: 'blur'}], - password: [{ required: true, message: '请输入密码', trigger: 'blur'}], - rePassword: [{ required: true, message: '请再次输入密码', trigger: 'blur'}], + realName: [{ required: true, message: '请输入姓名', trigger: 'blur'}], + phone: [{ required: true, validator: validatePhone, trigger: 'blur'}], + name: [{ required: true, message: '请输入用户名', trigger: 'blur'}], + pwd: [{ required: true, message: '请输入密码', trigger: 'blur'}], + dupPwd: [{ required: true, validator: validatePwd2, trigger: 'blur'}], sex: [{ required: true, message: '请选择性别', trigger: 'change'}], - level: [{ required: true, message: '请选择监管级别', trigger: 'change'}], - area: [{ required: true, message: '请选择行政区划', trigger: 'change'}], - role: [{ required: true, message: '请选择角色', trigger: 'change'}] + unittype: [{ required: true, message: '请选择单位层级', trigger: 'change'}], + districtId: [{ required: true, message: '请选择行政区划', trigger: 'change'}], + roleId: [{ required: true, message: '请选择角色', trigger: 'change'}] } } }, @@ -122,32 +169,138 @@ if(type == 'add'){ t.title = '新增用户' t.form = { - name: '', + id: null, + realName: '', phone: '', - userName: '', - password: '', - rePassword: '', - sex: undefined, - level: undefined, - area: undefined, - role: undefined + name: '', + pwd: '', + dupPwd: '', + sex: null, + unittype: null, + districtId: null, + roleId: null, + company: '' } }else{ t.title = '编辑用户' - t.form = data + data.roleId = data.role.roleId + for(let i in data){ + if(t.isValidKey(i,t.form)){ + t.form[i] = data[i] + } + } } t.visible = true + }, + isValidKey(key, object){ + return key in object; + }, + + + // 根据id查对象 + findNodeById(data,value) { + for (const node of data) { + if (node.id === value) { + return node; + } + if (node.children) { + const foundNode = this.findNodeById(node.children, value); + if (foundNode) { + return foundNode; + } + } + } + return null; + }, + + // 根据code查对象 + findNodeByCode(data,code) { + for (const node of data) { + if (node.code === code) { + return node; + } + if (node.children) { + const foundNode = this.findNodeByCode(node.children,code); + if (foundNode) { + return foundNode; + } + } + } + return null; + }, + + changeLevel(value, option){ + console.log(value) + }, + + changeArea(value, label, extra){ + const t = this + t.form.districtId = value + const code = t.findNodeById(t.areaData,value).code + if(code.length == 2){ + t.form.company = '自治区自然灾害预警中心' + // t.form.province = t.findNodeByCode(t.areaData,code).name + // t.form.city = '' + // t.form.area = '' + // t.form.town = '' + } else if(code.length == 9){ + // t.form.province = t.findNodeByCode(t.areaData,code.substr(0,2)).name + // t.form.city = t.findNodeByCode(t.areaData,code.substr(0,4)).name + // t.form.area = t.findNodeByCode(t.areaData,code.substr(0,6)).name + // t.form.town = t.findNodeByCode(t.areaData,code).name + t.form.company = label[0] + } else{ + // if(code.length == 4){ + // t.form.city = t.findNodeByCode(t.areaData,code).name + // t.form.area = '' + // } + // if(code.length == 6){ + // t.form.city = t.findNodeByCode(t.areaData,code.substr(0,4)).name + // t.form.area = t.findNodeByCode(t.areaData,code).name + // } + // t.form.province = t.findNodeByCode(t.areaData,code.substr(0,2)).name + // t.form.town = '' + t.form.company = label[0] + '自然灾害综合监测预警中心' + } }, clearMod(){ this.$refs.ruleForm.clearValidate() + this.$refs.ruleForm.resetFields() }, onSubmit() { this.$refs.ruleForm.validate(valid => { if (valid) { - alert('submit!'); - this.visible = false + if(this.form.unittype !== this.findNodeById(this.areaData,this.form.districtId).type){ + this.$message.error('单位层级和所属地区不匹配,请重新选择') + return + } + // this.form.realName = this.form.realName.trim() + // this.form.name = this.form.name.trim() + if(this.title == '新增用户'){ + const { id,...data } = this.form + addUser(data).then((res)=>{ + if(res.data.code == 100){ + this.$message.success('新增用户成功') + this.$emit('refresh') + this.visible = false + }else{ + this.$message.error(res.data.msg) + } + }) + }else{ + const {pwd,dupPwd,...data} = this.form + updateUser(data).then((res)=>{ + if(res.data.code == 100){ + this.$message.success('修改用户成功') + this.$emit('refresh') + this.visible = false + }else{ + this.$message.error(res.data.msg) + } + }) + } } else { console.log('error submit!!'); return false; -- Gitblit v1.9.2