更新v1.4版本，修复了一些已知问题

frontend/assets/css/style.css

@@ -490,8 +490,10 @@ tr:hover {
 .pagination {
     display: flex;
     justify-content: center;
-    gap: 8px;
+    align-items: center;
+    gap: 6px;
     margin-top: 20px;
+    flex-wrap: wrap;
 }
 
 .pagination a, .pagination span {
@@ -501,6 +503,16 @@ tr:hover {
     text-decoration: none;
     color: #666;
     cursor: pointer;
+    min-width: 36px;
+    text-align: center;
+    box-sizing: border-box;
+    transition: all 0.2s;
+}
+
+.pagination a:hover {
+    background: #f0f0ff;
+    border-color: #667eea;
+    color: #667eea;
 }
 
 .pagination .active {
@@ -509,6 +521,43 @@ tr:hover {
     border-color: #667eea;
 }
 
+.pagination .ellipsis {
+    border: none;
+    cursor: default;
+    padding: 6px 4px;
+    color: #999;
+    min-width: auto;
+}
+
+.pagination .page-jump {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    margin-left: 8px;
+    font-size: 13px;
+    color: #666;
+}
+
+.pagination .page-jump input {
+    width: 50px;
+    padding: 5px 8px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    text-align: center;
+    font-size: 13px;
+    outline: none;
+}
+
+.pagination .page-jump input:focus {
+    border-color: #667eea;
+    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.15);
+}
+
+.pagination .page-nav {
+    padding: 6px 10px;
+    font-size: 13px;
+}
+
 /* ========== 提示消息 ========== */
 .toast {
     position: fixed;

frontend/assets/js/common.js

@@ -205,6 +205,125 @@ function escapeHtml(str) {
     });
 }
 
+/**
+ * 智能分页渲染（最多显示7个页码 + 跳转输入框）
+ * @param {string|HTMLElement} container - 分页容器ID或DOM元素
+ * @param {number} currentPage - 当前页码
+ * @param {number} totalPages - 总页数
+ * @param {function} onPageChange - 页码变化回调函数，参数为新的页码
+ */
+function renderSmartPagination(container, currentPage, totalPages, onPageChange) {
+    if (typeof container === 'string') {
+        container = document.getElementById(container);
+    }
+    if (!container || totalPages <= 1) {
+        if (container) container.innerHTML = '';
+        return;
+    }
+
+    const MAX_VISIBLE = 7;
+    let html = '';
+
+    // 上一页按钮
+    if (currentPage > 1) {
+        html += `<a href="#" class="page-nav" data-page="${currentPage - 1}">&laquo; 上一页</a>`;
+    }
+
+    if (totalPages <= MAX_VISIBLE) {
+        // 总页数不超过最大显示数，全部显示
+        for (let i = 1; i <= totalPages; i++) {
+            if (i === currentPage) {
+                html += `<span class="active">${i}</span>`;
+            } else {
+                html += `<a href="#" data-page="${i}">${i}</a>`;
+            }
+        }
+    } else {
+        // 需要省略号
+        // 始终显示第1页
+        if (currentPage === 1) {
+            html += `<span class="active">1</span>`;
+        } else {
+            html += `<a href="#" data-page="1">1</a>`;
+        }
+
+        // 计算中间页码范围
+        let start = Math.max(2, currentPage - 2);
+        let end = Math.min(totalPages - 1, currentPage + 2);
+
+        // 调整确保中间至少有3个页码（加上首尾共5-7个）
+        if (currentPage <= 3) {
+            end = Math.min(5, totalPages - 1);
+        }
+        if (currentPage >= totalPages - 2) {
+            start = Math.max(2, totalPages - 4);
+        }
+
+        // 前省略号
+        if (start > 2) {
+            html += `<span class="ellipsis">...</span>`;
+        }
+
+        // 中间页码
+        for (let i = start; i <= end; i++) {
+            if (i === currentPage) {
+                html += `<span class="active">${i}</span>`;
+            } else {
+                html += `<a href="#" data-page="${i}">${i}</a>`;
+            }
+        }
+
+        // 后省略号
+        if (end < totalPages - 1) {
+            html += `<span class="ellipsis">...</span>`;
+        }
+
+        // 始终显示最后一页
+        if (currentPage === totalPages) {
+            html += `<span class="active">${totalPages}</span>`;
+        } else {
+            html += `<a href="#" data-page="${totalPages}">${totalPages}</a>`;
+        }
+    }
+
+    // 下一页按钮
+    if (currentPage < totalPages) {
+        html += `<a href="#" class="page-nav" data-page="${currentPage + 1}">下一页 &raquo;</a>`;
+    }
+
+    // 页码跳转
+    html += `<span class="page-jump">跳至 <input type="number" min="1" max="${totalPages}" placeholder="页码"> / ${totalPages}页</span>`;
+
+    container.innerHTML = html;
+
+    // 绑定页码点击事件
+    container.querySelectorAll('a[data-page]').forEach(link => {
+        link.addEventListener('click', function(e) {
+            e.preventDefault();
+            const page = parseInt(this.dataset.page);
+            if (page && page !== currentPage && page >= 1 && page <= totalPages) {
+                onPageChange(page);
+            }
+        });
+    });
+
+    // 绑定跳转输入框事件
+    const jumpInput = container.querySelector('.page-jump input');
+    if (jumpInput) {
+        jumpInput.addEventListener('keydown', function(e) {
+            if (e.key === 'Enter') {
+                e.preventDefault();
+                const page = parseInt(this.value);
+                if (page && page >= 1 && page <= totalPages) {
+                    onPageChange(page);
+                } else {
+                    showToast(`请输入1-${totalPages}之间的页码`, 'warning');
+                }
+            }
+        });
+    }
+}
+
 document.addEventListener('DOMContentLoaded', () => {
     const user = getUserInfo();
     const userNameSpan = document.getElementById('userName');