<?php
/**
 * ASISMA CRM - Sidebar Layout Component
 */
$_uri = isset($_SERVER['REQUEST_URI']) ? parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH) : '/';
$currentRoute = trim($_uri, '/');

// Obtener iniciales del usuario
$userName = SessionHelper::getNombre();
$words = explode(' ', $userName);
$initials = '';
foreach ($words as $w) {
    $initials .= strtoupper(substr($w, 0, 1));
}
$initials = substr($initials, 0, 2);

// Definir menú de navegación
// Estructura: 'seccion' => [['label' => '...', 'route' => '...', 'icon' => '...', 'permiso' => '...']]
$menu = [
    'Análisis' => [
        [
            'label' => 'Dashboard',
            'route' => 'dashboard',
            'icon' => 'layout-dashboard',
            'permiso' => 'dashboard'
        ]
    ],
    'Comercial' => [
        [
            'label' => 'Leads',
            'route' => 'leads',
            'icon' => 'target',
            'permiso' => 'leads'
        ],
        [
            'label' => 'Cotizaciones',
            'route' => 'cotizaciones',
            'icon' => 'file-text',
            'permiso' => 'cotizaciones'
        ],
        [
            'label' => 'Clientes / Empresas',
            'route' => 'empresas',
            'icon' => 'briefcase',
            'permiso' => 'empresas'
        ],
        [
            'label' => 'Contactos',
            'route' => 'contactos',
            'icon' => 'contact',
            'permiso' => 'contactos'
        ]
    ],
];
// La documentación de la API solo la ven la matriz y los dueños de franquicia
if (SessionHelper::isAdmin() || SessionHelper::getRol() === ROL_FRANQUICIADO) {
    $menu['Comercial'][] = [
        'label' => 'API de Leads',
        'route' => 'leads/api-documentacion',
        'icon' => 'plug-zap',
        'permiso' => 'leads'
    ];
}
$menu += [
    'Comunicación' => [
        [
            'label' => 'WhatsApp Chat',
            'route' => 'whatsapp',
            'icon' => 'message-circle',
            'permiso' => 'whatsapp'
        ]
    ],
    'Catálogo' => [
        [
            'label' => 'Verticales',
            'route' => 'verticales',
            'icon' => 'layers',
            'permiso' => 'verticales'
        ],
        [
            'label' => 'Marcas',
            'route' => 'marcas',
            'icon' => 'tag',
            'permiso' => 'marcas'
        ],
        [
            'label' => SessionHelper::isAdmin() ? 'Productos' : 'Mis Productos',
            'route' => 'productos',
            'icon' => 'package',
            'permiso' => 'productos'
        ]
    ],
];
// Los servicios se administran dentro del maestro de Productos (un servicio
// es un producto de tipo servicio); no llevan ítem de menú propio.
$menu += [
    'Organización' => [
        [
            'label' => 'Franquiciados',
            'route' => 'franquiciados',
            'icon' => 'building-2',
            'permiso' => 'franquiciados'
        ],
        [
            'label' => 'Rotación de Leads',
            'route' => 'rotacion',
            'icon' => 'refresh-cw',
            'permiso' => 'franquiciados'
        ],
        [
            'label' => 'Cola de Asignación',
            'route' => 'franquiciados/cola',
            'icon' => 'list-ordered',
            'permiso' => 'franquiciados'
        ],
        [
            'label' => 'Usuarios',
            'route' => 'usuarios',
            'icon' => 'users',
            'permiso' => 'usuarios'
        ],
        [
            'label' => 'Regiones',
            'route' => 'regiones',
            'icon' => 'map-pin',
            'permiso' => 'regiones'
        ]
    ],
    'Post-Venta' => [
        [
            'label' => 'Operaciones Marca',
            'route' => 'operaciones',
            'icon' => 'activity',
            'permiso' => 'operaciones'
        ]
    ],
    'Reportes & Sistema' => [
        [
            'label' => 'Reportes',
            'route' => 'reportes',
            'icon' => 'bar-chart-3',
            'permiso' => 'reportes'
        ],
        [
            'label' => 'Cobros por Lead',
            'route' => 'cobros',
            'icon' => 'receipt',
            'permiso' => 'cobros'
        ],
        [
            'label' => 'Configuración',
            'route' => 'configuracion',
            'icon' => 'settings',
            'permiso' => 'configuracion'
        ],
        [
            'label' => 'Auditoría',
            'route' => 'auditoria',
            'icon' => 'shield-check',
            'permiso' => 'auditoria'
        ]
    ]
];
?>

