From c83e653ebaef064b0741c1f35cf6576762ccbc68 Mon Sep 17 00:00:00 2001 From: heyujie <516346543@qq.com> Date: 星期六, 10 七月 2021 16:30:14 +0800 Subject: [PATCH] 系统设置修改 --- src/pages/settings/index/App.vue | 261 +++++++++++++++++----------------------------------- 1 files changed, 85 insertions(+), 176 deletions(-) diff --git a/src/pages/settings/index/App.vue b/src/pages/settings/index/App.vue index 8d0114c..b935d5f 100644 --- a/src/pages/settings/index/App.vue +++ b/src/pages/settings/index/App.vue @@ -8,7 +8,7 @@ :key="index" @click="openMenu(item.name, index)" > - <span class="icon iconfont"></span> + <span class="icon iconfont">{{ item.icon }}</span> <span class="card-text">{{ item.name }}</span> </div> </div> @@ -35,10 +35,18 @@ /> </div> <span class="user-name">{{ item.username }}</span> + <el-tag + style="margin-left: 100px" + size="mini" + v-if="item.id == curUserID" + >鎴戠殑</el-tag + > </div> </div> <div class="add-account"> - <span class="icon iconfont" @click="showAddAccount"></span> + <!-- <span class="icon iconfont" @click="openAdd"></span> --> + <i class="el-icon-circle-plus" style="font-size: 38px; +" @click="openAdd"></i> </div> </div> <div class="datetime-left" v-if="activePage == '鏃ユ湡鏃堕棿'"> @@ -114,8 +122,10 @@ </div> <div class="user-desc"> <div class="username"> - <span class="icon iconfont" style="margin-right: 5px" - ></span + <span + class="icon iconfont" + style="font-size: 18px; margin-right: 3px" + ></span > <span>{{ activeAccountItem.username }}</span> </div> @@ -124,32 +134,33 @@ <span v-show="!showInputNickName">{{ activeAccountItem.nickname }}</span> - <!-- <input - type="text" - class="input-nick" - ref="input-nick" - v-show="showInputNickName" - v-model="inputNickName" - @blur="hideInputNick" - @keydown.enter="blurInputNick" - /> --> <el-input size="mini" v-model="inputNickName" v-if="showInputNickName" ></el-input> - <span v-show="!showInputNickName" class="icon iconfont" @click="editNickName" + <span + v-show="!showInputNickName" + class="icon iconfont" + @click="editNickName" ></span > - <span v-show="showInputNickName" class="icon iconfont" @click="showInputNickName=false" + <span + v-show="showInputNickName" + class="icon iconfont" + @click="showInputNickName = false" ></span > - <span v-show="showInputNickName" class="icon iconfont" style="font-size:21px;font-weight:600;color:green;" @click="hideInputNick" + <span + v-show="showInputNickName" + class="icon iconfont" + style="font-size: 21px; font-weight: 600; color: green" + @click="hideInputNick" ></span > </div> <div class="user-role"> - {{ activeUserRole }} + <el-tag type="info" size="mini">{{ activeUserRole }}</el-tag> </div> </div> </div> @@ -198,7 +209,10 @@ ref="passwordForm" class="password-form" > - <el-form-item prop="curPassword"> + <el-form-item + prop="curPassword" + v-if="activeAccountItem.id == curUserID" + > <div class="p-title">褰撳墠瀵嗙爜锛�</div> <el-input @@ -286,14 +300,6 @@ <span class="icon iconfont enable"></span> </div> </div> - <!-- <el-upload - class="upload-demo" - action="https://jsonplaceholder.typicode.com/posts/" - :show-file-list="false" - :http-request="uploadUserPic" - > - <div v-if="loadedPic == ''" class="upload-jpg-up">涓婁紶</div> - </el-upload> --> </div> <div class="fill-group"> <el-form @@ -549,42 +555,13 @@ ></generalSettings> </div> <div class="welcome-page" v-else> - <div class="child" @click="openWelcome('璐︽埛', 0)"> + <div class="child" @click="openWelcome(item, i)" v-for="(item,i) in menuArr" :key="i"> <div class="child-info"> - <span class="icon iconfont welcome-icon"></span> - <span class="welcome-title">璐︽埛</span> + <span class="icon iconfont welcome-icon">{{ item.icon }}</span> + <span class="welcome-title">{{item.name}}</span> </div> </div> - <div class="child" @click="openWelcome('鏃ユ湡鏃堕棿', 1)"> - <div class="child-info"> - <span class="icon iconfont welcome-icon"></span> - <span class="welcome-title">鏃ユ湡鏃堕棿</span> - </div> - </div> - <div class="child" @click="openWelcome('闆嗙兢绠$悊', 2)"> - <div class="child-info"> - <span class="icon iconfont welcome-icon"></span> - <span class="welcome-title">闆嗙兢绠$悊</span> - </div> - </div> - <div class="child" @click="openWelcome('缃戠粶璁剧疆', 3)"> - <div class="child-info"> - <span class="icon iconfont welcome-icon"></span> - <span class="welcome-title">缃戠粶璁剧疆</span> - </div> - </div> - <div class="child" @click="openWelcome('閿洏鍜岃瑷�', 4)"> - <div class="child-info"> - <span class="icon iconfont welcome-icon"></span> - <span class="welcome-title">閿洏鍜岃瑷�</span> - </div> - </div> - <div class="child" @click="openWelcome('閫氱敤璁剧疆', 5)"> - <div class="child-info"> - <span class="icon iconfont welcome-icon"></span> - <span class="welcome-title">閫氱敤璁剧疆</span> - </div> - </div> + </div> </template> @@ -608,7 +585,6 @@ import netSettings from "../views/NetSettings"; import keyboardLanguage from "../views/keyboardLanguage"; import generalSettings from "../views/generalSettings"; -import treeVue from "@/components/treeMenu/jsTree/tree.vue"; export default { name: "settings", components: { @@ -683,12 +659,12 @@ settime: "", weekday: "", menuArr: [ - { name: "璐︽埛" }, - { name: "鏃ユ湡鏃堕棿" }, - { name: "闆嗙兢绠$悊" }, - { name: "缃戠粶璁剧疆" }, - { name: "閿洏鍜岃瑷�" }, - { name: "閫氱敤璁剧疆" }, + { name: "璐︽埛", icon: "\ue6de" }, + { name: "鏃ユ湡鏃堕棿", icon: "\ue6ff" }, + { name: "闆嗙兢绠$悊", icon: "\ue6df" }, + { name: "缃戠粶璁剧疆", icon: "\ue6dd" }, + { name: "閿洏鍜岃瑷�", icon: "\ue6dc" }, + { name: "閫氱敤璁剧疆", icon: "\ue6db" }, ], accountArr: [], jpgArr: [], @@ -776,9 +752,7 @@ } }); }, - blurInputNick() { - this.$refs["input-nick"].blur(); - }, + confirmChangePic() { updateUser({ id: this.activeAccountItem.id, @@ -794,7 +768,6 @@ editNickName() { this.showInputNickName = true; this.inputNickName = this.activeAccountItem.nickname; - this.$refs["input-nick"].focus(); }, hideInputNick() { if (this.inputNickName == this.activeAccountItem.nickname) { @@ -805,7 +778,7 @@ id: this.activeAccountItem.id, nickname: this.inputNickName, }).then((res) => { - this.activeAccountItem.nickname = this.inputNickName + this.activeAccountItem.nickname = this.inputNickName; this.$message.success(res.msg); this.fetchUserList(true); this.showInputNickName = false; @@ -881,8 +854,8 @@ }); }, childrenChange(item) { - let isAllSelected = item.children.every((x) => x.selected == true); - item.selected = isAllSelected; + let SomeOneSelected = item.children.some((x) => x.selected == true); + item.selected = SomeOneSelected; }, plusOne(typ) { this.isSyncBrowser = false; @@ -1014,14 +987,6 @@ n = n.toString(); return n[1] ? n : "0" + n; }, - // uploadUserPic(params) { - // let param = new FormData(); - // param.append("file", params.file); - // uploadHeadPic(param).then((res) => { - // this.jpgArr.push(res.data); - // this.loadedPic = res.data; - // }); - // }, initClockConf(ntpTest = false) { getClockInfo().then((rsp) => { if (rsp && rsp.success) { @@ -1050,9 +1015,9 @@ this.initClockConf(); } }, - openWelcome(name, i) { + openWelcome(item, i) { this.showWelcome = false; - this.openMenu(name, i); + this.openMenu(item.name, i); }, showInput(typ) { this[`show${typ}Input`] = true; @@ -1087,11 +1052,11 @@ }, 1000); } }, - showAddAccount() { + openAdd() { this.inAccountDetail = false; this.isAddAccount = true; this.selectedPic = 0; - this.addForm.headpic = this.jpgArr[0]; + this.addForm.headpic = this.jpgArr[0].path; getRoles().then((res) => { if (res.success) { this.roleList = res.data.slice(0, 2); @@ -1116,12 +1081,21 @@ this.showJPGArr = false; }, SaveNewPassword(formName) { + let data; this.$refs[formName].validate((valid) => { if (valid) { - updatePassword({ - oldPwd: this.passwordForm.curPassword, - newPwd: this.passwordForm.newPassword, - }).then( + if (this.passwordForm.curPassword == "") { + data = { + userId: this.activeAccountItem.id, + newPwd: this.passwordForm.newPassword, + }; + } else { + data = { + oldPwd: this.passwordForm.curPassword, + newPwd: this.passwordForm.newPassword, + }; + } + updatePassword(data).then( (res) => { if (res.success) { this.$message.success(res.msg); @@ -1129,7 +1103,7 @@ } }, (err) => { - this.$message.warning("淇濆瓨澶辫触锛�" + err.msg); + this.$message.error("淇濆瓨澶辫触锛�" + err.msg); } ); } @@ -1143,6 +1117,7 @@ password: this.addForm.password, nickname: this.addForm.nickName, headpic: this.addForm.headpic, + roleId: this.addForm.roleId, }; addUser(data).then( (res) => { @@ -1150,7 +1125,7 @@ this.fetchUserList(true); }, (err) => { - this.$message.warning("淇濆瓨澶辫触锛�" + err.msg); + this.$message.error("淇濆瓨澶辫触锛�" + err.msg); } ); } else { @@ -1227,7 +1202,7 @@ message: "鍒犻櫎鎴愬姛!", }); } else { - this.$message.warning("鍒犻櫎澶辫触"); + this.$message.error("鍒犻櫎澶辫触"); } }); }) @@ -1275,6 +1250,10 @@ const info = JSON.parse(sessionStorage.getItem("userInfo")); return info.roleName; }, + curUserID() { + const info = JSON.parse(sessionStorage.getItem("userInfo")); + return info.id; + }, }, }; </script> @@ -1292,7 +1271,6 @@ background-color: white; -webkit-box-flex: 0; -ms-flex: 0 0 33.3%; - /* flex: 0 0 16%; */ float: left; width: 250px; height: 200px; @@ -1373,12 +1351,16 @@ border-right: 5px solid rgba(248, 248, 248, 1); box-sizing: border-box; .account-left { + .account-list{ + height: 530px; + overflow: auto; + } .add-account { color: rgba(61, 104, 225, 1); - margin-top: 30px; - .iconfont { + margin-top: 15px; + .el-icon-circle-plus { cursor: pointer; - font-size: 32px; + font-size: 38px; } } .account-card { @@ -1469,7 +1451,6 @@ overflow: auto; box-sizing: border-box; position: relative; - padding: 20px 40px; .account-right { .account-content { @@ -1533,11 +1514,11 @@ align-items: baseline; min-width: 200px; .username { - margin: 0 15px; - height: 28px; - line-height: 28px; - text-align: left; - font-size: 16px; + margin: 0 15px; + height: 28px; + line-height: 28px; + text-align: left; + font-size: 16px; display: flex; align-items: center; } @@ -1551,10 +1532,7 @@ width: fit-content; text-align: left; } - .input-nick { - width: 80px; - margin-right: 5px; - } + .iconfont { font-size: 14px; margin-left: 5px; @@ -1571,7 +1549,7 @@ .user-role { margin: 5px 0 0 15px; font-size: 14px; - color: darkseagreen; + color: skyblue; } } } @@ -1598,7 +1576,6 @@ .title { height: 30px; line-height: 30px; - /* background-color: aliceblue; */ margin-bottom: 10px; font-size: 16px; font-weight: 600; @@ -1629,8 +1606,6 @@ right: 1px; top: -0.5px; width: 45px; - // background-color: rgba(61, 104, 225, 1); - /* color: white; */ border-radius: 12px; } } @@ -1690,20 +1665,6 @@ } .upload-jpg-border { border: 2px solid cornflowerblue; - } - .upload-jpg-up { - height: 48px; - width: 48px; - float: left; - display: flex; - background-color: rgba(242, 242, 242, 1); - border: 2px solid transparent; - border-radius: 50%; - - justify-content: center; - align-items: center; - font-size: 12px; - cursor: pointer; } } .add-account-page { @@ -1770,59 +1731,7 @@ text-decoration: underline; } } - .ntp-bar { - height: 40px; - background-color: rgba(248, 248, 248, 1); - display: flex; - align-items: center; - justify-content: space-between; - padding: 0 10px; - border-radius: 10px; - margin-bottom: 10px; - .title { - min-width: 70px; - } - .input-area { - width: 450px; - height: 30px; - background-color: rgba(240, 240, 240, 1); - border-radius: 10px; - line-height: 30px; - font-size: 14px; - } - } - .int-bar { - height: 40px; - background-color: rgba(248, 248, 248, 1); - display: flex; - align-items: center; - justify-content: space-between; - padding: 0 10px; - border-radius: 10px; - margin-bottom: 10px; - .title { - min-width: 130px; - } - .right { - width: 450px; - display: flex; - align-items: center; - height: 30px; - .input-area { - // width: 410px; - background-color: rgba(240, 240, 240, 1); - border-radius: 10px; - line-height: 30px; - width: -webkit-fill-available; - - font-size: 14px; - } - .test { - width: 40px; - } - } - } } .manual-time { .clock-wrap { -- Gitblit v1.8.0