<script>
    function afterUpdate1() {
      console.log("runned my function");
        var itemsPerPage = 9;
        var currentPage = 0;
        var items = document.querySelectorAll(".shops_item_data");
        var totalPages = Math.ceil(items.length / itemsPerPage);
        var nextButton = document.querySelector(".next-button");
        var prevButton = document.querySelector(".prev-button");
        var pageInput = document.querySelector(".input_page");
        var paginationBlock = document.querySelector("#all_pagination");

        // Initially hide all items except the first page
        for (var i = itemsPerPage; i < items.length; i++) {
            items[i].style.display = "none";
        }

        updatePagination();

        prevButton.addEventListener("click", function () {
            if (currentPage > 0) {
                currentPage--;
                updatePagination();
            }
        });

        nextButton.addEventListener("click", function () {
            if (currentPage < totalPages - 1) {
                currentPage++;
                updatePagination();
            }
        });

        function updatePagination() {
            var startIndex = currentPage * itemsPerPage;
            var endIndex = startIndex + itemsPerPage;

            for (var i = 0; i < items.length; i++) {
                if (i >= startIndex && i < endIndex) {
                    items[i].style.display = "block";
                } else {
                    items[i].style.display = "none";
                }
            }

            if(pageInput.value != null)
            {
                pageInput.value = currentPage + 1; // Update input field value
            }

        }
    };

    function afterUpdate2() {
        var itemsPerPage = 9;
        var currentPage = 0;
        var items = document.querySelectorAll("#rentals .shops_item");
        var totalPages = Math.ceil(items.length / itemsPerPage);
        var nextButton = document.querySelector("#rentals_pagination .next-button");
        var prevButton = document.querySelector("#rentals_pagination .prev-button");
        var pageInput = document.querySelector("#rentals_pagination .input_page");
        var paginationBlock = document.querySelector("#rentals_pagination");

        // Initially hide all items except the first page
        for (var i = itemsPerPage; i < items.length; i++) {
            items[i].style.display = "none";
        }

        updatePagination();

            prevButton.addEventListener("click", function () {
                if (currentPage > 0) {
                    currentPage--;
                    updatePagination();
                }
            });

            nextButton.addEventListener("click", function () {
                if (currentPage < totalPages - 1) {
                    currentPage++;
                    updatePagination();
                }
            });


        function updatePagination() {
            var startIndex = currentPage * itemsPerPage;
            var endIndex = startIndex + itemsPerPage;

            for (var i = 0; i < items.length; i++) {
                if (i >= startIndex && i < endIndex) {
                    items[i].style.display = "block";
                } else {
                    items[i].style.display = "none";
                }
            }

            console.log(items.length);

            if(pageInput.value != null)
            {
                pageInput.value = currentPage + 1; // Update input field value
            }

        }
    };

    function afterUpdate3() {
        var itemsPerPage = 9;
        var currentPage = 0;
        var items = document.querySelectorAll("#sales .shops_item");
        var totalPages = Math.ceil(items.length / itemsPerPage);
        var nextButton = document.querySelector("#sales_pagination .next-button");
        var prevButton = document.querySelector("#sales_pagination .prev-button");
        var pageInput = document.querySelector("#sales_pagination .input_page");
        var paginationBlock = document.querySelector("#sales_pagination");

        // Initially hide all items except the first page
        for (var i = itemsPerPage; i < items.length; i++) {
            items[i].style.display = "none";
        }

        updatePagination();

            prevButton.addEventListener("click", function () {
                if (currentPage > 0) {
                    currentPage--;
                    updatePagination();
                }
            });

            nextButton.addEventListener("click", function () {
                if (currentPage < totalPages - 1) {
                    currentPage++;
                    updatePagination();
                }
            });

        function updatePagination() {
            var startIndex = currentPage * itemsPerPage;
            var endIndex = startIndex + itemsPerPage;

            for (var i = 0; i < items.length; i++) {
                if (i >= startIndex && i < endIndex) {
                    items[i].style.display = "block";
                } else {
                    items[i].style.display = "none";
                }
            }

            if(pageInput.value != null)
            {
                pageInput.value = currentPage + 1; // Update input field value
            }

        }
    };

    function afterUpdate4() {
        // Initially hide all pagination buttons except the one for the active tab
        var allPagination = document.querySelector('.shops_block_all_pagination');
        var rentalsPagination = document.querySelector('.shops_block_rentals_pagination');
        var salesPagination = document.querySelector('.shops_block_sales_pagination');

        allPagination.style.display = "inline-flex";
        rentalsPagination.style.display = "none";
        salesPagination.style.display = "none";

        // Handle click events on tab links
        var tabLinks = document.querySelectorAll('.shops_tab-link');
        // console.log(tabLinks);
        tabLinks.forEach(function(tabLink) {
            tabLink.addEventListener('click', function() {
                // Remove 'active' class from all tab links
                tabLinks.forEach(function(link) {
                    link.classList.remove('active');
                });
                // Add 'active' class to the clicked tab link
                tabLink.classList.add('active');

                // Hide all pagination buttons
                allPagination.style.display = "none";
                rentalsPagination.style.display = "none";
                salesPagination.style.display = "none";

                // Get the data-tab attribute value of the clicked tab link
                var tabId = tabLink.getAttribute('data-tab');

                console.log(tabId + '_pagination');
                document.querySelector(tabId + '_pagination').style.display = "inline-flex";
            });
        });
    };

    afterUpdate1();
    afterUpdate2();
    afterUpdate3();

</script>
<script>
    document.addEventListener("DOMContentLoaded", function() {
        // Initially hide all pagination buttons except the one for the active tab
        var allPagination = document.querySelector('.shops_block_all_pagination');
        var rentalsPagination = document.querySelector('.shops_block_rentals_pagination');
        var salesPagination = document.querySelector('.shops_block_sales_pagination');

        allPagination.style.display = "inline-flex";
        rentalsPagination.style.display = "none";
        salesPagination.style.display = "none";

        // Handle click events on tab links
        var tabLinks = document.querySelectorAll('.shops_tab-link');
        // console.log(tabLinks);
        tabLinks.forEach(function(tabLink) {
            tabLink.addEventListener('click', function() {
                // Remove 'active' class from all tab links
                tabLinks.forEach(function(link) {
                    link.classList.remove('active');
                });
                // Add 'active' class to the clicked tab link
                tabLink.classList.add('active');

                // Hide all pagination buttons
                allPagination.style.display = "none";
                rentalsPagination.style.display = "none";
                salesPagination.style.display = "none";

                // Get the data-tab attribute value of the clicked tab link
                var tabId = tabLink.getAttribute('data-tab');

                console.log(tabId + '_pagination');
                document.querySelector(tabId + '_pagination').style.display = "inline-flex";
            });
        });
    });

</script>