{% extends "base.html" %}
{% block title %}Výkaz práce — MedCover{% endblock %}

{% block content %}
<div class="container py-4 maxw-640">
  <h2 class="mb-4">Výkaz práce</h2>

  {# ── Generator form ──────────────────────────────────────────────────────── #}
  <div class="card mb-4">
    <div class="card-header fw-semibold">Vygenerovat nový výkaz</div>
    <div class="card-body">
      <p class="text-muted small mb-3">
        Vygenerujte předvyplněný výkaz odpracovaných hodin za vybraný měsíc.
        Soubor je k dispozici ke stažení po dobu 24 hodin.
      </p>
      <form method="POST" action="{{ url_for('work_report.generate') }}" class="row g-3 align-items-end">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">

        <div class="col">
          <label for="month" class="form-label fw-semibold">Měsíc</label>
          <select class="form-select" id="month" name="month" required>
            {% set month_names = [
              (1, "Leden"), (2, "Únor"), (3, "Březen"), (4, "Duben"),
              (5, "Květen"), (6, "Červen"), (7, "Červenec"), (8, "Srpen"),
              (9, "Září"), (10, "Říjen"), (11, "Listopad"), (12, "Prosinec")
            ] %}
            {% for num, name in month_names %}
              <option value="{{ num }}"
                {% if num == current_month %}selected{% endif %}
                {% if num > current_month %}disabled{% endif %}>
                {{ name }}
              </option>
            {% endfor %}
          </select>
        </div>

        <div class="col-3">
          <label for="year" class="form-label fw-semibold">Rok</label>
          <select class="form-select" id="year" name="year" required>
            {% for y in range(current_year - 3, current_year + 1) %}
              <option value="{{ y }}" {% if y == current_year %}selected{% endif %}>{{ y }}</option>
            {% endfor %}
          </select>
        </div>

        <div class="col-auto">
          <button type="submit" class="btn btn-primary btn-sm">
            <i class="bi bi-arrow-repeat me-1"></i>Vygenerovat
          </button>
        </div>
      </form>
    </div>
  </div>

  {# ── Available reports ───────────────────────────────────────────────────── #}
  {% if reports %}
  <div class="card">
    <div class="card-header fw-semibold">Dostupné výkazy ke stažení</div>
    <ul class="list-group list-group-flush">
      {% for r in reports %}
      <li class="list-group-item d-flex justify-content-between align-items-center">
        <div>
          <span class="fw-semibold">{{ r.month_name }} {{ r.year }}</span>
          <br>
          <small class="text-muted">
            Vygenerováno: {{ r.generated_at | localdt }}&nbsp;&nbsp;·&nbsp;&nbsp;
            Vyprší: {{ r.expires_at | localdt }}
          </small>
        </div>
        <a href="{{ url_for('work_report.download', year=r.year, month=r.month) }}"
           class="btn btn-outline-success btn-sm">
          <i class="bi bi-file-earmark-excel me-1"></i>Stáhnout
        </a>
      </li>
      {% endfor %}
    </ul>
  </div>
  {% else %}
  <p class="text-muted">Zatím žádné vygenerované výkazy.</p>
  {% endif %}

  <div class="mt-3">
    <a href="{{ url_for('main.dashboard') }}" class="btn btn-outline-secondary btn-sm">← Zpět</a>
  </div>
</div>
{% endblock %}

{% block scripts %}
<div id="work-report-data"
     data-current-year="{{ current_year }}"
     data-current-month="{{ current_month }}"
     hidden></div>
<script src="{{ url_for('static', filename='js/work-report.js') }}"></script>
{% endblock %}