{% extends "base.html" %}

{% block title %}{{ item.ident }} — Baugruppe{% endblock %}
{% block heading %}
  <span style="color: var(--card-text-muted); font-size: 0.7em;">Baugruppe ·</span>
  {{ item.ident }}
{% endblock %}
{% block breadcrumb %}
  <p class="text-xs" style="color: var(--card-text-muted);">
    <a href="/assemblies" style="color: inherit;">Baugruppen</a> / {{ item.ident }}
  </p>
{% endblock %}

{% block topbar_actions %}
  <a class="btn btn-sm btn-secondary" href="/items/{{ item.id }}/bom">BOM-Editor</a>
  <a class="btn btn-sm btn-secondary" href="/items/{{ item.id }}/bom/print" target="_blank">Stückliste drucken (PDF)</a>
  <a class="btn btn-sm btn-secondary" href="/items/{{ item.id }}/edit">Artikel-Daten bearbeiten</a>
  <a class="btn btn-sm btn-primary" href="/quotes/new?item_id={{ item.id }}">Angebot daraus</a>
{% endblock %}

{% block content %}

{# === Header-Kachel mit Kerndaten === #}
<div class="card" style="margin-bottom:14px;">
  <div class="flex items-start gap-4">
    <div style="flex:1;">
      <div class="flex items-center gap-2" style="margin-bottom:6px;">
        <h2 style="margin:0; font-size: 1.25em;">{{ item.description or '(keine Bezeichnung)' }}</h2>
        {% if active_bom %}
          <span class="badge badge-emerald">aktive BOM v{{ active_bom.version }}</span>
        {% else %}
          <span class="badge badge-neutral">noch keine BOM</span>
        {% endif %}
        {% if item.item_type %}
          <span class="badge badge-neutral">{{ ITEM_TYPE_LABELS.get(item.item_type, item.item_type) }}</span>
        {% endif %}
        {% if complaints_open %}
          <span class="badge badge-rose">🔴 {{ complaints_open|length }} offene Reklamation{% if complaints_open|length != 1 %}en{% endif %}</span>
        {% endif %}
      </div>
      <div class="flex gap-6 text-xs" style="color: var(--card-text-muted);">
        <span><b style="color:var(--card-text);">Ident:</b> {{ item.ident }}</span>
        {% if item.quantity_total is not none %}
          <span><b style="color:var(--card-text);">Bestand:</b>
            {% if item.quantity_min and item.quantity_total <= item.quantity_min %}
              <span style="color:#d97706; font-weight:600;">{{ item.quantity_total }}</span>
              (min {{ item.quantity_min }} ⚠️)
            {% else %}
              {{ item.quantity_total }} {% if item.quantity_min %}(min {{ item.quantity_min }}){% endif %}
            {% endif %}
          </span>
        {% endif %}
        {% if costing %}
          <span><b style="color:var(--card-text);">Material-Kosten:</b> {{ "%.2f"|format(costing.material_cost or 0) }} €</span>
          <span><b style="color:var(--card-text);">Selbstkosten:</b> {{ "%.2f"|format(costing.total_cost or 0) }} €</span>
        {% endif %}
      </div>
    </div>
    <div class="flex gap-2">
      <a class="btn btn-sm btn-secondary" href="/items/{{ item.id }}">Standard-Artikel-Ansicht</a>
    </div>
  </div>
</div>

{# === Tab-Navigation === #}
<div class="card" style="padding:0; margin-bottom:14px;">
  <div class="tabs" style="border-bottom: 1px solid var(--border-color);">
    {% set tabs = [
      ('stammdaten',  '📋 Stammdaten'),
      ('stueckliste', '🧩 Stückliste'),
      ('fertigung',   '⚙️ Fertigung'),
      ('zeichnungen', '📐 Zeichnungen'),
      ('qm',          '✅ Qualität'),
      ('lager',       '📦 Lager'),
      ('kunden',      '👥 Kunden'),
      ('historie',    '🕒 Historie'),
    ] %}
    {% for key, label in tabs %}
      <a href="/assemblies/{{ item.id }}?tab={{ key }}"
         class="tab {% if tab == key %}is-active{% endif %}"
         style="padding: 0.7em 1.2em; text-decoration: none;">
        {{ label }}
      </a>
    {% endfor %}
  </div>
</div>

{# === Tab-Inhalte === #}

{% if tab == 'stammdaten' %}
<div class="card">
  <h3 style="margin-top:0;">Stammdaten</h3>
  <table class="data-table">
    <tr><th style="width:200px;">Ident / Artikel-Nr</th><td>{{ item.ident or '—' }}</td></tr>
    <tr><th>Bezeichnung</th><td>{{ item.description or '—' }}</td></tr>
    <tr><th>Artikel-Typ</th><td>{{ ITEM_TYPE_LABELS.get(item.item_type, item.item_type) or '—' }}</td></tr>
    <tr><th>Source-App</th><td>{{ item.source_app or '—' }}</td></tr>
    <tr><th>Aktive BOM</th><td>
      {% if active_bom %}
        v{{ active_bom.version }} · {{ bom_lines|length }} Positionen
        {% if active_bom.note %}<br><span class="text-xs" style="color:var(--card-text-muted);">{{ active_bom.note }}</span>{% endif %}
      {% else %}
        <span style="color:var(--card-text-muted);">Noch keine BOM</span>
        — <a href="/items/{{ item.id }}/bom">BOM jetzt anlegen →</a>
      {% endif %}
    </td></tr>
    <tr><th>Aktueller Bestand</th><td>{{ item.quantity_total if item.quantity_total is not none else '—' }}</td></tr>
    <tr><th>Mindest-Bestand</th><td>{{ item.quantity_min if item.quantity_min is not none else '—' }}</td></tr>
    <tr><th>Bestellt</th><td>{{ item.on_order if item.on_order is not none else '—' }}</td></tr>
  </table>
  <p class="text-xs" style="color:var(--card-text-muted); margin-top:14px;">
    Zum Bearbeiten von Stammdaten:
    <a href="/items/{{ item.id }}/edit">→ Artikel bearbeiten</a>
  </p>
</div>
{% endif %}

{% if tab == 'stueckliste' %}
<div class="card">
  <div class="flex justify-between items-center" style="margin-bottom:12px;">
    <h3 style="margin:0;">Stückliste{% if active_bom %} v{{ active_bom.version }}{% endif %}</h3>
    <a href="/items/{{ item.id }}/bom" class="btn btn-sm btn-primary">→ BOM-Editor öffnen</a>
  </div>

  {% if bom_lines %}
  <table class="data-table">
    <thead>
      <tr>
        <th class="num">Pos</th>
        <th>Komponente</th>
        <th class="num">Menge</th>
        <th>Einheit</th>
        <th class="num">€/Einheit</th>
        <th class="num">Gesamt</th>
      </tr>
    </thead>
    <tbody>
      {% for line in bom_lines %}
      <tr>
        <td class="num nums">{{ loop.index * 10 }}</td>
        <td>
          {% if line.line_type == 'sub_assembly' %}
            <span class="badge badge-emerald">Sub-Baugruppe</span>
            <a href="/assemblies/{{ line.sub_item_id }}" style="color:var(--brand-blue-light); text-decoration:none;">
              {{ line.sub_ident or '—' }} ↗
            </a>
            {% if line.sub_desc %}<span class="text-xs" style="color:var(--card-text-muted);"> · {{ line.sub_desc }}</span>{% endif %}
          {% elif line.line_type == 'material' %}
            {{ line.material_name or '—' }}
            {% if line.material_code %}<span class="text-xs" style="color:var(--card-text-muted);"> · {{ line.material_code }}</span>{% endif %}
          {% elif line.line_type == 'operation' %}
            <span class="badge badge-orange">Operation</span> {{ line.step_name or '—' }}
            {% if line.machine_name %}<span class="text-xs" style="color:var(--card-text-muted);"> · {{ line.machine_name }}</span>{% endif %}
          {% elif line.line_type == 'tool' %}
            <span class="badge badge-amber">Werkzeug</span> {{ line.tool_ident or '—' }}
          {% else %}
            {{ line.description or line.material_name or '—' }}
          {% endif %}
        </td>
        <td class="num nums">{{ line.qty }}</td>
        <td class="text-xs">
          {% if line.line_type == 'material' %}kg/Stk
          {% elif line.line_type == 'sub_assembly' %}Stk/Stk
          {% else %}{{ line.unit or 'Stk' }}{% endif %}
        </td>
        <td class="num nums">{{ "%.2f"|format(line.unit_price or 0) }} €</td>
        <td class="num nums">{{ "%.2f"|format((line.qty or 0) * (line.unit_price or 0)) }} €</td>
      </tr>
      {% endfor %}
      <tr style="border-top: 2px solid var(--border-color); font-weight: 600;">
        <td colspan="5" class="text-right">Material-Summe:</td>
        <td class="num nums">{{ "%.2f"|format(costing.material_cost if costing else 0) }} €</td>
      </tr>
    </tbody>
  </table>
  {% else %}
    <p style="color:var(--card-text-muted);">Noch keine Positionen — <a href="/items/{{ item.id }}/bom">BOM-Editor öffnen →</a></p>
  {% endif %}

  {% if boms|length > 1 %}
  <p class="text-xs" style="color:var(--card-text-muted); margin-top:14px;">
    {{ boms|length }} BOM-Versionen vorhanden (älter = archiviert).
    <a href="/items/{{ item.id }}/bom">Versions-Historie ansehen →</a>
  </p>
  {% endif %}
</div>
{% endif %}

{% if tab == 'fertigung' %}
<div class="card">
  <h3 style="margin-top:0;">Fertigungs-Plan</h3>
  <p style="color:var(--card-text-muted);">
    Arbeitsschritte mit Maschinen-Zuordnung, Rüst- und Bearbeitungs-Zeiten —
    Voraussetzung für realistische Kostenkalkulation und Werkstatt-Planung.
  </p>

  {% if costing %}
  <table class="data-table">
    <thead>
      <tr>
        <th class="num">Pos</th>
        <th>Arbeitsschritt</th>
        <th>Maschine / Arbeitsplatz</th>
        <th class="num">Rüstzeit</th>
        <th class="num">Stückzeit</th>
        <th class="num">Stundensatz</th>
        <th class="num">Kosten</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td colspan="7" class="text-center" style="color:var(--card-text-muted); padding: 1.5em;">
          ⚙️ Detaillierter Fertigungs-Plan im Modul <a href="/setup-plans">Rüstpläne</a> hinterlegen.
          <br>
          Geschätzte Gesamt-Selbstkosten (Material + Fertigung): <b>{{ "%.2f"|format(costing.total_cost or 0) }} €</b>
        </td>
      </tr>
    </tbody>
  </table>
  {% else %}
    <p style="color:var(--card-text-muted);">Keine BOM vorhanden — kein Kalkulations-Vergleich möglich.</p>
  {% endif %}

  <div style="margin-top:18px; padding: 12px; background: #f9fafb; border-radius: 6px; font-size: 0.9em;">
    <b>Tipp:</b> Im <a href="/setup-plans">Rüstplan-Modul</a> kannst du je Baugruppe einen
    17-Felder-Setup-Plan hinterlegen (Material, NC-Programm, Werkzeuge, Spannmittel, Z-Null,
    kritische Maße etc.). Der Rüstplan erscheint dann automatisch auf dem
    <a href="/shopfloor">Shopfloor-Tablet</a> wenn ein Job dieser Baugruppe gestartet wird.
  </div>
</div>
{% endif %}

{% if tab == 'zeichnungen' %}
<div class="card">
  <h3 style="margin-top:0;">Zeichnungen &amp; Dokumente</h3>
  <p style="color:var(--card-text-muted);">
    2D-Fertigungszeichnungen, 3D-CAD-Modelle, Werkstoff-Zertifikate, Mess-Pläne,
    EMPB/PPAP — alles versioniert im DMS.
  </p>

  <div style="padding: 1.5em; background: #f9fafb; border-radius: 8px; text-align: center;">
    <p style="margin: 0 0 12px 0; color: var(--card-text-muted);">
      Dokumente zu diesem Artikel werden im DMS verwaltet:
    </p>
    <a href="/dms?entity_type=item&amp;entity_id={{ item.id }}" class="btn btn-primary">
      📐 DMS für {{ item.ident }} öffnen
    </a>
    <p class="text-xs" style="margin-top: 16px; color: var(--card-text-muted);">
      Unterstützte Formate: PDF, DWG, DXF, STEP, STL, 3MF, IGES, Fotos<br>
      Mit Versionierung, Verfallsdatum, Bulk-ZIP-Download
    </p>
  </div>
</div>
{% endif %}

{% if tab == 'qm' %}
<div class="card">
  <h3 style="margin-top:0;">Qualität &amp; Reklamationen</h3>

  {% if complaints_open %}
    <h4 style="color: #dc2626;">🔴 Offene Reklamationen ({{ complaints_open|length }})</h4>
    <table class="data-table" style="margin-bottom: 20px;">
      <thead>
        <tr>
          <th>Reklamation-Nr</th>
          <th>Typ</th>
          <th>Status</th>
          <th>Eröffnet</th>
          <th>Beschreibung</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        {% for c in complaints_open %}
        <tr>
          <td class="nums font-semibold">{{ c.complaint_no or c.id }}</td>
          <td><span class="badge badge-neutral">{{ c.kind }}</span></td>
          <td><span class="badge badge-rose">{{ c.status }}</span></td>
          <td class="text-xs nums">{{ (c.opened_at or '')[:10] }}</td>
          <td class="text-sm" style="max-width: 400px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
            {{ c.description or '—' }}
          </td>
          <td><a href="/complaints/{{ c.id }}" class="btn btn-sm btn-secondary">→</a></td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  {% else %}
    <p style="color: #16a34a;">✓ Keine offenen Reklamationen für diese Baugruppe.</p>
  {% endif %}

  <div class="grid" style="grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 20px;">
    <div style="padding: 1em; background: #f9fafb; border-radius: 8px;">
      <h4 style="margin: 0 0 8px;">📏 Mess-Protokolle</h4>
      <p style="color: var(--card-text-muted); font-size: 0.9em; margin: 0 0 12px;">
        Kritische Maße, Toleranzen, Mess-Methoden hinterlegen.
      </p>
      <a href="/measurements" class="btn btn-sm btn-secondary">Mess-Modul öffnen</a>
    </div>
    <div style="padding: 1em; background: #f9fafb; border-radius: 8px;">
      <h4 style="margin: 0 0 8px;">📊 SPC / Cpk-Charts</h4>
      <p style="color: var(--card-text-muted); font-size: 0.9em; margin: 0 0 12px;">
        Statistische Prozesslenkung für IATF-16949 / Automotive.
      </p>
      <a href="/spc" class="btn btn-sm btn-secondary">SPC öffnen</a>
    </div>
  </div>
</div>
{% endif %}

{% if tab == 'lager' %}
<div class="card">
  <h3 style="margin-top:0;">Lager &amp; Bestand</h3>
  <table class="data-table">
    <tr><th style="width:240px;">Aktueller Bestand</th>
      <td class="nums font-semibold">{{ item.quantity_total if item.quantity_total is not none else '—' }}</td>
    </tr>
    <tr><th>Mindest-Bestand</th>
      <td class="nums">{{ item.quantity_min if item.quantity_min is not none else '—' }}</td>
    </tr>
    <tr><th>Bestellt (in Bestellung)</th>
      <td class="nums">{{ item.on_order if item.on_order is not none else 0 }}</td>
    </tr>
    <tr><th>Status</th>
      <td>
        {% if item.quantity_min and item.quantity_total <= item.quantity_min %}
          <span class="badge badge-amber">⚠️ Bestand unter Mindest-Bestand — Bestellvorschlag prüfen</span>
        {% else %}
          <span class="badge badge-emerald">✓ Bestand OK</span>
        {% endif %}
      </td>
    </tr>
  </table>

  <div style="margin-top: 20px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px;">
    <a href="/lots?item_id={{ item.id }}" class="btn btn-secondary">📦 Chargen ansehen</a>
    <a href="/orders/suggestions" class="btn btn-secondary">🛒 Bestellvorschläge</a>
  </div>
</div>
{% endif %}

{% if tab == 'kunden' %}
<div class="card">
  <h3 style="margin-top:0;">Kunden-Bezug — Verkaufs-Historie</h3>

  {% if customers_agg %}
    <h4 style="margin-top: 18px;">Top-Kunden für diese Baugruppe</h4>
    <table class="data-table">
      <thead>
        <tr>
          <th>Kunde</th>
          <th class="num">Bestellungen</th>
          <th class="num">Σ Menge</th>
          <th class="num">Ø Preis</th>
          <th>Letzter Kauf</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        {% for c in customers_agg %}
        <tr>
          <td class="font-semibold">{{ c.customer_name or '—' }}</td>
          <td class="num nums">{{ c.n_invoices }}</td>
          <td class="num nums">{{ (c.total_qty or 0)|int }}</td>
          <td class="num nums">{{ "%.2f"|format(c.avg_price or 0) }} €</td>
          <td class="text-xs nums">{{ (c.last_purchase or '')[:10] }}</td>
          <td>
            <a href="/customers/{{ c.customer_id }}" class="btn btn-sm btn-secondary">Kunde →</a>
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  {% else %}
    <p style="color:var(--card-text-muted);">Noch keine Verkäufe für diese Baugruppe erfasst.</p>
  {% endif %}

  {% if sales_history %}
    <h4 style="margin-top: 24px;">Einzel-Verkäufe (letzte 50)</h4>
    <table class="data-table">
      <thead>
        <tr>
          <th>Datum</th>
          <th>Rechnung-Nr</th>
          <th>Kunde</th>
          <th class="num">Menge</th>
          <th class="num">€/Stk</th>
          <th class="num">Σ Netto</th>
        </tr>
      </thead>
      <tbody>
        {% for s in sales_history %}
        <tr>
          <td class="text-xs nums">{{ (s.issue_date or '')[:10] }}</td>
          <td class="text-xs nums">{{ s.invoice_no or '—' }}</td>
          <td>{{ s.customer_name or '—' }}</td>
          <td class="num nums">{{ (s.qty or 0)|int }}</td>
          <td class="num nums">{{ "%.2f"|format(s.unit_price or 0) }} €</td>
          <td class="num nums">{{ "%.2f"|format(s.line_total_net or 0) }} €</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  {% endif %}
</div>
{% endif %}

{% if tab == 'historie' %}
<div class="card">
  <h3 style="margin-top:0;">Änderungs-Historie</h3>
  <p style="color: var(--card-text-muted);">
    Audit-Log aller Änderungen an dieser Baugruppe (Wer hat wann was geändert).
  </p>

  {% if audit_entries %}
    <table class="data-table">
      <thead>
        <tr>
          <th>Zeit</th>
          <th>User</th>
          <th>Aktion</th>
          <th>Details</th>
        </tr>
      </thead>
      <tbody>
        {% for a in audit_entries %}
        <tr>
          <td class="text-xs nums">{{ (a.created_at or '')[:16] }}</td>
          <td>{{ a.user_name or '—' }}</td>
          <td><span class="badge badge-neutral">{{ a.action }}</span></td>
          <td class="text-xs">{{ a.note or '—' }}</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  {% else %}
    <p style="color: var(--card-text-muted);">Noch keine Audit-Einträge.</p>
  {% endif %}

  {% if boms|length > 1 %}
    <h4 style="margin-top:24px;">BOM-Versionen ({{ boms|length }})</h4>
    <table class="data-table">
      <thead>
        <tr><th>Version</th><th>Status</th><th>Erstellt</th><th>Aktualisiert</th><th>Notiz</th></tr>
      </thead>
      <tbody>
        {% for b in boms %}
        <tr>
          <td class="nums font-semibold">v{{ b.version }}</td>
          <td>{% if b.is_active %}<span class="badge badge-emerald">aktiv</span>{% else %}<span class="badge badge-neutral">archiviert</span>{% endif %}</td>
          <td class="text-xs nums">{{ (b.created_at or '')[:16] }}</td>
          <td class="text-xs nums">{{ (b.updated_at or '')[:16] }}</td>
          <td class="text-xs">{{ b.note or '—' }}</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  {% endif %}
</div>
{% endif %}

{% endblock %}