Files
copilot-toolbox-template099i/src/pages/home/index.tsx
2026-01-16 06:29:38 +00:00

70 lines
2.2 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import { Card, Row, Col, Typography, Space } from 'antd'
import { Link } from 'react-router-dom'
import { RobotOutlined, TranslationOutlined, FileTextOutlined, EditOutlined } 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'
},
{
title: '错别字检测',
description: '智能检测和纠正中文文本中的错别字',
icon: <EditOutlined style={{ fontSize: 32, color: '#fa8c16' }} />,
link: '/spell-check'
},
{
title: '错别字检测与修正系统',
description: '更智能的错别字检测与修正系统,支持分类和建议',
icon: <EditOutlined style={{ fontSize: 32, color: '#13c2c2' }} />,
link: '/spell-check-system'
}
]
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