import React from 'react'
import { Typography, Card, Divider, Button } from 'antd'
import { Link } from 'react-router-dom'

const { Title, Paragraph, Text } = Typography

const AboutPage: React.FC = () => {
  return (
    <div className="page-container">
      <Title level={2} className="page-title">关于我们</Title>
      
      <Card bordered={false}>
        <Paragraph>
          这是一个使用 <Text strong>PwC RA Components</Text> 库构建的应用程序。
          MainLayout、Sidebar 和 Breadcrumb 组件提供了统一的页面布局和导航功能，
          PageHeader 组件提供了统一的页面头部导航栏，包含产品菜单、用户信息、租户选择等功能。
        </Paragraph>
        
        <Divider />
        
        <Title level={4}>主要功能</Title>
        <Paragraph>
          <ul>
            <li>统一的页面布局</li>
            <li>侧边栏导航</li>
            <li>面包屑导航</li>
            <li>统一的页面头部导航</li>
            <li>产品菜单切换</li>
            <li>用户信息显示</li>
            <li>租户选择</li>
            <li>全局状态管理</li>
          </ul>
        </Paragraph>
        
        <Divider />
        
        <Title level={4}>技术栈</Title>
        <Paragraph>
          <ul>
            <li>React</li>
            <li>TypeScript</li>
            <li>Ant Design</li>
            <li>React Router</li>
            <li>Vite</li>
          </ul>
        </Paragraph>
        
        <Divider />
        
        <Button type="primary">
          <Link to="/">返回首页</Link>
        </Button>
      </Card>
    </div>
  )
}

export default AboutPage