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

{% block title %}Liste des évènements{% endblock %}

{% block body %}
    <section class="container">
        {% include 'utils/file.ariane.html.twig' %} 
        <h4 id="evt-titre" data-filter="{{result.filtre}}">Liste des évènements - {{app_utils.moisName(mois)}} {{annee}}</h4>
        <hr/>

        {% if secure.havePermission(constant('_ADD_SERV_GEST_TEAM', app_const)) %}
            <div class="d-flex justify-content-between">
                <a class="btn btn-sm btn-primary" href="/evenement/create/{{annee}}/{{mois}}?page={{ result.currentPage }}&pageSize={{ result.pageSize }}&filtre={{ result.filtre }}"><i class="bi bi-plus-lg"></i> Nouveau</a>
                <a class="btn btn-sm btn-primary" href="/evenement/generated/{{annee}}/{{mois}}?page={{ result.currentPage }}&pageSize={{ result.pageSize }}&filtre={{ result.filtre }}"><i class="bi bi-plus-circle-dotted"></i> Générer</a>
            </div>
            <hr />
        {% endif %}
        <br />        
        <div class="row">
            <div class="col-md-6 col-sm-12">
                <div class="input-group mb-3">
                    <span class="input-group-text">Mois</span>
                    <select id="choiceMonth" onchange="aller_liste()" class="form-select" aria-label="Changement de mois">
                        <option value="0">Choix du mois de référence</option>
                        {% for i in 1..12 %}
                            {% if i == mois  %}
                                <option value="{{i}}" selected>{{app_utils.moisName(i)}}</option>
                            {% else %}
                                <option value="{{i}}">{{app_utils.moisName(i)}}</option>
                            {% endif %}
                        
                        {% endfor %}
                    </select>
                </div><br/>
            </div>

            <div class="col-md-6 col-sm-12">
                <div class="input-group mb-3">
                    <span class="input-group-text">Année</span>
                    <select id="choiceYear" onchange="aller_liste()" class="form-select" aria-label="Default select example">
                        <option value="0">Choix de l'année de référence</option>
                        {% for a in annees %}
                            {% if a == annee  %}
                                <option value="{{a}}" selected>{{a}}</option>
                            {% else %}
                                <option value="{{a}}">{{a}}</option>
                            {% endif %}
                        
                        {% endfor %}
                    </select>
                </div><br/>
            </div>
        </div>
        

        <br /><section>
        <hr/><br />
            {{ form_start(form) }}
                <div class="input-group mb-3">
                    <span class="input-group-text">{{ form_label(form.searchValue) }}</span>
                    {{ form_widget(form.searchValue) }}
                    <span class="input-group-text"><button type="submit" class="btn btn-sm btn-primary"><i class="bi bi-search"></i></button></span>
                </div>
            {{ form_end(form) }}
        </section><br />

        <div class="table-eplo">
            <div class="tab-row-eplo header">
                <div class="cell">
                    Nom
                </div>
                <div class="cell">
                    Date
                </div>
                <div class="cell">
                    Activer
                </div>
                <div class="cell"></div>
            </div>
            {% if result.elements|length <= 0  %}
                <div class="tab-row-eplo">
                    <div class="cell" data-title="Nom">
                        Aucun évènement trouvé
                    </div>
                    <div class="cell"></div>
                    <div class="cell"></div>
                    <div class="cell"></div>
                </div>
            {% else %}
                {% for obj in result.elements %}
                <div class="tab-row-eplo">
                    <div class="cell" data-title="Nom">{{obj.nom}}</div>
                    <div class="cell" data-title="Date">{{obj.date| date("d/m/Y H:i")}}</div>
                    <div class="cell" data-title="Activer">
                        <div class="form-check form-switch">
                            {% if obj.visibility  %}
                                <input class="form-check-input" type="checkbox" id="flexSwitchCheckDisabled" disabled checked />
                            {% else %}
                                <input class="form-check-input" type="checkbox" id="flexSwitchCheckDisabled" disabled />
                            {% endif %}
                        </div>
                    </div>
                    <div class="cell text-right" data-title="Action">
                        {% if secure.havePermission(constant('_UPDATE_SERV_GEST_TEAM', app_const)) %}
                            <a class="btn btn-sm btn-primary" href="/evenement/update/{{obj.code}}/{{annee}}/{{mois}}?page={{ result.currentPage }}&pageSize={{ result.pageSize }}&filtre={{ result.filtre }}" style="margin-right:5px;" title="Modifier"><i class="bi bi-pencil-square"></i></a>
                        {% endif %}
                        {% if secure.havePermission(constant('_REMOVE_SERV_GEST_TEAM', app_const)) %}
                            <a class="btn btn-sm btn-danger" href="/evenement/suppression/{{obj.code}}/{{annee}}/{{mois}}?page={{ result.currentPage }}&pageSize={{ result.pageSize }}&filtre={{ result.filtre }}" title="Supprimer"><i class="bi bi-trash"></i></a>
                        {% endif %}
                    </div>
                </div>
                {% endfor %} 
            {% endif %} 
        </div>
        <hr />
        {% include 'utils/pagination.html.twig'  with {'url': '/evenement/liste/' ~ annee ~ '/' ~ mois}  %}  
        <br />
    </section>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script>
        function aller_liste(){
            var an = $("#choiceYear").val();
            var m = $("#choiceMonth").val();
            var filter = $("#evt-titre").attr("data-filter");
            //console.log(`/evenement/liste/1/10/${an}/${m}`);
            window.location.href = `/evenement/liste/${an}/${m}?page=1&pageSize=10`;
        }
    </script>
{% endblock %}