feat(需求): ①全站列表/卡片分页统一为共享 OldPagination(共N条+10/20/50/100条数可选+跳页) ②创建用户菜单权限改左右布局(后台|桌面端并排) ③修复角色筛选失效(normalizeUserPageParams 白名单丢 role 字段)

admin-frontend-vue/src/pages/asin/QueryAsinPage.vue

@@ -19,14 +19,14 @@ const loading = ref(false)
 const rows = ref<QueryAsinItem[]>([])
 const total = ref(0)
 const page = ref(1)
-const pageSize = 15
+const pageSize = ref(15)
 const groups = ref<ShopGroupOption[]>([])
 const filter = reactive<QueryAsinFilterState>(createQueryAsinFilterState())
 const jumpPage = ref('')
-const totalPages = computed(() => Math.max(1, Math.ceil(total.value / pageSize)))
+const totalPages = computed(() => Math.max(1, Math.ceil(total.value / pageSize.value)))
 
 /** 纵向展示行：分组/店铺/操作 按 rowspan 合并，逐国一行（对齐 admin.js renderQueryAsinRows）。 */
-const displayRows = computed(() => queryAsinDisplayRows(rows.value, (page.value - 1) * pageSize + 1))
+const displayRows = computed(() => queryAsinDisplayRows(rows.value, (page.value - 1) * pageSize.value + 1))
 
 function asinOf(row: QueryAsinItem, country: string): string {
   const map: Record<string, string> = { DE: row.asinDe, UK: row.asinUk, FR: row.asinFr, IT: row.asinIt, ES: row.asinEs }
@@ -268,7 +268,7 @@ async function load() {
   try {
     const result = await fetchQueryAsinList({
       page: page.value,
-      pageSize,
+      pageSize: pageSize.value,
       groupId: filter.groupId,
       shopName: filter.shopName.trim() || undefined,
       asin: filter.asin.trim() || undefined,
@@ -295,6 +295,13 @@ function changePage(next: number) {
   void load()
 }
 
+
+function changeSize(size: number) {
+  pageSize.value = size
+  page.value = 1
+  load()
+}
+
 function goJump() {
   const n = Number.parseInt(jumpPage.value, 10)
   if (Number.isNaN(n)) {
@@ -391,19 +398,7 @@ onMounted(() => {
           </tbody>
         </table>
       </div>
-
-      <div class="pagination">
-        <span class="page-total">共 {{ total }} 条</span>
-        <button type="button" :disabled="page <= 1" @click="changePage(page - 1)">上一页</button>
-        <span class="page-cur">第 {{ page }} / {{ totalPages }} 页</span>
-        <button type="button" :disabled="page >= totalPages" @click="changePage(page + 1)">下一页</button>
-        <span class="page-jump">
-          跳至
-          <input v-model="jumpPage" type="text" inputmode="numeric" @keyup.enter="goJump" />
-          页
-          <button type="button" @click="goJump">跳转</button>
-        </span>
-      </div>
+      <OldPagination :total="total" :page="page" :page-size="pageSize" @change="changePage" @size-change="changeSize" />
     </section>
 
     <el-dialog v-model="createVisible" title="新增查询 ASIN" width="560px" :close-on-click-modal="false">