diff --git a/packages/app/src/components/menu/index.tsx b/packages/app/src/components/menu/index.tsx
index 5e335a70c..464b11831 100644
--- a/packages/app/src/components/menu/index.tsx
+++ b/packages/app/src/components/menu/index.tsx
@@ -28,7 +28,7 @@ export default (props: any) => {
const subItems = children.filter(child => child.showInMenu);
if (!hideChildren && subItems.length > 1) {
return (
-
{item.title}>}>
+ } title={<>{item.title}>}>
{subItems.map((child: any) => (
{child.title}
@@ -38,8 +38,8 @@ export default (props: any) => {
)
}
return (
-
- {item.title}
+ } key={item.path}>
+ {item.title}
)
})}
diff --git a/packages/app/src/components/pages/SideMenuLayout/index.tsx b/packages/app/src/components/pages/SideMenuLayout/index.tsx
index 3e3cebc27..6e61f9f6a 100644
--- a/packages/app/src/components/pages/SideMenuLayout/index.tsx
+++ b/packages/app/src/components/pages/SideMenuLayout/index.tsx
@@ -1,16 +1,26 @@
-import React from 'react';
+import React, { useState } from 'react';
import { Layout, Breadcrumb } from 'antd';
import { Link } from 'umi';
import './style.less';
import Menu from '@/components/menu';
+import { MenuUnfoldOutlined, MenuFoldOutlined } from '@ant-design/icons';
+import { useLocalStorageState } from 'ahooks';
export function SideMenuLayout(props: any) {
- const { menu = [] } = props.page;
- console.log(menu);
+ const { menu = [], id } = props.page;
+ // console.log(menu);
+ const [collapsed, setCollapsed] = useLocalStorageState(`nocobase-menu-collapsed-${id}`, false);
return (
-
+
{props.children}
diff --git a/packages/app/src/components/pages/SideMenuLayout/style.less b/packages/app/src/components/pages/SideMenuLayout/style.less
index ed412ed2e..ea3e7f195 100644
--- a/packages/app/src/components/pages/SideMenuLayout/style.less
+++ b/packages/app/src/components/pages/SideMenuLayout/style.less
@@ -3,7 +3,17 @@
left: 0;
z-index: 100;
box-shadow: 2px 0 8px 0 rgba(29,35,41,.05);
+ &.collapsed {
+ margin-left: -200px;
+ }
.ant-menu-light {
border-right-color: transparent !important;
}
+ .menu-toggle {
+ position: fixed;
+ bottom: 12px;
+ left: 12px;
+ line-height: 1;
+ cursor: pointer;
+ }
}
\ No newline at end of file