fede/AlquilaFacil
Public Access
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

Añade la capacidad de que setes un mail de recuperacion

Browse Source
This commit is contained in:
fedpo
2025-05-07 15:30:05 -03:00
parent 61eacc5533
commit 1a5006e832
6 changed files with 159 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

125
Front/src/paginas/UsuarioPanel.svelte
View File

@@ -4,10 +4,12 @@
import BarraHorizontalConTexto from "../Componentes/BarraHorizontalConTexto.svelte";
import type { ClientePanel } from "../types";
import { urlG } from "../stores/urlStore";
import ModalEstatico from "../Componentes/ModalEstatico.svelte";
let token: string = sessionStorage.getItem("token") || "";
let user: ClientePanel | null = $state(null);
let showmodal: boolean = $state(false);
let showrecuperacionset: boolean = $state(false);
let modaldata: string = $state("");
onMount(async () => {
@@ -54,8 +56,40 @@
modaldata = "no se pudo hacer la request";
}
}
async function submitemail(e: Event) {
e.preventDefault();
const t = e.target as HTMLFormElement;
const emailinput = t.querySelector(
"#emailRecuperacion",
) as HTMLInputElement;
const email: string = emailinput.value;
try {
let req = await fetch($urlG + "/api/usuario/emailrecuperacion", {
method: "PUT",
headers: { Auth: token, "Content-Type": "Application/json" },
body: JSON.stringify({ EmailRecuperacion: email }),
});
showmodal = false;
modaldata = (await req.json()).message;
if (req.ok) {
fetchusuario();
}
showrecuperacionset = false;
} catch {
modaldata = "no se pudo hacer la request";
showrecuperacionset = false;
}
}
</script>
{#if modaldata}
<ModalEstatico close={() => !!(modaldata = "")} payload={modaldata} />
{/if}
<NavBarAutocompletable />
<div class="mt-2">
<BarraHorizontalConTexto text="Panel de Usuario" />
@@ -168,4 +202,95 @@
</div>
</div>
{/if}
<!-- Información de Correo de Recuperación -->
<div class="w-75 mb-4">
<div class="card">
<div class="card-header bg-secondary text-white">
<h5 class="mb-0">Correo de Recuperación</h5>
</div>
<div class="card-body">
{#if !user}
<div class="d-flex justify-content-center my-5">
<div class="spinner-border text-info" role="status">
<span class="visually-hidden">Cargando...</span>
</div>
</div>
{:else}
<div class="mb-3">
<h6 class="text-muted fw-bold">
Email de Recuperación
</h6>
<p class="lead">
{user.emailRecuperacion || "No configurado"}
</p>
</div>
<div class="mb-3">
<button
class="btn btn-secondary text-white"
onclick={() => (showrecuperacionset = true)}
>Actualizar Email de Recuperación</button
>
</div>
{#if showrecuperacionset}
<div
class="modal show d-block"
tabindex="-1"
style="background-color: rgba(0,0,0,0.3);"
>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">
Actualizar Email de Recuperación
</h5>
<button
type="button"
class="btn-close"
onclick={() =>
(showrecuperacionset = false)}
aria-label="Close"
></button>
</div>
<form onsubmit={(e) => submitemail(e)}>
<div class="modal-body">
<div class="mb-3">
<label
for="emailRecuperacion"
class="form-label"
>Email de Recuperación</label
>
<input
type="email"
class="form-control"
id="emailRecuperacion"
placeholder="correo@ejemplo.com"
/>
</div>
</div>
<div
class="modal-footer d-flex justify-content-between"
>
<button
type="button"
class="btn btn-secondary"
onclick={() =>
(showrecuperacionset = false)}
>Cancelar</button
>
<button
type="submit"
class="btn btn-primary"
>Guardar</button
>
</div>
</form>
</div>
</div>
</div>
{/if}
{/if}
</div>
</div>
</div>
</div>

3
Front/src/types.d.ts vendored
View File

@@ -239,5 +239,6 @@ export type ClientePanel = {
apellido:string,
domicilio:string,
celular:string,
email:string
email:string,
emailRecuperacion:string|null
}