{% extends 'layouts/base.html.twig' %}
{% block titleHeader %}{{ 'users'|trans }}{% endblock%}
{% block breadcrumb %}<div class="breadcrumb-item">{{ 'users'|trans }}({{ users.getTotalItemCount }})</div>{% endblock %}
{% block body %}
    <div class="text-end mb-3">
        <a class="btn btn-xs btn-primary ajax" href="#" data-toggle="modal"  data-href="{{ path('app_user_new' ) }}">
            <span>  <i class="fa fa-plus bigger-110 blue"></i> {{ 'add'|trans }} </span>
        </a>
    </div>
    <div class="card">
    <div class="mb-3 p-2">
            {{ include('user/form_search.html.twig') }}
    </div>
        <br>
        <div class="card-body p-0">
            <div class="table-responsive">
                <table  class="table table-striped table-bordered">
                <thead>
                <tr>
                    <th>{{ knp_pagination_sortable(users, "firstName" | trans, 'firstName') }}</th>
                    <th>{{ knp_pagination_sortable(users, "lastName" | trans, 'lastName') }}</th>
                    <th>{{ "Email" | trans }}</th>
                    <th>{{ "Role" | trans }}</th>
                    <th>{{ knp_pagination_sortable(users, "status" | trans, 'active') }}</th>
                    <th>{{ "actions" | trans }}</th>
                </tr>
                </thead>
                <tbody>
                {% for user in users %}
                    <tr>
                        <td>{{ user.firstName }}</td>
                        <td>{{ user.lastName }}</td>
                        <td>{{ user.email }}</td>
                        <td>{{ user.roles|join(', ') }}</td>
                        <td><label class="switch">
                                <input onclick="return confirm(  'Etes-vous sûr de vouloir {% if user.active %}désactiver{% else %} activer{% endif %} cet user ?' );"
                                       class="change_status"
                                       data-href="{{ path('app_user_change_status', {id: user.id}) }}"
                                       type="checkbox" {% if user.active %} checked {% endif %}>
                                <span class="slider-active round"></span>
                            </label>
                        </td>
                        <td>
                            <a
                                    href="#" data-toggle="modal"
                                    data-href="{{ path('app_user_edit', {'id': user.id}) }}"
                                    class="action btn btn-icon btn-sm btn-primary text-white mr-1 ajax"
                                    data-original-title="Modifier">
                                <i class="fas fa-pencil-alt"></i>
                            </a>

                        </td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
            </div>
            <div class="navigation">
                {{ knp_pagination_render(users) }}
            </div>
        </div>
    </div>
{% endblock %}