<script setup lang="ts">
import { useAuthStore } from '@/stores/useAuthStore'

definePage({
  name: 'root',
  meta: {
    layout: 'portal',
    requiresAuth: false,
  },
})

const router = useRouter()
const authStore = useAuthStore()

onMounted(async () => {
  if (!authStore.isInitialized) {
    await authStore.initialize()
  }

  if (authStore.isAuthenticated) {
    router.replace('/evenementen')
  }
})
</script>

<template>
  <VRow justify="center">
    <VCol
      cols="12"
      md="8"
      lg="6"
    >
      <VCard class="text-center pa-6">
        <VCardTitle class="text-h5">
          Crewli Portal
        </VCardTitle>
        <VCardSubtitle>
          Welkom bij het Crewli Portal
        </VCardSubtitle>
        <VCardText class="mt-4">
          <VBtn
            color="primary"
            to="/login"
          >
            Inloggen
          </VBtn>
        </VCardText>
      </VCard>
    </VCol>
  </VRow>
</template>
