Commit 01c56ed9 by maolipeng

Merge branch 'feature/maolipeng/youhua' into dev

# Conflicts:
#	src/modules/root/Menu.tsx
parents ad971717 de1de24e
import React, { useContext, useEffect, useRef, useState } from 'react'; import React, { Key, useContext, useEffect, useRef, useState } from 'react';
import { import {
withRouter, withRouter,
} from 'react-router-dom'; } from 'react-router-dom';
...@@ -129,6 +129,7 @@ function Aside(props: any) { ...@@ -129,6 +129,7 @@ function Aside(props: any) {
const ctx: any = useContext(XMContext); const ctx: any = useContext(XMContext);
const [selectKey, setSelectKey] = useState(); const [selectKey, setSelectKey] = useState();
const [openKeys, setOpenKeys] = useState(['']); const [openKeys, setOpenKeys] = useState(['']);
const [lastOpenKeys, setLastOpenKeys] = useState(['']);
const [topLogoUrl, setTopLogoUrl] = useState("") const [topLogoUrl, setTopLogoUrl] = useState("")
const [collapsed, setCollapsed] = useState(false) const [collapsed, setCollapsed] = useState(false)
const rootSubmenuKeys = _.pluck(menuList, 'groupCode'); const rootSubmenuKeys = _.pluck(menuList, 'groupCode');
...@@ -138,6 +139,7 @@ function Aside(props: any) { ...@@ -138,6 +139,7 @@ function Aside(props: any) {
if (link.indexOf(item.link) !== -1) { if (link.indexOf(item.link) !== -1) {
setSelectKey(item.groupCode); setSelectKey(item.groupCode);
setOpenKeys([]) setOpenKeys([])
setLastOpenKeys([])
} else if (item.children) { } else if (item.children) {
item.children.map((_item: any, _index: any) => { item.children.map((_item: any, _index: any) => {
if (link.indexOf(_item.link) !== -1) { if (link.indexOf(_item.link) !== -1) {
...@@ -170,26 +172,41 @@ function Aside(props: any) { ...@@ -170,26 +172,41 @@ function Aside(props: any) {
// setOpenKeys([]) // setOpenKeys([])
// } // }
} }
function onOpenChange(key: any) { function onOpenChange(key: Key[]) {
if (openKeys.includes(key)) { if (typeof key === "string") {
setOpenKeys([]); if (openKeys.includes(key)) {
} else { setOpenKeys([]);
setOpenKeys([key]); setLastOpenKeys([]);
} else {
setOpenKeys([key]);
setLastOpenKeys([key])
}
} }
} }
function onOpenChangeForHover(key: any) {
function onOpenChangeForHover(key: Key[]) {
if (menuType) { if (menuType) {
return return
} }
if (openKeys.includes(key)) { if (typeof key === "string") {
setOpenKeys([]); if (openKeys.includes(key)) {
} else { setOpenKeys([]);
setOpenKeys([key]); setLastOpenKeys([]);
} else {
setOpenKeys([key]);
setLastOpenKeys([key])
}
} }
} }
function handleMenu() { function handleMenu() {
handleMenuType(); handleMenuType();
setCollapsed(!collapsed) setCollapsed(!collapsed)
if (!collapsed) {
setOpenKeys([])
} else {
setOpenKeys(lastOpenKeys)
}
} }
return ( return (
...@@ -228,7 +245,9 @@ function Aside(props: any) { ...@@ -228,7 +245,9 @@ function Aside(props: any) {
<Menu <Menu
style={{ minHeight: "100%", background: '#0E1935' }} style={{ minHeight: "100%", background: '#0E1935' }}
selectedKeys={selectKey} selectedKeys={selectKey}
inlineCollapsed={collapsed} openKeys={openKeys}
onOpenChange={onOpenChange}
// inlineCollapsed={collapsed}
mode={menuType ? "inline" : "vertical"} mode={menuType ? "inline" : "vertical"}
> >
{ {
...@@ -242,13 +261,15 @@ function Aside(props: any) { ...@@ -242,13 +261,15 @@ function Aside(props: any) {
style={{ marginTop: 0 }} style={{ marginTop: 0 }}
icon={<img src={item.img} className="icon-img"></img>} icon={<img src={item.img} className="icon-img"></img>}
title={<span>{item.groupName}</span>} title={<span>{item.groupName}</span>}
onTitleClick={() => onOpenChange(item.groupCode)}> onTitleClick={() => onOpenChange(item.groupCode)}
onTitleMouseEnter={()=> onOpenChangeForHover(item.groupCode)}
>
{ {
item.children.map((_item: any, _index: any) => { item.children.map((_item: any, _index: any) => {
if (ctx.xmState.storeUserPermissionList.indexOf(_item.groupCode) === -1) { if (ctx.xmState.storeUserPermissionList.indexOf(_item.groupCode) === -1) {
return null; return null;
} }
return <Menu.Item onClick={() => { toggleMenu(_item) }} style={{ marginTop: 0 }} key={_item.groupCode + index + _index}> return <Menu.Item onClick={() => { toggleMenu(_item) }} style={{ marginTop: 0 }} key={_item.groupCode + index + _index} onMouseLeave={()=> onOpenChangeForHover(item.groupCode)}>
<span className="name">{_item.groupName}</span> <span className="name">{_item.groupName}</span>
</Menu.Item> </Menu.Item>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment