diff --git a/src/app/administrador/casos_especiales/page.tsx b/src/app/administrador/casos_especiales/page.tsx index 876bffc..08fdfc3 100644 --- a/src/app/administrador/casos_especiales/page.tsx +++ b/src/app/administrador/casos_especiales/page.tsx @@ -6,7 +6,7 @@ export default function CasosEspeciales() {
- +
); } \ No newline at end of file diff --git a/src/app/administrador/page.tsx b/src/app/administrador/page.tsx index 42b4990..9775f11 100644 --- a/src/app/administrador/page.tsx +++ b/src/app/administrador/page.tsx @@ -19,7 +19,7 @@ export default function Administrador() { return (
-
+
diff --git a/src/app/administrador/registros/page.tsx b/src/app/administrador/registros/page.tsx index e2d0e97..6b5fc67 100644 --- a/src/app/administrador/registros/page.tsx +++ b/src/app/administrador/registros/page.tsx @@ -12,9 +12,9 @@ export default function Registro() { //}; return ( -
+
-

Reportes

+

Reportes

-
+
); } \ No newline at end of file diff --git a/src/app/responsable/page.tsx b/src/app/responsable/page.tsx index 7b75e78..80769e8 100644 --- a/src/app/responsable/page.tsx +++ b/src/app/responsable/page.tsx @@ -56,14 +56,14 @@ export default function Page() { return (
-

Estimado(a) responsable del programa de servicio social:

+

Estimado(a) responsable del programa de servicio social:

Para registrar a un alumno de servicio social pulsa el botón Agregar Alumno y sigue las instrucciones.

-
+
diff --git a/src/components/administrador/cuestionario.tsx b/src/components/administrador/cuestionario.tsx index 286310f..8a02a81 100644 --- a/src/components/administrador/cuestionario.tsx +++ b/src/components/administrador/cuestionario.tsx @@ -80,9 +80,9 @@ export default function Cuestionario({ years, admin, updateIsLoading }: Props) { -
+
- + + +
); } diff --git a/src/components/administrador/reporte.tsx b/src/components/administrador/reporte.tsx index a2c2fa4..9c51368 100644 --- a/src/components/administrador/reporte.tsx +++ b/src/components/administrador/reporte.tsx @@ -1,9 +1,10 @@ "use client"; import { useState } from "react"; import { axiosInstance } from "@/api/config"; -import { Button, Col, FormGroup, FormLabel, InputGroup } from "react-bootstrap"; +import { Button, Col, FormGroup, FormLabel, InputGroup, Row } from "react-bootstrap"; import DatePicker from "react-datepicker"; import moment from "moment"; +import { FaCalendarAlt, FaRegCalendarAlt } from "react-icons/fa"; //import { saveAs } from "file-saver"; interface Props { @@ -55,42 +56,54 @@ export default function Reporte({ admin }: Props) { }; return ( -
-

Descargar reporte

- - - Seleccione una fecha de inicio: - - setSelectedInicio(date)} - minDate={minDate} - maxDate={maxDate} - placeholderText="Seleccione una fecha de inicio" - dateFormat="dd-MM-yyyy" - className="form-control" - /> - - - +
+

Descargar reporte

- - - Seleccione una fecha de fin: - - - setSelectedFin(date)} - minDate={minDate} - maxDate={maxDate} - placeholderText="Seleccione una fecha de fin" - dateFormat="yyyy-MM-dd" - className="form-control" - /> - +
+ + + Seleccione una fecha de inicio: + + + + + setSelectedInicio(date)} + minDate={minDate} + maxDate={maxDate} + placeholderText="Seleccione una fecha de inicio" + dateFormat="dd-MM-yyyy" + className="form-control" + wrapperClassName="flex-grow-1" + calendarClassName="mi-calendario" + /> + + + + + Seleccione una fecha de fin: + + + + + setSelectedFin(date)} + minDate={minDate} + maxDate={maxDate} + placeholderText="Seleccione una fecha de fin" + dateFormat="yyyy-MM-dd" + className="form-control" + wrapperClassName="flex-grow-1" + calendarClassName="mi-calendario" + /> + + + +
{/* */} -
-
diff --git a/src/components/administrador/tabla-casos-especiales.tsx b/src/components/administrador/tabla-casos-especiales.tsx index 7852863..1e2e005 100644 --- a/src/components/administrador/tabla-casos-especiales.tsx +++ b/src/components/administrador/tabla-casos-especiales.tsx @@ -4,9 +4,10 @@ import { useEffect, useState } from "react"; import { axiosInstance } from '@/api/config'; import { isAxiosError } from 'axios'; import type { AxiosResponse } from 'axios'; -import { Button, Form, Spinner } from "react-bootstrap"; +import { Button, Col, Form, FormGroup, FormLabel, FormSelect, InputGroup, Row, Spinner } from "react-bootstrap"; import ServicioSocialTabla from "../servicio-social-tabla"; import { ServicioSocialResponse } from "@/types/responses"; +import { FaInfoCircle, FaSchool, FaUser } from "react-icons/fa"; interface Admin { idTipoUsuario?: number; @@ -138,84 +139,121 @@ export default function TablaCasosEspeciales({ admin, imprimirError }: Props) { }, [admin]); - return ( -
-

Casos Especiales

+
+
+

Casos Especiales

-
- {/* Número de Cuenta */} -
- Número de Cuenta - - setSearch({ ...search, numeroCuenta: e.target.value }) - } - onKeyDown={(e) => e.key === "Enter" && obtenerCasosEspeciales()} - /> -
+
+
{ e.preventDefault(); + obtenerCatalogoStatus(); + }}> + + + + Número de Cuenta + + + + + - {/* Nombre */} -
- Nombre - setSearch({ ...search, nombre: e.target.value })} - onKeyDown={(e) => e.key === "Enter" && obtenerCasosEspeciales()} - /> -
+ + setSearch({ ...search, numeroCuenta: e.target.value }) + } + onKeyDown={(e) => e.key === "Enter" && obtenerCasosEspeciales()} + /> + + + - {/* Status */} -
- Status - - setSearch({ ...search, idStatus: e.target.value }) - } - > - - - - - - {status.map((s) => ( - - ))} - -
+ + + Nombre - {/* Botón Buscar */} -
- -
+ + + + + setSearch({ ...search, nombre: e.target.value })} + onKeyDown={(e) => e.key === "Enter" && obtenerCasosEspeciales()} + /> + + + + + + + Status + + + + + + + setSearch(prev => ({ ...prev, idStatus: e.target.value }))} + className="rounded-4" + > + + {status.map((s) => ( + + ))} + + + + + + + + + + +
+
- {/* Tabla + + + {/* Botón Buscar +
+ +
+ */} + + {/* Tabla + + + */} + - - */} - -
+
); } diff --git a/src/components/administrador/tabla-servicio-social.tsx b/src/components/administrador/tabla-servicio-social.tsx index f2c9416..df29918 100644 --- a/src/components/administrador/tabla-servicio-social.tsx +++ b/src/components/administrador/tabla-servicio-social.tsx @@ -99,7 +99,7 @@ export default function TablaServicioSocial({ admin, imprimirError }: Props) { return (
-

Servicios Sociales

+

Servicios Sociales

{ e.preventDefault(); obtenerServicios(1); }}> @@ -178,6 +178,8 @@ export default function TablaServicioSocial({ admin, imprimirError }: Props) { -
-
- - setSearch(s => ({ ...s, numeroCuenta: e.target.value }))} onKeyDown={(e) => e.key === 'Enter' && obtenerServicios()} /> -
-
- - setSearch(s => ({ ...s, nombre: e.target.value }))} onKeyDown={(e) => e.key === 'Enter' && obtenerServicios()} /> -
+
+ + + + Número de cuenta + + + + + setSearch(Prev => ({ ...Prev, numeroCuenta: e.target.value }))} + onKeyDown={(e) => { if (e.key === 'Enter') obtenerServicios(1); }} + className="rounded-4" + /> + + + -
- - -
+ + + Nombre + + + + + setSearch(Prev => ({ ...Prev, nombre: e.target.value}))} + onKeyDown={(e) => { if (e.key === 'Enter') + obtenerServicios(1);}} + className="rounded-4" + /> + + + -
- -
-
+ + + Status + + + + + setSearch(Prev => ({ ...Prev, idStatus: e.target.value}))} + className="rounded-4" + > + + {status.map((s) => ( + + ))} + + + + + + + + + +
{/* columnaFechaCreado={false} @@ -116,13 +171,14 @@ export default function TablaServiciosResponsable({ responsable, imprimirError } */}
); diff --git a/src/components/servicio-social-tabla.tsx b/src/components/servicio-social-tabla.tsx index 0bf6963..1b69276 100644 --- a/src/components/servicio-social-tabla.tsx +++ b/src/components/servicio-social-tabla.tsx @@ -14,6 +14,7 @@ interface Props { idTipoUsuario?: number; // 1=admin, 2=responsable, 3=alumno, 4=caso especial columnasResponsable?: boolean; onRowAction?: (row: ServicioSocialResponse, path: string) => void; + columnaCuestionario?: boolean; } export default function ServicioSocialTabla({ @@ -22,6 +23,9 @@ export default function ServicioSocialTabla({ onPageChange, idTipoUsuario, columnasResponsable = false, + columnaFechaInicio = false, + columnaFechaFin = false, + columnaCuestionario = false, onRowAction, }: Props) { const [info, setInfo] = useState(data || []); @@ -30,8 +34,8 @@ export default function ServicioSocialTabla({ const router = useRouter(); - const columnaFechaInicio = true; - const columnaFechaFin = true; + //const columnaFechaInicio = true; + //const columnaFechaFin = true; // 🔹 Cargar datos del padre si existen useEffect(() => { @@ -128,9 +132,6 @@ const servicioSelected = (row: ServicioSocialResponse | ServicioSocialConCasoEsp */ - - - return (
{loading ? ( @@ -141,13 +142,14 @@ const servicioSelected = (row: ServicioSocialResponse | ServicioSocialConCasoEsp - {columnaFechaInicio && } {columnaFechaFin && } + + @@ -164,7 +166,6 @@ const servicioSelected = (row: ServicioSocialResponse | ServicioSocialConCasoEsp //idTipoUsuario === 1 ? servicioSelected(item) : undefined //} > - @@ -192,6 +193,28 @@ const servicioSelected = (row: ServicioSocialResponse | ServicioSocialConCasoEsp )} + + + + + + {columnaCuestionario && ( + + )} ))} {info.length === 0 && ( @@ -233,17 +256,27 @@ const servicioSelected = (row: ServicioSocialResponse | ServicioSocialConCasoEsp ); } -// 🔧 Funciones auxiliares -function formatDate(value?: string | null) { +function formatDate(value?: string | null): string { if (!value) return ""; - const d = new Date(value); - if (isNaN(d.getTime())) return String(value); + + // Si ya viene como fecha ISO, forzamos a hora local sin modificar el día + const d = new Date(value.includes("T") ? value : `${value}T00:00:00`); + + if (isNaN(d.getTime())) { + console.warn("⚠️ Fecha inválida:", value); + return ""; + } + const day = String(d.getDate()).padStart(2, "0"); const month = String(d.getMonth() + 1).padStart(2, "0"); const year = d.getFullYear(); + return `${day}/${month}/${year}`; } + + + function statusClass(id?: number) { switch (id) { case 1: diff --git a/src/sass/bootstrap.scss b/src/sass/bootstrap.scss index a7b8952..2a5f1a0 100644 --- a/src/sass/bootstrap.scss +++ b/src/sass/bootstrap.scss @@ -32,6 +32,39 @@ $custom-colors: ( 'yellow-guapa': $yellow-guapa, ); +// Para el datapicker +.mi-calendario { + font-family: "Poppins", sans-serif; + border-radius: 10px; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); + border: 1px solid #dee2e6; // color tipo Bootstrap + background-color: #fff; + + .react-datepicker__header { + background-color: #756e6e; // azul Bootstrap + color: white; + border-bottom: none; + } + + .react-datepicker__current-month, + .react-datepicker__day-name { + color: white; + } + + .react-datepicker__day--selected, + .react-datepicker__day--keyboard-selected { + background-color: #0d6efd; + color: white; + border-radius: 50%; + } + + .react-datepicker__day:hover { + background-color: #e9ecef; + border-radius: 50%; + } +} + + $theme-colors: map-merge($theme-colors, $custom-colors); .form-registro { diff --git a/src/types/responses.d.ts b/src/types/responses.d.ts index 8e0b46f..d6a7e8d 100644 --- a/src/types/responses.d.ts +++ b/src/types/responses.d.ts @@ -14,6 +14,7 @@ export interface ServicioSocialResponse { cartaTermino?: boolean; idCuestionarioPrograma?: number | null; idCuestionarioPrograma2?: number | null; + cuestionarioCompletado?: boolean; } export interface Usuario {
Fecha Registro Número de Cuenta Nombre CarreraFecha InicioFecha FinStatusCarta TerminoCuestionario
{formatDate(item.fecha_registro)} {item.Usuario?.usuario} {item.Usuario?.nombre} {item.Carrera?.carrera}{item.cartaTermino ? ( + Completado + ) : ( + No Completado + )}{item.cuestionarioCompletado ? ( + Completado + ) : ( + No Completado + )} + {item.cuestionarioCompletado ? ( + Completado + ) : ( + No Completado + )} +