{% extends "base.html" %}

{% block title %}Lieferschein erstellen — {{ order.order_no }}{% endblock %}
{% block breadcrumb %}<p class="text-xs text-neutral-500"><a href="/sales-orders" class="hover:underline">Aufträge</a> / <a href="/sales-orders/{{ order.id }}" class="hover:underline">{{ order.order_no }}</a> / Lieferschein</p>{% endblock %}
{% block heading %}Lieferschein erstellen — {{ order.order_no }}{% endblock %}

{% block content %}
{% if open_lines %}
<form method="post" action="/sales-orders/{{ order.id }}/ship" class="max-w-5xl space-y-4">

  <div class="card">
    <div class="card-header"><div>
      <h2>Picking</h2>
      <p class="sub">Mengen wählen — bei Teillieferung weniger als „offen" eintragen</p>
    </div></div>
    <table class="data-table">
      <thead>
        <tr>
          <th style="width:40px">#</th>
          <th>Beschreibung</th>
          <th class="num">Bestellt</th>
          <th class="num">Bisher geliefert</th>
          <th class="num">Offen</th>
          <th class="num" style="width:130px">Diesmal versenden</th>
          <th>Einh.</th>
        </tr>
      </thead>
      <tbody>
        {% for ln in open_lines %}
        <tr>
          <td class="nums text-neutral-500">{{ ln.line_no }}</td>
          <td>
            <div class="text-sm">{{ ln.description }}</div>
            {% if ln.item_ident %}<div class="text-[11px] text-neutral-500 nums">{{ ln.item_ident }}</div>{% endif %}
            <input type="hidden" name="sol_id" value="{{ ln.id }}">
          </td>
          <td class="num nums text-neutral-600">{{ "%.0f"|format(ln.qty_ordered) if ln.qty_ordered == ln.qty_ordered|int else "%.2f"|format(ln.qty_ordered) }}</td>
          <td class="num nums text-neutral-600">{{ "%.0f"|format(ln.qty_delivered) if ln.qty_delivered == ln.qty_delivered|int else "%.2f"|format(ln.qty_delivered) }}</td>
          <td class="num nums font-semibold text-emerald-700">{{ "%.0f"|format(ln.qty_open) if ln.qty_open == ln.qty_open|int else "%.2f"|format(ln.qty_open) }}</td>
          <td class="num">
            <input class="input w-full nums" type="text" name="qty_shipped"
                   value="{{ '%.0f'|format(ln.qty_open) if ln.qty_open == ln.qty_open|int else '%.2f'|format(ln.qty_open) }}"
                   style="text-align:right">
          </td>
          <td class="text-xs">{{ ln.unit }}</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>

  <div class="card">
    <div class="card-header"><div><h2>Versand</h2></div></div>
    <div class="p-5 grid grid-cols-3 gap-x-6 gap-y-4">
      <div>
        <label class="text-[10px] uppercase tracking-wider font-semibold text-neutral-500">Versanddatum</label>
        <input class="input mt-1 w-full nums" type="date" name="ship_date">
      </div>
      <div>
        <label class="text-[10px] uppercase tracking-wider font-semibold text-neutral-500">Versanddienstleister</label>
        <input class="input mt-1 w-full" type="text" name="carrier" placeholder="z.B. DHL · DPD · UPS · Spedition Müller">
      </div>
      <div>
        <label class="text-[10px] uppercase tracking-wider font-semibold text-neutral-500">Tracking-Nr.</label>
        <input class="input mt-1 w-full nums" type="text" name="tracking_no" placeholder="optional">
      </div>

      <div class="col-span-2">
        <label class="text-[10px] uppercase tracking-wider font-semibold text-neutral-500">Lieferadresse (abweichend, optional)</label>
        <textarea name="shipping_address" class="input mt-1 w-full" rows="3" placeholder="Wenn leer: Adresse vom Auftrag wird übernommen."></textarea>
      </div>

      <div>
        <label class="text-[10px] uppercase tracking-wider font-semibold text-neutral-500">Status</label>
        <select name="status" class="select mt-1 w-full">
          <option value="posted" selected>Gebucht</option>
          <option value="shipped">Versendet</option>
          <option value="draft">Entwurf</option>
        </select>
      </div>

      <div class="col-span-3">
        <label class="text-[10px] uppercase tracking-wider font-semibold text-neutral-500">Packhinweis</label>
        <textarea name="packing_note" class="input mt-1 w-full" rows="2" placeholder="z.B. Auf Palette · 2 Kisten · Vorsichtig — empfindlich"></textarea>
      </div>
    </div>
  </div>

  <div class="flex items-center justify-between max-w-5xl">
    <a class="btn btn-secondary" href="/sales-orders/{{ order.id }}">Abbrechen</a>
    <button class="btn btn-primary" type="submit">Lieferschein erstellen</button>
  </div>
</form>
{% else %}
<div class="card">
  <div class="p-12 text-center">
    <p class="text-sm text-neutral-500">Alle Positionen dieses Auftrags sind bereits ausgeliefert.</p>
    <a class="btn btn-secondary mt-4" href="/sales-orders/{{ order.id }}">Zurück</a>
  </div>
</div>
{% endif %}
{% endblock %}