import "./app.scss"

// Membre / Super Admin : mutuellement exclusif
document.addEventListener('DOMContentLoaded', () => {
    const memberCheckbox = document.querySelector('input[value="gp_member"]');
    const adminCheckbox = document.querySelector('input[value="super_admin_asso"]');

    if (memberCheckbox && adminCheckbox) {
        memberCheckbox.addEventListener('change', () => {
            if (memberCheckbox.checked) {
                document.querySelectorAll('input[name="groups[]"]').forEach(cb => {
                    if (cb !== memberCheckbox) {
                        cb.checked = false;
                    }
                });
            }
        });

        adminCheckbox.addEventListener('change', () => {
            if (adminCheckbox.checked) {
                memberCheckbox.checked = false;
                document.querySelectorAll('input[name="groups[]"]').forEach(cb => {
                    if (cb !== memberCheckbox) {
                        cb.checked = true;
                    }
                });
            }
        });
    }

    // Stats period selector
    const periodSelect = document.getElementById('stats-period-select');
    const customRange = document.getElementById('stats-custom-range');
    if (periodSelect && customRange) {
        periodSelect.addEventListener('change', () => {
            customRange.classList.toggle('hidden', periodSelect.value !== 'custom');
        });
    }

    // data-confirm
    document.querySelectorAll('form[data-confirm]').forEach(form => {
        form.addEventListener('submit', (e) => {
            if (!confirm(form.dataset.confirm)) {
                e.preventDefault();
            }
        });
    });

    // Sidebar dropdown toggle
    document.querySelectorAll('.sidebar-dropdown-btn').forEach(btn => {
        btn.addEventListener('click', () => {
            const menu = btn.nextElementSibling;
            const arrow = btn.querySelector('.sidebar-dropdown-arrow');
            menu?.classList.toggle('hidden');
            arrow?.classList.toggle('rotate-180');
        });
    });

    // Mobile sidebar toggle
    const sidebarToggle = document.getElementById('admin-sidebar-toggle');
    const sidebar = document.getElementById('admin-sidebar');
    const overlay = document.getElementById('admin-overlay');

    if (sidebarToggle && sidebar && overlay) {
        sidebarToggle.addEventListener('click', () => {
            sidebar.classList.toggle('open');
        });

        overlay.addEventListener('click', () => {
            sidebar.classList.remove('open');
        });
    }

    // Mobile menu toggle (public)
    const mobileMenuBtn = document.getElementById('mobile-menu-btn');
    const mobileMenu = document.getElementById('mobile-menu');
    const menuIconOpen = document.getElementById('menu-icon-open');
    const menuIconClose = document.getElementById('menu-icon-close');

    if (mobileMenuBtn && mobileMenu) {
        mobileMenuBtn.addEventListener('click', () => {
            mobileMenu.classList.toggle('hidden');
            menuIconOpen?.classList.toggle('hidden');
            menuIconClose?.classList.toggle('hidden');
        });
    }

    // Cookie banner
    const cookieBanner = document.getElementById('cookie-banner');
    const cookieAccept = document.getElementById('cookie-accept');
    const cookieRefuse = document.getElementById('cookie-refuse');

    if (cookieBanner && !localStorage.getItem('cookie_consent')) {
        cookieBanner.classList.remove('hidden');
    }

    cookieAccept?.addEventListener('click', () => {
        localStorage.setItem('cookie_consent', 'accepted');
        cookieBanner?.classList.add('hidden');
    });

    cookieRefuse?.addEventListener('click', () => {
        localStorage.setItem('cookie_consent', 'refused');
        cookieBanner?.classList.add('hidden');
    });

    // Search (customers & revendeurs)
    const setupSearch = (inputId, resultsId, searchUrl, linkPrefix) => {
        const input = document.getElementById(inputId);
        const results = document.getElementById(resultsId);
        if (!input || !results) return;

        let debounce;
        input.addEventListener('input', () => {
            clearTimeout(debounce);
            const q = input.value.trim();
            if (q.length < 2) {
                results.classList.add('hidden');
                results.innerHTML = '';
                return;
            }
            debounce = setTimeout(async () => {
                const resp = await fetch(`${searchUrl}?q=${encodeURIComponent(q)}`);
                const hits = await resp.json();
                if (hits.length === 0) {
                    results.innerHTML = '<div class="px-4 py-3 text-xs text-gray-400">Aucun resultat.</div>';
                } else {
                    results.innerHTML = hits.map(h =>
                        `<a href="${linkPrefix}${h.id}" class="block px-4 py-2 hover:bg-gray-50 border-b border-gray-100 text-xs">
                            <span class="font-bold">${h.fullName || h.raisonSociale || (h.firstName + ' ' + h.lastName)}</span>
                            ${h.email ? `<span class="text-gray-400 ml-2">${h.email}</span>` : ''}
                            ${h.codeRevendeur ? `<span class="ml-2 px-1 py-0.5 bg-gray-900 text-[#fabf04] text-[9px] font-bold">${h.codeRevendeur}</span>` : ''}
                        </a>`
                    ).join('');
                }
                results.classList.remove('hidden');
            }, 300);
        });

        document.addEventListener('click', (e) => {
            if (!results.contains(e.target) && e.target !== input) {
                results.classList.add('hidden');
            }
        });
    };

    setupSearch('search-customers', 'search-results', '/admin/clients/search', '/admin/clients/');
    setupSearch('search-revendeurs', 'search-results-revendeurs', '/admin/revendeurs/search', '/admin/revendeurs/');
});