import { Card, Row, Col } from 'antd'
import { useNavigate } from 'react-router-dom'
import { MODULES } from '@/framework/modules/moduleRegistry'

const HomePage = () => {
  const navigate = useNavigate()

  return (
    <div className="flex-1 p-8">
      <div className="max-w-7xl mx-auto">
        {/* 欢迎标题 */}
        <div className="mb-8">
          <h1 className="text-3xl font-bold text-gray-800 mb-2">
            欢迎使用 AI临床研究平台
          </h1>
          <p className="text-gray-600">
            选择一个模块开始您的研究工作
          </p>
        </div>

        {/* 模块卡片 */}
        <Row gutter={[24, 24]}>
          {MODULES.map(module => (
            <Col xs={24} sm={12} lg={8} key={module.id}>
              <Card
                hoverable={!module.placeholder}
                onClick={() => !module.placeholder && navigate(module.path)}
                className={`h-full ${module.placeholder ? 'opacity-60' : ''}`}
              >
                <div className="flex flex-col items-center text-center p-4">
                  <div className="text-5xl mb-4">
                    {module.icon && <module.icon />}
                  </div>
                  <h3 className="text-xl font-semibold mb-2">
                    {module.name}
                  </h3>
                  <p className="text-gray-500 text-sm mb-3">
                    {module.description}
                  </p>
                  {/* 状态标签 */}
                  {!module.placeholder && module.id === 'literature-platform' && (
                    <span className="text-xs text-green-600 bg-green-50 px-3 py-1 rounded-full">
                      Week 3 开发
                    </span>
                  )}
                  {module.placeholder && module.isExternal && (
                    <span className="text-xs text-purple-600 bg-purple-50 px-3 py-1 rounded-full">
                      外部集成
                    </span>
                  )}
                  {module.placeholder && !module.isExternal && (
                    <span className="text-xs text-orange-500 bg-orange-50 px-3 py-1 rounded-full">
                      规划中
                    </span>
                  )}
                </div>
              </Card>
            </Col>
          ))}
        </Row>

        {/* 统计信息 */}
        <div className="mt-12 grid grid-cols-1 md:grid-cols-3 gap-6">
          <Card>
            <div className="text-center">
              <div className="text-3xl font-bold text-blue-600">6</div>
              <div className="text-gray-600 mt-2">业务模块</div>
            </div>
          </Card>
          <Card>
            <div className="text-center">
              <div className="text-3xl font-bold text-green-600">10</div>
              <div className="text-gray-600 mt-2">数据库Schema</div>
            </div>
          </Card>
          <Card>
            <div className="text-center">
              <div className="text-3xl font-bold text-purple-600">4</div>
              <div className="text-gray-600 mt-2">集成LLM</div>
            </div>
          </Card>
        </div>
      </div>
    </div>
  )
}

export default HomePage

