{% extends "base.html" %}
{% block content %}
<div class="page-head">
  <div>
    <h1>{{ month_name }} {{ year }}</h1>
  </div>
  <div class="month-nav">
    <a class="button secondary" href="/?year={{ prev[0] }}&month={{ prev[1] }}">← Anterior</a>
    <a class="button secondary" href="/?year={{ nxt[0] }}&month={{ nxt[1] }}">Seguinte →</a>
  </div>
</div>

<div class="calendar-list">
{% for day, assignments in month_days %}
  <section class="day-card {% if day == today %}today{% endif %}">
    <div class="day-label">
      <strong>{{ day|dia_curto }}</strong>
      <span>{{ day.day }}</span>
    </div>
    <div class="day-assignments">
      {% for assignment in assignments %}
      <article class="assignment {% if assignment.id in my_assignment_ids %}mine{% endif %}">
        <div>
          <div class="assignment-title">{{ assignment.schedule.name }}</div>
          <div class="assignment-person">
            {% if assignment.user %}{{ assignment.user.name }}{% else %}<span class="unassigned">Sem atribuição</span>{% endif %}
          </div>
        </div>
        {% if assignment.id in my_assignment_ids and day >= today %}
          <div class="assignment-action">
          {% if assignment.id in open_swap_assignment_ids %}
            <span class="badge">Troca pedida</span>
          {% else %}
            <details>
              <summary>Pedir troca</summary>
              <form method="post" action="/assignments/{{ assignment.id }}/swap" class="swap-form">
                <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                <label>Pedir a
                  <select name="target_user_id">
                    <option value="">Qualquer pessoa disponível</option>
                    {% for person in active_users %}
                      {% if person.id != current_user.id %}<option value="{{ person.id }}">{{ person.name }}</option>{% endif %}
                    {% endfor %}
                  </select>
                </label>
                <label>Mensagem <span class="muted">(opcional)</span>
                  <input name="message" maxlength="500" placeholder="Não consigo fazer este dia…">
                </label>
                <button class="primary small" type="submit">Enviar pedido</button>
              </form>
            </details>
          {% endif %}
          </div>
        {% endif %}
      </article>
      {% endfor %}
    </div>
  </section>
{% endfor %}
</div>
{% endblock %}