{% import "includes/macros" as macros %}
{% extends "base" %}
{% block content %}
    <div class="max-w-screen-lg w-full">
        <h1 class="h1">Schnupper Verwaltung</h1>
        <div class="grid gap-3">
            <div class="bg-white dark:bg-primary-900 text-black dark:text-white rounded-md block shadow mt-5">
                <h2 class="h2">Angemeldete Personen: {{ schnupperanten | length }}</h2>
                <ol>
                    {% for user in schnupperanten %}
                        <li class="border-t border-gray-200 dark:border-primary-600 px-3 py-1">
                            <span class="flex items-center justify-between">
                                <span>
                                  <span class="status-damage status-damage-{% if "paid" in user.roles %}none {% else %}locked {% endif %}"></span>&nbsp;{{ user.name }} ({{ user.mail }}
                                  {%- if user.notes %} | {{ user.notes }}
                                  {% endif -%}
                                  )
                                </span>
                                <a class="btn btn-primary"
                                  href="/admin/user/move/schnupperant/{{ user.id }}/to/scheckbuch"
                                  onclick="return confirm('Willst du wirklich ein Scheckbuch erstellen? Die Person erhält ein Mail mit allen Infos.')">Zu Scheckbuch umwandeln</a>
                            </span>
                        </li>
                    {% endfor %}
                </ol>
            </div>

            <div class="bg-white dark:bg-primary-900 text-black dark:text-white rounded-md block shadow mt-5">
              <h2 class="h2">Legende</h2>
              <div class="px-3 py-1">
                  <span class="status-damage status-damage-none"></span> Bezahlt - Juhuuu!
              </div>
              <div class="px-3 py-1">
                  <span class="status-damage status-damage-locked"></span> Noch nicht bezahlt
              </div>
            </div>
        </div>
    </div>
{% endblock content %}