feat: use simpler nitro instead of nestjs to implement mock service

packages/effects/layouts/src/basic/content/content.vue

@@ -20,7 +20,7 @@ const { getCachedTabs, getExcludeCachedTabs, renderRouteView } =
   storeToRefs(tabbarStore);
 
 // 页面切换动画
-function getTransitionName(route: RouteLocationNormalizedLoaded) {
+function getTransitionName(_route: RouteLocationNormalizedLoaded) {
   // 如果偏好设置未设置，则不使用动画
   const { tabbar, transition } = preferences;
   const transitionName = transition.name;
@@ -38,9 +38,10 @@ function getTransitionName(route: RouteLocationNormalizedLoaded) {
   //   return;
   // }
   // 已经打开且已经加载过的页面不使用动画
-  const inTabs = getCachedTabs.value.includes(route.name as string);
+  // const inTabs = getCachedTabs.value.includes(route.name as string);
 
-  return inTabs && route.meta.loaded ? undefined : transitionName;
+  // return inTabs && route.meta.loaded ? undefined : transitionName;
+  return transitionName;
 }
 </script>
 

packages/effects/layouts/src/basic/tabbar/index.ts

@@ -1,2 +1,2 @@
 export { default as LayoutTabbar } from './tabbar.vue';
-export * from './use-tabs';
+export * from './use-tabbar';

packages/effects/layouts/src/basic/tabbar/tabbar.vue

@@ -2,11 +2,12 @@
 import { computed } from 'vue';
 import { useRoute } from 'vue-router';
 
+import { useContentMaximize, useTabs } from '@vben-core/hooks';
 import { preferences } from '@vben-core/preferences';
 import { useCoreTabbarStore } from '@vben-core/stores';
 import { TabsToolMore, TabsToolScreen, TabsView } from '@vben-core/tabs-ui';
 
-import { updateContentScreen, useTabs } from './use-tabs';
+import { useTabbar } from './use-tabbar';
 
 defineOptions({
   name: 'LayoutTabbar',
@@ -14,9 +15,10 @@ defineOptions({
 
 defineProps<{ showIcon?: boolean; theme?: string }>();
 
-const coreTabbarStore = useCoreTabbarStore();
-
 const route = useRoute();
+const coreTabbarStore = useCoreTabbarStore();
+const { toggleMaximize } = useContentMaximize();
+const { unpinTab } = useTabs();
 
 const {
   createContextMenus,
@@ -24,8 +26,7 @@ const {
   currentTabs,
   handleClick,
   handleClose,
-  handleUnpinTab,
-} = useTabs();
+} = useTabbar();
 
 const menus = computed(() => {
   return createContextMenus(route);
@@ -48,15 +49,15 @@ if (!preferences.tabbar.persist) {
     :tabs="currentTabs"
     @close="handleClose"
     @sort-tabs="coreTabbarStore.sortTabs"
-    @unpin="handleUnpinTab"
+    @unpin="unpinTab"
     @update:active="handleClick"
   />
   <div class="flex-center h-full">
     <TabsToolMore :menus="menus" />
     <TabsToolScreen
       :screen="preferences.sidebar.hidden"
-      @change="updateContentScreen"
-      @update:screen="updateContentScreen"
+      @change="toggleMaximize"
+      @update:screen="toggleMaximize"
     />
   </div>
 </template>

packages/effects/layouts/src/basic/tabbar/use-tabbar.ts

@@ -8,6 +8,7 @@ import type {
 import { computed, ref, watch } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
+import { useContentMaximize, useTabs } from '@vben-core/hooks';
 import {
   ArrowLeftToLine,
   ArrowRightLeft,
@@ -22,33 +23,32 @@ import {
   X,
 } from '@vben-core/icons';
 import { $t, useI18n } from '@vben-core/locales';
-import { updatePreferences, usePreferences } from '@vben-core/preferences';
 import {
   storeToRefs,
   useCoreAccessStore,
   useCoreTabbarStore,
 } from '@vben-core/stores';
-import { filterTree, openWindow } from '@vben-core/toolkit';
+import { filterTree } from '@vben-core/toolkit';
 
-function updateContentScreen(screen: boolean) {
-  updatePreferences({
-    header: {
-      hidden: !!screen,
-    },
-    sidebar: {
-      hidden: !!screen,
-    },
-  });
-}
-
-function useTabs() {
+export function useTabbar() {
   const router = useRouter();
   const route = useRoute();
   const accessStore = useCoreAccessStore();
-  const { contentIsMaximize } = usePreferences();
   const coreTabbarStore = useCoreTabbarStore();
   const { accessMenus } = storeToRefs(accessStore);
-
+  const { contentIsMaximize, toggleMaximize } = useContentMaximize();
+  const {
+    closeAllTabs,
+    closeCurrentTab,
+    closeLeftTabs,
+    closeOtherTabs,
+    closeRightTabs,
+    closeTabByKey,
+    getTabDisableState,
+    openTabInNewWindow,
+    refreshTab,
+    toggleTabPin,
+  } = useTabs();
   const currentActive = computed(() => {
     return route.path;
   });
@@ -76,7 +76,7 @@ function useTabs() {
 
   // 关闭tab
   const handleClose = async (key: string) => {
-    await coreTabbarStore.closeTabByKey(key, router);
+    await closeTabByKey(key);
   };
 
   function wrapperTabLocale(tab: RouteLocationNormalizedGeneric) {
@@ -106,30 +106,22 @@ function useTabs() {
   );
 
   const createContextMenus = (tab: TabDefinition) => {
-    const tabs = coreTabbarStore.getTabs;
-    const affixTabs = coreTabbarStore.affixTabs;
-    const index = tabs.findIndex((item) => item.path === tab.path);
+    const {
+      disabledCloseAll,
+      disabledCloseCurrent,
+      disabledCloseLeft,
+      disabledCloseOther,
+      disabledCloseRight,
+      disabledRefresh,
+    } = getTabDisableState(tab);
 
-    const disabled = tabs.length <= 1;
-
-    const { meta } = tab;
-    const affixTab = meta?.affixTab ?? false;
-    const isCurrentTab = route.path === tab.path;
-
-    // 当前处于最左侧或者减去固定标签页的数量等于0
-    const closeLeftDisabled =
-      index === 0 || index - affixTabs.length <= 0 || !isCurrentTab;
-
-    const closeRightDisabled = !isCurrentTab || index === tabs.length - 1;
-
-    const closeOtherDisabled =
-      disabled || !isCurrentTab || tabs.length - affixTabs.length <= 1;
+    const affixTab = tab?.meta?.affixTab ?? false;
 
     const menus: IContextMenuItem[] = [
       {
-        disabled: !!affixTab || disabled,
+        disabled: disabledCloseCurrent,
         handler: async () => {
-          await coreTabbarStore.closeTab(tab, router);
+          await closeCurrentTab(tab);
         },
         icon: X,
         key: 'close',
@@ -137,9 +129,7 @@ function useTabs() {
       },
       {
         handler: async () => {
-          await (affixTab
-            ? coreTabbarStore.unpinTab(tab)
-            : coreTabbarStore.pinTab(tab));
+          await toggleTabPin(tab);
         },
         icon: affixTab ? MdiPinOff : MdiPin,
         key: 'affix',
@@ -152,7 +142,7 @@ function useTabs() {
           if (!contentIsMaximize.value) {
             await router.push(tab.fullPath);
           }
-          updateContentScreen(!contentIsMaximize.value);
+          toggleMaximize();
         },
         icon: contentIsMaximize.value ? Minimize2 : Fullscreen,
         key: contentIsMaximize.value ? 'restore-maximize' : 'maximize',
@@ -161,22 +151,15 @@ function useTabs() {
           : $t('preferences.tabbar.contextMenu.maximize'),
       },
       {
-        disabled: !isCurrentTab,
-        handler: async () => {
-          await coreTabbarStore.refresh(router);
-        },
+        disabled: disabledRefresh,
+        handler: refreshTab,
         icon: RotateCw,
         key: 'reload',
         text: $t('preferences.tabbar.contextMenu.reload'),
       },
-
       {
         handler: async () => {
-          const { hash, origin } = location;
-          const path = tab.fullPath;
-          const fullPath = path.startsWith('/') ? path : `/${path}`;
-          const url = `${origin}${hash ? '/#' : ''}${fullPath}`;
-          openWindow(url, { target: '_blank' });
+          await openTabInNewWindow(tab);
         },
         icon: ExternalLink,
         key: 'open-in-new-window',
@@ -185,18 +168,18 @@ function useTabs() {
       },
 
       {
-        disabled: closeLeftDisabled,
+        disabled: disabledCloseLeft,
         handler: async () => {
-          await coreTabbarStore.closeLeftTabs(tab);
+          await closeLeftTabs(tab);
         },
         icon: ArrowLeftToLine,
         key: 'close-left',
         text: $t('preferences.tabbar.contextMenu.closeLeft'),
       },
       {
-        disabled: closeRightDisabled,
+        disabled: disabledCloseRight,
         handler: async () => {
-          await coreTabbarStore.closeRightTabs(tab);
+          await closeRightTabs(tab);
         },
         icon: ArrowRightToLine,
         key: 'close-right',
@@ -204,19 +187,17 @@ function useTabs() {
         text: $t('preferences.tabbar.contextMenu.closeRight'),
       },
       {
-        disabled: closeOtherDisabled,
+        disabled: disabledCloseOther,
         handler: async () => {
-          await coreTabbarStore.closeOtherTabs(tab);
+          await closeOtherTabs(tab);
         },
         icon: FoldHorizontal,
         key: 'close-other',
         text: $t('preferences.tabbar.contextMenu.closeOther'),
       },
       {
-        disabled,
-        handler: async () => {
-          await coreTabbarStore.closeAllTabs(router);
-        },
+        disabled: disabledCloseAll,
+        handler: closeAllTabs,
         icon: ArrowRightLeft,
         key: 'close-all',
         text: $t('preferences.tabbar.contextMenu.closeAll'),
@@ -225,21 +206,11 @@ function useTabs() {
     return menus;
   };
 
-  /**
-   * 取消固定标签页
-   */
-  const handleUnpinTab = async (tab: TabDefinition) => {
-    await coreTabbarStore.unpinTab(tab);
-  };
-
   return {
     createContextMenus,
     currentActive,
     currentTabs,
     handleClick,
     handleClose,
-    handleUnpinTab,
   };
 }
-
-export { updateContentScreen, useTabs };