<aside id="sidebar" class="fixed inset-y-0 left-0 z-20 flex w-72 flex-col border-r border-slate-800 bg-slate-900 text-slate-400 transition-transform duration-300 -translate-x-full lg:translate-x-0">
    <!-- Brand / Header -->
    <div class="flex h-16 items-center justify-between px-6 border-b border-slate-800 bg-slate-950">
        <div>
            <a href="<?php echo APP_URL; ?>/dashboard" class="flex items-center gap-2">
                <div class="w-8 h-8 rounded-lg bg-gradient-to-tr from-blue-600 to-indigo-500 flex items-center justify-center shadow-lg">
                    <i data-lucide="layers" class="w-4 h-4 text-white"></i>
                </div>
                <span class="text-xl font-bold tracking-tight text-white">ASISMA<span class="text-blue-500">CRM</span></span>
            </a>
            <?php if (SessionHelper::isAdmin()): ?>
            <!-- Panel de avance del proyecto: solo el superadmin de la matriz -->
            <a href="/avance/" target="_blank" class="block pl-10 -mt-1 text-[11px] font-medium text-slate-500 hover:text-blue-400 transition-colors">Avances</a>
            <?php endif; ?>
        </div>
        <button id="closeSidebar" class="p-1 rounded-md text-slate-400 hover:text-white hover:bg-slate-800 lg:hidden">
            <i data-lucide="x" class="w-5 h-5"></i>
        </button>
    </div>

    <?php $rolConLeads = in_array(SessionHelper::getRol(), array(ROL_FRANQUICIADO, ROL_VENDEDOR)); ?>
    <?php if ($rolConLeads): ?>
    <!-- Alerta SUPER visible bajo el logo cuando hay un lead esperando ser tomado -->
    <button id="avisoNuevoLead" onclick="mostrarModalNuevoLead()" style="display:none"
            class="w-full items-center justify-center gap-2 px-4 py-2.5 bg-red-600 hover:bg-red-500 text-white text-xs font-black uppercase tracking-wider animate-pulse cursor-pointer">
        <i data-lucide="bell-ring" class="w-4 h-4"></i>
        <span id="avisoNuevoLeadTexto">¡NUEVO LEAD ESPERANDO!</span>
    </button>
    <?php endif; ?>

    <!-- Menú de Navegación -->
    <div class="flex-1 overflow-y-auto px-4 py-6 space-y-6">
        <?php foreach ($menu as $section => $items): ?>
            <?php
            // Filtrar items según permisos antes de renderizar la sección
            $visibleItems = array_filter($items, function($item) {
                return SessionHelper::hasPermiso($item['permiso']);
            });
            if (empty($visibleItems)) continue;
            ?>
            <div class="space-y-2">
                <h3 class="px-3 text-xs font-semibold uppercase tracking-wider text-slate-500"><?php echo $section; ?></h3>
                <nav class="space-y-1">
                    <?php foreach ($visibleItems as $item): ?>
                        <?php 
                        $isActive = ($currentRoute === $item['route'] || strpos($currentRoute, $item['route'] . '/') === 0);
                        $activeClass = $isActive 
                            ? 'bg-blue-600 text-white font-medium shadow-md shadow-blue-600/10' 
                            : 'hover:bg-slate-800/60 hover:text-slate-200';
                        ?>
                        <a href="<?php echo APP_URL; ?>/<?php echo $item['route']; ?>" 
                           class="group flex items-center gap-3 px-3 py-2.5 rounded-xl text-sm transition-all duration-150 <?php echo $activeClass; ?>">
                            <i data-lucide="<?php echo $item['icon']; ?>" 
                               class="w-4 h-4 shrink-0 transition-transform group-hover:scale-110 <?php echo $isActive ? 'text-white' : 'text-slate-400 group-hover:text-slate-200'; ?>"></i>
                            <span><?php echo $item['label']; ?></span>
                        </a>
                    <?php endforeach; ?>
                </nav>
            </div>
        <?php endforeach; ?>
    </div>

    <!-- User Profile & Footer Info -->
    <div class="border-t border-slate-800 p-4 bg-slate-950 flex flex-col gap-3">
        <div class="flex items-center gap-3">
            <!-- Initials Avatar -->
            <div class="w-10 h-10 rounded-xl bg-gradient-to-tr from-blue-500 to-indigo-600 flex items-center justify-center text-white font-bold text-sm shadow-md">
                <?php echo $initials; ?>
            </div>
            
            <div class="flex-1 min-w-0">
                <p class="text-sm font-semibold text-slate-200 truncate leading-tight"><?php echo htmlspecialchars($userName); ?></p>
                <span class="inline-flex items-center rounded-md bg-blue-500/10 px-2 py-0.5 text-xs font-medium text-blue-400 ring-1 ring-inset ring-blue-500/20 capitalize mt-1">
                    <?php $rol = SessionHelper::getRol(); $_roles = arr_roles(); echo isset($_roles[$rol]) ? $_roles[$rol] : $rol; ?>
                </span>
            </div>
        </div>
        
        <!-- Action Buttons -->
        <div class="grid grid-cols-2 gap-2 mt-1">
            <a href="<?php echo APP_URL; ?>/configuracion" class="flex items-center justify-center gap-1.5 px-3 py-2 bg-slate-900 border border-slate-800 text-slate-400 hover:text-white rounded-lg text-xs font-semibold hover:bg-slate-800 transition-colors">
                <i data-lucide="settings" class="w-3.5 h-3.5"></i>
                <span>Ajustes</span>
            </a>
            <a href="<?php echo APP_URL; ?>/logout" class="flex items-center justify-center gap-1.5 px-3 py-2 bg-red-950/20 border border-red-900/30 text-red-400 hover:text-red-300 rounded-lg text-xs font-semibold hover:bg-red-950/40 transition-colors">
                <i data-lucide="log-out" class="w-3.5 h-3.5"></i>
                <span>Salir</span>
            </a>
        </div>
    </div>
