diff --git a/js/layout.js b/js/layout.js index a2b0823..3a3c512 100644 --- a/js/layout.js +++ b/js/layout.js @@ -2,131 +2,131 @@ const API_URL = "https://integrarepara-api.integrarepara.es"; document.addEventListener("DOMContentLoaded", () => { -    // 1. Verificar Token -    const token = localStorage.getItem("token"); -    if (!token) { -        if (!window.location.pathname.endsWith("index.html") && window.location.pathname !== "/") { -            window.location.href = "index.html"; -            return; -        } -    } + // 1. Verificar Token + const token = localStorage.getItem("token"); + if (!token) { + if (!window.location.pathname.endsWith("index.html") && window.location.pathname !== "/") { + window.location.href = "index.html"; + return; + } + } -    // 2. Generar Sidebar y Header -    renderSidebar(); -    renderHeader(); + // 2. Generar Sidebar y Header + renderSidebar(); + renderHeader(); -    // 3. Inicializar Iconos -    if (window.lucide) lucide.createIcons(); + // 3. Inicializar Iconos + if (window.lucide) lucide.createIcons(); -    // 4. Datos usuario -    if (token) setupUserInfo(token); + // 4. Datos usuario + if (token) setupUserInfo(token); }); // --- GENERADOR DE BARRA LATERAL (DISEÑO ORIGINAL RESTAURADO) --- function renderSidebar() { -    const container = document.getElementById('sidebar-container'); -    if (!container) return; + const container = document.getElementById('sidebar-container'); + if (!container) return; -    const path = window.location.pathname.split("/").pop() || "index.html"; + const path = window.location.pathname.split("/").pop() || "index.html"; - // MENUS. + // MENUS. const menuItems = [ -    { name: "Dashboard", link: "panel.html", icon: "layout-dashboard" }, -    { name: "Servicios", link: "servicios.html", icon: "briefcase" }, -    { name: "Agenda", link: "agenda.html", icon: "calendar-clock" }, -    { name: "Proveedores", link: "proveedores.html", icon: "building-2" }, // Nuevo nombre para el buzón actual -    { name: "Calendario", link: "calendario.html", icon: "calendar" }, -    { name: "Clientes", link: "clientes.html", icon: "users" }, -    { name: "Usuarios", link: "usuarios.html", icon: "user-cog" }, -    { name: "Automatizaciones", link: "automatizaciones.html", icon: "zap" }, // Queda libre para lo nuevo -    { name: "Configuración", link: "configuracion.html", icon: "settings" }, + { name: "Dashboard", link: "panel.html", icon: "layout-dashboard" }, + { name: "Servicios", link: "servicios.html", icon: "briefcase" }, + { name: "Agenda", link: "agenda.html", icon: "calendar-clock" }, + { name: "Proveedores", link: "proveedores.html", icon: "building-2" }, // Nuevo nombre para el buzón actual + { name: "Calendario", link: "calendario.html", icon: "calendar" }, + { name: "Clientes", link: "clientes.html", icon: "users" }, + { name: "Usuarios", link: "usuarios.html", icon: "user-cog" }, + { name: "Automatizaciones", link: "automatizaciones.html", icon: "zap" }, // Queda libre para lo nuevo + { name: "Configuración", link: "configuracion.html", icon: "settings" }, ]; -    const linksHtml = menuItems.map(item => { -        const isActive = path === item.link; -        // ESTILOS ORIGINALES (Texto Slate-400, Hover Blanco/Slate-800) -        const baseClasses = "nav-item flex items-center gap-3 px-4 py-3 rounded-lg transition-all text-sm font-medium"; -        // Si está activo, usamos el azul original de tu diseño, si no, el gris -        const activeClasses = isActive  -            ? "bg-blue-600 text-white shadow-lg shadow-blue-500/30"  -            : "text-slate-400 hover:text-white hover:bg-slate-800"; + const linksHtml = menuItems.map(item => { + const isActive = path === item.link; + // ESTILOS ORIGINALES (Texto Slate-400, Hover Blanco/Slate-800) + const baseClasses = "nav-item flex items-center gap-3 px-4 py-3 rounded-lg transition-all text-sm font-medium"; + // Si está activo, usamos el azul original de tu diseño, si no, el gris + const activeClasses = isActive + ? "bg-blue-600 text-white shadow-lg shadow-blue-500/30" + : "text-slate-400 hover:text-white hover:bg-slate-800"; -        return ` -            -                -                ${item.name} -            -        `; -    }).join(""); + return ` + + + ${item.name} + + `; + }).join(""); -    container.innerHTML = ` -        + `; } // --- GENERADOR DE CABECERA (HEADER) --- function renderHeader() { -    const container = document.getElementById('header-container'); -    if (!container) return; + const container = document.getElementById('header-container'); + if (!container) return; -    // Fecha actual -    const dateStr = new Date().toLocaleDateString('es-ES', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }); -    const dateCapitalized = dateStr.charAt(0).toUpperCase() + dateStr.slice(1); + // Fecha actual + const dateStr = new Date().toLocaleDateString('es-ES', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }); + const dateCapitalized = dateStr.charAt(0).toUpperCase() + dateStr.slice(1); -    container.innerHTML = ` -       
-           
-                -                ${dateCapitalized} -           
-             -           
-                -               
-                    U -               
-           
-       
-    `; + container.innerHTML = ` +
+
+ + ${dateCapitalized} +
+ +
+ +
+ U +
+
+
+ `; } // --- UTILIDADES --- function setupUserInfo(token) { -    try { -        const payload = JSON.parse(atob(token.split('.')[1])); -        const nameEl = document.getElementById("headerUserName"); -        const roleEl = document.getElementById("headerUserRole"); -        const avatarEl = document.getElementById("headerUserAvatar"); + try { + const payload = JSON.parse(atob(token.split('.')[1])); + const nameEl = document.getElementById("headerUserName"); + const roleEl = document.getElementById("headerUserRole"); + const avatarEl = document.getElementById("headerUserAvatar"); -        if (nameEl) nameEl.innerText = payload.email || "Usuario"; -        if (roleEl) roleEl.innerText = (payload.role || "Operario").toUpperCase(); -        if (avatarEl) avatarEl.innerText = (payload.email?.[0] || "U").toUpperCase(); -    } catch (e) { -        localStorage.removeItem("token"); -    } + if (nameEl) nameEl.innerText = payload.email || "Usuario"; + if (roleEl) roleEl.innerText = (payload.role || "Operario").toUpperCase(); + if (avatarEl) avatarEl.innerText = (payload.email?.[0] || "U").toUpperCase(); + } catch (e) { + localStorage.removeItem("token"); + } } function logout() { -    if(confirm("¿Cerrar sesión?")) { -        localStorage.removeItem("token"); -        window.location.href = "index.html"; -    } + if(confirm("¿Cerrar sesión?")) { + localStorage.removeItem("token"); + window.location.href = "index.html"; + } } \ No newline at end of file