<script>
import {mapGetters, mapMutations} from 'vuex'
import MenuContainer from "@frames/Menu/MenuContainer.vue"

export default {
  name: 'App',
  components: {
    MenuContainer
  },
  data() {
    return {}
  },
  computed: {
    ...mapGetters('auth', ['inited']),
    pageName() {
      return this.$route.name
    },
    outerPages () {
      return ['auth', '404']
    },
    innerPage () {
      return !this.outerPages.includes(this.pageName) && this.inited
    },
    outerPage () {
      return this.outerPages.includes(this.pageName) && this.inited
    }
  },
  mounted() {
    this.initAuth(localStorage.getItem('token'))
  },
  methods: {
    ...mapMutations('auth', ['initAuth'])
  }
}

</script>

<template>
  <div
    v-if="innerPage"
    class="flex min-h-[100vh]"
  >
    <MenuContainer>
      <router-view />
    </MenuContainer>
  </div>
  <div
    v-if="outerPage"
    class="relative"
  >
    <router-view />
  </div>
</template>
