import React from "react";

const Resource: React.FC = () => {
  return (
    <div className="page-container">
      <div className="page-header">
        <h1>Resource</h1>
        <p className="page-description">
          我们为研究社区提供原始数据和分析软件资源
        </p>
      </div>

      <div className="page-content">
        <div className="section">
          <h2>数据资源</h2>
          <div className="resource-grid">
            <div className="resource-card">
              <h3>原始数据</h3>
              <p>包含完整的空间转录组测序数据，格式为 H5AD 和 H5 文件。</p>
              <ul>
                <li>CS7 阶段数据 (CS7.h5ad)</li>
                <li>CS8 阶段数据 (CS8.h5ad)</li>
                <li>CS9 阶段数据 (CS9.h5ad)</li>
              </ul>
            </div>
            <div className="resource-card">
              <h3>处理后数据</h3>
              <p>经过质量控制、标准化和降维处理的数据，可直接用于下游分析。</p>
              <ul>
                <li>基因表达矩阵</li>
                <li>细胞类型注释</li>
                <li>空间坐标信息</li>
              </ul>
            </div>
          </div>
        </div>

        <div className="section">
          <h2>软件工具</h2>
          <div className="software-grid">
            <div className="software-card">
              <h3>数据处理流程</h3>
              <p>完整的空间转录组数据分析流程，包括预处理、质量控制、聚类和可视化。</p>
              <div className="software-links">
                <a href="#" className="software-link">GitHub 仓库</a>
                <a href="#" className="software-link">使用文档</a>
              </div>
            </div>
            <div className="software-card">
              <h3>可视化工具</h3>
              <p>基于 Three.js 的 3D 可视化工具，支持交互式探索基因表达的空间模式。</p>
              <div className="software-links">
                <a href="#" className="software-link">在线工具</a>
                <a href="#" className="software-link">API 文档</a>
              </div>
            </div>
          </div>
        </div>

        <div className="section">
          <h2>技术支持</h2>
          <div className="support-info">
            <p>如果您在使用数据或软件过程中遇到问题，请通过以下方式联系我们：</p>
            <ul>
              <li>Email: support@digital-embryo.org</li>
              <li>GitHub Issues: 提交技术问题和功能请求</li>
              <li>文档中心: 查看详细的使用指南</li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  );
};

export default Resource; 