{% extends 'base.html' %}
{% block content %}
<div class="d-flex justify-content-between align-items-center mb-3">
  <h2>Tickets</h2>
  <a href="/tickets/new" class="btn btn-primary">Neues Ticket</a>
</div>

<form class="row g-2 mb-3" method="get">
  <div class="col-md-3 col-sm-6">
    <select name="project_id" class="form-select">
      <option value="">Alle Projekte</option>
      {% for p in projects %}
      <option value="{{p.id}}" {% if selected_project and (p.id|string) == (selected_project|string) %}selected{% endif %}>{{ p.name }}</option>
      {% endfor %}
    </select>
  </div>
  <div class="col-md-3 col-sm-6">
    <input type="text" class="form-control" name="q" value="{{ q or '' }}" placeholder="Suche (Titel, Beschreibung)">
  </div>
  <div class="col-md-2 col-sm-4">
    <select name="status" class="form-select">
      <option value="">Status: alle</option>
      {% for s in ['open','in_progress','closed'] %}
      <option value="{{s}}" {% if selected_status==s %}selected{% endif %}>{{ s }}</option>
      {% endfor %}
    </select>
  </div>
  <div class="col-md-2 col-sm-4">
    <select name="priority" class="form-select">
      <option value="">Prio: alle</option>
      {% for p in ['low','normal','high','urgent'] %}
      <option value="{{p}}" {% if selected_priority==p %}selected{% endif %}>{{ p }}</option>
      {% endfor %}
    </select>
  </div>
  <div class="col-md-2 col-sm-4 d-grid">
    <button class="btn btn-outline-primary" type="submit">Filtern</button>
  </div>
  <div class="col-12">
    <a href="/tickets" class="small">Filter zurücksetzen</a>
    <span class="mx-1">·</span>
    <a href="/projects" class="small">Projekte verwalten</a>
  </div>
</form>

<div class="table-responsive">
  <table class="table table-striped align-middle">
    <thead>
      <tr>
        <th>ID</th>
        <th>Titel</th>
        <th>Projekt</th>
        <th>Status</th>
        <th>Prio</th>
        <th>Erstellt</th>
      </tr>
    </thead>
    <tbody>
      {% for t in tickets %}
      <tr>
        <td>{{ t.id }}</td>
        <td><a href="/tickets/{{t.id}}">{{ t.title }}</a></td>
        <td>{{ t.project_name }}</td>
        <td>
          {% set s = t.status %}
          {% set status_class = 'bg-secondary' %}
          {% if s == 'open' %}{% set status_class = 'bg-warning text-dark' %}
          {% elif s == 'in_progress' %}{% set status_class = 'bg-info text-dark' %}
          {% elif s == 'closed' %}{% set status_class = 'bg-success' %}{% endif %}
          <span class="badge rounded-pill {{ status_class }}">{{ t.status }}</span>
        </td>
        <td>
          {% set p = t.priority %}
          {% set priority_class = 'bg-secondary' %}
          {% if p == 'low' %}{% set priority_class = 'bg-secondary' %}
          {% elif p == 'normal' %}{% set priority_class = 'bg-primary' %}
          {% elif p == 'high' %}{% set priority_class = 'bg-danger' %}
          {% elif p == 'urgent' %}{% set priority_class = 'bg-danger' %}{% endif %}
          <span class="badge rounded-pill {{ priority_class }}">{{ t.priority }}</span>
        </td>
        <td><small class="text-muted">{{ t.created_at }}</small></td>
      </tr>
      {% else %}
      <tr><td colspan="6" class="text-muted">Keine Tickets.</td></tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% endblock %}