Skip to content

Commit

Permalink
Detalles varios (#142)
Browse files Browse the repository at this point in the history
  • Loading branch information
@yoelmarain
yoelmarain authored Oct 13, 2024
2 parents 349aab3 + 5066b6b commit 3036bd5
Show file tree
Hide file tree
Showing 9 changed files with 196 additions and 75 deletions.
7 changes: 4 additions & 3 deletions FrontAdmin/src/API-Alumnos/Pagos.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,11 +36,12 @@ export const FetchPostPago = async (
};


export const FetchGetCuotas = async () => {
export const FetchGetCuotas = async (dni: number | undefined ) => {
try {
const token = Cookies.get('tokennn');
const dni = Cookies.get('dni');

if (!dni) {
dni = parseInt(Cookies.get('dni') || '', 10);
}
const response = await fetch(`http://localhost:8000/api/cuotas/alumno/${dni}/impagas/`, {
method: 'GET',
headers: {
Expand Down
20 changes: 13 additions & 7 deletions FrontAdmin/src/API/AbonaronCuota.ts
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
import Cookies from 'js-cookie';

export const AbonaronCuota = async (fecha: string) => {
export const AbonaronCuota = async (fecha: string, limit:number, offset:number, valor?: string) => {
try {

const token = Cookies.get('tokennn');
const response = await fetch(`http://localhost:8000/api/alumnos/pagaron-cuota/${fecha}/`, {
const url = valor
? `http://localhost:8000/api/alumnos/pagaron-cuota/${fecha}/?limit=${limit}&offset=${offset}&valor=${valor}`
: `http://localhost:8000/api/alumnos/pagaron-cuota/${fecha}/?limit=${limit}&offset=${offset}`;
const response = await fetch(url, {
method: 'GET',
headers: {
'Content-Type': 'application/json',
Expand All @@ -27,12 +30,15 @@ export const AbonaronCuota = async (fecha: string) => {
}
};

export const NoAbonaronCuota = async (fecha: string, limit: number, offset:number) => {
try {

export const NoAbonaronCuota = async (fecha: string, limit: number, offset: number, valor?: string) => {
try {
const token = Cookies.get('tokennn');
const response = await fetch(`http://localhost:8000/api/alumnos/no-pagaron-cuota/${fecha}/?limit=${limit}&offset=${offset}&ordering=full_name`, {
method: 'GET',
const url = valor
? `http://localhost:8000/api/alumnos/no-pagaron-cuota/${fecha}/?limit=${limit}&offset=${offset}&valor=${valor}`
: `http://localhost:8000/api/alumnos/no-pagaron-cuota/${fecha}/?limit=${limit}&offset=${offset}`;

const response = await fetch(url, {
method: 'GET',
headers: {
'Content-Type': 'application/json',
'Authorization': `Bearer ${token}`,
Expand Down
10 changes: 7 additions & 3 deletions FrontAdmin/src/components/Header/HeaderContent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {
Box,
Text,
useDisclosure,
Avatar,
} from '@chakra-ui/react';
import imgLogo from '../icons/Logos TUP_Mesa de trabajo 1.png';
import logoUser from '../icons/logo-user.png';
Expand Down Expand Up @@ -70,10 +71,13 @@ export function HeaderContent({ onOpen }: { onOpen: any }) {
display={{ base: 'flex', md: 'none' }}
color="white"
/>
<Flex direction={"row"} alignItems={"center"} gap={5}>
<Flex direction={"row"} alignItems={"center"} gap={3}>
<Text fontFamily={"'Roboto',sans-serif"} fontWeight="600">{user}</Text>
<MenuButton as={Button} borderRadius="50%" w="50px" h="50px" p="0px">
<Image src={logoUser} w="100%"></Image>
<MenuButton borderRadius={'full'}>
<Avatar
name={Cookies.get("full_name")}
borderRadius="full"
/>
</MenuButton>
<MenuList>
<MenuItem
Expand Down
2 changes: 1 addition & 1 deletion FrontAdmin/src/components/Pages-Alumnos/EstadoCuenta/EstadoCuenta.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -296,7 +296,7 @@ function InformarPago() {
<Th textAlign="center" >
Numero
</Th>
<Th textAlign="center">Fecha Primer Vto.</Th>
<Th textAlign="center">Fecha Proximo Vto.</Th>
<Th textAlign="center">Valor Actual</Th>
<Th textAlign="center">Valor Pagado</Th>
<Th textAlign="center">Valor Informado</Th>
Expand Down
10 changes: 5 additions & 5 deletions FrontAdmin/src/components/Pages-Alumnos/InformarPago/DrawerPago.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -143,9 +143,9 @@ const DrawerInformar: React.FC<DrawerInformarProps> = ({ isOpen, onClose, cuotas
))}
</Stack>
<Text mt={4}>Total a abonar:</Text>
<Text mb={4} mt={4} fontWeight={600} textAlign={"center"} fontSize={22}>{"$" + new Intl.NumberFormat('es-ES').format(total)}</Text>
<Text mb={1} mt={4} fontWeight={600} textAlign={"center"} fontSize={22}>{"$" + new Intl.NumberFormat('es-ES').format(total)}</Text>

<FormControl isRequired={true}>
{/* <FormControl isRequired={true}>
<FormLabel mb={0}>Monto Abonado</FormLabel>
<InputGroup>
<InputLeftElement pointerEvents='none' color='gray.300' fontSize='1.2em'>
Expand All @@ -154,14 +154,14 @@ const DrawerInformar: React.FC<DrawerInformarProps> = ({ isOpen, onClose, cuotas
<Input placeholder='' value={montoAbonado} onChange={handleMontoAbonadoChange} />
</InputGroup>
</FormControl>
</FormControl> */}
<Stack gap={0}>
<FormLabel mt={4} mb={0}>Comentarios</FormLabel>
<FormLabel mt={2} mb={0}>Comentarios</FormLabel>
<Input placeholder='' mt={0} onChange={(e) => setComentarios(e.target.value)} />
</Stack>
<Stack bg={'secundaryBg'} direction={'row'} alignItems={'center'} borderRadius={5} mt={4} mb={4} p={4} gap={4}>
<Icon as={InfoOutlineIcon} w={7} h={7} />
<Text as={'i'}>Al seleccionar Guardar se lo redirigira al google forms para que pueda continuar con el informe del pago</Text>
<Text as={'i'}>Al seleccionar Guardar se lo redirigira al google forms para que pueda continuar con el informe del pago. Revisar tener desactivado el bloqueo de ventanas emergentes</Text>
</Stack>
</DrawerBody>
<DrawerFooter>
Expand Down
4 changes: 2 additions & 2 deletions FrontAdmin/src/components/Pages-Alumnos/InformarPago/TablaPagos.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ function TablaCuotas({ refresh, setCuotasSeleccionadas, cuotasSeleccionadas }: T
const getCuotas = async () => {
setLoading(true);
try {
const cuotas = await FetchGetCuotas();
const cuotas = await FetchGetCuotas(undefined);
const sortedCuotas = cuotas.sort((a: Cuota, b: Cuota) => parseInt(a.numero) - parseInt(b.numero)); // Si cambia el numero de cuota no olvidar cambiar aca
setCuotas(sortedCuotas);
} catch (error) {
Expand Down Expand Up @@ -94,7 +94,7 @@ function TablaCuotas({ refresh, setCuotasSeleccionadas, cuotasSeleccionadas }: T
<Tr mt={6}>
<Th></Th>
<Th textAlign="center" p={1}>Cuota</Th>
<Th textAlign="center">Fecha Primer VTO.</Th>
<Th textAlign="center">Fecha Proximo VTO.</Th>
<Th textAlign="center">Valor Actual</Th>
<Th textAlign="center">Valor Pagado</Th>
<Th textAlign="center">Valor Informado</Th>
Expand Down
101 changes: 85 additions & 16 deletions FrontAdmin/src/components/Pages/Alumnos/SubPages/FichaAlumno.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ import {
FetchDetalleAlumno,
FetchMateriasAlumno,
} from '../../../../API/DetalleAlumno.ts';
import { FetchGetCuotas } from '../../../../API-Alumnos/Pagos.ts';
import { FetchCompromisosAlumno } from '../../../../API-Alumnos/Compromiso.ts';
import React, { useState, useEffect, useMemo } from 'react';
import { ArrowLeftIcon, ChevronLeftIcon } from '@chakra-ui/icons';
Expand Down Expand Up @@ -75,6 +76,7 @@ function FichaAlumno() {
const [loading, setLoading] = useState(true);
const [error, setError] = useState<unknown>(null);
const [firmoCompromiso, setFirmoCompromiso] = useState<boolean>(false);
const [deuda, setDeuda] = useState<number>(0);
const navigate = useNavigate();

const handleBackClick = () => {
Expand All @@ -93,8 +95,6 @@ function FichaAlumno() {
} catch (error) {
setError(error);
console.error('Error al obtener los datos', error);
} finally {
setLoading(false);
}
};

Expand Down Expand Up @@ -129,10 +129,36 @@ function FichaAlumno() {
}
}

const fetchImpagas = async () => {
try {
if (dni) {
const dniNumber = parseInt(dni, 10);
const data = await FetchGetCuotas(dniNumber);
if (data.length > 0) {
const today = new Date();
const totalDeuda = data.reduce((acc: number, cuota: Cuota) => {
const fechaVencimiento = new Date(cuota.fechaVencimiento);
if (fechaVencimiento < today) {
return acc + cuota.montoActual;
}
return acc;
}, 0);
setDeuda(totalDeuda);
}
}
} catch (error) {
setError(error);
console.error('Error al obtener los datos', error);
} finally {
setLoading(false);
}
};

if (dni) {
fetchDetalleAlumno(dni);
fetchEstadoCuentaAlumno();
fetchCompromiso();
fetchImpagas();
}


Expand All @@ -152,7 +178,7 @@ function FichaAlumno() {

return (

<Flex mt="20px">
<Flex mt="20px" width={"100%"} >
<Button
position="absolute"
left="120"
Expand All @@ -162,7 +188,7 @@ function FichaAlumno() {
>
<ArrowLeftIcon mr="10px" /> Volver{' '}
</Button>
<Box borderRight="1px solid #cbd5e0" w="20%" minH="80vh" p="20px">
<Box borderRight="1px solid #cbd5e0" w="25%" minH="80vh" p="20px">
<Text color="gray" mt="30px">
Apellido y nombre
</Text>
Expand Down Expand Up @@ -219,33 +245,76 @@ function FichaAlumno() {

</Box>

<Box>
<Box w={"100%"}>
<Flex
alignItems="center"
justifyContent="center"
flexDirection="column"
width="100%"
ml={5}
>
<Box
borderRadius={8}
borderRadius={3}
borderColor={'gray.200'}
borderStyle={'solid'}
borderWidth={1}
p={3}
ml="30px"
//ml="30px"
w="100%"
>
<Tabs>
<TabList>
<Tab>Estado de cuenta</Tab>
<Tab>Materias que cursa</Tab>
</TabList>
<Tabs w={"100%"}>
<TabList display="flex" justifyContent="center" alignItems="center" borderBottom="2px solid" borderColor="gray.200">
<Tab
_selected={{
borderBottom: "2px solid",
borderColor: "blue.500",
color: "blue.500",
borderTop: "none",
borderLeft: "none",
borderRight: "none"
}}
_focus={{ boxShadow: "none" }}
>
Estado de Cuenta
</Tab>
<Tab
_selected={{
borderBottom: "2px solid",
borderColor: "blue.500",
color: "blue.500",
borderTop: "none",
borderLeft: "none",
borderRight: "none"
}}
_focus={{ boxShadow: "none" }}
>
Materias que cursa
</Tab>
<Tab
_selected={{
borderBottom: "2px solid",
borderColor: "blue.500",
color: "blue.500",
borderTop: "none",
borderLeft: "none",
borderRight: "none"
}}
_focus={{ boxShadow: "none" }}
>
Inhabilitaciones
</Tab>
</TabList>

<TabPanels>
<TabPanel minW="50vw">
<Tag m="20px" p="10px">
Estado de cuenta al {(new Date().toLocaleDateString())}
</Tag>
<TabPanel w={"100%"}>
<Flex justifyContent="center" w={"100%"} mt={1} gap={2} mb={2}>
<Tag m="1px" p="10px" w={"100%"} fontWeight={"bold"} fontSize={16}>
Estado de cuenta al {(new Date().toLocaleDateString())}
</Tag>
<Tag m="1px" p="10px" w="100%" fontWeight={"bold"} fontSize={16}>
Deuda total: {'$ ' + new Intl.NumberFormat('es-ES').format(deuda)}
</Tag>
</Flex>
{cuotas.length > 1 ? (
<Table variant="simple" width="100%">
<Thead>
Expand Down
Loading

0 comments on commit 3036bd5

Please sign in to comment.