{% extends 'base.html.twig' %}

{% block title %}Portalents - dashboard{% endblock %}

{% block body %}

    <div class="container w-75 mt-5">
        <div class="container">

            <div class="container d-flex justify-content-center my-4">
                <h1>Dashboard</h1>
            </div>

            <ul class="nav nav-tabs">
                <li class="nav-item">
                    <a class="nav-link active" data-bs-toggle="tab" href="#home">Derniers candidats saisis</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-bs-toggle="tab" href="#profile">Derniers collaborateurs recrutés</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-bs-toggle="tab" href="#dropdown1">Derniers profils modifiés</a>
                </li>
            </ul>
            <div id="myTabContent" class="tab-content d-flex justify-content-center my-5">
                <div class="w-100 tab-pane fade show border active" id="home">
                    <div class="container d-flex justify-content-center w-100 m-2 p-4">
                        <table class="table table-hover">
                            <thead>
                                <tr>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Nom</div>
                                    </th>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Date de saisie</div>
                                    </th>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Profession</div>
                                    </th>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Voir le profil</div>
                                    </th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for new_candidate in new_candidates %}
                                    <tr>
                                        <th>
                                            <div class="d-flex justify-content-center fs-5">
                                                {{ new_candidate.firstname ~ ' ' ~ new_candidate.lastname }}
                                            </div>
                                        </th>
                                        <td>
                                            <div class="d-flex justify-content-center">
                                                {{ new_candidate.date|format_datetime('short', 'none', locale='fr') }}
                                            </div>
                                        </td>
                                        <td>
                                            <div class="d-flex justify-content-center">
                                                {{ new_candidate.profession.name }}
                                            </div>
                                        </td>
                                        <td>
                                            <div class="d-flex justify-content-center">
                                                <a href="{{ path('profile', { 'id': new_candidate.id }) }}">
                                                    <i class="fas fa-eye text-dark"></i>
                                                </a>
                                            </div>
                                        </td>
                                    </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="w-100 tab-pane fade p-4 border" id="profile">
                    <div class="container w-100 m-2 p-4">
                        <table class="table table-hover">
                            <thead>
                                <tr>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Nom</div>
                                    </th>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Date de saisie</div>
                                    </th>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Profession</div>
                                    </th>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Voir le profil</div>
                                    </th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for new_collaborator in new_collaborators %}
                                    <tr>
                                        <th>
                                            <div class="d-flex justify-content-center fs-5">
                                                {{ new_collaborator.firstname ~ ' ' ~ new_collaborator.lastname }}
                                            </div>
                                        </th>
                                        <td>
                                            <div class="d-flex justify-content-center">
                                                {{ new_collaborator.date|format_datetime('short', 'none', locale='fr') }}
                                            </div>
                                        </td>
                                        <td>
                                            <div class="d-flex justify-content-center">
                                                {{ new_collaborator.profession.name }}
                                            </div>
                                        </td>
                                        <td>
                                            <div class="d-flex justify-content-center">
                                                <a href="{{ path('profile', { 'id': new_collaborator.id }) }}">
                                                    <i class="fas fa-eye text-dark"></i>
                                                </a>
                                            </div>
                                        </td>
                                    </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="w-100 tab-pane fade border p-4" id="dropdown1">
                    <div class="container w-100 m-2 p-4">
                        <table class="table table-hover">
                            <thead>
                                <tr>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Nom</div>
                                    </th>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Date de saisie</div>
                                    </th>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Profession</div>
                                    </th>
                                    <th scope="col">
                                        <div class="d-flex justify-content-center">Voir le profil</div>
                                    </th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for modified_profile in modified_profiles %}
                                    <tr>
                                        <th>
                                            <div class="d-flex justify-content-center fs-5">
                                                {{ modified_profile.firstname ~ ' ' ~ modified_profile.lastname }}
                                            </div>
                                        </th>
                                        <td>
                                            <div class="d-flex justify-content-center">
                                                {{ modified_profile.date|format_datetime('short', 'none', locale='fr') }}
                                            </div>
                                        </td>
                                        <td>
                                            <div class="d-flex justify-content-center">
                                                {{ modified_profile.profession.name }}
                                            </div>
                                        </td>
                                        <td>
                                            <div class="d-flex justify-content-center">
                                                <a href="{{ path('profile', { 'id': modified_profile.id }) }}">
                                                    <i class="fas fa-eye text-dark"></i>
                                                </a>
                                            </div>
                                        </td>
                                    </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
{% endblock %}