{% extends "base.html" %}

{% block title %}Inventur{% endblock %}
{% block heading %}Inventur{% endblock %}
{% block topbar_actions %}
  <span class="text-sm text-neutral-500 nums">{{ sessions|length }} Sitzung{% if sessions|length != 1 %}en{% endif %}</span>
{% endblock %}

{% block content %}

{# ---- Neue Inventur ---- #}
<div class="card max-w-3xl mb-4">
  <div class="card-header"><div>
    <h2>Neue Inventur starten</h2>
    <p class="sub">Snapshot der aktuellen Bestände — danach gezählt + Differenzen erfasst</p>
  </div></div>
  <form method="post" action="/inventur/new" class="p-5 grid grid-cols-3 gap-x-6 gap-y-4">
    <div class="col-span-2">
      <label class="text-[10px] uppercase tracking-wider font-semibold text-neutral-500">Bezeichnung</label>
      <input class="input mt-1 w-full" type="text" name="title"
             value="Jahres-Inventur {{ '2026' }}" placeholder="Jahres-Inventur 2026">
    </div>
    <div>
      <label class="text-[10px] uppercase tracking-wider font-semibold text-neutral-500">Bereich</label>
      <select name="scope_type" class="select mt-1 w-full">
        <option value="all" selected>Alle Artikel</option>
        {% for code, label in ITEM_TYPES.items() %}
        <option value="{{ code }}">Nur {{ label }}</option>
        {% endfor %}
      </select>
    </div>
    <div class="col-span-3">
      <label class="text-[10px] uppercase tracking-wider font-semibold text-neutral-500">Notiz (optional)</label>
      <input class="input mt-1 w-full" type="text" name="note"
             placeholder="z.B. Stichtag 31.12.2026 · Zähl-Team A+B">
    </div>
    <div class="col-span-3 flex justify-end">
      <button class="btn btn-primary" type="submit">Inventur starten</button>
    </div>
  </form>
</div>

{# ---- Sitzungs-Liste ---- #}
<div class="card">
  <div class="card-header"><div><h2>Vergangene Inventuren</h2></div></div>
  {% if sessions %}
  <table class="data-table">
    <thead>
      <tr>
        <th>Nr.</th>
        <th>Bezeichnung</th>
        <th class="num">Beginn</th>
        <th class="num">Abgeschlossen</th>
        <th class="num">Positionen</th>
        <th class="num">Gezählt</th>
        <th class="num">Differenzen</th>
        <th>Status</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      {% for s in sessions %}
      <tr class="cursor-pointer" onclick="location='/inventur/{{ s.id }}'">
        <td class="nums font-semibold">{{ s.session_no }}</td>
        <td>{{ s.title }}</td>
        <td class="num text-xs nums">{{ s.started_at[:16] }}</td>
        <td class="num text-xs nums">{{ s.closed_at[:16] if s.closed_at else '—' }}</td>
        <td class="num nums">{{ s.line_count }}</td>
        <td class="num nums {% if s.counted_count == s.line_count %}text-emerald-700 font-semibold{% else %}text-amber-700{% endif %}">
          {{ s.counted_count }} / {{ s.line_count }}
        </td>
        <td class="num nums {% if s.diff_count %}text-red-600 font-semibold{% else %}text-neutral-400{% endif %}">
          {{ s.diff_count or '—' }}
        </td>
        <td>
          <span class="badge badge-{% if s.status == 'closed' %}emerald{% elif s.status == 'cancelled' %}neutral{% else %}amber{% endif %}">
            {% if s.status == 'closed' %}Abgeschlossen
            {% elif s.status == 'cancelled' %}Storniert
            {% else %}Im Zählen{% endif %}
          </span>
        </td>
        <td class="text-right" onclick="event.stopPropagation()">
          <a class="btn btn-sm btn-secondary" href="/inventur/{{ s.id }}">Öffnen</a>
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
  {% else %}
  <div class="p-12 text-center text-sm text-neutral-500">
    Noch keine Inventur erfasst. Starte oben eine neue Sitzung.
  </div>
  {% endif %}
</div>
{% endblock %}