{% extends 'assignment_desk/base.html' %}


{% load bootstrap3 list_membership static %}


{% block html_title %}Edit assignment list | {{ block.super }}{% endblock %}


{% block stylesheets %}
{{ block.super }}
{{ form.media }}
{% endblock %}


{% block body_class %}week-edit{% endblock %}


{% block back_nav_link %}{% url 'assignment-desk:week-list' %}{% endblock %}


{% block nav_header %}Edit list: {{ week.role_type.name }} department assignments starting {{ week.beginning_date|date:'N j' }}{% endblock %}


{% block right_nav_buttons %}{% endblock %}


{% block content %}
<form action="" method="POST">
    <div class="fullscreen-card week-primary-card">
        {% bootstrap_form_errors form %}

        {% if form.non_field_errors %}
        <div class="non-field-error-padding">
            <ul class="non-field-errors knockout">
                {% for error_message in form.non_field_errors %}
                <li class="form-error">{{ error_message }}</li>
                {% endfor %}
            </ul>
        </div>
        {% endif %}

        <div class="form-group-container form-input--full" id="form__extra-information">
          {% bootstrap_field form.extra_information layout='immaterial' %}
        </div>

        {% csrf_token %}
    </div>

    <div class="fullscreen-card table-card assignments-formset">
        <div class="list-header">
            <h4>Assignments</h4>
        </div>
        {{ inline_formset.management_form }}

        {% regroup inline_formset by instance.role as formset_by_role %}

        <table id="assignment-forms">
            <thead>
                <tr data-role="days">
                    <th></th>
                    {% for assignment in formset_by_role.0.list %}
                        <th class="{% if assignment.instance.day|date:'w'|in_list:'0,6' %}weekend{% else %}weekday{% endif %}" data-day="{{ assignment.instance.day|date:'l'|lower }}">{{ assignment.instance.day|date:'l' }}</th>
                    {% endfor %}
                </tr>
            </thead>
            <tbody>

            {% for role, per_role_assignment_forms in formset_by_role %}
                <tr data-role="{{ role.slug }}">
                    <td class="role-name">{{ role.name }}</td>
                    {% for assignment_form in per_role_assignment_forms %}
                    <td class="{% if assignment_form.instance.day|date:'w'|in_list:'0,6' %}weekend{% else %}weekday{% endif %}{% if not assignment_form.instance.staffer %} empty{% endif %}" data-date="{{ assignment_form.instance.day|date:'Y-m-d' }}" data-day="{{ assignment_form.instance.day|date:'l'|lower }}">{{ assignment_form.as_p }}</td>
                    {% endfor %}
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>

    <div class="edit-actions">
        <div class="wrap">
            <div class="right-buttons">
                {% bootstrap_button 'Save' extra_classes='btn-primary' button_type='submit' name="submit" value="_save" %}
                {% bootstrap_button 'Save & continue editing' extra_classes='btn-primary-flat' button_type='submit' name="submit" value="_continue" %}
            </div>
        </div>
    </div>
</form>
{% endblock %}

{% block scripts %}
<script src="{% static 'assignment_desk/js/week.edit.js' %}"></script>
{% endblock %}
