{% extends "base.html" %}
{% import "_icons.html" as icons %}
{% block title %}Leden — ClayTracker{% endblock %}
{% block content %}
  <h2>Ledenadministratie</h2>
  <div class="deelnemer-balk">
    <a class="knop" href="{{ url_for('leden.nieuw') }}">Lid aanmaken</a>
    <form method="post" action="{{ url_for('leden.upload') }}" enctype="multipart/form-data" class="deelnemer-balk-form">
      <input type="file" name="bestand" accept=".xlsx" required>
      <button type="submit" class="knop-secundair">Ledenlijst uploaden (.xlsx)</button>
    </form>
  </div>
  <p class="deelnemer-balk-leeg"><em>Verwachte kolommen in het Excel-bestand: Voornaam, Achternaam.</em></p>

  {% if schutters %}
    <div class="card">
      <div class="table-wrap">
        <table>
          <thead>
            <tr><th>Voornaam</th><th>Achternaam</th><th>Aantal wedstrijden</th><th></th></tr>
          </thead>
          <tbody>
            {% for schutter in schutters %}
              <tr>
                <td><a href="{{ url_for('leden.detail', schutter_id=schutter.id) }}">{{ schutter.voornaam }}</a></td>
                <td>{{ schutter.achternaam }}</td>
                <td>{{ schutter.aantal_wedstrijden }}</td>
                <td class="actie-cel">
                  <form method="post" action="{{ url_for('leden.verwijderen', schutter_id=schutter.id) }}"
                        onsubmit="return confirm('Lid &quot;{{ schutter.voornaam }} {{ schutter.achternaam }}&quot; helemaal verwijderen? In eerdere wedstrijden blijft de score staan, maar dan als &quot;Lid gewist&quot;. Weet je dit heel zeker?');">
                    <button type="submit" class="icon-btn" title="Lid verwijderen" aria-label="Lid verwijderen">
                      {{ icons.prullenbak() }}
                    </button>
                  </form>
                </td>
              </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
  {% else %}
    <p><em>Nog geen leden bekend.</em></p>
  {% endif %}
{% endblock %}