⚡ 优化缓存策略.

orion-visor-ui/src/views/asset/grant/index.vue

@@ -25,13 +25,12 @@
 </script>
 
 <script lang="ts" setup>
-  import { onBeforeMount, onUnmounted, ref } from 'vue';
-  import { useCacheStore, useDictStore } from '@/store';
+  import { onBeforeMount, ref } from 'vue';
+  import { useDictStore } from '@/store';
   import { GrantTabs, dictKeys } from './types/const';
   import { useRoute } from 'vue-router';
 
   const route = useRoute();
-  const cacheStore = useCacheStore();
 
   const activeKey = ref();
 
@@ -49,11 +48,6 @@
     }
   });
 
-  // 卸载时清除 cache
-  onUnmounted(() => {
-    cacheStore.reset('users', 'roles', 'hostGroups', 'hostKeys', 'hostIdentities');
-  });
-
 </script>
 
 <style lang="less" scoped>

orion-visor-ui/src/views/asset/host-identity/components/host-identity-card-list.vue

@@ -155,7 +155,7 @@
   import { deleteHostIdentity, getHostIdentityPage } from '@/api/asset/host-identity';
   import { Message, Modal } from '@arco-design/web-vue';
   import usePermission from '@/hooks/permission';
-  import { useDictStore } from '@/store';
+  import { useCacheStore, useDictStore } from '@/store';
   import { copy } from '@/hooks/copy';
   import { GrantKey, GrantRouteName } from '@/views/asset/grant/types/const';
   import { IdentityType, identityTypeKey } from '../types/const';
@@ -165,6 +165,7 @@
 
   const list = ref<HostIdentityQueryResponse[]>([]);
 
+  const cacheStore = useCacheStore();
   const cardColLayout = useCardColLayout();
   const pagination = useCardPagination();
   const { toOptions, getDictValue } = useDictStore();
@@ -199,8 +200,8 @@
           // 调用删除接口
           await deleteHostIdentity(id);
           Message.success('删除成功');
-          // 重新加载数据
-          fetchCardData();
+          // 重新加载
+          reload();
         } catch (e) {
         } finally {
           setLoading(false);
@@ -211,7 +212,10 @@
 
   // 重新加载
   const reload = () => {
+    // 重新加载数据
     fetchCardData();
+    // 清空缓存
+    cacheStore.reset('hostIdentities', 'authorizedHostIdentities');
   };
 
   defineExpose({ reload });

orion-visor-ui/src/views/asset/host-identity/components/host-identity-table.vue

@@ -182,7 +182,7 @@
   import useLoading from '@/hooks/loading';
   import usePermission from '@/hooks/permission';
   import { copy } from '@/hooks/copy';
-  import { useDictStore } from '@/store';
+  import { useCacheStore, useDictStore } from '@/store';
   import { useTablePagination, useRowSelection } from '@/hooks/table';
   import { GrantKey, GrantRouteName } from '@/views/asset/grant/types/const';
   import { IdentityType, identityTypeKey } from '../types/const';
@@ -190,6 +190,7 @@
 
   const emits = defineEmits(['openAdd', 'openUpdate', 'openKeyView']);
 
+  const cacheStore = useCacheStore();
   const pagination = useTablePagination();
   const rowSelection = useRowSelection();
   const { toOptions, getDictValue } = useDictStore();
@@ -215,8 +216,8 @@
       // 调用删除接口
       await deleteHostIdentity(id);
       Message.success('删除成功');
-      // 重新加载数据
-      fetchTableData();
+      // 重新加载
+      reload();
     } catch (e) {
     } finally {
       setLoading(false);
@@ -231,8 +232,8 @@
       await batchDeleteHostIdentity(selectedKeys.value);
       Message.success(`成功删除 ${selectedKeys.value.length} 条数据`);
       selectedKeys.value = [];
-      // 重新加载数据
-      fetchTableData();
+      // 重新加载
+      reload();
     } catch (e) {
     } finally {
       setLoading(false);
@@ -241,7 +242,10 @@
 
   // 重新加载
   const reload = () => {
+    // 重新加载数据
     fetchTableData();
+    // 清空缓存
+    cacheStore.reset('hostIdentities', 'authorizedHostIdentities');
   };
 
   defineExpose({ reload });

orion-visor-ui/src/views/asset/host-identity/index.vue

@@ -28,8 +28,8 @@
 </script>
 
 <script lang="ts" setup>
-  import { ref, computed, onUnmounted, onBeforeMount } from 'vue';
-  import { useAppStore, useCacheStore, useDictStore } from '@/store';
+  import { ref, computed, onBeforeMount } from 'vue';
+  import { useAppStore, useDictStore } from '@/store';
   import { dictKeys } from './types/const';
   import HostIdentityCardList from './components/host-identity-card-list.vue';
   import HostIdentityTable from './components/host-identity-table.vue';
@@ -41,7 +41,6 @@
   const modal = ref();
   const keyDrawer = ref();
   const appStore = useAppStore();
-  const cacheStore = useCacheStore();
 
   const renderTable = computed(() => appStore.hostIdentityView === 'table');
 
@@ -60,12 +59,6 @@
     await dictStore.loadKeys(dictKeys);
   });
 
