Feature/171 registration of families

src/screens/App.js

@@ -67,7 +67,9 @@ import VolunteerFormation from './volunteers/VolunteerFormation';
 import PartnersCalendar from './partners/PartnersCalendar';
 
 // FAMILIES
+import FamilyForm from './family/FamilyForm';
 import FamilyProfile from './family/FamilyProfile';
+import FamilyUpdate from './family/FamilyUpdate';
 import FamilyChildren from './family/FamilyChildren';
 import FamilyAuths from './family/FamilyAuths';
 import FamilyAuthsPending from './family/FamilyAuthsPending';
@@ -222,11 +224,13 @@ function App() {
             {/* FAMILIES ROUTES */}
             {role === 'FAMILIA' && (
               <>
+            <Route path="/familia/registro" exact={true} element={<FamilyForm />} />
             <Route path="/familia/perfil" exact={true} element={<FamilyProfile />} />
             <Route path="/familia/niños" exact={true} element={<FamilyChildren />} />
             <Route path="/familia/niños/registro" exact={true} element={<FamilyChildForm />} />
             <Route path="/familia/autorizaciones" exact={true} element={<FamilyAuths />} />
             <Route path="/familia/autorizaciones/pendientes" exact={true} element={<FamilyAuthsPending />} />
+            <Route path='/familia/perfil/actualizar' exact={true} element={<FamilyUpdate/>}/>
             <Route path="/familia/evaluacion/:tipoTiempo/:studentIndex" exact={true} element={<FamilyEval />} />
               </> 
             )}

src/screens/family/FamilyForm.js

@@ -0,0 +1,146 @@
+import React, { useEffect, useState } from 'react';
+import { ToastContainer, toast } from 'react-toastify';
+import 'react-toastify/dist/ReactToastify.css';
+import '../../styles/styles.css';
+import axios from 'axios';
+import {useNavigate} from 'react-router-dom';
+import LayoutProfiles from '../../components/LayoutProfiles';
+import useToken from '../../components/useToken';
+
+
+const API_ENDPOINT = process.env.REACT_APP_API_ENDPOINT;
+
+
+const FamilyForm = () => {
+
+    const [token, updateToken] = useToken();
+    const config = {
+        headers: {
+        'Authorization': `Bearer ${token}`,
+        }
+    };
+
+
+    const [valoresList, setValores] = useState([]);
+
+    const navigate = useNavigate();
+
+    //Traemos los datos del usuario
+    useEffect(() => {
+
+      axios.get(`${API_ENDPOINT}auth/users/me/`, config)
+        .then(response => {
+          setValores(response.data);
+        })
+        .catch(error => {
+          console.error(error);
+        });
+
+    }, []);
+
+    //Atributos
+
+    const [password, setPassword] = useState("");
+
+    const [surname1, setSurname1] = useState("");
+    const [surname2, setSurname2] = useState("");
+
+    //Atributos son correctos
+
+    const updatePut = async () => {
+        try {
+            const postFam = { 
+                name: "Familia " + surname1 + " " + surname2,
+            };
+
+            const post = await axios.post(`${API_ENDPOINT}family/`, config, postFam);
+            const { data } = post;
+
+            console.log("datos", data);
+
+            const firstKey = Object.values(data)[0];
+            console.log("Primera clave de 'data':", firstKey);
+
+            if (data.message) {
+                window.alert(data.message);
+            } else {
+                axios.get(`${API_ENDPOINT}family/${firstKey}`)
+                    .then(response => {
+                        const familiaData = response.data;
+                        console.log("fam", familiaData.id);
+
+                        const updatedData = {
+                            email: valoresList.email,
+                            password: password,
+                            family: familiaData.id, // Aquí se pasa el pk de la familia
+                            is_agreed: 'true',
+                        };
+
+                        axios.put(`${API_ENDPOINT}auth/users/me/`, config, updatedData)
+                            .then(update => {
+                                const { data: updatedUserData } = update;
+                                if (updatedUserData.message) {
+                                    window.alert(updatedUserData.message);
+                                } else {
+                                    navigate(`/familia/registro/niños`);
+                                }
+                            })
+                            .catch(error => {
+                                toast.error("Error al actualizar los datos del usuario.");
+                            });
+                    })
+                    .catch(error => {
+                        console.error(error);
+                        toast.error("Error al obtener detalles de la familia.");
+                    });
+            }
+        } catch (error) {
+            toast.error("Datos no válidos.");
+        }
+    };
+
+
+
+
+    return (
+        <>
+            <LayoutProfiles profile={'familia'}>
+            <ToastContainer />
+            <div  className='register-container' style={{width: '300px', marginTop:'6%'}}>
+
+                <p>Apellido 1</p>
+                <input 
+                    defaultValue={surname1}
+                    onChange={(e) => setSurname1(e.target.value)}
+                    type='text'
+                    placeholder='Primer Apellido'
+                ></input>
+
+                <p>Apellido 2</p>
+                <input 
+                    defaultValue={surname2}
+                    onChange={(e) => setSurname2(e.target.value)}
+                    type='text'
+                    placeholder='Segundo Apellido'
+                ></input>
+
+                <p>Contraseña</p>
+                <input 
+                    defaultValue={password}
+                    onChange={(e) => setPassword(e.target.value)}
+                    type='password'
+                    placeholder='Contraseña'
+                ></input>
+
+                <button onClick={updatePut} className='register-button admin' >
+                    Proceder
+                </button>
+            </div>
+            </LayoutProfiles>
+        </>
+
+    )
+
+  };
+
+  export default FamilyForm;

src/screens/family/FamilyUpdate.js

@@ -0,0 +1,17 @@
+import '../../styles/styles.css';
+import UpdateProfile from '../../components/UpdateProfile';
+import LayoutProfiles from '../../components/LayoutProfiles';
+
+const VolunteerProfileUpdate = () => {
+
+    return (
+
+        <LayoutProfiles profile={'familia'}>
+            <UpdateProfile tipo={'familia'}/>
+        </LayoutProfiles>
+
+    )
+
+  };
+
+  export default VolunteerProfileUpdate;

src/screens/homepage/LogIn.js

@@ -8,6 +8,7 @@ import { toast } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.css';
 import useToken from '../../components/useToken';
 import RoleContext from '../../components/RoleContext';
+import { Api } from '@mui/icons-material';
 
 const API_ENDPOINT = process.env.REACT_APP_API_ENDPOINT
 
@@ -134,12 +135,11 @@ function LogIn() {
             }  else if (user.role === 'FAMILIA') {
                 localStorage.setItem('role', 'FAMILIA')
                 setRole(user.role)
-
-                //TODO Aqui formulario para educador, una cosa así:
-                //if (user.educador === null) {
-                //    navigate('/educador/formulario');}
-                navigate('/familia/evaluacion/diaria/0');
-
+                if(user.family === null){
+                    navigate('/familia/registro');
+                } else {    
+                    navigate('/familia/evaluacion/diaria/0');
+                }         
 
             } else if (user.role === 'SOCIO') {
                 localStorage.setItem('role', 'SOCIO')