perf: Improve the use of store in the app

This commit is contained in:
vince
2024-07-05 23:15:46 +08:00
parent ad6ae1d21d
commit 8042e2b044
39 changed files with 387 additions and 224 deletions

View File

@@ -19,14 +19,18 @@ import {
MdiPin,
MdiPinOff,
} from '@vben-core/iconify';
import { storeToRefs, useAccessStore, useTabbarStore } from '@vben-core/stores';
import {
storeToRefs,
useCoreAccessStore,
useCoreTabbarStore,
} from '@vben-core/stores';
import { filterTree } from '@vben-core/toolkit';
function useTabs() {
const router = useRouter();
const route = useRoute();
const accessStore = useAccessStore();
const tabsStore = useTabbarStore();
const accessStore = useCoreAccessStore();
const tabbarStore = useCoreTabbarStore();
const { accessMenus } = storeToRefs(accessStore);
const currentActive = computed(() => {
@@ -35,7 +39,7 @@ function useTabs() {
const { locale } = useI18n();
const currentTabs = ref<RouteLocationNormalizedGeneric[]>();
watch([() => tabsStore.getTabs, () => locale.value], ([tabs, _]) => {
watch([() => tabbarStore.getTabs, () => locale.value], ([tabs, _]) => {
currentTabs.value = tabs.map((item) => wrapperTabLocale(item));
});
@@ -46,7 +50,7 @@ function useTabs() {
const affixTabs = filterTree(router.getRoutes(), (route) => {
return !!route.meta?.affixTab;
});
tabsStore.setAffixTabs(affixTabs);
tabbarStore.setAffixTabs(affixTabs);
};
// 点击tab,跳转路由
@@ -56,7 +60,7 @@ function useTabs() {
// 关闭tab
const handleClose = async (key: string) => {
await tabsStore.closeTabByKey(key, router);
await tabbarStore.closeTabByKey(key, router);
};
function wrapperTabLocale(tab: RouteLocationNormalizedGeneric) {
@@ -80,14 +84,14 @@ function useTabs() {
watch(
() => route.path,
() => {
tabsStore.addTab(route as RouteLocationNormalized);
tabbarStore.addTab(route as RouteLocationNormalized);
},
{ immediate: true },
);
const createContextMenus = (tab: TabItem) => {
const tabs = tabsStore.getTabs;
const affixTabs = tabsStore.affixTabs;
const tabs = tabbarStore.getTabs;
const affixTabs = tabbarStore.affixTabs;
const index = tabs.findIndex((item) => item.path === tab.path);
const disabled = tabs.length <= 1;
@@ -109,7 +113,7 @@ function useTabs() {
{
disabled: !isCurrentTab,
handler: async () => {
await tabsStore.refreshTab(router);
await tabbarStore.refresh(router);
},
icon: IcRoundRefresh,
key: 'reload',
@@ -118,7 +122,7 @@ function useTabs() {
{
disabled: !!affixTab || disabled,
handler: async () => {
await tabsStore.closeTab(tab, router);
await tabbarStore.closeTab(tab, router);
},
icon: IcRoundClose,
key: 'close',
@@ -127,8 +131,8 @@ function useTabs() {
{
handler: async () => {
await (affixTab
? tabsStore.unPushPinTab(tab)
: tabsStore.pushPinTab(tab));
? tabbarStore.unPushPinTab(tab)
: tabbarStore.pushPinTab(tab));
},
icon: affixTab ? MdiPinOff : MdiPin,
key: 'affix',
@@ -140,7 +144,7 @@ function useTabs() {
{
disabled: closeLeftDisabled,
handler: async () => {
await tabsStore.closeLeftTabs(tab);
await tabbarStore.closeLeftTabs(tab);
},
icon: MdiFormatHorizontalAlignLeft,
key: 'close-left',
@@ -149,7 +153,7 @@ function useTabs() {
{
disabled: closeRightDisabled,
handler: async () => {
await tabsStore.closeRightTabs(tab);
await tabbarStore.closeRightTabs(tab);
},
icon: MdiFormatHorizontalAlignRight,
key: 'close-right',
@@ -159,7 +163,7 @@ function useTabs() {
{
disabled: closeOtherDisabled,
handler: async () => {
await tabsStore.closeOtherTabs(tab);
await tabbarStore.closeOtherTabs(tab);
},
icon: MdiArrowExpandHorizontal,
key: 'close-other',
@@ -168,7 +172,7 @@ function useTabs() {
{
disabled,
handler: async () => {
await tabsStore.closeAllTabs(router);
await tabbarStore.closeAllTabs(router);
},
icon: IcRoundMultipleStop,
key: 'close-all',
@@ -187,7 +191,7 @@ function useTabs() {
* 取消固定标签页
*/
const handleUnPushPin = async (tab: TabItem) => {
await tabsStore.unPushPinTab(tab);
await tabbarStore.unPushPinTab(tab);
};
return {