CIDWA/front-Censo
13
0
Fork 0
Code Issues Pull Requests Actions Releases Wiki Activity

Merge branch 'Axel' of https://repositorio.acatlan.unam.mx/IO/front-Censo into Lino

Browse Source
This commit is contained in:
Lino
2025-11-07 14:30:40 -06:00
parent 7610146828 ebb7c49e5b
commit e1de0d2f3f
1 changed files with 60 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/(Administrador)/pregunta1/page.tsx
+60 -49
View File
@@ -1,7 +1,7 @@
'use client'; "use client";
import { useState, useEffect } from 'react'; import { useState, useEffect } from "react";
import '../../styles/layout/pregunta1.scss'; import "../../styles/layout/pregunta1.scss";
// Tipos // Tipos
type OsEntry = { type OsEntry = {
@@ -16,51 +16,60 @@ type PlatformData = {
// === DATOS TEMPORALES (mock) === // === DATOS TEMPORALES (mock) ===
const MOCK_DATA: PlatformData = { const MOCK_DATA: PlatformData = {
'pc-desktop': [ "pc-desktop": [
{ os: 'Windows 11', count: '408' }, { os: "Windows 11", count: "408" },
{ os: 'Windows 10', count: '1171' }, { os: "Windows 10", count: "1171" },
{ os: 'Windows 7/8', count: '177' }, { os: "Windows 7/8", count: "177" },
{ os: 'Windows XP/Vista', count: '43' }, { os: "Windows XP/Vista", count: "43" },
{ os: 'Linux', count: '45' }, { os: "Linux", count: "45" },
{ os: 'Total', count: '1844', isTotal: true }, { os: "Total", count: "1844", isTotal: true },
], ],
'apple-desktop': [ "apple-desktop": [
{ os: 'Mac OS X(13 - Ventura, 14 - Sonoma)', count: '205' }, { os: "Mac OS X(13 - Ventura, 14 - Sonoma)", count: "205" },
{ os: 'Mac OS X(Mojave,Catalina,11 - Big Sur, 12 - Monterrey)', count: '180' }, {
{ os: 'Mac OS X(Yosemite,El Capitan,Sierra,High Sierra)', count: '95' }, os: "Mac OS X(Mojave,Catalina,11 - Big Sur, 12 - Monterrey)",
{ os: 'Mac OS X(Snow Leopard,Mountain Lion,Mavericks)', count: '6' }, count: "180",
{ os: 'Total', count: '480', isTotal: true }, },
{ os: "Mac OS X(Yosemite,El Capitan,Sierra,High Sierra)", count: "95" },
{ os: "Mac OS X(Snow Leopard,Mountain Lion,Mavericks)", count: "6" },
{ os: "Total", count: "480", isTotal: true },
], ],
'pc-laptop': [ "pc-laptop": [
{ os: 'Windows 11', count: '40' }, { os: "Windows 11", count: "40" },
{ os: 'Windows 10', count: '171' }, { os: "Windows 10", count: "171" },
{ os: 'Windows 7/8', count: '17' }, { os: "Windows 7/8", count: "17" },
{ os: 'Windows XP/Vista', count: '3' }, { os: "Windows XP/Vista", count: "3" },
{ os: 'Linux', count: '5' }, { os: "Linux", count: "5" },
{ os: 'Total', count: '144', isTotal: true }, { os: "Total", count: "144", isTotal: true },
], ],
'apple-laptop': [ "apple-laptop": [
{ os: 'Mac OS X(13 - Ventura, 14 - Sonoma)', count: '205' }, { os: "Mac OS X(13 - Ventura, 14 - Sonoma)", count: "205" },
{ os: 'Mac OS X(Mojave,Catalina,11 - Big Sur, 12 - Monterrey)', count: '180' }, {
{ os: 'Mac OS X(Yosemite,El Capitan,Sierra,High Sierra)', count: '95' }, os: "Mac OS X(Mojave,Catalina,11 - Big Sur, 12 - Monterrey)",
{ os: 'Mac OS X(Snow Leopard,Mountain Lion,Mavericks)', count: '6' }, count: "180",
{ os: 'Total', count: '480', isTotal: true }, },
{ os: "Mac OS X(Yosemite,El Capitan,Sierra,High Sierra)", count: "95" },
{ os: "Mac OS X(Snow Leopard,Mountain Lion,Mavericks)", count: "6" },
{ os: "Total", count: "480", isTotal: true },
], ],
'servers': [ servers: [
{ os: 'Linux (CentOs,Fedora,Ubuntu,Red Hat Enterprise,entre otros)', count: '120' }, {
{ os: 'Unix (AIX,MAC OS Server,Solaris,entre otros)', count: '80' }, os: "Linux (CentOs,Fedora,Ubuntu,Red Hat Enterprise,entre otros)",
{ os: 'Windows Server 2022/2023', count: '50' }, count: "120",
{ os: 'Windows Server 2016/2019', count: '80' }, },
{ os: 'Windows Server 2008/2012', count: '50' }, { os: "Unix (AIX,MAC OS Server,Solaris,entre otros)", count: "80" },
{ os: 'Windows Server 2000/2003', count: '12' }, { os: "Windows Server 2022/2023", count: "50" },
{ os: 'Total', count: '250', isTotal: true }, { os: "Windows Server 2016/2019", count: "80" },
{ os: "Windows Server 2008/2012", count: "50" },
{ os: "Windows Server 2000/2003", count: "12" },
{ os: "Total", count: "250", isTotal: true },
], ],
}; };
const API_ENDPOINT = '/api/platform-stats'; // ← ¡Reemplaza esto cuando sepas la URL real! const API_ENDPOINT = "/api/platform-stats"; // ← ¡Reemplaza esto cuando sepas la URL real!
const Page = () => { const Page = () => {
const [activeTab, setActiveTab] = useState<string>('pc-desktop'); const [activeTab, setActiveTab] = useState<string>("pc-desktop");
const [data, setData] = useState<PlatformData>(MOCK_DATA); const [data, setData] = useState<PlatformData>(MOCK_DATA);
const [loading, setLoading] = useState<boolean>(true); const [loading, setLoading] = useState<boolean>(true);
const [error, setError] = useState<string | null>(null); const [error, setError] = useState<string | null>(null);
@@ -80,8 +89,10 @@ const Page = () => {
setData(MOCK_DATA); setData(MOCK_DATA);
setLoading(false); setLoading(false);
} catch (err) { } catch (err) {
console.error('Error al cargar datos:', err); console.error("Error al cargar datos:", err);
setError('No se pudieron cargar las estadísticas. Usando datos temporales.'); setError(
"No se pudieron cargar las estadísticas. Usando datos temporales."
);
setData(MOCK_DATA); // fallback en caso de error setData(MOCK_DATA); // fallback en caso de error
setLoading(false); setLoading(false);
} }
@@ -111,15 +122,15 @@ const Page = () => {
<div className="main-content"> <div className="main-content">
<div className="tabs"> <div className="tabs">
{Object.entries({ {Object.entries({
'pc-desktop': 'Computadoras de escritorio Plataforma PC', "pc-desktop": "Computadoras de escritorio Plataforma PC",
'apple-desktop': 'Computadoras de escritorio Plataforma Apple', "apple-desktop": "Computadoras de escritorio Plataforma Apple",
'pc-laptop': 'Computadoras portatiles Plataforma PC', "pc-laptop": "Computadoras portatiles Plataforma PC",
'apple-laptop': 'Computadoras portatiles Plataforma Apple', "apple-laptop": "Computadoras portatiles Plataforma Apple",
'servers': 'Servidores de alto rendimiento', servers: "Servidores de alto rendimiento",
}).map(([key, label]) => ( }).map(([key, label]) => (
<div <div
key={key} key={key}
className={`tab ${activeTab === key ? 'active' : ''}`} className={`tab ${activeTab === key ? "active" : ""}`}
onClick={() => setActiveTab(key)} onClick={() => setActiveTab(key)}
> >
{label} {label}
@@ -132,7 +143,7 @@ const Page = () => {
{currentData.map((item, index) => ( {currentData.map((item, index) => (
<div <div
key={index} key={index}
className={`data-row ${item.isTotal ? 'total-row' : ''}`} className={`data-row ${item.isTotal ? "total-row" : ""}`}
> >
<div className="os-name">{item.os}</div> <div className="os-name">{item.os}</div>
<div className="count-box">{item.count}</div> <div className="count-box">{item.count}</div>
@@ -147,4 +158,4 @@ const Page = () => {
); );
}; };
export default Page; export default Page;