feat: 优化租户切换组件,支持租户切换并清除tab缓存

This commit is contained in:
AN 2025-05-18 20:10:56 +08:00
parent f6320260c1
commit 62da7e41be
3 changed files with 15 additions and 9 deletions

View File

@ -3,7 +3,7 @@ import { computed, onMounted, ref } from 'vue';
import type { SelectOption } from 'naive-ui'; import type { SelectOption } from 'naive-ui';
import { useLoading } from '@sa/hooks'; import { useLoading } from '@sa/hooks';
import { fetchTenantList } from '@/service/api'; import { fetchTenantList } from '@/service/api';
import { fetchClearTenant } from '@/service/api/system/tenant'; import { fetchChangeTenant, fetchClearTenant } from '@/service/api/system/tenant';
import { useAppStore } from '@/store/modules/app'; import { useAppStore } from '@/store/modules/app';
import { useTabStore } from '@/store/modules/tab'; import { useTabStore } from '@/store/modules/tab';
import { useAuthStore } from '@/store/modules/auth'; import { useAuthStore } from '@/store/modules/auth';
@ -45,7 +45,7 @@ const showTenantSelect = computed<boolean>(() => {
async function closeAndRefresh(msg: string, val: CommonType.IdType = '') { async function closeAndRefresh(msg: string, val: CommonType.IdType = '') {
lastSelected.value = val; lastSelected.value = val;
window.$message?.success(msg); window.$message?.success(msg);
clearTabs(); clearTabs([], true);
toHome(); toHome();
appStore.reloadPage(500); appStore.reloadPage(500);
} }
@ -57,6 +57,7 @@ async function handleChangeTenant(_tenantId: CommonType.IdType) {
if (lastSelected.value === _tenantId) { if (lastSelected.value === _tenantId) {
return; return;
} }
await fetchChangeTenant(_tenantId);
closeAndRefresh('切换租户成功', _tenantId); closeAndRefresh('切换租户成功', _tenantId);
} }

View File

@ -1,8 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, watch } from 'vue'; import { ref } from 'vue';
import { useFullscreen } from '@vueuse/core'; import { useFullscreen } from '@vueuse/core';
import { GLOBAL_HEADER_MENU_ID } from '@/constants/app'; import { GLOBAL_HEADER_MENU_ID } from '@/constants/app';
import { fetchChangeTenant } from '@/service/api/system/tenant';
import { useAppStore } from '@/store/modules/app'; import { useAppStore } from '@/store/modules/app';
import { useAuthStore } from '@/store/modules/auth'; import { useAuthStore } from '@/store/modules/auth';
import { useThemeStore } from '@/store/modules/theme'; import { useThemeStore } from '@/store/modules/theme';
@ -33,10 +32,6 @@ const themeStore = useThemeStore();
const { isFullscreen, toggle } = useFullscreen(); const { isFullscreen, toggle } = useFullscreen();
const tenantId = ref<CommonType.IdType>(authStore.userInfo?.user?.tenantId || '000000'); const tenantId = ref<CommonType.IdType>(authStore.userInfo?.user?.tenantId || '000000');
watch(tenantId, async () => {
await fetchChangeTenant(tenantId.value);
});
</script> </script>
<template> <template>

View File

@ -129,13 +129,23 @@ export const useTabStore = defineStore(SetupStoreId.Tab, () => {
* *
* @param excludes Exclude tab ids * @param excludes Exclude tab ids
*/ */
async function clearTabs(excludes: string[] = []) { async function clearTabs(excludes: string[] = [], clearCache: boolean = false) {
const remainTabIds = [...getFixedTabIds(tabs.value), ...excludes]; const remainTabIds = [...getFixedTabIds(tabs.value), ...excludes];
const removedTabsIds = tabs.value.map(tab => tab.id).filter(id => !remainTabIds.includes(id)); const removedTabsIds = tabs.value.map(tab => tab.id).filter(id => !remainTabIds.includes(id));
const isRemoveActiveTab = removedTabsIds.includes(activeTabId.value); const isRemoveActiveTab = removedTabsIds.includes(activeTabId.value);
const updatedTabs = filterTabsByIds(removedTabsIds, tabs.value); const updatedTabs = filterTabsByIds(removedTabsIds, tabs.value);
if (clearCache) {
// 清除缓存
removedTabsIds.forEach(tabId => {
const tab = tabs.value.find(t => t.id === tabId);
if (tab) {
routeStore.resetRouteCache(tab.routeKey);
}
});
}
function update() { function update() {
tabs.value = updatedTabs; tabs.value = updatedTabs;
} }