ZZJ
2021-10-13 878ce80ef3ca88a2c108fbc713cd6ea461c44de1
src/pages/shuohuangMonitorAnalyze/components/leftNav.vue
@@ -9,44 +9,46 @@
      @open="handleOpen"
      @close="handleClose"
      :collapse="isCollapse"
      :default-active="activeIndex"
      @select="handleSelect"
    >
      <el-menu-item index="1">
        <i class="el-icon-menu"></i>
      <el-menu-item index="guideIndex" v-show="isAdmin">
        <i class="iconfont iconshouye"></i>
        <span slot="title">首页</span>
      </el-menu-item>
      <el-menu-item index="searchForVideoAnalyze">
        <i class="el-icon-menu"></i>
        <i class="iconfont iconshipin2"></i>
        <span slot="title">视频分析检索</span>
      </el-menu-item>
      <el-menu-item index="taskManage">
        <i class="el-icon-menu"></i>
      <el-menu-item index="taskManage" v-if="isAdmin">
        <i class="iconfont iconrenwu1"></i>
        <span slot="title">任务管理</span>
      </el-menu-item>
      <el-menu-item index="memberManage">
        <i class="el-icon-menu"></i>
      <el-menu-item index="memberManage" v-if="isAdmin">
        <i class="iconfont iconrenyuanguanli"></i>
        <span slot="title">人员管理</span>
      </el-menu-item>
      <el-menu-item index="configManage">
        <i class="el-icon-menu"></i>
      <el-menu-item index="configManage" v-if="isAdmin">
        <i class="iconfont iconicon-test4"></i>
        <span slot="title">配置管理</span>
      </el-menu-item>
      <el-submenu index="6">
        <template slot="title">
          <i class="el-icon-menu"></i>
          <i class="iconfont iconcunchu"></i>
          <span slot="title">转储管理</span>
        </template>
        <el-menu-item index="transferMemo">视频转储记录</el-menu-item>
        <el-menu-item index="transferDeviceManage">转储设备管理</el-menu-item>
        <el-menu-item index="lkgManage">LKJ数据管理</el-menu-item>
      </el-submenu>
      <el-submenu index="7">
      <el-submenu index="7" v-if="isAdmin">
        <template slot="title">
          <i class="el-icon-menu"></i>
          <i class="iconfont iconkeshihua"></i>
          <span slot="title">可视化大屏</span>
        </template>
        <el-menu-item index="7-1">任务大屏</el-menu-item>
        <el-menu-item index="7-2">隐患大屏</el-menu-item>
        <el-menu-item index="taskscreen">任务大屏</el-menu-item>
        <el-menu-item index="hiddendangerscreen">隐患大屏</el-menu-item>
      </el-submenu>
    </el-menu>
  </div>
@@ -65,19 +67,45 @@
      type: Function
    }
  },
  data () {
  computed: {
    isAdmin() {
      if (
        sessionStorage.getItem("userInfo") &&
        sessionStorage.getItem("userInfo") !== ""
      ) {
        let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username;
        return loginName === "admin" || loginName === "basic";
      }
      return false;
    },
  },
  data() {
    return {
      publicPath: process.env.BASE_URL,
      activeIndex: 'guideIndex'
    }
  },
  mounted() {
    // if (this.isAdmin) {
    //   if (!!sessionStorage.getItem('leftNavAct')) {
    //     console.log("leftNavAct")
    //     this.activeIndex = sessionStorage.getItem('leftNavAct');
    //   }
    // }
    this.activeIndex = this.isAdmin ? 'guideIndex' : 'searchForVideoAnalyze';
    this.$emit('menuChange', this.activeIndex);
  },
  methods: {
    handleSelect(index,indePath){
      this.$emit('menuChange',index);
    handleSelect(index, indePath) {
      this.activeIndex = index;
      sessionStorage.setItem('leftNavAct', this.activeIndex);
      this.$emit('menuChange', index);
    },
    handleOpen () {
    handleOpen() {
    },
    handleClose () {
    handleClose() {
    }
  }
@@ -87,6 +115,7 @@
<style lang="scss">
.left-nav {
  background: #fff;
  height: 100vh;
  h1 {
    display: flex;
    align-items: center;
@@ -95,13 +124,19 @@
    border-bottom: 1px solid #eee;
    color: rgb(0, 150, 250);
  }
  .el-menu-vertical-demo:not(.el-menu--collapse){
  .iconfont {
    padding-right: 10px;
  }
  .el-menu-vertical-demo:not(.el-menu--collapse) {
    width: 250px;
  }
  .el-menu-item,
  .el-submenu__title {
    text-align: left;
  }
  height: 100vh;
  .el-menu-item.is-active {
    color: #409eff;
    background-color: #ecf0fc;
  }
}
</style>