From 68afc8865a87ba1900636dc7ff0de1b587f3456c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=97=A0=E6=9C=A8?= <netfan@foxmail.com>
Date: Sat, 2 Jan 2021 16:18:32 +0800
Subject: [PATCH] wip(menu): mixSideTrigger setting

---
 src/enums/menuEnum.ts                         |  5 +++++
 src/layouts/default/setting/SettingDrawer.tsx | 10 ++++++++++
 src/layouts/default/setting/enum.ts           | 20 ++++++++++++++++++-
 src/layouts/default/setting/handler.ts        |  3 +++
 src/locales/lang/en/layout/setting.ts         |  4 ++++
 src/locales/lang/zh_CN/layout/setting.ts      |  4 ++++
 src/settings/projectSetting.ts                |  4 ++--
 src/types/config.d.ts                         |  4 ++--
 8 files changed, 49 insertions(+), 5 deletions(-)

diff --git a/src/enums/menuEnum.ts b/src/enums/menuEnum.ts
index 11fb946f0fe..89cfa9f5c30 100644
--- a/src/enums/menuEnum.ts
+++ b/src/enums/menuEnum.ts
@@ -43,3 +43,8 @@ export enum TopMenuAlignEnum {
   START = 'start',
   END = 'end',
 }
+
+export enum MixSidebarTriggerEnum {
+  HOVER = 'hover',
+  CLICK = 'click',
+}
diff --git a/src/layouts/default/setting/SettingDrawer.tsx b/src/layouts/default/setting/SettingDrawer.tsx
index f78634ff885..cd4b68b0079 100644
--- a/src/layouts/default/setting/SettingDrawer.tsx
+++ b/src/layouts/default/setting/SettingDrawer.tsx
@@ -28,6 +28,7 @@ import {
   getMenuTriggerOptions,
   routerTransitionOptions,
   menuTypeList,
+  mixSidebarTriggerOptions,
 } from './enum';
 
 import { HEADER_PRESET_BG_COLOR_LIST, SIDE_BAR_BG_COLOR_LIST } from '/@/settings/colorSetting';
