<template>
    <div class="container-xxl flex-grow-1 container-p-y pb-0">
        <MainEventCalendar />
        <MemberManagement v-if="isAdmin" />
        <div class="row mt-4">
            <!-- 게시판 -->
            <BoardMain />
            <!-- 용어집 -->
            <main-word-dict />
            <!-- 투표 -->
            <main-vote />
        </div>
    </div>
</template>

<script setup>
    import MainEventCalendar from '@/components/main/MainEventCalendar.vue';
    import MemberManagement from '@/components/main/MemberManagement.vue';
    import MainWordDict from '@c/main/MainWordDict.vue';
    import BoardMain from '@c/main/BoardMain.vue';
    import MainVote from '@c/main/MainVote.vue';
    import { useUserInfoStore } from '@/stores/useUserInfoStore';
    import { onMounted, ref } from 'vue';

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

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

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