From c95a4e0763838e843cf5ce174110a01f2baa8000 Mon Sep 17 00:00:00 2001
From: kailong321200875 <321200875@qq.com>
Date: Sat, 2 Sep 2023 08:35:26 +0800
Subject: [PATCH] fix: #326

---
 .../Setting/src/components/InterfaceDisplay.vue      |  2 +-
 src/components/TabMenu/src/TabMenu.vue               | 12 +++++++++++-
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/components/Setting/src/components/InterfaceDisplay.vue b/src/components/Setting/src/components/InterfaceDisplay.vue
index e8fbde6..466dc65 100644
--- a/src/components/Setting/src/components/InterfaceDisplay.vue
+++ b/src/components/Setting/src/components/InterfaceDisplay.vue
@@ -108,7 +108,7 @@ const greyModeChange = (show: boolean) => {
 }
 
 // 动态路由
-const dynamicRouter = ref(appStore.getDynamicRouter)
+const dynamicRouter = ref(!!appStore.getDynamicRouter)
 
 const dynamicRouterChange = (show: boolean) => {
   ElMessage.info(t('setting.reExperienced'))
diff --git a/src/components/TabMenu/src/TabMenu.vue b/src/components/TabMenu/src/TabMenu.vue
index 4ca39b2..b2ad762 100644
--- a/src/components/TabMenu/src/TabMenu.vue
+++ b/src/components/TabMenu/src/TabMenu.vue
@@ -3,7 +3,7 @@ import { usePermissionStore } from '@/store/modules/permission'
 import { useAppStore } from '@/store/modules/app'
 import { computed, unref, defineComponent, watch, ref, onMounted } from 'vue'
 import { useI18n } from '@/hooks/web/useI18n'
-import { ElScrollbar } from 'element-plus'
+import { ElScrollbar, ClickOutside } from 'element-plus'
 import { Icon } from '@/components/Icon'
 import { Menu } from '@/components/Menu'
 import { useRouter } from 'vue-router'
@@ -19,6 +19,9 @@ const prefixCls = getPrefixCls('tab-menu')
 
 export default defineComponent({
   name: 'TabMenu',
+  directives: {
+    ClickOutside
+  },
   setup() {
     const { push, currentRoute } = useRouter()
 
@@ -132,9 +135,16 @@ export default defineComponent({
       return false
     }
 
+    const clickOut = () => {
+      if (!unref(fixedMenu)) {
+        showMenu.value = false
+      }
+    }
+
     return () => (
       <div
         id={`${variables.namespace}-menu`}
+        v-click-outside={clickOut}
         class={[
           prefixCls,
           'relative bg-[var(--left-menu-bg-color)] top-1px layout-border__right',