{% extends 'base.html.twig' %}

{% block title %}Accueil{% endblock %}

{% block javascripts %}
    <script src="{{ asset('assets/js/colorFinder.js') }}"></script>
    <script src="{{ asset('assets/js/tooltip.js') }}"></script>
{% endblock %}

{% block body %}
    <div class='text-center mb-2'>
        <a href='{{ path('intervention_new') }}'><input type='button' value="Nouvelle demande d'intervention" class='grey-btn f-20 w-50 p-2' /></a>
    </div>

    <hr>

    <div class="row justify-content-md-center top-infos-container mt-5">
        <div class="col-md-auto">
            <div class='top-infos active py-2 px-4'>{{ (interventions|length > 1) ? "Demandes d'interventions :" : "Demande d'intervention :" }} {{ interventions|length }}</div>
        </div>
        <div class="col-md-auto ml-auto">
            <a href="{{ path('index', {'filter': 'status'}) }}">
                <div data-toggle="tooltip" title="Trier par status" class='top-infos py-2 px-3 order-by-btn by-status info-btn-100 {%if filter == 'status' %}active{% endif %}'><i class="fas fa-tasks"></i></div>
            </a>
            <a href="{{ path('index', {'filter': 'date'}) }}">
                <div data-toggle="tooltip" title="Trier par date" class='top-infos py-2 px-3 order-by-btn by-date info-btn-100 {%if filter == 'date' %}active{% endif %}'><i class="fas fa-clock"></i></div>
            </a>
        </div>
    </div>

    <div class="list-container mb-5">
    {% if interventions %}
        {% for intervention in interventions %}
            <a href="{{ path('intervention_show', {'id': intervention.id}) }}">
                <div class="row justify-content-md-center p-4 interv-row {{ intervStatus(intervention.status) }}">
                    <div class="col-md-auto interv-row-tab-1 my-auto">
                        <div class="color-box" data-color="#{% for task in intervention.tasks %}{{ task.color }}{% endfor %}"></div>
                    </div>
                    <div class="col-6 interv-row-tab-2 my-auto">
                        <div class="f-20">
                            {% for task in intervention.tasks %}
                                {{ task }}{% if not loop.last %}, {% endif %}
                            {% endfor %}
                        </div>
                    </div>
                    <div class="col interv-row-tab-3">
                        <div class="d-flex flex-column">
                            <div class="f-20">{{ intervention.equipment }} - {{ intervention.operatingSystem }}</div>
                            <div class="interv-sub-info">{{ intervention.depositDate ? intervention.depositDate|date('d/m/Y') : '' }} - {{ intervention.client }} - n°{{intervention.id }}</div>
                        </div>
                    </div>
                </div>
            </a>
        {% endfor %}
    {% else %}
        <div class="row justify-content-md-center p-3 alert-label">
            <div>Pas de demande d'intervention prévues</div>
        </div>
    {% endif %}

    </div>
{% endblock %}