{% extends "personnes/base.html" %}

{% load url from future %}

{% block appbar %}
    <h2>Gestion des personnes — Absences</h2>
    <a href="..">Retourner à la gestion des personnes</a>
{% endblock %}

{% block content %}
<h3>Absences de groupe</h3>
<p>
  <a href="groupe/">Gestion des absences de groupe</a>
</p>
{% if group_holidays %}
<ul>
  {% for holiday in group_holidays %}
    <li>{{ holiday|capfirst }}</li>
  {% endfor %}
</ul>
{% endif %}

<h3>Affichage interactif</h3>

  <form>
    {{ search_form.non_field_errors }}
    {{ search_form.start_date.errors }}
    {{ search_form.end_date.errors }}
    <p>Afficher la liste des absences pris entre
      <span id="start-date-datepicker" data-number-of-months="3" data-before-selector="#end-date-datepicker" class="datepicker">{{ search_form.start_date }}</span>
      et
      <span id="end-date-datepicker" class="datepicker" data-number-of-months="3" data-after-selector="#start-date-datepicker">{{ search_form.end_date }}</span>
      <button class="enable-on-change">Valider</button>
      <button class="reset">Effacer</button>
    </p>
  </form>

<h3>Absences en cours et à venir</h3>

{% if current_holidays %}
  <h4>En cours</h4>

  <ul>
    {% for holiday in current_holidays|dictsort:"worker" %}
      <li><a href="{{ holiday.url }}">{{ holiday.worker }} {{ holiday.holiday }}</a></li>
    {% endfor %}
  </ul>
{% endif %}

{% if future_holidays %}
  <h4>À venir (jusqu'au {{ end_date|date:"d/m/Y" }})</h4>

  <table id="conges-a-venir">
    {% for months in future_holidays %}
      <thead>
        <tr>
          {% for future in months %}
            <th>{{ future.month|capfirst }}</th>
          {% endfor %}
        </tr>
      </thead>
      <tbody>
        <tr>
          {% for future in months %}
            <td>
              <ul>
                {% for holiday in future.holidays|dictsort:"worker" %}
                  <li>
                    <a href="{{ holiday.url }}">
                      {{ holiday.worker }} {{ holiday.holiday }}
                    </a>
                  </li>
                {% endfor %}
              </ul>
            </td>
          {% endfor %}
        </tr>
      </tbody>
   {% endfor %}
  </table>
{% endif %}

{% endblock %}
