93 lines
2.7 KiB
Vue
93 lines
2.7 KiB
Vue
<template>
|
|
<v-container>
|
|
<v-form @submit.prevent="resetPassword">
|
|
<v-text-field
|
|
v-model="email"
|
|
label="Digite seu e-mail"
|
|
type="email"
|
|
required
|
|
:rules="[emailRules.required, emailRules.email]"
|
|
></v-text-field>
|
|
|
|
<v-btn color="primary" type="submit" :loading="isLoading" :disabled="isLoading || !isFormValid">Redefinir Senha</v-btn>
|
|
|
|
<v-alert v-if="errorMessage" type="error" dismissible>{{ errorMessage }}</v-alert>
|
|
<v-alert v-if="successMessage" type="success" dismissible>{{ successMessage }}</v-alert>
|
|
</v-form>
|
|
</v-container>
|
|
</template>
|
|
|
|
<script>
|
|
import { ref, computed } from "vue";
|
|
import authService from "@/services/authservice"; // importa o serviço de autenticação
|
|
|
|
export default {
|
|
setup() {
|
|
const email = ref(""); // Define o estado reativo para o e-mail
|
|
const isLoading = ref(false); // Indica se o processo está carregando
|
|
const errorMessage = ref(""); // Mensagem de erro, se ocorrer
|
|
const successMessage = ref(""); // Mensagem de sucesso
|
|
|
|
// Regras de validação para o campo de e-mail
|
|
const emailRules = {
|
|
required: value => !!value || "E-mail é obrigatório",
|
|
email: value => /.+@.+\..+/.test(value) || "E-mail inválido"
|
|
};
|
|
|
|
// Verifica se o formulário é válido
|
|
const isFormValid = computed(() => {
|
|
return emailRules.required(email.value) === true && emailRules.email(email.value) === true;
|
|
});
|
|
|
|
// Função para redefinir a senha
|
|
const resetPassword = async () => {
|
|
if (!isFormValid.value) return;
|
|
|
|
isLoading.value = true;
|
|
errorMessage.value = ""; // Limpa mensagens de erro antes de tentar
|
|
successMessage.value = ""; // Limpa mensagens de sucesso
|
|
|
|
try {
|
|
const response = await authService.recoverPassword(email.value); // Chama o serviço para recuperação de senha
|
|
successMessage.value = "E-mail enviado com sucesso. Verifique sua caixa de entrada."; // Mensagem de sucesso
|
|
console.log("E-mail enviado", response); // Log do sucesso
|
|
} catch (error) {
|
|
errorMessage.value = "Erro ao tentar recuperar senha. Tente novamente."; // Mensagem de erro
|
|
console.error("Erro ao tentar recuperar senha", error); // Log do erro
|
|
} finally {
|
|
isLoading.value = false; // Finaliza o estado de carregamento
|
|
}
|
|
};
|
|
|
|
return {
|
|
email,
|
|
resetPassword,
|
|
emailRules,
|
|
isLoading,
|
|
isFormValid,
|
|
errorMessage,
|
|
successMessage
|
|
};
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
/* Estilos personalizados */
|
|
.v-container {
|
|
max-width: 400px;
|
|
margin: 0 auto;
|
|
padding: 20px;
|
|
}
|
|
v-text-field {
|
|
width: 100%;
|
|
margin-bottom: 10px;
|
|
}
|
|
v-btn {
|
|
width: 100%;
|
|
}
|
|
v-alert {
|
|
margin-top: 10px;
|
|
}
|
|
</style>
|