From dface8e086f20da29a22c6a5e61bc7b1aefaa984 Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@smartai.com> Date: 星期三, 06 九月 2023 11:14:34 +0800 Subject: [PATCH] 修复系统设置菜单交互 --- src/pages/settings/index/index.vue | 132 ++++++++++++++++++++++++-------------------- 1 files changed, 72 insertions(+), 60 deletions(-) diff --git a/src/pages/settings/index/index.vue b/src/pages/settings/index/index.vue index 1f8d7b1..e9c7648 100644 --- a/src/pages/settings/index/index.vue +++ b/src/pages/settings/index/index.vue @@ -2,11 +2,10 @@ <div class="container" v-if="!showWelcome"> <div class="container-left"> <div - class="left-card" - :class="activeIndex == i ? 'left-card-active' : ''" v-for="(item, i) in menuArr" :key="i" - @click="openMenu(i)" + :class="activeIndex == item.name ? 'left-card-active left-card' : 'left-card'" + @click="openMenu(item.name)" > <img :src="item.blackIcon" class="b" alt="" /> <img :src="item.whiteIcon" class="w" alt="" /> @@ -14,8 +13,8 @@ </div> </div> - <div class="container-center" v-if="activeIndex == 0"> - <div class="account-left" v-if="activeIndex == 0"> + <div class="container-center" v-if="activeIndex == '璐︽埛'"> + <div class="account-left"> <div class="account-list" :class="{ 'account-list-scroll': account_list_scroll }" @@ -46,8 +45,8 @@ </div> <div class="container-right" - v-if="activeIndex == 0 || activeIndex == 1" - :class="activeIndex == 0 ? 'container-right-for-account' : ''" + v-if="activeIndex == '璐︽埛' || activeIndex == '鏃ユ湡鏃堕棿'" + :class="activeIndex == '璐︽埛' ? 'container-right-for-account' : ''" > <div class="account-right" v-if="activeIndex == 0"> <div class="account-content" v-if="inAccountDetail == false && isAddAccount == false"> @@ -212,7 +211,7 @@ </div> </div> - <div class="datetime-right" v-if="activeIndex == 1"> + <div class="datetime-right" v-if="activeIndex == '鏃ユ湡鏃堕棿'"> <div class="datetime-left"> <div class="device-time"> <div class="title"> @@ -409,13 +408,13 @@ </div> </div> - <clusterManagement v-if="activeIndex == 2" ref="view_2" style="width: 100%"></clusterManagement> - <netSettings ref="view_3" v-if="activeIndex == 3" style="width: 100%"></netSettings> - <keyboardLanguage ref="view_4" v-if="activeIndex == 4" style="width: 100%"></keyboardLanguage> - <generalSettings ref="view_5" v-if="activeIndex == 5" style="width: 100%"></generalSettings> - <deviceInfo v-if="activeIndex == 6" style="width: 100%" ref="view_6"></deviceInfo> - <Authorization v-if="activeIndex == 7" style="width: 100%" ref="view_7"> </Authorization> - <WebManage v-if="activeIndex == 8"></WebManage> + <clusterManagement v-if="activeIndex == '闆嗙兢绠$悊'" ref="view_2" style="width: 100%"></clusterManagement> + <netSettings ref="缃戠粶璁剧疆" v-if="activeIndex == '缃戠粶璁剧疆'" style="width: 100%"></netSettings> + <keyboardLanguage ref="閿洏鍜岃瑷�" v-if="activeIndex == '閿洏鍜岃瑷�'" style="width: 100%"></keyboardLanguage> + <generalSettings ref="閫氱敤璁剧疆" v-if="activeIndex == '閫氱敤璁剧疆'" style="width: 100%"></generalSettings> + <deviceInfo v-if="activeIndex == '璁惧淇℃伅'" style="width: 100%" ref="view_6"></deviceInfo> + <Authorization v-if="activeIndex == '鎺堟潈绠$悊'" style="width: 100%" ref="view_7"> </Authorization> + <WebManage v-if="activeIndex == '鍩熷悕绠$悊'"></WebManage> </div> <div class="welcome-page" v-else ref="curPage" @mouseup="mouseDownIndex = ''"> <div class="search-box" :class="showRecomand ? 'border-change' : ''" @click.stop> @@ -441,9 +440,9 @@ <div class="nav-items"> <div class="nav-child" - @click="openWelcome(i)" - @mousedown="mouseDownIndex = i" - :class="mouseDownIndex === i ? 'nav-child-active' : ''" + @click="openWelcome(item.name)" + @mousedown="mouseDownIndex = item.name" + :class="mouseDownIndex === item.name ? 'nav-child-active' : ''" v-for="(item, i) in menuArr" :key="i" > @@ -544,22 +543,22 @@ timezone: "", showRecomand: false, searchArr: [ - { name: "璐︽埛", addr: [0] }, - { name: "閫氱敤璁剧疆", addr: [5] }, - { name: "鏃堕棿褰曞儚鏃堕暱", addr: [5, 0] }, - { name: "浜嬩欢澹伴煶", addr: [5, 1] }, - { name: "涓�у寲璁剧疆", addr: [5, 2] }, - { name: "闆嗙兢绠$悊", addr: [2] }, - { name: "缃戠粶璁剧疆", addr: [3] }, - { name: "鏃犵嚎缃戠粶", addr: [3, 1] }, - { name: "鏈夌嚎缃戠粶", addr: [3, 2] }, - { name: "璁惧淇℃伅", addr: [6] }, - { name: "鏃ユ湡鏃堕棿", addr: [1] }, - { name: "NTP鏍℃椂", addr: [1, 0] }, - { name: "鎵嬪姩鏍℃椂", addr: [1, 1] }, - { name: "閿洏鍜岃瑷�", addr: [4] }, - { name: "绯荤粺璇█", addr: [4, 0] }, - { name: "閿洏绠$悊", addr: [4, 1] } + // { name: "璐︽埛", addr: [0] }, + // { name: "閫氱敤璁剧疆", addr: [5] }, + // { name: "鏃堕棿褰曞儚鏃堕暱", addr: [5, 0] }, + // { name: "浜嬩欢澹伴煶", addr: [5, 1] }, + // { name: "涓�у寲璁剧疆", addr: [5, 2] }, + { name: "闆嗙兢绠$悊", addr: ["闆嗙兢绠$悊"] }, + { name: "缃戠粶璁剧疆", addr: ["缃戠粶璁剧疆"] }, + { name: "鏃犵嚎缃戠粶", addr: ["缃戠粶璁剧疆", 1] }, + { name: "鏈夌嚎缃戠粶", addr: ["缃戠粶璁剧疆", 2] }, + { name: "璁惧淇℃伅", addr: ["璁惧淇℃伅"] }, + { name: "鏃ユ湡鏃堕棿", addr: ["鏃ユ湡鏃堕棿"] }, + { name: "NTP鏍℃椂", addr: ["鏃ユ湡鏃堕棿", 0] }, + { name: "鎵嬪姩鏍℃椂", addr: ["鏃ユ湡鏃堕棿", 1] }, + { name: "閿洏鍜岃瑷�", addr: ["閿洏鍜岃瑷�"] }, + { name: "绯荤粺璇█", addr: ["閿洏鍜岃瑷�", 0] }, + { name: "閿洏绠$悊", addr: ["閿洏鍜岃瑷�", 1] } ], inputNickName: "", showHourInput: false, @@ -583,74 +582,85 @@ settime: "", weekday: "", menuArr: [ - // { - // name: "璐︽埛", - // icon: "\ue6de", - // imgUrl: "/images/settings/璐︽埛-钃�.png", - // blackIcon: "/images/settings/榛戣壊涓�绾con/璐︽埛.png", - // whiteIcon: "/images/settings/鐧借壊涓�绾con/璐︽埛.png", - // }, + { + name: "璐︽埛", + icon: "\ue6de", + imgUrl: "/images/settings/璐︽埛-钃�.png", + blackIcon: "/images/settings/榛戣壊涓�绾con/璐︽埛.png", + whiteIcon: "/images/settings/鐧借壊涓�绾con/璐︽埛.png", + hidden: true + }, { name: "鏃ユ湡鏃堕棿", icon: "\ue6ff", imgUrl: "/images/settings/鏃堕棿鏃ユ湡.png", blackIcon: "/images/settings/榛戣壊涓�绾con/鏃堕棿淇℃伅.png", - whiteIcon: "/images/settings/鐧借壊涓�绾con/鏃堕棿鏃ユ湡.png" + whiteIcon: "/images/settings/鐧借壊涓�绾con/鏃堕棿鏃ユ湡.png", + hidden: false }, { name: "闆嗙兢绠$悊", icon: "\ue6df", imgUrl: "/images/settings/闆嗙兢绠$悊.png", blackIcon: "/images/settings/榛戣壊涓�绾con/闆嗙兢绠$悊.png", - whiteIcon: "/images/settings/鐧借壊涓�绾con/闆嗙兢绠$悊.png" + whiteIcon: "/images/settings/鐧借壊涓�绾con/闆嗙兢绠$悊.png", + hidden: false }, { name: "缃戠粶璁剧疆", icon: "\ue6dd", imgUrl: "/images/settings/缃戠粶璁剧疆.png", blackIcon: "/images/settings/榛戣壊涓�绾con/缃戠粶璁剧疆.png", - whiteIcon: "/images/settings/鐧借壊涓�绾con/缃戠粶璁剧疆.png" + whiteIcon: "/images/settings/鐧借壊涓�绾con/缃戠粶璁剧疆.png", + hidden: false }, { name: "閿洏鍜岃瑷�", icon: "\ue6dc", imgUrl: "/images/settings/閿洏鍜岃瑷�.png", blackIcon: "/images/settings/榛戣壊涓�绾con/閿洏鍜岃瑷�.png", - whiteIcon: "/images/settings/鐧借壊涓�绾con/閿洏鍜岃瑷�.png" + whiteIcon: "/images/settings/鐧借壊涓�绾con/閿洏鍜岃瑷�.png", + hidden: false }, { name: "閫氱敤璁剧疆", icon: "\ue6db", imgUrl: "/images/settings/閫氱敤璁剧疆.png", blackIcon: "/images/settings/榛戣壊涓�绾con/閫氱敤璁剧疆.png", - whiteIcon: "/images/settings/鐧借壊涓�绾con/閫氱敤璁剧疆.png" + whiteIcon: "/images/settings/鐧借壊涓�绾con/閫氱敤璁剧疆.png", + hidden: true }, - // { - // name: "璁惧淇℃伅", - // icon: "\ue756", - // imgUrl: "/images/settings/璁惧淇℃伅.png", - // blackIcon: "/images/settings/榛戣壊涓�绾con/璁惧淇℃伅.png", - // whiteIcon: "/images/settings/鐧借壊涓�绾con/璁惧淇℃伅.png", - // }, + { + name: "璁惧淇℃伅", + icon: "\ue756", + imgUrl: "/images/settings/璁惧淇℃伅.png", + blackIcon: "/images/settings/榛戣壊涓�绾con/璁惧淇℃伅.png", + whiteIcon: "/images/settings/鐧借壊涓�绾con/璁惧淇℃伅.png", + hidden: false + }, { name: "鎺堟潈绠$悊", icon: "\ue7e9;", imgUrl: "/images/settings/鎺堟潈绠$悊.png", blackIcon: "/images/settings/榛戣壊涓�绾con/鎺堟潈绠$悊.png", - whiteIcon: "/images/settings/鐧借壊涓�绾con/鎺堟潈绠$悊.png" + whiteIcon: "/images/settings/鐧借壊涓�绾con/鎺堟潈绠$悊.png", + hidden: false }, { name: "鍩熷悕绠$悊", icon: "\ue6db", imgUrl: "/images/settings/閫氱敤璁剧疆.png", blackIcon: "/images/settings/榛戣壊涓�绾con/閫氱敤璁剧疆.png", - whiteIcon: "/images/settings/鐧借壊涓�绾con/閫氱敤璁剧疆.png" + whiteIcon: "/images/settings/鐧借壊涓�绾con/閫氱敤璁剧疆.png", + hidden: false } - ], + ].filter((item) => { + return !item.hidden + }), accountArr: [], jpgArr: [], isNtp: false, - activeIndex: 0, + activeIndex: "鏃ユ湡鏃堕棿", clockTimer: null, inputHour: "", inputMin: "", @@ -1033,11 +1043,13 @@ }, openMenu(i) { this.activeIndex = i - if (this.activeIndex == 1) { + if (this.activeIndex == "鏃ユ湡鏃堕棿") { this.initClockConf() } + console.log(this.activeIndex) }, openWelcome(i) { + console.log("welcome", i) this.showWelcome = false this.openMenu(i) }, @@ -1106,10 +1118,10 @@ } else { this.openWelcome(addr[0]) this.$nextTick(() => { - if (addr[0] == 1) { + if (addr[0] == "鏃ユ湡鏃堕棿") { return } - this.$refs[`view_${addr[0]}`].openRight(addr[1]) + this.$refs[`${addr[0]}`].openRight(addr[1]) }) } }, -- Gitblit v1.8.0