补充监查访视问题模块内容、翻页功能UI统一

frontend/src/views/Faq.vue

@@ -32,14 +32,18 @@
             :can-edit="canEdit"
             @refresh="loadFaqs"
           />
-          <el-pagination
-            class="pagination"
-            layout="prev, pager, next"
-            :page-size="pageSize"
-            :current-page="page"
-            :total="total"
-            @current-change="onPageChange"
-          />
+          <div class="pagination-wrap" v-if="total > 0">
+            <el-pagination
+              v-model:current-page="page"
+              v-model:page-size="pageSize"
+              :page-sizes="[5, 10, 20]"
+              :total="total"
+              layout="prev, pager, next, sizes, total"
+              small
+              @current-change="onPageChange"
+              @size-change="onPageSizeChange"
+            />
+          </div>
         </div>
       </el-col>
     </el-row>
@@ -68,7 +72,7 @@ const categories = ref<any[]>([]);
 const faqs = ref<any[]>([]);
 const loading = ref(false);
 const page = ref(1);
-const pageSize = 10;
+const pageSize = ref(10);
 const total = ref(0);
 const keyword = ref("");
 const onlyActive = ref(true);
@@ -96,8 +100,8 @@ const loadFaqs = async () => {
   loading.value = true;
   try {
     const params: Record<string, any> = {
-      skip: (page.value - 1) * pageSize,
-      limit: pageSize,
+      skip: (page.value - 1) * pageSize.value,
+      limit: pageSize.value,
       study_id: study.currentStudy.id,
     };
     if (activeCategory.value) params.category_id = activeCategory.value;
@@ -123,6 +127,12 @@ const onPageChange = (p: number) => {
   loadFaqs();
 };
 
+const onPageSizeChange = (size: number) => {
+  pageSize.value = size;
+  page.value = 1;
+  loadFaqs();
+};
+
 watch(activeCategory, () => {
   page.value = 1;
   loadFaqs();
@@ -161,8 +171,9 @@ onMounted(async () => {
 .spacer {
   flex: 1;
 }
-.pagination {
-  margin-top: 12px;
-  text-align: right;
+.pagination-wrap {
+  margin-top: 14px;
+  display: flex;
+  justify-content: flex-end;
 }
 </style>