{% extends 'layout.twig' %}

{% block body %}

    <div class="contenu" id="panier">
    
        <h1>
            {{ 'Récapitulatif panier' | trad }} : {{ panier.lib_panier }}            
        </h1>

        {{ ariane() }}

        <div class="content">

            <form name="form_ctcLivraison_panier" id="form_ctcLivraison_panier">

                <h1>
                    {{ 'Centre de livraison' | trad }} : 

                    <button class="principal button" onClick="ajaxPopupV2('{{ path('Panier.CentreLivraison.validate') }}', 'form_ctcLivraison_panier');" >{{ 'Enregistrer' | trad }}</button>
                    {{ arianeAnnuler() }}
                </h1>

                <ul id="centreTab" class="nav nav-tabs sous_onglet">
                    <li id="onglet_DivMain" class="active">
                        <a data-toggle="tab" href="#DivMain">{{ 'Centre' | trad }}</a>
                    </li>
                    <li id="onglet_DivModulable" style="display:none">
                        <a data-toggle="tab" href="#DivModulable" class="ephemere"></a>
                    </li>
                    <li id="onglet_DivModulableCreation" style="display:none">
                        <a data-toggle="tab" href="#DivModulableCreation" class="ephemere"></a>
                    </li>
                </ul>


                <div class="tab-content">

                    <div id="DivModulable" class="tab-pane fade clearfix bg_form padding_form border_form">
                    </div>
                    
                    <div id="DivModulableCreation" class="tab-pane fade clearfix bg_form padding_form border_form">
                    </div>

                    <div id="DivMain" class="tab-pane active in clearfix bg_form padding_form border_form">
                        

                        <div class="clearfix">
                            <div class="colonne2">
                                <div class="row">
                                    {{ inputAdvance('ZOOMADVANCE', {
                                        'titre' : 'Centre de livraison' | trad,
                                        'name' : 'LIV_CTR',
                                        'pahtZoom' : path('Ajax.liste.centreLivraison'),
                                        'paramZoom' : "{'code_ste' : '"~panier.CODE_STE~"' }",
                                        'entity' : 'Centre',
                                        'titleZoom' : 'Liste des centres' | trad,
                                        'pathConvert' : path('Ajax.outil.convertLibelle'),
                                        'convertLibelle' : 'convertLibelleGlobal',
                                        'pathValidator' : path('Ajax.validator.zoom'),
                                        'paramsValidator' : "{'entity' : 'Centre','nomChamp' : 'Centre de livraison', 'null' : false, 'post' : {'filter_LIVRAISON' : 'T', 'filter_CODE_STE' : '"~commande.CODE_STE~"'}}",
                                        'value' : panier.LIV_CTR,
                                        'obligatoire' : true,
                                    }) }}
                                </div>
                            </div>
                            <div class="colonne2 last" id="divModTrans">
                                {% if panier.TRS_INTER |boolSql %}
                                <div class="row">
                                    {{ inputAdvance('SELECT', {
                                        'name' : 'MOD_TRS',
                                        'titre' : 'Mode de transport' | trad,
                                        'value' : panier.MOD_TRS,
                                        'listeValue' : listeModeTransport(),
                                        'obligatoire' : true,
                                    }) }}
                                </div>
                                {% endif %}
                            </div>
                        </div>

                        <div class="clearfix" id="refreshDiv">
                            <div class="colonne2">
                                <h4  id="iconeAdresse" class="pointer">
                                    {{ 'Adresse' | trad }}
                                    <span class="white-tooltip icon-user">
                                        <span class="infos_tooltip top-left">
                                            {{ 'Liste des adresses secondaires' | trad }}
                                        </span>
                                    </span>
                                </h4>
                                <input type='hidden' id='COD_ADR' name='COD_ADR' value=''>
                                <div class="row">
                                    {{ inputAdvance('TEXTAREA', {
                                        'name' : 'LIV_ADR',
                                        'titre' : 'Adresse' | trad,
                                        'value' : panier.LIV_ADR,
                                        'pathValidator' : path('Ajax.validator.isStringAvecEspace'),
                                        'paramValidator' : "{'sizeMin' : '0', 'sizeMax' : '90'}",
                                        'option' : droit.GLOB_AuthModAdrLiv? '':'readOnly',
                                    }) }}
                                </div>
                                <div class="row">
                                    {{ inputAdvance('TEXT', {
                                        'name' : 'LIV_VILLE',
                                        'titre' : 'Ville' | trad,
                                        'value' : panier.LIV_VILLE,
                                        'pathValidator' : path('Ajax.validator.isStringAvecEspace'),
                                        'paramValidator' : "{'sizeMin' : '0', 'sizeMax' : '35'}",
                                        'option' : droit.GLOB_AuthModAdrLiv? '':'readOnly',
                                    }) }}
                                </div>
                                <div class="row">
                                    {{ inputAdvance('TEXT', {
                                        'name' : 'LIV_CP',
                                        'titre' : 'Code postal' | trad,
                                        'value' : panier.LIV_CP,
                                        'pathValidator' : path('Ajax.validator.isStringAvecEspace'),
                                        'paramValidator' : "{'sizeMin' : '0', 'sizeMax' : '10'}",
                                        'option' : droit.GLOB_AuthModAdrLiv? '':'readOnly',
                                    }) }}
                                </div>

                                <div class="row">
                                    {{ inputAdvance('SELECT', {
                                        'name' : 'LIV_PAYS',
                                        'titre' : 'Pays' | trad,
                                        'value' : panier.LIV_PAYS,
                                        'listeValue' : listePays(),
                                        'option' : droit.GLOB_AuthModAdrLiv? '':'readOnly',
                                    }) }}
                                </div>
                            </div>

                            <div class="colonne2 last">
                                <h4  id="iconeContact" class="pointer">
                                    {{ 'Contact' | trad }}
                                    <span class="white-tooltip icon-user ">
                                        <span class="infos_tooltip top-left">
                                            {{ 'Liste des contacts' | trad }}
                                        </span>
                                    </span>
                                </h4>
                                <input type='hidden' id='CTC_IND' name='CTC_IND' value=''>
                                <div class="row">
                                    {{ inputAdvance('TEXT', {
                                        'name' : 'CTC_NOM',
                                        'titre' : 'Nom' | trad,
                                        'value' : panier.CTC_NOM,
                                        'pathValidator' : path('Ajax.validator.isStringAvecEspace'),
                                        'paramValidator' : "{'sizeMin' : '0', 'sizeMax' : '25'}",
                                        'option' : droit.GLOB_AuthModAdrLiv? '':'readOnly',
                                    }) }}
                                </div>
                                <div class="row">
                                    {{ inputAdvance('TEXT', {
                                        'name' : 'CTC_FCT',
                                        'titre' : 'Fonction' | trad,
                                        'value' : panier.CTC_FCT,
                                        'pathValidator' : path('Ajax.validator.isStringAvecEspace'),
                                        'paramValidator' : "{'sizeMin' : '0', 'sizeMax' : '25'}",
                                        'option' : droit.GLOB_AuthModAdrLiv? '':'readOnly',
                                    }) }}
                                </div>
                                <div class="row">
                                    {{ inputAdvance('TEXT', {
                                        'name' : 'CTC_TEL',
                                        'titre' : 'Téléphone' | trad,
                                        'value' : panier.CTC_TEL,
                                        'pathValidator' : path('Ajax.validator.isStringAvecEspace'),
                                        'paramValidator' : "{'sizeMin' : '0', 'sizeMax' : '16'}", 
                                        'option' : droit.GLOB_AuthModAdrLiv? '':'readOnly',
                                    }) }}
                                </div>
                                <div class="row">
                                    {{ inputAdvance('TEXT', {
                                        'name' : 'CTC_FAX',
                                        'titre' : 'Fax' | trad,
                                        'value' : panier.CTC_FAX,
                                        'pathValidator' : path('Ajax.validator.isStringAvecEspace'),
                                        'paramValidator' : "{'sizeMin' : '0', 'sizeMax' : '16'}",
                                        'option' : droit.GLOB_AuthModAdrLiv? '':'readOnly',
                                    }) }}
                                </div>
                                <div class="row">
                                    {{ inputAdvance('TEXT', {
                                        'name' : 'CTC_GSM',
                                        'titre' : 'Tél. portable' | trad,
                                        'value' : panier.CTC_GSM,
                                        'pathValidator' : path('Ajax.validator.isStringAvecEspace'),
                                        'paramValidator' : "{'sizeMin' : '0', 'sizeMax' : '16'}",
                                        'option' : droit.GLOB_AuthModAdrLiv? '':'readOnly',
                                    }) }}
                                </div>
                                <div class="row">
                                    {{ inputAdvance('TEXT', {
                                        'name' : 'CTC_MAIL',
                                        'titre' : 'E-mail' | trad,
                                        'value' : panier.CTC_MAIL,
                                        'pathValidator' : path('Ajax.validator.adresseMail'),
                                        'paramValidator' : "{'sizeMin' : '0', 'sizeMax' : '100'}",
                                        'option' : droit.GLOB_AuthModAdrLiv? '':'readOnly',
                                    }) }}
                                </div>

                            </div>   
                        </div>             

                    </div>

                </div>
            </form>
        </div>
    </div>
    
    <script>
        $('#input_LIV_CTR').change(function(){
            activeLoader();
            $.ajax({
                url: '{{ path('Panier.CentreLivraison.ajaxRefreshFiche') }}',
                type: 'POST',
                dataType: 'html',
                data : $('#form_ctcLivraison_panier').serialize(),
                success: function (htmlData) {
                    refreshFonction('divModTrans', htmlData);
                    refreshFonction('refreshDiv', htmlData);
                    desactiveLoader();
                    return true;
                }
            });	
        });

        $('#centreTab li').click(function(){
            if ($(this).attr('id') != 'onglet_DivModulableCreation') {
                $('#onglet_DivModulableCreation').hide();
                $('#onglet_DivModulableCreation a').html('');
                $('#DivModulableCreation').html('');
            }
        });

        function activeDivModulableCde(result, titre)
        {
            $('#onglet_DivModulable').show();
            $('#onglet_DivModulable').find('a').html(titre);
            $('#onglet_DivModulable').find('a').trigger('click');
            $('#DivModulable').html(result);
        }

        $("#iconeAdresse").click(function(){
            activeLoader();                                	
            $.ajax({
                    dataType : 'html',
                url: "{{ path('GlobalApplication.Adresses.ajaxListeAdresses', {'TYPE_ADRESSE' : 'CENTRE'}) }}",
                data: {'CODE' : $('#input_LIV_CTR').val(), 'divCode' : 'COD_ADR', 'idTrigger' : 'onglet_DivMain', 'idClose' : 'onglet_DivModulable', 'iDivReset' : 'DivModulable', 'idTriggerCreation' : 'onglet_DivModulableCreation', 'iDivAdd' : 'DivModulableCreation'},
                type: "POST",
                success: function(result){
                    activeDivModulableCde(result, "{{ 'Adresse centre' | trad  }}");
                    desactiveLoader();
                }
            });
        });

        $("#iconeContact").click(function(){
            activeLoader();                                	
            $.ajax({
                dataType : 'html',
                url: "{{ path('GlobalApplication.ContactsLivraison.ajaxListeContact') }}",
                data: {'CODE' : $('#input_LIV_CTR').val(), 'divCode' : 'CTC_IND', 'idTrigger' : 'onglet_DivMain', 'idClose' : 'onglet_DivModulable', 'iDivReset' : 'DivModulable', 'idTriggerCreation' : 'onglet_DivModulableCreation', 'iDivAdd' : 'DivModulableCreation'},
                type: "POST",
                success: function(result){
                    activeDivModulableCde(addFonctionAjax(result), "{{ 'Contact centre' | trad  }}");
                    desactiveLoader();
                }
            }); 
        });


        document.addEventListener('click',(event) => {
            var target = event.target;
            if (!(target instanceof HTMLElement) ) {
                return;
            }

            if (!target.hasAttribute('data-updateForm') ){
                return;
            }

            if ($(target).data('updateForm') == 'adresse') {
                $('#input_LIV_ADR').val($(target).data('adresse'));
                $('#input_LIV_VILLE').val($(target).data('ville'));
                $('#id="input_LIV_CP"').val($(target).data('cpostal'));
                $('#input_LIV_PAYS').val($(target).data('cpays'));
            } else if ($(target).data('updateForm') == 'contact') {
                $('#input_CTC_NOM').val($(target).data('nom'));
                $('#input_CTC_FCT').val($(target).data('fonction'));
                $('#input_CTC_TEL').val($(target).data('tel'));
                $('#input_CTC_FAX').val($(target).data('fax'));
                $('#input_CTC_GSM').val($(target).data('port'));
                $('#input_CTC_MAIL').val($(target).data('mail'));
            }

        });
    </script>
{% endblock %}