refactor: prolayout

umi
Dawn1Ocean 2024-03-28 15:48:29 +08:00
parent f964bf561f
commit b0baa9c45f
3 changed files with 36 additions and 123 deletions

View File

@ -1,8 +1,11 @@
import Todo from '@/components/Todo';
import {
ChromeFilled,
ClockCircleOutlined,
CrownFilled,
SmileFilled,
TabletFilled,
CrownOutlined,
SmileOutlined,
TeamOutlined,
ThunderboltOutlined,
} from '@ant-design/icons';
export default {
@ -10,143 +13,60 @@ import {
path: '/',
routes: [
{
path: '/welcome',
name: '欢迎',
icon: <SmileFilled />,
path: '/dashboard',
name: '仪表盘',
icon: <SmileOutlined />,
component: './Welcome',
},
{
path: '/admin',
name: '管理',
icon: <CrownFilled />,
name: '主席团管理',
icon: <CrownOutlined />,
access: 'canAdmin',
component: './Admin',
routes: [
{
path: '/admin/sub-page1',
name: '一级页面',
path: '/admin/dutytable',
name: '值班表管理',
icon: 'https://gw.alipayobjects.com/zos/antfincdn/upvrAjAPQX/Logo_Tech%252520UI.svg',
component: './Welcome',
},
{
path: '/admin/sub-page2',
name: '二级页面',
icon: <CrownFilled />,
component: './Welcome',
},
{
path: '/admin/sub-page3',
name: '三级页面',
path: '/admin/dutyinfo',
name: '值班信息管理',
icon: <CrownFilled />,
component: './Welcome',
},
],
},
{
name: '列表页',
icon: <TabletFilled />,
path: '/list',
component: './ListTableList',
name: '值班管理',
icon: <TeamOutlined />,
path: '/duty',
routes: [
{
path: '/list/sub-page',
name: '列表页面',
path: '/duty/conclusion',
name: '值班总结',
icon: <CrownFilled />,
routes: [
{
path: 'sub-sub-page1',
name: '一一级列表页面',
icon: <CrownFilled />,
component: './Welcome',
},
{
path: 'sub-sub-page2',
name: '一二级列表页面',
icon: <CrownFilled />,
component: './Welcome',
},
{
path: 'sub-sub-page3',
name: '一三级列表页面',
icon: <CrownFilled />,
component: './Welcome',
},
],
},
{
path: '/list/sub-page2',
name: '二级列表页面',
icon: <CrownFilled />,
component: './Welcome',
},
{
path: '/list/sub-page3',
name: '三级列表页面',
icon: <CrownFilled />,
component: './Welcome',
component: '@/components/Todo',
},
],
},
{
path: 'https://ant.design',
name: 'Ant Design 官网外链',
icon: <ChromeFilled />,
path: '/logs',
name: '日志',
icon: <ClockCircleOutlined />,
component: './Welcome',
},
{
path: '/about',
name: '关于',
icon: <ThunderboltOutlined />,
component: './Welcome',
},
],
},
location: {
pathname: '/',
},
appList: [
{
icon: 'https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg',
title: 'Ant Design',
desc: '杭州市较知名的 UI 设计语言',
url: 'https://ant.design',
},
{
icon: 'https://gw.alipayobjects.com/zos/antfincdn/FLrTNDvlna/antv.png',
title: 'AntV',
desc: '蚂蚁集团全新一代数据可视化解决方案',
url: 'https://antv.vision/',
target: '_blank',
},
{
icon: 'https://gw.alipayobjects.com/zos/antfincdn/upvrAjAPQX/Logo_Tech%252520UI.svg',
title: 'Pro Components',
desc: '专业级 UI 组件库',
url: 'https://procomponents.ant.design/',
},
{
icon: 'https://img.alicdn.com/tfs/TB1zomHwxv1gK0jSZFFXXb0sXXa-200-200.png',
title: 'umi',
desc: '插件化的企业级前端应用框架。',
url: 'https://umijs.org/zh-CN/docs',
},
{
icon: 'https://gw.alipayobjects.com/zos/bmw-prod/8a74c1d3-16f3-4719-be63-15e467a68a24/km0cv8vn_w500_h500.png',
title: 'qiankun',
desc: '可能是你见过最完善的微前端解决方案🧐',
url: 'https://qiankun.umijs.org/',
},
{
icon: 'https://gw.alipayobjects.com/zos/rmsportal/XuVpGqBFxXplzvLjJBZB.svg',
title: '语雀',
desc: '知识创作与分享工具',
url: 'https://www.yuque.com/',
},
{
icon: 'https://gw.alipayobjects.com/zos/rmsportal/LFooOLwmxGLsltmUjTAP.svg',
title: 'Kitchen ',
desc: 'Sketch 工具集',
url: 'https://kitchen.alipay.com/',
},
{
icon: 'https://gw.alipayobjects.com/zos/bmw-prod/d3e3eb39-1cd7-4aa5-827c-877deced6b7e/lalxt4g3_w256_h256.png',
title: 'dumi',
desc: '为组件开发场景而生的文档工具',
url: 'https://d.umijs.org/zh-CN',
},
],
};

View File

@ -1,10 +0,0 @@
.navs {
ul {
padding: 0;
list-style: none;
display: flex;
}
li {
margin-right: 1em;
}
}

View File

@ -6,9 +6,10 @@ import {
import { PageContainer, ProCard, ProLayout } from '@ant-design/pro-components';
import { useState } from 'react';
import defaultProps from './_defaultProps';
import PageFooter from '@/components/PageFooter';
export default () => {
const [pathname, setPathname] = useState('/list/sub-page/sub-sub-page1');
const [pathname, setPathname] = useState('/dashboard');
return (
<div
@ -18,6 +19,7 @@ export default () => {
}}
>
<ProLayout
title='EVA Tea'
siderWidth={216}
bgLayoutImgList={[
{
@ -69,12 +71,13 @@ export default () => {
<PageContainer>
<ProCard
style={{
height: '100vh',
height: '80vh',
minHeight: 800,
}}
>
<div />
</ProCard>
<PageFooter />
</PageContainer>
</ProLayout>
</div>