{% extends 'layout.twig' %}

{% block body %}

    <div class="contenu" id="panier">
    
        <h1>
            {{ 'Récapitulatif panier' | trad }} : {{ panier.lib_panier }}
            
            <button class="principal button" onClick="ajaxPopupV2('{{ path('Panier.Articles.addFraisvalidate', {'idBlocFrs':idBlocFrs}) }}', 'form_fraisannexes');">{{ 'Ajouter les frais annexes' |trad }}</button>
        </h1>

        {{ ariane() }}

        <div class="content">

            <form name="form_fraisannexes" id="form_fraisannexes">

                <h1>
                    {{ 'Ajouter des frais annexes' | trad }} : 
                </h1>

                <div class="bg_form padding_form border_form clearfix">
                    <div class="clearfix">
                        <div class="colonne2">
                            <div class="row">
                                {{ inputAdvance('zoomAdvance', {
                                    'titre' : 'Fournisseur' | trad,
                                    'name' : 'COD_FOURN',
                                    'pathConvert' : path('Ajax.outil.convertLibelle'),
                                    'convertLibelle' : 'convertLibelleGlobal',
                                    'entity' : 'Fourniss',
                                    'value' : article.COD_FOURN,
                                    'option' : 'readOnly',
                                }) }}
                            </div>
                            <div class="row">
                                {{ inputAdvance('SELECT', {
                                    'titre' : 'Libellé article' | trad,
                                    'name' : 'COD_ART',
                                    'value' : article.COD_ART,
                                    'listeValue' : listeFraisSelect,
                                }) }}
                            </div>
                        </div>

                        <div class="colonne2 last">
                            <div class="row">
                                {{ inputAdvance('TEXTAREA',{
                                    'titre' : 'Détail' | trad,
                                    'name' : 'DES_COMP',
                                    'value' : article.DES_COMP,
                                    'pathValidator' : path('Ajax.validator.isStringAvecEspace'),
                                    'paramsValidator' : "{'sizeMin' : 0, 'sizeMax' : 3000}",
                                }) }}
                            </div>
                        </div>
                    </div>

                    <hr>

                    <div class="clearfix">
                        <div class="colonne2">
                            <div class="row">
                                {{ inputAdvance('TEXT',{
                                    'titre' : 'Quantité' | trad,
                                    'name' : 'QTE',
                                    'value' : qteByUnite('0', article.COD_UNIT),
                                    'pathValidator' : path('Ajax.validator.float'),
                                    'paramsValidator' : "{'format' : "~getConst('formatQTE')~", 'min' : '"~(param.INTERDIRE_PX_QTE_NEG? '0':'')~"'}",
                                    'obligatoire' : true,
                                }) }}
                            </div>
                        </div>

                        <div class="colonne2 last">
                            <div class="row">
                                {{ inputAdvance('zoomAdvance', {
                                    'titre' : 'Unité' | trad,
                                    'name' : 'COD_UNIT',
                                    'pahtZoom' : path('Ajax.liste.unites'),
                                    'paramZoom' : "{'filtreArticle': $('#input_COD_ART').val()}",
                                    'pathConvert' : path('Ajax.outil.convertLibelle'),
                                    'convertLibelle' : 'convertLibelleGlobal',
                                    'pathValidator' : path('Ajax.validator.unite'),
                                    'paramsValidator' : "{'entity' : 'Unites','nomChamp' : '"~'Unité' | trad~"', 'null' : true}",
                                    'entity' : 'Unites',
                                    'titleZoom' : 'Liste des unités' | trad,
                                    'value' : article.COD_UNIT,
                                    'option' : 'readOnly',
                                }) }}
                            </div>
                        </div>
                    </div>

                    <hr>

                    <div class="clearfix">
                        <div class="colonne2">
                            <div class="row">
                                {{ inputAdvance('DEVISE',{
                                    'titre' : 'Prix unitaire' | trad,
                                    'name' : 'PX_ART',
                                    'value' : article.PX_ART | prixUnitaire,
                                    'pathValidator' : path('Ajax.validator.float'),
                                    'paramsValidator' : "{'format' : "~getConst('formatPU')~", 'min' : '"~(param.INTERDIRE_PX_QTE_NEG? '0':'')~"'}",
                                    'DEVISE': devise,
                                    'option' : table=='CAT'? 'readOnly':article.optionPX_ART,
                                }) }}
                            </div>
                        </div>
                    </div>

                    <div class="clearfix">
                        <div class="colonne2">
                            <div class="row" style="{% if param.AFFTVA == false %}display:none;{% endif %}">
                                {{ inputAdvance('zoomAdvance', {
                                    'titre' : 'Taux Tva' | trad,
                                    'name' : 'TAUX_TVA',
                                    'pahtZoom' : path('Ajax.liste.TVA'),
                                    'pathConvert' : path('Ajax.outil.convertLibelle'),
                                    'convertLibelle' : 'convertLibelleGlobal',
                                    'pathValidator' : path('Ajax.validator.zoom'),
                                    'paramsValidator' : "{'entity' : 'TVA','nomChamp' : '"~'Taux Tva' | trad |e('js')|raw~"', 'null' : true}",
                                    'entity' : 'TVA',
                                    'titleZoom' : 'Liste des tva' | trad,
                                    'value' : (article.TAUX_TVA??'0') | tva,
                                }) }}
                            </div>
                        </div>
                        <div class="colonne2 last">
                            <div class="row" style="{% if param.TTC == false %}display:none;{% endif %}">
                                {{ inputAdvance('DEVISE',{
                                    'titre' : 'Prix unitaire TTC' | trad,
                                    'name' : 'PX_ART_TTC',
                                    'value' : article.PX_ART_TTC | prixUnitaire,
                                    'pathValidator' : path('Ajax.validator.float'),
                                    'paramsValidator' : "{'format' : "~getConst('formatPU')~"}",
                                    'DEVISE': devise,
                                    'option' : 'readOnly',
                                }) }}
                            </div>
                        </div>
                    </div>
                    <div class="clearfix">
                        <div class="colonne2">
                            <div class="row">
                                {{ inputAdvance('DEVISE',{
                                    'titre' : 'Montant total de la ligne' | trad,
                                    'name' : 'montantTotalLigne',
                                    'value' : (article.montantTotalLigne??0) | tva,
                                    'pathValidator' : path('Ajax.validator.float'),
                                    'paramsValidator' : "{'format' : "~getConst('formatMontant')~"}",
                                    'option' : 'readOnly',
                                    'DEVISE': devise,
                                }) }}
                            </div>
                        </div>
                    </div>
                    <div class="clearfix" {% if param.MASQUER_BUDGET_SAISIE_LIGNE %}style="display:none;"{% endif %}>
                        <div class="colonne2">
                            <div class="row">
                                {{ inputAdvance('DEVISE',{
                                    'titre' : 'Budget unitaire' | trad,
                                    'name' : 'budgetUnitaire',
                                    'value' : (article.budgetUnitaire??0) | tva,
                                    'pathValidator' : path('Ajax.validator.float'),
                                    'paramsValidator' : "{'format' : "~getConst('formatMontant')~"}",
                                    'DEVISE' : infoPanierEntete.COD_DEV,
                                }) }}
                            </div>
                        </div>
                        <div class="colonne2 last">
                            <div class="row">
                                {{ inputAdvance('DEVISE',{
                                    'titre' : 'Budget total' | trad,
                                    'name' : 'budget_total',
                                    'value' : (article.budget_total??0) | tva,
                                    'pathValidator' : path('Ajax.validator.float'),
                                    'paramsValidator' : "{'format' : "~getConst('formatMontant')~"}",
                                    'DEVISE' : infoPanierEntete.COD_DEV,
                                }) }}
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <script>
        var arrayListeArt = '{{ listeFrais |raw }}';

        $('#input_COD_ART').change(function() {
            var valueInput = $(this).val();
            arr = $.parseJSON(arrayListeArt); //convert to javascript array
            $.each(arr,function(key,value){
                if (key == valueInput) {
                    console.log(value);
                    $('#text_COD_UNIT').val(value.UNIT).change();
                    return;
                }
            });
        });

        $('#input_PX_ART, #input_TAUX_TVA, #input_QTE').change(function(){
            var prixUnitaire = parseFloat($('#input_PX_ART').val().replace(/\s/g, ''));
            var qte = parseFloat($('#input_QTE').val().replace(/\s/g, ''));

            {% if param.TTC == true %}
                var tva = parseFloat($('#input_TAUX_TVA').val().replace(/\s/g, ''));
            {% else %}
                var tva = 0;
            {% endif %}

            if($('#input_PX_ART_TTC').length) {
                var prixUnitaire = (prixUnitaire) * (1 + tva/100);
                $('#input_PX_ART_TTC').val(prixUnitaire.toFixed('{{ getConst('PUDECIMAL') }}'));
            }

            if (qte) {
                var montant = prixUnitaire * qte;
                $('#input_montantTotalLigne').val(montant.toFixed(2));
            }
        });

        $('#input_budgetUnitaire, #input_budget_total ,#input_QTE ').change(function(){
            var qte = parseFloat($('#input_QTE').val().replace(/\s/g, ''));
            var budgetUnitaire = parseFloat($('#input_budgetUnitaire').val().replace(/\s/g, ''));
            var budgetTotal = parseFloat($('#input_budget_total').val().replace(/\s/g, ''));

            if ($(this).attr('id') == 'input_budgetUnitaire') {
                budgetTotal = budgetUnitaire * qte;
            } else if ($(this).attr('id') == 'input_budget_total') {
                budgetUnitaire = budgetTotal / qte;
            } else {
                budgetTotal = budgetUnitaire * qte;
            }

            $('#input_budgetUnitaire').val(budgetUnitaire);
            $('#input_budget_total').val(budgetTotal);
        });
    </script>
{% endblock %}