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

{% block title %}{% trans %} COSAP - Interims Temporaires {% endtrans %}{% endblock %}


{% block stylesheets %}
{{ parent() }}

    <style>
        .app-contacts .chat-fixed-search {
            position: fixed;
            z-index: 999;
            background: #FFFFFF;
            width: 300px;
            border-bottom: 1px solid #E4E7ED;
        }
    </style>

{% endblock %}

{% block body %}

{{ parent() }}

    <div class="content-detached content-right">
        <div class="content-body">
            <div class="content-overlay"></div>
            <section class="row">
                <div class="col-12">
                    <div class="card" style="height:60px;">
                        <div class="card-body">
                            <div class="bug-list-search">
                                <div class="bug-list-search-content">
                                    <div class="sidebar-toggle d-block d-lg-none"><i class="ft-menu font-large-1" style="line-height:0.5"></i></div>
                                    <form action="#" >
                                        <h6 style="font-weight:500;">
                                           {% trans %} Hiérarchie - Intérims Temporaires{% endtrans %} <span class="badge badge badge-info badge-pill mr-2">{{ groupes|length }} {% trans %}Bureaux{% endtrans %}</span>
                                            <span><a class="btn btn-warning btn-sm pull-right" href="{{ path('interimTemporaire_page') }}" title="{% trans %}Actualiser{% endtrans %}"><i class="fa fa-refresh"></i></a></span>
                                        </h6>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

            <!-- debut partie pour l'ajout ou le modif de chef departement -->
            {% if action == "add" or action == "edit" %}
                <section class="row">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-body">
                                <h6 style="font-weight:500;"> {% if action == "add" %} {% trans %} Nouvel Enregistrement{% endtrans %} {% else %} {% trans %}Modifier Enregistrement {% endtrans %}{% endif %}</h6><hr>
                                {{ include('Hierarchie/interim_temporaire/action.html.twig') }}
                            </div>
                        </div>
                    </div>
                </section>
            {% endif %}
            <!--fin partie pour l'ajout ou le modif de chef departement -->

            <section class="row all-contacts">
                <div class="col-12">
                    <div class="card card-bottom">
                        <div class="card-content">
                            <div class="card-body" style="min-height:1500px;">
                                {% if not show_details %}

                                    <div class="alert alert-info mb-3 mt-2" role="alert">
                                        <i class="fa fa-info-circle mr-1"></i> {% trans %}Aucun intérim temporaire trouvé !{% endtrans %}
                                    </div>

                                {% else %}

                                <span style="font-size:13.5px !important; font-weight:500 !important;">{{ selected_groupe.name }}</span>

                                <span class="badge badge badge-info badge-pill mr-2" id="nb_responsable">{{ users.getTotalItemCount }}</span>

                                <span><a class="btn btn-warning btn-sm pull-right" href="{{ path('interimTemporaire_details_page',{id_groupe: selected_groupe.id,search_groupe:search_groupe}) }}" title="{% trans %}Actualiser{% endtrans %}"><i class="fa fa-refresh"></i></a></span>

                                {% if app.user and is_granted('ROLE_AJOUTER_INTERIM_TEMPORAIRE') and not is_exist_interimTemporaire|length %}
                                    <span><a class="btn btn-info btn-sm pull-right mr-1" href="{{ path('add_interimTemporaire_page',{id_groupe: selected_groupe.id,search_groupe:search_groupe}) }}" title="{% trans %}Ajouter{% endtrans %}"><i class="fa fa-plus"></i> {% trans %}nouvel enregistrement{% endtrans %}</a></span>
                                {% endif %}
                                <!-- debut show table -->
                                <hr>

                                    <div class="mb-2 mt-1">
                                        <div class="bug-list-search-content {% if action != "" %} d-none {% endif %}">
                                            <form method="get" action="">
                                                <div class="position-relative">
                                                    <input type="search" id="search-contacts" name="search_input" value="{{ app.request.get('search_input')}}" class="form-control" placeholder="Recherche avancée...">
                                                    <div class="form-control-position">
                                                        <i class="fa fa-search text-size-base text-muted la-rotate-270"></i>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                    {% if not users|length %}

                                        <div class="alert alert-info mb-1 mt-1" role="alert">
                                            <i class="fa fa-info-circle mr-1"></i> {% trans %}Aucun enregistrement trouvé !{% endtrans %}
                                        </div>

                                    {% else %}
                                    <!-- Debut Table Interim Temporaire -->
                                    <div class="table-responsive m-t-40">
                                        <table class="display nowrap table table-hover table-bordered contact-list" id="table_chef_equipe" cellspacing="0"
                                            width="100%" style="font-size:15px;">
                                            <thead>
                                            <tr>
                                                <th style="font-weight: bold;">{% trans %}Intérim{% endtrans %}</th>
                                                <th style="font-weight: bold;">{% trans %}Utilisateur cible{% endtrans %}</th>
                                                <th style="font-weight: bold;"><center>{% trans %}Date Début{% endtrans %}</center></th>
                                                <th style="font-weight: bold;"><center>{% trans %}Date Fin{% endtrans %}</center></th>
                                                {% if app.user and (is_granted('ROLE_MODIFIER_INTERIM_TEMPORAIRE') or is_granted('ROLE_SUPPRIMER_INTERIM_TEMPORAIRE') or is_granted('ROLE_ACTIVER_DESACTIVER_INTERIM_TEMPORAIRE')) %}
                                                <th style="font-weight: bold;"><center>{% trans %}Actions{% endtrans %}</center></th>
                                                {% endif %}
                                            </tr>
                                            </thead>
                                            <tbody style="line-height:40px;">
                                                {% for user in users %}
                                                    <tr class="rowDetail" id="row_{{ user.id }}" data-id="{{ user.id }}" {% if user.isActif == 1 %} Style="background-color:#d6f3d1; cursor:pointer;" {% elseif user.isActif == 0 and user.isDone == 1  %} Style="background-color:#FFDEE2; cursor:pointer;" {% endif %}>
                                                        <td {% if user.interimTemporaire is not null %} title="{{user.interimTemporaire.groupe.name}}" {% endif %}>
                                                            <div class="media">
                                                                {% if user.interimTemporaire is not null %}
                                                                    <div class="media-left" style="padding-right:5px;"><span class="avatar rounded-circle"><img src="{{ asset('uploads/avatars/'~user.interimTemporaire.path)}}" height="30" alt="avatar" ><i></i></span></div>
                                                                {% endif %}
                                                                <div class="media-body media-middle">
                                                                    <a class="media-heading name">{% if user.interimTemporaire is not null %}{{ user.interimTemporaire.firstName }} {{ user.interimTemporaire.lastName }} {% endif %}</a>
                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td {% if user.cible is not null %} title="{{user.cible.groupe.name}}" {% endif %} >
                                                            {% if user.cible %}
                                                            <div class="media">
                                                                <div class="media-left" style="padding-right:5px;"><span class="avatar rounded-circle"><img src="{{ asset('uploads/avatars/'~user.cible.path)}}" height="30" alt="avatar" ><i></i></span></div>
                                                                <div class="media-body media-middle">
                                                                    <a class="media-heading name"> {{ user.cible.firstName }} {{ user.cible.lastName }} </a>
                                                                </div>
                                                            </div>
                                                            {% endif %}
                                                        </td>
                                                        <td style="min-width:110px; max-width:110px;"><center>{% if user.dateDebut is not null %} {% if user.isActif == 1 or user.isDone == 1 %} {{ user.dateDebut |date ('Y-m-d H:i') }} {% else %} {{ user.dateDebut |date ('Y-m-d') }}  {% endif %} {% endif %}</center></td>
                                                        <td style="min-width:110px; max-width:110px;"><center>{% if user.dateFin is not null %} {% if user.isActif == 0 and user.isDone == 1 %} {{ user.dateFin |date ('Y-m-d H:i') }} {% else %} {{ user.dateFin |date ('Y-m-d') }} {% endif %} {% endif %}</center></td>
                                                            {% if app.user and (is_granted('ROLE_MODIFIER_INTERIM_TEMPORAIRE') or is_granted('ROLE_SUPPRIMER_INTERIM_TEMPORAIRE') or is_granted('ROLE_ACTIVER_DESACTIVER_INTERIM_TEMPORAIRE')) %}
                                                            <td style="min-width:90px;max-width:90px;">
                                                            <center>
                                                                {% if user.isActif == 0 and user.isDone == 1 %}
                                                                    <span class="badge badge-secondary">{% trans %}Non Autorisée{% endtrans %}</span>
                                                                {% else %}
                                                                    {% if app.user and is_granted('ROLE_MODIFIER_INTERIM_TEMPORAIRE') and user.isActif == 0 and user.isDone == 0 %}
                                                                        <a class="btn btn-linkedin btn-sm" href="{{ path('edit_interimTemporaire_page',{id_groupe:selected_groupe.id,id_interimTemporaire:user.id,search_groupe:search_groupe}) }}" title="{% trans %}Modifier{% endtrans %}" style="cursor:pointer;">
                                                                            <i class="fa fa-pencil-square-o" aria-hidden="true" style="color:white;"></i>
                                                                        </a>
                                                                    {% endif %}
                                                                    {% if app.user and is_granted('ROLE_ACTIVER_DESACTIVER_INTERIM_TEMPORAIRE') %}
                                                                        <a  class="btn {% if user.isActif == 0 and user.isDone == 0 %} btn-success {% elseif user.isActif == 1 and user.isDone == 1 %} btn-red {% endif %} btn-sm"
                                                                            {% if user.isActif == 0 and user.isDone == 0 %} href="{{ path('activate_interimTemporaire_page',{id_groupe:selected_groupe.id,id_interimTemporaire:user.id,search_groupe:search_groupe}) }}" title="{% trans %}Activer{% endtrans %}" style="cursor:pointer;"
                                                                            {% elseif user.isActif == 1 and user.isDone == 1 %} href="{{ path('desactivate_interimTemporaire_page',{id_groupe:selected_groupe.id,id_interimTemporaire:user.id,search_groupe:search_groupe}) }}" title="{% trans %}Désactiver{% endtrans %}" style="cursor:pointer;" {% endif %} >
                                                                            <i class="fa {% if user.isActif == 0 and user.isDone == 0 %} fa-check {% elseif user.isActif == 1 and user.isDone == 1 %} fa fa-ban {% endif %}" aria-hidden="true" style="color:white;"></i>
                                                                        </a>
                                                                    {% endif %}
                                                                    {% if app.user and is_granted('ROLE_SUPPRIMER_INTERIM_TEMPORAIRE') and user.isActif == 0 and user.isDone == 0 %}
                                                                        <a class="btn btn-danger btn-sm" id="delete_interimTemporaire" data-id="{{ user.id }}" data-groupe="{{ selected_groupe.id }}"
                                                                            data-toggle="modal" data-target="#modal_delete_interimTemporaire" title="{% trans %}Supprimer{% endtrans %}" style="cursor:pointer;">
                                                                            <i class="fa fa-trash-o" aria-hidden="true" style="color:white;"></i>
                                                                        </a>
                                                                    {% endif %}
                                                                {% endif %}
                                                            </center>
                                                        </td>
                                                        {% endif %}
                                                    </tr>
                                                {% endfor %}
                                            </tbody>
                                        </table>
                                        <div class="navigation pull-right" style="margin-left:20px;">
                                            {{ knp_pagination_render(users) }}
                                        </div>
                                    </div>
                                    <!-- End Table Interim Temporaire -->
                                    {% endif %}
                                {% endif %}
                            </div> <!-- end card body -->
                        </div>
                    </div>
                </div>
            </section>
        </div>
    </div>

    <!-- Side Left Bar -->
    <div class="sidebar-detached sidebar-left sidebar-fixed ps ps--active-y">
        <div class="sidebar">
            <div class="bug-list-sidebar-content">
                <!-- Predefined Views -->
                <div class="card" style="height:90vh;">

                    <div class="card-body chat-fixed-search">

                        <form method="get" action="">
                            <fieldset class="position-relative has-icon-left">
                                <input type="text" class="form-control" name="search_groupe" value="{{app.request.get('search_groupe')}}" id="iconLeft4" placeholder="Recherche Bureau...">
                                <div class="form-control-position">
                                    <i class="ft-search"></i>
                                </div>
                            </fieldset>

                        </form>
                    </div>

                    <!-- contacts view -->
                    <div class="list-group list-group-messages" style="padding-top:92px; padding-bottom:100px;">

                        {% if not groupes|length %}
                            <div class="alert alert-info mb-2" role="alert">
                                <i class="fa fa-info-circle mr-1"></i> {% trans %}Aucun groupe trouvé !{% endtrans %}
                            </div>
                        {% endif %}
                        {% for groupe in groupes %}
                                <a href="{{ path('interimTemporaire_details_page',{id_groupe:groupe.id, search_groupe:search_groupe}) }}" title="{{groupe.name}}"
                                        class="ellipsis process_arptc{% if selected_groupe is defined and groupe.id == selected_groupe.id %} active {% endif %} list-group-item list-group-item-action border-0" title="{{ groupe.name }}">
                                        <i class=" fa fa-users"></i>
                                    <span>{{ groupe.name }}</span>
                                </a>
                        {% endfor %}
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End Side Left Bar -->

    <!--  start modal suppression chef d'équipe -->

    <div id="modal_delete_interimTemporaire" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-keyboard="false"
         data-backdrop="static">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="myModalLabel" style="color:#4b50fc">{% trans %}Suppression enregistrement{% endtrans %}</h5>
                    <a class="btn btn-danger btn-sm" data-dismiss="modal" aria-hidden="true" title="{% trans %}Fermer{% endtrans %}"><i class="fa fa-close text-white"></i></a>
                </div>
                <div class="modal-body">
                    <p style="color:black;">{% trans %}Voulez vous vraiment supprimer cet utilisateur ?{% endtrans %}</p>
                </div>
                <form method="post" novalidate>
                    <div class="modal-footer" style="display:flex !important; justify-content:space-between">
                        <a class="btn btn-danger waves-effect btn-sm" data-dismiss="modal" style="color:white; padding:7px;"><i class="ft-x-square"></i> {% trans %}Annuler{% endtrans %}</a>
                        <a class="btn btn-success waves-effect btn-sm" data-token-delete="{{ csrf_token('delete-item') }}" style="color:white; padding:7px" id="confirmer_delete"><i class="ft-check-square"></i> {% trans %}Confirmer{% endtrans %}</a>
                    </div>
                </form>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

    <!--  end  modal suppression chef d'équipe -->

