From b5e2e236828b7fbc0e8f2bdbf66651ad8907e3b1 Mon Sep 17 00:00:00 2001 From: heyujie <516346543@qq.com> Date: 星期三, 21 七月 2021 16:40:17 +0800 Subject: [PATCH] all --- src/pages/vindicate/views/backUp.vue | 39 ++++++++++++++++++--------------------- 1 files changed, 18 insertions(+), 21 deletions(-) diff --git a/src/pages/maintain/views/backUp.vue b/src/pages/vindicate/views/backUp.vue similarity index 89% rename from src/pages/maintain/views/backUp.vue rename to src/pages/vindicate/views/backUp.vue index 6f2d951..d91eea3 100644 --- a/src/pages/maintain/views/backUp.vue +++ b/src/pages/vindicate/views/backUp.vue @@ -2,19 +2,14 @@ <div class="all"> <div class="backup-content"> <div class="backup-center" ref="left"> - <div class="menu-item" @click="openRight(0)"> + <div class="menu-item" @click="openRight(i)" v-for="(item, i) in tabList" :class="activePage == i ? 'menu-item-active' : ''" + :key="i"> <div class="con"> - <span class="icon iconfont"></span> - <span class="menu-text">鑷姩澶囦唤璁剧疆</span> + <span class="icon iconfont">{{ item.icon }}</span> + <span class="menu-text">{{ item.name }}</span> </div> </div> - <div class="menu-item" @click="openRight(1)"> - <div class="con"> - <span class="icon iconfont"></span> - - <span class="menu-text">浠庡浠戒腑鎭㈠</span> - </div> - </div> + </div> <div class="backup-right"> <div class="auto" v-if="activePage == 0"> @@ -82,10 +77,9 @@ mounted() {}, data() { return { - langList: [ - { name: "绠�浣撲腑鏂�" }, - { name: "鑻辨枃" }, - { name: "绻佷綋涓枃锛堥娓級" }, + tabList: [ + { name: "鑷姩澶囦唤璁剧疆", icon: "\ue6f2" }, + { name: "浠庡浠戒腑鎭㈠", icon: "\ue6db" }, ], fileList: [ { time: "2010-10-02 12:30:09", name: "鏂囦欢1" }, @@ -110,13 +104,8 @@ }; }, methods: { - openRight(typ) { - const es = document.getElementsByClassName("menu-item"); - es[this.activePage].style.backgroundColor = "#f8f8f8"; - es[this.activePage].style.color = "rgba(54, 54, 54, 1)"; - es[typ].style.backgroundColor = "rgba(61, 104, 225, 1)"; - es[typ].style.color = "#fff"; - this.activePage = typ; + openRight(i) { + this.activePage = i; }, handleChange() {}, backUpNow() { @@ -193,6 +182,14 @@ } } } + .menu-item-active { + color: #fff; + background-color: rgba(61, 104, 225, 1); + } + .menu-item:hover { + color: #fff; + background-color: rgba(61, 104, 225, 1); + } } .backup-right { flex: 1; -- Gitblit v1.8.0