-  // 卸载时清除 cache
-  onUnmounted(() => {
-    const cacheStore = useCacheStore();
-    cacheStore.reset('hostKeys');
-  });
-
 </script>
 
 <style lang="less" scoped>

orion-visor-ui/src/views/asset/host-key/components/host-key-card-list.vue

@@ -84,6 +84,7 @@
   import type { HostKeyQueryRequest, HostKeyQueryResponse } from '@/api/asset/host-key';
   import { useCardPagination, useCardColLayout } from '@/hooks/card';
   import { reactive, ref, onMounted } from 'vue';
+  import { useCacheStore } from '@/store';
   import useLoading from '@/hooks/loading';
   import { resetObject } from '@/utils';
   import fieldConfig from '../types/card.fields';
@@ -95,6 +96,7 @@
 
   const list = ref<HostKeyQueryResponse[]>([]);
 
+  const cacheStore = useCacheStore();
   const cardColLayout = useCardColLayout();
   const pagination = useCardPagination();
   const { loading, setLoading } = useLoading();
@@ -116,8 +118,8 @@
           // 调用删除接口
           await deleteHostKey(id);
           Message.success('删除成功');
-          // 重新加载数据
-          fetchCardData();
+          // 重新加载
+          reload();
         } catch (e) {
         } finally {
           setLoading(false);
@@ -128,7 +130,10 @@
 
   // 重新加载
   const reload = () => {
+    // 重新加载数据
     fetchCardData();
+    // 清空缓存
+    cacheStore.reset('hostKeys', 'authorizedHostKeys');
   };
 
   defineExpose({ reload });

orion-visor-ui/src/views/asset/host-key/components/host-key-table.vue

@@ -135,6 +135,7 @@
   import { reactive, ref, onMounted } from 'vue';
   import { deleteHostKey, batchDeleteHostKey, getHostKeyPage } from '@/api/asset/host-key';
   import { Message } from '@arco-design/web-vue';
+  import { useCacheStore } from '@/store';
   import useLoading from '@/hooks/loading';
   import columns from '../types/table.columns';
   import { useTablePagination, useRowSelection } from '@/hooks/table';
@@ -142,6 +143,7 @@
 
   const emits = defineEmits(['openAdd', 'openUpdate', 'openView']);
 
+  const cacheStore = useCacheStore();
   const pagination = useTablePagination();
   const rowSelection = useRowSelection();
   const { loading, setLoading } = useLoading();
@@ -156,16 +158,14 @@
   });
 
   // 删除当前行
