feat(admin): 公共管理列表添加分页

后端 listForAdmin 支持 page/pageSize 分页查询，控制器接收分页参数并校验边界，前端 Contents 页面添加 el-pagination 组件并同步分页状态。

🤖 Generated with [Qoder][https://qoder.com]

apps/admin/src/views/Contents.vue

@@ -130,6 +130,9 @@ const filterStatus = ref<ContentStatus | ''>('');
 const loading = ref(false);
 const saving = ref(false);
 const items = ref<ContentItem[]>([]);
+const total = ref(0);
+const page = ref(1);
+const pageSize = ref(10);
 const tableRef = ref<TableInstance>();
 const selectedRows = ref<ContentItem[]>([]);
 
@@ -206,9 +209,12 @@ async function load() {
       params: {
         type: activeType.value,
         status: filterStatus.value || undefined,
+        page: page.value,
+        pageSize: pageSize.value,
       },
     });
-    items.value = data.data ?? [];
+    items.value = data.data.items ?? [];
+    total.value = data.data.total ?? 0;
     selectedRows.value = [];
     tableRef.value?.clearSelection();
   } catch (e: unknown) {
@@ -219,7 +225,19 @@ async function load() {
   }
 }
 
+function onPageChange(p: number) {
+  page.value = p;
+  load();
+}
+
+function onSizeChange(size: number) {
+  pageSize.value = size;
+  page.value = 1;
+  load();
+}
+
 watch([activeType, filterStatus], () => {
+  page.value = 1;
   selectedRows.value = [];
   tableRef.value?.clearSelection();
   void load();
@@ -290,7 +308,7 @@ function batchDelete() {
 
 function resetForm() {
   form.value = {
-    sortOrder: items.value.length + 1,
+    sortOrder: total.value + 1,
     status: 'DRAFT',
     linkType: '',
     linkTarget: '',
@@ -562,6 +580,18 @@ void load();
           </el-table-column>
         </el-table>
       </div>
+      <div class="pager">
+        <el-pagination
+          v-model:current-page="page"
+          v-model:page-size="pageSize"
+          :total="total"
+          :page-sizes="[10, 20, 50, 100]"
+          layout="total, sizes, prev, pager, next"
+          background
+          @current-change="onPageChange"
+          @size-change="onSizeChange"
+        />
+      </div>
     </el-card>
 
     <el-dialog v-model="dialogVisible" :title="dialogTitle" width="640px" destroy-on-close>