diff --git a/frontend/src/Popups/PopupActualizar.jsx b/frontend/src/Popups/PopupActualizar.jsx
new file mode 100644
index 0000000..f696bf3
--- /dev/null
+++ b/frontend/src/Popups/PopupActualizar.jsx
@@ -0,0 +1,43 @@
+import { Button } from "@mui/base"
+import { Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from "@mui/material"
+import { useState } from "react"
+import { useNavigate } from "react-router-dom"
+
+function PopupActualizar ({nombre}){
+ const navigate = useNavigate();
+ const[open,setOpen] = useState(true);
+
+ const redirectToLogin = () => {
+ // Redirige a la página del hotel cuando se hace clic en el botón
+ navigate("/Login");
+ };
+
+ const eventoAbrir = () => {
+ setOpen(true)
+ }
+
+ const eventoCerrar = () => {
+ setOpen(false)
+ redirectToLogin();
+ }
+
+ return(
+ <>
+
+
+
+
+ )
+}
+
+export default PopupActualizar
\ No newline at end of file
diff --git a/frontend/src/Popups/PopupActualizarInv.jsx b/frontend/src/Popups/PopupActualizarInv.jsx
new file mode 100644
index 0000000..b422951
--- /dev/null
+++ b/frontend/src/Popups/PopupActualizarInv.jsx
@@ -0,0 +1,34 @@
+import { Button } from "@mui/base"
+import { Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from "@mui/material"
+import { useState } from "react"
+
+function PopupActualizarInv ({nombre}){
+ const[open,setOpen] = useState(true);
+
+ const eventoAbrir = () => {
+ setOpen(true)
+ }
+
+ const eventoCerrar = () => {
+ setOpen(false)
+ }
+ return(
+ <>
+
+
+
+
+ )
+}
+
+export default PopupActualizarInv
\ No newline at end of file
diff --git a/frontend/src/Popups/PopupLoginInvalido.jsx b/frontend/src/Popups/PopupLoginInvalido.jsx
new file mode 100644
index 0000000..571170a
--- /dev/null
+++ b/frontend/src/Popups/PopupLoginInvalido.jsx
@@ -0,0 +1,35 @@
+import { Button } from "@mui/base"
+import { Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from "@mui/material"
+import { useState } from "react"
+
+function PopupLoginInvalido ({nombre}){
+ const[open,setOpen] = useState(true);
+
+ const eventoAbrir = () => {
+ setOpen(true)
+ }
+
+ const eventoCerrar = () => {
+ setOpen(false)
+ }
+ return(
+ <>
+
+
+
+
+
+ )
+}
+
+export default PopupLoginInvalido
\ No newline at end of file
diff --git a/frontend/src/Popups/PopupLoginValido.jsx b/frontend/src/Popups/PopupLoginValido.jsx
new file mode 100644
index 0000000..27f2599
--- /dev/null
+++ b/frontend/src/Popups/PopupLoginValido.jsx
@@ -0,0 +1,43 @@
+import { Button } from "@mui/base"
+import { Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from "@mui/material"
+import { useState } from "react"
+import { useNavigate } from "react-router-dom"
+
+function PopupLoginValido ({nombre}){
+ const navigate = useNavigate();
+ const[open,setOpen] = useState(true);
+
+ const redirectToHome = () => {
+ // Redirige a la página del hotel cuando se hace clic en el botón
+ navigate("/");
+ };
+
+ const eventoAbrir = () => {
+ setOpen(true)
+ }
+
+ const eventoCerrar = () => {
+ setOpen(false)
+ redirectToHome();
+ }
+ return(
+ <>
+
+
+
+
+
+ )
+}
+
+export default PopupLoginValido
\ No newline at end of file
diff --git a/frontend/src/Popups/PopupRegistro b/frontend/src/Popups/PopupRegistro
new file mode 100644
index 0000000..6b30745
--- /dev/null
+++ b/frontend/src/Popups/PopupRegistro
@@ -0,0 +1,37 @@
+import { Button } from "@mui/base"
+import { Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from "@mui/material"
+import { useState } from "react"
+
+function Popup (){
+ const[open,setOpen] = useState(true);
+
+
+ const eventoAbrir = () => {
+ setOpen(true)
+ }
+
+
+ const eventoCerrar = () => {
+ setOpen(false)
+ }
+
+ return(
+ <>
+
+
+
+
+ )
+}
+
+export default Popup
\ No newline at end of file
diff --git a/frontend/src/Sesion/LoginForm.jsx b/frontend/src/Sesion/LoginForm.jsx
index bd8ee2f..43c37b2 100644
--- a/frontend/src/Sesion/LoginForm.jsx
+++ b/frontend/src/Sesion/LoginForm.jsx
@@ -1,28 +1,121 @@
import React, { useState } from 'react';
import './LoginForm.css';
+import { redirect } from 'react-router-dom';
+import axios from "axios";
+import { useNavigate } from "react-router-dom";
+
+function LoginForm(props) {
+ const navigate = useNavigate();
+
+ const [Cargando, setCargando] = useState(false)
+ const [datosFormulario, setDatosFormulario] = useState({
+ correo: '',
+ password: ''
+ })
-function LoginForm() {
const [loginVisible, setLoginVisible] = useState(true);
const [registerVisible, setRegisterVisible] = useState(false);
const [passwordVisible, setPasswordVisible] = useState(false);
- const toggleLogin = () => {
- setLoginVisible(true);
- setRegisterVisible(false);
- setPasswordVisible(false);
+ const redirectToRegister = () => {
+ navigate("/Registro");
};
- const toggleRegister = () => {
- setRegisterVisible(true);
- setLoginVisible(false);
- setPasswordVisible(false);
+ const redirectToRecuperarContra = () => {
+ navigate("/RecuperarContraseña");
};
- const toggleRecuperar = () => {
- setPasswordVisible(true);
- setLoginVisible(false);
- setRegisterVisible(false);
- };
+ const mostrarAlertaLoginExitoso=(nomb)=>{
+ swal({
+ title: "Inicio de sesion Exitoso",
+ text: "Bienvenido "+nomb+".",
+ icon: "success",
+ button: "Aceptar"
+
+ }).then(respuesta=>{
+ if(respuesta){
+ redirectToHome();
+ }
+
+ })
+ }
+
+ const mostrarAlertaLoginFallido=()=>{
+ swal({
+ title: "Inicio de sesion fallido",
+ text: "Usuario o Contraseña Incorrecta.",
+ icon: "error",
+ button: "Aceptar"
+
+ });
+ }
+
+ const mostrarAlertaLoginSinDatos=()=>{
+ swal({
+ title: "Inicio de sesion fallido",
+ text: "Introduzca los datos que se le piden.",
+ icon: "error",
+ button: "Aceptar"
+
+ });
+ }
+
+const loginUsuario = async (evento) => {
+ evento.preventDefault();
+ try{
+ const response = await axios.post('http://localhost:4567/frontend/login',{datosFormulario})
+ console.log(response.data)
+ console.log("c = " +datosFormulario.correo+" p = "+datosFormulario.password)
+ if(datosFormulario.correo && datosFormulario.password){
+ if (response.data === 'Invalido') {
+ // Si la respuesta es 'Invalido', limpiar los campos del formulario
+ mostrarAlertaLoginFallido();
+ setDatosFormulario({
+ correo: '',
+ password: ''
+ });
+
+ } else {
+
+ // Si la respuesta es 'Valido', puedes realizar las acciones deseadas
+ setNombre(response.data.nombre);
+ console.log(response.data.nombre);
+ mostrarAlertaLoginExitoso(response.data.nombre);
+ //abrirPopupV()
+
+ }
+
+
+ }else{
+
+ mostrarAlertaLoginSinDatos();
+ }
+
+ return response.data
+ } catch(error){
+ throw error
+ }
+}
+
+const [nombre,setNombre]=useState('')
+
+const [mostrarPopupV, setMostrarPopupV] = useState(false);
+const abrirPopupV = () => {
+ setMostrarPopupV(true);
+};
+
+const [mostrarPopupIv, setMostrarPopupIv] = useState(false);
+const abrirPopupIv = () => {
+ setMostrarPopupIv(true);
+};
+
+const cambiosFormulario = (evento) => {
+ //console.log(evento.target)
+ const {name,value} = evento.target
+ setDatosFormulario ({...datosFormulario, [name]: value})
+
+ setMostrarPopupIv(false);
+}
return (
<>
@@ -32,7 +125,7 @@ function LoginForm() {
-
-
-
-
-
-
-
-
-
);
diff --git a/frontend/src/Sesion/RecuperarContraForm.jsx b/frontend/src/Sesion/RecuperarContraForm.jsx
new file mode 100644
index 0000000..b627495
--- /dev/null
+++ b/frontend/src/Sesion/RecuperarContraForm.jsx
@@ -0,0 +1,59 @@
+import React, { useState } from 'react';
+import './LoginForm.css';
+import { redirect } from 'react-router-dom';
+import axios from "axios";
+import { useNavigate } from "react-router-dom";
+
+function RecuperarContraForm(props) {
+ const navigate = useNavigate();
+
+ const [Cargando, setCargando] = useState(false)
+ const [datosFormulario, setDatosFormulario] = useState({
+ correo: '',
+ password: ''
+ })
+
+ const [loginVisible, setLoginVisible] = useState(false);
+ const [registerVisible, setRegisterVisible] = useState(false);
+ const [passwordVisible, setPasswordVisible] = useState(true);
+
+ const redirectToLogin = () => {
+ navigate("/Login");
+ };
+
+ return (
+ <>
+