style: lint格式化文件
This commit is contained in:
@ -1,164 +1,154 @@
|
||||
<template>
|
||||
<Menu
|
||||
:selectedKeys="selectedKeys"
|
||||
:defaultSelectedKeys="defaultSelectedKeys"
|
||||
:mode="mode"
|
||||
:openKeys="getOpenKeys"
|
||||
:inlineIndent="inlineIndent"
|
||||
:theme="theme"
|
||||
@open-change="handleOpenChange"
|
||||
:class="getMenuClass"
|
||||
@click="handleMenuClick"
|
||||
:subMenuOpenDelay="0.2"
|
||||
v-bind="getInlineCollapseOptions"
|
||||
>
|
||||
<template v-for="item in items" :key="item.path">
|
||||
<BasicSubMenuItem :item="item" :theme="theme" :isHorizontal="isHorizontal" />
|
||||
</template>
|
||||
</Menu>
|
||||
<Menu
|
||||
:selectedKeys="selectedKeys"
|
||||
:defaultSelectedKeys="defaultSelectedKeys"
|
||||
:mode="mode"
|
||||
:openKeys="getOpenKeys"
|
||||
:inlineIndent="inlineIndent"
|
||||
:theme="theme"
|
||||
@open-change="handleOpenChange"
|
||||
:class="getMenuClass"
|
||||
@click="handleMenuClick"
|
||||
:subMenuOpenDelay="0.2"
|
||||
v-bind="getInlineCollapseOptions"
|
||||
>
|
||||
<template v-for="item in items" :key="item.path">
|
||||
<BasicSubMenuItem :item="item" :theme="theme" :isHorizontal="isHorizontal" />
|
||||
</template>
|
||||
</Menu>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import type { MenuState } from './types';
|
||||
import { computed, defineComponent, unref, reactive, watch, toRefs, ref } from 'vue';
|
||||
import { Menu } from 'ant-design-vue';
|
||||
import BasicSubMenuItem from './components/BasicSubMenuItem.vue';
|
||||
import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum';
|
||||
import { useOpenKeys } from './useOpenKeys';
|
||||
import { RouteLocationNormalizedLoaded, useRouter } from 'vue-router';
|
||||
import { isFunction } from '/@/utils/is';
|
||||
import { basicProps } from './props';
|
||||
import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
|
||||
import { REDIRECT_NAME } from '/@/router/constant';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import { getCurrentParentPath } from '/@/router/menus';
|
||||
import { listenerRouteChange } from '/@/logics/mitt/routeChange';
|
||||
import { getAllParentPath } from '/@/router/helper/menuHelper';
|
||||
import type { MenuState } from './types';
|
||||
import { computed, defineComponent, unref, reactive, watch, toRefs, ref } from 'vue';
|
||||
import { Menu } from 'ant-design-vue';
|
||||
import BasicSubMenuItem from './components/BasicSubMenuItem.vue';
|
||||
import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum';
|
||||
import { useOpenKeys } from './useOpenKeys';
|
||||
import { RouteLocationNormalizedLoaded, useRouter } from 'vue-router';
|
||||
import { isFunction } from '/@/utils/is';
|
||||
import { basicProps } from './props';
|
||||
import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
|
||||
import { REDIRECT_NAME } from '/@/router/constant';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import { getCurrentParentPath } from '/@/router/menus';
|
||||
import { listenerRouteChange } from '/@/logics/mitt/routeChange';
|
||||
import { getAllParentPath } from '/@/router/helper/menuHelper';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'BasicMenu',
|
||||
components: {
|
||||
Menu,
|
||||
BasicSubMenuItem,
|
||||
},
|
||||
props: basicProps,
|
||||
emits: ['menuClick'],
|
||||
setup(props, { emit }) {
|
||||
const isClickGo = ref(false);
|
||||
const currentActiveMenu = ref('');
|
||||
export default defineComponent({
|
||||
name: 'BasicMenu',
|
||||
components: {
|
||||
Menu,
|
||||
BasicSubMenuItem
|
||||
},
|
||||
props: basicProps,
|
||||
emits: ['menuClick'],
|
||||
setup(props, { emit }) {
|
||||
const isClickGo = ref(false);
|
||||
const currentActiveMenu = ref('');
|
||||
|
||||
const menuState = reactive<MenuState>({
|
||||
defaultSelectedKeys: [],
|
||||
openKeys: [],
|
||||
selectedKeys: [],
|
||||
collapsedOpenKeys: [],
|
||||
});
|
||||
const menuState = reactive<MenuState>({
|
||||
defaultSelectedKeys: [],
|
||||
openKeys: [],
|
||||
selectedKeys: [],
|
||||
collapsedOpenKeys: []
|
||||
});
|
||||
|
||||
const { prefixCls } = useDesign('basic-menu');
|
||||
const { items, mode, accordion } = toRefs(props);
|
||||
const { prefixCls } = useDesign('basic-menu');
|
||||
const { items, mode, accordion } = toRefs(props);
|
||||
|
||||
const { getCollapsed, getTopMenuAlign, getSplit } = useMenuSetting();
|
||||
const { getCollapsed, getTopMenuAlign, getSplit } = useMenuSetting();
|
||||
|
||||
const { currentRoute } = useRouter();
|
||||
const { currentRoute } = useRouter();
|
||||
|
||||
const { handleOpenChange, setOpenKeys, getOpenKeys } = useOpenKeys(
|
||||
menuState,
|
||||
items,
|
||||
mode as any,
|
||||
accordion,
|
||||
);
|
||||
const { handleOpenChange, setOpenKeys, getOpenKeys } = useOpenKeys(menuState, items, mode as any, accordion);
|
||||
|
||||
const getIsTopMenu = computed(() => {
|
||||
const { type, mode } = props;
|
||||
const getIsTopMenu = computed(() => {
|
||||
const { type, mode } = props;
|
||||
|
||||
return (
|
||||
(type === MenuTypeEnum.TOP_MENU && mode === MenuModeEnum.HORIZONTAL) ||
|
||||
(props.isHorizontal && unref(getSplit))
|
||||
);
|
||||
});
|
||||
return (type === MenuTypeEnum.TOP_MENU && mode === MenuModeEnum.HORIZONTAL) || (props.isHorizontal && unref(getSplit));
|
||||
});
|
||||
|
||||
const getMenuClass = computed(() => {
|
||||
const align = props.isHorizontal && unref(getSplit) ? 'start' : unref(getTopMenuAlign);
|
||||
return [
|
||||
prefixCls,
|
||||
`justify-${align}`,
|
||||
{
|
||||
[`${prefixCls}__second`]: !props.isHorizontal && unref(getSplit),
|
||||
[`${prefixCls}__sidebar-hor`]: unref(getIsTopMenu),
|
||||
},
|
||||
];
|
||||
});
|
||||
const getMenuClass = computed(() => {
|
||||
const align = props.isHorizontal && unref(getSplit) ? 'start' : unref(getTopMenuAlign);
|
||||
return [
|
||||
prefixCls,
|
||||
`justify-${align}`,
|
||||
{
|
||||
[`${prefixCls}__second`]: !props.isHorizontal && unref(getSplit),
|
||||
[`${prefixCls}__sidebar-hor`]: unref(getIsTopMenu)
|
||||
}
|
||||
];
|
||||
});
|
||||
|
||||
const getInlineCollapseOptions = computed(() => {
|
||||
const isInline = props.mode === MenuModeEnum.INLINE;
|
||||
const getInlineCollapseOptions = computed(() => {
|
||||
const isInline = props.mode === MenuModeEnum.INLINE;
|
||||
|
||||
const inlineCollapseOptions: { inlineCollapsed?: boolean } = {};
|
||||
if (isInline) {
|
||||
inlineCollapseOptions.inlineCollapsed = props.mixSider ? false : unref(getCollapsed);
|
||||
const inlineCollapseOptions: { inlineCollapsed?: boolean } = {};
|
||||
if (isInline) {
|
||||
inlineCollapseOptions.inlineCollapsed = props.mixSider ? false : unref(getCollapsed);
|
||||
}
|
||||
return inlineCollapseOptions;
|
||||
});
|
||||
|
||||
listenerRouteChange((route) => {
|
||||
if (route.name === REDIRECT_NAME) return;
|
||||
handleMenuChange(route);
|
||||
currentActiveMenu.value = route.meta?.currentActiveMenu as string;
|
||||
|
||||
if (unref(currentActiveMenu)) {
|
||||
menuState.selectedKeys = [unref(currentActiveMenu)];
|
||||
setOpenKeys(unref(currentActiveMenu));
|
||||
}
|
||||
});
|
||||
|
||||
!props.mixSider &&
|
||||
watch(
|
||||
() => props.items,
|
||||
() => {
|
||||
handleMenuChange();
|
||||
}
|
||||
);
|
||||
|
||||
async function handleMenuClick({ key }: { key: string; keyPath: string[] }) {
|
||||
const { beforeClickFn } = props;
|
||||
if (beforeClickFn && isFunction(beforeClickFn)) {
|
||||
const flag = await beforeClickFn(key);
|
||||
if (!flag) return;
|
||||
}
|
||||
emit('menuClick', key);
|
||||
|
||||
isClickGo.value = true;
|
||||
menuState.selectedKeys = [key];
|
||||
}
|
||||
|
||||
async function handleMenuChange(route?: RouteLocationNormalizedLoaded) {
|
||||
if (unref(isClickGo)) {
|
||||
isClickGo.value = false;
|
||||
return;
|
||||
}
|
||||
const path = (route || unref(currentRoute)).meta?.currentActiveMenu || (route || unref(currentRoute)).path;
|
||||
setOpenKeys(path);
|
||||
if (unref(currentActiveMenu)) return;
|
||||
if (props.isHorizontal && unref(getSplit)) {
|
||||
const parentPath = await getCurrentParentPath(path);
|
||||
menuState.selectedKeys = [parentPath];
|
||||
} else {
|
||||
const parentPaths = await getAllParentPath(props.items, path);
|
||||
menuState.selectedKeys = parentPaths;
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
handleMenuClick,
|
||||
getInlineCollapseOptions,
|
||||
getMenuClass,
|
||||
handleOpenChange,
|
||||
getOpenKeys,
|
||||
...toRefs(menuState)
|
||||
};
|
||||
}
|
||||
return inlineCollapseOptions;
|
||||
});
|
||||
|
||||
listenerRouteChange((route) => {
|
||||
if (route.name === REDIRECT_NAME) return;
|
||||
handleMenuChange(route);
|
||||
currentActiveMenu.value = route.meta?.currentActiveMenu as string;
|
||||
|
||||
if (unref(currentActiveMenu)) {
|
||||
menuState.selectedKeys = [unref(currentActiveMenu)];
|
||||
setOpenKeys(unref(currentActiveMenu));
|
||||
}
|
||||
});
|
||||
|
||||
!props.mixSider &&
|
||||
watch(
|
||||
() => props.items,
|
||||
() => {
|
||||
handleMenuChange();
|
||||
},
|
||||
);
|
||||
|
||||
async function handleMenuClick({ key }: { key: string; keyPath: string[] }) {
|
||||
const { beforeClickFn } = props;
|
||||
if (beforeClickFn && isFunction(beforeClickFn)) {
|
||||
const flag = await beforeClickFn(key);
|
||||
if (!flag) return;
|
||||
}
|
||||
emit('menuClick', key);
|
||||
|
||||
isClickGo.value = true;
|
||||
menuState.selectedKeys = [key];
|
||||
}
|
||||
|
||||
async function handleMenuChange(route?: RouteLocationNormalizedLoaded) {
|
||||
if (unref(isClickGo)) {
|
||||
isClickGo.value = false;
|
||||
return;
|
||||
}
|
||||
const path =
|
||||
(route || unref(currentRoute)).meta?.currentActiveMenu ||
|
||||
(route || unref(currentRoute)).path;
|
||||
setOpenKeys(path);
|
||||
if (unref(currentActiveMenu)) return;
|
||||
if (props.isHorizontal && unref(getSplit)) {
|
||||
const parentPath = await getCurrentParentPath(path);
|
||||
menuState.selectedKeys = [parentPath];
|
||||
} else {
|
||||
const parentPaths = await getAllParentPath(props.items, path);
|
||||
menuState.selectedKeys = parentPaths;
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
handleMenuClick,
|
||||
getInlineCollapseOptions,
|
||||
getMenuClass,
|
||||
handleOpenChange,
|
||||
getOpenKeys,
|
||||
...toRefs(menuState),
|
||||
};
|
||||
},
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<style lang="less">
|
||||
@import './index.less';
|
||||
@import './index.less';
|
||||
</style>
|
||||
|
||||
@ -1,20 +1,20 @@
|
||||
<template>
|
||||
<MenuItem :key="item.path">
|
||||
<MenuItemContent v-bind="$props" :item="item" />
|
||||
</MenuItem>
|
||||
<MenuItem :key="item.path">
|
||||
<MenuItemContent v-bind="$props" :item="item" />
|
||||
</MenuItem>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { Menu } from 'ant-design-vue';
|
||||
import { itemProps } from '../props';
|
||||
import { defineComponent } from 'vue';
|
||||
import { Menu } from 'ant-design-vue';
|
||||
import { itemProps } from '../props';
|
||||
|
||||
import MenuItemContent from './MenuItemContent.vue';
|
||||
export default defineComponent({
|
||||
name: 'BasicMenuItem',
|
||||
components: { MenuItem: Menu.Item, MenuItemContent },
|
||||
props: itemProps,
|
||||
setup() {
|
||||
return {};
|
||||
},
|
||||
});
|
||||
import MenuItemContent from './MenuItemContent.vue';
|
||||
export default defineComponent({
|
||||
name: 'BasicMenuItem',
|
||||
components: { MenuItem: Menu.Item, MenuItemContent },
|
||||
props: itemProps,
|
||||
setup() {
|
||||
return {};
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -1,55 +1,45 @@
|
||||
<template>
|
||||
<BasicMenuItem v-if="!menuHasChildren(item) && getShowMenu" v-bind="$props" />
|
||||
<SubMenu
|
||||
v-if="menuHasChildren(item) && getShowMenu"
|
||||
:class="[theme]"
|
||||
:key="`submenu-${item.path}`"
|
||||
popupClassName="app-top-menu-popup"
|
||||
>
|
||||
<template #title>
|
||||
<MenuItemContent v-bind="$props" :item="item" />
|
||||
</template>
|
||||
<BasicMenuItem v-if="!menuHasChildren(item) && getShowMenu" v-bind="$props" />
|
||||
<SubMenu v-if="menuHasChildren(item) && getShowMenu" :class="[theme]" :key="`submenu-${item.path}`" popupClassName="app-top-menu-popup">
|
||||
<template #title>
|
||||
<MenuItemContent v-bind="$props" :item="item" />
|
||||
</template>
|
||||
|
||||
<template v-for="childrenItem in item.children || []" :key="childrenItem.path">
|
||||
<BasicSubMenuItem v-bind="$props" :item="childrenItem" />
|
||||
</template>
|
||||
</SubMenu>
|
||||
<template v-for="childrenItem in item.children || []" :key="childrenItem.path">
|
||||
<BasicSubMenuItem v-bind="$props" :item="childrenItem" />
|
||||
</template>
|
||||
</SubMenu>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import type { Menu as MenuType } from '/@/router/types';
|
||||
import { defineComponent, computed } from 'vue';
|
||||
import { Menu } from 'ant-design-vue';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import { itemProps } from '../props';
|
||||
import BasicMenuItem from './BasicMenuItem.vue';
|
||||
import MenuItemContent from './MenuItemContent.vue';
|
||||
import type { Menu as MenuType } from '/@/router/types';
|
||||
import { defineComponent, computed } from 'vue';
|
||||
import { Menu } from 'ant-design-vue';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import { itemProps } from '../props';
|
||||
import BasicMenuItem from './BasicMenuItem.vue';
|
||||
import MenuItemContent from './MenuItemContent.vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'BasicSubMenuItem',
|
||||
isSubMenu: true,
|
||||
components: {
|
||||
BasicMenuItem,
|
||||
SubMenu: Menu.SubMenu,
|
||||
MenuItemContent,
|
||||
},
|
||||
props: itemProps,
|
||||
setup(props) {
|
||||
const { prefixCls } = useDesign('basic-menu-item');
|
||||
export default defineComponent({
|
||||
name: 'BasicSubMenuItem',
|
||||
isSubMenu: true,
|
||||
components: {
|
||||
BasicMenuItem,
|
||||
SubMenu: Menu.SubMenu,
|
||||
MenuItemContent
|
||||
},
|
||||
props: itemProps,
|
||||
setup(props) {
|
||||
const { prefixCls } = useDesign('basic-menu-item');
|
||||
|
||||
const getShowMenu = computed(() => !props.item.meta?.hideMenu);
|
||||
function menuHasChildren(menuTreeItem: MenuType): boolean {
|
||||
return (
|
||||
!menuTreeItem.meta?.hideChildrenInMenu &&
|
||||
Reflect.has(menuTreeItem, 'children') &&
|
||||
!!menuTreeItem.children &&
|
||||
menuTreeItem.children.length > 0
|
||||
);
|
||||
}
|
||||
return {
|
||||
prefixCls,
|
||||
menuHasChildren,
|
||||
getShowMenu,
|
||||
};
|
||||
},
|
||||
});
|
||||
const getShowMenu = computed(() => !props.item.meta?.hideMenu);
|
||||
function menuHasChildren(menuTreeItem: MenuType): boolean {
|
||||
return !menuTreeItem.meta?.hideChildrenInMenu && Reflect.has(menuTreeItem, 'children') && !!menuTreeItem.children && menuTreeItem.children.length > 0;
|
||||
}
|
||||
return {
|
||||
prefixCls,
|
||||
menuHasChildren,
|
||||
getShowMenu
|
||||
};
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -1,34 +1,34 @@
|
||||
<template>
|
||||
<span :class="`${prefixCls}- flex items-center `">
|
||||
<Icon v-if="getIcon" :icon="getIcon" :size="18" :class="`${prefixCls}-wrapper__icon mr-2`" />
|
||||
{{ getI18nName }}
|
||||
</span>
|
||||
<span :class="`${prefixCls}- flex items-center `">
|
||||
<Icon v-if="getIcon" :icon="getIcon" :size="18" :class="`${prefixCls}-wrapper__icon mr-2`" />
|
||||
{{ getI18nName }}
|
||||
</span>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent } from 'vue';
|
||||
import { computed, defineComponent } from 'vue';
|
||||
|
||||
import Icon from '/@/components/Icon/index';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import { contentProps } from '../props';
|
||||
const { t } = useI18n();
|
||||
import Icon from '/@/components/Icon/index';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import { contentProps } from '../props';
|
||||
const { t } = useI18n();
|
||||
|
||||
export default defineComponent({
|
||||
name: 'MenuItemContent',
|
||||
components: {
|
||||
Icon,
|
||||
},
|
||||
props: contentProps,
|
||||
setup(props) {
|
||||
const { prefixCls } = useDesign('basic-menu-item-content');
|
||||
const getI18nName = computed(() => t(props.item?.name));
|
||||
const getIcon = computed(() => props.item?.icon);
|
||||
export default defineComponent({
|
||||
name: 'MenuItemContent',
|
||||
components: {
|
||||
Icon
|
||||
},
|
||||
props: contentProps,
|
||||
setup(props) {
|
||||
const { prefixCls } = useDesign('basic-menu-item-content');
|
||||
const getI18nName = computed(() => t(props.item?.name));
|
||||
const getIcon = computed(() => props.item?.icon);
|
||||
|
||||
return {
|
||||
prefixCls,
|
||||
getI18nName,
|
||||
getIcon,
|
||||
};
|
||||
},
|
||||
});
|
||||
return {
|
||||
prefixCls,
|
||||
getI18nName,
|
||||
getIcon
|
||||
};
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -1,74 +1,74 @@
|
||||
@basic-menu-prefix-cls: ~'@{namespace}-basic-menu';
|
||||
|
||||
.app-top-menu-popup {
|
||||
min-width: 150px;
|
||||
min-width: 150px;
|
||||
}
|
||||
|
||||
.@{basic-menu-prefix-cls} {
|
||||
width: 100%;
|
||||
width: 100%;
|
||||
|
||||
.ant-menu-item {
|
||||
transition: unset;
|
||||
}
|
||||
|
||||
&__sidebar-hor {
|
||||
&.ant-menu-horizontal {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
&.ant-menu-dark {
|
||||
background-color: transparent;
|
||||
|
||||
.ant-menu-submenu:hover,
|
||||
.ant-menu-item-open,
|
||||
.ant-menu-submenu-open,
|
||||
.ant-menu-item-selected,
|
||||
.ant-menu-submenu-selected,
|
||||
.ant-menu-item:hover,
|
||||
.ant-menu-item-active,
|
||||
.ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open,
|
||||
.ant-menu-submenu-active,
|
||||
.ant-menu-submenu-title:hover {
|
||||
color: #fff;
|
||||
background-color: @top-menu-active-bg-color !important;
|
||||
}
|
||||
|
||||
.ant-menu-item:hover,
|
||||
.ant-menu-item-active,
|
||||
.ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open,
|
||||
.ant-menu-submenu-active,
|
||||
.ant-menu-submenu-title:hover {
|
||||
background-color: @top-menu-active-bg-color;
|
||||
}
|
||||
|
||||
.@{basic-menu-prefix-cls}-item__level1 {
|
||||
background-color: transparent;
|
||||
|
||||
&.ant-menu-item-selected,
|
||||
&.ant-menu-submenu-selected {
|
||||
background-color: @top-menu-active-bg-color !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-menu-item,
|
||||
.ant-menu-submenu {
|
||||
&.@{basic-menu-prefix-cls}-item__level1,
|
||||
.ant-menu-submenu-title {
|
||||
height: @header-height;
|
||||
line-height: @header-height;
|
||||
}
|
||||
}
|
||||
}
|
||||
.ant-menu-item {
|
||||
transition: unset;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-menu-submenu,
|
||||
.ant-menu-submenu-inline {
|
||||
transition: unset;
|
||||
}
|
||||
&__sidebar-hor {
|
||||
&.ant-menu-horizontal {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.ant-menu-inline.ant-menu-sub {
|
||||
box-shadow: unset !important;
|
||||
transition: unset;
|
||||
}
|
||||
&.ant-menu-dark {
|
||||
background-color: transparent;
|
||||
|
||||
.ant-menu-submenu:hover,
|
||||
.ant-menu-item-open,
|
||||
.ant-menu-submenu-open,
|
||||
.ant-menu-item-selected,
|
||||
.ant-menu-submenu-selected,
|
||||
.ant-menu-item:hover,
|
||||
.ant-menu-item-active,
|
||||
.ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open,
|
||||
.ant-menu-submenu-active,
|
||||
.ant-menu-submenu-title:hover {
|
||||
color: #fff;
|
||||
background-color: @top-menu-active-bg-color !important;
|
||||
}
|
||||
|
||||
.ant-menu-item:hover,
|
||||
.ant-menu-item-active,
|
||||
.ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open,
|
||||
.ant-menu-submenu-active,
|
||||
.ant-menu-submenu-title:hover {
|
||||
background-color: @top-menu-active-bg-color;
|
||||
}
|
||||
|
||||
.@{basic-menu-prefix-cls}-item__level1 {
|
||||
background-color: transparent;
|
||||
|
||||
&.ant-menu-item-selected,
|
||||
&.ant-menu-submenu-selected {
|
||||
background-color: @top-menu-active-bg-color !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-menu-item,
|
||||
.ant-menu-submenu {
|
||||
&.@{basic-menu-prefix-cls}-item__level1,
|
||||
.ant-menu-submenu-title {
|
||||
height: @header-height;
|
||||
line-height: @header-height;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ant-menu-submenu,
|
||||
.ant-menu-submenu-inline {
|
||||
transition: unset;
|
||||
}
|
||||
|
||||
.ant-menu-inline.ant-menu-sub {
|
||||
box-shadow: unset !important;
|
||||
transition: unset;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user