restructuring layout

This commit is contained in:
2025-09-26 16:56:07 -06:00
parent dce377b586
commit 3bd6d6b7c2
64 changed files with 187 additions and 195 deletions
+5 -5
View File
@@ -1,9 +1,9 @@
"use client"; "use client";
import SearchUser from "@/app/Components/SearchUser/searchUser"; import Areas from "@/app/Components/Equipo/ActivosMantenimiento/Areas";
import Equipos from "@/app/Components/ActivosMantenimiento/Equipos"; import Mesas from "@/app/Components/Equipo/ActivosMantenimiento/Mesas";
import Toggle from "@/app/Components/Toggle/Toggle"; import Equipos from "@/app/Components/Equipo/Equipos/equipos";
import Areas from "@/app/Components/ActivosMantenimiento/Areas"; import SearchUser from "@/app/Components/Global/SearchUser/searchUser";
import Mesas from "@/app/Components/ActivosMantenimiento/Mesas"; import Toggle from "@/app/Components/Global/Toggle/Toggle";
export default function Page(props: { export default function Page(props: {
searchParams?: Promise<{ searchParams?: Promise<{
+12 -6
View File
@@ -1,7 +1,7 @@
import SearchUser from "@/app/Components/SearchUser/searchUser"; import SearchUser from "@/app/Components/Global/SearchUser/searchUser";
import Information from "@/app/Components/Information/information"; import Information from "@/app/Components/Global/Information/information";
import Receipt from "@/app/Components/Receipt/Receipt"; import Receipt from "@/app/Components/Receipt/Receipt";
import AlertBox from "@/app/Components/AlertBox/AlertBox"; import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
import { GetStudent } from "@/app/lib/getStudent"; import { GetStudent } from "@/app/lib/getStudent";
@@ -16,12 +16,18 @@ export default async function Page(props: {
}) { }) {
const params = await props.searchParams; const params = await props.searchParams;
const numAcount = params?.numAcount ? params.numAcount : null; const numAcount = params?.numAcount ? params.numAcount : null;
const showSuccess = params?.success ? parseInt(params.success) : null; const showSuccess = params?.success ? params.success : null;
const showError = params?.error ? params.error : null; let showError = params?.error ? params.error : null;
let student: any = null; let student: any = null;
if (numAcount) { if (numAcount) {
student = await GetStudent(parseInt(numAcount)); const result = await GetStudent(parseInt(numAcount));
if (result.error) {
showError = "Alumno no encontrado";
} else {
student = result;
}
} }
return ( return (
+3 -66
View File
@@ -1,75 +1,12 @@
"use client"; import RegisterAlta from "@/app/Components/Inscripciones/Alta/registerAlta";
import { useState } from "react"; import "./style.css";
import StepNavigator from "@/app/Components/StepNavigator/StepNavigator";
export default function Page() { export default function Page() {
const [step, setStep] = useState(1);
const [major, setMajor] = useState("");
return ( return (
<section className="containerSection"> <section className="containerSection">
<h1 className="title">ALTA</h1> <h1 className="title">ALTA</h1>
<StepNavigator totalSteps={2} onFinish={() => console.log()}> <RegisterAlta />
<form className="containerForm gap">
<label className="label">No.Cuenta</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca un número de cuenta..."
/>
<label className="label">Nombre</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca el nombre"
/>
<label className="label">Apellido Paterno</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca el apellido paterno"
/>
<label className="label">Apellido Materno</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca el apellido materno"
/>
</form>
<form className="gap">
<label className="label">Email</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca "
/>
<label className="label">Fecha Nacimiento</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca "
/>
<label className="label">Carrera</label>
<select value={major} onChange={(e) => setMajor(e.target.value)}>
<option value="">-- Selecciona un tiempo --</option>
<option value="15">15 minutos</option>
</select>
<button className="button buttonSearch">registrar</button>
</form>
</StepNavigator>
</section> </section>
); );
} }
+23
View File
@@ -0,0 +1,23 @@
.gridAlta {
display: grid;
grid-template-columns: 1fr 1fr;
}
.containerAlta {
background-color: #f9f9f9;
width: 100%;
max-width: 900px;
padding: 1rem;
border-radius: 4px;
}
@media (max-width: 800px) {
.gridAlta {
grid-template-columns: 1fr;
justify-items: center;
min-width: max-content;
}
.containerAlta {
width: 80%;
}
}
@@ -1,29 +0,0 @@
.availableTablesContainer {
/* You can add specific styles for the table list here */
width: 45%; /* Adjust width to fit the layout */
background-color: #f9f9f9;
border-radius: 8px;
padding: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tableList {
list-style: none;
padding: 0;
display: flex;
flex-direction: column; /* Or use flex-wrap to make it a grid */
height: 200px; /* Or a fixed height with overflow */
overflow-y: auto;
}
.tableList li {
padding: 8px;
border-bottom: 1px solid #ddd;
cursor: pointer;
transition: background-color 0.2s;
}
.tableList li:hover {
background-color: #f0f0f0;
}
+2 -2
View File
@@ -1,6 +1,6 @@
"use client"; "use client";
import SearchUser from "@/app/Components/SearchUser/searchUser"; import SearchUser from "@/app/Components/Global/SearchUser/searchUser";
import Toggle from "@/app/Components/Toggle/Toggle"; import Toggle from "@/app/Components/Global/Toggle/Toggle";
export default function Page() { export default function Page() {
return ( return (
@@ -1,29 +0,0 @@
.availableTablesContainer {
/* You can add specific styles for the table list here */
width: 45%; /* Adjust width to fit the layout */
background-color: #f9f9f9;
border-radius: 8px;
padding: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.tableList {
list-style: none;
padding: 0;
display: flex;
flex-direction: column; /* Or use flex-wrap to make it a grid */
height: 200px; /* Or a fixed height with overflow */
overflow-y: auto;
}
.tableList li {
padding: 8px;
border-bottom: 1px solid #ddd;
cursor: pointer;
transition: background-color 0.2s;
}
.tableList li:hover {
background-color: #f0f0f0;
}
+2 -2
View File
@@ -1,6 +1,6 @@
"use client"; "use client";
import SearchUser from "@/app/Components/SearchUser/searchUser"; import SearchUser from "@/app/Components/Global/SearchUser/searchUser";
import Toggle from "@/app/Components/Toggle/Toggle"; import Toggle from "@/app/Components/Global/Toggle/Toggle";
import { useState } from "react"; import { useState } from "react";
export default function Page() { export default function Page() {
+5 -5
View File
@@ -1,10 +1,10 @@
"use client"; "use client";
import Toggle from "@/app/Components/Toggle/Toggle"; import BitacoraAlumno from "@/app/Components/Reportes/BitacoraSanciones/BitacoraAlumno";
import Sanciones from "@/app/Components/BitacoraSanciones/Sanciones"; import BitacoraEquipo from "@/app/Components/Reportes/BitacoraSanciones/BitacoraEquipo";
import BitacoraMesas from "@/app/Components/BitacoraSanciones/BitacoraMesas"; import BitacoraMesas from "@/app/Components/Reportes/BitacoraSanciones/BitacoraMesas";
import BitacoraAlumno from "@/app/Components/BitacoraSanciones/BitacoraAlumno"; import Sanciones from "@/app/Components/Reportes/BitacoraSanciones/Sanciones";
import BitacoraEquipo from "@/app/Components/BitacoraSanciones/BitacoraEquipo"; import Toggle from "@/app/Components/Global/Toggle/Toggle";
export default function Page() { export default function Page() {
return ( return (
+5 -6
View File
@@ -1,13 +1,12 @@
import ChangePassword from "../../Components/ChangePassword/changePassword"; import ChangePassword from "@/app/Components/auth/ChangePassword/changePassword";
export default function Page() { export default function Page() {
return ( return (
<section className='containerSection'> <section className="containerSection">
<h2 className='title'> Cambiar contraseña </h2> <h2 className="title"> Cambiar contraseña </h2>
<ChangePassword/> <ChangePassword />
</section> </section>
); );
} }
//IO //IO
+8 -7
View File
@@ -1,12 +1,13 @@
import SearchUser from "../../Components/SearchUser/searchUser"; import SearchUser from "../../Components/Global/SearchUser/searchUser";
import Receipt from "../../Components/Receipt/Receipt"; import Receipt from "../../Components/Receipt/Receipt";
import Impressions from "../../Components/Impressions/impressions"; import Toggle from "../../Components/Global/Toggle/Toggle";
import Toggle from "../../Components/Toggle/Toggle"; import Information from "../../Components/Global/Information/information";
import Information from "../../Components/Information/information"; import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
import AlertBox from "@/app/Components/AlertBox/AlertBox";
import { GetStudent } from "@/app/lib/getStudent"; import { GetStudent } from "@/app/lib/getStudent";
import "@/app/globals.css"; import "@/app/globals.css";
import Impressions from "@/app/Components/Servicios/Impressions/impressions";
export default async function Page(props: { export default async function Page(props: {
searchParams?: Promise<{ searchParams?: Promise<{
numAcount: string; numAcount: string;
@@ -17,14 +18,14 @@ export default async function Page(props: {
const params = await props.searchParams; const params = await props.searchParams;
const numAcount = params?.numAcount ? params.numAcount : null; const numAcount = params?.numAcount ? params.numAcount : null;
const showSuccess = params?.success ? params.success : null; const showSuccess = params?.success ? params.success : null;
let showError = params?.error ? params.error : null; const showError = params?.error ? params.error : null;
let student: any = null; let student: any = null;
if (numAcount) { if (numAcount) {
const result = await GetStudent(parseInt(numAcount)); const result = await GetStudent(parseInt(numAcount));
if (result.error) { if (result.error) {
showError = "Alumno no encontrado";
} else { } else {
student = result; student = result;
} }
+3 -3
View File
@@ -1,8 +1,8 @@
import ProgramSelector from "@/app/Components/ProgramSelector/ProgramSelector"; import Toggle from "@/app/Components/Global/Toggle/Toggle";
import Toggle from "@/app/Components/Toggle/Toggle"; import ProgramSelector from "@/app/Components/Equipo/ProgramSelector/ProgramSelector";
import Equipos from "@/app/Components/Equipo/Equipos/equipos";
import "./informacionequipo.css"; import "./informacionequipo.css";
import Equipos from "@/app/Components/Equipos/equipos";
export default function Page() { export default function Page() {
return ( return (
@@ -1,27 +1,31 @@
import SearchUser from "@/app/Components/SearchUser/searchUser"; import SearchUser from "@/app/Components/Global/SearchUser/searchUser";
import Information from "@/app/Components/Information/information"; import Information from "@/app/Components/Global/Information/information";
import StepNavigator from "@/app/Components/StepNavigator/StepNavigator"; import StepNavigator from "@/app/Components/Global/StepNavigator/StepNavigator";
import Receipt from "@/app/Components/Receipt/Receipt"; import Receipt from "@/app/Components/Receipt/Receipt";
import Selection from "@/app/Components/Selection/Selection"; import Selection from "@/app/Components/Selection/Selection";
import { GetStudent } from "@/app/lib/getStudent"; import { GetStudent } from "@/app/lib/getStudent";
import "./inscriptions.css"; import "./inscriptions.css";
import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
export default async function Page(props: { export default async function Page(props: {
searchParams?: Promise<{ searchParams?: Promise<{
numAcount: string; numAcount: string;
success?: string;
error?: string;
}>; }>;
}) { }) {
const params = await props.searchParams; const params = await props.searchParams;
const numAcount = params?.numAcount ? params.numAcount : null; const numAcount = params?.numAcount ? params.numAcount : null;
const showSuccess = params?.success ? params.success : null;
let showError = params?.error ? params.error : null;
let student: any = null; let student: any = null;
let error: string | null = null;
if (numAcount) { if (numAcount) {
const result = await GetStudent(parseInt(numAcount)); const result = await GetStudent(parseInt(numAcount));
if (result.error) { if (result.error) {
error = result.error; showError = "Alumno no encontrado";
} else { } else {
student = result; student = result;
} }
@@ -29,9 +33,19 @@ export default async function Page(props: {
return ( return (
<section className="containerSection"> <section className="containerSection">
{showError && (
<>
<AlertBox key={Date.now()} message={showError} type="error" />
</>
)}
{showSuccess && (
<AlertBox key={Date.now()} message={showSuccess} type="success" />
)}
<h2 className="title"> INSCRIPCION </h2> <h2 className="title"> INSCRIPCION </h2>
<SearchUser urlBase="Inscripciones" value={numAcount} /> <SearchUser urlBase="Inscripcion" value={numAcount} />
{student ? ( {student ? (
<> <>
@@ -44,7 +58,7 @@ export default async function Page(props: {
<StepNavigator totalSteps={2}> <StepNavigator totalSteps={2}>
<Selection /> <Selection />
<Receipt urlBase={"Inscripciones"} numAcount={student.id_cuenta} /> <Receipt urlBase={"Inscripcion"} numAcount={student.id_cuenta} />
</StepNavigator> </StepNavigator>
</> </>
) : ( ) : (
+2 -2
View File
@@ -1,7 +1,7 @@
"use client"; "use client";
import EnviarMensaje from "@/app/Components/EviarMensaje/EnviarMensaje"; import EnviarMensaje from "@/app/Components/Equipo/EviarMensaje/EnviarMensaje";
import Toggle from "@/app/Components/Toggle/Toggle"; import Toggle from "@/app/Components/Global/Toggle/Toggle";
export default function Page() { export default function Page() {
return ( return (
-1
View File
@@ -3,7 +3,6 @@ import { useState } from "react";
import styleprograms from "./programas.module.css"; import styleprograms from "./programas.module.css";
export default function Page() { export default function Page() {
// modo puede ser: "ver", "editar", "nuevo"
const [modo, setModo] = useState("ver"); const [modo, setModo] = useState("ver");
const handleNuevo = () => { const handleNuevo = () => {
+1 -1
View File
@@ -1,6 +1,6 @@
"use client"; "use client";
import SearchUser from "@/app/Components/SearchUser/searchUser"; import SearchUser from "@/app/Components/Global/SearchUser/searchUser";
import QuitarSancion from "@/app/Components/QuitarSancion/QuitarSancion"; import QuitarSancion from "@/app/Components/QuitarSancion/QuitarSancion";
export default function Page() { export default function Page() {
+3 -3
View File
@@ -2,8 +2,8 @@
import { useState } from "react"; import { useState } from "react";
import styles from "./Page.module.css"; // importamos el css import styles from "./Page.module.css"; // importamos el css
import Toggle from "@/app/Components/Toggle/Toggle"; import Toggle from "@/app/Components/Global/Toggle/Toggle";
import SearchDateBetween from "@/app/Components/SearchDateBetween/SearchDateBetween"; import SearchDateBetween from "@/app/Components/Reportes/SearchDateBetween/SearchDateBetween";
export default function Page() { export default function Page() {
const [reportes] = useState([ const [reportes] = useState([
@@ -69,7 +69,7 @@ export default function Page() {
label: "Por Servicio", label: "Por Servicio",
content: ( content: (
<> <>
<SearchDateBetween /> <SearchDateBetween />
<div className={styles.tableContainer}> <div className={styles.tableContainer}>
<table className={styles.machineTable}> <table className={styles.machineTable}>
<thead> <thead>
+7 -3
View File
@@ -1,8 +1,12 @@
import { ReactNode } from "react"; import { ReactNode } from "react";
import BarNavigation from "../Components/BarNavigation/BarNavigation"; import BarNavigation from "../Components/layout/BarNavigation/BarNavigation";
import Logout from "../Components/Logout/Logout"; import Logout from "../Components/auth/Logout/Logout";
export default function PrivateLayout({ children }: { children: ReactNode }) { export default async function PrivateLayout({
children,
}: {
children: ReactNode;
}) {
return ( return (
<div className="mainContainer"> <div className="mainContainer">
<BarNavigation /> <BarNavigation />
@@ -1,8 +1,8 @@
"use client"; "use client";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import AlertBox from "@/app/Components/AlertBox/AlertBox"; import AlertBox from "@/app/Components/Global/AlertBox/AlertBox";
import ClearParams from "@/app/Components/ClearParams/ClearParams"; import ClearParams from "@/app/Components/Global/ClearParams/ClearParams";
export default function GlobalAlert() { export default function GlobalAlert() {
const [showSuccess, setShowSuccess] = useState<string | null>(null); const [showSuccess, setShowSuccess] = useState<string | null>(null);
@@ -22,14 +22,12 @@ export default function GlobalAlert() {
{showError && ( {showError && (
<> <>
<AlertBox key={Date.now()} message={showError} type="error" /> <AlertBox key={Date.now()} message={showError} type="error" />
<ClearParams paramsToClear={["error"]} />
</> </>
)} )}
{showSuccess && ( {showSuccess && (
<> <>
<AlertBox key={Date.now()} message={showSuccess} type="success" /> <AlertBox key={Date.now()} message={showSuccess} type="success" />
<ClearParams paramsToClear={["success"]} />
</> </>
)} )}
</section> </section>
@@ -0,0 +1,68 @@
"use client";
import { useState } from "react";
export default function RegisterAlta() {
const [major, setMajor] = useState("");
return (
<form className="containerAlta gap gridAlta">
<div className="containerForm">
<label className="label">No.Cuenta</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca un número de cuenta..."
/>
</div>
<div className="containerForm">
<label className="label">Nombre</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca el nombre"
/>
</div>
<div className="containerForm">
<label className="label">Apellido Paterno</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca el apellido paterno"
/>
</div>
<div className="containerForm">
<label className="label">Apellido Materno</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca el apellido materno"
/>
</div>
<div className="containerForm">
<label className="label">Fecha Nacimiento</label>
<input
type="text"
//value={user}
//onChange={(e) => setUser(e.target.value)}
placeholder="Coloca fecha empezando por año"
/>
</div>
<div className="containerForm">
<label className="label">Carrera</label>
<select value={major} onChange={(e) => setMajor(e.target.value)}>
<option value="">Selecciona la carrera</option>
</select>
</div>
<button className="button buttonSearch">registrar</button>
</form>
);
}
+2 -2
View File
@@ -89,7 +89,7 @@ function Receipt({ urlBase, numAcount }: ReceiptsProps) {
value={folio} value={folio}
onChange={(error) => { onChange={(error) => {
const value = error.target.value; const value = error.target.value;
if (/^\d*$/.test(value)) { if (/^\d*$/.test(value) && value.length <= 7) {
setFolio(value); setFolio(value);
} }
}} }}
@@ -114,7 +114,7 @@ function Receipt({ urlBase, numAcount }: ReceiptsProps) {
setAmount(value); setAmount(value);
} else { } else {
router.push( router.push(
`/Impresiones?numAcount=${numAcount}&error=El monto no puede superar $1000.00` `${urlBase}?numAcount=${numAcount}&error=El monto no puede superar $1000.00`
); );
} }
} }
@@ -1,8 +1,8 @@
"use client"; "use client";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import styles from "./Page.module.css"; import styles from "./Page.module.css";
import SearchUser from "../SearchUser/searchUser"; import SearchUser from "../../Global/SearchUser/searchUser";
import Information from "../Information/information"; import Information from "../../Global/Information/information";
import { GetStudent } from "@/app/lib/getStudent"; import { GetStudent } from "@/app/lib/getStudent";
import { envConfig } from "@/app/lib/config"; import { envConfig } from "@/app/lib/config";
@@ -1,5 +1,5 @@
"use client"; "use client";
import { Margarine } from "next/font/google";
import { useState } from "react"; import { useState } from "react";
function SearchDateBetween() { function SearchDateBetween() {
@@ -3,8 +3,8 @@ import { useState } from "react";
import { loginUser } from "@/app/lib/login"; import { loginUser } from "@/app/lib/login";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import AlertBox from "../AlertBox/AlertBox";
import "./Login.css"; import "./Login.css";
import AlertBox from "../../Global/AlertBox/AlertBox";
function Login() { function Login() {
const [user, setUser] = useState(""); const [user, setUser] = useState("");
@@ -24,7 +24,7 @@ function BarNavigation() {
<ul className={openMenu ? "active" : ""}> <ul className={openMenu ? "active" : ""}>
<li className={`subMenu ${openSubMenu === 0 ? "open" : ""}`}> <li className={`subMenu ${openSubMenu === 0 ? "open" : ""}`}>
<span onClick={() => toggleSubMenu(0)}>Inscripciones</span> <span onClick={() => toggleSubMenu(0)}>Inscripcion</span>
<ul className="containerLinks" onClick={toggleMenu}> <ul className="containerLinks" onClick={toggleMenu}>
<Link href="/Alta" className="links"> <Link href="/Alta" className="links">
<li>Alta</li> <li>Alta</li>
@@ -32,8 +32,8 @@ function BarNavigation() {
<Link href="/AgregarTiempo" className="links"> <Link href="/AgregarTiempo" className="links">
<li>Agregar Tiempo</li> <li>Agregar Tiempo</li>
</Link> </Link>
<Link href="/Inscripciones" className="links"> <Link href="/Inscripcion" className="links">
<li>Inscripciones</li> <li>Inscripcion</li>
</Link> </Link>
</ul> </ul>
</li> </li>
+1
View File
@@ -164,6 +164,7 @@ footer p {
input, input,
select { select {
flex: 1; flex: 1;
width: 100%;
min-width: 200px; min-width: 200px;
max-width: 500px; max-width: 500px;
padding: 1rem; padding: 1rem;
+3 -3
View File
@@ -1,10 +1,10 @@
import type { Metadata } from "next"; import type { Metadata } from "next";
import { Poppins } from "next/font/google"; import { Poppins } from "next/font/google";
import Header from "./Components/Header/Header";
import Footer from "./Components/Footer/Footer"; import Header from "./Components/layout/Header/Header";
import Footer from "./Components/layout/Footer/Footer";
import "./globals.css"; import "./globals.css";
import GlobalAlert from "./Components/visual/GlobalAlert";
const poppins = Poppins({ const poppins = Poppins({
variable: "--font-poppins", variable: "--font-poppins",
+2 -2
View File
@@ -1,4 +1,4 @@
import Login from "./Components/Login/Login"; import Login from "./Components/auth/Login/Login";
import { LoginRedirect } from "./Routes/LoginRedirect"; import { LoginRedirect } from "./Routes/LoginRedirect";
export default function Home() { export default function Home() {
@@ -13,4 +13,4 @@ export default function Home() {
</div> </div>
); );
} }
//IO //IO