{% extends "tesm_core/base.html" %}
{% from "tesm_core/macros.html" import field, textarea_field, pill, empty_state, alert %}

{% block page_title %}{{ customer.name }}{% endblock %}
{% block page_sub %}
  {{ tickets | length }} Ticket(s) · {{ licenses | length }} Lizenz(en)
{% endblock %}

{% block breadcrumb %}
<nav class="breadcrumb">
  <span><a href="{{ url_for('customers.overview') }}">Kunden</a></span><span>{{ customer.name }}</span>
</nav>
{% endblock %}

{% block topbar_extra %}
  {% if current_user.has('tickets.create') %}
    <a class="btn btn--primary btn--sm" href="{{ url_for('tickets.new', kunde=customer.id) }}">
      {{ icon('plus', size=15) }} Ticket anlegen
    </a>
  {% endif %}
{% endblock %}

{% block content %}
<div class="grid grid--split">
  <div class="stack">
    <section class="card">
      <div class="card__header">
        <div class="flex-1">
          <div class="card__title">{{ icon('ticket', size=17) }} Tickets</div>
          <div class="card__sub">Verwaltung auf der eigenen Ticket-Seite</div>
        </div>
      </div>
      {% if tickets %}
        <div class="table-wrap">
          <table class="table table--compact">
            <thead><tr><th>Ticket</th><th>Typ</th><th>Rolle</th><th>Laufzeit</th><th>Zustand</th></tr></thead>
            <tbody>
              {% for ticket in tickets %}
                <tr>
                  <td class="mono fs-sm">
                    <a href="{{ url_for('tickets.detail', ticket_id=ticket.id) }}">
                      {{ ticket.id[:12] }}&hellip;</a>
                  </td>
                  <td class="fs-sm">{{ ticket.type }}</td>
                  <td class="fs-sm">
                    {% if ticket.role != 'customer' %}{{ pill(ticket.role, 'accent') }}
                    {% else %}Kunde{% endif %}
                  </td>
                  <td class="fs-sm">
                    {% if ticket.lifetime %}unbefristet{% else %}{{ ticket.valid_days }} Tage{% endif %}
                  </td>
                  <td>
                    {% if ticket.status == 'blocked' %}{{ pill('gesperrt', 'danger') }}
                    {% else %}{{ pill('offen', 'online') }}{% endif %}
                  </td>
                </tr>
              {% endfor %}
            </tbody>
          </table>
        </div>
      {% else %}
        {{ empty_state('Keine Tickets', 'Ohne Ticket kann keine Lizenz ausgestellt werden.', 'ticket') }}
      {% endif %}
    </section>

    <section class="card">
      <div class="card__header">
        <div class="flex-1"><div class="card__title">{{ icon('shield', size=17) }} Lizenzen</div></div>
      </div>
      {% if licenses %}
        <div class="table-wrap">
          <table class="table table--compact">
            <thead><tr><th>Lizenz</th><th>Typ</th><th>Zustand</th><th>Laeuft ab</th><th>Host</th></tr></thead>
            <tbody>
              {% for entry in licenses %}
                <tr>
                  <td class="mono fs-sm">
                    <a href="{{ url_for('licenses.detail', license_id=entry.license_id) }}">
                      {{ entry.license_id[:12] }}&hellip;</a>
                  </td>
                  <td class="fs-sm">{{ entry.type }}</td>
                  <td>
                    {% if entry.status == 'active' %}{{ pill('aktiv', 'online') }}
                    {% elif entry.status == 'issued' %}{{ pill('ausgestellt', 'info') }}
                    {% elif entry.status == 'revoked' %}{{ pill('widerrufen', 'danger') }}
                    {% else %}{{ pill('deaktiviert', '') }}{% endif %}
                  </td>
                  <td class="fs-sm">
                    {% if entry.lifetime %}unbefristet
                    {% else %}
                      {{ entry.expires_at | date }}
                      {% if entry.color == 'red' %}{{ pill('kritisch', 'danger') }}
                      {% elif entry.color == 'orange' %}{{ pill('bald', 'warning') }}{% endif %}
                    {% endif %}
                  </td>
                  <td class="fs-sm">{{ entry.hostname or '&ndash;' | safe }}</td>
                </tr>
              {% endfor %}
            </tbody>
          </table>
        </div>
      {% else %}
        {{ empty_state('Keine Lizenzen', '', 'shield') }}
      {% endif %}
    </section>

    {% if reported.customers %}
      <section class="card">
        <div class="card__header">
          <div class="flex-1">
            <div class="card__title">{{ icon('share', size=17) }} Von diesem Lizenzserver verwaltete Kunden</div>
            <div class="card__sub">
              Gemeldeter Bestand &middot; Quelle {{ reported.source_license_id[:12] }}&hellip;
              {% if reported.last_reported_at %}
                &middot; <span data-relative-time="{{ reported.last_reported_at }}">{{ reported.last_reported_at | dt }}</span>
              {% endif %}
            </div>
          </div>
        </div>
        <div class="card__body stack">
          {{ alert('Diese Daten verwaltet der Sub-Lizenzserver selbst. Sie sind hier rein
          informativ und werden bei jedem Bericht vollstaendig ersetzt.', 'info') }}
          {% for entry in reported.customers %}
            <details class="card">
              <summary class="card__header" style="cursor:pointer">
                <div class="flex-1">
                  <div class="card__title">{{ entry.name }}</div>
                  <div class="card__sub">
                    {{ entry.city or 'ohne Ort' }} &middot; {{ entry.tickets | length }} Ticket(s)
                  </div>
                </div>
                {{ icon('chevron-down', size=15) }}
              </summary>
              <div class="card__body">
                {% for ticket in entry.tickets %}
                  <div class="stack stack--tight mb-3">
                    <div class="row row--tight fs-sm">
                      <span class="mono">{{ ticket.remote_ref[:12] }}&hellip;</span>
                      <span>{{ ticket.type }}</span>
                      {% if ticket.status == 'blocked' %}{{ pill('gesperrt', 'danger') }}
                      {% else %}{{ pill('offen', 'online') }}{% endif %}
                    </div>
                    {% for entry_license in ticket.licenses %}
                      <div class="row row--tight fs-xs faint" style="padding-left:var(--sp-4)">
                        <span class="mono">{{ entry_license.remote_ref[:12] }}&hellip;</span>
                        <span>{{ entry_license.status }}</span>
                        {% if entry_license.lifetime %}{{ pill('unbefristet', 'online') }}
                        {% elif entry_license.days_left is not none %}
                          {{ pill(entry_license.days_left ~ ' Tage',
                                  'danger' if entry_license.color == 'red' else
                                  ('warning' if entry_license.color == 'orange' else 'online')) }}
                        {% endif %}
                        <span>{{ entry_license.hostname or '' }}</span>
                      </div>
                    {% endfor %}
                  </div>
                {% endfor %}
              </div>
            </details>
          {% endfor %}
        </div>
      </section>
    {% endif %}
  </div>

  <section class="card">
    <div class="card__header">
      <div class="flex-1"><div class="card__title">{{ icon('building', size=17) }} Stammdaten</div></div>
    </div>
    <form method="post" action="{{ url_for('customers.update', customer_id=customer.id) }}">
      <input type="hidden" name="{{ csrf_field_name }}" value="{{ csrf_token() }}">
      <div class="card__body stack">
        {{ field('name', 'Firmenname', value=customer.name, required=True,
                 disabled=not current_user.has('customers.edit')) }}
        {{ field('contact_email', 'E-Mail', value=customer.contact_email, type='email',
                 disabled=not current_user.has('customers.edit')) }}
        {{ field('contact_person', 'Ansprechpartner', value=customer.contact_person,
                 disabled=not current_user.has('customers.edit')) }}
        {{ field('contact_phone', 'Telefon', value=customer.contact_phone,
                 disabled=not current_user.has('customers.edit')) }}
        <div class="form-grid">
          {{ field('street', 'Strasse', value=customer.street,
                   disabled=not current_user.has('customers.edit')) }}
          {{ field('house_number', 'Nr.', value=customer.house_number,
                   disabled=not current_user.has('customers.edit')) }}
          {{ field('postal_code', 'PLZ', value=customer.postal_code,
                   disabled=not current_user.has('customers.edit')) }}
          {{ field('city', 'Ort', value=customer.city,
                   disabled=not current_user.has('customers.edit')) }}
        </div>
        {{ textarea_field('notes', 'Notizen', value=customer.notes, rows=3,
                          extra_class='field--full') }}
        <div class="divider"></div>
        <dl class="kv fs-xs">
          <dt>Angelegt</dt><dd>{{ customer.created_at | dt }} von {{ customer.created_by or '-' }}</dd>
          <dt>Geaendert</dt><dd>{{ customer.updated_at | dt }}</dd>
          <dt>Portal-Zugang</dt>
          <dd><span class="mono break-all">{{ portal_url }}</span>
            <button class="btn btn--sm btn--ghost" type="button" data-copy="{{ portal_url }}">
              {{ icon('copy', size=13) }}</button></dd>
        </dl>
      </div>
      {% if current_user.has('customers.edit') %}
        <div class="card__footer modal__footer--split">
          {% if current_user.has('customers.delete') %}
            <button class="btn btn--sm btn--ghost danger-text" type="submit"
                    formaction="{{ url_for('customers.delete', customer_id=customer.id) }}"
                    data-confirm="Kunde {{ customer.name }} loeschen? Das ist nur moeglich, solange kein Ticket mehr an ihm haengt."
                    data-confirm-title="Kunde loeschen" data-confirm-ok="Loeschen">
              Loeschen
            </button>
          {% else %}<span></span>{% endif %}
          <button class="btn btn--primary" type="submit">Speichern</button>
        </div>
      {% endif %}
    </form>
  </section>
</div>
{% endblock %}