From ecf388a7953a10fe1ae8ee1a332c74ce40d782eb Mon Sep 17 00:00:00 2001 From: heyujie <516346543@qq.com> Date: 星期三, 22 十二月 2021 09:52:19 +0800 Subject: [PATCH] 对比库管理ui修正 --- src/pages/settings/index/index.vue | 246 +++++++++++++++++++++++-------------------------- 1 files changed, 115 insertions(+), 131 deletions(-) diff --git a/src/pages/settings/index/index.vue b/src/pages/settings/index/index.vue index 15e71d0..60b4f80 100644 --- a/src/pages/settings/index/index.vue +++ b/src/pages/settings/index/index.vue @@ -16,11 +16,11 @@ <div class="container-center" v-if="activeIndex == 0"> <div class="account-left" v-if="activeIndex == 0"> - <div class="account-list" - :class="{'account-list-scroll' - :account_list_scroll}" - @mouseenter="account_list_scroll = true" - @mouseleave="account_list_scroll = false" + <div + class="account-list" + :class="{ 'account-list-scroll': account_list_scroll }" + @mouseenter="account_list_scroll = true" + @mouseleave="account_list_scroll = false" > <div class="account-card" @@ -77,7 +77,6 @@ <span class="enable" v-if="!showJPGArr" @click="editHeadPic" >缂栬緫澶村儚</span > - </div> </div> <div class="user-desc"> @@ -645,7 +644,7 @@ class="nav-child" @click="openWelcome(i)" @mousedown="mouseDownIndex = i" - :class="mouseDownIndex === i? 'nav-child-active':''" + :class="mouseDownIndex === i ? 'nav-child-active' : ''" v-for="(item, i) in menuArr" :key="i" > @@ -768,7 +767,6 @@ selectedPic: null, showDayInput: false, timestamp: 0, - ajustType: "鎵嬪姩鏍℃椂", inAccountDetail: false, isChangePw: false, isSetPermission: false, @@ -840,7 +838,7 @@ inputHour: "", inputMin: "", inputSec: "", - mouseDownIndex:'', + mouseDownIndex: "", inputYrs: "", showInputNickName: false, inputMonth: "", @@ -886,28 +884,25 @@ ], confirmPassword: [{ validator: v4, trigger: "blur" }], }, - account_list_scroll: false + account_list_scroll: false, }; }, - created(){ - let color = localStorage.getItem('--colorCard') - if(color) { - document.documentElement.style.setProperty('--colorCard',`${color}`) - } + created() { + let color = localStorage.getItem("--colorCard"); + if (color) { + document.documentElement.style.setProperty("--colorCard", `${color}`); + } }, beforeDestroy() { clearTimeout(this.clockTimer); clearInterval(this.browserTimer); - // if (this.$refs.curPage) { - // this.$refs.curPage.removeEventListener("click"); - // } }, mounted() { - window.addEventListener("message",(e)=>{ - if(e.data.msg === '杩斿洖绯荤粺璁剧疆') { - this.showWelcome = true - } - }) + window.addEventListener("message", (e) => { + if (e.data.msg === "杩斿洖绯荤粺璁剧疆") { + this.showWelcome = true; + } + }); const menu = getUrlKey("menu"); if (menu) { this.showWelcome = false; @@ -1173,15 +1168,7 @@ } ); }, - // flatCheckedArr(arr, res) { - // for (const item of arr) { - // if (item.selected) res.push(item.id); - // if (item.children) this.flatCheckedArr(item.children, res); - // } - // }, saveAuth() { - // let arr = []; - // this.flatCheckedArr(this.sysMenus, arr); updataUser({ id: this.activeAccountItem.id, menuIds: this.$refs.treeMenus.getCheckedKeys(), @@ -1499,19 +1486,13 @@ ":" ); }, - // changeSwitch(str) { - // if (str == "isNtp") { - // this.isManual = !this[str]; - // } else { - // this.isNtp = !this[str]; - // } - // this.syncType = this.isNtp ? "1" : "2"; - // if (this.isManual) this.parseTime(); - // }, }, computed: { activeUserRole() { - return this.activeAccountItem.sysRoles[0].name; + if (this.activeAccountItem.sysRoles&&this.activeAccountItem.sysRoles.length) { + return this.activeAccountItem.sysRoles[0].name; + } + return "鏅�氱敤鎴�" }, curUserRole() { const info = JSON.parse(sessionStorage.getItem("userInfo")); @@ -1573,7 +1554,7 @@ border-radius: 40px; .search-res { - background-color: rgba(255,255,255,.5); + background-color: rgba(255, 255, 255, 0.5); } .search-input { font-size: 14px; @@ -1603,29 +1584,30 @@ width: 100%; font-weight: bold; - &::-webkit-input-placeholder { /* WebKit browsers */ - color: #828282; - font-weight: normal; - font-size: 14px; + &::-webkit-input-placeholder { + /* WebKit browsers */ + color: #828282; + font-weight: normal; + font-size: 14px; } - &:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ - color: #828282; - font-weight: normal; - font-size: 14px; + &:-moz-placeholder { + /* Mozilla Firefox 4 to 18 */ + color: #828282; + font-weight: normal; + font-size: 14px; } - &::-moz-placeholder { /* Mozilla Firefox 19+ */ - color: #828282; - font-weight: normal; - font-size: 14px; + &::-moz-placeholder { + /* Mozilla Firefox 19+ */ + color: #828282; + font-weight: normal; + font-size: 14px; } - &:-ms-input-placeholder { /* Internet Explorer 10+ */ - color: #828282; - font-weight: normal; - font-size: 14px; - - } - - + &:-ms-input-placeholder { + /* Internet Explorer 10+ */ + color: #828282; + font-weight: normal; + font-size: 14px; + } } .el-input__suffix { display: flex; @@ -1654,7 +1636,7 @@ text-align: left; box-sizing: border-box; padding: 0 20px; - color: #4F4F4F; + color: #4f4f4f; font-size: 14px; cursor: pointer; } @@ -1664,7 +1646,7 @@ text-align: left; box-sizing: border-box; padding: 0 20px; - color: #4F4F4F; + color: #4f4f4f; font-size: 14px; } .res-bar:hover { @@ -1691,14 +1673,14 @@ justify-content: center; align-items: center; cursor: pointer; - border: 2px solid #F2F2F7; + border: 2px solid #f2f2f7; &-active { - border: 2px solid #4E94FF; + border: 2px solid #4e94ff; } &:hover { - background: #F2F2F7; + background: #f2f2f7; } .child-info { @@ -1718,11 +1700,10 @@ font-size: 16px; font-weight: bold; margin-top: 24px; - color: #4F4F4F; + color: #4f4f4f; } } } - } } .container { @@ -1733,8 +1714,8 @@ flex-basis: auto; box-sizing: border-box; background-color: #fff; - color: #4F4F4F; - border-top: 2px solid #E1E0E6; + color: #4f4f4f; + border-top: 2px solid #e1e0e6; overflow-x: hidden; .container-left { height: 100%; @@ -1755,7 +1736,7 @@ .card-text { margin-left: 20px; - color: #4F4F4F; + color: #4f4f4f; font-weight: bold; font-size: 16px; line-height: 22px; @@ -1806,17 +1787,21 @@ height: calc(85%); overflow: auto; padding-right: 5px; - &::-webkit-scrollbar-track, &::-webkit-scrollbar-thumb { visibility: hidden; } - &::-webkit-scrollbar { - background-color: #fff; - } + &::-webkit-scrollbar-track, + &::-webkit-scrollbar-thumb { + visibility: hidden; + } + &::-webkit-scrollbar { + background-color: #fff; + } - &.account-list-scroll::-webkit-scrollbar-thumb, &.account-list-scroll::-webkit-scrollbar-track { + &.account-list-scroll::-webkit-scrollbar-thumb, + &.account-list-scroll::-webkit-scrollbar-track { visibility: visible; } &.account-list-scroll::-webkit-scrollbar { - background-color: #f5f5f5; - } + background-color: #f5f5f5; + } } .add-account { color: var(--colorCard); @@ -1853,7 +1838,7 @@ height: 19.21px; background: #ffffff; border-radius: 20px; - color: #4F4F4F; + color: #4f4f4f; transform: scale(0.833333); line-height: 22.21px; span { @@ -1940,7 +1925,7 @@ display: flex; flex-direction: column; align-items: center; - color: #4F4F4F; + color: #4f4f4f; min-width: 200px; .user-name { margin-bottom: 10px; @@ -2046,7 +2031,7 @@ font-weight: bold; font-size: 16px; line-height: 22px; - color: #4F4F4F; + color: #4f4f4f; margin-bottom: 40px; height: 28px; display: flex; @@ -2066,7 +2051,7 @@ border-radius: 8px; padding: 0 15px 0 20px; .el-select-dropdown__item { - color: #4F4F4F; + color: #4f4f4f; height: 32px; font-size: 12px; line-height: 32px; @@ -2094,12 +2079,12 @@ border: 2px solid transparent; border-radius: 20px; height: 32px; - line-height: 32px; + line-height: 32px; padding: 0 15px; font-size: 14px; font-weight: bold; } - .el-input__inner:focus{ + .el-input__inner:focus { border: 2px solid var(--colorCard); } .el-input__inner::placeholder { @@ -2111,7 +2096,7 @@ width: 100%; } .el-select .el-input .el-select__caret { - color: #4F4F4F; + color: #4f4f4f; font-size: 14px; font-weight: 600; } @@ -2135,7 +2120,7 @@ font-size: 15px; } .el-input__clear { - color: #4F4F4F; + color: #4f4f4f; font-size: 16px; line-height: 48px; } @@ -2154,7 +2139,7 @@ line-height: 48px; font-size: 16px; font-weight: 600; - color: #4F4F4F; + color: #4f4f4f; height: 48px; background: #fbfaff; border-bottom: 2px solid #f2f2f7; @@ -2276,7 +2261,7 @@ border-radius: 8px; padding: 0 15px 0 20px; .el-select-dropdown__item { - color: #4F4F4F; + color: #4f4f4f; height: 32px; font-size: 12px; line-height: 32px; @@ -2307,18 +2292,18 @@ } .el-form-item { .el-input__inner { - background-color: #ffffff; - border: 2px solid transparent; - border-radius: 20px; - height: 32px; - line-height: 32px; - padding: 0 15px; - font-size: 14px; - font-weight: bold; - } - .el-input__inner:focus{ - border: 2px solid var(--colorCard); - } + background-color: #ffffff; + border: 2px solid transparent; + border-radius: 20px; + height: 32px; + line-height: 32px; + padding: 0 15px; + font-size: 14px; + font-weight: bold; + } + .el-input__inner:focus { + border: 2px solid var(--colorCard); + } .el-input__inner::placeholder { color: #c0c4cc; font-size: 12px; @@ -2328,7 +2313,7 @@ width: 100%; } .el-select .el-input .el-select__caret { - color: #4F4F4F; + color: #4f4f4f; font-size: 14px; font-weight: 600; } @@ -2339,7 +2324,7 @@ .datetime-right { .datetime-left { .device-time { - color: #4F4F4F; + color: #4f4f4f; .title { display: flex; justify-content: center; @@ -2625,36 +2610,35 @@ border: 2px solid transparent; } } - } - .btns { - margin: 0 auto; - margin-top: 40px; - width: fit-content; - display: flex; - .cancel { - width: 188px; - height: 40px; - cursor: pointer; - border-radius: 25px; - background-color: #e0e0e0; - line-height: 40px; - font-weight: bold; - font-size: 16px; - margin-right: 12px; - } - .ok { - width: 188px; - height: 40px; - cursor: pointer; - border-radius: 25px; - background-color: var(--colorCard); - color: #fff; - line-height: 40px; - font-weight: bold; - font-size: 16px; - } + .btns { + margin: 0 auto; + margin-top: 40px; + width: fit-content; + display: flex; + .cancel { + width: 188px; + height: 40px; + cursor: pointer; + border-radius: 25px; + background-color: #e0e0e0; + line-height: 40px; + font-weight: bold; + font-size: 16px; + margin-right: 12px; } + .ok { + width: 188px; + height: 40px; + cursor: pointer; + border-radius: 25px; + background-color: var(--colorCard); + color: #fff; + line-height: 40px; + font-weight: bold; + font-size: 16px; + } + } .container-right-for-account { background: #fbfaff; padding: 0; -- Gitblit v1.8.0