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

export default {
  name: 'App',
  components: {
    AppContainer
  },
  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]"
  >
    <AppContainer>
      <router-view/>
    </AppContainer>
  </div>
  <div
    v-if="outerPage"
    class="relative"
  >
    <router-view/>
  </div>
</template>