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

{% block title %}Verleih{% endblock %}
{% block heading %}Aktive Ausleihen{% endblock %}
{% block topbar_actions %}
  <span class="text-sm text-neutral-500 nums">{{ rentals|length }} offen</span>
{% endblock %}

{% block content %}
<div class="card">
  {% if rentals %}
  <table class="data-table">
    <thead>
      <tr>
        <th>Mitarbeiter</th>
        <th>Werkzeug</th>
        <th>Maschine</th>
        <th>Lagerort</th>
        <th class="num">Anz</th>
        <th>Seit</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      {% for r in rentals %}
      <tr>
        <td>
          <div class="flex items-center gap-2">
            {{ avatar(r.first_name, r.last_name) }}
            <span>{{ r.first_name }} {{ r.last_name }}</span>
          </div>
        </td>
        <td>
          <div class="font-medium nums">{{ r.ident }}</div>
          <div class="text-xs text-neutral-500 truncate" style="max-width:340px">{{ r.description }}</div>
        </td>
        <td class="text-neutral-700">{{ r.machine_name or '—' }}</td>
        <td class="nums text-neutral-500">{{ r.location_code or '—' }}</td>
        <td class="num">{{ r.quantity }}</td>
        <td class="text-xs text-neutral-500 nums">{{ r.rented_at }}</td>
        <td class="text-right">
          <form method="post" action="/rentals/{{ r.id }}/return" class="inline">
            <button class="btn btn-sm btn-primary" type="submit">Rückgabe buchen</button>
          </form>
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
  {% else %}
  <div class="p-12 text-center text-sm text-neutral-500">Aktuell keine offenen Ausleihen.</div>
  {% endif %}
</div>
{% endblock %}