@@ -73,6 +74,7 @@ export default defineComponent({
       getSplit,
       getIsMixSidebar,
       getCloseMixSidebarOnChange,
+      getMixSideTrigger,
     } = useMenuSetting();
 
     const {
@@ -115,6 +117,14 @@ export default defineComponent({
             def={unref(getCloseMixSidebarOnChange)}
             disabled={!unref(getIsMixSidebar)}
           />
+
+          <SelectItem
+            title={t('layout.setting.mixSidebarTrigger')}
+            event={HandlerEnum.MENU_TRIGGER_MIX_SIDEBAR}
+            def={unref(getMixSideTrigger)}
+            options={mixSidebarTriggerOptions}
+            disabled={!unref(getIsMixSidebar)}
+          />
         </>
       );
     }
diff --git a/src/layouts/default/setting/enum.ts b/src/layouts/default/setting/enum.ts
index d4ab8b40ae4..41e78e43e3f 100644
--- a/src/layouts/default/setting/enum.ts
+++ b/src/layouts/default/setting/enum.ts
@@ -1,5 +1,11 @@
 import { ContentEnum, RouterTransitionEnum } from '/@/enums/appEnum';
-import { MenuModeEnum, MenuTypeEnum, TopMenuAlignEnum, TriggerEnum } from '/@/enums/menuEnum';
+import {
+  MenuModeEnum,
+  MenuTypeEnum,
+  TopMenuAlignEnum,
+  TriggerEnum,
+  MixSidebarTriggerEnum,
+} from '/@/enums/menuEnum';
 
 import { useI18n } from '/@/hooks/web/useI18n';
 
@@ -20,6 +26,7 @@ export enum HandlerEnum {
   MENU_SPLIT,
   MENU_FIXED,
   MENU_CLOSE_MIX_SIDEBAR_ON_CHANGE,
+  MENU_TRIGGER_MIX_SIDEBAR,
 
   // header
   HEADER_SHOW,
@@ -132,3 +139,14 @@ export const menuTypeList = [
     type: MenuTypeEnum.MIX_SIDEBAR,
   },
 ];
+
+export const mixSidebarTriggerOptions = [
+  {
+    value: MixSidebarTriggerEnum.HOVER,
+    label: t('layout.setting.triggerHover'),
+  },
+  {
+    value: MixSidebarTriggerEnum.CLICK,
+    label: t('layout.setting.triggerClick'),
+  },
+];
diff --git a/src/layouts/default/setting/handler.ts b/src/layouts/default/setting/handler.ts
index 7e034c283c9..84c6124d2f7 100644
--- a/src/layouts/default/setting/handler.ts
+++ b/src/layouts/default/setting/handler.ts
@@ -67,6 +67,9 @@ export function handler(event: HandlerEnum, value: any): DeepPartial<ProjectConf
     case HandlerEnum.MENU_FIXED:
       return { menuSetting: { fixed: value } };
 
+    case HandlerEnum.MENU_TRIGGER_MIX_SIDEBAR:
+      return { menuSetting: { mixSideTrigger: value } };
+
     // ============transition==================
     case HandlerEnum.OPEN_PAGE_LOADING:
       appStore.commitPageLoadingState(false);
diff --git a/src/locales/lang/en/layout/setting.ts b/src/locales/lang/en/layout/setting.ts
index 43f697287e5..8d06aaafe09 100644
--- a/src/locales/lang/en/layout/setting.ts
+++ b/src/locales/lang/en/layout/setting.ts
@@ -73,4 +73,8 @@ export default {
 
   fixedHeader: 'Fixed header',
   fixedSideBar: 'Fixed Sidebar',
+
+  mixSidebarTrigger: 'Mixed menu Trigger',
+  triggerHover: 'Hover',
+  triggerClick: 'Click',
 };
diff --git a/src/locales/lang/zh_CN/layout/setting.ts b/src/locales/lang/zh_CN/layout/setting.ts
index 57409008563..18fc675c934 100644
--- a/src/locales/lang/zh_CN/layout/setting.ts
+++ b/src/locales/lang/zh_CN/layout/setting.ts
@@ -72,4 +72,8 @@ export default {
 
   fixedHeader: '固定header',
   fixedSideBar: '固定Sidebar',
+
+  mixSidebarTrigger: '混合菜单触发方式',
+  triggerHover: '悬停',
+  triggerClick: '点击',
 };
diff --git a/src/settings/projectSetting.ts b/src/settings/projectSetting.ts
index 9efe4ef0268..13ed7a0196a 100644
--- a/src/settings/projectSetting.ts
+++ b/src/settings/projectSetting.ts
@@ -1,6 +1,6 @@
 import type { ProjectConfig } from '/@/types/config';
 
-import { MenuTypeEnum, MenuModeEnum, TriggerEnum } from '/@/enums/menuEnum';
+import { MenuTypeEnum, MenuModeEnum, TriggerEnum, MixSidebarTriggerEnum } from '/@/enums/menuEnum';
 import { CacheTypeEnum } from '/@/enums/cacheEnum';
 import { ContentEnum, PermissionModeEnum, ThemeEnum, RouterTransitionEnum } from '/@/enums/appEnum';
 import { primaryColor } from '../../build/config/lessModifyVars';
@@ -109,7 +109,7 @@ const setting: ProjectConfig = {
     // Switch page to close menu
     closeMixSidebarOnChange: false,
     // Module opening method ‘click’ |'hover'
-    mixSideTrigger: 'click',
+    mixSideTrigger: MixSidebarTriggerEnum.CLICK,
   },
 
   // Multi-label
diff --git a/src/types/config.d.ts b/src/types/config.d.ts
index 15cbb55878d..6829293814a 100644
--- a/src/types/config.d.ts
+++ b/src/types/config.d.ts
@@ -1,4 +1,4 @@
-import { MenuTypeEnum, MenuModeEnum, TriggerEnum } from '/@/enums/menuEnum';
+import { MenuTypeEnum, MenuModeEnum, TriggerEnum, MixSidebarTriggerEnum } from '/@/enums/menuEnum';
 import { ContentEnum, PermissionModeEnum, ThemeEnum, RouterTransitionEnum } from '/@/enums/appEnum';
 import { CacheTypeEnum } from '/@/enums/cacheEnum';
 import type { LocaleType } from '/@/locales/types';
@@ -20,7 +20,7 @@ export interface MenuSetting {
   accordion: boolean;
   closeMixSidebarOnChange: boolean;
   collapsedShowTitle: boolean;
-  mixSideTrigger: 'click' | 'hover';
+  mixSideTrigger: MixSidebarTriggerEnum;
 }
 
 export interface MultiTabsSetting {