feat: 应用列表顶部增加页码切换 (#2457)

Refs https://github.com/1Panel-dev/1Panel/issues/2293

frontend/src/components/layout-content/index.vue

@@ -42,7 +42,7 @@
                                 <el-divider direction="vertical" />
                                 <slot name="buttons"></slot>
                             </span>
-                            <span style="float: right">
+                            <span class="float-right">
                                 <slot v-if="slots.rightButton" name="rightButton"></slot>
                             </span>
                         </span>

frontend/src/views/app-store/apps/index.vue

@@ -64,11 +64,20 @@
             </el-row>
         </template>
         <template #rightButton>
-            <el-badge is-dot class="item" :hidden="!canUpdate">
-                <el-button @click="sync" type="primary" link :plain="true" :disabled="syncing">
-                    {{ $t('app.syncAppList') }}
-                </el-button>
-            </el-badge>
+            <div class="flex justify-end">
+                <fu-table-pagination
+                    v-model:current-page="paginationConfig.currentPage"
+                    v-model:page-size="paginationConfig.pageSize"
+                    v-bind="paginationConfig"
+                    @change="search(req)"
+                    :layout="mobile ? ' prev, pager, next' : ' prev, pager, next'"
+                />
+                <el-badge is-dot :hidden="!canUpdate" class="ml-5">
+                    <el-button @click="sync" type="primary" plain :disabled="syncing">
+                        {{ $t('app.syncAppList') }}
+                    </el-button>
+                </el-badge>
+            </div>
         </template>
         <template #main>
             <el-alert type="info" :title="$t('app.appHelper')" :closable="false" />