{% extends "base.html" %}
{% block title %}مدیریت نتایج | {{ school_name }}{% endblock %}
{% block head %}
<style>
  .results-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: start; }
  .metric-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-top: 16px; }
  .metric { border: 1px solid var(--border); background: var(--surface-soft); border-radius: 8px; padding: 14px; }
  .metric strong { display: block; font-size: 1.35rem; line-height: 1.2; color: var(--text); }
  .metric span { color: var(--muted); font-size: .82rem; }
  .status-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
  .status-tabs .btn { min-height: 34px; }
  .result-row[data-risk="1"] { background: #fffbeb; }
  .result-name { min-width: 210px; }
  .result-details { min-width: 280px; max-width: 420px; }
  .review-box { min-width: 210px; }
  .bulk-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
  .tiny-control { min-height: 32px; padding: 5px 8px; font-size: .8rem; }
  .risk-list { margin-top: 6px; display: flex; gap: 5px; flex-wrap: wrap; }
  .risk-chip { display: inline-flex; align-items: center; border-radius: 999px; padding: 1px 7px; background: #fef3c7; color: #92400e; font-size: .72rem; font-weight: 800; }
  @media (max-width: 760px) {
    .results-head { grid-template-columns: 1fr; }
    .bulk-bar { align-items: stretch; flex-direction: column; }
    .bulk-bar .row { width: 100%; }
  }
</style>
{% endblock %}
{% block body %}
<nav class="nav">
  <span class="brand">مدیریت نتایج</span>
  <a href="{{ url_for('admin_dashboard') }}">داشبورد</a>
  <a href="{{ url_for('admin_students') }}">دانش‌آموزان</a>
  <a href="{{ url_for('export_results', exam_id=exam['id']) }}" class="btn btn-success btn-sm">دانلود CSV</a>
</nav>

<main class="container">
  {% with messages = get_flashed_messages(with_categories=true) %}
    {% for cat, msg in messages %}<div class="alert alert-{{ cat }}">{{ msg }}</div>{% endfor %}
  {% endwith %}

  <section class="card">
    <div class="results-head">
      <div>
        <h1 class="title">{{ exam["title"] }}</h1>
        <p class="subtle">
          {{ exam["subject"] or "بدون درس" }}
          {% if exam["grade"] %} · {{ exam["grade"] }}{% endif %}
          {% if exam["teacher"] %} · {{ exam["teacher"] }}{% endif %}
        </p>
      </div>
      <span class="badge badge-info">{{ total }} نمایش / {{ total_all }} کل</span>
    </div>

    <div class="metric-grid">
      <div class="metric"><strong>{{ status_counts.pending }}</strong><span>در انتظار بررسی</span></div>
      <div class="metric"><strong>{{ status_counts.approved }}</strong><span>تأیید شده</span></div>
      <div class="metric"><strong>{{ status_counts.rejected }}</strong><span>رد شده</span></div>
      <div class="metric"><strong>{{ page_stats.flagged_count }}</strong><span>نیازمند توجه</span></div>
      <div class="metric"><strong>{{ page_stats.average_score if page_stats.average_score is not none else "—" }}</strong><span>میانگین این صفحه</span></div>
      <div class="metric"><strong>{{ page_stats.highest_score if page_stats.highest_score is not none else "—" }}</strong><span>بالاترین این صفحه</span></div>
    </div>

    <div class="status-tabs">
      <a href="{{ url_for('exam_results', exam_id=exam['id'], q=query, suspicious='1' if suspicious_only else None) }}" class="btn {{ 'btn-primary' if status_filter == 'all' else 'btn-ghost' }} btn-sm">همه</a>
      <a href="{{ url_for('exam_results', exam_id=exam['id'], status='pending', q=query, suspicious='1' if suspicious_only else None) }}" class="btn {{ 'btn-primary' if status_filter == 'pending' else 'btn-ghost' }} btn-sm">در انتظار</a>
      <a href="{{ url_for('exam_results', exam_id=exam['id'], status='approved', q=query, suspicious='1' if suspicious_only else None) }}" class="btn {{ 'btn-primary' if status_filter == 'approved' else 'btn-ghost' }} btn-sm">تأیید شده</a>
      <a href="{{ url_for('exam_results', exam_id=exam['id'], status='rejected', q=query, suspicious='1' if suspicious_only else None) }}" class="btn {{ 'btn-primary' if status_filter == 'rejected' else 'btn-ghost' }} btn-sm">رد شده</a>
      <a href="{{ url_for('exam_results', exam_id=exam['id'], status=status_filter, q=query, suspicious='1') }}" class="btn {{ 'btn-warning' if suspicious_only else 'btn-ghost' }} btn-sm">نیازمند توجه</a>
    </div>
  </section>

  <section class="card">
    <form class="filters" method="get">
      <input type="hidden" name="status" value="{{ status_filter }}">
      <div class="form-group" style="margin:0;">
        <label>جستجوی دانش‌آموز، کد یا نمره</label>
        <input type="text" name="q" class="form-control" value="{{ query }}" placeholder="کد دانش‌آموزی، نام، نمره">
      </div>
      <label class="checkline">
        <input type="checkbox" name="suspicious" value="1" {{ 'checked' if suspicious_only }}>
        <span>فقط موارد نیازمند توجه نمایش داده شود</span>
      </label>
      <div class="row">
        <button type="submit" class="btn btn-primary">فیلتر</button>
        <a href="{{ url_for('exam_results', exam_id=exam['id']) }}" class="btn btn-ghost">پاک کردن</a>
      </div>
    </form>
  </section>

  <section class="card">
    <div class="bulk-bar">
      <div>
        <h2 class="title" style="font-size:1.15rem;">صف بررسی نتایج</h2>
        <p class="subtle">برای بررسی گروهی، ردیف‌ها را انتخاب کنید؛ یا وضعیت و یادداشت هر نتیجه را جداگانه ذخیره کنید.</p>
      </div>
      <form id="bulkReview" method="post" action="{{ url_for('bulk_review_results', exam_id=exam['id']) }}" class="row">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <select name="status" class="form-control tiny-control" style="width:140px;">
          <option value="approved">تأیید</option>
          <option value="rejected">رد</option>
          <option value="pending">در انتظار</option>
        </select>
        <button type="submit" class="btn btn-primary btn-sm">اعمال روی انتخاب‌شده‌ها</button>
      </form>
    </div>

    {% if results %}
      <div style="overflow-x:auto;">
        <table>
          <thead>
            <tr>
              <th><input type="checkbox" id="selectAll"></th>
              <th>دانش‌آموز</th>
              <th>نمره</th>
              <th>وضعیت</th>
              <th>نشانه‌ها</th>
              <th>جزئیات</th>
              <th>بررسی</th>
              <th>زمان ثبت</th>
              <th></th>
            </tr>
          </thead>
          <tbody>
            {% for r in results %}
              {% set risks = result_risk(r) %}
              {% set status = r["status"] or "pending" %}
              <tr class="result-row" data-risk="{{ 1 if risks else 0 }}">
                <td><input type="checkbox" name="result_ids" value="{{ r['id'] }}" form="bulkReview" class="result-check"></td>
                <td class="result-name">
                  <strong>{{ r["student"] }}</strong>
                  <div class="meta">{{ r["student_code"] or "بدون کد" }}</div>
                </td>
                <td><span class="badge badge-info">{{ r["score"] or "بدون نمره" }}</span></td>
                <td>
                  <span class="badge badge-{{ 'success' if status == 'approved' else 'danger' if status == 'rejected' else 'warning' }}">{{ status_label(status) }}</span>
                  {% if r["reviewed_at"] %}<div class="meta">{{ r["reviewed_at"] }}</div>{% endif %}
                </td>
                <td>
                  <div class="meta">{{ r["violations"] or 0 }} تخلف</div>
                  <div class="meta">{{ format_duration(r["duration_seconds"]) or "بدون زمان" }}</div>
                  {% if risks %}
                    <div class="risk-list">
                      {% for risk in risks %}<span class="risk-chip">{{ risk }}</span>{% endfor %}
                    </div>
                  {% endif %}
                </td>
                <td class="result-details">
                  <div style="font-size:.82rem;">{{ (r["details"] or "—")[:260] }}{% if r["details"] and r["details"]|length > 260 %}…{% endif %}</div>
                  {% if r["admin_note"] %}<div class="meta" style="margin-top:6px;"><strong>یادداشت:</strong> {{ r["admin_note"] }}</div>{% endif %}
                </td>
                <td class="review-box">
                  <form method="post" action="{{ url_for('review_result', result_id=r['id']) }}" class="stack">
                    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                    <select name="status" class="form-control tiny-control">
                      <option value="pending" {{ 'selected' if status == 'pending' }}>در انتظار بررسی</option>
                      <option value="approved" {{ 'selected' if status == 'approved' }}>تأیید شده</option>
                      <option value="rejected" {{ 'selected' if status == 'rejected' }}>رد شده</option>
                    </select>
                    <input type="text" name="admin_note" class="form-control tiny-control" value="{{ r['admin_note'] or '' }}" placeholder="یادداشت مدیر">
                    <button type="submit" class="btn btn-primary btn-sm">ذخیره بررسی</button>
                  </form>
                </td>
                <td class="meta">{{ r["submitted_at"] }}</td>
                <td>
                  <form method="post" action="{{ url_for('delete_result', result_id=r['id']) }}" onsubmit="return confirm('این نتیجه حذف شود؟')">
                    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                    <button type="submit" class="btn btn-danger btn-sm">حذف</button>
                  </form>
                </td>
              </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
      {% if pages > 1 %}
        <div class="row" style="justify-content:center;margin-top:18px;">
          {% for p in range(1, pages + 1) %}
            <a href="{{ url_for('exam_results', exam_id=exam['id'], page=p, status=status_filter, q=query, suspicious='1' if suspicious_only else None) }}" class="btn {{ 'btn-primary' if p == page else 'btn-ghost' }} btn-sm">{{ p }}</a>
          {% endfor %}
        </div>
      {% endif %}
    {% else %}
      <div class="empty"><strong>نتیجه‌ای مطابق فیلترها پیدا نشد.</strong><span>فیلترها را تغییر دهید یا منتظر ثبت پاسخ دانش‌آموزان بمانید.</span></div>
    {% endif %}
  </section>
</main>

<script>
  const selectAll = document.getElementById("selectAll");
  if (selectAll) {
    selectAll.addEventListener("change", () => {
      document.querySelectorAll(".result-check").forEach((box) => {
        box.checked = selectAll.checked;
      });
    });
  }
</script>
{% endblock %}