jQuery(document).ready(function($) {
    const debounceDelay = 300;
    let debounceTimer;

    function filterRamais(page = 1) {
        clearTimeout(debounceTimer);
        
        debounceTimer = setTimeout(() => {
            const search = $('#ramais-search').val();
            const secretaria = $('#ramais-secretaria').val();
            const setor = $('#ramais-setor').val();

            $('.ramais-results').html('<p class="ramais-loading"><?php _e("Carregando...", "ramais-telefonicos"); ?></p>');

            $.ajax({
                url: ramaisVars.ajaxurl,
                type: 'POST',
                data: {
                    action: 'filtrar_ramais',
                    nonce: ramaisVars.nonce,
                    search: search,
                    secretaria: secretaria,
                    setor: setor,
                    page: page
                },
                success: function(response) {
                    if (response.success) {
                        $('.ramais-results').html(response.data);
                    } else {
                        $('.ramais-results').html('<p class="ramais-error"><?php _e("Erro ao carregar dados.", "ramais-telefonicos"); ?></p>');
                    }
                },
                error: function() {
                    $('.ramais-results').html('<p class="ramais-error"><?php _e("Erro na comunicação com o servidor.", "ramais-telefonicos"); ?></p>');
                }
            });
        }, debounceDelay);
    }

    // Eventos de filtro
    $('#ramais-search').on('input', function() {
        filterRamais(1);
    });

    $('#ramais-secretaria, #ramais-setor').on('change', function() {
        filterRamais(1);
    });

    // Paginação
    $(document).on('click', '.ramais-page-link', function(e) {
        e.preventDefault();
        const page = $(this).data('page');
        filterRamais(page);
    });

    // Carregamento inicial
    filterRamais(1);
});