From 10adca26af5ebf5a151797c4d16c4ba19660c005 Mon Sep 17 00:00:00 2001
From: IO420 <320154041@pcpuma.acatlan.unam.mx>
Date: Wed, 17 Sep 2025 19:42:13 -0600
Subject: [PATCH] fixed problems and add AlertBox

---
 app/(private)/ActivosMantenimiento/page.tsx |  2 +-
 app/(private)/AgregarTiempo/page.tsx        | 47 +++++++++++++--------
 app/(private)/AsignacionEquipo/page.tsx     |  4 +-
 app/(private)/AsignacionMesas/page.tsx      |  4 +-
 app/(private)/BitacoraSanciones/page.tsx    |  2 +-
 app/(private)/Impresiones/page.tsx          | 20 ++++++---
 app/(private)/Inscripciones/page.tsx        |  2 +-
 app/(private)/QuitarSancion/page.tsx        |  2 +-
 app/Components/AlertBox/AlertBox.css        | 32 ++++++++++++++
 app/Components/AlertBox/AlertBox.tsx        | 37 ++++++++++++++++
 app/Components/Impressions/impressions.tsx  | 24 +++--------
 app/Components/SearchUser/searchUser.tsx    | 10 ++++-
 app/globals.css                             | 32 --------------
 app/lib/getStudent.ts                       |  1 +
 14 files changed, 134 insertions(+), 85 deletions(-)
 create mode 100644 app/Components/AlertBox/AlertBox.css
 create mode 100644 app/Components/AlertBox/AlertBox.tsx

