{# templates/superadmin_v2/artisans/sa_gestion_artisans_villes_add.html.twig #}
{% extends 'superadmin_v2/superadmin.html.twig' %}

{% block title %}Gestion des Artisans - Joindre Ville - {{ 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="col-lg-4" style="margin-top:14px!important;">[ {{ listing|length }} ]</div>
                    <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_interface" class="form-control-label spa-label">Interface</label>
                            </div>
                            <div class="col-12 col-md-6 fg-m-bottom">
                                <select class="form-control" id="s_interface" onchange="window.location.href='{{ path('superadmin_gestion_artisans_villes_add') }}?interface=' + $(this).val();">
                                    {% for key,row in api_array %}
                                    <option value="{{ key }}"{% if key == interface %} selected{% endif %}>{{ row.nom }}</option>
                                    {% endfor %}
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4"></div>
                </div>
                
                <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" style="background-color:#{{ color }};">ID</a></th>
                                <th style="background-color:#{{ color }};">Société</th>
                                <th class="width-20" style="background-color:#{{ color }};">Ville</th>
                                <th class="width-18" style="background-color:#{{ color }};">Infos</th>
                                <th class="width-8" style="background-color:#{{ color }};">Création /<br>Inscription</a></th>
                                <th class="width-15" style="background-color:#{{ color }};">Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for k,row in listing %}
                            <tr>
                                <td class="text-center"><b><a target="_blank" href="{{ path('superadmin_gestion_artisans_list') }}?id={{ row.id }}">{{ row.id }}</a></b></td>
                                <td>
                                    <b>{{ row.societe }}</b>
                                    {% if row.gerant|length > 0 %}<br><b>Gérant :</b> {{ row.gerant }}{% endif %}
                                    <br>
                                    {% if row.siret|length > 0 %}<br><b>N° SIRET :</b> {{ row.siret }}{% endif %}
                                    {% if row.tva|length > 0 %}<br><b>N° TVA :</b> {{ row.tva }}{% endif %}
                                </td>
                                <td class="text-center">
                                    <input type="text" class="form-control" style="color:red;height:28px;font-size:12px;" value="{{ row.ville|trim }} {{ row.cp }}">
                                    <a target="_blank" href="{{ path('superadmin_villes_list') }}?qg={{ row.ville|trim }} {{ row.cp }}">{{ row.ville|trim }} {{ row.cp }}</a>
                                </td>
                                <td>
                                    <i class="zmdi zmdi-email zmdi-hc-lg"></i>&nbsp; {{ row.email }}
                                    {% if row.tel|length > 0 %}<br><i class="zmdi zmdi-phone zmdi-hc-lg"></i>&nbsp; {{ row.tel }}{% endif %}
                                    {% if row.mobile|length > 0 %}<br><i class="zmdi zmdi-smartphone zmdi-hc-lg"></i>&nbsp; {{ row.mobile }}{% endif %}
                                    {% if row.mobile_bis|length > 0 %}<br><i class="zmdi zmdi-smartphone zmdi-hc-lg"></i>&nbsp; {{ row.mobile_bis }}{% endif %}
                                    <br>
                                    <br><i class="zmdi zmdi-pin zmdi-hc-lg"></i>&nbsp; {{ row.adresse }}
                                </td>
                                <td class="text-center">{{ row.creation_date|date('d-m-Y H:i') }}</td>
                                <td class="text-center">
                                    <div class="table-data-feature">
                                        <button class="item primary" onclick="joindreVilleForm({{ row.id }},'{{ interface }}');" data-toggle="modal" data-target="#app_modal">
                                            <i class="zmdi zmdi-edit"></i>
                                        </button>
                                    </div>
                                </td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                    {% endif %}
                </div>
            </div>

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

{% block javascripts %}
    {{ parent() }}
    <script type="text/javascript">
    // <![CDATA[
    $(document).ready(function(){
        $(document).on('keyup', 'form#ge_artisans_joindre_ville_form input#q_ville', function(){
            $('form#ge_artisans_joindre_ville_form input#id_ville').val('0'); 
            var q_ville = $('form#ge_artisans_joindre_ville_form input#q_ville').val();
            var artisan_id = $('form#ge_artisans_joindre_ville_form input#artisan_id').val();
            //alert(q_ville);
            if (q_ville.length > 0) {
                //alert(q_ville);
                $.ajax({
                    url : '{{ path("superadmin_gestion_artisans_rechercher_ville") }}',
                    type : 'POST',
                    data : {q:q_ville,artisan_id:artisan_id},
                    dataType : 'json',
                    success : function(response){
                        //alert('success');
                        if (response.num_rows > 0) {  
                            var listing = response.listing;
                            var lines = '<div class="close_search_ville">X</div>';
                            for (var key in listing) {
                                var obj = listing[key];
                                var bg = (key%2 == 0) ? '248, 248, 255' : '255, 255, 255';
                                var ville = obj.ville;
                                var ville_replace = ville.replace(/'/g, "\\'");

                                lines += '<div class="line_ville" onclick="selectVille(' + obj.id + ', \'' + obj.cp + '\', \'' + ville_replace + '\');" style="background-color:rgb(' + bg + ');">';
                                lines += '<div class="detail_ville">' + obj.cp + ' - ' + ville + '</div>';
                                lines += '</div>';
                            }
                            $('#listing_villes_box').html(lines).show();
                        } else {
                            $('#listing_villes_box').hide().html('');
                        }
                    },
                    error : function(e){
                        //alert('error');
                    }
                });
            } else {
                $('#listing_villes_box').hide().html('');
            }
        });

        $(document).on('click', '.close_search_ville', function(){
            $('#listing_villes_box').hide().html('');
            $('form#ge_artisans_joindre_ville_form input#q_ville').val('');
            $('form#ge_artisans_joindre_ville_form input#id_ville').val('0'); 
        });

        $(document).on('click', 'form#ge_artisans_joindre_ville_form #ge_artisans_joindre_ville_submit', function(){
            var ckeck = 0;

            if ($('form#ge_artisans_joindre_ville_form input#id_ville').val() == 0) {	
                $('#joindre-ville-error').html('Veuillez choisir une ville');
                $('form#ge_artisans_joindre_ville_form input#q_ville').addClass('is-invalid').on('focus', function(){
                    $(this).removeClass('is-invalid');
                    $('#joindre-ville-error').html('');
                });
            }

            if (ckeck == 0) {
                //$('form#ge_artisans_joindre_ville_form').submit();
                //return true;
                joindreVilleAction($('form#ge_artisans_joindre_ville_form input#interface').val(), $('form#ge_artisans_joindre_ville_form input#id_artisan').val(), $('form#ge_artisans_joindre_ville_form input#id_ville').val())
                return false;
            } else {
                return false;
            }
        });
    });
    // ]]>

    function joindreVilleForm(id, interface){
        $('#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_gestion_artisans_list') }}/"+ id +"/joindre-ville-form",
            type : 'POST',
            data : {interface:interface},
            dataType : 'json',
            success : function(response){
                if (response.code == 200) {
                    $('#app_modal').html(response.html);
                }
            },
            error : function(e){
            }
        });
    }

    function joindreVilleAction(interface, id_artisan, id_ville){
        //alert(interface + ' | ' + id_artisan + ' | ' + id_ville);
        $.ajax({
            url : "{{ path('superadmin_gestion_artisans_list') }}/"+ id_artisan +"/joindre-ville-action",
            type : 'POST',
            data : {interface:interface,id_ville:id_ville},
            dataType : 'json',
            success : function(response){
                alert('success');
                if (response.code == 200) {
                    //$('#app_modal').html(response.html);
                    //alert(response.message);
                    alert(response.message);
                }
            },
            error : function(e){
                alert('error');
            }
        });
    }

    function selectVille(id, cp, ville){
        $('#listing_villes_box').hide().html('');

        $('form#ge_artisans_joindre_ville_form input#q_ville').val(cp + ' ' + ville); 
        $('form#ge_artisans_joindre_ville_form input#id_ville').val(id); 
    }
    </script>
{% endblock %}