Commit fcf7434e fcf7434e643b4eef3f65708c80c188e54ba4d7a0 by 沈秋雨

feat(review): 添加分页跳转和记住暗号功能

- 新增分页跳转下拉菜单,实现快速跳转任意页码
- 增加分页栏样式,调整按钮与选择框的尺寸与间距
- 在登录面板添加“记住暗号”复选框及相关样式
- 登录时读取本地存储的暗号并自动填充
- 登录成功时根据复选框状态保存或清除本地存储的暗号
- 分页按钮和跳转选择框事件联动,实现页面数据刷新更新
1 parent cbe31001
......@@ -517,6 +517,26 @@
align-items: center;
}
.page-bar {
display: flex;
align-items: center;
gap: 6px;
margin-bottom: 10px;
}
.page-bar button {
height: 30px;
padding: 0 12px;
font-size: 13px;
}
.page-bar select {
height: 30px;
font-size: 13px;
min-width: 80px;
text-align: center;
}
.review-bar button {
background: #fff;
color: var(--text);
......@@ -574,6 +594,8 @@
.login-panel input { width: 100%; box-sizing: border-box; }
.login-panel button { width: 100%; margin-top: 16px; }
.login-error { min-height: 20px; margin-top: 10px; color: #b42318; font-size: 13px; }
.login-remember { display: flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 13px; color: var(--muted); cursor: pointer; user-select: none; }
.login-remember input { width: auto; height: auto; margin: 0; cursor: pointer; }
@media (max-width: 1100px) {
main { grid-template-columns: 1fr; height: auto; }
......@@ -594,6 +616,7 @@
<input id="loginReviewer" maxlength="64" autocomplete="username" required>
<label for="loginAccessCode">暗号</label>
<input id="loginAccessCode" type="password" autocomplete="current-password" required>
<label class="login-remember"><input id="rememberAccessCode" type="checkbox"> 记住暗号</label>
<button id="loginBtn" type="submit">进入编辑</button>
<div id="loginError" class="login-error"></div>
</form>
......@@ -652,11 +675,12 @@
<span id="sampleCount" class="pill"></span>
</div>
<div class="section-body">
<div id="queryList" class="query-list"></div>
<div class="review-bar" style="margin-top:10px">
<div class="page-bar">
<button id="prevPageBtn" class="secondary">上一页</button>
<select id="pageJumpSelect"></select>
<button id="nextPageBtn" class="secondary">下一页</button>
</div>
<div id="queryList" class="query-list"></div>
</div>
</div>
</aside>
......@@ -706,6 +730,7 @@
reloadBtn: document.getElementById('reloadBtn'),
prevPageBtn: document.getElementById('prevPageBtn'),
nextPageBtn: document.getElementById('nextPageBtn'),
pageJumpSelect: document.getElementById('pageJumpSelect'),
metrics: document.getElementById('metrics'),
sampleCount: document.getElementById('sampleCount'),
......@@ -718,7 +743,8 @@
loginReviewer: document.getElementById('loginReviewer'),
loginAccessCode: document.getElementById('loginAccessCode'),
loginBtn: document.getElementById('loginBtn'),
loginError: document.getElementById('loginError')
loginError: document.getElementById('loginError'),
rememberAccessCode: document.getElementById('rememberAccessCode')
};
function newClientToken() {
......@@ -728,7 +754,9 @@
function showReviewLogin(prefillReviewer = '') {
els.loginReviewer.value = prefillReviewer;
els.loginAccessCode.value = '';
const savedCode = localStorage.getItem('l2AccessCode') || '';
els.loginAccessCode.value = savedCode;
els.rememberAccessCode.checked = Boolean(savedCode);
els.loginError.textContent = '';
els.loginOverlay.classList.remove('hidden');
window.setTimeout(() => (prefillReviewer ? els.loginAccessCode : els.loginReviewer).focus(), 0);
......@@ -748,6 +776,11 @@
state.authToken = session.session_token;
localStorage.setItem('l2ReviewerName', state.reviewer);
sessionStorage.setItem('l2ReviewAuthToken', state.authToken);
if (els.rememberAccessCode.checked) {
localStorage.setItem('l2AccessCode', accessCode);
} else {
localStorage.removeItem('l2AccessCode');
}
els.reviewerInput.value = state.reviewer;
els.loginAccessCode.value = '';
els.loginOverlay.classList.add('hidden');
......@@ -767,6 +800,11 @@
sessionStorage.setItem('l2ReviewClientToken', state.clientToken);
state.authToken = sessionStorage.getItem('l2ReviewAuthToken') || '';
els.loginReviewer.value = state.reviewer;
const savedCode = localStorage.getItem('l2AccessCode') || '';
if (savedCode) {
els.loginAccessCode.value = savedCode;
els.rememberAccessCode.checked = true;
}
if (state.reviewer && state.authToken) {
try {
......@@ -1054,6 +1092,12 @@
}
els.prevPageBtn.disabled = state.page <= 1;
els.nextPageBtn.disabled = !state.hasMore;
// 填充页码跳转下拉
const jumpOptions = [];
for (let p = 1; p <= totalPages; p++) {
jumpOptions.push(`<option value="${p}" ${p === state.page ? 'selected' : ''}>第 ${p} 页</option>`);
}
els.pageJumpSelect.innerHTML = jumpOptions.join('');
}
function selectedQueryRows() {
......@@ -1704,6 +1748,15 @@
await loadGroups();
renderAll();
});
els.pageJumpSelect.addEventListener('change', async () => {
const target = Number(els.pageJumpSelect.value);
if (!target || target === state.page) return;
state.page = target;
state.queryId = '';
state.candidateId = '';
await loadGroups();
renderAll();
});
async function bootstrap() {
await initReviewerIdentity();
......