diff --git a/src/components/layout/header.js b/src/components/layout/header.js
index 87c2688..c757272 100644
--- a/src/components/layout/header.js
+++ b/src/components/layout/header.js
@@ -5,14 +5,16 @@ import Menus from './menu'
const SubMenu = Menu.SubMenu
-function Header ({user, logout, switchSider, siderFold, isNavbar, menuPopoverVisible, location, switchMenuPopover}) {
+function Header ({user, logout, switchSider, siderFold, isNavbar, menuPopoverVisible, location, switchMenuPopover, navOpenKeys, changeOpenKeys}) {
let handleClickMenu = e => e.key === 'logout' && logout()
const menusProps = {
siderFold: false,
darkTheme: false,
isNavbar,
handleClickNavMenu: switchMenuPopover,
- location
+ location,
+ navOpenKeys,
+ changeOpenKeys
}
return (
diff --git a/src/components/layout/menu.js b/src/components/layout/menu.js
index 9344ccd..59653b3 100644
--- a/src/components/layout/menu.js
+++ b/src/components/layout/menu.js
@@ -26,14 +26,42 @@ const getMenus = function (menuArray, siderFold, parentPath) {
})
}
-function Menus ({ siderFold, darkTheme, location, isNavbar, handleClickNavMenu }) {
+function Menus ({ siderFold, darkTheme, location, isNavbar, handleClickNavMenu, navOpenKeys, changeOpenKeys }) {
const menuItems = getMenus(menu, siderFold)
+
+ const onOpenChange = (openKeys) => {
+ const latestOpenKey = openKeys.find(key => !(navOpenKeys.indexOf(key) > -1))
+ const latestCloseKey = navOpenKeys.find(key => !(openKeys.indexOf(key) > -1))
+ let nextOpenKeys = [];
+ if (latestOpenKey) {
+ nextOpenKeys = getAncestorKeys(latestOpenKey).concat(latestOpenKey)
+ }
+ if (latestCloseKey) {
+ nextOpenKeys = getAncestorKeys(latestCloseKey)
+ }
+ changeOpenKeys(nextOpenKeys)
+ }
+ const getAncestorKeys = (key) => {
+ const map = {
+ // navChildParent: ['navParent'],
+ navigation2: ['navigation']
+ }
+ return map[key] || []
+ }
+ let menuProps = {}
+ if(!siderFold) {//菜单栏收起时,不能操作openKeys
+ menuProps = {
+ onOpenChange: onOpenChange,
+ openKeys: navOpenKeys
+ }
+ }
+
return (
diff --git a/src/components/layout/sider.js b/src/components/layout/sider.js
index 882fa92..6cc10da 100644
--- a/src/components/layout/sider.js
+++ b/src/components/layout/sider.js
@@ -4,11 +4,13 @@ import styles from './main.less'
import { config } from '../../utils'
import Menus from './menu'
-function Sider ({ siderFold, darkTheme, location, changeTheme }) {
+function Sider ({ siderFold, darkTheme, location, changeTheme, navOpenKeys, changeOpenKeys }) {
const menusProps = {
siderFold,
darkTheme,
- location
+ location,
+ navOpenKeys,
+ changeOpenKeys
}
return (
diff --git a/src/components/users/list.js b/src/components/users/list.js
index 23e4247..2d64112 100644
--- a/src/components/users/list.js
+++ b/src/components/users/list.js
@@ -45,6 +45,7 @@ class list extends React.Component {
}
getBodyWrapper = (body) => {
+ // 切换分页去除动画;
if (this.currentPage !== this.newPage) {
this.currentPage = this.newPage
return body
@@ -60,6 +61,11 @@ class list extends React.Component {
e.target.style.height = 'auto'
}
+ async pageChange(pagination) {
+ await this.props.onPageChange(pagination)
+ this.newPage = pagination.current
+ }
+
render () {
const {
loading,
@@ -133,11 +139,7 @@ class list extends React.Component {
return
{
- onPageChange(page, () => {
- self.newPage = page.current
- })
- }} pagination={pagination} simple rowKey={record => record.id} getBodyWrapper={this.getBodyWrapper} />
+ }} columns={columns} dataSource={dataSource} loading={loading} onChange={::this.pageChange} pagination={pagination} simple rowKey={record => record.id} getBodyWrapper={this.getBodyWrapper} />
}
}
diff --git a/src/models/app.js b/src/models/app.js
index 224675b..af01ed6 100644
--- a/src/models/app.js
+++ b/src/models/app.js
@@ -13,7 +13,8 @@ export default {
menuPopoverVisible: false,
siderFold: localStorage.getItem('antdAdminSiderFold') === 'true',
darkTheme: localStorage.getItem('antdAdminDarkTheme') !== 'false',
- isNavbar: document.body.clientWidth < 769
+ isNavbar: document.body.clientWidth < 769,
+ navOpenKeys: JSON.parse(localStorage.getItem('navOpenKeys') || '[]') //侧边栏菜单打开的keys
},
subscriptions: {
setup ({dispatch}) {
@@ -173,6 +174,12 @@ export default {
...state,
menuPopoverVisible: !state.menuPopoverVisible
}
+ },
+ handleNavOpenKeys(state, action) {
+ return {
+ ...state,
+ ...action.payload
+ }
}
}
}
diff --git a/src/routes/app.js b/src/routes/app.js
index 9088bd7..a56e644 100644
--- a/src/routes/app.js
+++ b/src/routes/app.js
@@ -11,7 +11,7 @@ import { classnames } from '../utils'
import '../components/layout/common.less'
function App ({children, location, dispatch, app}) {
- const {login, loading, loginButtonLoading, user, siderFold, darkTheme, isNavbar, menuPopoverVisible} = app
+ const {login, loading, loginButtonLoading, user, siderFold, darkTheme, isNavbar, menuPopoverVisible, navOpenKeys} = app
const loginProps = {
loading,
loginButtonLoading,
@@ -26,6 +26,7 @@ function App ({children, location, dispatch, app}) {
location,
isNavbar,
menuPopoverVisible,
+ navOpenKeys,
switchMenuPopover () {
dispatch({type: 'app/switchMenuPopver'})
},
@@ -34,6 +35,10 @@ function App ({children, location, dispatch, app}) {
},
switchSider () {
dispatch({type: 'app/switchSider'})
+ },
+ changeOpenKeys(openKeys) {
+ localStorage.setItem('navOpenKeys', JSON.stringify(openKeys))
+ dispatch({ type: 'app/handleNavOpenKeys', payload: { navOpenKeys: openKeys } })
}
}
@@ -41,8 +46,13 @@ function App ({children, location, dispatch, app}) {
siderFold,
darkTheme,
location,
+ navOpenKeys,
changeTheme () {
dispatch({type: 'app/changeTheme'})
+ },
+ changeOpenKeys(openKeys) {
+ localStorage.setItem('navOpenKeys', JSON.stringify(openKeys))
+ dispatch({ type: 'app/handleNavOpenKeys', payload: { navOpenKeys: openKeys } })
}
}
diff --git a/src/routes/users.js b/src/routes/users.js
index 92d9e4f..2832ddf 100644
--- a/src/routes/users.js
+++ b/src/routes/users.js
@@ -30,17 +30,16 @@ function Users ({ location, dispatch, users }) {
dataSource: list,
loading,
pagination: pagination,
- async onPageChange (page, callback) {
- const query = location.query
- await dispatch(routerRedux.push({
- pathname: '/users',
+ onPageChange (page) {
+ const { query, pathname } = location
+ dispatch(routerRedux.push({
+ pathname: pathname,
query: {
...query,
page: page.current,
pageSize: page.pageSize
}
}))
- await callback && callback()
},
onDeleteItem (id) {
dispatch({