<template>
  <el-menu
    style="height: calc(100vh - 100px)"
    :default-active="activePath"
    class="el-menu-vertical-demo"
    @open="handleOpen"
    @close="handleClose"
    background-color="#F5F5F5"
    text-color="#666"
    active-text-color="#fff"
    router>
     <el-menu-item v-for="item in auth_data" :key="item.systemappid" :index="item.path">
      <span slot="title">{{item.meta.title}}</span>
    </el-menu-item>
  </el-menu>
  
</template>
<script>
export default {
  data () {
    return {
      activePath:null,
      auth_data:'',
    }
  },
  computed: {
    getCurrentPath() {
      if(this.activePath) {
        return window.sessionStorage.getItem('currentPath')
      }
    }
  },
  methods:{
    handleOpen () {},
    handleClose () {},
    // 查询应用授权
    getAuthList () {
      let active_modules = JSON.parse(sessionStorage.getItem('active_modules'))
      this.auth_data = active_modules.apps
      if (this.activePath) {
        this.activePath = active_modules.apps[0].path
      } else {
        this.activePath = this.$route.path
      }
    }
  },
  
  mounted () {    
    this.getAuthList()
  },
  watch:{
    $route(to,from){
      if (!to.meta.keeproute) {
        this.activePath = this.$route.path
      }
    }
  }
}

</script>
<style scoped>
.is-active{
  margin: 10px;
  border-radius: 4px;
  background: #4F7BFD !important;
}
.el-menu-item {
  height: 45px !important;
  line-height: 45px !important;
  margin: 10px;
  border-radius: 4px;
  text-align: center;
}
</style>