{% extends "base.html" %}
{% from 'macros/badges.html' import badge_secondary %}
{% block title %}Přehled uživatele — {{ report_user.name }} — MedCover{% endblock %}

{% block content %}
<div class="d-flex justify-content-between align-items-center mb-3">
  <h2 class="mb-0">
    Přehled uživatele:
    <span class="text-muted fw-normal">{{ report_user.name }}</span>
  </h2>
  <div>
    <a href="{{ url_for('reports.index') }}" class="btn btn-outline-secondary btn-sm">← Zpět na přehledy</a>
    <a href="{{ url_for('reports.user_report', user_id=report_user.id, from_date=from_date, to_date=to_date, format='csv') }}"
       class="btn btn-outline-success btn-sm ms-1">⬇ Stáhnout CSV</a>
  </div>
</div>

{# Date-range filter #}
<div class="card mb-4">
  <div class="card-body">
    <form method="GET" action="{{ url_for('reports.user_report', user_id=report_user.id) }}" class="row g-3 align-items-end">
      <div class="col-md-4">
        <label for="from_date" class="form-label">Od data</label>
        <input type="text" class="form-control flatpickr-date" id="from_date" name="from_date"
               value="{{ from_date }}">
      </div>
      <div class="col-md-4">
        <label for="to_date" class="form-label">Do data</label>
        <input type="text" class="form-control flatpickr-date" id="to_date" name="to_date"
               value="{{ to_date }}">
      </div>
      <div class="col-md-4">
        <button type="submit" class="btn btn-danger w-100">Filtrovat</button>
      </div>
    </form>
    <div class="d-flex flex-wrap gap-2 mt-3">
      {% for label, fd, td in quick_ranges %}
      <a href="{{ url_for('reports.user_report', user_id=report_user.id, from_date=fd, to_date=td) }}"
         class="btn btn-outline-secondary btn-sm">{{ label }}</a>
      {% endfor %}
      {% if from_date or to_date %}
      <a href="{{ url_for('reports.user_report', user_id=report_user.id) }}"
         class="btn btn-outline-secondary btn-sm">× Zrušit filtr</a>
      {% endif %}
    </div>
  </div>
</div>

{% if date_error %}
<div class="alert alert-danger">{{ date_error }}</div>
{% endif %}

{# User info #}
<div class="card mb-4">
  <div class="card-body">
    <dl class="row mb-0">
      <dt class="col-sm-3">E-mail</dt>
      <dd class="col-sm-9">{{ report_user.email }}</dd>
      <dt class="col-sm-3">Kvalifikace</dt>
      <dd class="col-sm-9">
        {% if report_user.qualifications %}
          {% for cred in report_user.qualifications %}
            {{ badge_secondary(cred.name, extra_classes='me-1') }}
          {% endfor %}
        {% else %}
          <span class="text-muted">—</span>
        {% endif %}
      </dd>
    </dl>
  </div>
</div>

{# Summary stats — shifts #}
<h5 class="mb-2 text-muted fw-normal small text-uppercase">Směny</h5>
<div class="row g-3 mb-3">
  <div class="col-6 col-md-4">
    <div class="card text-center">
      <div class="card-body py-3">
        <div class="fs-3 fw-bold text-danger">{{ stats.shifts_served }}</div>
        <div class="text-muted small">Odsloužené</div>
      </div>
    </div>
  </div>
  <div class="col-6 col-md-4">
    <div class="card text-center">
      <div class="card-body py-3">
        <div class="fs-3 fw-bold text-danger">{{ stats.shifts_planned }}</div>
        <div class="text-muted small">Plánované</div>
      </div>
    </div>
  </div>
  <div class="col-6 col-md-4">
    <div class="card text-center">
      <div class="card-body py-3">
        <div class="fs-3 fw-bold text-danger">{{ stats.shifts_total }}</div>
        <div class="text-muted small">Celkem</div>
      </div>
    </div>
  </div>
</div>

{# Summary stats — hours #}
<h5 class="mb-2 text-muted fw-normal small text-uppercase">Hodiny</h5>
<div class="row g-3 mb-3">
  <div class="col-6 col-md-3">
    <div class="card text-center">
      <div class="card-body py-3">
        <div class="fs-3 fw-bold text-danger">{{ stats.hours_served | cznum }}</div>
        <div class="text-muted small">Odsloužené</div>
      </div>
    </div>
  </div>
  <div class="col-6 col-md-3">
    <div class="card text-center">
      <div class="card-body py-3">
        <div class="fs-3 fw-bold text-danger">{{ stats.hours_planned | cznum }}</div>
        <div class="text-muted small">Plánované</div>
      </div>
    </div>
  </div>
  <div class="col-6 col-md-3">
    <div class="card text-center">
      <div class="card-body py-3">
        <div class="fs-3 fw-bold text-danger">{{ stats.hours_total | cznum }}</div>
        <div class="text-muted small">Celkem</div>
      </div>
    </div>
  </div>
  <div class="col-6 col-md-3">
    <div class="card text-center">
      <div class="card-body py-3">
        <div class="fs-3 fw-bold text-danger">{{ stats.hours_free | cznum }}</div>
        <div class="text-muted small">Celkem zdarma</div>
      </div>
    </div>
  </div>
</div>

{# Summary stats — dates #}
<div class="row g-3 mb-4">
  <div class="col-6 col-md-3">
    <div class="card text-center">
      <div class="card-body py-3">
        <div class="fs-5 fw-bold text-danger">
          {% if stats.last_shift %}{{ stats.last_shift | localdt("%d.%m.%Y") }}{% else %}<span class="text-muted fs-6">—</span>{% endif %}
        </div>
        <div class="text-muted small">Poslední směna</div>
      </div>
    </div>
  </div>
  <div class="col-6 col-md-3">
    <div class="card text-center">
      <div class="card-body py-3">
        <div class="fs-5 fw-bold text-danger">
          {% if stats.next_shift %}{{ stats.next_shift | localdt("%d.%m.%Y") }}{% else %}<span class="text-muted fs-6">—</span>{% endif %}
        </div>
        <div class="text-muted small">Příští směna</div>
      </div>
    </div>
  </div>
</div>

{# Events table #}
{% if rows %}
<div class="table-responsive">
  <table class="table table-hover table-sm align-middle">
    <thead class="table-light">
      <tr>
        <th>Akce</th>
        <th>Datum</th>
        <th>Stav</th>
        <th class="text-end">Naplán. hodiny</th>
        <th class="text-end">Odprac. hodiny</th>
      </tr>
    </thead>
    <tbody>
      {% for row in rows %}
      <tr>
        <td>
          <a href="{{ url_for('events.detail', event_id=row.event.id) }}">{{ row.event.name }}</a>
        </td>
        <td class="text-nowrap">{{ row.event.start_datetime | localdt("%d.%m.%Y") }}</td>
        <td>
          <span class="badge
            {% if row.event.status.value == 'Dokončena' %}bg-success
            {% elif row.event.status.value == 'Zrušena' %}bg-danger
            {% elif row.event.status.value == 'Koncept' %}bg-secondary
            {% else %}bg-primary{% endif %}">
            {{ row.event.status.value }}
          </span>
        </td>
        <td class="text-end">{{ row.planned_hours | cznum }}</td>
        <td class="text-end">
          {% if row.actual_hours is not none %}{{ row.actual_hours | cznum }}{% else %}<span class="text-muted">—</span>{% endif %}
        </td>
      </tr>
      {% endfor %}
    </tbody>
    <tfoot class="table-light fw-bold">
      <tr>
        <td colspan="3">Celkem (dokončené akce)</td>
        <td class="text-end text-muted">—</td>
        <td class="text-end">{{ stats.hours_served | cznum }}</td>
      </tr>
    </tfoot>
  </table>
</div>
{% else %}
<div class="alert alert-info">Uživatel nemá žádné přiřazení k akcím.</div>
{% endif %}
{% endblock %}