cfc/.superpowers/brainstorm/1930451-1784242411/content/data-sections.html

<h2>📊 菌群报告 JSON 数据结构总览</h2>
<p class="subtitle">从参考 JSON 中提取了以下数据板块</p>

<div class="section">
  <h3>📋 报告概述（10项评分）</h3>
  <p>健康总分、菌群健康、慢病控制、营养均衡、肠道预测年龄、肠型、菌群平衡、多样性、有益菌、有害菌、核心菌属</p>
</div>

<div class="section">
  <h3>📐 评估板块（7大类）</h3>
  <ul>
    <li><strong>疾病风险评估</strong> — 12项（炎症性肠炎、结直肠癌、抑郁症等）</li>
    <li><strong>主要营养评估</strong> — 5项（碳水/蛋白/脂肪/纤维素/乳制品）</li>
    <li><strong>氨基酸评估</strong> — 10项（胱氨酸、苯丙氨酸、缬氨酸等）</li>
    <li><strong>维生素评估</strong> — 9项（A/B1/B2/B5/B6/B12/C/D/叶酸）</li>
    <li><strong>微量元素评估</strong> — 2项（铁、锌）</li>
  </ul>
</div>

<div class="section">
  <h3>🦠 菌群检出（12个功能分类，共 200+ 菌属条目）</h3>
  <ul>
    <li><strong>核心菌属</strong> ~15种（梭菌属、普雷沃氏菌属、拟杆菌属等）</li>
    <li><strong>益生菌门</strong> — 5个菌门（拟杆菌门、厚壁菌门、变形菌门等）</li>
    <li><strong>有害菌属</strong> ~5种</li>
    <li><strong>其它重要菌属</strong></li>
    <li><strong>病原菌</strong> + 6类疾病相关菌（肥胖/便秘/抑郁/过敏/腹胀/失眠）</li>
  </ul>
</div>

<div class="section">
  <h3>🔬 肠道功能指标（4大类）</h3>
  <ul>
    <li><strong>肠道屏障及代谢物</strong> — 炎症、产气、屏障、LPS、胆汁酸等</li>
    <li><strong>短链脂肪酸</strong> — 丁酸、丙酸、乙酸、异戊酸</li>
    <li><strong>神经递质及激素</strong> — 血清素、GABA、多巴胺、组胺等</li>
    <li><strong>抗生素风险评估</strong> — 9类抗生素</li>
  </ul>
</div>

<div class="section">
  <h3>🍽️ 个体化食物推荐表</h3>
  <p>224种食物，含推荐指数、能量、蛋白、脂肪、碳水、纤维等</p>
</div>

<hr style="margin: 24px 0;">

<h2>现有的 gut-flora-detail.vue 只展示了：</h2>
<ul>
  <li>5个评分圆环（综合评分/肠道健康/营养评分/有益菌/多样性）</li>
  <li>3组菌群分类（有益菌/有害菌/中性菌）</li>
  <li>饮食推荐列表</li>
</ul>
<p><strong>大量数据未使用</strong> — 疾病风险、营养评估、氨基酸/维生素、代谢物、神经递质、疾病相关菌群等</p>

<hr style="margin: 24px 0;">

<h2>🎯 设计目标？</h2>
<p class="subtitle">请选择你这次想要的设计范围</p>

<div class="options">
  <div class="option" data-choice="full" onclick="toggleSelect(this)">
    <div class="letter">A</div>
    <div class="content">
      <h3>全部展示（长页面）</h3>
      <p>一个完整的长页面展示所有数据板块，用户可查看所有报告维度。带 Tab 导航或区块索引。</p>
    </div>
  </div>
  <div class="option" data-choice="key" onclick="toggleSelect(this)">
    <div class="letter">B</div>
    <div class="content">
      <h3>关键指标聚焦</h3>
      <p>精选最重要的 5-6 个板块（评分概览、核心菌属、疾病风险、食物推荐、肠道功能），其余折叠或二级导航。</p>
    </div>
  </div>
  <div class="option" data-choice="edit" onclick="toggleSelect(this)">
    <div class="letter">C</div>
    <div class="content">
      <h3>编辑模式优先</h3>
      <p>页面核心是编辑/修改报告数据（调整菌属值、状态、食物推荐等），查看为辅。</p>
    </div>
  </div>
  <div class="option" data-choice="mixed" onclick="toggleSelect(this)">
    <div class="letter">D</div>
    <div class="content">
      <h3>查看 + 可编辑（混合）</h3>
      <p>默认查看模式，但可通过编辑按钮进入编辑模式，修改菌群/指标数据后再保存。</p>
    </div>
  </div>
</div>