+
@@ -217,6 +218,7 @@
const statusEl = document.getElementById('status')
const keywordInput = document.getElementById('keywordInput')
+ const categorySelect = document.getElementById('categorySelect')
const detailInput = document.getElementById('detailInput')
const tableBody = document.getElementById('tableBody')
const editorModal = document.getElementById('editorModal')
@@ -405,6 +407,44 @@
.replace(/'/g, ''')
}
+ function extractCategory(dictName) {
+ var name = String(dictName || '')
+ if (name.length >= 2) {
+ return name.substring(0, 2)
+ }
+ return ''
+ }
+
+ function populateCategorySelect(list) {
+ var categories = {}
+ for (var i = 0; i < list.length; i++) {
+ var cat = extractCategory(list[i].dict_name)
+ if (cat) {
+ categories[cat] = true
+ }
+ }
+ var sorted = Object.keys(categories).sort()
+ var current = categorySelect.value
+ categorySelect.innerHTML = ''
+ for (var j = 0; j < sorted.length; j++) {
+ var opt = document.createElement('option')
+ opt.value = sorted[j]
+ opt.textContent = sorted[j]
+ categorySelect.appendChild(opt)
+ }
+ if (current && categories[current]) {
+ categorySelect.value = current
+ }
+ }
+
+ function filterByCategory(list) {
+ var selected = categorySelect.value
+ if (!selected) return list
+ return list.filter(function (item) {
+ return extractCategory(item.dict_name) === selected
+ })
+ }
+
function randomEnumSeed() {
const first = enumChars[Math.floor(Math.random() * enumChars.length)]
const second = enumChars[Math.floor(Math.random() * enumChars.length)]
@@ -775,7 +815,8 @@
const data = await request(API_BASE + '/dictionary/list', { keyword: keywordInput.value.trim() })
state.list = data.items || []
state.expandedPreviewKey = ''
- renderTable(state.list)
+ populateCategorySelect(state.list)
+ renderTable(filterByCategory(state.list))
setStatus('查询成功，共 ' + state.list.length + ' 条。', 'success')
} catch (err) {
setStatus(err.message || '查询失败', 'error')
@@ -797,7 +838,8 @@
const data = await request(API_BASE + '/dictionary/detail', { dict_name: dictName })
state.list = [data]
state.expandedPreviewKey = ''
- renderTable(state.list)
+ populateCategorySelect(state.list)
+ renderTable(filterByCategory(state.list))
setStatus('查询详情成功。', 'success')
} catch (err) {
setStatus(err.message || '查询失败', 'error')
@@ -1108,9 +1150,13 @@
})
document.getElementById('listBtn').addEventListener('click', loadList)
+ categorySelect.addEventListener('change', function () {
+ renderTable(filterByCategory(state.list))
+ })
document.getElementById('detailBtn').addEventListener('click', loadDetail)
document.getElementById('resetBtn').addEventListener('click', function () {
keywordInput.value = ''
+ categorySelect.value = ''
detailInput.value = ''
state.list = []
renderTable([])
diff --git a/pocket-base/bai_web_pb_hooks/views/document-manage.html b/pocket-base/bai_web_pb_hooks/views/document-manage.html
index 0fff527..471d9a3 100644
--- a/pocket-base/bai_web_pb_hooks/views/document-manage.html
+++ b/pocket-base/bai_web_pb_hooks/views/document-manage.html
@@ -84,6 +84,16 @@
.loading-card { min-width: min(92vw, 360px); padding: 24px 22px; border-radius: 20px; background: rgba(255,255,255,0.98); box-shadow: 0 28px 70px rgba(15, 23, 42, 0.22); border: 1px solid #dbe3f0; text-align: center; }
.loading-spinner { width: 44px; height: 44px; margin: 0 auto 14px; border-radius: 999px; border: 4px solid #dbeafe; border-top-color: #2563eb; animation: docSpin 0.9s linear infinite; }
.loading-text { color: #0f172a; font-size: 15px; font-weight: 700; }
+ .pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; }
+ .pagination-info { color: #475569; font-size: 14px; }
+ .pagination-actions { display: flex; flex-wrap: wrap; gap: 8px; }
+ .pagination-size { display: inline-flex; align-items: center; gap: 8px; color: #475569; font-size: 14px; }
+ .pagination-btn { min-width: 42px; padding: 8px 12px; border-radius: 10px; border: 1px solid #dbe3f0; background: #fff; color: #334155; cursor: pointer; font-weight: 600; }
+ .pagination-select { min-width: 88px; width: auto; padding: 8px 12px; border-radius: 10px; border: 1px solid #dbe3f0; background: #fff; color: #334155; font-size: 14px; }
+ .pagination-btn.active { background: #2563eb; border-color: #2563eb; color: #fff; }
+ .pagination-btn:disabled { cursor: not-allowed; color: #94a3b8; background: #f8fafc; }
+ .pagination-btn:not(:disabled):hover { border-color: #94a3b8; background: #f8fafc; }
+ .pagination-btn.active:hover { background: #2563eb; border-color: #2563eb; }
html[data-theme="dark"] .editor-banner { background: rgba(30, 41, 59, 0.86); color: #bfdbfe; }
html[data-theme="dark"] .file-box { background: rgba(15, 23, 42, 0.92); border-color: rgba(148, 163, 184, 0.22); box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.08); }
html[data-theme="dark"] .choice-switch { background: rgba(15, 23, 42, 0.86); border-color: rgba(148, 163, 184, 0.26); }
@@ -97,6 +107,15 @@
html[data-theme="dark"] .file-preview,
html[data-theme="dark"] .file-card-icon { background: rgba(2, 6, 23, 0.9); border-color: rgba(148, 163, 184, 0.24); color: #e2e8f0; }
html[data-theme="dark"] .file-card-icon:hover { background: rgba(30, 41, 59, 0.82); border-color: rgba(148, 163, 184, 0.4); }
+ html[data-theme="dark"] .pagination-info,
+ html[data-theme="dark"] .pagination-size { color: #cbd5e1; }
+ html[data-theme="dark"] .pagination-btn { background: rgba(15, 23, 42, 0.92); border-color: rgba(148, 163, 184, 0.24); color: #e2e8f0; box-shadow: inset 0 1px 0 rgba(255,255,255,0.04); }
+ html[data-theme="dark"] .pagination-btn:not(:disabled):hover { background: rgba(30, 41, 59, 0.96); border-color: rgba(96, 165, 250, 0.5); color: #f8fafc; }
+ html[data-theme="dark"] .pagination-btn.active,
+ html[data-theme="dark"] .pagination-btn.active:hover { background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%); border-color: #3b82f6; color: #eff6ff; box-shadow: 0 10px 24px rgba(37, 99, 235, 0.28); }
+ html[data-theme="dark"] .pagination-btn:disabled { background: rgba(15, 23, 42, 0.58); border-color: rgba(71, 85, 105, 0.45); color: #64748b; box-shadow: none; }
+ html[data-theme="dark"] .pagination-select { background: rgba(15, 23, 42, 0.92); border-color: rgba(148, 163, 184, 0.24); color: #f8fafc; box-shadow: inset 0 1px 0 rgba(255,255,255,0.04); }
+ html[data-theme="dark"] .pagination-select:focus { outline: none; border-color: #60a5fa; box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.18); }
@keyframes docSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@media (max-width: 960px) {
.grid, .file-group { grid-template-columns: 1fr; }
@@ -295,6 +314,7 @@
+
@@ -342,6 +362,7 @@
const hotelTypeTagsEl = document.getElementById('hotelTypeTags')
const listTitleKeywordEl = document.getElementById('listTitleKeyword')
const listTypeFilterEl = document.getElementById('listTypeFilter')
+ const listPaginationEl = document.getElementById('listPagination')
const imageViewerEl = document.getElementById('imageViewer')
const imageViewerImgEl = document.getElementById('imageViewerImg')
const loadingMaskEl = document.getElementById('loadingMask')
@@ -388,6 +409,7 @@
const state = {
list: [],
fullList: [],
+ filteredList: [],
mode: 'idle',
editingId: '',
editingSource: null,
@@ -413,6 +435,12 @@
titleKeyword: '',
type: '',
},
+ pagination: {
+ page: 1,
+ pageSize: 10,
+ total: 0,
+ totalPages: 1,
+ },
}
function setStatus(message, type) {
@@ -1005,6 +1033,102 @@
})
}
+ function clampPage(page, totalPages) {
+ const normalizedPage = Number(page) || 1
+ const normalizedTotalPages = Math.max(1, Number(totalPages) || 1)
+ return Math.min(Math.max(1, normalizedPage), normalizedTotalPages)
+ }
+
+ function getVisiblePageNumbers(page, totalPages) {
+ const result = []
+ const start = Math.max(1, page - 2)
+ const end = Math.min(totalPages, start + 4)
+ const adjustedStart = Math.max(1, end - 4)
+
+ for (let current = adjustedStart; current <= end; current += 1) {
+ result.push(current)
+ }
+
+ return result
+ }
+
+ function renderPageSizeSelector() {
+ const options = [10, 20, 50, 100, 500]
+ return ''
+ }
+
+ function renderPagination() {
+ if (!listPaginationEl) {
+ return
+ }
+
+ const total = Number(state.pagination.total || 0)
+ const page = Number(state.pagination.page || 1)
+ const totalPages = Math.max(1, Number(state.pagination.totalPages || 1))
+ const sizeSelector = renderPageSizeSelector()
+
+ if (!total) {
+ listPaginationEl.innerHTML = ''
+ + ''
+ return
+ }
+
+ const visiblePageNumbers = getVisiblePageNumbers(page, totalPages)
+ const startIndex = (page - 1) * state.pagination.pageSize + 1
+ const endIndex = Math.min(total, page * state.pagination.pageSize)
+ const buttons = []
+
+ buttons.push('')
+
+ if (visiblePageNumbers[0] > 1) {
+ buttons.push('')
+ if (visiblePageNumbers[0] > 2) {
+ buttons.push('')
+ }
+ }
+
+ for (let i = 0; i < visiblePageNumbers.length; i += 1) {
+ const current = visiblePageNumbers[i]
+ buttons.push('')
+ }
+
+ if (visiblePageNumbers.length && visiblePageNumbers[visiblePageNumbers.length - 1] < totalPages) {
+ if (visiblePageNumbers[visiblePageNumbers.length - 1] < totalPages - 1) {
+ buttons.push('')
+ }
+ buttons.push('')
+ }
+
+ buttons.push('')
+
+ listPaginationEl.innerHTML = ''
+ + ''
+ }
+
+ function updateDocumentListView() {
+ const filteredList = applyListFiltersToList(state.fullList)
+ const pageSize = Math.max(1, Number(state.pagination.pageSize || 10))
+ const total = filteredList.length
+ const totalPages = Math.max(1, Math.ceil(total / pageSize))
+ const currentPage = clampPage(state.pagination.page, totalPages)
+ const startIndex = (currentPage - 1) * pageSize
+
+ state.filteredList = filteredList
+ state.pagination.page = currentPage
+ state.pagination.total = total
+ state.pagination.totalPages = totalPages
+ state.list = filteredList.slice(startIndex, startIndex + pageSize)
+
+ renderTable()
+ renderPagination()
+ }
+
function renderTable() {
if (!state.list.length) {
tableBody.innerHTML = ' + ')
'
+ : '')
+ + ''
+ + '