feat(tree): add headerTitle slot

CHANGELOG.zh_CN.md

@@ -1,5 +1,9 @@
 ## Wip
 
+### ✨ Features
+
+- 新增`headerTitle` slot
+
 ### ✨ Refactor
 
 - 移除 useFullScreen 函数

src/components/Form/src/props.ts

@@ -25,7 +25,6 @@ export const basicProps = {
   schemas: {
     type: [Array] as PropType<FormSchema[]>,
     default: () => [],
-    required: true,
   },
   mergeDynamicData: {
     type: Object as PropType<Recordable>,

src/components/Menu/src/BasicMenu.vue

@@ -38,7 +38,7 @@
 
   import { getCurrentParentPath } from '/@/router/menus';
 
-  import { listenerLastChangeTab } from '/@/logics/mitt/tabChange';
+  import { listenerRouteChange } from '/@/logics/mitt/routeChange';
   import { getAllParentPath } from '/@/router/helper/menuHelper';
 
   export default defineComponent({
@@ -105,7 +105,7 @@
         return inlineCollapseOptions;
       });
 
-      listenerLastChangeTab((route) => {
+      listenerRouteChange((route) => {
         if (route.name === REDIRECT_NAME) return;
         handleMenuChange(route);
         currentActiveMenu.value = route.meta?.currentActiveMenu as string;

src/components/SimpleMenu/src/SimpleMenu.vue

@@ -27,7 +27,7 @@
 
   import Menu from './components/Menu.vue';
   import SimpleSubMenu from './SimpleSubMenu.vue';
-  import { listenerLastChangeTab } from '/@/logics/mitt/tabChange';
+  import { listenerRouteChange } from '/@/logics/mitt/routeChange';
   import { propTypes } from '/@/utils/propTypes';
   import { REDIRECT_NAME } from '/@/router/constant';
   import { RouteLocationNormalizedLoaded, useRouter } from 'vue-router';
@@ -91,7 +91,7 @@
         { immediate: true }
       );
 
-      listenerLastChangeTab((route) => {
+      listenerRouteChange((route) => {
         if (route.name === REDIRECT_NAME) return;
 
         currentActiveMenu.value = route.meta?.currentActiveMenu as string;

src/components/Tree/src/TreeHeader.vue

@@ -1,6 +1,9 @@
 <template>
   <div class="flex px-2 py-1.5 items-center border-b-1">
-    <BasicTitle :helpMessage="helpMessage" v-if="title">{{ title }}</BasicTitle>
+    <slot name="headerTitle" v-if="$slots.headerTitle"></slot>
+    <BasicTitle :helpMessage="helpMessage" v-if="!$slots.headerTitle && title">{{
+      title
+    }}</BasicTitle>
 
     <div class="flex flex-1 justify-end items-center cursor-pointer" v-if="search || toolbar">
       <div class="mr-1 w-2/3" v-if="search">

src/components/Tree/src/index.vue

@@ -321,7 +321,7 @@
       }
       return () => {
         const { title, helpMessage, toolbar, search, checkable } = props;
-        const showTitle = title || toolbar || search;
+        const showTitle = title || toolbar || search || slots.headerTitle;
         const scrollStyle: CSSProperties = { height: 'calc(100% - 38px)' };
         return (
           <div class={[prefixCls, 'h-full bg-white', attrs.class]}>
@@ -336,7 +336,9 @@
                 helpMessage={helpMessage}
                 onStrictlyChange={onStrictlyChange}
                 onSearch={handleSearch}
-              />
+              >
+                {extendSlots(slots)}
+              </TreeHeader>
             )}
             <ScrollContainer style={scrollStyle} v-show={!unref(getNotFound)}>
               <Tree {...unref(getBindValues)} showIcon={false}>

src/hooks/web/useTitle.ts

@@ -3,7 +3,7 @@ import { useTitle as usePageTitle } from '@vueuse/core';
 import { useGlobSetting } from '/@/hooks/setting';
 
 import { REDIRECT_NAME } from '/@/router/constant';
-import { listenerLastChangeTab } from '/@/logics/mitt/tabChange';
+import { listenerRouteChange } from '/@/logics/mitt/routeChange';
 
 export function useTitle() {
   const { title } = useGlobSetting();
@@ -11,7 +11,7 @@ export function useTitle() {
 
   const pageTitle = usePageTitle();
 
-  listenerLastChangeTab((route) => {
+  listenerRouteChange((route) => {
     if (route.name === REDIRECT_NAME) {
       return;
     }

src/layouts/default/sider/MixSider.vue

@@ -101,7 +101,7 @@
 
   import clickOutside from '/@/directives/clickOutside';
   import { getShallowMenus, getChildrenMenus, getCurrentParentPath } from '/@/router/menus';
-  import { listenerLastChangeTab } from '/@/logics/mitt/tabChange';
+  import { listenerRouteChange } from '/@/logics/mitt/routeChange';
   import { SimpleMenu } from '/@/components/SimpleMenu';
 
   export default defineComponent({
@@ -202,7 +202,7 @@
         menuModules.value = await getShallowMenus();
       });
 
-      listenerLastChangeTab((route) => {
+      listenerRouteChange((route) => {
         currentRoute.value = route;
         setActive(true);
         if (unref(getCloseMixSidebarOnChange)) {

src/layouts/default/tabs/index.vue

@@ -46,7 +46,7 @@
   import { useMultipleTabSetting } from '/@/hooks/setting/useMultipleTabSetting';
 
   import { REDIRECT_NAME } from '/@/router/constant';
-  import { listenerLastChangeTab } from '/@/logics/mitt/tabChange';
+  import { listenerRouteChange } from '/@/logics/mitt/routeChange';
 
   import router from '/@/router';
 
@@ -84,7 +84,7 @@
         ];
       });
 
-      listenerLastChangeTab((route) => {
+      listenerRouteChange((route) => {
         const { name } = route;
         if (name === REDIRECT_NAME || !route || !userStore.getTokenState) return;
 

src/logics/mitt/tabChange.ts → src/logics/mitt/routeChange.ts

@@ -12,13 +12,13 @@ const key = Symbol();
 
 let lastChangeTab: RouteLocationNormalized;
 
-export function setLastChangeTab(lastChangeRoute: RouteLocationNormalized) {
+export function setRouteChange(lastChangeRoute: RouteLocationNormalized) {
   const r = getRawRoute(lastChangeRoute);
   mitt.emit(key, r);
   lastChangeTab = r;
 }
 
-export function listenerLastChangeTab(
+export function listenerRouteChange(
   callback: (route: RouteLocationNormalized) => void,
   immediate = true
 ) {

src/router/guard/httpGuard.ts

@@ -14,7 +14,7 @@ export function createHttpGuard(router: Router) {
   }
   router.beforeEach(async () => {
     // Switching the route will delete the previous request
-    removeAllHttpPending && axiosCanceler?.removeAllPending();
+    axiosCanceler?.removeAllPending();
     return true;
   });
 }

src/router/guard/pageGuard.ts

@@ -1,5 +1,5 @@
 import type { Router } from 'vue-router';
-import { setLastChangeTab } from '/@/logics/mitt/tabChange';
+import { setRouteChange } from '/@/logics/mitt/routeChange';
 
 export function createPageGuard(router: Router) {
   const loadedPageMap = new Map<string, boolean>();
@@ -7,7 +7,7 @@ export function createPageGuard(router: Router) {
   router.beforeEach(async (to) => {
     to.meta.loaded = !!loadedPageMap.get(to.path);
     // Notify routing changes
-    setLastChangeTab(to);
+    setRouteChange(to);
 
     return true;
   });

src/router/guard/pageLoadingGuard.ts

@@ -25,7 +25,7 @@ export function createPageLoadingGuard(router: Router) {
     if (unref(getOpenPageLoading)) {
       setTimeout(() => {
         appStore.commitPageLoadingState(false);
-      }, 300);
+      }, 220);
     }
     return true;
   });

src/router/guard/stateGuard.ts

@@ -4,7 +4,7 @@ import { tabStore } from '/@/store/modules/tab';
 import { userStore } from '/@/store/modules/user';
 import { permissionStore } from '/@/store/modules/permission';
 import { PageEnum } from '/@/enums/pageEnum';
-import { removeTabChangeListener } from '/@/logics/mitt/tabChange';
+import { removeTabChangeListener } from '/@/logics/mitt/routeChange';
 
 export function createStateGuard(router: Router) {
   router.afterEach((to) => {