导航栏联动

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(
                                 <Nav.Sub

web/client/src/layout/components/sider/index.jsx

@@ -16,51 +16,7 @@ const Sider = (props) => {
     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}
             />

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') {
@@ -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);

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])
 

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);