mirror of
https://github.com/Paris-est-Ludique/ForceOrange.git
synced 2025-06-08 01:04:20 +02:00
88 lines
2.5 KiB
Vue
88 lines
2.5 KiB
Vue
<script setup lang="ts">
|
||
import { object, string, type InferType } from 'yup'
|
||
import type { Database } from '@pel/supabase/types'
|
||
import type { FormSubmitEvent } from '#ui/types'
|
||
|
||
definePageMeta({
|
||
name: 'SigninForgot',
|
||
})
|
||
|
||
const config = useRuntimeConfig()
|
||
const router = useRouter()
|
||
const toast = useToast()
|
||
|
||
const loading = ref(false)
|
||
const sended = ref(false)
|
||
const { auth } = useSupabaseClient<Database>()
|
||
|
||
const { inputStyle, formGroupStyle } = useFoStyle()
|
||
|
||
const schema = object({
|
||
email: string().lowercase().trim().email('Il semble que l\'email ne soit pas bon').required('Champ obligatoire'),
|
||
})
|
||
|
||
type Schema = InferType<typeof schema>
|
||
|
||
const state = reactive({
|
||
email: undefined,
|
||
})
|
||
|
||
async function onSignin(event: FormSubmitEvent<Schema>) {
|
||
loading.value = true
|
||
const formSubmit = event.data
|
||
|
||
const { data, error } = await auth.resetPasswordForEmail(formSubmit.email, {
|
||
redirectTo: `${config.public.baseUrl}/profile/auth/reset`,
|
||
})
|
||
|
||
if (error) {
|
||
console.log(error)
|
||
toast.add({
|
||
title: 'Erreur',
|
||
description: 'Une erreur est survenue lors de l\'envoi du lien de récupération',
|
||
color: 'red',
|
||
})
|
||
} else {
|
||
console.log(data)
|
||
|
||
toast.add({
|
||
title: 'Va regarder ta boite de courriel !',
|
||
description: 'Nous avons envoyé un lien de récupération à votre adresse courriel',
|
||
color: 'orange',
|
||
})
|
||
}
|
||
|
||
loading.value = false
|
||
sended.value = true
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<UCard class="container mx-auto max-w-screen-md">
|
||
<h1 class="text-2xl uppercase mb-4">Réinitialiser votre mot de passe</h1>
|
||
<p>Nous pouvons envoyer un lien de récupération à l’adresse courriel associé à votre compte.</p>
|
||
|
||
<UForm :schema="schema" :state="state" @submit="onSignin" class="my-8">
|
||
<UFormGroup :ui="formGroupStyle.ui" label="Adresse courriel" name="email">
|
||
<UInput :ui="inputStyle.ui" v-bind="inputStyle.attrs" v-model="state.email" />
|
||
</UFormGroup>
|
||
|
||
<p class="mt-8 text-center">
|
||
<UButton type="submit" variant="soft" :disabled="loading" :loading="loading">Récupérer mon compte</UButton>
|
||
</p>
|
||
</UForm>
|
||
</UCard>
|
||
|
||
<UCard v-if="sended">
|
||
<h1 class="text-2xl uppercase mb-8">C’est partit</h1>
|
||
<p>
|
||
Si nous avons connaissance de cette adresse, vous devriez recevoir un courriel contenant les instructions pour
|
||
récupérer votre compte Force Orange.
|
||
</p>
|
||
<p class="my-8">
|
||
<UButton to="/" variant="ghost">
|
||
Fermer cette page
|
||
</UButton>
|
||
</p>
|
||
</UCard>
|
||
</template> |