<?php
// footer.php
// Verificar se a sessão está ativa
if (session_status() === PHP_SESSION_NONE) {
    session_start();
}

$permissao = $_SESSION['permissao'] ?? 'usuario';
?>

<!-- Modal para upload de logo -->
<div class="logo-upload-modal" id="logoUploadModal">
    <div class="logo-upload-content">
        <h3>Alterar Logo do Tenant</h3>
        
        <div class="logo-preview" id="logoPreview">
            <span style="color: #999;">Prévia do logo</span>
        </div>
        
        <input type="file" id="tenantLogo" accept="image/jpeg,image/png,image/gif,image/webp" 
               onchange="previewLogo(this)" style="margin: 10px 0;">
        
        <div style="font-size: 0.8em; color: #666; margin-bottom: 15px;">
            Formatos suportados: JPG, PNG, GIF, WebP (Máx: 5MB)
        </div>
        
        <div class="logo-upload-actions">
            <button class="btn btn-secondary" onclick="closeLogoUpload()">Cancelar</button>
            <button class="btn btn-primary" onclick="uploadLogo()">Salvar Logo</button>
        </div>
    </div>
</div>

<style>
    /* Modal para upload de logo */
    .logo-upload-modal {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.5);
        z-index: 2000;
        justify-content: center;
        align-items: center;
    }

    .logo-upload-content {
        background: white;
        padding: 25px;
        border-radius: 10px;
        width: 90%;
        max-width: 400px;
        box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    }

    .logo-upload-content h3 {
        margin-bottom: 15px;
        color: var(--secondary-color);
    }

    .logo-preview {
        width: 120px;
        height: 120px;
        border: 2px dashed #ddd;
        border-radius: 8px;
        margin: 15px auto;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
    }

    .logo-preview img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .logo-upload-actions {
        display: flex;
        gap: 10px;
        justify-content: flex-end;
        margin-top: 20px;
    }

    .btn {
        padding: 8px 16px;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        font-weight: 600;
        transition: background-color 0.3s;
    }

    .btn-primary {
        background: var(--primary-color);
        color: white;
    }

    .btn-primary:hover {
        background: #2980b9;
    }

    .btn-secondary {
        background: var(--gray-color);
        color: white;
    }

    .btn-secondary:hover {
        background: #7f8c8d;
    }
</style>

<script>
// JavaScript para controlar a expansão do menu
document.addEventListener('DOMContentLoaded', function() {
    const sidebar = document.querySelector('.sidebar');
    const mainContent = document.querySelector('.main-content');
    const sidebarToggle = document.querySelector('.sidebar-toggle');
    const submenuTriggers = document.querySelectorAll('.submenu-trigger');
    
    // Alternar menu ao passar o mouse (apenas desktop)
    if (window.innerWidth > 768) {
        if (sidebar) {
            sidebar.addEventListener('mouseenter', function() {
                sidebar.classList.add('expanded');
                if (mainContent) mainContent.classList.add('expanded');
            });
            
            sidebar.addEventListener('mouseleave', function() {
                sidebar.classList.remove('expanded');
                if (mainContent) mainContent.classList.remove('expanded');
            });
        }
    }
    
    // Alternar menu ao clicar no ícone (mobile)
    if (sidebarToggle) {
        sidebarToggle.addEventListener('click', function() {
            if (sidebar) sidebar.classList.toggle('expanded');
        });
    }
    
    // Controlar abertura dos submenus por clique
    submenuTriggers.forEach(trigger => {
        trigger.addEventListener('click', function(e) {
            e.preventDefault();
            
            // Fecha outros submenus abertos
            document.querySelectorAll('.submenu-sidebar.active').forEach(openSubmenu => {
                if (openSubmenu !== this.nextElementSibling) {
                    openSubmenu.classList.remove('active');
                    openSubmenu.previousElementSibling.classList.remove('active');
                }
            });
            
            // Alterna o submenu atual
            const submenu = this.nextElementSibling;
            if (submenu && submenu.classList.contains('submenu-sidebar')) {
                this.classList.toggle('active');
                submenu.classList.toggle('active');
            }
        });
    });

    // Controle do menu do usuário no cabeçalho
    const userMenuTrigger = document.getElementById('userMenuTrigger');
    const userDropdown = document.getElementById('userDropdown');

    if (userMenuTrigger && userDropdown) {
        userMenuTrigger.addEventListener('click', function(e) {
            e.stopPropagation();
            userDropdown.classList.toggle('show');
        });

        // Fechar menu quando clicar fora
        document.addEventListener('click', function() {
            userDropdown.classList.remove('show');
        });

        // Prevenir fechamento quando clicar dentro do menu
        userDropdown.addEventListener('click', function(e) {
            e.stopPropagation();
        });
    }

    // Controle dos filtros (apenas na página index)
    <?php 
    $current_page = basename($_SERVER['PHP_SELF']);
    $is_index_page = ($current_page === 'index.php');
    if ($is_index_page): ?>
    const filtroBtns = document.querySelectorAll('.filtro-btn');
    
    if (filtroBtns.length > 0) {
        filtroBtns.forEach(btn => {
            btn.addEventListener('click', function() {
                // Remove a classe active de todos os botões
                filtroBtns.forEach(b => b.classList.remove('active'));
                
                // Adiciona a classe active ao botão clicado
                this.classList.add('active');
                
                // Aqui você pode adicionar a lógica para filtrar os dados
                const status = this.getAttribute('data-status');
                console.log('Filtrar por:', status);
                // Adicione sua lógica de filtro aqui
            });
        });
    }

    // CORREÇÃO DO CONTADOR DE PESQUISA - Versão simplificada e funcional
    const pesquisaCliente = document.getElementById('pesquisaCliente');
    const contadorResultados = document.getElementById('contadorResultados');
    
    if (pesquisaCliente && contadorResultados) {
        let timeoutPesquisa;
        
        pesquisaCliente.addEventListener('input', function() {
            const termo = this.value.trim();
            
            // Limpar timeout anterior
            clearTimeout(timeoutPesquisa);
            
            if (termo.length > 0) {
                // Mostrar indicador de carregamento
                contadorResultados.textContent = "...";
                contadorResultados.style.display = 'inline-block';
                
                // Debounce para evitar muitas requisições
                timeoutPesquisa = setTimeout(() => {
                    // Versão simplificada - contar clientes existentes na página
                    const clientesNaPagina = document.querySelectorAll('.cliente-item, .card-cliente, [data-cliente]');
                    let resultados = 0;
                    
                    if (clientesNaPagina.length > 0) {
                        // Se houver elementos de cliente na página, filtrar por texto
                        clientesNaPagina.forEach(cliente => {
                            const textoCliente = cliente.textContent.toLowerCase();
                            if (textoCliente.includes(termo.toLowerCase())) {
                                resultados++;
                            }
                        });
                    } else {
                        // Fallback: simulação baseada no comprimento do termo
                        resultados = Math.min(termo.length * 2, 50);
                    }
                    
                    contadorResultados.textContent = resultados;
                    contadorResultados.style.display = 'inline-block';
                    
                }, 300);
                
            } else {
                contadorResultados.style.display = 'none';
            }
        });
        
        // Limpar contador quando sair do campo
        pesquisaCliente.addEventListener('blur', function() {
            setTimeout(() => {
                if (this.value.trim() === '') {
                    contadorResultados.style.display = 'none';
                }
            }, 200);
        });
    }
    <?php endif; ?>
});

