<template>
  <el-menu
    style="height: calc(100vh - 100px);overflow-y:scroll"
    :default-active="getCurrentPath"
    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" @click="itemClick(item.path)">
      <span slot="title">{{item.meta.title}}</span>
    </el-menu-item>
  </el-menu>
  
</template>
<script>
export default {
  data () {
    return {
      activePath:'',
      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
      this.activePath = active_modules.apps[0].path
    },
    itemClick(path) {
      window.sessionStorage.setItem('currentPath',path)
    },
  },
  
  created () {    
    this.activePath = this.$route.path
    this.getAuthList()
  },
  watch:{
    $route(){
      if(this.$route.path == '/submiteditmag_detail' || this.$route.path == '/upload_archives' || this.$route.path == '/role_edit') {
        return 
      }
      this.activePath = this.$route.path
    },
    activePath: {
      handler(val) {
        window.sessionStorage.setItem('currentPath',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>