{{-- @extends('frontend.layouts.app') --}}
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Negocios La Pieza.DO | Recuperación de Contraseña</title>
<meta name="description" content="Recuperación de Contraseña para negocios de La Pieza.DO">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Favicon -->
<link rel="shortcut icon" type="image/x-icon" href="{{ static_asset('img/favicon.png') }}">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="{{ static_asset('css/bootstrap.min.css') }}">
<!-- Fontawesome CSS -->
<link rel="stylesheet" href="{{ static_asset('css/fontawesome-all.min.css') }}">
<!-- Flaticon CSS -->
<link rel="stylesheet" href="{{ static_asset('font/flaticon.css') }}">
<!-- Google Web Fonts -->
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet">
<!-- Custom CSS -->
<link rel="stylesheet" href="{{ static_asset('css/style.css') }}">
</head>
<body>
<div id="preloader" class="preloader">
<div class='inner'>
<div class='line1'></div>
<div class='line2'></div>
<div class='line3'></div>
</div>
</div>
<section class="fxt-template-animation fxt-template-layout9" data-bg-image="{{ static_asset('img/figure/bg9-l.jpg') }}">
<div class="container">
<div class="row align-items-center justify-content-center">
<div class="col-lg-3">
<div class="fxt-header">
<a href="{{ route('home') }}" class="fxt-logo"><img src="{{ static_asset('img/logo-9.png') }}" alt="Logo"></a>
</div>
</div>
<div class="col-lg-6">
<div class="fxt-content">
<h2>Recuperación de la Cuenta</h2>
<div class="fxt-form">
<form method="POST" action="{{ route('password.email') }}">
@csrf
<div class="form-group">
<div class="fxt-transformY-50 fxt-transition-delay-1">
<input type="email" id="email" class="form-control" name="email" placeholder="Correo Electrónico" required="required">
@if ($errors->has('email'))
<span class="invalid-feedback" role="alert">
<strong>{{ $errors->first('email') }}</strong>
</span>
@endif
</div>
</div>
<div class="form-group">
<div class="fxt-transformY-50 fxt-transition-delay-4">
<button type="submit" id="submit-button" class="fxt-btn-fill">Envíame un Correo</button>
</div>
</div>
</form>
</div>
<div class="fxt-footer">
<div class="fxt-transformY-50 fxt-transition-delay-9">
<p>No tienes una cuenta?<a href="{{ route('register') }}" class="switcher-text2 inline-text">Registrate</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- jquery-->
<script src="{{ static_asset('js/jquery.min.js') }}"></script>
<!-- Bootstrap js -->
<script src="{{ static_asset('js/bootstrap.min.js') }}"></script>
<!-- Imagesloaded js -->
<script src="{{ static_asset('js/imagesloaded.pkgd.min.js') }}"></script>
<!-- Validator js -->
<script src="{{ static_asset('js/validator.min.js') }}"></script>
<!-- Custom Js -->
<script src="{{ static_asset('js/main.js') }}"></script>
<!-- SweetAlert2 -->
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
$(document).ready(function () {
$('#submit-button').on('click', function (e) {
e.preventDefault();
// Limpia mensajes de error previos
$('#email-error').hide().find('strong').text('');
// Obtén el botón y el valor del correo electrónico
var $button = $('#submit-button');
var email = $('#email').val();
// Agrega un loader al botón y deshabilítalo
$button.prop('disabled', true).html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Enviando...');
// Realiza la solicitud AJAX
$.ajax({
url: "{{ route('password.email') }}", // Ruta a la que se enviará la solicitud
method: "POST", // Método HTTP
data: {
_token: "{{ csrf_token() }}", // Token CSRF para seguridad
email: email // Correo electrónico ingresado
},
success: function (response) {
// Muestra un mensaje de éxito
Swal.fire({
icon: 'success',
title: '¡Éxito!',
text: response.message, // Mensaje del servidor
toast: true,
position: 'bottom-left',
showConfirmButton: false,
timer: 3000,
timerProgressBar: true,
}).then(() => {
// Reemplaza el contenido de la página con la vista renderizada
$('body').html(response.html);
});
},
error: function (xhr) {
// Maneja errores
console.error(xhr.responseJSON); // Muestra el error en la consola
if (xhr.responseJSON && xhr.responseJSON.message) {
Swal.fire({
icon: 'error',
title: 'Error',
text: xhr.responseJSON.message, // Mensaje del servidor
toast: true,
position: 'bottom-left',
showConfirmButton: false,
timer: 3000,
timerProgressBar: true,
});
} else {
Swal.fire({
icon: 'error',
title: 'Error',
text: 'Ocurrió un error inesperado. Por favor, inténtalo de nuevo.',
toast: true,
position: 'bottom-left',
showConfirmButton: false,
timer: 3000,
timerProgressBar: true,
});
}
// Habilita el botón y restaura el texto original
$button.prop('disabled', false).html('Envíame un Correo');
},
complete: function () {
// En caso de éxito o error, habilita el botón si no se redirige
$button.prop('disabled', false).html('Envíame un Correo');
}
});
});
});
</script>
</body>
</html>
|