1

server_admin/src/views/DatasetDetail.vue

@@ -45,7 +45,10 @@ const detail = ref(null) // 工作台数据：images[{filename,url,width,height,
 const imageMeta = ref({}) // filename -> {id, source, cleanExcluded}（来自 /datasets/images，行内展示用）
 const loading = ref(false)
 const page = ref(1)
-const pageSize = 18
+// 每页条数可选可改（分页器 sizes 选择，仅 10 的倍数，localStorage 持久化；默认 20）
+const pageSizeOptions = [10, 20, 30, 50, 100]
+const savedSize = Number(localStorage.getItem('dsImagePageSize'))
+const pageSize = ref(pageSizeOptions.includes(savedSize) ? savedSize : 20)
 // 列表 tab：未标注(默认,待处理优先) | 已标注 | 已清洗（clean_excluded=1，数据清洗排除，可恢复）——
 // 卡片上不再叠「已标注/未标注」角标，分类由 tab 表达（2026-09-02）
 const listTab = ref('unlabeled')
@@ -63,8 +66,8 @@ const visibleImages = computed(() => {
   })
 })
 const pagedImages = computed(() => {
-  const start = (page.value - 1) * pageSize
-  return visibleImages.value.slice(start, start + pageSize).map((item, i) => ({ item, gi: start + i }))
+  const start = (page.value - 1) * pageSize.value
+  return visibleImages.value.slice(start, start + pageSize.value).map((item, i) => ({ item, gi: start + i }))
 })
 const emptyTip = computed(() => {
   if (!tabCounts.unlabeled && !tabCounts.labeled && !tabCounts.cleaned) return '暂无图片，请上传或 AI 生成'
@@ -238,14 +241,19 @@ watch(listTab, () => {
   page.value = 1
   selected.value = []
 })
-// 当前 tab 列表缩水（删除/标注状态变更后重载）导致页码越界时回钳
+// 当前 tab 列表缩水（删除/标注状态变更后重载）或每页条数调小导致页码越界时回钳
 watch(
   () => visibleImages.value.length,
   () => {
-    const max = Math.max(1, Math.ceil(visibleImages.value.length / pageSize))
+    const max = Math.max(1, Math.ceil(visibleImages.value.length / pageSize.value))
     if (page.value > max) page.value = max
   },
 )
+watch(pageSize, (v) => {
+  localStorage.setItem('dsImagePageSize', String(v))
+  const max = Math.max(1, Math.ceil(visibleImages.value.length / v))
+  if (page.value > max) page.value = max
+})
 // 单选框：受控模式（el-checkbox 单独用 v-model 绑数组会在勾选时把数组替换成布尔值，故手动维护）
 function toggleOne(filename, checked) {
   const s = selected.value
@@ -571,7 +579,7 @@ async function switchEdit(idx) {
     }
   }
   editIndex.value = idx
-  page.value = Math.floor(idx / pageSize) + 1
+  page.value = Math.floor(idx / pageSize.value) + 1
   nextTick(resetEditor)
 }
 
@@ -1040,9 +1048,10 @@ onBeforeUnmount(() => {
         <div class="pager">
           <el-pagination
             v-model:current-page="page"
-            :page-size="pageSize"
+            v-model:page-size="pageSize"
+            :page-sizes="pageSizeOptions"
             :total="visibleImages.length"
-            layout="prev, pager, next, total"
+            layout="total, sizes, prev, pager, next"
             background
           />
         </div>