{% extends "base.html" %}
{% block title %}Reports — Website Checker{% endblock %}
{% block content %}
<div class="page-header">
  <h1 class="page-title">Reports</h1>
  <a class="btn btn-ghost" href="{{ url_for('admin_reports.export_csv', **request.args) }}">⬇ Export CSV</a>
</div>

<div class="tab-bar">
  <a class="tab-item {{ 'active' if tab == 'detail' }}"    href="{{ url_for('admin_reports.reports', tab='detail', date_from=date_from, date_to=date_to) }}">Shift Detail</a>
  <a class="tab-item {{ 'active' if tab == 'unchecked' }}" href="{{ url_for('admin_reports.reports', tab='unchecked', target_date=target_date) }}">Unchecked</a>
  <a class="tab-item {{ 'active' if tab == 'summary' }}"   href="{{ url_for('admin_reports.reports', tab='summary', date_from=date_from, date_to=date_to) }}">Summary</a>
</div>

<form class="filter-bar mt-2" method="get">
  <input type="hidden" name="tab" value="{{ tab }}">
  {% if tab == 'unchecked' %}
    <label class="form-label mb-0">Date:</label>
    <input class="form-control" type="date" name="target_date" value="{{ target_date }}">
  {% else %}
    <label class="form-label mb-0">From:</label>
    <input class="form-control" type="date" name="date_from" value="{{ date_from }}">
    <label class="form-label mb-0">To:</label>
    <input class="form-control" type="date" name="date_to" value="{{ date_to }}">
  {% endif %}
  {% if tab == 'detail' or tab == 'unchecked' %}
    <select class="form-control" name="user_id">
      <option value="">All Users</option>
      {% for u in users %}<option value="{{ u.id }}" {{ 'selected' if user_id == u.id|string }}>{{ u.username }}</option>{% endfor %}
    </select>
  {% endif %}
  {% if tab == 'detail' %}
    <select class="form-control" name="website_id">
      <option value="">All Websites</option>
      {% for w in websites %}<option value="{{ w.id }}" {{ 'selected' if website_id == w.id|string }}>{{ w.name }}</option>{% endfor %}
    </select>
  {% endif %}
  <button class="btn btn-ghost" type="submit">Filter</button>
</form>

<div class="card mt-2">
{% if tab == 'detail' %}
  <table class="table table-sm">
    <thead><tr><th>Date</th><th>Time</th><th>User</th><th>Website</th><th>URL</th><th>Note</th></tr></thead>
    <tbody>
      {% for r in rows %}
      <tr>
        <td>{{ r.check_date }}</td>
        <td class="text-muted nowrap">{{ r.checked_at.strftime('%H:%M:%S') if r.checked_at else '' }}</td>
        <td>{{ r.full_name }}</td>
        <td>{{ r.website_name }}</td>
        <td><a href="{{ r.url }}" target="_blank" rel="noopener">{{ r.url[:40] }}{% if r.url|length > 40 %}…{% endif %}</a></td>
        <td class="text-muted">{{ r.user_note }}</td>
      </tr>
      {% else %}<tr><td colspan="6" class="text-center text-muted">No data.</td></tr>{% endfor %}
    </tbody>
  </table>

{% elif tab == 'unchecked' %}
  <table class="table table-sm">
    <thead><tr><th>Date</th><th>User</th><th>Website</th><th>URL</th><th>Status</th></tr></thead>
    <tbody>
      {% for r in rows %}
      <tr>
        <td>{{ r.check_date }}</td>
        <td>{{ r.full_name }}</td>
        <td>{{ r.website_name }}</td>
        <td><a href="{{ r.url }}" target="_blank" rel="noopener">{{ r.url[:40] }}{% if r.url|length > 40 %}…{% endif %}</a></td>
        <td><span class="badge badge-danger">Not Checked</span></td>
      </tr>
      {% else %}<tr><td colspan="5" class="text-center text-muted">No data.</td></tr>{% endfor %}
    </tbody>
  </table>

{% elif tab == 'summary' %}
  <table class="table table-sm">
    <thead><tr><th>Date</th><th>User</th><th>Checked</th><th>Total</th><th>Progress</th><th>%</th></tr></thead>
    <tbody>
      {% for r in rows %}
      <tr>
        <td>{{ r.check_date }}</td>
        <td>{{ r.full_name }}</td>
        <td>{{ r.checked_count }}</td>
        <td>{{ r.total_sites }}</td>
        <td>
          {% set pct = (r.pct_complete or 0)|int %}
          <div class="progress"><div class="progress-bar" style="width:{{ pct }}%;background:{% if pct >= 100 %}var(--success){% elif pct >= 50 %}var(--warning){% else %}var(--danger){% endif %}"></div></div>
        </td>
        <td><strong>{{ r.pct_complete or 0 }}%</strong></td>
      </tr>
      {% else %}<tr><td colspan="6" class="text-center text-muted">No data.</td></tr>{% endfor %}
    </tbody>
  </table>
{% endif %}
</div>
{% endblock %}