diff --git a/js/layout.js b/js/layout.js index 2e0e43a..a2b0823 100644 --- a/js/layout.js +++ b/js/layout.js @@ -2,130 +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: "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