{% extends "base.html" %}
{% from "_macros.html" import app_pill %}

{% block title %}Lagerorte{% endblock %}
{% block heading %}Lagerorte{% endblock %}
{% block topbar_actions %}
  <a class="btn btn-primary" href="/locations/new">+ Neuer Lagerort</a>
{% endblock %}

{% block content %}
<div class="card">
  <div class="card-header" style="display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;">
    <div>
      <h2>{{ total if total is defined else locations|length }} Lagerorte</h2>
      <p class="sub">Schubladen, Regale, Behälter — über beide Systeme hinweg{% if total_pages and total_pages > 1 %} · Seite {{ page }} von {{ total_pages }}{% endif %}</p>
    </div>
    <form method="get" action="/locations" style="display:flex;gap:6px;align-items:center;">
      <input type="text" name="q" value="{{ q or '' }}" placeholder="Code suchen..." style="padding:6px 10px;border:1px solid #d4d4d4;border-radius:6px;font-size:13px;min-width:180px;">
      <button type="submit" class="btn btn-sm btn-secondary">Suchen</button>
      {% if q %}<a href="/locations" class="btn btn-sm btn-secondary">×</a>{% endif %}
    </form>
  </div>
  {% if locations %}
  <table class="data-table">
    <thead>
      <tr>
        <th></th>
        <th>Code</th>
        <th>Größe</th>
        <th class="num">Kapazität</th>
        <th>Gruppe</th>
        <th class="num">Artikel</th>
        <th class="num">Bestand</th>
        <th>Status</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      {% for l in locations %}
      <tr>
        <td>{{ app_pill(l.source_app) }}</td>
        <td class="nums font-medium">{{ l.code }}</td>
        <td class="text-neutral-600">{{ l.size or '—' }}</td>
        <td class="num">{{ l.capacity or '—' }}</td>
        <td class="text-neutral-600">{{ l.group_name or '—' }}</td>
        <td class="num">{{ l.item_count or 0 }}</td>
        <td class="num">{{ l.total_qty or 0 }}</td>
        <td>{% if l.is_used %}<span class="badge badge-blue">In Nutzung</span>{% else %}<span class="badge badge-neutral">Frei</span>{% endif %}</td>
        <td class="text-right"><a class="btn btn-sm btn-secondary" href="/locations/{{ l.id }}/edit">Bearbeiten</a></td>
      </tr>
      {% endfor %}
    </tbody>
  </table>

  {% if total_pages and total_pages > 1 %}
  <nav style="display:flex;justify-content:center;align-items:center;gap:6px;padding:18px 0;flex-wrap:wrap;">
    {% set _qs = '&q=' + q if q else '' %}
    {% if page > 1 %}
      <a class="btn btn-sm btn-secondary" href="/locations?page=1{{ _qs }}">«</a>
      <a class="btn btn-sm btn-secondary" href="/locations?page={{ page-1 }}{{ _qs }}">‹ Zurück</a>
    {% endif %}
    {% set _from = [1, page-2]|max %}
    {% set _to = [total_pages, page+2]|min %}
    {% if _from > 1 %}<span style="color:#999;">...</span>{% endif %}
    {% for p in range(_from, _to+1) %}
      {% if p == page %}
        <span class="btn btn-sm" style="background:var(--brand-blue);color:#fff;">{{ p }}</span>
      {% else %}
        <a class="btn btn-sm btn-secondary" href="/locations?page={{ p }}{{ _qs }}">{{ p }}</a>
      {% endif %}
    {% endfor %}
    {% if _to < total_pages %}<span style="color:#999;">...</span>{% endif %}
    {% if page < total_pages %}
      <a class="btn btn-sm btn-secondary" href="/locations?page={{ page+1 }}{{ _qs }}">Weiter ›</a>
      <a class="btn btn-sm btn-secondary" href="/locations?page={{ total_pages }}{{ _qs }}">»</a>
    {% endif %}
  </nav>
  {% endif %}

  {% else %}
  <div class="p-12 text-center text-sm text-neutral-500">{% if q %}Keine Lagerorte gefunden für „{{ q }}".{% else %}Keine Lagerorte vorhanden.{% endif %}</div>
  {% endif %}
</div>
{% endblock %}