{% extends '@InstallBois/index.html.twig' %}

{% block title %}
    INSTALL-BOIS
{% endblock %}

{% block head %}
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/1.12.1/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/2.2.3/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript"
            src="https://cdn.datatables.net/responsive/2.3.0/js/dataTables.responsive.min.js"></script>
    <script type="text/javascript"
            src="{{ asset('install-bois/initDateTimeFormatDatatable.js') ~ "?rnd=" ~ random() }}"></script>
    {{ parent() }}
{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link rel="stylesheet" href="https://cdn.datatables.net/1.12.1/css/jquery.dataTables.min.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.2.3/css/buttons.dataTables.min.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.4.0/js/dataTables.buttons.min.js">
    <link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.2.3/js/dataTables.buttons.min.js">
{% endblock %}

{% block javascripts %}
    {#    <script src="{{ asset('install-bois/app.js') }}"></script> #}
    {{ parent() }}
{% endblock %}

{% block page_content_start %}
    {{ parent() }}
    <div class="page-title">
        <h4 class="page-title-h4">
            Clients | Logs de connexions
        </h4>
    </div>
{% endblock %}

{% block page_content %}
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-12 col-md-12 col-lg-12">
                <div class="box box-warning">
                    <table id="log-connection-list" class="hover row-border" style="padding:1%;width:100%">
                        <thead>
                        <tr>
                            <th>Entreprise</th>
                            <th>Email</th>
                            <th>Nom</th>
                            <th>Prénom</th>
                            <th>Date de connexion</th>
                            <th>Connexion</th>
                        </tr>
                        </thead>
                        <tbody>
                        {% for logConnection in logConnections %}

                            <tr>
                                <td>{{ logConnection.user.agency.company.name }}</td>
                                <td>{{ logConnection.user.email }}</td>
                                <td>{{ logConnection.user.lastName }}</td>
                                <td>{{ logConnection.user.firstName }}</td>
                                <td>{{ logConnection.createdAt|date('d/m/Y H:i:s') }}</td>
                                {% if logConnection.success %}
                                    {% set isSuccessStyle = "tab_celluleTrue" %}
                                {% else %}
                                    {% set isSuccessStyle = "tab_celluleFalse" %}
                                {% endif %}
                                <td class="{{ isSuccessStyle }}">
                                    {% if logConnection.success %}
                                        RÉUSSIE
                                    {% else %}
                                        ERREUR
                                    {% endif %}
                                </td>
                            </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                </div>
                <script type="application/javascript">
                    let params = {
                        "columnDefs": [
                            {"type": "date-euro", "targets": [4]},
                        ],
                    };
                    initDatatable('#log-connection-list', params, []);
                </script>
            </div>
        </div>
    </div>
{% endblock %}