<template>
  <el-container v-if="$cookies.isKey(GLOBAL.user_key)">
    <el-aside>
      <el-row>
        <el-col :span="12">
          <el-image src="/circle-star.svg">
          </el-image>
          <h1 class="el-dialog--center"></h1>
          <el-menu @select="selectItem" :router="true" :default-active="$route.path">
            <el-menu-item :index="localePath('/'+item,$i18n.locale)" v-for="item in menus" :key="item">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>{{$t('menus.'+item)}}</span>
              </template>
            </el-menu-item>
          </el-menu>
        </el-col>
      </el-row>
    </el-aside>
    <el-container>
      <el-header>
        <lang/>
      </el-header>
      <el-main>
        <nuxt/>
      </el-main>
    </el-container>
  </el-container>
</template>

<script lang="ts">
  import Vue from 'vue'
  import Lang from '~/components/lang.vue'

  export default Vue.extend({
      name: 'mainmenu',
      components: { Lang },
      methods: {
        selectItem(index: string, indexPath: Array<String>) {
          console.info(index, indexPath)
        }
      },
      data() {
        return {
        }
      },
      computed:{
        menus(){
          return this.$store.state.menus.menus
        }
      },
      mounted() {
        if(this.$cookies.isKey(this.GLOBAL.user_key)){
          this.$router.push(this.localePath('/document'))
        }else{
          this.$router.push(this.localePath('/account'))
        }
      }
    }
  )

</script>
