图表

杨磊

5 天以前 b50a2e6d9385a88916fc43cddb18842e5036f565

 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: "荣誉奖项",
          path: "/honor",
          icon: "el-icon-s-home",
          icon: rongyu,
          activeIcon: rongyu1,
        },
        {
          name: "学生名录",
          path: "/directory",
          icon: "el-icon-s-home",
          icon: mulu,
          activeIcon: mulu1,
        },
      ],
    };
@@ -68,11 +86,15 @@
</script>

<style lang="less" scoped>

.iconBox{
  width: 70px;
  height: 70px;
  position: relative;
}
.homeLayoutBox {
  width: 100%;
  height: 100%;
  display: flex;

  // background-image: url("@/assets/images/homeBg.png");
  // background-repeat: no-repeat;
  // background-size: 100% 95%;
@@ -82,7 +104,7 @@
  }

  .active {
    background: #6F5A3A;
    background: #6f5a3a;
    color: #fff;
  }

@@ -92,6 +114,7 @@
    background: #937950;
    display: flex;
    flex-direction: column;
    font-family: Alimama DongFangDaKai;

    .leftMenuTitle {
      width: 100%;
@@ -113,7 +136,7 @@
      border-bottom: 1px solid #fff;
    }

    .leftMenuList>menuItem:first-child {
    .leftMenuList > menuItem:first-child {
      border-top: 1px solid #fff;
    }

@@ -134,8 +157,8 @@
        color: #decaac;
        font-size: 24px;
        border-bottom: 1px solid #b9a587;
        height: 180px;

        height: 18vh;
        cursor: pointer;
        .menuText {
          line-height: 50px;
        }