Commit e821f4c706c4108a4309a0589223e05e718f15cf

Authored by 无木成林
Committed by GitHub
1 parent af55511b

perf(menu): mixSideTrigger setting (#155)

src/enums/menuEnum.ts
... ... @@ -43,3 +43,8 @@ export enum TopMenuAlignEnum {
43 43 START = 'start',
44 44 END = 'end',
45 45 }
  46 +
  47 +export enum MixSidebarTriggerEnum {
  48 + HOVER = 'hover',
  49 + CLICK = 'click',
  50 +}
... ...
src/layouts/default/setting/SettingDrawer.tsx
... ... @@ -28,6 +28,7 @@ import {
28 28 getMenuTriggerOptions,
29 29 routerTransitionOptions,
30 30 menuTypeList,
  31 + mixSidebarTriggerOptions,
31 32 } from './enum';
32 33  
33 34 import { HEADER_PRESET_BG_COLOR_LIST, SIDE_BAR_BG_COLOR_LIST } from '/@/settings/colorSetting';
... ... @@ -73,6 +74,7 @@ export default defineComponent({
73 74 getSplit,
74 75 getIsMixSidebar,
75 76 getCloseMixSidebarOnChange,
  77 + getMixSideTrigger,
76 78 } = useMenuSetting();
77 79  
78 80 const {
... ... @@ -115,6 +117,14 @@ export default defineComponent({
115 117 def={unref(getCloseMixSidebarOnChange)}
116 118 disabled={!unref(getIsMixSidebar)}
117 119 />
  120 +
  121 + <SelectItem
  122 + title={t('layout.setting.mixSidebarTrigger')}
  123 + event={HandlerEnum.MENU_TRIGGER_MIX_SIDEBAR}
  124 + def={unref(getMixSideTrigger)}
  125 + options={mixSidebarTriggerOptions}
  126 + disabled={!unref(getIsMixSidebar)}
  127 + />
118 128 </>
119 129 );
120 130 }
... ...
src/layouts/default/setting/enum.ts
1 1 import { ContentEnum, RouterTransitionEnum } from '/@/enums/appEnum';
2   -import { MenuModeEnum, MenuTypeEnum, TopMenuAlignEnum, TriggerEnum } from '/@/enums/menuEnum';
  2 +import {
  3 + MenuModeEnum,
  4 + MenuTypeEnum,
  5 + TopMenuAlignEnum,
  6 + TriggerEnum,
  7 + MixSidebarTriggerEnum,
  8 +} from '/@/enums/menuEnum';
3 9  
4 10 import { useI18n } from '/@/hooks/web/useI18n';
5 11  
... ... @@ -20,6 +26,7 @@ export enum HandlerEnum {
20 26 MENU_SPLIT,
21 27 MENU_FIXED,
22 28 MENU_CLOSE_MIX_SIDEBAR_ON_CHANGE,
  29 + MENU_TRIGGER_MIX_SIDEBAR,
23 30  
24 31 // header
25 32 HEADER_SHOW,
... ... @@ -132,3 +139,14 @@ export const menuTypeList = [
132 139 type: MenuTypeEnum.MIX_SIDEBAR,
133 140 },
134 141 ];
  142 +
  143 +export const mixSidebarTriggerOptions = [
  144 + {
  145 + value: MixSidebarTriggerEnum.HOVER,
  146 + label: t('layout.setting.triggerHover'),
  147 + },
  148 + {
  149 + value: MixSidebarTriggerEnum.CLICK,
  150 + label: t('layout.setting.triggerClick'),
  151 + },
  152 +];
... ...
src/layouts/default/setting/handler.ts
... ... @@ -67,6 +67,9 @@ export function handler(event: HandlerEnum, value: any): DeepPartial&lt;ProjectConf
67 67 case HandlerEnum.MENU_FIXED:
68 68 return { menuSetting: { fixed: value } };
69 69  
  70 + case HandlerEnum.MENU_TRIGGER_MIX_SIDEBAR:
  71 + return { menuSetting: { mixSideTrigger: value } };
  72 +
70 73 // ============transition==================
71 74 case HandlerEnum.OPEN_PAGE_LOADING:
72 75 appStore.commitPageLoadingState(false);
... ...
src/locales/lang/en/layout/setting.ts
... ... @@ -73,4 +73,8 @@ export default {
73 73  
74 74 fixedHeader: 'Fixed header',
75 75 fixedSideBar: 'Fixed Sidebar',
  76 +
  77 + mixSidebarTrigger: 'Mixed menu Trigger',
  78 + triggerHover: 'Hover',
  79 + triggerClick: 'Click',
76 80 };
... ...
src/locales/lang/zh_CN/layout/setting.ts
... ... @@ -72,4 +72,8 @@ export default {
72 72  
73 73 fixedHeader: '固定header',
74 74 fixedSideBar: '固定Sidebar',
  75 +
  76 + mixSidebarTrigger: '混合菜单触发方式',
  77 + triggerHover: '悬停',
  78 + triggerClick: '点击',
75 79 };
... ...
src/settings/projectSetting.ts
1 1 import type { ProjectConfig } from '/@/types/config';
2 2  
3   -import { MenuTypeEnum, MenuModeEnum, TriggerEnum } from '/@/enums/menuEnum';
  3 +import { MenuTypeEnum, MenuModeEnum, TriggerEnum, MixSidebarTriggerEnum } from '/@/enums/menuEnum';
4 4 import { CacheTypeEnum } from '/@/enums/cacheEnum';
5 5 import { ContentEnum, PermissionModeEnum, ThemeEnum, RouterTransitionEnum } from '/@/enums/appEnum';
6 6 import { primaryColor } from '../../build/config/lessModifyVars';
... ... @@ -109,7 +109,7 @@ const setting: ProjectConfig = {
109 109 // Switch page to close menu
110 110 closeMixSidebarOnChange: false,
111 111 // Module opening method ‘click’ |'hover'
112   - mixSideTrigger: 'click',
  112 + mixSideTrigger: MixSidebarTriggerEnum.CLICK,
113 113 },
114 114  
115 115 // Multi-label
... ...
src/types/config.d.ts
1   -import { MenuTypeEnum, MenuModeEnum, TriggerEnum } from '/@/enums/menuEnum';
  1 +import { MenuTypeEnum, MenuModeEnum, TriggerEnum, MixSidebarTriggerEnum } from '/@/enums/menuEnum';
2 2 import { ContentEnum, PermissionModeEnum, ThemeEnum, RouterTransitionEnum } from '/@/enums/appEnum';
3 3 import { CacheTypeEnum } from '/@/enums/cacheEnum';
4 4 import type { LocaleType } from '/@/locales/types';
... ... @@ -20,7 +20,7 @@ export interface MenuSetting {
20 20 accordion: boolean;
21 21 closeMixSidebarOnChange: boolean;
22 22 collapsedShowTitle: boolean;
23   - mixSideTrigger: 'click' | 'hover';
  23 + mixSideTrigger: MixSidebarTriggerEnum;
24 24 }
25 25  
26 26 export interface MultiTabsSetting {
... ...