{% extends 'admin/base.html.twig' %}
{% block title %}
    Bibliothèque |
    {{ parent() }}
{% endblock %}
{% block body %}
    <div class="row">
        <div class="col">
            <div class="card my-4">
                {# {{ include('admin/ui/card/_header.html.twig', {card_header_title:'Bibliothèque', card_header_right_route:'@Library_admin_new', card_header_right_label: 'Nouveau visuel'}) }} #}
                {{ include('admin/ui/card/_header.html.twig', {card_header_title:'Bibliothèque'}) }}
                <div class="card-body px-0 pb-2">
                    <div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4 row-cols-xl-6 g-3 px-3">
                        {% for visual in visuals %}
                            <div class="col">
                                <article class="card shadow-sm overflow-hidden">
                                    <img src="{{ vich_uploader_asset(visual, 'imageFile', 'App\\LibraryBundle\\Entity\\LibraryVisual') | mediaCache('thumb') }}" class="" alt="" />
                                    <div class="card-body">
                                        <p class="card-text">
                                            {{ visual.name }}
                                        </p>
                                        <p class="card-text">
                                            {{ visual.visualType.name ?? '-NC-' }}
                                        </p>
                                        <div class="d-flex justify-content-between align-items-center">
                                            <div class="btn-group">
                                                <a href="{{ path('@Library_admin_edit', {'id':visual.id}) }}" class="btn btn-sm btn-outline-secondary">
                                                    Modifier
                                                </a>
                                            </div>
                                            {{ include('admin/ui/_badge.html.twig', {badge_class:visual.isActive?'bg-success':'bg-secondary', badge_label : visual.isActive?'Activée':'Désactivé' }) }}
                                        </div>
                                    </div>
                                </article>

                            </div>
                        {% endfor %}
                    </div>
                </div>
            </div>
        </div>
        <div class="col-2">
            <div class="card my-4 sticky-top">
                {{ include('admin/ui/card/_header.html.twig', {card_header_title:'Ajout en lot'}) }}
                <div class="card-body p-2">
                    <span>
                        Vous avez la possibilité d'ajouter des visuels en lot pour les modifier après
                    </span>
                    {{ include('bundles/multiUpload/_form.html.twig', {url_upload:path('@Library_admin_upload')}) }}
                </div>
            </div>
        </div>
    </div>
{% endblock %}