{% set metrics = report.metrics_json | from_json_object %}
{% set typical = report.typical_comments_json | from_json_object %}
{% set sentiment = metrics.get("sentiment", {}) %}
{% set top_labels = metrics.get("top_labels", []) %}
{% set sample_count = metrics.get("sample_count", 0) %}
{% set item_count = metrics.get("item_count") %}

<section class="card mb-4">
  <div class="card-body">
    {% if task.analysis_status == "insufficient" %}
      <div class="alert alert-warning">当前有效评论样本不足，AI 总结暂不可用。建议增加评论抓取数量后重新分析。</div>
    {% endif %}

    <div class="row g-3 mb-4">
      <div class="col-md-3">
        <div class="border rounded p-3 h-100">
          <div class="text-muted small">评论样本</div>
          <div class="h4 mb-0">{{ sample_count }}</div>
        </div>
      </div>
      {% if item_count is not none %}
        <div class="col-md-3">
          <div class="border rounded p-3 h-100">
            <div class="text-muted small">关联内容</div>
            <div class="h4 mb-0">{{ item_count }}</div>
          </div>
        </div>
      {% endif %}
      <div class="col-md-3">
        <div class="border rounded p-3 h-100">
          <div class="text-muted small">AI 成功率</div>
          <div class="h4 mb-0">{{ rate_percent(task.analysis_success_rate) }}%</div>
        </div>
      </div>
    </div>

    <div class="p-3 bg-info-subtle border border-info-subtle rounded mb-4">
      <div class="fw-semibold mb-2">AI 总结</div>
      <p class="mb-0">{{ report.summary or "总结生成失败，请查看上方统计数据。" }}</p>
    </div>

    <div class="row g-4">
      <div class="col-lg-6">
        <h2 class="h5">情绪分布</h2>
        {% for key, bar_class in [("positive", "bg-success"), ("neutral", "bg-secondary"), ("negative", "bg-danger"), ("unknown", "bg-warning")] %}
          {% set item = sentiment.get(key, {"count": 0, "pct": 0}) %}
          <div class="d-flex justify-content-between mb-1">
            <span>{{ sentiment_label(key) }}</span>
            <span class="text-muted">{{ item.get("count", 0) }} 条（{{ item.get("pct", 0) }}%）</span>
          </div>
          <div class="progress mb-3 report-progress" role="progressbar" aria-label="{{ sentiment_label(key) }}情绪占比" aria-valuenow="{{ item.get("pct", 0) }}" aria-valuemin="0" aria-valuemax="100">
            <div class="progress-bar {{ bar_class }}" style="width: {{ item.get("pct", 0) }}%"></div>
          </div>
        {% endfor %}
      </div>
      <div class="col-lg-6">
        <h2 class="h5">Top 标签</h2>
        {% if top_labels %}
          <div class="d-flex flex-wrap gap-2">
            {% for label in top_labels %}
              <span class="badge text-bg-light border">{{ label.get("name") }} ({{ label.get("count", 0) }})</span>
            {% endfor %}
          </div>
        {% else %}
          <p class="text-muted mb-0">暂无标签数据</p>
        {% endif %}
      </div>
    </div>
  </div>
</section>

<section class="card mb-4">
  <div class="card-header">典型评论</div>
  <div class="card-body">
    <div class="row g-3">
      {% for key in ["positive", "neutral", "negative"] %}
        <div class="col-md-4">
          <h3 class="h6">{{ sentiment_label(key) }}</h3>
          {% for comment in typical.get(key, []) %}
            <div class="border rounded p-2 mb-2">
              <p class="mb-1">{{ comment.get("content") }}</p>
              <small class="text-muted">点赞 {{ comment.get("like_count", 0) }}</small>
            </div>
          {% else %}
            <p class="text-muted small mb-0">暂无{{ sentiment_label(key) }}代表评论</p>
          {% endfor %}
        </div>
      {% endfor %}
    </div>
  </div>
</section>