Compare commits

...

3 Commits

Author SHA1 Message Date
281c3ff3c8 措辞优化 2025-12-04 13:55:53 +08:00
38d44c2487 修改一个参数,就实现默认的四个系统主题快速切换 2025-12-03 19:55:13 +08:00
8c88f8adf5 【issues/9098】tabs标签页关闭异常 2025-12-03 19:06:21 +08:00
6 changed files with 80 additions and 50 deletions

View File

@ -1,14 +1,14 @@
/**
* @description: menu type
* @description: 默认四种菜单主题
*/
export enum MenuTypeEnum {
// left menu
// 左侧边菜单导航风格
SIDEBAR = 'sidebar',
MIX_SIDEBAR = 'mix-sidebar',
// mixin menu
// 顶部栏导航风格
MIX = 'mix',
// top menu
// 侧边折叠导航风格
MIX_SIDEBAR = 'mix-sidebar',
//顶部混合导航风格
TOP_MENU = 'top-menu',
}

View File

@ -9,8 +9,7 @@ import { changeTheme } from '/@/logics/theme';
import { updateDarkTheme } from '/@/logics/theme/dark';
import { useRootSetting } from '/@/hooks/setting/useRootSetting';
import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum';
import { HEADER_PRESET_BG_COLOR_LIST, SIDE_BAR_BG_COLOR_LIST } from '/@/settings/designSetting';
import { getThemeColorByMenuType } from '/@/utils/getThemeColorByMenuType';
import { getConfigByMenuType } from '../../../utils/getConfigByMenuType';
import { isObject } from '/@/utils/is';
import { ThemeEnum } from '/@/enums/appEnum';
import { APP__THEME__COLOR } from '/@/enums/cacheEnum';
@ -27,10 +26,10 @@ export function layoutHandler(event: HandlerEnum, value: any) {
const appStore = useAppStore();
const darkMode = appStore.getDarkMode === ThemeEnum.DARK;
// 根据菜单类型动态获取主题色
const dynamicThemeColor = getThemeColorByMenuType(value.type);
const {themeColor: dynamicThemeColor, headerBgColor, sideBgColor } = getConfigByMenuType(value.type);
if (isHTopMenu) {
baseHandler(event, value);
baseHandler(HandlerEnum.HEADER_THEME, HEADER_PRESET_BG_COLOR_LIST[4]);
baseHandler(HandlerEnum.HEADER_THEME, headerBgColor);
baseHandler(HandlerEnum.CHANGE_THEME_COLOR, dynamicThemeColor);
if (darkMode) {
updateHeaderBgColor();
@ -39,8 +38,8 @@ export function layoutHandler(event: HandlerEnum, value: any) {
baseHandler(HandlerEnum.TABS_THEME, tabsThemeOptions[1].value);
} else if (isMixMenu) {
baseHandler(event, value);
baseHandler(HandlerEnum.HEADER_THEME, HEADER_PRESET_BG_COLOR_LIST[2]);
baseHandler(HandlerEnum.MENU_THEME, SIDE_BAR_BG_COLOR_LIST[3]);
baseHandler(HandlerEnum.HEADER_THEME, headerBgColor);
baseHandler(HandlerEnum.MENU_THEME, sideBgColor);
if (darkMode) {
updateHeaderBgColor();
updateSidebarBgColor();
@ -51,8 +50,8 @@ export function layoutHandler(event: HandlerEnum, value: any) {
} else if (isMixSidebarMenu) {
baseHandler(event, value);
baseHandler(HandlerEnum.CHANGE_THEME_COLOR, dynamicThemeColor);
baseHandler(HandlerEnum.HEADER_THEME, HEADER_PRESET_BG_COLOR_LIST[0]);
baseHandler(HandlerEnum.MENU_THEME, SIDE_BAR_BG_COLOR_LIST[0]);
baseHandler(HandlerEnum.HEADER_THEME, headerBgColor);
baseHandler(HandlerEnum.MENU_THEME, sideBgColor);
if (darkMode) {
updateHeaderBgColor();
updateSidebarBgColor();
@ -60,8 +59,8 @@ export function layoutHandler(event: HandlerEnum, value: any) {
baseHandler(HandlerEnum.TABS_THEME, tabsThemeOptions[1].value);
} else {
baseHandler(event, value);
baseHandler(HandlerEnum.HEADER_THEME, HEADER_PRESET_BG_COLOR_LIST[4]);
baseHandler(HandlerEnum.MENU_THEME, SIDE_BAR_BG_COLOR_LIST[7]);
baseHandler(HandlerEnum.HEADER_THEME, headerBgColor);
baseHandler(HandlerEnum.MENU_THEME, sideBgColor);
if (darkMode) {
updateHeaderBgColor();
updateSidebarBgColor();

View File

@ -50,7 +50,9 @@ export function useTabDropdown(tabContentProps: TabContentProps, getIsTabs: Comp
} else {
// 【TV360X-1039】当只有首页和另一个tab页时关闭左侧禁用
const validTabList = tabStore.getTabList.filter((item) => !item?.meta?.affix);
return validTabList[0].path === state.current?.path;
// update-begin--author:liaozhiyang---date:20251128---for【issues/9098】tabs标签页关闭异常
return validTabList[0]?.path === state.current?.path;
// update-end--author:liaozhiyang---date:20251128---for【issues/9098】tabs标签页关闭异常
}
};
// Close other

View File

@ -10,11 +10,14 @@ import {
SessionTimeoutProcessingEnum,
TabsThemeEnum,
} from '/@/enums/appEnum';
import { SIDE_BAR_BG_COLOR_LIST, HEADER_PRESET_BG_COLOR_LIST } from './designSetting';
import { darkMode } from '/@/settings/designSetting';
import { getThemeColorByMenuType } from '/@/utils/getThemeColorByMenuType';
import { getConfigByMenuType } from '../utils/getConfigByMenuType';
// 修改此属性,实现默认的四个系统主题快速切换
const menuType = MenuTypeEnum.SIDEBAR;
// update-begin--author:liaozhiyang---date:20251201---for【QQYUN-14176】修改一个配置就能切换默认四个主题不需要额外修改颜色等
const { themeColor, headerBgColor, sideBgColor, split, mode } = getConfigByMenuType(menuType);
// update-end--author:liaozhiyang---date:20251201---for【QQYUN-14176】修改一个配置就能切换默认四个主题不需要额外修改颜色等
// ! 改动后需要清空浏览器缓存
const setting: ProjectConfig = {
// 是否显示SettingButton
@ -43,7 +46,7 @@ const setting: ProjectConfig = {
// SessionTimeoutProcessingEnum.PAGE_COVERAGE: 生成登录弹窗,覆盖当前页面
sessionTimeoutProcessing: SessionTimeoutProcessingEnum.ROUTE_JUMP,
// 项目主题色 - 根据导航栏模式确定主题色动态设置
themeColor: getThemeColorByMenuType(menuType),
themeColor: themeColor,
// 项目主题模式
themeMode: darkMode,
@ -71,7 +74,7 @@ const setting: ProjectConfig = {
// 头部配置
headerSetting: {
// 背景色
bgColor: HEADER_PRESET_BG_COLOR_LIST[4],
bgColor: headerBgColor,
// 固定头部
fixed: true,
// 是否显示顶部
@ -93,7 +96,7 @@ const setting: ProjectConfig = {
// 菜单配置
menuSetting: {
// 背景色
bgColor: SIDE_BAR_BG_COLOR_LIST[0],
bgColor: sideBgColor,
// 是否固定住左侧菜单
fixed: true,
// 菜单折叠
@ -110,15 +113,15 @@ const setting: ProjectConfig = {
// 菜单宽度
menuWidth: 210,
// 菜单模式
mode: MenuModeEnum.INLINE,
mode,
// 菜单类型
type: MenuTypeEnum.SIDEBAR,
type: menuType,
// 菜单主题
theme: ThemeEnum.DARK,
theme: ThemeEnum.LIGHT,
// 左侧导航栏文字颜色调整区分彩色和暗黑 (不对应配置)
isThemeBright: false,
// 分割菜单
split: false,
split,
// 顶部菜单布局
topMenuAlign: 'center',
// 折叠触发器的位置

View File

@ -0,0 +1,49 @@
import { MenuTypeEnum, MenuModeEnum } from '/@/enums/menuEnum';
import { APP_PRESET_COLOR_LIST, HEADER_PRESET_BG_COLOR_LIST, SIDE_BAR_BG_COLOR_LIST } from '/@/settings/designSetting';
/**
* 根据菜单类型和模式获取对应的主题色
* @param menuType 菜单类型
*/
export function getConfigByMenuType(menuType: MenuTypeEnum): {
themeColor: string;
headerBgColor: string;
sideBgColor: string;
split: boolean;
mode: MenuModeEnum;
} {
let themeColor;
let headerBgColor;
let sideBgColor;
let split = false;
let mode: MenuModeEnum = MenuModeEnum.INLINE;
if (menuType === MenuTypeEnum.TOP_MENU) {
// 顶部栏导航
themeColor = APP_PRESET_COLOR_LIST[1];
headerBgColor = HEADER_PRESET_BG_COLOR_LIST[4];
mode = MenuModeEnum.HORIZONTAL;
} else if (menuType === MenuTypeEnum.MIX) {
// 顶部混合菜单模式
themeColor = APP_PRESET_COLOR_LIST[2];
headerBgColor = HEADER_PRESET_BG_COLOR_LIST[2];
sideBgColor = SIDE_BAR_BG_COLOR_LIST[3];
split = true;
} else if (menuType === MenuTypeEnum.MIX_SIDEBAR) {
// 侧边折叠导航模式
themeColor = APP_PRESET_COLOR_LIST[1];
headerBgColor = HEADER_PRESET_BG_COLOR_LIST[0];
sideBgColor = SIDE_BAR_BG_COLOR_LIST[0];
} else if (menuType === MenuTypeEnum.SIDEBAR) {
// 侧边栏导航
themeColor = APP_PRESET_COLOR_LIST[1];
headerBgColor = HEADER_PRESET_BG_COLOR_LIST[4];
sideBgColor = SIDE_BAR_BG_COLOR_LIST[7];
}
return {
themeColor,
headerBgColor,
sideBgColor,
split,
mode,
};
}

View File

@ -1,23 +0,0 @@
import { MenuTypeEnum } from '/@/enums/menuEnum';
import { APP_PRESET_COLOR_LIST } from '/@/settings/designSetting';
/**
* 根据菜单类型和模式获取对应的主题色
* @param menuType 菜单类型
*/
export function getThemeColorByMenuType(menuType: MenuTypeEnum): string {
if (menuType === MenuTypeEnum.TOP_MENU) {
// 顶部栏导航
return APP_PRESET_COLOR_LIST[1];
} else if (menuType === MenuTypeEnum.MIX) {
// 顶部混合菜单使用青绿色主题
return APP_PRESET_COLOR_LIST[2];
} else if (menuType === MenuTypeEnum.MIX_SIDEBAR) {
// 侧边折叠导航模式
return APP_PRESET_COLOR_LIST[1];
} else if (menuType === MenuTypeEnum.SIDEBAR) {
// 侧边栏导航
return APP_PRESET_COLOR_LIST[1];
}
return APP_PRESET_COLOR_LIST[1];
}