-  const deleteRow = async ({ id }: {
-    id: number
-  }) => {
+  const deleteRow = async (record: HostKeyQueryResponse) => {
     try {
       setLoading(true);
       // 调用删除接口
-      await deleteHostKey(id);
+      await deleteHostKey(record.id);
       Message.success('删除成功');
-      // 重新加载数据
-      fetchTableData();
+      // 重新加载
+      reload();
     } catch (e) {
     } finally {
       setLoading(false);
@@ -180,8 +180,8 @@
       await batchDeleteHostKey(selectedKeys.value);
       Message.success(`成功删除 ${selectedKeys.value.length} 条数据`);
       selectedKeys.value = [];
-      // 重新加载数据
-      fetchTableData();
+      // 重新加载
+      reload();
     } catch (e) {
     } finally {
       setLoading(false);
@@ -190,7 +190,10 @@
 
   // 重新加载
   const reload = () => {
+    // 重新加载数据
     fetchTableData();
+    // 清空缓存
+    cacheStore.reset('hostKeys', 'authorizedHostKeys');
   };
 
   defineExpose({ reload });

orion-visor-ui/src/views/asset/host-list/components/host-card-list.vue

@@ -234,7 +234,7 @@
   import { Message, Modal } from '@arco-design/web-vue';
   import { HostOsType, hostOsTypeKey, hostStatusKey, HostType, hostTypeKey, tagColor } from '../types/const';
   import { copy } from '@/hooks/copy';
-  import { useDictStore } from '@/store';
+  import { useCacheStore, useDictStore } from '@/store';
   import { GrantKey, GrantRouteName } from '@/views/asset/grant/types/const';
   import useLoading from '@/hooks/loading';
   import fieldConfig from '../types/card.fields';
@@ -243,6 +243,7 @@
 
   const emits = defineEmits(['openAdd', 'openUpdate', 'openUpdateConfig', 'openHostGroup', 'openCopy']);
 
+  const cacheStore = useCacheStore();
   const cardColLayout = useCardColLayout();
   const pagination = useCardPagination();
   const { loading, setLoading } = useLoading();
@@ -308,8 +309,8 @@
           // 调用删除接口
           await deleteHost(id);
           Message.success('删除成功');
-          // 重新加载数据
-          fetchCardData();
+          // 重新加载
+          reload();
         } catch (e) {
         } finally {
           setLoading(false);
@@ -320,7 +321,10 @@
 
   // 重新加载
   const reload = () => {
+    // 重新加载数据
     fetchCardData();
+    // 清空缓存
+    cacheStore.reset('host_SSH');
   };
 
   defineExpose({ reload });

orion-visor-ui/src/views/asset/host-list/components/host-table.vue

@@ -269,7 +269,7 @@
   import { Message, Modal } from '@arco-design/web-vue';
   import { tagColor, hostTypeKey, hostStatusKey, HostType, HostOsType, hostOsTypeKey } from '../types/const';
   import { useTablePagination, useRowSelection } from '@/hooks/table';
-  import { useDictStore } from '@/store';
+  import { useCacheStore, useDictStore } from '@/store';
   import { copy } from '@/hooks/copy';
   import { dataColor } from '@/utils';
   import useLoading from '@/hooks/loading';
@@ -280,6 +280,7 @@
 
   const emits = defineEmits(['openCopy', 'openAdd', 'openUpdate', 'openUpdateConfig', 'openHostGroup']);
 
+  const cacheStore = useCacheStore();
   const pagination = useTablePagination();
   const rowSelection = useRowSelection();
   const { loading, setLoading } = useLoading();
@@ -334,8 +335,8 @@
       // 调用删除接口
       await deleteHost(record.id);
       Message.success('删除成功');
-      // 重新加载数据
-      fetchTableData();
+      // 重新加载
+      reload();
     } catch (e) {
     } finally {
       setLoading(false);
@@ -350,8 +351,8 @@
       await batchDeleteHost(selectedKeys.value);
       Message.success(`成功删除 ${selectedKeys.value.length} 条数据`);
       selectedKeys.value = [];
-      // 重新加载数据
-      fetchTableData();
+      // 重新加载
+      reload();
     } catch (e) {
     } finally {
       setLoading(false);
@@ -360,11 +361,16 @@
 
   // 重新加载
   const reload = () => {
+    // 重新加载数据
     fetchTableData();
+    // 清空缓存
+    cacheStore.reset('host_SSH');
   };
 
   defineExpose({ reload });
 
+  defineExpose({ reload });
+
   // 加载数据
   const doFetchTableData = async (request: HostQueryRequest) => {
     try {

orion-visor-ui/src/views/asset/host-list/index.vue

@@ -34,8 +34,8 @@
 </script>
 
 <script lang="ts" setup>
-  import { computed, ref, onUnmounted, onBeforeMount } from 'vue';
-  import { useAppStore, useCacheStore, useDictStore } from '@/store';
+  import { computed, ref, onBeforeMount } from 'vue';
+  import { useAppStore, useDictStore } from '@/store';
   import { dictKeys } from './types/const';
   import HostTable from './components/host-table.vue';
   import HostCardList from './components/host-card-list.vue';
@@ -50,7 +50,6 @@
   const hostGroup = ref();
 
   const appStore = useAppStore();
-  const cacheStore = useCacheStore();
 
   const renderTable = computed(() => appStore.hostView === 'table');
 
@@ -69,11 +68,6 @@
     await dictStore.loadKeys(dictKeys);
   });
 
-  // 卸载时清除 cache
-  onUnmounted(() => {
-    cacheStore.reset('hostKeys', 'hostIdentities', 'hostGroups', 'HOST_Tags');
-  });
-
 </script>
 
 <style lang="less" scoped>