{% extends 'layouts/base/base.html.twig' %}
{% import 'common/macros/stylesheet.html.twig' as stylesheet %}
{% import 'common/macros/statusBadge.html.twig' as statusBadge %}

{% block critical_css %}
    {{ parent() }}
    <style>
        {{ asset_content(asset('assets/css/critical/model_listing-critical.css')) }}
    </style>
{% endblock %}

{% block preload_style %}
    {{ parent() }}
    {{ stylesheet.preload('model_listing.css') }}
{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    {{ stylesheet.generate('model_listing.css') }}
{% endblock %}

{% block body %}
    <div class="container-fluid p-0">

        <div class="row">
            <div class="col-6">
                <h1 class="h3 mb-3">List des modèles</h1>
            </div>
            <div class="col-6 text-end">
                <a href="{{ path('model_create') }}" class="btn btn-secondary btn-sm">
                    <i class="align-text-bottom" data-feather="database" width="15" height="15"></i>
                    Créer un Modèle
                </a>
            </div>
        </div>


        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-body">
                        <table id="datatables-models" class="table table-responsive table-striped">
                            <thead>
                                <tr>
                                    <th>Id</th>
                                    <th>Réference</th>
                                    <th>Name</th>
                                    <th>Status</th>
                                    <th>Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for model in models %}
                                    <tr>
                                        <td>{{ model.id }}</td>
                                        <td>{{ model.reference }}</td>
                                        <td>{{ model.name }}</td>
                                        <td>{{ statusBadge.render(model.status) }}</td>
                                        <td>
                                            {{ _self.actiontTables(model.status, model.id) }}
                                        </td>
                                    </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

    </div>
{% endblock %}

{% macro actiontTables(status, id) %}
    <a href="{{ path('model_update', {id: id}) }}" class="btn btn-secondary btn-sm" title="Modifier">
        <i class="align-text-bottom" data-feather="edit" width="15" height="15"></i>
        Modifier
    </a>
    {% if status == 1 %}
        <a href="{{ path('model_upload', {id: id}) }}" class="btn btn-warning btn-sm text-white" title="Upload Image">
            <i class="align-text-bottom" data-feather="upload-cloud" width="15" height="15"></i>
            Upload Images
        </a>
    {% endif %}
    {% if status == 2 %}
        <a href="{{ path('drive_send', {id: id}) }}" class="btn btn-success btn-sm text-white" title="Envoyer">
            <i class="align-text-bottom" data-feather="send" width="15" height="15"></i>
            Envoyer
        </a>
    {% endif %}
    <a href="{{ path('model_delete', {id: id}) }}" class="btn btn-danger btn-sm" title="Supprimer">
        <i class="align-text-bottom" data-feather="trash-2" width="15" height="15"></i>
        Supprimer
    </a>
{% endmacro %}

{% block javascript %}
{{ parent() }}
<script defer src="{{ asset('model_listing.js') }}"></script>
{% endblock %}