58 lines
1.7 KiB
TypeScript
58 lines
1.7 KiB
TypeScript
import { Card, Row, Col, Typography, Space } from 'antd'
|
||
import { Link } from 'react-router-dom'
|
||
import { RobotOutlined, TranslationOutlined, FileTextOutlined } from '@ant-design/icons'
|
||
|
||
const { Title, Paragraph } = Typography
|
||
|
||
const cards = [
|
||
{
|
||
title: '测试页面 1',
|
||
description: 'Dify AI Agent 集成示例',
|
||
icon: <RobotOutlined style={{ fontSize: 32, color: '#1890ff' }} />,
|
||
link: '/test1'
|
||
},
|
||
{
|
||
title: '测试页面 2',
|
||
description: '功能开发中...',
|
||
icon: <FileTextOutlined style={{ fontSize: 32, color: '#52c41a' }} />,
|
||
link: '/test2'
|
||
},
|
||
{
|
||
title: '中英翻译器',
|
||
description: 'AI 驱动的翻译工具',
|
||
icon: <TranslationOutlined style={{ fontSize: 32, color: '#722ed1' }} />,
|
||
link: '/zh-en-translator'
|
||
}
|
||
]
|
||
|
||
const HomePage: React.FC = () => {
|
||
return (
|
||
<div style={{ padding: 24 }}>
|
||
<Title level={2}>欢迎使用 AI 办公助手</Title>
|
||
<Paragraph style={{ marginBottom: 32 }}>
|
||
选择下方功能开始使用，或通过顶部导航访问其他页面。
|
||
</Paragraph>
|
||
|
||
<Row gutter={[16, 16]}>
|
||
{cards.map((card, index) => (
|
||
<Col xs={24} sm={12} md={8} key={index}>
|
||
<Link to={card.link}>
|
||
<Card hoverable style={{ height: '100%' }}>
|
||
<Space direction='vertical' align='center' style={{ width: '100%' }}>
|
||
{card.icon}
|
||
<Title level={4} style={{ marginBottom: 0 }}>{card.title}</Title>
|
||
<Paragraph type='secondary' style={{ marginBottom: 0 }}>
|
||
{card.description}
|
||
</Paragraph>
|
||
</Space>
|
||
</Card>
|
||
</Link>
|
||
</Col>
|
||
))}
|
||
</Row>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default HomePage
|