let currentPage = 1;
const itemsPerPage = 10;
let searchExhausted = false;

function previousPage() {
    if (currentPage > 1) {
        currentPage--;
        fetchData();
    }
}

function nextPage() {
    if (currentPage < totalPages) {
        currentPage++;
        fetchData();
    }
}

function updatePagination(data) {
    currentPage = data.current_page;
    totalPages = data.last_page;
    totalItems = data.total;
    let paginationHTML = '';

    paginationHTML += `<li><a href="#" onclick="previousPage()" class="flex items-center justify-center px-3 h-8 ms-0 leading-tight text-gray-500 bg-white border border-gray-300 rounded-s-lg ${currentPage === 1 ? 'cursor-not-allowed opacity-50' : ''}">Previous</a></li>`;

    for (let i = 1; i <= totalPages; i++) {
        paginationHTML += `<li><a href="#" onclick="changePage(${i})" class="flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 ${currentPage === i ? 'text-blue-600 bg-blue-50 hover:bg-blue-100 hover:text-blue-700' : ''}">${i}</a></li>`;
    }

    paginationHTML += `<li><a href="#" onclick="nextPage()" class="flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg ${currentPage === totalPages ? 'cursor-not-allowed opacity-50' : ''}">Next</a></li>`;

    $('#pagination').html(paginationHTML);
    updatePaginationInfo();
}

function updatePaginationInfo() {
    $('#pagination-info').html(`Showing <span class="font-semibold text-gray-900">${(currentPage - 1) * itemsPerPage + 1}-${Math.min(currentPage * itemsPerPage, totalItems)}</span> of <span class="font-semibold text-gray-900">${totalItems}</span>`);
}

function changePage(page) {
    if (page !== currentPage) {
        currentPage = page;
        fetchData();
    }
}

function toggleModal() {
    var modal = document.getElementById("modal");
    modal.classList.toggle("hidden");
}

function closeModal() {
    var modal = $("#modal");
    var form = $("#formData");
    modal.addClass("hidden");

    var formElements = form.find(":input");
    formElements.each(function() {
        var element = $(this);
        if (element.is("input") || element.is("select") || element.is("textarea")) {
            element.val("");
            if (element.attr("type") === "password") {
                element.prop("disabled", false);
                element.removeClass('bg-gray-300');
                element.addClass('bg-gray-50');
            }
        } else if ((element.is("input")) && (element.attr("type") === "checkbox" || element.attr("type") === "radio")) {
            element.prop("checked", false);
        }
    });
}

document.getElementById("openModalButton").addEventListener("click", toggleModal);
document.getElementById("closeModalButton").addEventListener("click", closeModal);
window.addEventListener("click", function(event) {
    var modal = document.getElementById("modal");
    if (event.target == modal) {
        closeModal();
    }
});

document.getElementById('search').addEventListener('input', function() {
    const searchTerm = this.value.toLowerCase();
    const tableRows = document.querySelectorAll('#table tbody tr');

    tableRows.forEach(row => {
        const nama = row.cells[1].textContent.toLowerCase();
        if (nama.includes(searchTerm)) {
            row.style.display = '';
        } else {
            row.style.display = 'none';
        }
    });
});