{% extends "::base.html.twig" %}

{% block title %}AppBundle:Directeur:index{% endblock %}

{% block body %}

    <div class="col-lg-12 grid-margin stretch-card">
        <div class="card">
            <div class="card-body">
                <h4 class="card-title">Liste des mes documents</h4>
                <div class="table-responsive">


                    {% for message in app.flashes('success') %}
                        <div class="flash-notice alert alert-success">
                            {{ message }}
                        </div>
                    {% endfor %}

                    <table class="table table-striped table-bordered" id="example" style="width:100%">
                        <thead>
                        <tr>

                            <th>Titre</th>
                            <th>Date d'enregistrement</th>
                            <th>Commentaire</th>
                            <th>Actions</th>
                        </tr>
                        </thead>
                        <tbody>

                        {% for document in documents %}
                            <tr>

                                <td>{{ document.titre }}</td>
                                <td>{% if document.dateCreation %}{{ document.dateCreation|date('Y-m-d H:i:s') }}{% endif %}</td>
                                <td>{{ document.commentaire }}</td>
                                <td>
                                    <a class="btn btn-primary" href="{{ path('document_show', { 'id': document.id }) }}">
                                        <i class="mdi mdi-eye"></i>
                                    </a>
                                    &nbsp;&nbsp;&nbsp;&nbsp;
                                    <a class="btn btn-warning" href="{{ path('document_edit', { 'id': document.id }) }}">
                                        <i class="mdi mdi-account-edit"></i>
                                    </a>
                                    &nbsp;&nbsp;&nbsp;&nbsp;
                                    <button type="button" id="{{ document.id }}" class="btn btn-primary" onclick="reply_click(this.id)" data-toggle="modal" data-target="#exemple">
                                        <i class="mdi mdi-arrow-collapse-right"></i>
                                    </button>
                                </td>
                            </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>


    <!-- Modal -->
    <div class="modal fade" id="exemple" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Redirection de document</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form id="form-redirect" action="{{ path('redirection') }}" method="post">
                        <div class="form-group">
                            <label for="">Choisir les utilisateurs</label>
                            <select name="users[]" class="form-control" multiple data-live-search="true">
                                {% for user in users %}
                                    <option value="{{ user.id }}">
                                        {{ user.username }}
                                    </option>
                                {% endfor %}
                            </select>
                        </div>
                        <div class="form-group">
                            <label for="">Commentaire</label>
                            <textarea name="commentaire" class="form-control"></textarea>
                        </div>
                        <input type="hidden" name="document" id="document_this" value="">
                        <input type="hidden" name="route_current" value="{{ app.request.attributes.get('_route') }}">
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Quitter</button>
                    <button type="submit" form="form-redirect" class="btn btn-primary">Valider</button>
                </div>
            </div>
        </div>
    </div>

{% endblock %}

{% block javascripts%}

    {{ parent() }}
    <script>
        function reply_click(clicked_id)
        {
            console.log(clicked_id);
            $(document).ready(function() {
                $('#document_this').val(clicked_id)
            })
        }



        $(document).ready(function() {

            /*$(".document").click(function(event) {
                console.log(event.target.id);
                $('#document_this').val(event.target.id)
            });*/

            // $('select').selectpicker();

            $('#example').DataTable({
                oLanguage: {
                    "sProcessing":     "Traitement en cours...",
                    "sSearch":         "Rechercher&nbsp;:",
                    "sLengthMenu":     "Afficher _MENU_ &eacute;l&eacute;ments",
                    "sInfo":           "Affichage de l'&eacute;l&eacute;ment _START_ &agrave; _END_ sur _TOTAL_ &eacute;l&eacute;ments",
                    "sInfoEmpty":      "Affichage de l'&eacute;l&eacute;ment 0 &agrave; 0 sur 0 &eacute;l&eacute;ment",
                    "sInfoFiltered":   "(filtr&eacute; de _MAX_ &eacute;l&eacute;ments au total)",
                    "sInfoPostFix":    "",
                    "sLoadingRecords": "Chargement en cours...",
                    "sZeroRecords":    "Aucun &eacute;l&eacute;ment &agrave; afficher",
                    "sEmptyTable":     "Aucune donn&eacute;e disponible dans le tableau",
                    "oPaginate": {
                        "sFirst":      "Premier",
                        "sPrevious":   "Pr&eacute;c&eacute;dent",
                        "sNext":       "Suivant",
                        "sLast":       "Dernier"
                    },
                    "oAria": {
                        "sSortAscending":  ": activer pour trier la colonne par ordre croissant",
                        "sSortDescending": ": activer pour trier la colonne par ordre d&eacute;croissant"
                    },
                    "select": {
                        "rows": {
                            _: "%d lignes séléctionnées",
                            0: "Aucune ligne séléctionnée",
                            1: "1 ligne séléctionnée"
                        }
                    }
                }
            });
        } );
    </script>

    <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"> </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.1/css/bootstrap-select.css"></script>

{% endblock %}