</aside>

<!-- Sidebar Overlay for mobile screen -->
<div id="sidebarOverlay" class="fixed inset-0 z-10 bg-slate-950/60 backdrop-blur-sm hidden lg:hidden"></div>

<?php if ($rolConLeads): ?>
<script>
// ── Alerta de NUEVO LEAD para el usuario notificado ──────────────────────────
// Consulta cada 10 s si este usuario tiene una asignación pendiente. Si hay:
// banner rojo bajo el logo + modal grande (una vez por asignación). Ver el
// lead NO lo acepta: los datos se liberan solo al tomarlo desde el detalle.
var pendientesLead = [];

function mostrarModalNuevoLead() {
    if (pendientesLead.length) modalNuevoLead(pendientesLead[0]);
}

function modalNuevoLead(p) {
    var origenes = { manual: 'Ingreso manual', web: 'Formulario Web', meta: 'Meta / Facebook',
                     whatsapp_directo: 'WhatsApp directo', api: 'API / Landing', referido: 'Referido' };
    var esc = function(t) { return $('<i>').text(t == null ? '' : t).html(); };
    Swal.fire({
        title: '🔔 ¡NUEVO LEAD!',
        html: '<div style="text-align:left;font-size:14px;line-height:1.8">' +
              '<div style="font-size:19px;font-weight:800;color:#fff;margin-bottom:8px">' + esc(p.empresa || ('Lead #' + p.lead_id)) + '</div>' +
              '<div>📦 Interés: <b>' + esc(p.interes) + '</b></div>' +
              '<div>📍 Región: <b>' + esc(p.region || '—') + '</b></div>' +
              '<div>🛬 Viene de: <b>' + esc(origenes[p.origen] || p.origen) + '</b></div>' +
              '<div style="margin-top:10px;padding:8px 12px;background:rgba(251,191,36,.12);border:1px solid rgba(251,191,36,.35);border-radius:10px;color:#fbbf24;font-weight:800">⏱ Tienes <span id="segundosNuevoLead">' + Math.max(0, p.segundos_restantes) + '</span> s para tomarlo o rota al siguiente</div>' +
              '<div style="margin-top:8px;font-size:12px;color:#94a3b8">Ver el lead NO lo acepta: los datos de contacto se liberan solo cuando lo tomas desde el detalle.</div>' +
              '</div>',
        icon: 'warning',
        background: '#1e293b', color: '#f8fafc',
        showCancelButton: true,
        confirmButtonText: 'Ver el lead',
        cancelButtonText: 'Seguir trabajando',
        confirmButtonColor: '#3b82f6',
        allowOutsideClick: false
    }).then(function(res) {
        if (res.isConfirmed) window.location = '<?php echo APP_URL; ?>/leads/ver?id=' + p.lead_id;
    });
    var reloj = setInterval(function() {
        var el = document.getElementById('segundosNuevoLead');
        if (!el) { clearInterval(reloj); return; }
        el.textContent = Math.max(0, parseInt(el.textContent, 10) - 1);
    }, 1000);
}

function revisarNuevosLeads() {
    $.getJSON('<?php echo APP_URL; ?>/leads/notificacion-pendiente', function(r) {
        if (!r || !r.success) return;
        pendientesLead = r.pendientes || [];
        var aviso = document.getElementById('avisoNuevoLead');
        if (!aviso) return;
        if (pendientesLead.length) {
            aviso.style.display = 'flex';
            document.getElementById('avisoNuevoLeadTexto').textContent =
                pendientesLead.length === 1 ? '¡NUEVO LEAD ESPERANDO!' : '¡' + pendientesLead.length + ' LEADS ESPERANDO!';
            // El modal salta solo UNA vez por asignación (el banner queda fijo)
            for (var i = 0; i < pendientesLead.length; i++) {
                var clave = 'lead_avisado_' + pendientesLead[i].asignacion_id;
                if (!sessionStorage.getItem(clave)) {
                    sessionStorage.setItem(clave, '1');
                    modalNuevoLead(pendientesLead[i]);
                    break;
                }
            }
            if (typeof lucide !== 'undefined') lucide.createIcons();
        } else {
            aviso.style.display = 'none';
        }
    });
}

$(function() {
    revisarNuevosLeads();
    setInterval(revisarNuevosLeads, 10000);
});
</script>
<?php endif; ?>
