Feature/171 registration of families

src/screens/App.js

@@ -68,7 +68,9 @@ import PartnersCalendar from './partners/PartnersCalendar';
 import PartnerForm from './partners/PartnerForm';
 
 // 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';
@@ -224,11 +226,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,134 @@
+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';
+import { Password } from '@mui/icons-material';
+
+
+const API_ENDPOINT = process.env.REACT_APP_API_ENDPOINT;
+
+
+const FamilyForm = () => {
+    const [token, updateToken] = useToken();
+    const config = {
+        headers: {
+        'Authorization': `Bearer ${token}`,
+        }
+    };
+
+    const [user, setUser] = useState([]);
+
+    const navigate = useNavigate();
+
+    //Traemos los datos del usuario
+    useEffect(() => {
+
+      axios.get(`${API_ENDPOINT}auth/users/me/`, config)
+        .then(response => {
+            setUser(response.data);
+        })
+        .catch(error => {
+          console.error(error);
+        });
+
+    }, []);
+
+    //Atributos
+    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/`, postFam, config);
+            const { data } = post;
+
+            const firstKey = Object.values(data)[0];
+
+            if (data.message) {
+                console.error(data.message);
+            } else {
+                axios.get(`${API_ENDPOINT}family/${firstKey}`, config)
+                    .then(response => {
+                        const familiaData = response.data;
+                        console.log("fam", familiaData.id);
+
+                        const updatedData = {
+                            password: user.password,
+                            family: familiaData.id, // Aquí se pasa el pk de la familia
+                            email: user.email,
+                        };
+
+                        console.log("fam", familiaData.id);
+                        console.log("updatedData", updatedData);
+                        console.log("config", config);
+
+                        axios.put(`${API_ENDPOINT}auth/users/me/`, updatedData, config)
+                            .then(update => {
+                                const { data: updatedUserData } = update;
+                                navigate('/familia/perfil');
+                            })
+                            .catch(error => {
+                                console.log(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.");
+        }
+        navigate('/familia/perfil');
+    };
+
+
+
+
+    return (
+        <>
+            <LayoutProfiles profile={'familia'}>
+            <ToastContainer />
+            <div  className='register-container' style={{width: '300px', marginTop:'6%'}}>
+
+                <h3>Formulario de Familiares</h3>
+
+                <p>Primer Apellido</p>
+                <input 
+                    defaultValue={surname1}
+                    onChange={(e) => setSurname1(e.target.value)}
+                    type='text'
+                    placeholder='Primer Apellido'
+                ></input>
+
+                <p>Segundo Apellido</p>
+                <input 
+                    defaultValue={surname2}
+                    onChange={(e) => setSurname2(e.target.value)}
+                    type='text'
+                    placeholder='Segundo Apellido'
+                ></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
 
@@ -125,23 +126,13 @@ function LogIn() {
                 }
             }  else if (user.role === 'FAMILIA') {
                 localStorage.setItem('role', 'FAMILIA')
-                if (user.family === null) {
-                    //Crea un objeto familia
-                    const response = await axios.post(`${API_ENDPOINT}family/`, 
-                    {name: "Familia " + user.last_name}, {
-                        headers: {
-                            'Authorization': `Bearer ${accessToken}`
-                        }});
-
-                    localStorage.setItem('familyId', response.data.id);
-                    //El usuario es asignado esa familia
-                    await axios.patch(`${API_ENDPOINT}auth/users/me/`,
-                    {password: password, family: response.data.id}, {
-                        headers: {
-                            'Authorization': `Bearer ${accessToken}`
-                        }});
-                    }
+                setRole(user.role)
+                if(user.family === null){
+                    navigate('/familia/registro');
+                } else {    
                     navigate('/familia/evaluacion/diaria/0');
+                }         
+
             } else if (user.role === 'SOCIO') {
                 localStorage.setItem('role', 'SOCIO')
                 if (user.partner === null) {