From f66bea2df4423a5d595ce737c998af655e0c4919 Mon Sep 17 00:00:00 2001 From: zhanghua <314079846@qq.com> Date: 星期二, 08 十一月 2022 16:55:22 +0800 Subject: [PATCH] bug修改 --- src/views/systemSetting/baseSetting/user/components/myView/index.vue | 426 +++++++++++++++++++++++++++++++---------------------- 1 files changed, 250 insertions(+), 176 deletions(-) diff --git a/src/views/systemSetting/baseSetting/user/components/myView/index.vue b/src/views/systemSetting/baseSetting/user/components/myView/index.vue index 8608360..c69a1e2 100644 --- a/src/views/systemSetting/baseSetting/user/components/myView/index.vue +++ b/src/views/systemSetting/baseSetting/user/components/myView/index.vue @@ -1,202 +1,276 @@ <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></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="nickName"> - <el-input v-model="user.nickName" placeholder="璇峰~鍐欑敤鎴峰鍚�" disabled></el-input> - </el-form-item> - <!-- 鎬у埆 --> - <el-form-item class="optionItem" label="鎬у埆:" prop="sex"> - <el-radio-group v-model="user.sex" 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="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></el-input> - </el-form-item> - <!-- 閭鍦板潃 --> - <el-form-item class="optionItem" label="閭鍦板潃:" prop="email"> - <el-input v-model="user.email" placeholder="璇峰~鍐欓偖绠卞湴鍧�" disabled></el-input> - </el-form-item> - <!-- 閫夋嫨瑙掕壊 --> - <el-form-item class="optionItem" label="閫夋嫨瑙掕壊:" prop="role"> - <el-select v-model="user.role" placeholder="璇烽�夋嫨鎵�灞炶鑹�" multiple collapse-tags - disabled> - <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="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="departmentId"> - <el-input v-model="user.departName"></el-input> - </el-form-item> - <!-- 褰撳墠鑱屽姟 --> - <el-form-item class="optionItem" label="褰撳墠鑱屽姟:" prop="jobTitle"> - <el-input v-model="user.jobTitle" placeholder="璇疯緭鍏ュ綋鍓嶈亴鍔�" disabled></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> - </div> - </main> - </div> + <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 + ></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="nickName" + > + <el-input + v-model="user.nickName" + placeholder="璇峰~鍐欑敤鎴峰鍚�" + disabled + ></el-input> + </el-form-item> + <!-- 鎬у埆 --> + <el-form-item class="optionItem" label="鎬у埆:" prop="sex"> + <el-radio-group v-model="user.sex" 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="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 + ></el-input> + </el-form-item> + <!-- 閭鍦板潃 --> + <el-form-item class="optionItem" label="閭鍦板潃:" prop="email"> + <el-input + v-model="user.email" + placeholder="璇峰~鍐欓偖绠卞湴鍧�" + disabled + ></el-input> + </el-form-item> + <!-- 閫夋嫨瑙掕壊 --> + <el-form-item class="optionItem" label="閫夋嫨瑙掕壊:" prop="role"> + <el-select + v-model="user.role" + placeholder="璇烽�夋嫨鎵�灞炶鑹�" + multiple + collapse-tags + disabled + > + <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="userType"> + <el-select v-model="user.userType" placeholder="璇烽�夋嫨鐢ㄦ埛绫诲瀷"> + <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="departmentId" + > + <el-input v-model="user.departName"></el-input> + </el-form-item> + <!-- 褰撳墠鑱屽姟 --> + <el-form-item class="optionItem" label="褰撳墠鑱屽姟:" prop="jobTitle"> + <el-input + v-model="user.jobTitle" + placeholder="璇疯緭鍏ュ綋鍓嶈亴鍔�" + disabled + ></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> + </div> + </main> + </div> </template> <script> +import { getTypeList } from "@/utils/helper"; export default { - data() { - return { - user: { - }, - createUserRules: { - }, - roleList: [ - - ], - typeList: [], - departList: [], + data() { + return { + user: {}, + createUserRules: {}, + roleList: [], + typeList: [], + departList: [], + }; + }, + created() { + const that = this; + this.user = JSON.parse(JSON.stringify(that.userInfo)); + this.user.departName = ""; + if (this.user.depart.length > 0) { + this.user.depart.forEach((item, index) => { + if (item !== null) { + if (index < this.user.depart.length - 1) { + this.user.departName += item.departName + ","; + } else { + this.user.departName += item.departName; + } } + }); + } else { + this.user.departName = "鏆傛棤鎵�灞為儴闂�"; + } + // 鑾峰彇鎵�鏈夎鑹插垪琛� + this.getRoleList(); + // 鑾峰彇褰撳墠鐢ㄦ埛瑙掕壊鍒楄〃 + this.getUserRole(this.user.id); + // 鑾峰彇鍏ㄩ儴閮ㄩ棬鍒楄〃 + this.$axios.get("/sccg/depart/tree").then((res) => { + this.departList = res.data; + }); + + // 鑾峰彇鐢ㄦ埛绫诲瀷 + getTypeList(1, "07").then((data) => { + this.typeList = data; + }); + }, + methods: { + // 鑾峰彇瑙掕壊鍒楄〃 + getRoleList() { + this.$axios({ + method: "get", + url: "sccg/role/listAll", + }).then((res) => { + this.roleList = res.data; + }); }, - created() { - const that = this; - this.user = JSON.parse(JSON.stringify(that.userInfo)); - this.user.departName = this.user.departName ? this.user.departName : '鏆傛棤鎵�灞為儴闂�' - // 鑾峰彇鎵�鏈夎鑹插垪琛� - this.getRoleList(); - // 鑾峰彇褰撳墠鐢ㄦ埛瑙掕壊鍒楄〃 - this.getUserRole(this.user.id) - // 鑾峰彇鍏ㄩ儴閮ㄩ棬鍒楄〃 - this.$axios.get('/sccg/depart/tree').then(res => { - this.departList = 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; + }); }, - methods: { - // 鑾峰彇瑙掕壊鍒楄〃 - 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; - }) - }, - }, - props: ['userInfo'] -} + }, + props: ["userInfo"], +}; </script> <style lang="scss" scoped> .updateUser { - border-radius: 1px; + 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; - } + 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; + color: #4b9bb7; } .updateUser::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; + background-color: #09152f; + border: 1px solid #17324c; } </style> \ No newline at end of file -- Gitblit v1.8.0