blob: 1f641f245000f0a90348977629e69aa7bc3821c4 [file] [log] [blame]
ybt02e716d2025-04-15 17:19:32 +08001import React from 'react';
2import { Card, Table, Button, Space, Typography } from 'antd';
3import { UserOutlined, UploadOutlined, SettingOutlined } from '@ant-design/icons';
4
5const { Title } = Typography;
6
7const AdminPanel = () => {
8 // 模拟用户数据
9 const users = [
10 { key: '1', username: 'admin', role: '管理员', status: '正常', registrationDate: '2023-01-01' },
11 { key: '2', username: 'user1', role: '新人', status: '正常', registrationDate: '2023-02-15' },
12 { key: '3', username: 'user2', role: '老手', status: '禁用', registrationDate: '2023-03-20' },
13 { key: '4', username: 'user3', role: '黑户', status: '封禁', registrationDate: '2023-04-10' },
14 { key: '5', username: 'mod1', role: '版主', status: '正常', registrationDate: '2023-05-05' },
15 ];
16
17 const columns = [
18 { title: '用户名', dataIndex: 'username', key: 'username' },
19 { title: '角色', dataIndex: 'role', key: 'role' },
20 { title: '状态', dataIndex: 'status', key: 'status' },
21 { title: '注册日期', dataIndex: 'registrationDate', key: 'registrationDate' },
22 {
23 title: '操作',
24 key: 'action',
25 render: (_, record) => (
26 <Space size="middle">
27 <Button type="link">编辑</Button>
28 <Button type="link" danger>禁用</Button>
29 </Space>
30 ),
31 },
32 ];
33
34 return (
35 <div className="p-6">
36 <Title level={2}>管理员控制面板</Title>
37 <div className="flex gap-4 mb-6">
38 <Card title="用户统计" className="w-1/3">
39 <div className="flex items-center">
40 <UserOutlined className="text-2xl mr-2" />
41 <span className="text-xl">5 名用户</span>
42 </div>
43 </Card>
44 <Card title="资源统计" className="w-1/3">
45 <div className="flex items-center">
46 <UploadOutlined className="text-2xl mr-2" />
47 <span className="text-xl">25 个资源</span>
48 </div>
49 </Card>
50 <Card title="系统状态" className="w-1/3">
51 <div className="flex items-center">
52 <SettingOutlined className="text-2xl mr-2" />
53 <span className="text-xl">运行正常</span>
54 </div>
55 </Card>
56 </div>
57 <Card title="用户管理">
58 <Table columns={columns} dataSource={users} />
59 </Card>
60 </div>
61 );
62};
63
64export default AdminPanel;