<template>
  <div class="Dashboard Home-Dashboard">
    <CustomerRegister
      v-if="show"
      class="Dashboard-Row Dashboard-DataCard"
      :isAdmin="isAdmin"
    />
  </div>
</template>

<script>
import CustomerRegister from '../Dashboard/CustomerRegister/CustomerRegister';
import { mapGetters, mapActions } from 'vuex';

export default {
  name: 'Home-Dashboard',
  components: {
    CustomerRegister,
  },
  data() {
    return {
      show: false,
    };
  },
  computed: {
    ...mapGetters(['asyncRoutes']),
    isAdmin() {
      return this.$route.meta.btns && this.$route.meta.btns['0001']
        ? true
        : false;
    },
  },
  mounted() {
    let item = this.asyncRoutes.find(
      item => item.menuCode === process.env.VUE_APP_REGISTER_DASHBOARD_CODE
    );
    if (item) {
      this.fetchReportList({
        isAdmin: this.isAdmin ? 1 : 0,
      });
      this.show = true;
    }
  },
  methods: {
    ...mapActions('Dashboard', ['fetchReportList']),
  },
};
</script>

<style lang="scss">
.Home-Dashboard.Dashboard {
  padding: 22px 34px 0;
  overflow-y: hidden;
}
</style>