<template>
  <div id="app">
    <router-view v-if="isReload" />
  </div>
</template>

<script>
let timer = null

export default {
  name: 'App',

  provide() {
    return {
      reload: this.reload
    }
  },

  data() {
    return {
      isReload: true
    }
  },

  computed: {
    token() {
      return this.$store.state.user.token
    }
  },

  // watch: {
  //   token: {
  //     immediate: true,
  //     handler: function(v) {
  //       if (v) {
  //         this.refreshToken(v)
  //       } else {
  //         timer && clearTimeout(timer)
  //       }
  //     }
  //   }
  // },

  methods: {
    reload() {
      this.isReload = false
      this.$nextTick(() => {
        this.isReload = true
      })
    },

    // 定时检测token
    refreshToken() {
      timer && clearTimeout(timer)
      timer = setTimeout(() => {
        this.$store.dispatch('refreshToken')
      }, 1000)
    }
  }
}
</script>
<style lang="scss">
#app {
  width: 100%;
  height: 100%;
  // overflow: hidden;
}

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

.el-table::before {
  z-index: 0 !important;
}
</style>