{% endblock %}


{% block javascripts %}
   {{ parent() }}

    <script type="text/javascript">

        $('#dateDebut').bootstrapMaterialDatePicker({weekStart: 0, time: false, disabledDays: [], lang: 'fr', weekStart: 1});

        $('#dateFin').bootstrapMaterialDatePicker({weekStart: 0, time: false, disabledDays: [], lang: 'fr', weekStart: 1});


        {% for flash_message in app.session.flashBag.get('success') %}

            toastr.success('{{ flash_message }}', {positionClass: 'toast-top-center', containerId: 'toast-top-center'});

        {% endfor %}

        {% for flash_message in app.session.flashBag.get('info') %}

            toastr.info('{{ flash_message }}', {positionClass: 'toast-top-center', containerId: 'toast-top-center'});

        {% endfor %}


        {% for flash_message in app.session.flashBag.get('warning') %}

            toastr.warning('{{ flash_message }}', {positionClass: 'toast-top-center', containerId: 'toast-top-center'});

        {% endfor %}

        {% for flash_message in app.session.flashBag.get('error') %}

            toastr.error('{{ flash_message }}', {positionClass: 'toast-top-center', containerId: 'toast-top-center'});

        {% endfor %}
    </script>


    {% include('Hierarchie/interim_temporaire/ajax/delete.html.twig') %}


{% endblock %}