From 88a4ea35137d4cbd456debad1b1d3efbc2753c0e Mon Sep 17 00:00:00 2001
From: ssongliu <73214554+ssongliu@users.noreply.github.com>
Date: Mon, 18 Sep 2023 17:20:25 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=BC=93=E5=AD=98=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E5=88=86=E9=A1=B5=E6=9D=A1=E6=95=B0=20(#2337)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Refs #2159 #1765
---
 frontend/src/components/backup/index.vue               |  1 +
 frontend/src/components/complex-table/index.vue        | 10 +++++++++-
 frontend/src/components/upload/index.vue               |  1 +
 frontend/src/views/app-store/apps/index.vue            |  1 +
 frontend/src/views/app-store/installed/index.vue       |  1 +
 frontend/src/views/container/compose/detail/index.vue  |  1 +
 frontend/src/views/container/compose/index.vue         |  1 +
 frontend/src/views/container/container/index.vue       |  1 +
 frontend/src/views/container/image/index.vue           |  1 +
 frontend/src/views/container/network/index.vue         |  1 +
 frontend/src/views/container/repo/index.vue            |  1 +
 frontend/src/views/container/template/index.vue        |  1 +
 frontend/src/views/container/volume/index.vue          |  1 +
 frontend/src/views/cronjob/index.vue                   |  1 +
 frontend/src/views/cronjob/record/index.vue            |  7 +++++++
 frontend/src/views/database/mysql/index.vue            |  1 +
 frontend/src/views/database/mysql/remote/index.vue     |  1 +
 .../views/database/redis/setting/persistence/index.vue |  1 +
 frontend/src/views/host/file-management/index.vue      |  1 +
 frontend/src/views/host/firewall/ip/index.vue          |  1 +
 frontend/src/views/host/firewall/port/index.vue        |  1 +
 frontend/src/views/host/ssh/log/log.vue                |  3 ++-
 frontend/src/views/host/terminal/command/index.vue     |  1 +
 frontend/src/views/host/terminal/host/index.vue        |  1 +
 frontend/src/views/log/login/index.vue                 |  1 +
 frontend/src/views/log/operation/index.vue             |  1 +
 frontend/src/views/setting/snapshot/index.vue          |  1 +
 frontend/src/views/website/runtime/index.vue           |  1 +
 frontend/src/views/website/ssl/acme-account/index.vue  |  1 +
 frontend/src/views/website/ssl/dns-account/index.vue   |  1 +
 frontend/src/views/website/ssl/index.vue               |  1 +
 frontend/src/views/website/website/index.vue           |  1 +
 32 files changed, 47 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/backup/index.vue b/frontend/src/components/backup/index.vue
index 787a01b5b..846aa8d35 100644
--- a/frontend/src/components/backup/index.vue
+++ b/frontend/src/components/backup/index.vue
@@ -63,6 +63,7 @@ const loading = ref();
 
 const data = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'backup-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/components/complex-table/index.vue b/frontend/src/components/complex-table/index.vue
index 83687a816..1d2a20f5c 100644
--- a/frontend/src/components/complex-table/index.vue
+++ b/frontend/src/components/complex-table/index.vue
@@ -32,7 +32,7 @@
     </div>
 </template>
 <script setup lang="ts">
-import { ref, computed } from 'vue';
+import { ref, computed, onMounted } from 'vue';
 import { GlobalStore } from '@/store';
 
 defineOptions({ name: 'ComplexTable' });
@@ -60,6 +60,7 @@ function currentChange() {
 
 function sizeChange() {
     props.paginationConfig.currentPage = 1;
+    localStorage.setItem(props.paginationConfig.cacheSizeKey, props.paginationConfig.pageSize);
     emit('search');
 }
 
@@ -78,6 +79,13 @@ defineExpose({
     clearSelects,
     sort,
 });
+
+onMounted(() => {
+    let itemSize = Number(localStorage.getItem(props.paginationConfig.cacheSizeKey));
+    if (itemSize) {
+        props.paginationConfig.pageSize = itemSize;
+    }
+});
 </script>
 
 <style lang="scss">
diff --git a/frontend/src/components/upload/index.vue b/frontend/src/components/upload/index.vue
index eb46f66f3..8913f594c 100644
--- a/frontend/src/components/upload/index.vue
+++ b/frontend/src/components/upload/index.vue
@@ -100,6 +100,7 @@ const baseDir = ref();
 const data = ref();
 const title = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'upload-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/app-store/apps/index.vue b/frontend/src/views/app-store/apps/index.vue
index 45a8fe324..18a9513ff 100644
--- a/frontend/src/views/app-store/apps/index.vue
+++ b/frontend/src/views/app-store/apps/index.vue
@@ -155,6 +155,7 @@ const mobile = computed(() => {
 const language = useI18n().locale.value;
 
 const paginationConfig = reactive({
+    cacheSizeKey: 'app-page-size',
     currentPage: 1,
     pageSize: 60,
     total: 0,
diff --git a/frontend/src/views/app-store/installed/index.vue b/frontend/src/views/app-store/installed/index.vue
index f9e39a980..2d8144717 100644
--- a/frontend/src/views/app-store/installed/index.vue
+++ b/frontend/src/views/app-store/installed/index.vue
@@ -295,6 +295,7 @@ const loading = ref(false);
 const syncLoading = ref(false);
 let timer: NodeJS.Timer | null = null;
 const paginationConfig = reactive({
+    cacheSizeKey: 'app-installed-page-size',
     currentPage: 1,
     pageSize: 20,
     total: 0,
diff --git a/frontend/src/views/container/compose/detail/index.vue b/frontend/src/views/container/compose/detail/index.vue
index 8a8a70f4d..c0aad5217 100644
--- a/frontend/src/views/container/compose/detail/index.vue
+++ b/frontend/src/views/container/compose/detail/index.vue
@@ -154,6 +154,7 @@ const acceptParams = (props: DialogProps): void => {
 const data = ref();
 const selects = ref<any>([]);
 const paginationConfig = reactive({
+    cacheSizeKey: 'container-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/container/compose/index.vue b/frontend/src/views/container/compose/index.vue
index 46b119ba6..d499517d1 100644
--- a/frontend/src/views/container/compose/index.vue
+++ b/frontend/src/views/container/compose/index.vue
@@ -112,6 +112,7 @@ const isOnDetail = ref(false);
 const baseDir = ref();
 
 const paginationConfig = reactive({
+    cacheSizeKey: 'container-compose-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/container/container/index.vue b/frontend/src/views/container/container/index.vue
index 19465bca0..216f0bbc1 100644
--- a/frontend/src/views/container/container/index.vue
+++ b/frontend/src/views/container/container/index.vue
@@ -220,6 +220,7 @@ const loading = ref();
 const data = ref();
 const selects = ref<any>([]);
 const paginationConfig = reactive({
+    cacheSizeKey: 'container-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/container/image/index.vue b/frontend/src/views/container/image/index.vue
index fb0c9c0b3..01820dde8 100644
--- a/frontend/src/views/container/image/index.vue
+++ b/frontend/src/views/container/image/index.vue
@@ -121,6 +121,7 @@ const loading = ref(false);
 const data = ref();
 const repos = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'container-image-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/container/network/index.vue b/frontend/src/views/container/network/index.vue
index 873f343b2..a9beaeb44 100644
--- a/frontend/src/views/container/network/index.vue
+++ b/frontend/src/views/container/network/index.vue
@@ -118,6 +118,7 @@ const codemirror = ref();
 const data = ref();
 const selects = ref<any>([]);
 const paginationConfig = reactive({
+    cacheSizeKey: 'container-network-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/container/repo/index.vue b/frontend/src/views/container/repo/index.vue
index 830ab01fd..d15b1cbe3 100644
--- a/frontend/src/views/container/repo/index.vue
+++ b/frontend/src/views/container/repo/index.vue
@@ -89,6 +89,7 @@ const loading = ref();
 const data = ref();
 const selects = ref<any>([]);
 const paginationConfig = reactive({
+    cacheSizeKey: 'image-repo-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/container/template/index.vue b/frontend/src/views/container/template/index.vue
index a5ce13603..7619b1921 100644
--- a/frontend/src/views/container/template/index.vue
+++ b/frontend/src/views/container/template/index.vue
@@ -80,6 +80,7 @@ const data = ref();
 const selects = ref<any>([]);
 
 const paginationConfig = reactive({
+    cacheSizeKey: 'compose-template-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/container/volume/index.vue b/frontend/src/views/container/volume/index.vue
index 0b32e237e..e89582ee4 100644
--- a/frontend/src/views/container/volume/index.vue
+++ b/frontend/src/views/container/volume/index.vue
@@ -120,6 +120,7 @@ const codemirror = ref();
 const data = ref();
 const selects = ref<any>([]);
 const paginationConfig = reactive({
+    cacheSizeKey: 'container-volume-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/cronjob/index.vue b/frontend/src/views/cronjob/index.vue
index c4485ebac..bc72024b3 100644
--- a/frontend/src/views/cronjob/index.vue
+++ b/frontend/src/views/cronjob/index.vue
@@ -183,6 +183,7 @@ const isRecordShow = ref();
 
 const data = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'cronjob-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/cronjob/record/index.vue b/frontend/src/views/cronjob/record/index.vue
index 130000d8d..404b1e1b6 100644
--- a/frontend/src/views/cronjob/record/index.vue
+++ b/frontend/src/views/cronjob/record/index.vue
@@ -412,6 +412,11 @@ const delLoading = ref();
 const cleanData = ref();
 
 const acceptParams = async (params: DialogProps): Promise<void> => {
+    let itemSize = Number(localStorage.getItem(searchInfo.cacheSizeKey));
+    if (itemSize) {
+        searchInfo.pageSize = itemSize;
+    }
+
     recordShow.value = true;
     dialogData.value = params;
     if (dialogData.value.rowData.type === 'database') {
@@ -442,6 +447,7 @@ const acceptParams = async (params: DialogProps): Promise<void> => {
 
 const handleSizeChange = (val: number) => {
     searchInfo.pageSize = val;
+    localStorage.setItem(searchInfo.cacheSizeKey, val + '');
     search();
 };
 const handleCurrentChange = (val: number) => {
@@ -509,6 +515,7 @@ const timeRangeLoad = ref<[Date, Date]>([
     new Date(new Date().setHours(23, 59, 59, 999)),
 ]);
 const searchInfo = reactive({
+    cacheSizeKey: 'cronjob-record-page-size',
     page: 1,
     pageSize: 8,
     recordTotal: 0,
diff --git a/frontend/src/views/database/mysql/index.vue b/frontend/src/views/database/mysql/index.vue
index 7ce9e8964..a925d7bed 100644
--- a/frontend/src/views/database/mysql/index.vue
+++ b/frontend/src/views/database/mysql/index.vue
@@ -267,6 +267,7 @@ const dialogPortJumpRef = ref();
 
 const data = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'mysql-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/database/mysql/remote/index.vue b/frontend/src/views/database/mysql/remote/index.vue
index 92fbe029a..35a36c071 100644
--- a/frontend/src/views/database/mysql/remote/index.vue
+++ b/frontend/src/views/database/mysql/remote/index.vue
@@ -106,6 +106,7 @@ const dialogRef = ref();
 
 const data = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'mysql-remote-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/database/redis/setting/persistence/index.vue b/frontend/src/views/database/redis/setting/persistence/index.vue
index 8b6802646..636049c63 100644
--- a/frontend/src/views/database/redis/setting/persistence/index.vue
+++ b/frontend/src/views/database/redis/setting/persistence/index.vue
@@ -158,6 +158,7 @@ const selects = ref<any>([]);
 const currentRow = ref();
 const confirmDialogRef = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'redis-backup-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/host/file-management/index.vue b/frontend/src/views/host/file-management/index.vue
index 58f8ee955..04dd6dd16 100644
--- a/frontend/src/views/host/file-management/index.vue
+++ b/frontend/src/views/host/file-management/index.vue
@@ -276,6 +276,7 @@ const deleteRef = ref();
 const { searchableStatus, searchablePath, searchableInputRef, searchableInputBlur } = useSearchable(paths);
 
 const paginationConfig = reactive({
+    cacheSizeKey: 'file-page-size',
     currentPage: 1,
     pageSize: 100,
     total: 0,
diff --git a/frontend/src/views/host/firewall/ip/index.vue b/frontend/src/views/host/firewall/ip/index.vue
index 64320a9e6..930e17d5b 100644
--- a/frontend/src/views/host/firewall/ip/index.vue
+++ b/frontend/src/views/host/firewall/ip/index.vue
@@ -155,6 +155,7 @@ const fireStatuRef = ref();
 
 const data = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'firewall-ip-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/host/firewall/port/index.vue b/frontend/src/views/host/firewall/port/index.vue
index 106d98e0a..f142e4913 100644
--- a/frontend/src/views/host/firewall/port/index.vue
+++ b/frontend/src/views/host/firewall/port/index.vue
@@ -194,6 +194,7 @@ const fireStatuRef = ref();
 
 const data = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'firewall-port-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/host/ssh/log/log.vue b/frontend/src/views/host/ssh/log/log.vue
index 649382305..c80345d05 100644
--- a/frontend/src/views/host/ssh/log/log.vue
+++ b/frontend/src/views/host/ssh/log/log.vue
@@ -93,6 +93,7 @@ import i18n from '@/lang';
 const loading = ref();
 const data = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'ssh-log-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
@@ -118,7 +119,7 @@ function select2address(): string {
 const onDeny = async () => {
     let address = select2address();
     if (!address) return;
-    await operateIPRule({ operation: 'add', address: address, strategy: 'drop' }).then(() => {
+    await operateIPRule({ operation: 'add', address: address, strategy: 'drop', description: '' }).then(() => {
         MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
         search();
     });
diff --git a/frontend/src/views/host/terminal/command/index.vue b/frontend/src/views/host/terminal/command/index.vue
index 60eae23d9..3458f4aed 100644
--- a/frontend/src/views/host/terminal/command/index.vue
+++ b/frontend/src/views/host/terminal/command/index.vue
@@ -90,6 +90,7 @@ const loading = ref();
 const data = ref();
 const selects = ref<any>([]);
 const paginationConfig = reactive({
+    cacheSizeKey: 'terminal-command-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/host/terminal/host/index.vue b/frontend/src/views/host/terminal/host/index.vue
index 3563605a5..6f2f9a843 100644
--- a/frontend/src/views/host/terminal/host/index.vue
+++ b/frontend/src/views/host/terminal/host/index.vue
@@ -93,6 +93,7 @@ const data = ref();
 const groupList = ref();
 const selects = ref<any>([]);
 const paginationConfig = reactive({
+    cacheSizeKey: 'terminal-host-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/log/login/index.vue b/frontend/src/views/log/login/index.vue
index 007c3a8aa..d2b786b48 100644
--- a/frontend/src/views/log/login/index.vue
+++ b/frontend/src/views/log/login/index.vue
@@ -92,6 +92,7 @@ const loading = ref();
 const data = ref();
 const confirmDialogRef = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'login-log-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/log/operation/index.vue b/frontend/src/views/log/operation/index.vue
index 691bf6165..640c7bb77 100644
--- a/frontend/src/views/log/operation/index.vue
+++ b/frontend/src/views/log/operation/index.vue
@@ -122,6 +122,7 @@ const loading = ref();
 const data = ref();
 const confirmDialogRef = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'operation-log-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/setting/snapshot/index.vue b/frontend/src/views/setting/snapshot/index.vue
index 655131785..c40e7a701 100644
--- a/frontend/src/views/setting/snapshot/index.vue
+++ b/frontend/src/views/setting/snapshot/index.vue
@@ -164,6 +164,7 @@ const loading = ref(false);
 const data = ref();
 const selects = ref<any>([]);
 const paginationConfig = reactive({
+    cacheSizeKey: 'snapshot-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/website/runtime/index.vue b/frontend/src/views/website/runtime/index.vue
index d6926ecbc..980b4cdeb 100644
--- a/frontend/src/views/website/runtime/index.vue
+++ b/frontend/src/views/website/runtime/index.vue
@@ -80,6 +80,7 @@ import i18n from '@/lang';
 import { useDeleteData } from '@/hooks/use-delete-data';
 
 const paginationConfig = reactive({
+    cacheSizeKey: 'runtime-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/website/ssl/acme-account/index.vue b/frontend/src/views/website/ssl/acme-account/index.vue
index 687daebeb..b4fcfb076 100644
--- a/frontend/src/views/website/ssl/acme-account/index.vue
+++ b/frontend/src/views/website/ssl/acme-account/index.vue
@@ -35,6 +35,7 @@ let loading = ref(false);
 let data = ref();
 let createRef = ref();
 const paginationConfig = reactive({
+    cacheSizeKey: 'acme-account-page-size',
     currentPage: 1,
     pageSize: 20,
     total: 0,
diff --git a/frontend/src/views/website/ssl/dns-account/index.vue b/frontend/src/views/website/ssl/dns-account/index.vue
index a5ccff875..b47ab6785 100644
--- a/frontend/src/views/website/ssl/dns-account/index.vue
+++ b/frontend/src/views/website/ssl/dns-account/index.vue
@@ -38,6 +38,7 @@ import i18n from '@/lang';
 import { useDeleteData } from '@/hooks/use-delete-data';
 
 const paginationConfig = reactive({
+    cacheSizeKey: 'dns-account-page-size',
     currentPage: 1,
     pageSize: 20,
     total: 0,
diff --git a/frontend/src/views/website/ssl/index.vue b/frontend/src/views/website/ssl/index.vue
index 9a816234d..4acf9bb90 100644
--- a/frontend/src/views/website/ssl/index.vue
+++ b/frontend/src/views/website/ssl/index.vue
@@ -100,6 +100,7 @@ import { GlobalStore } from '@/store';
 const globalStore = GlobalStore();
 
 const paginationConfig = reactive({
+    cacheSizeKey: 'ssl-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,
diff --git a/frontend/src/views/website/website/index.vue b/frontend/src/views/website/website/index.vue
index c47032610..ecb329b22 100644
--- a/frontend/src/views/website/website/index.vue
+++ b/frontend/src/views/website/website/index.vue
@@ -246,6 +246,7 @@ let dateRefs: Map<number, any> = new Map();
 let groups = ref<Group.GroupInfo[]>([]);
 
 const paginationConfig = reactive({
+    cacheSizeKey: 'website-page-size',
     currentPage: 1,
     pageSize: 10,
     total: 0,