This commit is contained in:
2025-12-09 15:41:50 -06:00
parent b764c5f36e
commit e84a8e4d93
2 changed files with 70 additions and 92 deletions
+61 -92
View File
@@ -32,61 +32,74 @@ interface RawOsEntry {
total: string;
}
function transformPlatform(raw: RawOsEntry[]): OsEntry[] {
const order: Record<string, number> = {
"Windows 11": 1,
"Windows 10": 2,
"Windows 7/8": 3,
"Windows XP/Vista": 4,
Linux: 5,
const PLATFORM_OS_LIST: Record<PlatformKey, string[]> = {
"pc-desktop": [
"Windows 11",
"Windows 10",
"Windows 7/8",
"Windows XP/Vista",
"Linux",
],
"MAC OS (SEQUOIA)": 6,
"Mac OS (13 - Ventura, 14 - Sonoma)": 7,
"Mac OS X (Mojave, Catalina, 11 - Big Sur, 12 - Monterrey)": 8,
"Mac OS X (Snow Leopard, Lion, Mountain Lion, Mavericks)": 9,
"Mac OS X (Yosemite, El Capitan, Sierra, High Sierra)": 10,
"apple-desktop": [
"MAC OS (SEQUOIA)",
"Mac OS (13 - Ventura, 14 - Sonoma)",
"Mac OS X (Mojave, Catalina, 11 - Big Sur, 12 - Monterrey)",
"Mac OS X (Snow Leopard, Lion, Mountain Lion, Mavericks)",
"Mac OS X (Yosemite, El Capitan, Sierra, High Sierra)",
],
"Chrome OS": 11,
"pc-laptop": [
"Windows 11",
"Windows 10",
"Windows 7/8",
"Windows XP/Vista",
"Chrome OS",
],
"Linux (CentOS, Fedora, Ubuntu, Red Hat Enterprise, entre otros)": 12,
"UNIX (AIX, MAC OS SERVER, SOLARIS, ENTRE OTROS)": 13,
"apple-laptop": [
"Mac OS (13 - Ventura, 14 - Sonoma)",
"Mac OS X (Mojave, Catalina, 11 - Big Sur, 12 - Monterrey)",
"Mac OS X (Snow Leopard, Lion, Mountain Lion, Mavericks)",
"Mac OS X (Yosemite, El Capitan, Sierra, High Sierra)",
],
"Windows Server 2022/2023": 14,
"Windows Server 2016/2019": 15,
"Windows Server 2008/2012": 16,
"Windows Server 2000/2003": 17,
};
servers: [
"Linux (CentOS, Fedora, Ubuntu, Red Hat Enterprise, entre otros)",
"UNIX (AIX, MAC OS SERVER, SOLARIS, ENTRE OTROS)",
"Windows Server 2022/2023",
"Windows Server 2016/2019",
"Windows Server 2008/2012",
"Windows Server 2000/2003",
],
};
function cleanName(rawName: string): string {
return rawName
function transformPlatform(
raw: RawOsEntry[],
platform: PlatformKey
): OsEntry[] {
const fixedList = PLATFORM_OS_LIST[platform];
const clean = (str: string) =>
str
.normalize("NFKD")
.replace(/\u00A0/g, " ")
.replace(/\s+/g, " ")
.trim();
}
// mapeamos y limpiamos antes del sort
const rows: OsEntry[] = raw.map((item) => {
const cleaned = cleanName(item.sistema_operativo);
return {
os: cleaned,
count: Number(item.total),
};
const mapRaw: Record<string, number> = {};
raw.forEach((item) => {
const name = clean(item.sistema_operativo);
mapRaw[name] = Number(item.total);
});
rows.sort((a, b) => {
const orderA = (order as Record<string, number>)[a.os] ?? 999;
const orderB = (order as Record<string, number>)[b.os] ?? 999;
return orderA - orderB;
});
const rows: OsEntry[] = fixedList.map((os) => ({
os,
count: mapRaw[clean(os)] ?? 0,
}));
const total = rows.reduce((acc, r) => acc + r.count, 0);
const total = rows.reduce((a, r) => a + r.count, 0);
rows.push({
os: "Total",
count: total,
isTotal: true,
});
rows.push({ os: "Total", count: total, isTotal: true });
return rows;
}
@@ -94,7 +107,6 @@ function transformPlatform(raw: RawOsEntry[]): OsEntry[] {
export default function Pregunta2() {
const [activeTab, setActiveTab] = useState<PlatformKey>("pc-desktop");
const [data, setData] = useState<PlatformData | null>(null);
const [loading, setLoading] = useState(true);
const cargarDatos = async (baja: boolean) => {
const token = Cookies.get("token");
@@ -111,65 +123,22 @@ export default function Pregunta2() {
const json = res.data;
const formatted: PlatformData = {
"pc-desktop": transformPlatform(json[0]),
"apple-desktop": transformPlatform(json[1]),
"pc-laptop": transformPlatform(json[2]),
"apple-laptop": transformPlatform(json[3]),
servers: transformPlatform(json[4]),
"pc-desktop": transformPlatform(json[0], "pc-desktop"),
"apple-desktop": transformPlatform(json[1], "apple-desktop"),
"pc-laptop": transformPlatform(json[2], "pc-laptop"),
"apple-laptop": transformPlatform(json[3], "apple-laptop"),
servers: transformPlatform(json[4], "servers"),
};
setData(formatted);
})
.catch((err) => console.error("Error cargando datos", err))
.finally(() => {
setLoading(false);
});
};
useEffect(() => {
cargarDatos(false);
}, []);
if (loading)
return (
<div className={styles.container_P1}>
<div className={styles["contenedor-censo_p1"]}>
Censo de equipos de cómputo - Sitema Operativo
</div>
<div className={styles["pregunta-cuadro_p1"]}>
Número de sistemas Operativos por cada categoría y perfil de usuario.
<ToggleButton
onChange={(estado) => {
cargarDatos(estado);
}}
/>
</div>
<div>Cargando datos...</div>
</div>
);
if (!data)
return (
<div className={styles.container_P1}>
<div className={styles["contenedor-censo_p1"]}>
Censo de equipos de cómputo - Sitema Operativo
</div>
<div className={styles["pregunta-cuadro_p1"]}>
Número de sistemas Operativos por cada categoría y perfil de usuario.
<ToggleButton
onChange={(estado) => {
cargarDatos(estado);
}}
/>
</div>
<div className={styles.scanView_P3}>Error al cargar los datos.</div>
</div>
);
const currentData = data[activeTab];
return (
<div className={styles.container_P1}>
<div className={styles["contenedor-censo_p1"]}>
@@ -203,7 +172,7 @@ export default function Pregunta2() {
{/* Tabla */}
<div className={styles["data-table_P1"]}>
{currentData.map((item, index) => (
{data && data[activeTab].map((item, index) => (
<div
key={index}
className={`${styles["data-row_P1"]} ${
@@ -151,6 +151,15 @@
}
}
.loadingBlur {
filter: blur(4px);
opacity: 0.5;
pointer-events: none;
transition: 0.3s ease;
height: 100%;
width: 100%;
}
@media (max-width: 700px) {
.scanView_P1 .tabs_P1 {
width: 160px;