{% extends "base.html" %}
{% block title %}赛事统计 — Benchmark Platform{% endblock %}
{% block content %}
<div class="space-y-6">
  <div class="flex items-center gap-3">
    <div class="w-10 h-10 rounded-lg bg-blue-50 flex items-center justify-center">
      <svg class="w-5 h-5 text-blue-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 013 19.875v-6.75zM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V8.625zM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V4.125z" /></svg>
    </div>
    <div>
      <h1 class="text-[18px] font-semibold text-gray-900">赛事统计</h1>
      <p class="text-[12px] text-gray-500">按题目查看平均解题时长，帮助赛后分析题目难度与耗时分布。</p>
    </div>
  </div>

  <div class="bg-white rounded-xl border border-gray-100 overflow-hidden">
    <table class="w-full">
      <thead class="bg-gray-50/80 border-b border-gray-100">
        <tr>
          <th class="px-5 py-3 text-left text-[10px] font-medium text-gray-400 uppercase tracking-wider">题目</th>
          <th class="px-5 py-3 text-right text-[10px] font-medium text-gray-400 uppercase tracking-wider">解出次数</th>
          <th class="px-5 py-3 text-right text-[10px] font-medium text-gray-400 uppercase tracking-wider">平均耗时</th>
          <th class="px-5 py-3 text-right text-[10px] font-medium text-gray-400 uppercase tracking-wider">最快</th>
          <th class="px-5 py-3 text-right text-[10px] font-medium text-gray-400 uppercase tracking-wider">最慢</th>
          <th class="px-5 py-3 text-left text-[10px] font-medium text-gray-400 uppercase tracking-wider">最快队伍</th>
        </tr>
      </thead>
      <tbody class="divide-y divide-gray-50">
        {% for item in challenge_stats %}
        <tr class="hover:bg-gray-50/50 transition-colors">
          <td class="px-5 py-3.5">
            <div class="text-[13px] font-medium text-gray-900">{{ item.benchmark_id }}</div>
          </td>
          <td class="px-5 py-3.5 text-right">
            <span class="inline-flex items-center px-2 py-0.5 rounded-full text-[11px] font-medium bg-gray-100 text-gray-700">{{ item.solve_count }}</span>
          </td>
          <td class="px-5 py-3.5 text-right text-[13px] text-gray-700 font-mono">{{ item.avg_seconds // 60 }}m {{ item.avg_seconds % 60 }}s</td>
          <td class="px-5 py-3.5 text-right">
            <span class="text-[13px] font-medium text-emerald-600 font-mono">{{ item.min_seconds // 60 }}m {{ item.min_seconds % 60 }}s</span>
          </td>
          <td class="px-5 py-3.5 text-right">
            <span class="text-[13px] font-medium text-amber-600 font-mono">{{ item.max_seconds // 60 }}m {{ item.max_seconds % 60 }}s</span>
          </td>
          <td class="px-5 py-3.5">
            <div class="flex items-center gap-2">
              <div class="w-6 h-6 rounded-md bg-gradient-to-br from-gray-100 to-gray-200 flex items-center justify-center flex-shrink-0">
                <span class="text-[9px] font-bold text-gray-500">{{ (item.fastest_team or '—')[:2] | upper }}</span>
              </div>
              <span class="text-[12px] text-gray-700 font-medium">{{ item.fastest_team }}</span>
            </div>
          </td>
        </tr>
        {% endfor %}
        {% if not challenge_stats %}
        <tr>
          <td colspan="6" class="px-6 py-8 text-center text-[13px] text-gray-400">暂无可统计的解题数据</td>
        </tr>
        {% endif %}
      </tbody>
    </table>
  </div>
</div>
{% endblock %}