通用前端分页插件

/**
     * >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
     *                分页组件
     * >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
     */
    let pagehelper = {
        /**
         * 跳转到哪一页
         */
        goto_page: function (page) {
            let pmax = parseInt($("#pmax").val())
            if (page < 1 || page > pmax) {
                layer.msg('无效页码');
                // alert('页码超出范围');
                return;
            }
            $("#p").val(page)
            console.log('跳转到第' + page + '页');
            // 更新按钮
            pagehelper.updateButtons();
            cms.reload();
        },
        /**
         * 点击上一页
         */
        goto_previous: function () {
            let p = parseInt($("#p").val())
            if (p > 1) {
                pagehelper.goto_page(p - 1);
            }
        },
        /**
         * 点击下一页
         */
        goto_next: function () {
            let p = parseInt($("#p").val())
            let pmax = parseInt($("#pmax").val())
            if (p < pmax) {
                pagehelper.goto_page(p + 1);
            }
        },
        /**
         * 生成五个页码
         */
        generatePageNumbers: function (currentPage, totalPages) {
            // 计算要显示的页码范围
            let minPage = Math.max(1, currentPage - 2); // 至少从1开始
            let maxPage = Math.min(totalPages, currentPage + 2); // 最多到总页数

            // 如果总页数小于等于5，直接显示全部页码
            // if (totalPages <= 5) {
            //     minPage = 1;
            //     maxPage = totalPages;
            // }

            // 如果总页数允许且当前页接近两端，则调整最小或最大页码以包含足够的页码
            // 特别是当当前页是前几页或后几页时
            if (currentPage <= 3 && totalPages > 5) {
                maxPage = Math.min(totalPages, 5); // 确保不超过总页数
            } else if (currentPage >= totalPages - 2 && totalPages > 5) {
                minPage = Math.max(1, totalPages - 4); // 确保不小于1
            }

            // 生成页码数组
            let pageNumbers = [];
            for (let i = minPage; i <= maxPage; i++) {
                pageNumbers.push(i);
            }

            return pageNumbers;
        },
        /**
         * 重绘分页组件
         */
        updateButtons: function () {
            let p = parseInt($("#p").val())
            let pmax = parseInt($("#pmax").val())
            var nav = document.getElementById('nav');
            nav.innerHTML = ''; // 清空nav的内容

            // 创建上一页按钮
            var prevButton = document.createElement('button');
            prevButton.onclick = function () {
                pagehelper.goto_previous();
            };
            prevButton.textContent = '上一页';
            if (p == 1) {
                // 如果当前是第一页，则不显示
                prevButton.style.display = 'none';
            }
            //创建五个页码
            let pages = pagehelper.generatePageNumbers(p, pmax);
            // 创建页码按钮
            var ul = document.createElement('ul');
            for (var i = 0; i < pages.length; i++) {
                var pageNum = pages[i];
                var li = document.createElement('li');
                var pageButton = document.createElement('button');
                pageButton.onclick = function (page) {
                    return function () {
                        pagehelper.goto_page(page);
                    };
                }(pageNum); // 闭包确保正确的页码被传递
                pageButton.textContent = pageNum;
                if (pageNum == p) {
                    // 如果不是当前页，则禁用
                    pageButton.disabled = true;
                }
                li.appendChild(pageButton);
                ul.appendChild(li);
            }

            // 创建跳转输入框和下一页按钮
            var input = document.createElement('input');
            input.type = 'number';
            input.name = 'manual';
            input.placeholder = '最大页' + pmax;
            // 设置事件监听器
            input.onkeydown = function (event) {
                if (event.keyCode === 13) { // 只在按下回车键时验证
                    let toPage = parseInt(this.value, 10);
                    if (!isNaN(toPage) && toPage > 0 && toPage <= pmax) {
                        pagehelper.goto_page(toPage);
                    } else {
                        pagehelper.goto_page(pmax);
                    }
                }
            };

            var nextButton = document.createElement('button');
            nextButton.onclick = function () {
                pagehelper.goto_next();
            };
            nextButton.textContent = '下一页';
            nextButton.style.display = p < pmax ? '' : 'none'; // 如果当前是最后一页，则不显示
            // 将元素添加到nav中
            nav.appendChild(prevButton);
            nav.appendChild(ul);
            nav.appendChild(input);
            nav.appendChild(nextButton);
        }
    };

    /**
     * >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
     *                分页组件
     * >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
     */