{% extends 'template.html.twig' %}
{% block title %}Mon Site Démo_formation_index{% endblock %}
{% block body %}
{% include "nav.html.twig" %}
<!-- ***** Chefs Area Starts ***** -->

<section class="section" id="chefs">
    <div class="container">
        <div class="row">
            <div class="col-lg-4 offset-lg-4 text-center">
                <div class="section-heading">
                    <h6>Nos Formations</h6>
                    <h2>Des cours que nous vous proposez</h2>
                </div>
            </div>
        </div>
        {{ include('flash.html.twig') }}

        {% if is_granted('ROLE_ADMIN') %}
        <div class="mb-3 d-flex justify-content-end">
            <a href=" {{ path('app_formation_new') }}" id="new-btn" class="main-button-icon">Créer un nouveau formation</a>
        </div>
        {% endif %}
        
        {% if formations %} 
        <div class="row">
            {% for formation in formations %}
            <div class="col-lg-4 d-flex">
                <div class="chef-item d-flex flex-column w-100">
                    <div class="thumb flex-grow-1 position-relative">
                        <div class="overlay"></div>
                        <ul class="social-icons">
                            <li><a href="{{ path('app_formation_show', { id: formation.id }) }}"><i class="fa fa-eye"></i></a></li>
                            {% if is_granted('ROLE_ADMIN') %}
                            <li><a href="{{ path('app_formation_edit', { id: formation.id }) }}"><i class="fa fa-pencil"></i></a></li>
                            <li><a href="#" data-toggle="modal" data-target="#deleteModal" 
                                data-id="{{ formation.id }}" data-name="{{ formation.name }}" data-url="{{ path('app_formation_delete', { id: formation.id }) }}" class="delete-button"><i class="fa fa-trash"></i></a></li>
                            {% endif %}
                        </ul>
                        <img src="{{ vich_uploader_asset(formation) ?: asset('assets/images/noPic.jpg') }}" alt="{{formation.name}}">
                    </div>
                    <div class="down-content mt-auto">
                        <h4>{{formation.name}}</h4>
                        <span>{{formation.date|date('d/m/Y, H:i')}}</span>
                        <br>
                        <small class="font-italic">Note Moyenne: {{averagePoints[formation.id] is not null ? averagePoints[formation.id]|number_format(2) : 'N/A'}} <i class="fa fa-star text-warning"></i></small>
                        {# pour date : formation created_at|date('d/m/Y') #}
                    </div>
                </div>
            </div>
            {% endfor %}
        </div>
  
        <div class="navigation d-flex justify-content-center mt-4">
            {{ knp_pagination_render(formations) }}
        </div>
        {% else %}
        <div>Il n'y a pas de formation </div>
        {% endif %}
    </div>
</section>

<!-- Confirmation Modal -->
<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModal" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h3 class="modal-title fs-5" id="exampleModalLabel">Confirmation de suppression</h3>
          <button type="button" class="btn-close" data-dismiss="modal" aria-label="Close"></button>
          <span aria-hidden="true">&times;</span>
        </div>
        <div class="modal-body">
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Annuler</button>
          {# <a href="#" id="confirmDeleteBtn" class="btn btn-primary" tabindex="-1" role="button">Confirmer</a> #}
          <button type="button" class="btn btn-primary confirm-delete">Confirmer</button>
        </div>
      </div>
    </div>
</div>


<!-- ***** Chefs Area Ends ***** -->
{% include "footer.html.twig" %}
{% endblock %}