Commit Login con popup

frontend/src/Popups/PopupRegistro.jsx

@@ -2,7 +2,7 @@ import { Button } from "@mui/base"
 import { Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from "@mui/material"
 import { useState } from "react"
 
-function Popup (){
+function PopupRegistro (){
     const[open,setOpen] = useState(true);
 
 
@@ -14,7 +14,6 @@ function Popup (){
     const eventoCerrar = () => {
         setOpen(false)
     }
-    
     return(
         <>
             <div>
@@ -34,4 +33,4 @@ function Popup (){
     )
 }
 
-export default Popup
+export default PopupRegistro

frontend/src/Popups/PopupRsindatos.jsx

@@ -0,0 +1,35 @@
+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(
+        <>
+  
+        <div>
+            <Dialog open={open} onClose={eventoCerrar}>
+            <DialogTitle>Registro Fallido</DialogTitle>
+            <DialogContent>
+                <DialogContentText>
+                    Porfavor introduzca los datos correspondientes.
+                </DialogContentText>
+            </DialogContent>
+            <DialogActions>
+                <Button className="cerrar" onClick={eventoCerrar}>Cerrar</Button>
+            </DialogActions>
+            </Dialog>
+        </div>
+        </>
+    )
+}
+
+export default Popup

frontend/src/Sesion/LoginForm.jsx

@@ -3,6 +3,8 @@ import './LoginForm.css';
 import { redirect } from 'react-router-dom';
 import axios from "axios";
 import { useNavigate } from "react-router-dom";
+//import PopupV from "/src/Popups/PopupLoginValido.jsx";
+//import PopupIv from "./Popups/PopupLoginInvalido.jsx";
 
 function LoginForm(props) {
   const navigate = useNavigate();
@@ -46,7 +48,6 @@ function LoginForm(props) {
       text: "Usuario o Contraseña Incorrecta.",
       icon: "error",
       button: "Aceptar"
-
     });
   }
 
@@ -56,14 +57,13 @@ function LoginForm(props) {
       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})
+        const response = await axios.post('http://localhost/Login',{datosFormulario})
         console.log(response.data)
         console.log("c = " +datosFormulario.correo+" p = "+datosFormulario.password)
         if(datosFormulario.correo && datosFormulario.password){
@@ -84,10 +84,7 @@ const loginUsuario = async (evento) => {
                 //abrirPopupV()
                 
             }
-
+        }else{   
-
-        }else{
-            
             mostrarAlertaLoginSinDatos();
         }
 
@@ -116,6 +113,10 @@ const cambiosFormulario = (evento) => {
 
     setMostrarPopupIv(false);
 }
+
+const redirectToHome = () => {
+  navigate("/");
+};
  
   return (
     <>
@@ -129,16 +130,15 @@ const cambiosFormulario = (evento) => {
                   <header className='header-login'>Inicia Sesión</header>
                 </div>
                 <div className="input-box">
-                  <input type="text" className="input-field" placeholder="Correo" />
+                  <input type="text" className="input-field" placeholder="Correo" onChange={cambiosFormulario} name="correo" value={datosFormulario.correo}/>
                   <i className="bx bx-user"></i>
                 </div>
                 <div className="input-box">
-                  <input type="password" className="input-field" placeholder="Contraseña" />
+                  <input type="password" className="input-field" placeholder="Contraseña" onChange={cambiosFormulario} name="password" value={datosFormulario.password}/>
                   <i className="bx bx-lock-alt"></i>
                 </div>
                 <div className="input-box">
-                  {/*<input type="submit" className="submit" value="Entrar" />*/}
+                  <button type="button" className="submit" onClick={loginUsuario} disabled={Cargando}>Entrar</button>
-                  <button type="button" className="submit">Entrar</button>
                 </div>
                 <div className="two-col">
                   <div className="one">
@@ -149,6 +149,12 @@ const cambiosFormulario = (evento) => {
                     <span><a href="" onClick={redirectToRecuperarContra}>Olvidaste la contraseña?</a></span>
                   </div>
                 </div>
+                <Box m={5}>
+                    {mostrarPopupV && <PopupV nombre ={nombre} onClose={() => setMostrarPopupV(false)} />}
+                </Box>
+                <Box m={5}>
+                    {mostrarPopupIv && <PopupIv nombre ={nombre} onClose={() => setMostrarPopupIv(false)} />}
+                </Box>
               </form>
             </div>
           </div>