IO/front-Censo
2
0
Fork 0
Code Issues Pull Requests Actions Releases Wiki Activity

fixed perifericos

Browse Source
This commit is contained in:
Lino
2025-11-18 18:09:48 -06:00
parent 836b70ef97
commit e5ea40ae73
15 changed files with 70 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/(Administrador)/perifericos/page.tsx
+13 -24
View File
@@ -1,54 +1,43 @@
"use client";
import { useState } from "react";
import Pregunta1 from "@/components/Equipo_Computo/Pregunta1";
import Pregunta1_1 from "@/components/Equipo_Computo/Pregunta1_1";
import Pregunta2_1 from "@/components/Equipo_Computo/Pregunta2_1";
import Pregunta3 from "@/components/Equipo_Computo/Pregunta3";
import Pregunta3_1 from "@/components/Equipo_Computo/Pregunta3_1";
import Pregunta3_2 from "@/components/Equipo_Computo/Pregunta3_2";
import Pregunta3_3 from "@/components/Equipo_Computo/Pregunta3_3";
import Pregunta3_4 from "@/components/Equipo_Computo/Pregunta3_4";
import Pregunta3_5 from "@/components/Equipo_Computo/Pregunta3_5";
import Pregunta7 from "@/components/Equipo_Computo/Pregunta7";
import Pregunta1EP from "@/components/Perifericos/Pregunta1EP";
import Pregunta2EP from "@/components/Perifericos/Pregunta2EP";
import Pregunta4EP from "@/components/Perifericos/Pregunta4EP";
import Pregunta7EP from "@/components/Perifericos/Pregunta7EP";
import Pregunta9 from "@/components/Equipo_Computo/Pregunta9";
import "../../styles/layout/reporte.scss";
type PreguntaKey =
| "pregunta1EP"
| "pregunta2EP"
| "pregunta4EP"
| "pregunta1"
| "pregunta2"
| "pregunta4"
| "pregunta7"
const LABELS: Record<PreguntaKey, string> = {
pregunta1EP: "Pregunta 1 EP",
pregunta2EP: "Pregunta 2 EP",
pregunta4EP: "Pregunta 4 EP",
pregunta1: "Pregunta 1",
pregunta2: "Pregunta 2",
pregunta4: "Pregunta 4",
pregunta7: "Pregunta 7",
};
// Mapeo de fondo por pregunta (puedes personalizarlo)
const TAB_BACKGROUNDS: Record<PreguntaKey, string> = {
pregunta1EP: "bg-gray",
pregunta2EP: "bg-gray",
pregunta4EP: "bg-gray",
pregunta1: "bg-gray",
pregunta2: "bg-gray",
pregunta4: "bg-gray",
pregunta7: "bg-gray",
};
export default function Page() {
const [activeTab, setActiveTab] = useState<PreguntaKey>("pregunta1EP");
const [activeTab, setActiveTab] = useState<PreguntaKey>("pregunta1");
const renderPregunta = () => {
switch (activeTab) {
case "pregunta1EP":
case "pregunta1":
return <Pregunta1EP />;
case "pregunta2EP":
case "pregunta2":
return <Pregunta2EP />;
case "pregunta4EP":
case "pregunta4":
return <Pregunta4EP />;
case "pregunta7":
return <Pregunta7 />;
src/app/(Administrador)/pregunta4EP/page.tsx
+8 -1
View File
@@ -38,10 +38,17 @@ export default function Pregunta4EPPage() {
return (
<div className="container">
<div className="header-bar">
<div className="contenedor-censo">
Censo de equipos periféricos - Equipo de digitalización
</div>
<div className="pregunta-cuadro">
7. Calcule porcentualmente (%) la antiguedad que tienen los equipos
periféricos del área universitaria. * (Requerido en el caso de contar
con Equipo de impresión o digitalización.)
</div>
<div className="grid">
<div className="item">
<label htmlFor="digitalizadorCamaPlana">
src/app/(Administrador)/pregunta7/pregunta7.css
+1 -3
View File
@@ -1,7 +1,6 @@
.contenedor-pregunta {
padding: 20px;
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
background-color: #f9fafc;
}
.contenedor-censo{
@@ -14,7 +13,6 @@
.pregunta-cuadro {
background-color: #f5f5f5;
border-left: 6px solid #001f3f;
padding: 15px;
border-radius: 8px;
@@ -79,7 +77,7 @@
/* Input */
.input-contenedor input {
width: 40%;
padding: 6px 25px 6px 6px;
padding: 6px 6px 6px 6px;
border: 2px solid #002855;
border-radius: 6px;
font-size: 14px;
src/app/(Administrador)/pregunta7_1/pregunta7.css
+1 -3
View File
@@ -1,7 +1,6 @@
.contenedor-pregunta {
padding: 20px;
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
background-color: #f9fafc;
}
.contenedor-censo{
@@ -11,7 +10,6 @@ color: white;
.pregunta-cuadro {
background-color: #f5f5f5;
border-left: 6px solid #001f3f;
padding: 15px;
border-radius: 8px;
@@ -76,7 +74,7 @@ color: white;
/* Input */
.input-contenedor input {
width: 40%;
padding: 6px 25px 6px 6px;
padding: 6px 6px 6px 6px;
border: 2px solid #002855;
border-radius: 6px;
font-size: 14px;
src/app/(Administrador)/pregunta9/pregunta1.css
+1 -2
View File
@@ -5,7 +5,6 @@
.pregunta-cuadro {
background-color: #f5f5f5;
border-left: 6px solid #001f3f;
padding: 15px;
border-radius: 8px;
@@ -70,7 +69,7 @@
/* Input */
.input-contenedor input {
width: 40%;
padding: 6px 25px 6px 6px;
padding: 6px 6px 6px 6px;
border: 2px solid #002855;
border-radius: 6px;
font-size: 14px;
src/app/styles/layout/pregunta4EP.scss
+6 -7
View File
@@ -1,12 +1,6 @@
.container {
max-width: 1000px;
margin: 2% auto 20% auto;
background: white;
padding: 20px;
border: 1px solid #ddd;
border-radius: 6px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.header-bar {
@@ -18,12 +12,16 @@
border-radius: 4px 4px 0 0;
}
.grid {
background-color: #fff;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
align-items: end;
border-radius: 10px;
padding: 20px;
overflow-x: auto;
box-shadow: 0 4px 10px #0000001a;
}
.item {
@@ -51,5 +49,6 @@ input[type="text"] {
@media (max-width: 768px) {
.grid {
grid-template-columns: 1fr;
gap: 0;
}
}
src/app/styles/layout/reporte.scss
+1 -1
View File
@@ -5,7 +5,7 @@
.container_reporte {
width: calc(100% - 2%);
max-width: 1000px;
max-width: 1200px;
margin: 0 auto;
background: #fff;
border-radius: 10px;
src/components/BarNavigationAdmin.tsx
+7 -2
View File
@@ -33,15 +33,20 @@ function BarNavigation() {
<span>Crear Cuenta</span>
</Link>
</li>
<li className="subMenu" onClick={toggleMenu}>
{/* <li className="subMenu" onClick={toggleMenu}>
<Link href="/cambiarPass" className="links">
<span>Cambiar Contraseña</span>
</Link>
</li>
</li> */}
<li className="subMenu" onClick={toggleMenu}>
<Link href="/reporte" className="links">
<span>Reporte</span>
</Link>
</li>
<li className="subMenu" onClick={toggleMenu}>
<Link href="/perifericos" className="links">
<span>Perifericos</span>
</Link>
</li>
<li className="subMenu">
<button className="logout-button" onClick={cerrarSesion}>
src/components/Equipo_Computo/pregunta7.css
+2 -3
View File
@@ -1,7 +1,6 @@
.contenedor-pregunta {
padding: 20px;
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
background-color: #f9fafc;
}
.contenedor-censo{
@@ -14,7 +13,7 @@
.pregunta-cuadro {
background-color: #f5f5f5;
background-color: #fff;
border-left: 6px solid #001f3f;
padding: 15px;
border-radius: 8px;
@@ -79,7 +78,7 @@
/* Input */
.input-contenedor input {
width: 40%;
padding: 6px 25px 6px 6px;
padding: 6px 6px 6px 6px;
border: 2px solid #002855;
border-radius: 6px;
font-size: 14px;
src/components/Equipo_Computo/pregunta9.css
+1 -3
View File
@@ -1,11 +1,9 @@
.contenedor-pregunta {
padding: 20px;
background-color: #f9fafc;
}
.pregunta-cuadro {
background-color: #f5f5f5;
border-left: 6px solid #001f3f;
padding: 15px;
border-radius: 8px;
@@ -70,7 +68,7 @@
/* Input */
.input-contenedor input {
width: 40%;
padding: 6px 25px 6px 6px;
padding: 6px 6px 6px 6px;
border: 2px solid #002855;
border-radius: 6px;
font-size: 14px;
src/components/Perifericos/Pregunta1EP.tsx
+5 -1
View File
@@ -47,7 +47,11 @@ export default function Pregunta1EP() {
return (
<div className="container">
<div className="header">
<div className="contenedor-censo">
Censo de equipos periféricos - Equipo de digitalización
</div>
<div className="pregunta-cuadro">
1. Desglose el número de equipos de impresión con que cuenta el área
universitaria.
</div>
src/components/Perifericos/Pregunta2EP.tsx
+9 -6
View File
@@ -41,9 +41,12 @@ export default function Pregunta2EP() {
return (
<div className={styles.container_P2}>
<div className={styles.header_P2}>
<span className={styles.required_P2}>*</span>
<small>(Requerido en el caso de contar con Equipo de impresión)</small>
<div className="contenedor-censo">
Censo de equipos periféricos - Equipo de digitalización
</div>
<div className="pregunta-cuadro">
2. Indique el número de equipos de impresión de acuerdo con la población universitaria al que se destina su uso primordialmente.
</div>
<div className={styles.row_P2}>
@@ -60,7 +63,7 @@ export default function Pregunta2EP() {
<div className={styles.item_P2}>
<label htmlFor="profesores">
Profesores <span className={styles.helpIcon_P2}>?</span>
Profesores
</label>
<input
type="text"
@@ -84,7 +87,7 @@ export default function Pregunta2EP() {
<div className={styles.item_P2}>
<label htmlFor="investigadores">
Investigadores <span className={styles.helpIcon_P2}>?</span>
Investigadores
</label>
<input
type="text"
@@ -97,7 +100,7 @@ export default function Pregunta2EP() {
<div className={styles.item_P2}>
<label htmlFor="administrativos">
Administrativos <span className={styles.helpIcon_P2}>?</span>
Administrativos
</label>
<input
type="text"
src/components/Perifericos/Pregunta4EP.tsx
+6 -1
View File
@@ -38,10 +38,15 @@ export default function Pregunta4EP() {
return (
<div className="container">
<div className="header-bar">
<div className="contenedor-censo">
Censo de equipos periféricos - Equipo de digitalización
</div>
<div className="pregunta-cuadro">
4. Desglose el número de equipos de digitalización con que cuenta el
área universitaria.
</div>
<div className="grid">
<div className="item">
<label htmlFor="digitalizadorCamaPlana">
src/components/Perifericos/pregunta2EP.module.scss
+8 -7
View File
@@ -1,11 +1,6 @@
.container_P2 {
max-width: 1000px;
margin: 2% 10% 20% 10%;
background: white;
max-width: 1200px;
padding: 20px;
border: 1px solid #ddd;
border-radius: 6px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
label {
display: block;
@@ -48,13 +43,19 @@
.row_P2 {
display: flex;
gap: 10px;
align-items: flex-start;
align-items: end;
flex-wrap: wrap;
background-color: #fff;
border-radius: 10px;
padding: 20px;
overflow-x: auto;
box-shadow: 0 4px 10px #0000001a;
}
.item_P2 {
flex: 1;
min-width: 140px;
width: 100%;
}
/* Responsivo */
src/components/header.tsx
+1 -1
View File
@@ -10,7 +10,7 @@ function Header() {
const pathname = usePathname();
const publicNav = ["/escaner", "/agregarEquipo", "/editar"];
const privateNav = ["/reporte", "/crearCuenta", "/cambiarPass"];
const privateNav = ["/reporte", "/crearCuenta", "/cambiarPass","/perifericos"];
return (
<header className={header.header}>