<template>
  <div>
    <Message class="w-full" severity="error" v-if="errorMessage">{{ errorMessage }}</Message>
    <Message class="w-full" severity="success" v-if="successMessage">{{ successMessage }}</Message>
    <h1 class="text-2xl py-3">Kérjük, add meg az e-mail címedet</h1>
    <div>Ha már korábban volt foglalásod vagy regisztrációd akkor azt az e-mail címet add meg.</div>

    <Card class="w-full max-w-sm m-auto mt-3">
      <template #content>
        <div class="flex flex-col gap-5 items-center p-2 relative w-full">
          <CardLoading v-if="isLoading" />
          <FloatLabel variant="on" class="w-full">
            <InputText id="email_label" v-model="account" autocomplete="off" class="w-full" />
            <label for="email_label">E-mail cím</label>
          </FloatLabel>
          <div class="text-xs">Az e-mail cím megadásával elfogadod a felhasználási feltételeinket. Az
            adatvédelemről az Adatvédelmi nyilatkozat linken olvashatsz.</div>
          <Button @click="sendAccount()" class="w-full" icon="pi pi-check-circles">Megadom az e-mail
            címem</Button>
        </div>
      </template>
    </Card>
    <div class="text-center text-xs mt-5" v-if="configStore?.config">
      <NuxtLink :to="'/page/' + configStore?.config?.adatvedelem_id">Adatvédelmi nyilatkozat</NuxtLink>
    </div>
  </div>
</template>

<script lang="ts" setup>
const token = useAuthToken()
const configStore = useMyConfigStore()
const { apiFetch } = useApi()
const errorMessage = ref()
const successMessage = ref()
const isLoading = ref()
const account = ref()
const router = useRouter()

async function sendAccount() {
    errorMessage.value = false
    successMessage.value = false
    isLoading.value = true

    const { data } = await apiFetch('/authRequest', {
        method: "post",
        body: {
            account: account.value
        }
    })

    if (data.value?.error) {
        errorMessage.value = data.value.message
    }

    if (data.value?.success) {

        window.localStorage.setItem('codePrefix', data.value.codePrefix)
        window.localStorage.setItem('codeExpire', data.value.codeExpire)
        window.localStorage.setItem('account', data.value.account)

        if (data.value?.message) {
            successMessage.value = data.value.message
        }

        router.push({ path: '/login/code',force:true })
    }

    isLoading.value = false
}

onMounted(async () => {
    // Ha már be van jelentkezve, irányítsuk a főoldalra
    const { loadToken, getToken } = useAuthToken()
    await loadToken()
    const token = getToken()
    if (token) {
        return navigateTo('/')
    }

    account.value = window.localStorage.getItem('account')
})

</script>

<style></style>