Merge branch 'dev' into TUP-81-Posible-paginado-en-tabla-alumnos-divi…

…dir-alumnos-en-activos-e-historico

FrontAdmin/src/API/AlumnosCompromisoPago.ts

@@ -0,0 +1,34 @@
+import Cookies from 'js-cookie';
+
+const fetchAlumnosCompromiso = async (url: string): Promise<any> => {
+  try {
+    const token = Cookies.get('tokennn');
+
+    const response = await fetch(url, {
+      method: 'GET',
+      headers: {
+        'Content-Type': 'application/json',
+        Authorization: `Bearer ${token}`,
+      },
+    });
+
+    if (response.ok) {
+      const data = await response.json();
+      return data;
+    } else {
+      throw new Error('Error en la respuesta del servidor');
+    }
+  } catch (error) {
+    throw new Error('Network error: ' + error);
+  }
+};
+
+export const FetchFirmantes = async (): Promise<any> => {
+  const url = 'http://localhost:8000/api/firmantes/alumnos-firmaron-ultimo-compromiso/';
+  return fetchAlumnosCompromiso(url);
+};
+
+export const FetchNoFirmantes = async (): Promise<any> => {
+  const url = 'http://localhost:8000/api/firmantes/alumnos-no-firmaron-ultimo-compromiso/';
+  return fetchAlumnosCompromiso(url);
+};

FrontAdmin/src/components/Pages/Estadisticas/SubPages/AlumnosConCompromiso.tsx

@@ -1,66 +1,78 @@
 import React, { useEffect, useState } from 'react';
 import {
   Box,
-  Tab,
-  TabList,
-  TabPanels,
-  Tabs,
-  VStack,
-  List,
-  ListItem,
+  Table,
+  Thead,
+  Tbody,
+  Tr,
+  Th,
+  Td,
   Spinner,
-  useTab,
+  Alert,
 } from '@chakra-ui/react';
-import { FetchAlumnos } from '../../../../API/DatosAlumnosV2';
+import { FetchFirmantes } from '../../../../API/AlumnosCompromisoPago';
 
 interface Alumnos {
-  nombre: string;
+  full_name: string;
   legajo: number;
   dni: number;
-  situacion: string;
+  estado_financiero: string;
   anio_ingreso: number;
 }
 
 const AlumnosConCompromiso: React.FC = () => {
   const [alumnos, setAlumnos] = useState<Alumnos[]>([]);
   const [loading, setLoading] = useState<boolean>(true);
+  const [error, setError] = useState<string | null>(null);
 
   useEffect(() => {
-    const fetchAlumnos = async () => {
+    const fetchFirmantes = async () => {
       try {
-        const response = await FetchAlumnos();
-        if (!response.ok) {
-          throw new Error('Error al obtener los alumnos');
-        }
-        const data: Alumnos[] = await response.json();
+        const data: Alumnos[] = await FetchFirmantes();
         setAlumnos(data);
       } catch (error) {
+        setError('Error al obtener los alumnos');
         console.error(error);
       } finally {
         setLoading(false);
       }
     };
 
-    fetchAlumnos();
-  }, );
+    fetchFirmantes();
+  }, []);
+
+  if (loading) {
+    return <Spinner size="xl" />;
+  }
+
+  if (error) {
+    return <Alert status="error">{error}</Alert>;
+  }
 
   return (
     <Box p={5}>
-      <VStack spacing={4} align="stretch">
-        <Tabs variant="enclosed" isLazy>
-          <TabPanels>
-            <Box>
-              <List spacing={3}>
-                {alumnos.map(alumno => (
-                  <ListItem key={alumno.legajo}>
-                    {alumno.nombre} (Legajo: {alumno.legajo}, DNI: {alumno.dni}, Situacion: {alumno.situacion}, Año Ingreso: {alumno.anio_ingreso})
-                  </ListItem>
-                ))}
-              </List>
-            </Box>
-          </TabPanels>
-        </Tabs>
-      </VStack>
+      <Table variant="striped" colorScheme="teal">
+        <Thead>
+          <Tr>
+            <Th>Nombre Completo</Th>
+            <Th>Legajo</Th>
+            <Th>DNI</Th>
+            <Th>Situación Financiera</Th>
+            <Th>Año de Ingreso</Th>
+          </Tr>
+        </Thead>
+        <Tbody>
+          {alumnos.map(alumno => (
+            <Tr key={alumno.legajo}>
+              <Td>{alumno.full_name}</Td>
+              <Td>{alumno.legajo}</Td>
+              <Td>{alumno.dni}</Td>
+              <Td>{alumno.estado_financiero}</Td>
+              <Td>{alumno.anio_ingreso}</Td>
+            </Tr>
+          ))}
+        </Tbody>
+      </Table>
     </Box>
   );
 };

FrontAdmin/src/components/Pages/Estadisticas/SubPages/AlumnosSinCompromiso.tsx

@@ -11,13 +11,13 @@ import {
   Spinner,
   useTab,
 } from '@chakra-ui/react';
-import { FetchAlumnos } from '../../../../API/DatosAlumnosV2';
+import { FetchNoFirmantes } from '../../../../API/AlumnosCompromisoPago';
 
 interface Alumnos {
-  nombre: string;
+  full_name: string;
   legajo: number;
   dni: number;
-  situacion: string;
+  estado_financiero: string;
   anio_ingreso: number;
 }
 
@@ -26,9 +26,9 @@ const AlumnosConCompromiso: React.FC = () => {
   const [loading, setLoading] = useState<boolean>(true);
 
   useEffect(() => {
-    const fetchAlumnos = async () => {
+    const fetchNoFirmantes = async () => {
       try {
-        const response = await FetchAlumnos();
+        const response = await FetchNoFirmantes();
         if (!response.ok) {
           throw new Error('Error al obtener los alumnos');
         }
@@ -41,7 +41,7 @@ const AlumnosConCompromiso: React.FC = () => {
       }
     };
 
-    fetchAlumnos();
+    fetchNoFirmantes();
   }, );
 
   return (
@@ -53,7 +53,7 @@ const AlumnosConCompromiso: React.FC = () => {
               <List spacing={3}>
                 {alumnos.map(alumno => (
                   <ListItem key={alumno.legajo}>
-                    {alumno.nombre} (Legajo: {alumno.legajo}, DNI: {alumno.dni}, Situacion: {alumno.situacion}, Año Ingreso: {alumno.anio_ingreso})
+                    {alumno.full_name} (Legajo: {alumno.legajo}, DNI: {alumno.dni}, Situacion: {alumno.estado_financiero}, Año Ingreso: {alumno.anio_ingreso})
                   </ListItem>
                 ))}
               </List>