Yansen 2 年前
父节点
当前提交
ce684fe1fc

+ 2
- 1
src/index.less 查看文件

29
   background-color: #f0f2f5;
29
   background-color: #f0f2f5;
30
 }
30
 }
31
 
31
 
32
-.layout-background {
32
+.layout-sidebar {
33
   background-color: var(--theme-color);
33
   background-color: var(--theme-color);
34
   color: var(--theme-front);
34
   color: var(--theme-front);
35
+  box-shadow: 2px 0 8px 0 rgba(29,35,41,.05);
35
 }
36
 }
36
 
37
 
37
 
38
 

+ 4
- 3
src/layouts/AuthLayout/components/Header/Logo.jsx 查看文件

1
 import React from 'react';
1
 import React from 'react';
2
-import { useModel } from '@/store'
2
+import { NavLink } from "react-router-dom";
3
+import { useModel } from '@/store';
3
 
4
 
4
 export default (props) => {
5
 export default (props) => {
5
 
6
 
6
   const { config } = useModel('system');
7
   const { config } = useModel('system');
7
 
8
 
8
   return (
9
   return (
9
-    <div className='logo'>
10
+    <NavLink className='logo'  to="/">
10
       <img src="./logo.png" alt="" />
11
       <img src="./logo.png" alt="" />
11
       <h3>{config.shorName}</h3>
12
       <h3>{config.shorName}</h3>
12
-    </div>
13
+    </NavLink>
13
   )
14
   )
14
 }
15
 }

+ 1
- 1
src/layouts/AuthLayout/components/Header/User.jsx 查看文件

79
   return (
79
   return (
80
     <Dropdown overlay={menu}>
80
     <Dropdown overlay={menu}>
81
       <div className="user-info">
81
       <div className="user-info">
82
-        <Avatar src="https://joeschmoe.io/api/v1/random" />
82
+        <Avatar size={24} src="https://joeschmoe.io/api/v1/random" />
83
         <span className='font'>{user.name}</span>
83
         <span className='font'>{user.name}</span>
84
         <ChangePassword ref={passRef} />
84
         <ChangePassword ref={passRef} />
85
       </div>
85
       </div>

+ 1
- 1
src/layouts/AuthLayout/components/SiderBar.jsx 查看文件

9
   const { theme } = useModel('system');
9
   const { theme } = useModel('system');
10
 
10
 
11
   return (
11
   return (
12
-    <Sider className='layout-background' theme={theme} collapsible >
12
+    <Sider className='layout-sidebar' theme={theme} collapsible width={240} >
13
       <Menus theme={theme}/>
13
       <Menus theme={theme}/>
14
     </Sider>
14
     </Sider>
15
   )
15
   )

+ 2
- 1
src/layouts/AuthLayout/style.less 查看文件

1
 .layout-header {
1
 .layout-header {
2
+  height: 48px;
2
   box-sizing: border-box;
3
   box-sizing: border-box;
3
   padding: 0;
4
   padding: 0;
4
   display: flex;
5
   display: flex;
17
     }
18
     }
18
 
19
 
19
     img {
20
     img {
20
-      width: 36px;
21
+      width: 28px;
21
       vertical-align: middle;
22
       vertical-align: middle;
22
       margin-right: 1em;
23
       margin-right: 1em;
23
     }
24
     }

+ 4
- 4
src/pages/sample/home/index.jsx 查看文件

20
       <Banner />
20
       <Banner />
21
 
21
 
22
       <Row gutter={24} style={{ marginTop: '24px' }}>
22
       <Row gutter={24} style={{ marginTop: '24px' }}>
23
-        <Col span={18}>
23
+        <Col span={16}>
24
           <AreaChart style={chartStyle}/>
24
           <AreaChart style={chartStyle}/>
25
         </Col>
25
         </Col>
26
-        <Col span={6}>
26
+        <Col span={8}>
27
           <RadarChart style={chartStyle}/>
27
           <RadarChart style={chartStyle}/>
28
         </Col>
28
         </Col>
29
       </Row>
29
       </Row>
30
 
30
 
31
       <Row gutter={24} style={{ marginTop: '24px' }}>
31
       <Row gutter={24} style={{ marginTop: '24px' }}>
32
-        <Col span={6}>
32
+        <Col span={8}>
33
           <PieChart style={chartStyle}/>
33
           <PieChart style={chartStyle}/>
34
         </Col>
34
         </Col>
35
-        <Col span={18}>
35
+        <Col span={16}>
36
           <BarChart style={chartStyle}/>
36
           <BarChart style={chartStyle}/>
37
         </Col>
37
         </Col>
38
       </Row>
38
       </Row>

+ 1
- 0
src/routes/menus.jsx 查看文件

37
         key: path,
37
         key: path,
38
         label: item.meta.title,
38
         label: item.meta.title,
39
         title: item.meta.title,
39
         title: item.meta.title,
40
+        icon: item.meta.icon,
40
       },
41
       },
41
       children && { children },
42
       children && { children },
42
     )
43
     )

+ 19
- 7
src/routes/routes.jsx 查看文件

1
+import {
2
+  AppstoreOutlined,
3
+  ContainerOutlined,
4
+  DesktopOutlined,
5
+  MailOutlined,
6
+  MenuFoldOutlined,
7
+  MenuUnfoldOutlined,
8
+  PieChartOutlined,
9
+} from '@ant-design/icons';
1
 import AuthLayout from "@/layouts/AuthLayout";
10
 import AuthLayout from "@/layouts/AuthLayout";
2
 import Login from '@/pages/login';
11
 import Login from '@/pages/login';
3
 import Page404 from '@/pages/404';
12
 import Page404 from '@/pages/404';
22
         index: true,
31
         index: true,
23
         element: <Home />,
32
         element: <Home />,
24
       },
33
       },
34
+      {
35
+        path: "home",
36
+        element: <Home />,
37
+        meta: {
38
+          title: '首页',
39
+          icon: <DesktopOutlined />,
40
+        },
41
+      },
25
       {
42
       {
26
         path: "form",
43
         path: "form",
27
         element: <BasicForm />,
44
         element: <BasicForm />,
28
         meta: {
45
         meta: {
29
           title: '表单',
46
           title: '表单',
47
+          icon: <AppstoreOutlined />,
30
         },
48
         },
31
       },
49
       },
32
       {
50
       {
34
         element: <BasicTable />,
52
         element: <BasicTable />,
35
         meta: {
53
         meta: {
36
           title: '表格',
54
           title: '表格',
37
-        },
38
-      },
39
-      {
40
-        path: "home",
41
-        element: <Home />,
42
-        meta: {
43
-          title: 'Home',
55
+          icon: <ContainerOutlined />,
44
         },
56
         },
45
       },
57
       },
46
       {
58
       {