{% extends 'layout/backEndLayout.html.twig' %}
{% block title %}Présentation de la section - {{ parent() }}{% endblock %}

{% block content %}
<div class="row">
    <div class="col-lg-2">
        <div class="btn-group record_actions m-2">
            <a class="btn btn-info" href="{{ path('admin_sections') }}">
                <i class="fa fa-list"></i> {{ 'Back to the list'|trans({}, 'admin') }}
            </a>
        </div>
    </div>

    <div class="col-lg-10">
        <div class="card shadow-sm rounded border-primary">
            <div class="card-header bg-primary text-white text-center text-uppercase fw-bold">
                {{ section.program }} / {{ section.name }}
            </div>

            <div class="card-body">
                <table class="table table-striped table-hover table-bordered text-center mb-4">
                    <thead class="table-dark">
                        <tr>
                            <th>#</th>
                            <th>Nom</th>
                            <th>Taille</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for cycle in section.cycles %}
                            <tr>
                                <td>{{ loop.index }}</td>
                                <td>
                                    <a href="{{ path('admin_cycles_show', {id: cycle.id}) }}">{{ cycle.name }}</a>
                                </td>
                                <td>{{ cycle.levels|length }}</td>
                            </tr>
                        {% else %}
                            <tr>
                                <td colspan="3" class="text-muted">Aucun cycle associé</td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>

                <div class="d-flex justify-content-center gap-3">
                    <a class="btn btn-warning" href="{{ path('admin_sections_edit', {id: section.id}) }}">
                        <i class="fa fa-pencil-square-o" aria-hidden="true"></i> Modifier la section
                    </a>
                    <a class="btn btn-danger" href="#"
                       onclick="event.preventDefault(); if(confirm('Êtes-vous sûr ?')) document.getElementById('js-section-delete-form').submit();">
                        <i class="fa fa-trash"></i> Supprimer la section
                    </a>
                    <form id="js-section-delete-form" action="{{ path('admin_sections_delete', {id: section.id}) }}" method="post" style="display: none;">
                        <input type="hidden" name="csrf_token" value="{{ csrf_token('sections_deletion' ~ section.id) }}">
                        <input type="hidden" name="_method" value="DELETE">
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}