diff --git a/app/(private)/ActivosMantenimiento/page.tsx b/app/(private)/ActivosMantenimiento/page.tsx
index 8517154..cd39ba2 100644
--- a/app/(private)/ActivosMantenimiento/page.tsx
+++ b/app/(private)/ActivosMantenimiento/page.tsx
@@ -19,7 +19,7 @@ export default function Page() {
               label: "Equipos",
               content: (
                 <>
-                  <SearchUser />
+                  <SearchUser urlBase="ActivosMantenimiento" />
 
                   <form className="containerForm">
                     <label className="label">Equipos disponibles</label>
diff --git a/app/(private)/AgregarTiempo/page.tsx b/app/(private)/AgregarTiempo/page.tsx
index b59a799..c7a081d 100644
--- a/app/(private)/AgregarTiempo/page.tsx
+++ b/app/(private)/AgregarTiempo/page.tsx
@@ -1,26 +1,39 @@
+import SearchUser from "@/app/Components/SearchUser/searchUser";
+import Information from "@/app/Components/Information/information";
+import Receipt from "@/app/Components/Receipt/Receipt";
+import { GetStudent } from "@/app/lib/getStudent";
 
-import SearchUser from '@/app/Components/SearchUser/searchUser';
-import './addTime.css'
-import Information from '@/app/Components/Information/information';
-import Receipt from '@/app/Components/Receipt/Receipt';
+import "./addTime.css";
+
+export default async function Page({ searchParams }: any) {
+
+  const numAccount = searchParams?.numAccount
+    ? Number(searchParams.numAccount)
+    : null;
+    
+  let student: any = null;
+  if (numAccount) {
+    student = await GetStudent(numAccount);
+  }
 
-export default function Page() {
   return (
-    <section className='containerSection'>
-      <h2 className='title'> AGREGAR TIEMPO </h2>
+    <section className="containerSection">
+      <h2 className="title"> AGREGAR TIEMPO </h2>
 
-      <SearchUser />
+      <SearchUser urlBase="AgregarTiempo" />
 
-      <Information
-        NoCuenta="idcuanta"
-        Nombre="juan"
-      />
+      {student ? (
+        <>
+          <Information NoCuenta={student.id_cuenta} Nombre={student.nombre} />
 
-      <div className="addTime">
-        <Receipt />
-      </div>
+          <div className="addTime">
+            <Receipt />
+          </div>
+        </>
+      ) : (
+        <></>
+      )}
     </section>
-
   );
 }
-//IO
\ No newline at end of file
+//IO
diff --git a/app/(private)/AsignacionEquipo/page.tsx b/app/(private)/AsignacionEquipo/page.tsx
index e0280d3..8fa7b35 100644
--- a/app/(private)/AsignacionEquipo/page.tsx
+++ b/app/(private)/AsignacionEquipo/page.tsx
@@ -20,7 +20,7 @@ export default function Page() {
               label: "Asignar tiempo",
               content: (
                 <>
-                  <SearchUser />
+                  <SearchUser urlBase="AsignacionEquipo"/>
 
                   <form className="containerForm"></form>
                 </>
@@ -39,7 +39,7 @@ export default function Page() {
                       <input type="checkbox" /> Cuenta
                     </label>
                   </div>
-                  <SearchUser />
+                  <SearchUser urlBase="AsignacionEquipo"/>
                 </>
               ),
             },
diff --git a/app/(private)/AsignacionMesas/page.tsx b/app/(private)/AsignacionMesas/page.tsx
index e6120f3..9ce759f 100644
--- a/app/(private)/AsignacionMesas/page.tsx
+++ b/app/(private)/AsignacionMesas/page.tsx
@@ -20,7 +20,7 @@ export default function Page() {
               label: "Asignar mesa",
               content: (
                 <>
-                  <SearchUser />
+                  <SearchUser urlBase="AsignacionMesas"/>
 
                   <form className="containerForm">
                     <label className="label">Mesas disponibles</label>
@@ -58,7 +58,7 @@ export default function Page() {
                       <input type="checkbox" /> Cuenta
                     </label>
                   </div>
-                  <SearchUser />
+                  <SearchUser urlBase="AsignacionMesas"/>
                 </>
               ),
             },
diff --git a/app/(private)/BitacoraSanciones/page.tsx b/app/(private)/BitacoraSanciones/page.tsx
index 9738f06..d82577f 100644
--- a/app/(private)/BitacoraSanciones/page.tsx
+++ b/app/(private)/BitacoraSanciones/page.tsx
@@ -166,7 +166,7 @@ export default function Page() {
             label: "Sanciones",
             content: (
               <>
-                <SearchUser />
+                <SearchUser urlBase="BitacoraSanciones"/>
                 <Information NoCuenta="id cuenta" Nombre="id nombre" />
                 <div className={styles.tableContainer}>
                   <table className={styles.machineTable}>
diff --git a/app/(private)/Impresiones/page.tsx b/app/(private)/Impresiones/page.tsx
index 1159862..ba1edda 100644
--- a/app/(private)/Impresiones/page.tsx
+++ b/app/(private)/Impresiones/page.tsx
@@ -6,24 +6,30 @@ import Information from "../../Components/Information/information";
 
 import "@/app/globals.css";
 import { GetStudent } from "@/app/lib/getStudent";
+import AlertBox from "@/app/Components/AlertBox/AlertBox";
 
-export default async function Page({
-  searchParams,
-}: {
-  searchParams: { numAccount?: number };
-}) {
+export default async function Page({ searchParams }: any) {
   const params = await searchParams;
   const numAccount = params.numAccount ? Number(params.numAccount) : null;
 
   let student: any = null;
+  let error: string | null = null;
   if (numAccount) {
-    student = await GetStudent(numAccount);
+    const result = await GetStudent(numAccount);
+
+    if (result.error) {
+      error = result.error;
+    } else {
+      student = result;
+    }
   }
 
   return (
     <section className="containerSection">
+      {error && <AlertBox message={error} type="error" />}
+
       <h2 className="title">IMPRESIONES Y PLOTEO</h2>
-      <SearchUser />
+      <SearchUser urlBase="Impresiones" />
 
       {student ? (
         <>
diff --git a/app/(private)/Inscripciones/page.tsx b/app/(private)/Inscripciones/page.tsx
index 4a1d2de..657ce35 100644
--- a/app/(private)/Inscripciones/page.tsx
+++ b/app/(private)/Inscripciones/page.tsx
@@ -12,7 +12,7 @@ export default function Page() {
     <section className="containerSection">
       <h2 className="title"> INSCRIPCION </h2>
 
-      <SearchUser />
+      <SearchUser urlBase="Inscripciones"/>
 
       <Information
         NoCuenta="idcuanta"
diff --git a/app/(private)/QuitarSancion/page.tsx b/app/(private)/QuitarSancion/page.tsx
index aab0b2f..129c7c2 100644
--- a/app/(private)/QuitarSancion/page.tsx
+++ b/app/(private)/QuitarSancion/page.tsx
@@ -17,7 +17,7 @@ export default function Page() {
   return (
     <section className="containerSection">
       <h2 className="title"> Quitar Sanciones </h2>
-      <SearchUser />
+      <SearchUser urlBase="QuitarSanciones"/>
       <div className={styles.tableContainer}>
         <table className={styles.machineTable}>
           <thead>
diff --git a/app/Components/AlertBox/AlertBox.css b/app/Components/AlertBox/AlertBox.css
new file mode 100644
index 0000000..84d2886
--- /dev/null
+++ b/app/Components/AlertBox/AlertBox.css
@@ -0,0 +1,32 @@
+.messageBox {
+  position: absolute;
+  padding: 0.5rem 1.25rem;
+  border-radius: 4px;
+  font-weight: bold;
+  font-size: 1.5rem;
+  text-align: center;
+  opacity: 1;
+  z-index: 100;
+  top: 0;
+  left: 0;
+  width: 100%;
+  max-width: 200px;
+}
+
+.messageBox.hidden {
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 1s ease-out;
+}
+
+.success {
+  background-color: #d1f7c4;
+  color: #000000;
+  border: 1px solid #a5d6a7;
+}
+
+.error {
+  background-color: #ffcdd2;
+  color: #000000;
+  border: 1px solid #ef9a9a;
+}
\ No newline at end of file
diff --git a/app/Components/AlertBox/AlertBox.tsx b/app/Components/AlertBox/AlertBox.tsx
new file mode 100644
index 0000000..1711910
--- /dev/null
+++ b/app/Components/AlertBox/AlertBox.tsx
@@ -0,0 +1,37 @@
+'use client'
+
+import { useEffect, useState } from "react";
+import "./AlertBox.css";
+
+interface AlertBoxProps {
+  message: string;
+  type: "error" | "success";
+  duration?: number;
+}
+
+export default function AlertBox({ message, type, duration = 6000 }: AlertBoxProps) {
+  const [visible, setVisible] = useState(false);
+  const [text, setText] = useState("");
+
+  useEffect(() => {
+    if (message) {
+      setText(message);
+      setVisible(true);
+
+      const timeout = setTimeout(() => {
+        setVisible(false);
+        setTimeout(() => setText(""), 500);
+      }, duration);
+
+      return () => clearTimeout(timeout);
+    }
+  }, [message, duration]);
+
+  if (!text) return null;
+
+  return (
+    <div className={`messageBox ${type} ${!visible ? "hidden" : ""}`}>
+      {text}
+    </div>
+  );
+}
diff --git a/app/Components/Impressions/impressions.tsx b/app/Components/Impressions/impressions.tsx
index f0906f6..f680eaa 100644
--- a/app/Components/Impressions/impressions.tsx
+++ b/app/Components/Impressions/impressions.tsx
@@ -6,6 +6,7 @@ import { useRouter } from "next/navigation";
 import Cookies from "js-cookie";
 import { envConfig } from "@/app/lib/config";
 import "./Impressions.css";
+import AlertBox from "../AlertBox/AlertBox";
 
 interface CostOption {
   value: number;
@@ -20,10 +21,6 @@ function Impressions({ costs, numAccount }: ImpressionsProps) {
   const [cost, setCost] = useState("");
 
   const [error, setError] = useState("");
-  const [alert, setAlert] = useState("");
-  const [showError, setShowError] = useState(false);
-  const [showAlert, setShowAlert] = useState(false);
-
   const router = useRouter();
 
   const handleLogout = () => {
@@ -33,7 +30,6 @@ function Impressions({ costs, numAccount }: ImpressionsProps) {
   };
 
   const handlePayment = async () => {
-    setAlert("");
     setError("");
 
     if (!numAccount) {
@@ -46,9 +42,9 @@ function Impressions({ costs, numAccount }: ImpressionsProps) {
       return;
     }
 
-    if(!cost){
-        setError("Selecciona un costo")
-        return;
+    if (!cost) {
+      setError("Selecciona un costo");
+      return;
     }
 
     const token = Cookies.get("token");
@@ -72,7 +68,6 @@ function Impressions({ costs, numAccount }: ImpressionsProps) {
         }
       );
 
-      setAlert("Cobro realizado correctamente");
       setPages("");
     } catch (error: any) {
       const errorMessage =
@@ -132,16 +127,7 @@ function Impressions({ costs, numAccount }: ImpressionsProps) {
             Cobrar
           </button>
 
-          {error && (
-            <div className={`messageBox error ${!showError ? "hidden" : ""}`}>
-              {error}
-            </div>
-          )}
-          {alert && (
-            <div className={`messageBox success ${!showAlert ? "hidden" : ""}`}>
-              {alert}
-            </div>
-          )}
+          {error && <AlertBox message={error} type="error" />}
         </div>
       </div>
     </form>
diff --git a/app/Components/SearchUser/searchUser.tsx b/app/Components/SearchUser/searchUser.tsx
index 05da3d5..74f01d4 100644
--- a/app/Components/SearchUser/searchUser.tsx
+++ b/app/Components/SearchUser/searchUser.tsx
@@ -2,14 +2,20 @@
 
 import { useRouter } from "next/navigation";
 import { useState } from "react";
-function SearchUser() {
+
+interface urlProp{
+  urlBase:string
+}
+
+function SearchUser(url:urlProp) {
   const [numAccount, setNumAccount] = useState("");
   const router = useRouter();
 
   const handleSubmit = (e: React.FormEvent) => {
     e.preventDefault();
+
     if (numAccount) {
-      router.push(`/Impresiones?numAccount=${numAccount}`);
+      router.push(`/${url.urlBase}?numAccount=${numAccount}`);
     }
   };
 
diff --git a/app/globals.css b/app/globals.css
index dd7dbb8..dd2bcad 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -363,38 +363,6 @@ table tr {
   align-items: center;
 }
 
-.messageBox {
-  position: absolute;
-  padding: 0.5rem 1.25rem;
-  border-radius: 4px;
-  font-weight: bold;
-  font-size: 1.5rem;
-  text-align: center;
-  opacity: 1;
-  z-index: 100;
-  top: 0;
-  left: 0;
-  width: 100%;
-}
-
-.messageBox.hidden {
-  opacity: 0;
-  pointer-events: none;
-  transition: opacity 1s ease-out;
-}
-
-.success {
-  background-color: #d1f7c4;
-  color: #000000;
-  border: 1px solid #a5d6a7;
-}
-
-.error {
-  background-color: #ffcdd2;
-  color: #000000;
-  border: 1px solid #ef9a9a;
-}
-
 @media (max-width: 1300px) {
   .container {
     width: 100%;
diff --git a/app/lib/getStudent.ts b/app/lib/getStudent.ts
index 172bcff..756ea2c 100644
--- a/app/lib/getStudent.ts
+++ b/app/lib/getStudent.ts
@@ -4,6 +4,7 @@ import { envConfig } from "./config";
 export async function GetStudent(numAccount: number) {
   try {
     const response = await axios.get(`${envConfig.apiUrl}/student/${numAccount}`);
+    console.log(response.data)
     return response.data;
   } catch (error: any) {
     const msg =