layout ________ "use client"; import { Geist, Geist_Mono } from "next/font/google"; import "bootstrap/dist/css/bootstrap.min.css"; import { useState } from "react"; import { Menu, MenuRight, Grid, School, Buildings, Book, Group, SwapHorizontal, DoorOpen } from "@boxicons/react"; const geistSans = Geist({ variable: "--font-geist-sans", subsets: ["latin"], }); const geistMono = Geist_Mono({ variable: "--font-geist-mono", subsets: ["latin"], }); export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode; }>) { const [open, setOpen] = useState(true); return (
{open &&
SAM
}
{open && (
Usuario
Sede
)}
{children}
); } _________ page ________ 'use client' import { useState, useEffect } from "react"; // 1. Agregado useEffect import { Sun,Moon } from "@boxicons/react"; export default function Home() { const [loading, setLoading] = useState(true); const [error, setError] = useState(""); useEffect(() => { return setLoading(false); }, []); const alumnos = [ { id: 101, tipo: "Regular", curso: "Inglés Básico Intensivo", profesor: "John Doe", sede: "Sede Central", sala: "Sala A", horario: "09:00 / 10:30", inicio: "09:00", inicioBadge: "bg-warning text-dark", termino: "10:30", sesion: "En proceso", sesionBadge: "bg-light text-dark" }, { id: 102, tipo: "Intensivo", curso: "Francés Avanzado", profesor: "Maria Perez", sede: "Sede Norte", sala: "Sala B", horario: "10:30 / 12:00", inicio: "10:30", inicioBadge: "bg-success text-white", termino: "12:00", sesion: "Completada", sesionBadge: "bg-success text-white" }, { id: 103, tipo: "Regular", curso: "Alemán Intermedio", profesor: "Carlos López", sede: "Sede Sur", sala: "Sala C", horario: "14:00 / 15:30", inicio: "14:00", inicioBadge: "bg-warning text-dark", termino: "15:30", sesion: "En proceso", sesionBadge: "bg-light text-dark" }, { id: 104, tipo: "Intensivo", curso: "Inglés Avanzado", profesor: "Ana Torres", sede: "Sede Central", sala: "Sala A", horario: "16:00 / 17:30", inicio: "16:00", inicioBadge: "bg-danger text-white", termino: "17:30", sesion: "Pendiente", sesionBadge: "bg-danger text-white" }, { id: 105, tipo: "Regular", curso: "Japonés Básico", profesor: "Takashi Tanaka", sede: "Sede Norte", sala: "Sala D", horario: "18:00 / 19:30", inicio: "18:00", inicioBadge: "bg-warning text-dark", termino: "19:30", sesion: "En proceso", sesionBadge: "bg-light text-dark" }, ]; if (loading) return
Cargando...
; if (error) return
{error}
; return (
{/* */}
{/* CORREGIDO: margin-bottom cambiado a marginBottom */}

Mostrando cursos del día
{/* */}

Empresas
Total
0 %

Cursos
Total
0 %

Alumnos
Con SENCE
0
Sin SENCE
0
Total
0
{/* Listado de alumnos*/}
{/* CORREGIDO: Anchos de columnas pasados a objetos style */} {alumnos.map((a) => ( ))}
ID Tipo Curso Profesor Sede Sala Horario Inicio Termino Sesion
{a.id} {a.tipo} {a.curso} {a.profesor} {a.sede} {a.sala} {a.horario} {a.inicio} {a.termino} {a.sesion}
{/* Vista alternativa: Sin clases */}
{/* CORREGIDO: style cambiado a objeto */}

Jornada sin clases
Si cree que esto es un error, contáctenos. Generar Ticket
); } ________ layout v2 _________ "use client"; import { Geist, Geist_Mono } from "next/font/google"; import "bootstrap/dist/css/bootstrap.min.css"; import { useState, useEffect } from "react"; import { Menu, MenuRight, Grid, School, Buildings, Book, Group, SwapHorizontal, DoorOpen, Sun, Moon } from "@boxicons/react"; const geistSans = Geist({ variable: "--font-geist-sans", subsets: ["latin"] }); const geistMono = Geist_Mono({ variable: "--font-geist-mono", subsets: ["latin"] }); export default function RootLayout({ children }: Readonly<{ children: React.ReactNode }>) { const [open, setOpen] = useState(true); const [theme, setTheme] = useState<"light" | "dark">("light"); // Cargar tema guardado o preferencia del sistema al iniciar useEffect(() => { const savedTheme = localStorage.getItem("theme") as "light" | "dark" | null; const systemDark = window.matchMedia("(prefers-color-scheme: dark)").matches; const currentTheme = savedTheme || (systemDark ? "dark" : "light"); setTheme(currentTheme); document.documentElement.setAttribute("data-bs-theme", currentTheme); }, []); // Alternar entre Claro y Oscuro const toggleTheme = () => { const newTheme = theme === "light" ? "dark" : "light"; setTheme(newTheme); document.documentElement.setAttribute("data-bs-theme", newTheme); localStorage.setItem("theme", newTheme); }; return (
{open &&
SAM
}
{/* Botón para cambiar tema */}
{open && (
Usuario
Sede
)}
{children}
); }