<template>
    <div class="container-xxl flex-grow-1 container-p-y pb-0">
        <MainEventCalendar />
        <MemberManagement v-if="isAdmin(user)" />
    </div>
</template>

<script setup>
    import MainEventCalendar from '@/components/main/MainEventCalendar.vue';
    import MemberManagement from '@/components/main/MemberManagement.vue';
    import { useUserInfoStore } from '@/stores/useUserInfoStore';
    import { inject, onMounted, ref } from 'vue';
    import $api from '@api';

    const userStore = useUserInfoStore();
    const user = ref();

    const isAdmin = user => {
        return user?.value?.role === 'ROLE_ADMIN' ? true : false;
    };

    onMounted(async () => {
        await userStore.userInfo();
        user.value = userStore.user;
    });
</script>
