add prolist in logs page

mgy
Dawn1Ocean 2024-03-26 20:36:27 +08:00
parent 31a782daef
commit fbaedaad0e
2 changed files with 69 additions and 1 deletions

View File

@ -0,0 +1,67 @@
import { FC } from 'react';
import { EllipsisOutlined } from '@ant-design/icons';
import { ProList } from '@ant-design/pro-components';
import { Progress, Tag } from 'antd';
const data = [
'语雀的天空',
'Ant Design',
'蚂蚁金服体验科技',
'TechUI',
'TechUI 2.0',
'Bigfish',
'Umi',
].map((item) => ({
title: item,
subTitle: <Tag color='#5BD8A6'></Tag>,
actions: [
<a key='invite'></a>,
<a key='operate'></a>,
<a key='rest'>
<EllipsisOutlined />
</a>,
],
avatar:
'https://gw.alipayobjects.com/zos/antfincdn/UCSiy1j6jx/xingzhuang.svg',
content: (
<div
style={{
flex: 1,
display: 'flex',
justifyContent: 'flex-end',
}}
>
<div
style={{
width: 200,
}}
>
<div></div>
<Progress percent={80} />
</div>
</div>
),
}));
const LogsPage: FC = () => {
return (
<ProList<any>
pagination={{
defaultPageSize: 5,
showSizeChanger: true,
}}
metas={{
title: {},
subTitle: {},
type: {},
avatar: {},
content: {},
actions: {},
}}
headerTitle='翻页'
dataSource={data}
/>
);
};
export default LogsPage;

View File

@ -1,6 +1,7 @@
import { Routes, Route } from 'react-router-dom'; import { Routes, Route } from 'react-router-dom';
import Todo from './components/Todo'; import Todo from './components/Todo';
import DutyTablePage from './pages/duty/DutyTable'; import DutyTablePage from './pages/duty/DutyTable';
import LogsPage from './pages/logs/Logs';
export const routes = { export const routes = {
main: '/', main: '/',
@ -35,7 +36,7 @@ export const AppRouter: React.FC = () => {
<Route path={routes.admin.dutyInfo} element={<Todo />} /> <Route path={routes.admin.dutyInfo} element={<Todo />} />
<Route path={routes.duty.conclusion} element={<Todo />} /> <Route path={routes.duty.conclusion} element={<Todo />} />
<Route path={routes.about} element={<Todo />} /> <Route path={routes.about} element={<Todo />} />
<Route path={routes.logs} element={<Todo />} /> <Route path={routes.logs} element={<LogsPage />} />
</Routes> </Routes>
); );
}; };