From f96e393e62b4c7496f7ace44b6aa5abb69ae58df Mon Sep 17 00:00:00 2001 From: zhanghua <314079846@qq.com> Date: 星期一, 11 九月 2023 21:54:55 +0800 Subject: [PATCH] bug修改 --- src/views/systemSetting/baseSetting/user/components/updateUser/index.vue | 717 ++++++++++++++++++++++------------------------------------- 1 files changed, 271 insertions(+), 446 deletions(-) diff --git a/src/views/systemSetting/baseSetting/user/components/updateUser/index.vue b/src/views/systemSetting/baseSetting/user/components/updateUser/index.vue index bcad673..601d067 100644 --- a/src/views/systemSetting/baseSetting/user/components/updateUser/index.vue +++ b/src/views/systemSetting/baseSetting/user/components/updateUser/index.vue @@ -1,470 +1,295 @@ <template> - <div class="updateUser"> - <main> - <div class="mainContent"> - <el-form ref="user" label-width="140px" autoComplete="on" :model="user" :rules="createUserRules" - label-position="right"> - <!-- 鐢ㄦ埛鍚嶇О --> - <el-form-item class="optionItem" label="鐢ㄦ埛鍚嶇О:" prop="username"> - <el-input v-model="user.username" placeholder="濉啓鐢ㄦ埛鍚嶇О" :disabled="true"></el-input> - </el-form-item> - <!-- 鐢ㄦ埛瀵嗙爜 --> - <el-form-item class="optionItems" label="鐢ㄦ埛瀵嗙爜:" prop="password"> - <el-input v-model="user.password" type="password" placeholder="璇疯緭鍏ョ敤鎴峰瘑鐮�" disabled> - </el-input> - </el-form-item> - <!-- 鎵�灞炵敤鎴峰鍚� --> - <!-- <el-form-item class="optionItem" label="鎵�灞炵敤鎴峰鍚�:" prop="true_name"> - <el-input v-model="user.true_name" placeholder="璇峰~鍐欑敤鎴峰鍚�"></el-input> - </el-form-item> --> - <!-- 鎬у埆 --> - <el-form-item class="optionItem" label="鎬у埆:" prop="sex"> - <el-radio-group v-model="user.sex" :disabled="!flag.role"> - <el-radio :label="1">鐢�</el-radio> - <el-radio :label="0">濂�</el-radio> - </el-radio-group> - </el-form-item> - <!-- 鏄惁鍏氬憳 --> - <el-form-item class="optionItem" label="鏄惁鍏氬憳:" prop="isDy"> - <el-radio-group v-model="user.isDy" disabled> - <el-radio :label="1">鏄�</el-radio> - <el-radio :label="0">鍚�</el-radio> - </el-radio-group> - </el-form-item> - <!-- 鎵�灞炴墜鏈哄彿鐮� --> - <el-form-item class="optionItem" label="鎵�灞炴墜鏈哄彿鐮�:" prop="mobile"> - <el-input v-model="user.mobile" placeholder="璇峰~鍐欐墜鏈哄彿鐮�" :disabled="true"></el-input> - </el-form-item> - <!-- 閭鍦板潃 --> - <el-form-item class="optionItem" label="閭鍦板潃:" prop="email"> - <el-input v-model="user.email" placeholder="璇峰~鍐欓偖绠卞湴鍧�" :disabled="true"></el-input> - </el-form-item> - <!-- 閫夋嫨瑙掕壊 --> - <el-form-item class="optionItem" label="閫夋嫨瑙掕壊:" prop="role"> - <el-select v-model="user.role" placeholder="璇烽�夋嫨鎵�灞炶鑹�" multiple collapse-tags - @change="handleChangeRole" :disabled="!flag.role"> - <el-option v-for="item in roleList" :key="item.id" :label="item.name" :value="item.id"> - </el-option> - </el-select> - <!-- <el-select v-model="user.role" placeholder="璇烽�夋嫨鎵�灞炶鑹�" :disabled="!flag.role"> - <el-option v-for="item in roleList" :key="item.id" :label="item.name" :value="item.id" - :disabled="item.disabled"> - </el-option> - </el-select> --> - </el-form-item> - <!-- 鐢ㄦ埛绫诲瀷 --> - <el-form-item class="optionItem" label="鐢ㄦ埛绫诲瀷:" prop="userType"> - <el-select v-model="user.userType" placeholder="璇烽�夋嫨鐢ㄦ埛绫诲瀷" disabled> - <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id"> - </el-option> - </el-select> - </el-form-item> - <!-- 搴ф満/鍒嗘満 --> - <!-- <el-form-item class="optionItem" label="搴ф満/鍒嗘満:" prop="zj"> - <div class="optionHandleSp"> - <el-input class="areaNumber" v-model="user.zj.areaNumber" placeholder="鐢佃瘽鍖哄彿"> - </el-input> - <el-input class="telNumber" v-model="user.zj.phoneNumber" placeholder="鐢佃瘽鍙风爜"> - </el-input> - <el-input class="moreNumber" v-model="user.zj.moreNumber" placeholder="鍒嗘満鍙风爜"> - </el-input> - </div> - </el-form-item> --> - <!-- 鎵�灞為儴闂� --> - <el-form-item class="optionItem" label="鎵�灞為儴闂�:" prop="departmentId"> - <el-select v-model="user.departmentId" placeholder="璇烽�夋嫨鎵�灞為儴闂�" :disabled="!flag.depart" - @change="changeDepart"> - <el-option v-for="item in departList" :key="item.id" :label="item.departName" - :value="item.id"> - </el-option> - </el-select> - </el-form-item> - <!-- 褰撳墠鑱屽姟 --> - <el-form-item class="optionItem" label="褰撳墠鑱屽姟:" prop="jobTitle"> - <el-input v-model="user.jobTitle" placeholder="璇疯緭鍏ュ綋鍓嶈亴鍔�" :disabled="true"></el-input> - </el-form-item> - <!-- 濉啓鎵�灞瀖ac鍦板潃 --> - <el-form-item class="optionItem" label="濉啓鎵�灞瀖ac鍦板潃:" prop="mac"> - <el-input v-model="user.mac" placeholder="璇峰~鍐欐墍灞瀖ac鍦板潃" disabled></el-input> - </el-form-item> - <!-- 濉啓鎵�灞瀒p鍦板潃 --> - <el-form-item class="optionItem" label="濉啓鎵�灞瀒p鍦板潃:" prop="ip"> - <el-input v-model="user.ip" placeholder="璇峰~鍐欐墍灞瀒p鍦板潃" disabled></el-input> - </el-form-item> - <el-form-item v-if="updateFlag"> - <div class="optionBtn"> - <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">鎻愪氦 - </el-button> - </div> - </el-form-item> - </el-form> - + <div class="updateUser"> + <main> + <div class="mainContent"> + <el-form + ref="user" + label-width="140px" + autoComplete="on" + :model="user" + :rules="createUserRules" + label-position="right" + > + <!-- 閫夋嫨瑙掕壊 --> + <el-form-item + class="optionItem" + label="閫夋嫨瑙掕壊:" + prop="role" + v-if="flag.role" + > + <el-select + v-model="user.role" + placeholder="璇烽�夋嫨鎵�灞炶鑹�" + multiple + collapse-tags + > + <el-option + v-for="item in roleList" + :key="item.id" + :label="item.name" + :value="item.id" + > + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞為儴闂� --> + <el-form-item + class="optionItem" + label="鎵�灞為儴闂�:" + prop="departmentId" + v-else + > + <departTree + :depart="userDepart" + @selectDepart="selectDepart" + ></departTree> + </el-form-item> + <el-form-item> + <div class="optionBtn"> + <el-button + type="primary" + class="btn submit" + @click.native.prevent="handleUser" + >鎻愪氦 + </el-button> </div> - </main> - </div> + </el-form-item> + </el-form> + </div> + </main> + </div> </template> <script> +import departTree from "@/components/departTree/index.vue"; export default { - data() { - const validateNickname = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰悕绉�")); - } else { - callback(); - } - }; - const validatePass = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�")); - } else { - callback(); - // const rep = /^\w+$/; - // if (!rep.test(value)) { - // callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆")); - // } else { - // callback(); - // } - } - }; - const validateTruename = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欑敤鎴峰鍚�")); - } else { - callback(); - // const rep = /^[\u4E00-\u9FA5]{2,4}$/; - // if (!rep.test(value)) { - // callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕"); - // } else { - // callback(); - // } - } - }; - const validatePhone = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欐墜鏈哄彿鐮�")); - } else { - const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/ - if (!rep.test(value)) { - callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜"); - } else { - callback(); - } - } - }; - const validateMail = (rule, value, callback) => { - if (value) { - const rep = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/; - if (!rep.test(value)) { - callback(new Error("璇疯緭鍏ユ纭殑閭")) - } else { - callback(); - } - } else { - callback(); - } - }; - // const validateRole = (rule, value, callback) => { - // console.log(value); - // if (!value) { - // callback(new Error("璇烽�夋嫨鐢ㄦ埛瑙掕壊")); - // } else { - // callback(); - // } - // }; - const validateType = (rule, value, callback) => { - if (!value && value !== 0) { - callback(new Error("璇烽�夋嫨鐢ㄦ埛绫诲瀷")); - } else { - callback(); - } - }; - const validateDepartment = (rule, value, callback) => { - if (!value && value !== 0) { - callback(new Error("璇烽�夋嫨鎵�灞為儴闂�")); - } else { - callback(); - } - }; - const validateWork = (rule, value, callback) => { - if (!value) { - callback(new Error("璇峰~鍐欏綋鍓嶈亴鍔�")); - } else { - callback(); - } - }; - const validateMac = (rule, value, callback) => { - if (!value) { - callback(); - } else { - callback(); - } - }; - const validateIp = (rule, value, callback) => { - if (!value) { - callback(); - } else { - callback(); - } - }; - return { - user: { - nickName: '', - password: '', - username: '', - sex: 1, - isDy: 1, - mobile: '', - email: '', - // role: null, - userType: null, - zj: { - areaNumber: '', - phoneNumber: "", - moreNumber: "", - }, - // departmentId: null, - // jobTitle: null, - mac: '', - ip: '', - }, - createUserRules: { - nickName: [ - { required: true, trigger: "blur", validator: validateNickname }, - ], - password: [ - { required: true, trigger: "blur", validator: validatePass }, - ], - username: [ - { required: true, trigger: "blur", validator: validateTruename }, - ], - sex: [ - { required: true, trigger: "blur" }, - ], - isDy: [ - { required: true, trigger: "blur" }, - ], - mobile: [ - { required: true, trigger: "blur", validator: validatePhone }, - ], - email: [ - { required: false, trigger: "blur", validator: validateMail }, - ], - // role: [ - // { required: true, trigger: "change", validator: validateRole }, - // ], - userType: [ - { required: true, trigger: "change", validator: validateType }, - ], - zj: [ - { required: false, trigger: "blur" }, - ], - departmentId: [ - { required: true, trigger: "change", validator: validateDepartment }, - ], - jobTitle: [ - { required: true, trigger: "blur", validator: validateWork }, - ], - // mac: [ - // { required: false, trigger: "blur", validator: validateMac }, - // ], - // ip: [ - // { required: false, trigger: "blur", validator: validateIp }, - // ], - }, - roleList: [ - { name: '瑙掕壊1', value: 1 }, { name: '瑙掕壊2', value: 2 } - ], - typeList: [], - departList: [] + components: { + departTree, + }, + data() { + return { + user: {}, + userDepart: {}, + createUserRules: {}, + roleList: [], + departList: [], + mylabel: "", + defaultProps: { + children: "children", + label: "departName", + }, + tempName: "", + tempRole: [], + }; + }, + created() { + this.user = JSON.parse(JSON.stringify(this.userInfo)); + this.tempName = this.user.depart[0].departName; + + this.userDepart = { + departId: this.user.depart[0].departId, + departName: this.user.depart[0].departName, + }; + // 鑾峰彇鎵�鏈夎鑹插垪琛� + this.getRoleList(); + // 鑾峰彇褰撳墠鐢ㄦ埛瑙掕壊鍒楄〃 + this.getUserRole(this.user.id); + }, + methods: { + // 淇敼閮ㄩ棬 + changeDepart(data) { + this.departList.forEach((item) => { + if (item.id === data) { + this.user.departName = item.departName; } + }); }, - created() { - const that = this; - this.user = JSON.parse(JSON.stringify(that.userInfo)); - console.log(this.user); - // 鑾峰彇鎵�鏈夎鑹插垪琛� - this.getRoleList(); - // 鑾峰彇褰撳墠鐢ㄦ埛瑙掕壊鍒楄〃 - this.getUserRole(this.user.id) - // 鑾峰彇鍏ㄩ儴閮ㄩ棬鍒楄〃 - this.$axios.get('sccg/depart/page').then(res => { - that.departList = res.data.records; - }) - }, - methods: { - changeDepart(data) { - console.log(data); - this.departList.forEach(item => { - if (item.id === data) { - this.user.departName = item.departName; - } - }) - }, - // 淇敼鐢ㄦ埛淇℃伅 - handleUser() { - const { depart, role } = this.flag; - this.$refs.user.validate((valid) => { - if (valid) { - const { user } = this; - user.isDy = `${user.isDy}`; - if (depart) { - console.log(this.user); - this.$axios({ - method: 'post', - url: `sccg/admin/update/${user.id}`, - data: { - "id": user.id, - "username": user.username, - "password": user.password, - "icon": user.icon, - "email": user.email, - "nickName": user.nickName, - "note": user.note, - "createTime": user.createTime, - "loginTime": user.loginTime, - "status": user.status ? 1 : 0, - "macAddress": user.macAddress, - "ipAddress": user.ipAddress, - "isDy": `${user.isDy}`, - "sex": `${user.sex}`, - "jobTitle": user.jobTitle, - "departmentId": user.departmentId, - "departName": user.departName, - "userType": user.userType, - "zj": user.zj, - "mobile": user.mobile, - } - }) - .then(res => { - this.$message({ - type: res.code === 200 ? 'success' : 'warning', - message: res.message, - }) - this.getUserList(); - this.$emit('closeDialog', { flag: false }); - }) - } else { - this.$axios({ - method: 'post', - url: 'sccg/admin/role/update?adminId=' + user.id + '&roleIds=' + user.role, - }) - .then(res => { - this.$message({ - type: res.code === 200 ? 'success' : 'warning', - message: res.message, - }) - this.getUserList(); - this.$emit('closeDialog', { flag: false }); - }) - } - } else { - return false; - } - }) - }, - // 鑾峰彇瑙掕壊鍒楄〃 - getRoleList() { - this.$axios({ - method: 'get', - url: 'sccg/role/listAll', - }) - .then(res => { - this.roleList = res.data; - }) - }, - // 鏀瑰彉鐢ㄦ埛瑙掕壊 - handleChangeRole(data) { - console.log(this.user.role); - // console.log(data); - }, - // 鑾峰彇鐢ㄦ埛鐨勮鑹插垪琛� - getUserRole(id) { - this.$axios({ - method: 'get', - url: `sccg/admin/role/${id}` - }) - .then(res => { - console.log(res); - const arr = []; - res.data.forEach(item => { - arr.push(item.id); - }) - this.user.role = arr; - }) + // 淇敼鐢ㄦ埛淇℃伅 + handleUser() { + const { flag, user, tempName, tempRole, isArraySame } = this; + let umsDepartManage = { userId: user.id, departId: user.departId }; + this.$refs.user.validate((valid) => { + if (valid) { + user.isDy = `${user.isDy}`; + if (flag.depart) { + if (tempName === user.departName) { + this.$message({ + type: "warning", + message: "鎮ㄧ殑閮ㄩ棬杩樻湭鏇存敼", + }); + } else { + if (user.departName) { + this.$axios({ + method: "put", + url: + `/sccg/depart/user_update_depart?userId=` + + user.id + + "&departId=" + + user.departId, + }).then((res) => { + this.$message({ + type: res.code === 200 ? "success" : "warning", + message: res.message, + }); + this.getUserList(); + this.$emit("closeDialog", { flag: false }); + }); + } else { + this.$message({ + type: "warning", + message: "鐢ㄦ埛閮ㄩ棬涓嶈兘涓虹┖", + }); + } + } + } else { + if (user.role.length === 0) { + this.$message({ + type: "warning", + message: "鐢ㄦ埛瑙掕壊涓嶈兘涓虹┖", + }); + } else if ( + isArraySame(tempRole, user.role) && + tempRole.length === user.role.length + ) { + this.$message({ + type: "warning", + message: "鎮ㄨ繕鏈洿鏀硅鑹�", + }); + } else { + this.$axios({ + method: "put", + url: + "sccg/depart/user_update_Role?id=" + + user.id + + "&roles=" + + user.role, + }).then((res) => { + this.$message({ + type: res.code === 200 ? "success" : "warning", + message: res.message, + }); + this.getUserList(); + this.$emit("closeDialog", { flag: false }); + }); + } + } + } else { + return false; } + }); }, - props: ['userInfo', 'updateFlag', 'flag', 'closeDialog', 'getUserList'] -} + // 鑾峰彇瑙掕壊鍒楄〃 + getRoleList() { + this.$axios({ + method: "get", + url: "sccg/role/listAll", + }).then((res) => { + this.roleList = res.data; + }); + }, + // 鑾峰彇鐢ㄦ埛鐨勮鑹插垪琛� + getUserRole(id) { + this.$axios({ + method: "get", + url: `sccg/admin/role/${id}`, + }).then((res) => { + const arr = []; + res.data.forEach((item) => { + arr.push(item.id); + }); + this.user.role = arr; + this.tempRole = arr; + }); + }, + + selectDepart(depart) { + if (depart) { + this.user.departId = depart.departId; + this.user.departName = depart.departName; + } + }, + + // 鍒ゆ柇鏁扮粍鏄惁鐩哥瓑 + isArraySame(arr1, arr2) { + let flag = true; + arr1.sort((a, b) => a - b); + arr2.sort((a, b) => a - b); + arr1.forEach((item) => { + arr2.forEach((child) => { + if (item !== child) { + flag = false; + } + }); + }); + return flag; + }, + }, + props: ["userInfo", "flag", "closeDialog", "getUserList"], +}; </script> <style lang="scss" scoped> .updateUser { - border-radius: 1px; - background-color: #09152f; + border-radius: 1px; + // background-color: #09152f; - :deep(.el-tag) { - background-color: #09152f; - } + // :deep(.el-tag) { + // background-color: #09152f; + // } - .el-select-dropdown.is-multiple .el-select-dropdown__item.selected { - background-color: #09152f; - color: #4b9bb7; - } + // .el-select-dropdown.is-multiple .el-select-dropdown__item.selected { + // background-color: #09152f; + // color: #4b9bb7; + // } - // .el-select-dropdown__item :deep(.selected){ - // background-color: #09152f; - // color: #4b9bb7; - // } - main { - text-align: left; - padding: 0 55px; - background-color: #09152f; - padding-bottom: 50px; + main { + text-align: left; + padding: 0 55px; + // background-color: #09152f; + padding-bottom: 50px; - .mainContent { - display: flex; - justify-content: center; - padding-top: 50px; + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; - .el-form-item__content { - width: 400px; + .el-form-item__content { + width: 400px; - .el-select { - width: 100%; - } - } - - .optionHandleSp { - display: flex; - - .areaNumber, - .moreNumber { - flex: 1; - } - - .telNumber { - flex: 2; - } - } - - .optionBtn { - display: flex; - margin-top: 20px; - - .btn { - padding: 12px 50px; - } - } - + .el-select { + width: 100%; } + } + + .optionHandleSp { + display: flex; + + .areaNumber, + .moreNumber { + flex: 1; + } + + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } } + } } -.updateUser::v-deep .el-form-item__label { - color: #4b9bb7; -} +// .updateUser::v-deep .el-form-item__label { +// color: #4b9bb7; +// } -.updateUser::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; -} +// .updateUser::v-deep .el-input__inner { +// background-color: #09152f; +// border: 1px solid #17324c; +// } </style> \ No newline at end of file -- Gitblit v1.8.0