get digitalizacion and impressions
This commit is contained in:
@@ -143,11 +143,9 @@ export default function Pregunta3_2() {
|
||||
<div className={styles.scanView_P3}>
|
||||
<div className={styles.container_P3}>
|
||||
<div className={styles.header_P3}>
|
||||
<h1 className={styles.titulo}>PREGUNTA 3 (2/5)</h1>
|
||||
<p className={styles.texto}>
|
||||
3. Desglose la cantidad de población beneficiada por plataforma y tipo de procesador: *
|
||||
Cantidad de población beneficiada por plataforma y tipo de procesador:
|
||||
</p>
|
||||
<p className={styles.subtexto}>Presione cada pestaña para ingresar la información.</p>
|
||||
</div>
|
||||
|
||||
<div className={styles.mainContent_P3}>
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
"use client";
|
||||
import React, { useState, useEffect } from "react";
|
||||
import { useState, useEffect } from "react";
|
||||
import styles from "./pregunta2EP.module.scss";
|
||||
import axios from "axios";
|
||||
import Cookies from "js-cookie";
|
||||
|
||||
interface EquiposPoblacion {
|
||||
alumnos: string;
|
||||
@@ -13,35 +15,87 @@ interface EquiposPoblacion {
|
||||
|
||||
export default function Pregunta2EP() {
|
||||
const [equipos, setEquipos] = useState<EquiposPoblacion>({
|
||||
alumnos: "35",
|
||||
profesores: "43",
|
||||
alumnos: "0",
|
||||
profesores: "0",
|
||||
tecnicosAcademicos: "",
|
||||
investigadores: "",
|
||||
administrativos: "302",
|
||||
total: "380",
|
||||
administrativos: "0",
|
||||
total: "0",
|
||||
});
|
||||
|
||||
// Listo para conectar al backend
|
||||
useEffect(() => {
|
||||
/*
|
||||
fetch("https://tu-api-backend.com/api/equipos-poblacion")
|
||||
.then((res) => res.json())
|
||||
.then((data) => setEquipos(data))
|
||||
.catch((err) => console.error("Error al obtener datos:", err));
|
||||
*/
|
||||
}, []);
|
||||
const api_url = process.env.NEXT_PUBLIC_API_URL;
|
||||
|
||||
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
const { name, value } = e.target;
|
||||
setEquipos((prev) => ({
|
||||
...prev,
|
||||
[name]: value,
|
||||
}));
|
||||
};
|
||||
useEffect(() => {
|
||||
const token = Cookies.get("token");
|
||||
const headers = { Authorization: `Bearer ${token}` };
|
||||
|
||||
axios
|
||||
.get(`${api_url}/equipos/reporte/contar_periferico_tipoUso/impresoras`, {
|
||||
headers,
|
||||
})
|
||||
.then((res) => {
|
||||
const data = res.data;
|
||||
|
||||
// Valores por defecto
|
||||
const valores = {
|
||||
alumnos: "0",
|
||||
profesores: "0",
|
||||
tecnicosAcademicos: "0",
|
||||
investigadores: "0",
|
||||
administrativos: "0",
|
||||
total: "0",
|
||||
};
|
||||
|
||||
data.forEach((item: any) => {
|
||||
const uso = item.uso.toUpperCase().trim();
|
||||
const total = item.total ?? "0";
|
||||
|
||||
switch (uso) {
|
||||
case "ALUMNO":
|
||||
case "ALUMNOS":
|
||||
valores.alumnos = total;
|
||||
break;
|
||||
|
||||
case "PROFESOR":
|
||||
case "PROFESORES":
|
||||
valores.profesores = total;
|
||||
break;
|
||||
|
||||
case "TÉCNICO ACADEMICO":
|
||||
case "TÉCNICO ACADÉMICO":
|
||||
valores.tecnicosAcademicos = total;
|
||||
break;
|
||||
|
||||
case "INVESTIGADOR":
|
||||
case "INVESTIGADORES":
|
||||
valores.investigadores = total;
|
||||
break;
|
||||
|
||||
case "ADMINISTRATIVO":
|
||||
case "ADMINISTRATIVOS":
|
||||
valores.administrativos = total;
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
// Calcular total general
|
||||
valores.total = String(
|
||||
Number(valores.alumnos) +
|
||||
Number(valores.profesores) +
|
||||
Number(valores.tecnicosAcademicos) +
|
||||
Number(valores.investigadores) +
|
||||
Number(valores.administrativos)
|
||||
);
|
||||
|
||||
setEquipos(valores);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error("Error:", err);
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className={styles.container_P2}>
|
||||
|
||||
<div className="pregunta-cuadro">
|
||||
Equipos de impresión de acuerdo con la población universitaria.
|
||||
</div>
|
||||
@@ -54,20 +108,18 @@ export default function Pregunta2EP() {
|
||||
id="alumnos"
|
||||
name="alumnos"
|
||||
value={equipos.alumnos}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className={styles.item_P2}>
|
||||
<label htmlFor="profesores">
|
||||
Profesores
|
||||
</label>
|
||||
<label htmlFor="profesores">Profesores</label>
|
||||
<input
|
||||
type="text"
|
||||
id="profesores"
|
||||
name="profesores"
|
||||
value={equipos.profesores}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -78,33 +130,29 @@ export default function Pregunta2EP() {
|
||||
id="tecnicosAcademicos"
|
||||
name="tecnicosAcademicos"
|
||||
value={equipos.tecnicosAcademicos}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className={styles.item_P2}>
|
||||
<label htmlFor="investigadores">
|
||||
Investigadores
|
||||
</label>
|
||||
<label htmlFor="investigadores">Investigadores</label>
|
||||
<input
|
||||
type="text"
|
||||
id="investigadores"
|
||||
name="investigadores"
|
||||
value={equipos.investigadores}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className={styles.item_P2}>
|
||||
<label htmlFor="administrativos">
|
||||
Administrativos
|
||||
</label>
|
||||
<label htmlFor="administrativos">Administrativos</label>
|
||||
<input
|
||||
type="text"
|
||||
id="administrativos"
|
||||
name="administrativos"
|
||||
value={equipos.administrativos}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -115,10 +163,11 @@ export default function Pregunta2EP() {
|
||||
id="total"
|
||||
name="total"
|
||||
value={equipos.total}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
//IO
|
||||
|
||||
@@ -2,6 +2,8 @@
|
||||
import "./pregunta5EP.scss";
|
||||
import styles from "./pregunta2EP.module.scss";
|
||||
import { useEffect, useState } from "react";
|
||||
import Cookies from "js-cookie";
|
||||
import axios from "axios";
|
||||
|
||||
interface EquiposPoblacion {
|
||||
alumnos: string;
|
||||
@@ -13,41 +15,94 @@ interface EquiposPoblacion {
|
||||
}
|
||||
|
||||
export default function Pregunta5EP() {
|
||||
const [equipos, setEquipos] = useState<EquiposPoblacion>({
|
||||
alumnos: "35",
|
||||
profesores: "43",
|
||||
tecnicosAcademicos: "",
|
||||
investigadores: "",
|
||||
administrativos: "302",
|
||||
total: "380",
|
||||
});
|
||||
|
||||
// Listo para conectar al backend
|
||||
useEffect(() => {
|
||||
/*
|
||||
fetch("https://tu-api-backend.com/api/equipos-poblacion")
|
||||
.then((res) => res.json())
|
||||
.then((data) => setEquipos(data))
|
||||
.catch((err) => console.error("Error al obtener datos:", err));
|
||||
*/
|
||||
}, []);
|
||||
|
||||
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
const { name, value } = e.target;
|
||||
setEquipos((prev) => ({
|
||||
...prev,
|
||||
[name]: value,
|
||||
}));
|
||||
};
|
||||
const [equipos, setEquipos] = useState<EquiposPoblacion>({
|
||||
alumnos: "0",
|
||||
profesores: "0",
|
||||
tecnicosAcademicos: "0",
|
||||
investigadores: "0",
|
||||
administrativos: "0",
|
||||
total: "0",
|
||||
});
|
||||
|
||||
const api_url = process.env.NEXT_PUBLIC_API_URL;
|
||||
|
||||
useEffect(() => {
|
||||
const token = Cookies.get("token");
|
||||
const headers = { Authorization: `Bearer ${token}` };
|
||||
|
||||
axios
|
||||
.get(`${api_url}/equipos/reporte/contar_periferico_tipoUso/dijtales`, {
|
||||
headers,
|
||||
})
|
||||
.then((res) => {
|
||||
const data = res.data;
|
||||
|
||||
// Valores por defecto
|
||||
const valores = {
|
||||
alumnos: "0",
|
||||
profesores: "0",
|
||||
tecnicosAcademicos: "0",
|
||||
investigadores: "0",
|
||||
administrativos: "0",
|
||||
total: "0",
|
||||
};
|
||||
|
||||
data.forEach((item: any) => {
|
||||
const uso = item.uso.toUpperCase().trim();
|
||||
const total = item.total ?? "0";
|
||||
|
||||
switch (uso) {
|
||||
case "ALUMNO":
|
||||
case "ALUMNOS":
|
||||
valores.alumnos = total;
|
||||
break;
|
||||
|
||||
case "PROFESOR":
|
||||
case "PROFESORES":
|
||||
valores.profesores = total;
|
||||
break;
|
||||
|
||||
case "TÉCNICO ACADEMICO":
|
||||
case "TÉCNICO ACADÉMICO":
|
||||
valores.tecnicosAcademicos = total;
|
||||
break;
|
||||
|
||||
case "INVESTIGADOR":
|
||||
case "INVESTIGADORES":
|
||||
valores.investigadores = total;
|
||||
break;
|
||||
|
||||
case "ADMINISTRATIVO":
|
||||
case "ADMINISTRATIVOS":
|
||||
valores.administrativos = total;
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
// Calcular total general
|
||||
valores.total = String(
|
||||
Number(valores.alumnos) +
|
||||
Number(valores.profesores) +
|
||||
Number(valores.tecnicosAcademicos) +
|
||||
Number(valores.investigadores) +
|
||||
Number(valores.administrativos)
|
||||
);
|
||||
|
||||
setEquipos(valores);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error("Error:", err);
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="container">
|
||||
|
||||
<div className="pregunta-cuadro">
|
||||
Número de equipos de digitalización de acuerdo con la
|
||||
población universitaria.
|
||||
Número de equipos de digitalización de acuerdo con la población
|
||||
universitaria.
|
||||
</div>
|
||||
|
||||
<div className={styles.row_P2}>
|
||||
<div className={styles.row_P2}>
|
||||
<div className={styles.item_P2}>
|
||||
<label htmlFor="alumnos">Alumnos</label>
|
||||
<input
|
||||
@@ -55,20 +110,18 @@ export default function Pregunta5EP() {
|
||||
id="alumnos"
|
||||
name="alumnos"
|
||||
value={equipos.alumnos}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className={styles.item_P2}>
|
||||
<label htmlFor="profesores">
|
||||
Profesores
|
||||
</label>
|
||||
<label htmlFor="profesores">Profesores</label>
|
||||
<input
|
||||
type="text"
|
||||
id="profesores"
|
||||
name="profesores"
|
||||
value={equipos.profesores}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -79,33 +132,29 @@ export default function Pregunta5EP() {
|
||||
id="tecnicosAcademicos"
|
||||
name="tecnicosAcademicos"
|
||||
value={equipos.tecnicosAcademicos}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className={styles.item_P2}>
|
||||
<label htmlFor="investigadores">
|
||||
Investigadores
|
||||
</label>
|
||||
<label htmlFor="investigadores">Investigadores</label>
|
||||
<input
|
||||
type="text"
|
||||
id="investigadores"
|
||||
name="investigadores"
|
||||
value={equipos.investigadores}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className={styles.item_P2}>
|
||||
<label htmlFor="administrativos">
|
||||
Administrativos
|
||||
</label>
|
||||
<label htmlFor="administrativos">Administrativos</label>
|
||||
<input
|
||||
type="text"
|
||||
id="administrativos"
|
||||
name="administrativos"
|
||||
value={equipos.administrativos}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -116,7 +165,7 @@ export default function Pregunta5EP() {
|
||||
id="total"
|
||||
name="total"
|
||||
value={equipos.total}
|
||||
onChange={handleChange}
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user