{# templates/superadmin_v2/villes/sa_villes_list.html.twig #}
{% extends 'superadmin_v2/superadmin.html.twig' %}

{% block title %}Villes - {{ parent() }}{% endblock %}

{% block body %}
    {{ render(controller('App\\Controller\\Superadmin\\SaLayoutController::breadcrumb', {'rubriques_id':rubriques_id, 'action':filariane_action} )) }}

    {{ include('superadmin_v2/layout/sa_tab.html.twig') }}

    <div class="section__content section__content--p30">
        {{ include('superadmin_v2/layout/sa_debug.html.twig') }}

        {{ include('superadmin_v2/layout/sa_alert.html.twig') }}

        <div class="container-fluid">
            <div class="row">
                <div class="table-data__tool" style="width:100%;">
                    <div class="table-data__tool-left col-lg-4">
                        <div class="row form-group fg-m-bottom" style="margin:6px 0!important;">
                            <div class="col col-md-5 spa-col-label fg-m-bottom">
                                <label for="s_departement" class="form-control-label spa-label">Département</label>
                            </div>
                            <div class="col-12 col-md-6 fg-m-bottom">
                                <select class="form-control" id="s_departement" onchange="window.location.href='{{ path('superadmin_villes_list') }}{{ getLinkFilter('departement') }}' + $(this).val();">
                                    <option value="all">Tous</option>
                                    {% for row in list_departements %}
                                    <option value="{{ row.codeDepartement }}"{% if departement is defined and departement is not empty and departement == row.codeDepartement %} selected{% endif %}>{{ row.codeDepartement }} - {% if row.codeDepartement == 20 %}Corse{% else  %}{{ row.departement }}{% endif %}</option>
                                    {% endfor %}
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="table-data__tool-right col-lg-8">
                        <form class="form-horizontal" name="recherche_ville_form" id="recherche_ville_form" method="post" action="{{ path('superadmin_villes_list') }}">
                        <div class="row form-group fg-m-bottom" style="margin:6px 0 0!important;">
                            <div for="q" class="col col-md-2 spa-col-label fg-m-bottom">
                                <label class="form-control-label spa-label">Rechercher</label>
                            </div>
                            <div class="col-12 col-md-5 fg-m-bottom">
                                <input type="text" class="form-control" name="q" id="q" placeholder="Nom de la ville ou le code postal" value="{% if q is not empty %}{{ q }}{% endif %}" autocomplete="off">
                            </div>
                            <div class="col-12 col-md-2 fg-m-bottom">
                                <button type="button" id="recherche_ville_submit" class="btn btn-info btn-sm btn-block">Rechercher</button>
                            </div>
                            <div class="col-12 col-md-2 fg-m-bottom">
                                {# % if remote_addr == mon_ip % #}
                                {# % if app.user.id == 1 % #}
                                {% if 5 in roles %}
                                <button type="button" id="add_ville" class="btn btn-success btn-sm btn-block" data-toggle="modal" data-target="#app_modal">Ajouter</button>
                                {% endif %}
                            </div>
                        </div>
                        </form>
                    </div>
                </div>

                {% if link_google %}
                <table class="table table-borderless table-striped table-earning">
                    <tbody>
                        <tr>
                            <td><a target="_blank" href="{{ link_google }}">{{ link_google }}</a></td>
                        </tr>
                    </tbody>
                </table>
                {% endif %}

                {{ include('superadmin_v2/layout/sa_paginator.html.twig') }}

                <div class="table-responsive table--no-card m-b-30">

                    {% if nb_pages >= page %}
                    <table class="table table-borderless table-striped table-earning">
                        <thead>
                            <tr>
                                <th class="width-5"><a href="{{ path('superadmin_villes_list') }}{{ getLinkOrder('id') }}">ID {{ getDirectionV2('id')|raw }}</a></th>
                                <th>Ville</th>
                                <th class="width-10">Code postal</th>
                                <th class="width-20">Département</th>
                                <th class="width-10">Code département</th>
                                <th class="width-15">Nbr habitants</th>
                                <th class="width-10">Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for k,row in listing %}
                            <tr>
                                <td class="text-center"><b>{{ row.id }}</b></td>
                                <td>{{ row.ville }}</td>
                                <td class="text-center">{{ row.cp }}</td>
                                <td>{{ row.departement }}</td>
                                <td class="text-center">{{ row.codeDepartement }}</td>
                                <td>{{ row.nbrHabitants }}</td>
                                <td class="text-center">
                                    {% if remote_addr == mon_ip %}
                                    {# % if app.user.id == 1 % #}
                                    <div class="table-data-feature">
                                        <button class="item primary" onclick="editVilleForm({{ row.id }});" data-toggle="modal" data-target="#app_modal">
                                            <i class="zmdi zmdi-edit"></i>
                                        </button>
                                        <button class="item danger" onclick="remove({{ row.id }});" data-toggle="tooltip" data-placement="top" title="Supprimer">
                                            <i class="zmdi zmdi-delete"></i>
                                        </button>
                                    </div>
                                    {% endif %}

                                    <div class="table-data-feature" style="margin-top:6px!important;">
                                        <button class="item info" onclick="getJournal({{ row.id }});" data-toggle="modal" data-target="#app_modal">
                                            <i class="zmdi zmdi-file-text"></i>
                                        </button>
                                    </div>
                                </td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                    {% endif %}
                </div>

                {% if nb_pages >= page %}{{ include('superadmin_v2/layout/sa_paginator.html.twig') }}{% endif %}
            </div>

            {{ include('superadmin_v2/layout/sa_footer.html.twig') }}
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script type="text/javascript">
    // <![CDATA[
    $(document).ready(function(){
        {% if qg is not empty %}
            $('form#recherche_ville_form input#q').val('{{ qg }}');
            $('form#recherche_ville_form').submit();
        {% endif %}

        $('form#add_ville_form input#ville').focus();
        
        $(document).on('click', 'form#recherche_ville_form #recherche_ville_submit', function(){
            if ($('form#recherche_ville_form input#q').val().length > 1) {	
                $('form#recherche_ville_form').submit();
                return true;
            }
            return false;
        });

        $(document).on('click', '#add_ville', function(){
        $('#app_modal').html('<div class="modal-dialog modal-lg" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title"></h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body"></div></div></div>');
            var q = '{{ q }}';
            $.ajax({
                url : "{{ path('superadmin_villes_add_form') }}",
                type : 'POST',
                data : {q:q},
                dataType : 'json',
                success : function(response){
                    if (response.code == 200) {
                        $('#app_modal').html(response.html);
                        $('form#add_ville_form input#ville').focus();
                    }
                },
                error : function(e){
                }
            });
        });
        
        $(document).on('click', 'form#add_ville_form #add_ville_submit', function(){
            var ckeck = 0;
            
            if ($('form#add_ville_form input#ville').val().length == 0) {	
                ckeck += 1;
                $('form#add_ville_form input#ville').addClass('is-invalid');
                $('div#ville-error').html("Veuillez saisir la ville");
                $('form#add_ville_form input#ville').focus(function(){
                    $(this).removeClass('is-invalid');
                    $('div#ville-error').html('');
                });            
            }
            
            if ($('form#add_ville_form input#cp').val().length != 5) {	
                ckeck += 1;
                $('form#add_ville_form input#cp').addClass('is-invalid');
                $('div#cp-error').html("Veuillez saisir le codepostal");
                $('form#add_ville_form input#cp').focus(function(){
                    $(this).removeClass('is-invalid');
                    $('div#cp-error').html('');
                });            
            }
            
            if ($('form#add_ville_form select#departement').val() == 0) {	
                ckeck += 1;
                $('form#add_ville_form select#departement').addClass('is-invalid');
                $('div#departement-error').html("Veuillez choisir un département");
                $('form#add_ville_form select#departement').focus(function(){
                    $(this).removeClass('is-invalid');
                    $('div#departement-error').html('');
                });            
            }
            
            if (ckeck == 0) {
                $('form#add_ville_form').submit();
                return true;
            } else {
                return false;
            }
        });
        
        $(document).on('click', 'form#edit_ville_form #edit_ville_submit', function(){
            var ckeck = 0;
            
            if ($('form#edit_ville_form input#ville').val().length == 0) {	
                ckeck += 1;
                $('form#edit_ville_form input#ville').addClass('is-invalid');
                $('div#ville-error').html("Veuillez saisir la ville");
                $('form#edit_ville_form input#ville').focus(function(){
                    $(this).removeClass('is-invalid');
                    $('div#ville-error').html('');
                });            
            }
            
            if ($('form#edit_ville_form input#cp').val().length != 5) {	
                ckeck += 1;
                $('form#edit_ville_form input#cp').addClass('is-invalid');
                $('div#cp-error').html("Veuillez saisir le codepostal");
                $('form#edit_ville_form input#cp').focus(function(){
                    $(this).removeClass('is-invalid');
                    $('div#cp-error').html('');
                });            
            }
            
            if ($('form#edit_ville_form select#departement').val() == 0) {	
                ckeck += 1;
                $('form#edit_ville_form select#departement').addClass('is-invalid');
                $('div#departement-error').html("Veuillez choisir un département");
                $('form#edit_ville_form select#departement').focus(function(){
                    $(this).removeClass('is-invalid');
                    $('div#departement-error').html('');
                });            
            }
            
            if (ckeck == 0) {
                $('form#edit_ville_form').submit();
                return true;
            } else {
                return false;
            }
        });
    });
    // ]]>

    function editVilleForm(id){
        $('#app_modal').html('<div class="modal-dialog modal-lg" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title"></h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body"></div></div></div>');
        $.ajax({
            url : "{{ path('superadmin_villes_list') }}/" + id + "/edit-form",
            dataType : 'json',
            success : function(response){
                if (response.code == 200) {
                    $('#app_modal').html(response.html);
                }
            },
            error : function(e){
            }
        });
    }
    
    function remove(id){
        if (confirm("Êtes-vous sûr ?")) {
            $.ajax({
                url : "{{ path('superadmin_villes_list') }}/" + id + "/supprimer",
                dataType : 'json',
                success : function(response){
                    if (response.message === 'success') {
                        $('tr#row-' + id).remove();
                    }
                },
                error : function(e){
                }
            });
        }
    }

    function getJournal(id){
        $('#app_modal').html('<div class="modal-dialog modal-lg" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title"></h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body"></div></div></div>');
        $.ajax({
            url : "{{ path('superadmin_villes_list') }}/"+ id +"/list-journal",
            dataType : 'json',
            success : function(response){
                if (response.code == 200) {
                    $('#app_modal').html(response.html);
                }
            },
            error : function(e){
            }
        });
    }

    </script>
{% endblock %}