{% extends 'layout.twig' %}

{% block body %}    
    <div class="contenu" id="validation_panier">
        <h1>
            <a class="button secondaire"  href="{{ path('Panier.Panier.index') }}">{{ 'Retour au panier' | trad }}</a>

            

            {% if panier.id_panier == 0 %}
                {% include '@Panier/General/steBarPanier.twig' with {
                    step :2
                } only %}
            {% endif %}

            {% if bloquant == false %}
                <button class="button principal btn_submit" type="button" onClick="validerPanier();">{{ 'Valider le panier' | trad }}</button>
            {% endif %}
            <button class="button principal btn_Rafraichir" style="display:none;" type="button" onClick="soumission();">{{ 'Rafraîchir' | trad }}</button>
            
        </h1>

        {{ ariane() }}

        <div style="display:flex;margin-top: 20px;">
            <div class="listeDocument">
                <form name="form_validation_final" id="form_validation_final">
                    {% for doc in panierXml.ListCdes.Cde %}
                        {% include '@Panier/Validation/_document.twig' with {
                                typeDoc : CDE
                            } 
                        %}
                    {% endfor %}

                    {% for doc in panierXml.DA %}
                        {% include '@Panier/Validation/_document.twig' with {
                                typeDoc : DA
                            } 
                        %}
                    {% endfor %}

                    {% for doc in panierXml.Stock %}
                        {% include '@Panier/Validation/_document.twig' with {
                                typeDoc : DS
                            } 
                        %}
                    {% endfor %}
                </form>
            </div>
            
            <div class="div-budget">
                <div id="ComplEntete" style="margin-bottom:10px;">
                    <div class="bg_form noborder">
                        <span class="titre">
                            {{ 'Total panier' | trad }}
                        </span>
                        <span class="montant">
                            <div style="display:flex">
                                <div id="montantPanier" style="margin-right:3px">
                                    {{ parametrage.AFFTTC? panierXml.MontantTtc:panierXml.Montant }}
                                </div>
                                {{ panierXml.Devise }}
                            </div>
                        </span>
                    </div>
                </div>
                {% include '@GlobalApplication/ConsoBudgetaire/index.twig' with {
                    listeBudget: panierXml.listeConsoBudget.ConsoBudget,
                    direction: 'column',
                    size : 250
                } only %}
            </div>
            
        
        </div>
        <div class="bs-flex flex-x-end">
            {{ specifique('HtmlExtension', 'btnDemandeDelais', {'Demande de délais' : 'Demande de délais'|trad}) }}
            {% if bloquant == false %}
                <button style="margin-left:auto;" class="button principal btn_submit" type="button" onClick="validerPanier();">{{ 'Valider le panier' | trad }}</button>
            {% endif %}
            <button class="button principal btn_Rafraichir" style="display:none;margin-left:auto;" type="button" onClick="soumission();">{{ 'Rafraîchir' | trad }}</button>
        </div>
    </div>


    <script>
        function validerPanier()
        {
            activeLoader();
            $.ajax({
                url: '{{ path('Panier.validationPanier.validationFinal') }}',
                type: 'POST',
                dataType: 'html',
                data: $('#form_validation_final').serialize(),
                success: function (data) {
                    var data = jQuery.parseJSON(data);
                    asyncPanier(data.path);
                },
                error: function (data){
                    desactiveLoader();
                    $("#modal-content").addClass("modal_small");
                    $("#modal-body").html(data.responseText);
                    $("#modal-title").html('{{ 'Erreur' | trad }}');

                    activePopup();
                }
            });
        }

        function soumission()
        {
            //ajaxPopupV2('{{ path('Panier.validationPanier.refreshValidation') }}', 'form_validation_final', '{{ 'Rafraîchir' |trad }}');

            activeLoader();
            $.ajax({
                url: '{{ path('Panier.validationPanier.refreshValidation') }}',
                type: 'POST',
                dataType: 'html',
                data: $('#form_validation_final').serialize(),
                success: function (data) {
                    var data = jQuery.parseJSON(data);
                    asyncPanier(data.path);
                },
                error: function (data){
                    desactiveLoader();
                    $("#modal-content").addClass("modal_small");
                    $("#modal-body").html(data.responseText);
                    $("#modal-title").html('{{ 'Erreur' | trad }}');

                    activePopup();
                }
            });
        }

        document.addEventListener('click',(event) => {
            var target = event.target;

            if (!(target instanceof HTMLElement) ) {
                return;
            }
            
            if (!$(target).data('passda-bloc') && !$(target).data('passda-link')) {
                return;
            }

            if ($(target).data('passda-type') == 'CDE') {
                var textType = '{{ 'CDE' |trad }}';
                var globalTextTooltip = '{{ 'Basculer en CDE' | trad }}';
            } else {
                var textType = '{{ 'STOCK' |trad }}';
                var globalTextTooltip = '{{ 'Basculer en STOCK' | trad }}';
            }

            
            if ($(target).data('passda-bloc')) {
                var idbloc = $(target).data('passda-bloc');
                if ($('#inputDoc'+idbloc).val()) {
                    var text = textType;
                    var valueInput = '';
                    var textTooltip = '{{ 'Basculer en DA' | trad }}';
                } else {
                    var text = '{{ 'DA' |trad }}';
                    var valueInput = '1';
                    var textTooltip = globalTextTooltip;
                }

                $('.libDoc'+idbloc).html(text);
                $('.inputDoc'+idbloc).val(valueInput);
                $('[data-passda-link|='+idbloc+']').find("span").html(textTooltip);
                $('[data-passda-bloc|='+idbloc+']').find("span").html(textTooltip);
            } else {
                var idbloc = $(target).data('passda-link');
                var ligne = $(target).data('passda-ligne');

                if ($('.inputDoc'+ligne).val()) {
                    var text = textType;
                    var input = '';
                    var textTooltip = '{{ 'Basculer en DA' | trad }}';
                } else {
                    var text = '{{ 'DA' |trad }}';
                    var input = '1';
                    var textTooltip = globalTextTooltip;
                }

                $('.libDoc'+ligne).html(text);
                $('.inputDoc'+ligne).val(input);
                $('[data-passda-ligne|='+ligne+']').find("span").html(textTooltip);

                var majEntet = true;
                $('[data-passda-link|='+idbloc+']').each(function(){
                    var inputValue = $('.inputDoc'+$(this).data('passda-ligne')).val();
                    if (inputValue != input) {
                        majEntet = false;
                    }
                });

                if (majEntet) {
                    $('#libDoc'+idbloc).html(text);
                    $('#inputDoc'+idbloc).val(input);
                    $('[data-passda-bloc|='+idbloc+']').find("span").html(textTooltip);
                }
            }

            var rafraichir = false;
            $('.allInputDoc').each(function(){
                if ($(this).val() != '') {
                    rafraichir = true;
                }
            });

            if (rafraichir) {
                $('.btn_Rafraichir').show();
                $('.btn_submit').hide();
            } else {
                $('.btn_Rafraichir').hide();
                $('.btn_submit').show();
            }
        });

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

            if (!$(event.target).data('updatevalue-std')) {
                return;
            }

            $(target).data('oldvalue', $(target).val());

            if ($(event.target).hasClass('zoom')) {
                $(target).select();
            }
        });

        document.addEventListener('change',(event) => {
            var target = event.target;

            if (!(target instanceof HTMLElement) ) {
                return;
            }

            if (!$(target).data('updatevalue-std')) {
                return;
            }

            var fieldName = $(target).attr('name');
            var path = $(target).data('updatevalue-std');

            if ($(target).attr('type') == 'checkbox') {
                var value = $(target).is(':checked');
            } else {
                var value = $(target).val();
            }

            var dataPost = {
                'field' : fieldName,
                'value' : value,
            };

            $.each($(target).data(), function(key, value) {
                if (key.indexOf("updatevalue") === 0 && key != 'updatevalueStd') {
                    dataPost[key.replace('updatevalue', '')] = value;
                }
            });
            
            activeLoader();
            $.ajax({
                dataType: 'json',
                url: path,
                data: dataPost,
                type: "POST",
                success: function(content){
                    if (content.statut == 'O') {
                        changeValueInput(target);

                        //changer la value d'autre input lié (surtout pour les imputations)
                        if (content.listeUpdate) {
                            $.each(content.listeUpdate, function(key, value) {
                                $('#'+key).val(value);
                                changeValueInput('#'+key);
                            });
                        }
                        
                        desactiveLoader();
                    } else {
                        desactiveLoader();
                        $(target).val($(target).data('oldvalue'));

                        $("#modal-content").addClass("modal_small");
                        $("#modal-body").html(content.content);
                        $("#modal-title").html(content.title);

                        activePopup();
                    }
                }
            });
        });

        function changeValueInput(target)
        {
            if ($(target).data('autocomplete')) {
                var textInput = $(target).attr('id');
                var idInput = textInput.replace('text_', 'input_');

                ConvertLibelle(
                    '{{ path('Ajax.outil.convertLibelle') }}', 
                    target,
                    $(target).data('autocomplete'), 
                    '', 
                    '',
                    idInput,
                    textInput,
                );
            } else if($(target).data('cglink')) {
                var textInput = $(target).attr('id');
                var idInput = textInput.replace('text_', 'input_');

                convertLibelleCodeGestion(
                    '{{ path('Ajax.outil.convertLibelleCodeGestion') }}', 
                    target,
                    'CODE_GES', 
                    'CODE_AFF',
                    idInput,
                    textInput,
                    $(target).data('ste'),
                    '1',
                    '',
                    $(target).data('si'),
                );
            }
        }

    </script>
{% endblock %}