chuan/Cli-Proxy-API-Management-Center
1
0
Fork 0
mirror of https://github.com/router-for-me/Cli-Proxy-API-Management-Center.git synced 2026-02-18 10:40:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(auth-files): improve pagination info and filters

Browse Source
This commit is contained in:
hkfires
2025-11-16 21:40:08 +08:00
parent bbd0a56052
commit bf40caacc3
1 changed files with 61 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

106
src/modules/auth-files.js
View File

@@ -414,67 +414,83 @@ export const authFilesModule = {
const infoEl = document.getElementById('auth-files-pagination-info'); const infoEl = document.getElementById('auth-files-pagination-info');
if (!paginationContainer || !infoEl) return; if (!paginationContainer || !infoEl) return;
const prevBtn = paginationContainer.querySelector('button[data-action=\"prev\"]');
const nextBtn = paginationContainer.querySelector('button[data-action=\"next\"]');
const pageSize = this.authFilesPagination?.pageSize || 9; const pageSize = this.authFilesPagination?.pageSize || 9;
const currentPage = this.authFilesPagination?.currentPage || 1; const totalPages = this.authFilesPagination?.totalPages || 1;
const totalPages = Math.max(1, Math.ceil(totalItems / pageSize)); const currentPage = Math.min(this.authFilesPagination?.currentPage || 1, totalPages);
const shouldShow = totalItems > pageSize;
const start = (totalItems === 0) ? 0 : (currentPage - 1) * pageSize + 1; paginationContainer.style.display = shouldShow ? 'flex' : 'none';
const end = Math.min(totalItems, currentPage * pageSize);
infoEl.textContent = totalItems === 0 const infoParams = totalItems === 0
? i18n.t('auth_files.pagination_empty') ? { current: 0, total: 0, count: 0 }
: i18n.t('auth_files.pagination_info') : { current: currentPage, total: totalPages, count: totalItems };
.replace('{start}', start) infoEl.textContent = i18n.t('auth_files.pagination_info', infoParams);
.replace('{end}', end)
.replace('{total}', totalItems);
const prevBtn = paginationContainer.querySelector('button[data-page=\"prev\"]'); if (prevBtn) {
const nextBtn = paginationContainer.querySelector('button[data-page=\"next\"]'); prevBtn.disabled = currentPage <= 1;
if (!prevBtn || !nextBtn) return; }
prevBtn.disabled = currentPage <= 1; if (nextBtn) {
nextBtn.disabled = currentPage >= totalPages; nextBtn.disabled = currentPage >= totalPages;
}
prevBtn.onclick = () => {
if (this.authFilesPagination.currentPage <= 1) return;
this.renderAuthFilesPage(currentPage - 1);
};
nextBtn.onclick = () => {
if (this.authFilesPagination.currentPage >= totalPages) return;
this.renderAuthFilesPage(currentPage + 1);
};
}, },
updateFilterButtons(existingTypes) { updateFilterButtons(existingTypes) {
const filterContainer = document.querySelector('.auth-file-filter'); const filterContainer = document.querySelector('.auth-file-filter');
if (!filterContainer) return; if (!filterContainer) return;
const existingButtons = Array.from(filterContainer.querySelectorAll('.filter-btn')); const predefinedTypes = [
const buttonMap = new Map(); { type: 'all', labelKey: 'auth_files.filter_all' },
{ type: 'qwen', labelKey: 'auth_files.filter_qwen' },
{ type: 'gemini', labelKey: 'auth_files.filter_gemini' },
{ type: 'gemini-cli', labelKey: 'auth_files.filter_gemini-cli' },
{ type: 'aistudio', labelKey: 'auth_files.filter_aistudio' },
{ type: 'claude', labelKey: 'auth_files.filter_claude' },
{ type: 'codex', labelKey: 'auth_files.filter_codex' },
{ type: 'iflow', labelKey: 'auth_files.filter_iflow' },
{ type: 'vertex', labelKey: 'auth_files.filter_vertex' },
{ type: 'empty', labelKey: 'auth_files.filter_empty' }
];
const existingButtons = filterContainer.querySelectorAll('.filter-btn');
const existingButtonTypes = new Set();
existingButtons.forEach(btn => { existingButtons.forEach(btn => {
const type = btn.dataset.type || ''; existingButtonTypes.add(btn.dataset.type);
if (type) { });
buttonMap[type] = btn;
existingButtons.forEach(btn => {
const btnType = btn.dataset.type;
if (existingTypes.has(btnType)) {
btn.style.display = 'inline-block';
const match = predefinedTypes.find(item => item.type === btnType);
if (match) {
btn.textContent = i18n.t(match.labelKey);
btn.setAttribute('data-i18n-text', match.labelKey);
}
} else {
btn.style.display = 'none';
} }
}); });
const predefinedTypeSet = new Set(predefinedTypes.map(t => t.type));
existingTypes.forEach(type => { existingTypes.forEach(type => {
const typeKey = type || 'all'; if (type !== 'all' && !predefinedTypeSet.has(type) && !existingButtonTypes.has(type)) {
const normalized = typeKey.toLowerCase(); const btn = document.createElement('button');
let btn = filterContainer.querySelector(`.filter-btn[data-type=\"${normalized}\"]`); btn.className = 'filter-btn';
btn.dataset.type = type;
if (!btn) { const match = predefinedTypes.find(item => item.type === type);
const labelKey = normalized === 'all' if (match) {
? 'auth_files.filter_all' btn.setAttribute('data-i18n-text', match.labelKey);
: `auth_files.filter_${normalized}`; btn.textContent = i18n.t(match.labelKey);
const label = i18n.t(labelKey); } else {
btn = document.createElement('button'); const dynamicKey = `auth_files.filter_${type}`;
btn.type = 'button'; btn.setAttribute('data-i18n-text', dynamicKey);
btn.className = 'btn btn-small filter-btn'; btn.textContent = this.generateDynamicTypeLabel(type);
btn.dataset.type = normalized; }
btn.setAttribute('data-i18n-text', labelKey);
btn.textContent = label; const emptyBtn = filterContainer.querySelector('[data-type=\"empty\"]');
const emptyBtn = filterContainer.querySelector('.filter-btn[data-type=\"all\"]');
if (emptyBtn) { if (emptyBtn) {
filterContainer.insertBefore(btn, emptyBtn); filterContainer.insertBefore(btn, emptyBtn);
} else { } else {