From fa84a546c6126513fc14d2d09d1a239943bd1edb Mon Sep 17 00:00:00 2001 From: deartibers <947466799@qq.com> Date: Wed, 7 Sep 2022 15:56:10 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AF=BC=E8=88=AA=E6=A0=8F=E8=81=94=E5=8A=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/layout/components/header/index.jsx | 1 - .../src/layout/components/sider/index.jsx | 53 ++----------------- .../src/layout/containers/layout/index.jsx | 31 +++++++++-- .../src/sections/auth/containers/login.jsx | 2 + .../sections/console/containers/console.jsx | 4 +- 5 files changed, 36 insertions(+), 55 deletions(-) diff --git a/web/client/src/layout/components/header/index.jsx b/web/client/src/layout/components/header/index.jsx index 15561db..60bca5c 100644 --- a/web/client/src/layout/components/header/index.jsx +++ b/web/client/src/layout/components/header/index.jsx @@ -42,7 +42,6 @@ const Header = (props) => { footer={ <> {headerItems.map((item,index)=>{ - // console.log('item',item); if(item.hasOwnProperty('items')){ return( { useEffect(() => { const { sections, dispatch, user } = props; let nextItems = leftItems - // let pathname_ = pathname == '/' ? homePath : pathname - // const initKeys = (items, lastKeys) => { - // // console.log('1111111',items); - // for (let it of items) { - // if (it.to && it.to == pathname_) { - // // console.log('22222222222',it.itemKey); - // lastKeys.selectedKeys.push(it.itemKey) - // return lastKeys - // } else if (it.items && it.items.length) { - // const preLastKeys = JSON.parse(JSON.stringify(lastKeys)) - // preLastKeys.openKeys.push(it.itemKey) - // const nextKeys = initKeys(it.items, JSON.parse(JSON.stringify(preLastKeys))) - // if (nextKeys.selectedKeys.length > preLastKeys.selectedKeys.length || nextKeys.openKeys.length > preLastKeys.openKeys.length) { - // return nextKeys - // } - // } - // } - // return lastKeys - // return { - // selectedKeys: [], - // openKeys: [] - // } - // } setItems(nextItems) - // const { selectedKeys, openKeys } = initKeys( - // nextItems, - // { - // selectedKeys: [], - // openKeys: [] - // } - // ) - // if (selectedKeys.length || openKeys.length) { - // setSelectedKeys(selectedKeys) - // setOpenKeys(openKeys) - // } else { - // const lastSelectedKeys = localStorage.getItem('vcmp_selected_sider') - // if (lastSelectedKeys) { - // setSelectedKeys(JSON.parse(lastSelectedKeys)) - // } - // const lastOpenKeys = localStorage.getItem('vcmp_open_sider') - // if (lastOpenKeys) { - // setOpenKeys(JSON.parse(lastOpenKeys)) - // } - // } - scrollbar = new PerfectScrollbar('#page-slider', { suppressScrollX: true }); if (pathname == '/') { dispatch(push(homePath)) @@ -79,11 +35,11 @@ const Sider = (props) => { else { setSelectedKeys(routeSelectedKey) } - const lastOpenKeys = localStorage.getItem('vcmp_open_sider') + const lastOpenKeys = localStorage.getItem('poms_open_sider') if (lastOpenKeys) { setOpenKeys(JSON.parse(lastOpenKeys)) } - }, [window.localStorage.vcmp_open_sider, window.localStorage.vcmp_selected_sider, leftChange]) + }, [window.localStorage.poms_open_sider, window.localStorage.poms_selected_sider, leftChange]) useEffect(() => { if (scrollbar) { @@ -102,12 +58,13 @@ const Sider = (props) => { if (selectItem.to) { dispatch(push(selectItem.to)) } + let myfatherKey = selectItem.to + localStorage.setItem('poms_selected_sider', JSON.stringify([myfatherKey.split('/')[1]])) setSelectedKeys(selectedKeys) - localStorage.setItem('vcmp_selected_sider', JSON.stringify(selectedKeys)) }} onOpenChange={({ openKeys }) => { setOpenKeys(openKeys) - localStorage.setItem('vcmp_open_sider', JSON.stringify(openKeys)) + localStorage.setItem('poms_open_sider', JSON.stringify(openKeys)) }} items={items} /> diff --git a/web/client/src/layout/containers/layout/index.jsx b/web/client/src/layout/containers/layout/index.jsx index 6c3f876..320d652 100644 --- a/web/client/src/layout/containers/layout/index.jsx +++ b/web/client/src/layout/containers/layout/index.jsx @@ -86,7 +86,7 @@ const LayoutContainer = props => { const [leftShow, setLeftShow] = useState(false) useEffect(() => { let topItems = []//头部导航 - // let siderItems = []//侧边导航 + const lastSelectedKeys = localStorage.getItem('poms_selected_sider') let nextItems = []//所有导航 for (let c of sections) { if (typeof c.getNavItem == 'function') { @@ -98,7 +98,7 @@ const LayoutContainer = props => { let itm = deepCopy(item[j]); if (itm.hasOwnProperty('items')) { for (let i = 0; i < itm.items.length; i++) { - itm.items[i].fatherKey=itm.itemKey + itm.items[i].fatherKey = itm.itemKey delete itm.items[i].items } topItems.push(itm) @@ -111,10 +111,25 @@ const LayoutContainer = props => { } } } - setLeftShow(false) setAllItems(nextItems) setHeaderItems(topItems) - // setLeftItems(siderItems) + if (lastSelectedKeys) {//如果有缓存 + for (let i = 0; i < nextItems.length; i++) { + if (JSON.parse(lastSelectedKeys)[0] == nextItems[i].itemKey) { + + let openArr = [] + for (let j = 0; j < nextItems[i].items.length; j++) { + openArr.push(nextItems[i].items[j].itemKey) + } + localStorage.setItem('poms_open_sider', JSON.stringify(openArr)) + setLeftItems(nextItems[i].items) + } + } + setLeftShow(true) + } + else { + setLeftShow(false) + } window.addEventListener('resize', resize_); return () => { @@ -202,12 +217,20 @@ const LayoutContainer = props => { if (val.fatherKey) { for (let i = 0; i < allItems.length; i++) { if (val.fatherKey == allItems[i].itemKey) { + let openArr = [] + for (let j = 0; j < allItems[i].items.length; j++) { + openArr.push(allItems[i].items[j].itemKey) + } + localStorage.setItem('poms_selected_sider', JSON.stringify([val.fatherKey])) + localStorage.setItem('poms_open_sider', JSON.stringify(openArr)) setLeftItems(allItems[i].items) } } setLeftShow(true) } else { + localStorage.setItem('poms_open_sider', JSON.stringify([])) + localStorage.removeItem('poms_selected_sider') setLeftShow(false) } history.push(val.to); diff --git a/web/client/src/sections/auth/containers/login.jsx b/web/client/src/sections/auth/containers/login.jsx index 552086c..168cbee 100644 --- a/web/client/src/sections/auth/containers/login.jsx +++ b/web/client/src/sections/auth/containers/login.jsx @@ -21,6 +21,8 @@ const Login = props => { useEffect(() => { if (user && user.authorized) { dispatch(push('/console')); + localStorage.setItem('poms_open_sider', JSON.stringify([])) + localStorage.removeItem('poms_selected_sider') } }, [user]) diff --git a/web/client/src/sections/console/containers/console.jsx b/web/client/src/sections/console/containers/console.jsx index bc7b83a..653c238 100644 --- a/web/client/src/sections/console/containers/console.jsx +++ b/web/client/src/sections/console/containers/console.jsx @@ -4,7 +4,7 @@ import { Spin, Card } from '@douyinfe/semi-ui'; import '../style.less' const { Meta } = Card; -const Example = (props) => { +const Console = (props) => { const { dispatch, actions, user, loading, socket } = props useEffect(() => { @@ -46,4 +46,4 @@ function mapStateToProps (state) { }; } -export default connect(mapStateToProps)(Example); +export default connect(mapStateToProps)(Console);