{% extends 'base.html.twig' %}

{% block body %}

    <h1 class="page-header">
    Récupération Commande Client Dolibarr
    </h1>
    
    <a class="btn btn-secondary" href={{ path('app_offer') }}>Annuler</a>

    <br><br>
    <div class="card">
        <div class="card-header">
            <i class="fa fa-pencil-alt fa-fw"></i> Informations
        </div>

        <div class="card-body">
            <div class="form-group ">
                <label class="control-label required" for="id">ID Proposition<span class="mandatory">*</span></label>
                <input type="text" id="ref" name="ref" required="required" class=" form-control" value="CO2311-0222">
                <button id="search" class="btn btn-success mt-1" style="width:100%">Rechercher</span>
            </div>
        </div>
    </div>

    <div id="card-propal" class="card mt-3" style="display:none">
        <div class="card-header">
            <i class="fa fa-pencil-alt fa-fw"></i> Lignes propositions
        </div>

        <div class="card-body" id="propal">

        </div>
    </div>

    <div id="card-offer" class="card mt-3 mb-3" style="display:none">
        <div class="card-header">
            <i class="fa fa-pencil-alt fa-fw"></i> Importer dans Schedule
        </div>

        <div class="card-body" id="propal">
            {{ form_start(form) }}
                {{ form_row(form.name) }}
                {{ form_row(form.project) }}
                {{ form_widget(form.submit) }} 
            {{ form_end(form) }}
        </div>
    </div>

{% endblock %}

{% block localjavascript %}
    $("#search").click(function() {
        console.log("search propositions = "+$("#ref").val());

        $.ajax({
            type: "POST",
            data: {
                ref: $("#ref").val(),
            },
            url: "{{ path('app_offer_getdolibarr') }}",
            success: function (datas) {
                console.log(datas);
                console.log("-----------");
                if(datas.error||Object.keys(datas).length === 0) {
                    $("#propal").html("");
                    $("#card-propal").hide();
                    $("#card-offer").hide();
                }
                else {
                    html ="<h3>"+$("#ref").val()+"</h3>";
                    if(datas.note_public) html+="<strong>Note public</strong><br><small style='display: block;line-height: 14px;'>"+datas.note_public.replace(/(\r\n|\r|\n)/g, '<br>')+"</small><br><br>";
                    if(datas.note_private) html+="<strong>Note privée</strong><br><small style='display: block;line-height: 14px;'>"+datas.note_private.replace(/(\r\n|\r|\n)/g, '<br>')+"</small><br><br>";

                    tbtask={};
                    datas.lines.forEach(function(line){
                        console.log(line);
                        if(!tbtask[line.product_ref]) tbtask[line.product_ref]={idoffer:"", idline: "", ref: "", label: "", qty: 0, price:0 };

                        tbtask[line.product_ref]["idoffer"]=$("#ref").val();
                        tbtask[line.product_ref]["idline"]=line.id;
                        tbtask[line.product_ref]["ref"]=line.product_ref;
                        tbtask[line.product_ref]["label"]=line.product_label;
                        tbtask[line.product_ref]["qty"]=parseInt(line.qty)+tbtask[line.product_ref]["qty"];
                        tbtask[line.product_ref]["price"]=parseInt(line.price);
                        
                    });
                    
                    html+="<table style='width:100%;'>";
                    html+="<thead><tr>";
                    html+="<th>Ref</th>";
                    html+="<th>Designation</th>";
                    html+="<th>Qte</th>";
                    html+="<th>PU</th>";
                    html+="<th>Total</th>";
                    html+="</tr></thead>";
                    Object.values(tbtask).forEach(task => {
                        html+="<tr>";
                        html+="<td>"+task.ref+"</td>";
                        html+="<td>"+task.label+"</td>";
                        html+="<td>"+task.qty+"</td>";
                        html+="<td>"+task.price+"</td>";
                        html+="<td>"+(task.qty*task.price)+"</td>";
                        html+="</tr>";
                    });
                    html+="</table>";
                    $("#propal").html(html);

                    $("#card-propal").show();
                    $("#card-offer").show();
                    $("#offerdolibarr_tasks").val(JSON.stringify(tbtask));
                }
            }
        });        
    });
{% endblock %}