{% extends '::layout.html.twig' %}
{% block content %}
    <section id="page-title" style="padding: 16px 0;">
        <div class="row">
            <div class="col-sm-8">
                <h2 class="mainTitle"><i class="fa fa-user-secret" style="color: #E10031  !important;font-size: 24px;"></i> {{ 'directeur.title' |trans }}</h2>
            </div>
            <ol class="breadcrumb" style="margin: 0px 0 0 !important;">
                <li>
                    <span>{{ 'pages.request.hseq' |trans }}</span>
                </li>
                <li>
                    <span>{{ 'directions.path' |trans }}</span>
                </li>
                <li class="active">
                    <span>{{ 'pages.request.list' |trans }}</span>
                </li>
            </ol>
        </div>
    </section>
    <div class="container-fluid container-fullw ">
        <div class="row">
            <div class="col-md-12">
                {% include '@Demande/flashBag.html.twig' %}
                <div class="panel panel-white" id="panel6">
                    <div class="panel-body">
                        <table class="table table-striped table-hover sample_3">
                            <thead>
                            <tr>
                                <th class="hidden-xs center"><strong> {{ 'admin.list.nom' |trans }} </strong></th>
                                <th class="hidden-xs center"><strong> {{ 'admin.list.prenom' |trans }} </strong></th>
                                <th class="hidden-xs center"><strong> Email </strong></th>
                                <th class="hidden-xs center"><strong> {{ 'admin.list.fonction' |trans }} </strong></th>
                                <th class="hidden-xs center"><strong> Direction </strong></th>
                                <th class="hidden-xs center"><strong> {{ 'admin.list.status' |trans }} </strong></th>
                            </tr>
                            </thead>
                            <tbody>
                            {% for var in directeurs %}
                                <tr id-user="{{ var.id }}">
                                    <td class="hidden-xs center"> {{ var.nom }} </td>
                                    <td class="hidden-xs center"> {{ var.prenom }} </td>
                                    <td class="hidden-xs center"> {{ var.email }} </td>
                                    <td class="hidden-xs center">{{ var.metier }}</td>
                                    <td class="hidden-xs center">
                                        {% if var.enabled == false %}
                                            <a id-user="" pays="paysByDG" class="widget-icon btnAffect"
                                               data-toggle="modal"
                                               data-target=".bs-example-modal-sm" title="Affecter Direction">
                                                <i class="ti-key text-primary"></i>
                                            </a>
                                        {% else %}
                                            {{ var.site }}
                                        {% endif %}
                                    </td>
                                    <td class="hidden-xs center">
                                        {% if var.enabled == false %}
                                            <span class="label label-sm label-danger">{{ 'admin.list.statusD' |trans }}</span>
                                        {% else %}
                                            <span class="label label-sm label-success">{{ 'admin.list.statusA' |trans }}</span>
                                        {% endif %}
                                    </td>
                                </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title" id="myModalLabel">{{ 'directeur.add.title' |trans }}</h4>
                </div>
                <div class="modal-body">
                    <br>
                    {{ 'directeur.add.desc' |trans }}
                    <br>
                    <select class="cs-select cs-skin-slide direction" id="myselect">
                        <option value="0">Select direction</option>
                        {% for var in directions %}
                            <option value="{{ var.id }}" data-class="ti-world">{{ var }}</option>
                        {% endfor %}
                    </select>
                </div>
                <form type="post" action="{{ path('gestion_directeur_site_affect') }}">
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary btn-o valider">
                            {{ 'directeur.add.button' |trans }}
                        </button>
                        <input type="hidden" class="uid" name="userId" value=""/>
                        <input type="hidden" class="did" name="directionId" value=""/>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <!-- end: DYNAMIC TABLE -->
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script type="text/javascript">
        $('.btnAffect').on('click', function () {
            $('.btnAffect').attr('id-user', $(this).closest('tr').attr('id-user'));
            $('.uid').val($('.btnAffect').attr('id-user'));
        });
        $('.valider').on('click', function () {
            $('.did').val($('.direction').find(":selected").val());
        });
    </script>



{% endblock %}