This commit is contained in:
2026-01-21 14:12:45 -06:00
14 changed files with 267 additions and 80 deletions
+45 -6
View File
@@ -7,6 +7,30 @@ import Information from "@/app/Components/Global/Information/information";
import ShowError from "@/app/Components/Global/ShowError";
import "@/app/globals.css";
import Table from "@/app/Components/Global/table";
import { envConfig } from "@/app/lib/config";
async function getInscripcion(idCuenta: number) {
try {
const res = await fetch(`${envConfig.apiUrl}/alumno-inscrito/${idCuenta}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
},
cache: "no-store",
});
if (!res.ok) {
throw new Error(`Error ${res.status}: ${res.statusText}`);
}
return await res.json();
} catch (error: any) {
return { error: error.message || "No se pudo cargar la inscripción" };
}
}
const headers = ["Inscrito", "Tiempo", "Confirmó"];
export default async function Page(props: {
searchParams?: Promise<{
@@ -21,18 +45,37 @@ export default async function Page(props: {
const machine = params?.machine ? params.machine : null;
let student: any = null;
let inscripcion: any = null;
let errorMessage = "";
if (numAcount) {
const result = await GetStudent(parseInt(numAcount));
const idCuenta = parseInt(numAcount);
const result = await GetStudent(idCuenta);
if (result.error) {
errorMessage = `${result.error}`;
} else {
student = result as Student;
}
const inscResult = await getInscripcion(idCuenta);
if (!inscResult.error && Array.isArray(inscResult)) {
inscripcion = inscResult;
} else {
inscripcion = [];
}
}
const tableData = Array.isArray(inscripcion)
? inscripcion.map((ins) => ({
Inscrito: ins.plataforma?.nombre || "—",
Tiempo: ins.tiempo_disponible
? `${ins.tiempo_disponible} minutos`
: "—",
Confirmó: ins.platica.data === 1 ? "sí" : "no",
}))
: [];
return (
<section className="containerSection">
{errorMessage && <ShowError key={Date.now()} message={errorMessage} />}
@@ -55,11 +98,7 @@ export default async function Page(props: {
NoCuenta={student.id_cuenta}
nombre={student.nombre}
/>
<Information
inscrito={"WINDOWS"}
tiempo={"9minutos"}
confirmo={"si/no"}
/>
<Table headers={headers} data={tableData} />
<div className="containerForm">
<label style={{ marginTop: "1rem" }}>
Seleccionar tiempo
+9 -6
View File
@@ -23,15 +23,18 @@
max-width: 450px;
}
@media (max-width: 800px) {
.containeInformation {
justify-content: center;
align-items: center;
}
.restarPass{
margin-top: 2rem;
height: fit-content;
}
@media (max-width: 800px) {
.containeInformation {
flex-direction: column;
justify-content: center;
align-items: center;
}
}
.restarPass{
margin-top: 0;
}
}
+5 -8
View File
@@ -1,14 +1,12 @@
import SearchUser from "@/app/Components/Global/SearchUser/searchUser";
import Information from "@/app/Components/Global/Information/information";
import Receipt from "@/app/Components/Receipt/Receipt";
import Selection from "@/app/Components/Selection/Selection";
import ShowError from "@/app/Components/Global/ShowError";
import { GetStudent } from "@/app/lib/getStudent";
import Table from "@/app/Components/Global/table";
import Inscripcion from "@/app/Components/Receipt/Inscripcion";
import { GetStudent } from "@/app/lib/getStudent";
import { envConfig } from "@/app/lib/config";
import "./inscripcion.css";
import Inscripcion from "@/app/Components/Receipt/Inscripcion";
if (!envConfig.apiUrl) {
console.error("API URL is not defined in envConfig");
@@ -60,8 +58,8 @@ export default async function Page(props: {
} else {
student = studentResult;
}
const inscResult = await getInscripcion(idCuenta);
const inscResult = await getInscripcion(idCuenta);
if (!inscResult.error && Array.isArray(inscResult)) {
inscripcion = inscResult;
} else {
@@ -73,7 +71,7 @@ export default async function Page(props: {
? inscripcion.map((ins) => ({
Inscrito: ins.plataforma?.nombre || "—",
Tiempo: ins.tiempo_disponible
? `${Math.floor(ins.tiempo_disponible / 60)} horas`
? `${ins.tiempo_disponible} minutos`
: "—",
Confirmó: ins.platica.data === 1 ? "sí" : "no",
}))
@@ -113,8 +111,7 @@ export default async function Page(props: {
<>
<Table headers={headers} data={tableData} />
<button
className="button buttonSearch"
style={{ marginTop: "2rem" }}
className="button buttonSearch restarPass"
>
Restablecer contraseña
</button>
+1 -1
View File
@@ -1,6 +1,6 @@
"use client";
import axios from "axios";
import { SetStateAction, useEffect, useState } from "react";
import { useEffect, useState } from "react";
import { envConfig } from "../lib/config";
interface mesas {
View File
@@ -43,7 +43,7 @@ function QuitarSancion({ data }: Props) {
<th>Motivo Sanción</th>
<th>Duración (semanas)</th>
<th>Fecha Sanción</th>
<th>Podría utilizar el servicio hasta</th>
<th>Podra utilizar el servicio hasta</th>
</tr>
</thead>
<tbody>
+3 -3
View File
@@ -11,7 +11,7 @@ interface Recibo {
fecha_registro: string;
monto: string;
user: {
nombre: string;
usuario: string;
};
}
@@ -72,7 +72,7 @@ function PorRecibos({ desde, hasta }: Props) {
<tbody>
{!loading && recibos.length === 0 && (
<tr>
<td colSpan={2}>No hay recibos en este rango</td>
<td colSpan={5}>No hay recibos en este rango</td>
</tr>
)}
@@ -82,7 +82,7 @@ function PorRecibos({ desde, hasta }: Props) {
<td>${Number(recibo.monto).toFixed(2)}</td>
<td>{recibo.fecha_recibo}</td>
<td>{recibo.fecha_registro}</td>
<td>{recibo.user.nombre}</td>
<td>{recibo.user.usuario}</td>
</tr>
))}
</tbody>
@@ -0,0 +1,11 @@
.containerDate{
gap: 10px;
width: 100%;
max-width: 100%;
}
.alingDate{
display: flex;
justify-content: flex-start;
gap: 10px;
}
@@ -1,14 +1,15 @@
'use client';
"use client";
import { useState } from 'react';
import { useState } from "react";
import "./SearchDate.css";
interface Props {
onSearch: (desde: string, hasta: string) => void;
}
function SearchDateBetween({ onSearch }: Props) {
const [startDate, setStartDate] = useState('');
const [endDate, setEndDate] = useState('');
const [startDate, setStartDate] = useState("");
const [endDate, setEndDate] = useState("");
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault();
@@ -17,26 +18,37 @@ function SearchDateBetween({ onSearch }: Props) {
};
return (
<form className="containerForm" onSubmit={handleSubmit}>
<label className="label">Desde</label>
<div className="groupInput">
<input
type="date"
value={startDate}
onChange={(e) => setStartDate(e.target.value)}
/>
<form className="containerForm containerDate" onSubmit={handleSubmit}>
<div className="alingDate">
<div className="">
<label className="label">Desde</label>
<div className="groupInput">
<input
type="date"
value={startDate}
onChange={(e) => setStartDate(e.target.value)}
/>
</div>
</div>
<div>
<label className="label">Hasta</label>
<div className="groupInput">
<input
type="date"
value={endDate}
onChange={(e) => setEndDate(e.target.value)}
/>
</div>
</div>
</div>
<label className="label">Hasta</label>
<div className="groupInput">
<input
type="date"
value={endDate}
onChange={(e) => setEndDate(e.target.value)}
/>
</div>
<button className="button buttonSearch" type="submit" style={{marginBottom:"10px"}}>
<button
className="button buttonSearch"
type="submit"
style={{ marginBottom: "10px" }}
>
Buscar
</button>
</form>
+1
View File
@@ -44,3 +44,4 @@ export default function SelectAreas(props: proms) {
</div>
);
}
//IO
@@ -21,7 +21,9 @@
cursor: pointer;
color: #585858;
width: 100%;
transition: background-color 0.3s ease, border 0.3s ease;
transition:
background-color 0.3s ease,
border 0.3s ease;
font-size: 1.5rem;
}
@@ -71,7 +73,9 @@
border-radius: 8px;
background-color: #ffffff;
transition: color 0.3s ease;
transition: opacity 0.4s ease, max-height 0.4s ease;
transition:
opacity 0.4s ease,
max-height 0.4s ease;
}
.subMenu ul a {
@@ -87,11 +91,6 @@
color: #101113;
}
.subMenu:hover ul {
opacity: 1;
max-height: 500px;
}
.subMenu:hover ul a {
display: flex;
}
@@ -138,6 +137,13 @@ tbody {
font-size: 1.25rem;
}
@media (min-width: 1001px) {
.subMenu:hover ul {
opacity: 1;
max-height: 500px;
}
}
@media (max-width: 1000px) {
.menuToggle {
display: flex;
@@ -153,7 +159,7 @@ tbody {
.barNavigation {
font-size: 15px;
display: block;
justify-content: end;
}
.barNavigation ul {
@@ -171,7 +177,9 @@ tbody {
pointer-events: none;
transition: transform 0.35s ease-in-out, opacity 0.35s ease-in-out,
transition:
transform 0.35s ease-in-out,
opacity 0.35s ease-in-out,
visibility 0.35s ease-in-out;
}
@@ -194,6 +202,10 @@ tbody {
padding: 0;
}
.barNavigation li {
color: white;
}
.barNavigation li:hover {
color: white;
border-radius: 0;
@@ -205,14 +217,16 @@ tbody {
top: 0px;
width: 100%;
background-color: rgb(1, 92, 184);
max-height: 0;
opacity: 0;
overflow: hidden;
transform: translateY(-5px);
transition: max-height 0.35s ease, opacity 0.3s ease, transform 0.3s ease;
transition:
max-height 0.35s ease,
opacity 0.3s ease,
transform 0.3s ease;
}
.subMenu.open ul {
@@ -221,8 +235,9 @@ tbody {
transform: translateY(0);
}
.subMenu ul {
opacity: 0;
.subMenu.open ul a{
display: flex;
pointer-events:auto;
}
thead,
@@ -14,6 +14,11 @@ function BarNavigation() {
}
};
const closeAllMenus = () => {
setOpenMenu(false);
setOpenSubMenu(null);
};
return (
<nav className="barNavigation">
<div className={`menuToggle ${openMenu ? "" : ""}`} onClick={toggleMenu}>
@@ -25,11 +30,25 @@ function BarNavigation() {
<ul className={openMenu ? "active" : ""}>
<li className={`subMenu ${openSubMenu === 0 ? "open" : ""}`}>
<span onClick={() => toggleSubMenu(0)}>Inscripciónes</span>
<ul className="containerLinks" onClick={toggleMenu}>
<Link href="/AgregarTiempo" className="links">
<ul onClick={toggleMenu}>
<Link
href="/AgregarTiempo"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Agregar Tiempo</li>
</Link>
<Link href="/Inscripcion" className="links">
<Link
href="/Inscripcion"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Inscripción Usuario</li>
</Link>
</ul>
@@ -38,16 +57,44 @@ function BarNavigation() {
<li className={`subMenu ${openSubMenu === 1 ? "open" : ""}`}>
<span onClick={() => toggleSubMenu(1)}>Servicios</span>
<ul onClick={toggleMenu}>
<Link href="/Impresiones" className="links">
<Link
href="/Impresiones"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Impresiones y Ploteo</li>
</Link>
<Link href="/AsignacionMesas" className="links">
<Link
href="/AsignacionMesas"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Asignacion de Mesas</li>
</Link>
<Link href="/AsignacionEquipo" className="links">
<Link
href="/AsignacionEquipo"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Asignacion de Equipos</li>
</Link>
<Link href="/Monitor" className="links">
<Link
href="/Monitor"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Monitor</li>
</Link>
</ul>
@@ -56,16 +103,44 @@ function BarNavigation() {
<li className={`subMenu ${openSubMenu === 2 ? "open" : ""}`}>
<span onClick={() => toggleSubMenu(2)}>Equipo</span>
<ul onClick={toggleMenu}>
<Link href="/InformacionEquipo" className="links">
<Link
href="/InformacionEquipo"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Informacion de Equipos</li>
</Link>
<Link href="/ActivosMantenimiento" className="links">
<Link
href="/ActivosMantenimiento"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Activos y en Mantenimiento</li>
</Link>
<Link href="/Mensajes" className="links">
<Link
href="/Mensajes"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Mensajes</li>
</Link>
<Link href="/Programas" className="links">
<Link
href="/Programas"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Programas</li>
</Link>
</ul>
@@ -74,24 +149,59 @@ function BarNavigation() {
<li className={`subMenu ${openSubMenu === 3 ? "open" : ""}`}>
<span onClick={() => toggleSubMenu(3)}>Reportes</span>
<ul onClick={toggleMenu}>
<Link href="/Reportes" className="links">
<Link
href="/Reportes"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Reportes</li>
</Link>
<Link href="/Inscritos" className="links">
<Link
href="/Inscritos"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Inscritos</li>
</Link>
<Link href="/BitacoraSanciones" className="links">
<Link
href="/BitacoraSanciones"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<li>Bitacora y sanciones</li>
</Link>
</ul>
</li>
<li className="subMenu" onClick={toggleMenu}>
<Link href="/QuitarSancion" className="links">
<Link
href="/QuitarSancion"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<span>Quitar sanción</span>
</Link>
</li>
<li className="subMenu" onClick={toggleMenu}>
<Link href="/CambiarPass" className="links">
<Link
href="/CambiarPass"
className="links"
onClick={(e) => {
e.stopPropagation();
closeAllMenus();
}}
>
<span> Cambiar contraseña</span>
</Link>
</li>
@@ -101,4 +211,4 @@ function BarNavigation() {
}
export default BarNavigation;
//IO
//IO
+1 -2
View File
@@ -101,7 +101,6 @@ footer p {
.containerForm {
width: 100%;
max-width: 450px;
gap:10px;
}
.img {
@@ -283,7 +282,7 @@ a {
.informationKey {
font-weight: 600;
text-transform: capitalize;
width: 100px;
min-width: 80px;
}
.informationValue {
+1 -1
View File
@@ -15,7 +15,7 @@
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "react-jsx",
"jsx": "preserve",
"incremental": true,
"plugins": [
{