{% extends "base.html" %}
{% block title %}Feedback-Backlog{% endblock %}
{% block content %}
<div class="flex items-center justify-between mb-5">
  <h1 class="page-title">Feedback-Backlog</h1>
  <span class="text-sm text-slate-500">{{ eintraege.count }} Einträge</span>
</div>

<form method="get" class="flex gap-3 mb-5 flex-wrap">
  <select name="status" class="form-input w-auto text-sm" onchange="this.form.submit()">
    <option value="">Alle Status</option>
    {% for val, label in status_choices %}
    <option value="{{ val }}" {% if val == current_status %}selected{% endif %}>{{ label }}</option>
    {% endfor %}
  </select>
  <select name="kategorie" class="form-input w-auto text-sm" onchange="this.form.submit()">
    <option value="">Alle Kategorien</option>
    {% for val, label in kategorie_choices %}
    <option value="{{ val }}" {% if val == current_kategorie %}selected{% endif %}>{{ label }}</option>
    {% endfor %}
  </select>
  <select name="dringlichkeit" class="form-input w-auto text-sm" onchange="this.form.submit()">
    <option value="">Alle Dringlichkeiten</option>
    {% for val, label in dringlichkeit_choices %}
    <option value="{{ val }}" {% if val == current_dringlichkeit %}selected{% endif %}>{{ label }}</option>
    {% endfor %}
  </select>
  {% if current_status or current_kategorie or current_dringlichkeit %}
  <a href="?" class="text-sm text-slate-500 self-center hover:underline">Filter zurücksetzen</a>
  {% endif %}
</form>

<div class="card overflow-x-auto">
  {% if eintraege %}
  <table class="w-full text-sm">
    <thead>
      <tr class="text-left border-b border-slate-200">
        <th class="pb-2 font-medium text-slate-600">Titel</th>
        <th class="pb-2 font-medium text-slate-600">Beschreibung</th>
        <th class="pb-2 font-medium text-slate-600">Kategorie</th>
        <th class="pb-2 font-medium text-slate-600">Dringlichkeit</th>
        <th class="pb-2 font-medium text-slate-600">Status</th>
        <th class="pb-2 font-medium text-slate-600">Datum</th>
      </tr>
    </thead>
    {% for eintrag in eintraege %}
    {% include "feedback/partials/eintrag_zeile.html" %}
    {% endfor %}
  </table>
  {% else %}
  <p class="text-slate-500 text-sm">Keine Einträge gefunden.</p>
  {% endif %}
</div>
{% endblock %}