<template>
  <div style="position:relative;">
    <el-scrollbar>
      <el-aside class="app-aside" :width="asideCollapsed?'auto':'260px'">
        <el-menu :collapse-transition="false" :collapse="asideCollapsed" :default-active="$route.path" unique-opened>
          <template>
            <el-submenu v-for="(item,index1) in $store.state.base.sysMenus" :key="item.uuid " :index="index1+''">
              <template slot="title">
                <i :class="'el-icon-fa-'+item.iconUrl"/>
                <span>{{ item.name }}</span>
              </template>
              <el-menu-item v-for="(child,index2) in item.children" :index="index1+'-'+index2" :key="child.permCode"
                            @click.native="selectMenu(child)">
                <i :class="'el-icon-fa-'+child.iconUrl"/>
                <span>{{ child.name }}</span>
              </el-menu-item>
            </el-submenu>
          </template>
        </el-menu>
      </el-aside>
    </el-scrollbar>
    <p class='version_btn'>
      <el-button size="small" icon='el-icon-more' @click="asideCollapsed=!asideCollapsed"/>
    </p>
    <div class="copyright">
      <div v-if="!asideCollapsed && version">版本号 {{ version }}</div>
      <div v-if="!asideCollapsed">{{ companyInfo }}</div>
    </div>
  </div>
</template>

<script>
  import config from "@/config.js";

  export default {
    data() {
      return {
        companyInfo: config.companyInfo,
        version: config.version,
        asideCollapsed: false
      };
    },
    mounted() {
    },
    methods: {
      selectMenu({name, funcUrl}) {
        // TODO 打开外链
        // let http = funcUrl.indexOf("http://");
        // if (http > -1) {
        //   window.open(funcUrl.substr(http));
        //   return;
        // }
        this.$tabView.addView(name, funcUrl);
      }
    }
  };
</script>

<style>
</style>
