From a5abb70a428f59894fc9ee4330f0033d6fe93a8b Mon Sep 17 00:00:00 2001 From: 杨磊 <505174330@qq.com> Date: 星期四, 24 四月 2025 18:38:13 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/wyyDatabase --- src/layout/index.vue | 45 +++++++++++++++++++++++++++++++++++---------- 1 files changed, 35 insertions(+), 10 deletions(-) diff --git a/src/layout/index.vue b/src/layout/index.vue index 1bfab19..f26e3d5 100644 --- a/src/layout/index.vue +++ b/src/layout/index.vue @@ -7,10 +7,16 @@ <p>澶氱淮搴︽暟鎹簱</p> </div> <div class="leftMenuList"> - <div class="menuItem" :class="{ active: $route.path == item.path }" v-for="(item, index) in menuList" - :key="index" @click="$router.push(item.path)"> - <div> - <i :class="item.icon"></i> + <div + class="menuItem" + :class="{ active: $route.path == item.path }" + v-for="(item, index) in menuList" + :key="index" + @click="$router.push(item.path)" + > + <div class="iconBox"> + <img class="autoImg" :src="item.activeIcon" alt="" v-if="$route.path == item.path"> + <img class="autoImg" :src="item.icon" alt="" v-else> </div> <div class="menuText">{{ item.name }}</div> </div> @@ -27,6 +33,14 @@ <script> import { mapState } from "vuex"; +import nianpu1 from "@/assets/images/menuIcon/nianpu1.png"; +import nianpu from "@/assets/images/menuIcon/nianpu.png"; +import mulu from "@/assets/images/menuIcon/mulu.png"; +import mulu1 from "@/assets/images/menuIcon/mulu1.png"; +import rongyu from "@/assets/images/menuIcon/rongyu.png"; +import rongyu1 from "@/assets/images/menuIcon/rongyu1.png"; +import xueshu from "@/assets/images/menuIcon/xueshu.png"; +import xueshu1 from "@/assets/images/menuIcon/xueshu1.png"; export default { computed: { ...mapState(["userInfo", "keepAliveList"]), @@ -44,22 +58,26 @@ { name: "骞磋氨", path: "/chronology", - icon: "el-icon-s-home", + icon: nianpu1, + activeIcon: nianpu, }, { name: "瀛︽湳鎴愭灉", path: "/achievements", - icon: "el-icon-s-home", + icon: xueshu, + activeIcon: xueshu1, }, { name: "鑽h獕濂栭」", path: "/honor", - icon: "el-icon-s-home", + icon: rongyu, + activeIcon: rongyu1, }, { name: "瀛︾敓鍚嶅綍", path: "/directory", - icon: "el-icon-s-home", + icon: mulu, + activeIcon: mulu1, }, ], }; @@ -68,6 +86,12 @@ </script> <style lang="less" scoped> + +.iconBox{ + width: 70px; + height: 70px; + position: relative; +} .homeLayoutBox { height: 100%; display: flex; @@ -80,7 +104,7 @@ } .active { - background: #6F5A3A; + background: #6f5a3a; color: #fff; } @@ -112,7 +136,7 @@ border-bottom: 1px solid #fff; } - .leftMenuList>menuItem:first-child { + .leftMenuList > menuItem:first-child { border-top: 1px solid #fff; } @@ -134,6 +158,7 @@ font-size: 24px; border-bottom: 1px solid #b9a587; height: 18vh; + cursor: pointer; .menuText { line-height: 50px; } -- Gitblit v1.9.1