// Função para controlar o dropdown do funil
function toggleFunilDropdown() {
    const dropdown = document.getElementById('funilDropdown');
    if (dropdown) {
        dropdown.classList.toggle('show');
    }
}

// Fechar dropdown do funil quando clicar fora
document.addEventListener('click', function(e) {
    const dropdown = document.getElementById('funilDropdown');
    const button = document.querySelector('.funil-button');
    
    if (dropdown && button && !dropdown.contains(e.target) && !button.contains(e.target)) {
        dropdown.classList.remove('show');
    }
});

// Funções para upload de logo
function openLogoUpload() {
    const modal = document.getElementById('logoUploadModal');
    if (modal) {
        modal.style.display = 'flex';
    }
    const userDropdown = document.getElementById('userDropdown');
    if (userDropdown) {
        userDropdown.classList.remove('show');
    }
}

function closeLogoUpload() {
    const modal = document.getElementById('logoUploadModal');
    if (modal) {
        modal.style.display = 'none';
    }
    const tenantLogo = document.getElementById('tenantLogo');
    if (tenantLogo) {
        tenantLogo.value = '';
    }
    const logoPreview = document.getElementById('logoPreview');
    if (logoPreview) {
        logoPreview.innerHTML = '<span style="color: #999;">Prévia do logo</span>';
    }
}

function previewLogo(input) {
    const preview = document.getElementById('logoPreview');
    
    if (input.files && input.files[0] && preview) {
        const reader = new FileReader();
        
        reader.onload = function(e) {
            preview.innerHTML = `<img src="${e.target.result}" alt="Prévia do Logo">`;
        }
        
        reader.readAsDataURL(input.files[0]);
    }
}

function uploadLogo() {
    const fileInput = document.getElementById('tenantLogo');
    const file = fileInput.files[0];
    
    if (!file) {
        alert('Por favor, selecione um arquivo');
        return;
    }
    
    // Validar tamanho do arquivo (5MB máximo)
    if (file.size > 5 * 1024 * 1024) {
        alert('O arquivo é muito grande. Tamanho máximo: 5MB');
        return;
    }
    
    // Mostrar indicador de carregamento
    const uploadBtn = document.querySelector('.logo-upload-actions .btn-primary');
    if (!uploadBtn) return;
    
    const originalText = uploadBtn.textContent;
    uploadBtn.textContent = 'Enviando...';
    uploadBtn.disabled = true;
    
    const formData = new FormData();
    formData.append('tenant_logo', file);
    
    // CORREÇÃO: Usar o caminho correto do arquivo de upload
    fetch('upload_tenant_logo.php', {
        method: 'POST',
        body: formData
    })
    .then(response => {
        if (!response.ok) {
            throw new Error('Erro na rede: ' + response.status);
        }
        return response.json();
    })
    .then(data => {
        console.log('Resposta do servidor:', data);
        if (data.success) {
            alert('Logo atualizado com sucesso!');
            closeLogoUpload();
            // Recarregar a página para mostrar o novo logo
            location.reload();
        } else {
            alert('Erro: ' + data.message);
            uploadBtn.textContent = originalText;
            uploadBtn.disabled = false;
        }
    })
    .catch(error => {
        console.error('Erro:', error);
        alert('Erro ao fazer upload do logo. Verifique o console para mais detalhes.');
        uploadBtn.textContent = originalText;
        uploadBtn.disabled = false;
    });
}

// Fechar modal ao clicar fora
document.addEventListener('click', function(e) {
    const modal = document.getElementById('logoUploadModal');
    if (e.target === modal) {
        closeLogoUpload();
    }
});
</script>
</body>
</html>