💡 优化列表页面切换返回状态丢失问题

src/App.vue

@@ -10,7 +10,12 @@
   >
     <NavBar />
     <main>
-      <RouterView />
+      <RouterView v-slot="{ Component }">
+        <KeepAlive>
+          <component :is="Component" v-if="route.meta.keepAlive" />
+        </KeepAlive>
+        <component :is="Component" v-if="!route.meta.keepAlive" />
+      </RouterView>
     </main>
     <FooterSmall />
   </a-config-provider>

src/components/content/CommonListBlock.vue

@@ -271,6 +271,10 @@ const props = defineProps({
     type: String,
     default: 'https://mncdn.wenlvti.net/app_static/minnan/EmptyImage.png'
   },
+  startSearchText: {
+    type: String,
+    default: '',
+  }
 })
 
 const router = useRouter();
@@ -299,7 +303,7 @@ const placeholderItemCount = computed(() => {
   }
   return 0;
 });
-const searchText = ref('');
+const searchText = ref(props.startSearchText);
 const dropDownValues = ref<any>([]);
 
 function handleSearch() {

src/composeable/MemorizeVar.ts

@@ -0,0 +1,16 @@
+import { onMounted, ref, watch } from "vue";
+
+export function memorizeVar<T>(key: string, defaultValue: T) {
+  const variable = ref<T>(defaultValue);
+
+  onMounted(() => {
+    variable.value = JSON.parse(localStorage.getItem(key) || '{}');
+  });
+  watch(variable, (newValue) => {
+    localStorage.setItem(key, JSON.stringify(newValue));
+  });
+
+  return { 
+    variable
+  };
+}

src/pages/admin.vue

@@ -20,12 +20,12 @@
                 {
                   options: categoryData.content.value ?? [],
                   label: '分类',
-                  defaultSelectedValue: 0,
+                  defaultSelectedValue: lastValueCategory,
                 },
                 {
                   options: computedCategoryOptions,
                   label: '状态',
-                  defaultSelectedValue: -10,
+                  defaultSelectedValue: lastValueStatus,
                 },
               ]"
               :load="(page: number, pageSize: number, _, searchText: string, dropDownValues: number[]) => loadInheritorData(page, pageSize, dropDownValues, searchText)"  
@@ -47,12 +47,12 @@
                 {
                   options: categoryData.content.value ?? [],
                   label: '分类',
-                  defaultSelectedValue: 0,
+                  defaultSelectedValue: lastValueCategory,
                 },
                 {
                   options: computedCategoryOptions,
                   label: '状态',
-                  defaultSelectedValue: -10,
+                  defaultSelectedValue: lastValueStatus,  
                 },
               ]"
               :load="(page: number, pageSize: number, _, searchText: string, dropDownValues: number[]) => loadIchData(page, pageSize, dropDownValues, searchText)"
@@ -123,6 +123,7 @@ import CommonContent, { GetContentListParams } from '@/api/CommonContent';
 import CommonListBlock, { type DropdownCommonItem } from '@/components/content/CommonListBlock.vue';
 import InheritorContent from '@/api/inheritor/InheritorContent';
 import AdminItemState from './components/AdminItemState.vue';
+import { memorizeVar } from '@/composeable/MemorizeVar';
 
 const { toClipboard } = useClipboard();
 const router = useRouter();
@@ -131,6 +132,9 @@ const authStore = useAuthStore();
 const activeKey = ref(route.query.tab as string || '1');
 const inheritorData = ref<GetContentListItem[]>([]);
 
+const { variable: lastValueCategory } = memorizeVar('categoryLastSelectValue', 0);
+const { variable: lastValueStatus } = memorizeVar('statusLastSelectValue', -10);
+
 const computedCategoryOptions = computed<DropdownCommonItem[]>(() => {
   if (authStore.isReviewer) {
     return [
@@ -169,6 +173,8 @@ const categoryData = useSimpleDataLoader(async () => {
 })
 
 async function loadInheritorData(page: number, pageSize: number, dropDownValues: number[], searchText: string) {
+  lastValueCategory.value = dropDownValues[0];
+  lastValueStatus.value = dropDownValues[1];
   const submitList = await InheritorContent.getInheritorSubmtList(7);
   const res = await CommonContent.getContentList(
     new GetContentListParams()
@@ -198,6 +204,8 @@ async function loadInheritorData(page: number, pageSize: number, dropDownValues:
   }
 }
 async function loadIchData(page: number, pageSize: number, dropDownValues: number[], searchText: string) {
+  lastValueCategory.value = dropDownValues[0];
+  lastValueStatus.value = dropDownValues[1];
   const submitList = await InheritorContent.getInheritorSubmtList(2);
   const res = await CommonContent.getContentList(
     new GetContentListParams()

src/pages/forms/form.vue

@@ -35,13 +35,14 @@
                 </div>
                 <div class="d-flex flex-row w-100 align-items-center justify-content-end mt-3">
                   <a-popover
-                    v-if="!isReviewer"
+                    v-if="!isReviewer && !isAdmin"
                     title="保存提示"
                     content="如果未完成编辑，可以先点击保存按钮保存修改，完成后再点击提交审核。您可以在历史版本中查看之前的修改。"
                   >
                     <a-button
                       block 
-                      :loading="loading" class="" 
+                      :loading="loading"
+                      class="me-3" 
                       @click="handleSubmitBase(false)"
                     >
                       保存
@@ -50,7 +51,7 @@
                   <a-button 
                     type="primary"
                     block 
-                    :loading="loading" class="ms-3" 
+                    :loading="loading"
                     @click="handleSubmitBase(true)"
                   >
                     提交

src/router/index.ts

@@ -9,6 +9,9 @@ const router = createRouter({
       path: '/',
       name: 'Index',
       component: Index,
+      meta: {
+        keepAlive: true,
+      },
     },
     {
       path: '/forms/ich',
@@ -38,16 +41,25 @@ const router = createRouter({
     {
       path: '/admin',
       name: 'Admin',
+      meta: {
+        keepAlive: true,
+      },
       component: () => import('@/pages/admin.vue'),
     },
     {
       path: '/admin/works',
       name: 'AdminWorks',
+      meta: {
+        keepAlive: true,
+      },
       component: () => import('@/pages/admin/works.vue'),
     },
     {
       path: '/admin/seminar',
       name: 'AdminSeminar',
+      meta: {
+        keepAlive: true,
+      },
       component: () => import('@/pages/admin/seminar.vue'),
     },
     {