<div class="accordion mt-3" id="accordionDatosServicios">
    <div class="card accordion-item active">
        <h2 class="accordion-header" id="headingOne">
            <button type="button" class="accordion-button" data-bs-toggle="collapse"
                    data-bs-target="#accordionDatosServiciosTip" aria-expanded="false"
                    aria-controls="accordionDatosServiciosTip">
                <h4><?= lang("Presupuestos.datosServicios") ?></h4>
            </button>
        </h2>

        <div id="accordionDatosServiciosTip" class="accordion-collapse collapse show"
             data-bs-parent="#accordionDatosServicios">
            <div class="accordion-body">
                <div class="row">
                    <div class="col-md-12 col-lg-4 py-4">
                        <button id="serv_default" type="button" class="btn btn-secondary waves-effect waves-light float-start"><?= lang("Presupuestos.serviciosDefault")?></button>
                    </div>
                </div>
                <div class="nav-align-top mb-4">
                    <ul class="nav nav-pills mb-3 nav-servicios" role="tablist">
                        <li class="nav-item">
                            <button
                                    type="button"
                                    class="nav-link active"
                                    role="tab"
                                    data-bs-toggle="tab"
                                    data-bs-target="#servicios-acabado"
                                    aria-controls="servicios-acabado"
                                    aria-selected="true">
                                <?= lang("Presupuestos.servicioAcabado") ?>
                            </button>
                        </li>
                        <li class="nav-item">
                            <button
                                    type="button"
                                    class="nav-link"
                                    role="tab"
                                    data-bs-toggle="tab"
                                    data-bs-target="#servicios-preimpresion"
                                    aria-controls="servicios-preimpresion"
                                    aria-selected="false">
                                <?= lang("Presupuestos.servicioPreimpresion") ?>
                            </button>
                        </li>
                        <li class="nav-item">
                            <button
                                    type="button"
                                    class="nav-link"
                                    role="tab"
                                    data-bs-toggle="tab"
                                    data-bs-target="#servicios-encuadernacion"
                                    aria-controls="servicios-encuadernacion"
                                    aria-selected="false">
                                <?= lang("Presupuestos.servicioEncuadernado") ?>
                            </button>
                        </li>
                        <li class="nav-item">
                            <button
                                    type="button"
                                    class="nav-link"
                                    role="tab"
                                    data-bs-toggle="tab"
                                    data-bs-target="#servicios-manipulado"
                                    aria-controls="servicios-manipulado"
                                    aria-selected="false">
                                <?= lang("Presupuestos.servicioManipulado") ?>
                            </button>
                        </li>
                    </ul>
                    <div class="tab-content">
                        <div class="tab-pane fade show active" id="servicios-acabado" role="tabpanel">
                            <div id="serv-acabado-alert">
                            </div>
                            <div id="serv-acabado-error">
                            </div>
                            <table id="tableOfServiciosAcabado" class="table table-striped table-hover" style="width: 100%;">
                                <thead>
                                <tr>
                                    <th><?= lang('Presupuestos.id') ?></th>
                                    <th><?= lang('Tarifaacabado.tarifaacabado') ?></th>
                                    <th><?= lang('Presupuestos.precioUnidad') ?></th>
                                    <th><?= lang('Presupuestos.precioTotal') ?></th>
                                    <th></th>
                                    <th class="text-nowrap"><?= lang('Basic.global.Action') ?></th>
                                </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                            <div class="row mb-3 px-4">
                                <div class="col-md-12 col-lg-4 py-4">
                                    <select id="add_servicio_acabado_list" class="select2bs2" style="width: 100%;">
                                        <option></option>
                                        <?php foreach ($serviciosAcabado as $item) : ?>
                                            <option value="<?= $item->value ?>" >
                                                <?= $item->label ?>
                                            </option>
                                        <?php endforeach; ?>
                                    </select>
                                </div>
                                <div class="col-md-12 col-lg-4 px-2 py-4">
                                    <button id="insertar_serv_acabado" type="button" class="btn btn-secondary waves-effect waves-light float-start"><?= lang("Presupuestos.insertar")?></button>
                                </div>
                                
                            </div>
                        </div>


                        <div class="tab-pane fade" id="servicios-preimpresion" role="tabpanel">
                            <div id="serv-preimpresion-alert">
                            </div>
                            <div id="serv-preimpresion-error">
                            </div>
                            <table id="tableOfServiciosPreimpresion" class="table table-striped table-hover" style="width: 100%;">
                                <thead>
                                <tr>
                                    <th><?= lang('Presupuestos.id') ?></th>
                                    <th><?= lang('Tarifapreimpresion.tarifapreimpresion') ?></th>
                                    <th><?= lang('Presupuestos.precio') ?></th>
                                    <th></th>
                                    <th class="text-nowrap"><?= lang('Basic.global.Action') ?></th>
                                </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                            <div class="row mb-3 px-4">
                                <div class="col-md-12 col-lg-4 py-4">
                                    <select id="add_servicio_preimpresion_list" class="select2bs2" style="width: 100%;">
                                        <option></option>
                                        <?php foreach ($serviciosPreimpresion as $item) : ?>
                                            <option value="<?= $item->value ?>" >
                                                <?= $item->label ?>
                                            </option>
                                        <?php endforeach; ?>
                                    </select>
                                </div>
                                <div class="col-md-12 col-lg-4 px-2 py-4">
                                    <button id="insertar_serv_preimpresion" type="button" class="btn btn-secondary waves-effect waves-light float-start"><?= lang("Presupuestos.insertar")?></button>
                                </div>
                                
                            </div>
                        </div>

                        <div class="tab-pane fade" id="servicios-encuadernacion" role="tabpanel">
                            <div id="serv-enc-alert">
                            </div>
                            <div id="serv-enc-error">
                            </div>
                            
                            <table id="tableOfServiciosEncuadernacion" class="table dt-responsive dataTable" style="width: 100%;">
                                <thead>
                                <tr>
                                    <th><?= lang('Presupuestos.id') ?></th>
                                    <th><?= lang('Presupuestos.tarifa') ?></th>
                                    <th><?= lang('Proveedores.proveedor') ?></th>
                                    <th><?= lang('Presupuestos.precioUnidad') ?></th>
                                    <th><?= lang('Presupuestos.precioTotal') ?></th>
                                    <th></th>
                                    <th class="text-nowrap"><?= lang('Basic.global.Action') ?></th>
                                </tr>
                                </thead>
                                <tbody>
                                                                
                                </tbody>
                            </table>
                            <div class="row mb-3 px-4">
                                <div class="col-md-12 col-lg-4 py-4">
                                    <select id="add_servicio_enc_list" class="select2bs2" style="width: 100%;">
                                        <option></option>
                                        <?php foreach ($serviciosEncuadernacion as $item) : ?>
                                            <option value="<?= $item->value ?>" >
                                                <?= $item->label ?>
                                            </option>
                                        <?php endforeach; ?>
                                    </select>
                                </div>
                                <div class="col-md-12 col-lg-4 px-2 py-4">
                                    <button id="insertar_serv_enc" type="button" class="btn btn-secondary waves-effect waves-light float-start"><?= lang("Presupuestos.insertar")?></button>
                                </div>
                                
                            </div>
                            
                        </div>

                        <div class="tab-pane fade" id="servicios-manipulado" role="tabpanel">
                            <div id="serv-manipulado-alert">
                            </div>
                            <div id="serv-manipulado-error">
                            </div>
                            <table id="tableOfServiciosManipulado" class="table table-striped table-hover" style="width: 100%;">
                                <thead>
                                <tr>
                                    <th><?= lang('Presupuestos.id') ?></th>
                                    <th><?= lang('Tarifamanipulado.tarifamanipulado') ?></th>
                                    <th><?= lang('Presupuestos.precioUnidad') ?></th>
                                    <th><?= lang('Presupuestos.precioTotal') ?></th>
                                    <th></th>
                                    <th class="text-nowrap"><?= lang('Basic.global.Action') ?></th>
                                </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                            <div class="row mb-3 px-4">
                                <div class="col-md-12 col-lg-4 py-4">
                                    <select id="add_servicio_manipulado_list" class="select2bs2" style="width: 100%;">
                                        <option></option>
                                        <?php foreach ($serviciosManipulado as $item) : ?>
                                            <option value="<?= $item->value ?>" >
                                                <?= $item->label ?>
                                            </option>
                                        <?php endforeach; ?>
                                    </select>
                                </div>
                                <div class="col-md-12 col-lg-4 px-2 py-4">
                                    <button id="insertar_serv_manipulado" type="button" class="btn btn-secondary waves-effect waves-light float-start"><?= lang("Presupuestos.insertar")?></button>
                                </div>
                                
                            </div>
                        </div>


                    </div>
                </div>
            </div> <!-- //.accordion-body -->
        </div> <!-- //.accordion-collapse -->
    </div> <!-- //.accordion-item -->
</div> <!-- //.accordion -->



<?= $this->section("additionalInlineJs") ?>

    const url = window.location.href;
    const url_parts = url.split('/');
    if(url_parts[url_parts.length-2] == 'edit'){
        id = url_parts[url_parts.length-1];
    }
    else{
        id=-1
    }

    $('.nav-servicios button').on('shown.bs.tab', function(){
        $("#tableOfServiciosEncuadernacion").DataTable().columns.adjust();
        $("#tableOfServiciosPreimpresion").DataTable().columns.adjust();
        $("#tableOfServiciosManipulado").DataTable().columns.adjust();
        $("#tableOfServiciosAcabado").DataTable().columns.adjust();
    })

  
    $('#serv_default').on('click', function(){
        get_tarifas_enc('default').then(
            get_tarifas_manipulado('default')
        )
    })

    // Delete row
    $(document).on('click', '.btn-delete-serv', function(e) {
        const dataId = $(this).attr('data-id');
        const rowId = $(this).closest('td').parent()[0].sectionRowIndex;
        
        var table = "";
        if($(this).closest('table').attr('id').includes('tableOfServiciosEncuadernacion')){
            table = "tableOfServiciosEncuadernacion";
        }
        else if($(this).closest('table').attr('id').includes('tableOfServiciosAcabado')){
            table = "tableOfServiciosAcabado";
        }
        else if($(this).closest('table').attr('id').includes('tableOfServiciosManipulado')){
            table = "tableOfServiciosManipulado";
        }
        else if($(this).closest('table').attr('id').includes('tableOfServiciosPreimpresion')){
            table = "tableOfServiciosPreimpresion";
        }
        else{
            table = "";
        }

        if(table != ""){
            $('#' + table).DataTable().rows( function ( idx, data, node ) {
                return data[0] === dataId;
                    } )
                .remove()
                .draw();
        }

        check_serv_enc_error()
        check_serv_acabado_error()
        check_serv_preimpresion_error()
        check_serv_manipulado_error()
    
    });

    function save_servicios(){
        
        var datosAcabado = get_datos_acabado()
        var datosEnc = get_datos_encuadernacion()
        var datosManipulado = get_datos_manipulado()
        var datosPreimpresion = get_datos_preimpresion()

        const domain = window.location.origin

        fetch(domain + "/presupuestos/presupuestoencuadernaciones/edit/" + id , {
            method: "POST",
            body: JSON.stringify({
                datos: datosEnc,
                <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
            }),
            headers: {
                "Content-type": "application/json; charset=UTF-8"
            }
        })
        .then(response => response.json())
        .then(data => {
            yeniden(data.<?= csrf_token() ?>);
        })
            .then(
                fetch(domain + "/presupuestos/presupuestomanipulados/edit/" + id , {
                    method: "POST",
                    body: JSON.stringify({
                        datos: datosManipulado,
                        <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
                    }),
                    headers: {
                        "Content-type": "application/json; charset=UTF-8"
                    }
                })
                .then(response => response.json())
                .then(data => {
                    yeniden(data.<?= csrf_token() ?>);
                })   
            )
                .then(
                    fetch(domain + "/presupuestos/presupuestoacabados/edit/" + id , {
                        method: "POST",
                        body: JSON.stringify({
                            datos: datosAcabado,
                            <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
                        }),
                        headers: {
                            "Content-type": "application/json; charset=UTF-8"
                        }
                    })
                    .then(response => response.json())
                    .then(data => {
                        yeniden(data.<?= csrf_token() ?>);
                    })   
                )
                    .then(
                    fetch(domain + "/presupuestos/presupuestopreimpresiones/edit/" + id , {
                        method: "POST",
                        body: JSON.stringify({
                            datos: datosPreimpresion,
                            <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
                        }),
                        headers: {
                            "Content-type": "application/json; charset=UTF-8"
                        }
                    })
                    .then(response => response.json())
                    .then(data => {
                        yeniden(data.<?= csrf_token() ?>);
                    })   
                )
    }

    function update_servicios(update_preimpresion=false){
        const domain = window.location.origin
        const dimension = getDimensionLibro();

        if(parseInt($('#tirada').val())>0){
            var tirada = parseInt($('#tirada').val())
        }
        else{
            var tirada = 0
        }
        var paginas = parseInt($('#paginas').val())>0?parseInt($('#paginas').val()):0

        var datosAcabado = get_datos_acabado()
        var datosEnc = get_datos_encuadernacion()
        var datosManipulado = get_datos_manipulado()
        if(update_preimpresion)
            var datosPreimpresion = get_datos_preimpresion()

        fetch(domain + "/presupuestos/presupuestoacabados/update/" + id , {
            method: "POST",
            body: JSON.stringify({
                datos: datosAcabado,
                tirada: tirada,
                POD: <?php echo $POD; ?>,
                <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
            }),
            headers: {
                "Content-type": "application/json; charset=UTF-8"
            }
        })
        .then(response => response.json())
        .then(data => {
            data.lines.forEach((line) => {
                $('#precio_unidad_acabado_' + line[0].tarifa_id).text(parseFloat(line[0].precio_unidad).toFixed(2))
                $('#precio_total_acabado_' + line[0].tarifa_id).val(parseFloat(line[0].total).toFixed(2))
                $('#acabado_margen_' + line[0].tarifa_id).text(parseFloat(line[0].margen).toFixed(2))
            });
            check_serv_acabado_error()
            yeniden(data.<?= csrf_token() ?>);
        }).then(
            fetch(domain + "/presupuestos/presupuestoencuadernaciones/update/" + id , {
                method: "POST",
                body: JSON.stringify({
                    datos: datosEnc,
                    tirada: tirada,
                    paginas: paginas,
                    ancho: dimension.ancho,
                    alto: dimension.alto,
                    POD: <?php echo $POD; ?>,
                    <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
                }),
                headers: {
                    "Content-type": "application/json; charset=UTF-8"
                }
            })
            .then(response => response.json())
            .then(data => {
                data.lines.forEach((line) => {
                
                    $('#proveedor_enc_' + line[0].tarifa_id).off('change')
                    if(line[0].hasOwnProperty('proveedor_id')){
                        $('#proveedor_enc_' + line[0].tarifa_id)
                            .append('<option selected="selected" value="' + line[0].proveedor_id + '">' + line[0].proveedor + '</option>')
                    }
                    else{
                        $('#proveedor_enc_' + line[0].tarifa_id).empty()
                            .append('<option selected="selected" value="' + line[0].proveedor_id + '">' + '<?= lang("Presupuestos.no_disponible") ?>' + '</option>')
                    }
                    $('#precio_unidad_encuadernado_' + line[0].tarifa_id).text(parseFloat(line[0].precio_unidad).toFixed(2))
                    $('#precio_total_encuadernado_' + line[0].tarifa_id).val(parseFloat(line[0].total).toFixed(2))
                    $('#enc_margen_' + line[0].tarifa_id).val(parseFloat(line[0].margen).toFixed(2))
                    $('#proveedor_enc_' + line[0].tarifa_id).on('change', proveedor_enc_event)
                });
                check_serv_enc_error()
                yeniden(data.<?= csrf_token() ?>);
            }).then(
                fetch(domain + "/presupuestos/presupuestomanipulados/update/" + id , {
                    method: "POST",
                    body: JSON.stringify({
                        datos: datosManipulado,
                        tirada: tirada,
                        POD: <?php echo $POD; ?>,
                        <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
                    }),
                    headers: {
                        "Content-type": "application/json; charset=UTF-8"
                    }
                })
                .then(response => response.json())
                .then(data => {
                    data.lines.forEach((line) => {
                        $('#precio_unidad_manipulado_' + line[0].tarifa_id).text(parseFloat(line[0].precio_unidad).toFixed(2))
                        $('#precio_total_manipulado_' + line[0].tarifa_id).val(parseFloat(line[0].total).toFixed(2))
                        $('#manipulado_margen_' + line[0].tarifa_id).val(parseFloat(line[0].margen).toFixed(2))
                    });
                    check_serv_manipulado_error()
                    yeniden(data.<?= csrf_token() ?>);
                }).then(function(){
                        if(update_preimpresion){
                            fetch(domain + "/presupuestos/presupuestopreimpresiones/update/" + id , {
                                method: "POST",
                                body: JSON.stringify({
                                    datos: datosPreimpresion,
                                    <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
                                }),
                                headers: {
                                    "Content-type": "application/json; charset=UTF-8"
                                }
                            })
                            .then(response => response.json())
                            .then(data => {
                            
                                data.lines.forEach((line) => {
                                    $('#precio_preimpresion_' + line[0].tarifa_id).val(parseFloat(line[0].total).toFixed(2))
                                    $('#preimpresion_margen_' + line[0].tarifa_id).val(parseFloat(line[0].margen).toFixed(2))
                                });
                                check_serv_preimpresion_error()
                                yeniden(data.<?= csrf_token() ?>);
                            })
                        }
                    })   
                )
        )
        
    }

<?= $this->endSection() ?>

<!------------------------------------------------------->
<!-- Código JS comportamiento tabla servicios acabado. -->
<!------------------------------------------------------->
<?= $this->section("additionalInlineJs") ?>

    // Generación de la lista de servicios de acabado (id, nombre)
    const acabadosList = <?php echo json_encode($serviciosAcabado); ?>;
    
    var tableServiciosAcabado = new DataTable('#tableOfServiciosAcabado',{
        scrollX: true,
        searching: false,
        paging: false,
        info: false,
        ordering: false,
        responsive: true,
        select: false,
        language: {
            url: "//cdn.datatables.net/plug-ins/1.13.4/i18n/<?= config('Basics')->i18n ?>.json"
        },
        "drawCallback": function(settings ) {
            updateTotales(false, true, false)
        }
    });

    function init_servicio_acabado(){
        const serviciosacabadosList = <?php echo json_encode($serviciosAcabadosList); ?>;    

        $('#add_servicio_acabado_list').select2({
                allowClear: false,
                minimumResultsForSearch: -1,
                placeholder: '<?= lang("Presupuestos.servicioAcabadoList") ?>'
        })

        serviciosacabadosList.forEach((element) =>{
            
            tableServiciosAcabado.row.add([
                element.tarifa_acabado_id,
                element.nombre,
                '<span id="precio_unidad_acabado_' + element.tarifa_acabado_id + '">' + parseFloat(element.precio_unidad).toFixed(2) + '</span>',
                '<input class="update-totales" id="precio_total_acabado_' + element.tarifa_acabado_id +'" value="' + parseFloat(element.precio_total).toFixed(2) + '"></input>',
                '<span style="display: none;" class="update-totales" id="acabado_margen_' + element.tarifa_acabado_id + '">' + parseFloat(element.margen).toFixed(2) + '</span>',
                '<a href="javascript:void(0);"><i class="ti ti-trash ti-sm btn-delete-serv mx-2" data-id="' + element.tarifa_acabado_id +'"></i></a>'
                ]).draw(false)
        
        })
        check_serv_acabado_error()
    }

    function check_serv_acabado_error(){
        
        var htmlString = '';

        $('#tableOfServiciosAcabado tr').each(function(){
            if($(this).find('td').eq(2).text() == '0.00'){
                htmlString = `
                <div class="alert alert-danger d-flex align-items-baseline" role="alert">
                    <span class="alert-icon alert-icon-lg text-primary me-2">
                        <i class="ti ti-ban ti-sm"></i>
                    </span>
                    <div class="d-flex flex-column ps-1">
                        <h5 class="alert-heading mb-2"><?= lang("Presupuestos.errores.error_servicios_anadidos") ?></h5>
                    </div>
                </div>`;  
            }
        })
        $('#serv-acabado-error').html(htmlString)
    }

    function get_tarifas_acabado(tarifa_id = -1){
        
        if(parseInt($('#tirada').val())>0){
            var tirada = parseInt($('#tirada').val())
        }
        else{
            var tirada = 0
        }

        var datos = {
            tarifa_acabado_id : tarifa_id,
            tirada: tirada,
            POD: <?php echo $POD; ?>,
            <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
        };

        
        $.ajax({
            type: "POST",
            url: '<?=route_to('dataTableOfPresupuestoAcabados') ?>',
            data: datos,
            success: function (data) {
                
                data.values.forEach((row) => {

                    tableServiciosAcabado.row.add([
                        row.tarifa_id,
                        row.tarifa_nombre,
                        '<span id="precio_unidad_acabado_' + row.tarifa_id + '">' + parseFloat(row.precio_unidad).toFixed(2) + '</span>',
                        '<input class="update-totales" id="precio_total_acabado_' + row.tarifa_id +'" value="' + parseFloat(row.total).toFixed(2) + '"></input>',
                        '<span style="display: none;" class="update-totales" id="acabado_margen_' + row.tarifa_id + '">' + parseFloat(row.margen).toFixed(2) + '</span>',
                        '<a href="javascript:void(0);"><i class="ti ti-trash ti-sm btn-delete-serv mx-2" data-id="' + row.tarifa_id +'"></i></a>'
                        ]).draw(false)
                });

                check_serv_acabado_error()
                yeniden(data.<?= csrf_token() ?>);
                return true;
            },
            error: function(e){
                return false;
            }
        })
        return false;
    }

    function servicioRetractilado(){
        if($('#retractilado').prop('checked')){
            $('#add_servicio_acabado_list').val(<?php echo $serviciosCheckboxes['retractilado'] ?>)
            $('#insertar_serv_acabado').click()        
        }
        else{
            var row_indexes = tableServiciosAcabado.rows().eq( 0 ).filter( function (rowIdx) {
                return tableServiciosAcabado.cell( rowIdx, 0 ).data() == <?php echo $serviciosCheckboxes['retractilado'] ?> ? true : false;
            } );
            if(row_indexes.length > 0){
                tableServiciosAcabado.row(row_indexes[0]).remove().draw()
                check_serv_acabado_error()
            }
        }
    }

    function servicioRetractilado5(){
        if($('#retractilado5').prop('checked')){
            $('#add_servicio_acabado_list').val(<?php echo $serviciosCheckboxes['retractilado5'] ?>)
            $('#insertar_serv_acabado').click()        
        }
        else{
            var row_indexes = tableServiciosAcabado.rows().eq( 0 ).filter( function (rowIdx) {
                return tableServiciosAcabado.cell( rowIdx, 0 ).data() == <?php echo $serviciosCheckboxes['retractilado5'] ?> ? true : false;
            } );
            if(row_indexes.length > 0){
                tableServiciosAcabado.row(row_indexes[0]).remove().draw()
                check_serv_acabado_error()
            }
        }
    }

    function servicioFajaColor(){
        if($('#fajaColor').prop('checked')){
            $('#add_servicio_acabado_list').val(<?php echo $serviciosCheckboxes['fajaColor'] ?>)
            $('#insertar_serv_acabado').click()        
        }
        else{
            var row_indexes = tableServiciosAcabado.rows().eq( 0 ).filter( function (rowIdx) {
                return tableServiciosAcabado.cell( rowIdx, 0 ).data() == <?php echo $serviciosCheckboxes['fajaColor'] ?> ? true : false;
            } );
            if(row_indexes.length > 0){
                tableServiciosAcabado.row(row_indexes[0]).remove().draw()
                check_serv_acabado_error()
            }
        }
    }

    $('#insertar_serv_acabado').on('click', function(){
        const tarifa_text = $('#add_servicio_acabado_list').select2('data')[0].text.trim()
        
        if( $('#add_servicio_acabado_list').select2('data')[0].text.trim().length > 0){
            if($('#tableOfServiciosAcabado tr > td:contains(' + tarifa_text + ')').length == 0)
                get_tarifas_acabado($('#add_servicio_acabado_list').select2('data')[0].id);
            else{
                popErrorAlert("<?= lang("Presupuestos.errores.error_servicios_duplicados") ?>", 'serv-acabado-alert')
            }
        }
        check_serv_acabado_error()
    })

    function get_datos_acabado(){
        
        var datosAcabado = []
        if(tableServiciosAcabado.rows().count()>0){
            $("#tableOfServiciosAcabado tr").each(function (index,tr) {
                var values = {}
                $(this).find("td").each(function (index2) {
                    
                    switch (index2) {
                        case 0: 
                            values['tarifa_id'] = $(this).text()
                            break
                        case 2: 
                            values['precio_unidad'] = $(this).text()
                            break
                        case 3: 
                            values['precio_total'] = $(this).children(":first").val()
                            break
                        case 4: 
                            values['margen'] = $(this).text()
                            break
                    }
                })
                if(Object.keys(values).length>0)
                    datosAcabado.push(values)
            })
        }

        return datosAcabado
    }

    init_servicio_acabado()

<?= $this->endSection() ?>

<!-------------------------------------------------------------->
<!-- Código JS comportamiento tabla servicios encuadernacion. -->
<!-------------------------------------------------------------->
<?= $this->section("additionalInlineJs") ?>

    var tableServiciosEnc = new DataTable('#tableOfServiciosEncuadernacion',{
        scrollX: true,
        searching: false,
        paging: false,
        info: false,
        ordering: false,
        responsive: true,
        select: false,
        language: {
            url: "//cdn.datatables.net/plug-ins/1.13.4/i18n/<?= config('Basics')->i18n ?>.json"
        },      
        "drawCallback": function(settings ) {
            updateTotales(false, true, false)
        }  
    });


    function init_servicio_encuadernado(){
        const serviciosencuadernadosList = <?php echo json_encode($serviciosEncuadernacionList); ?>;    

        $('#add_servicio_enc_list').select2({
                allowClear: false,
                minimumResultsForSearch: -1,
                placeholder: '<?= lang("Presupuestos.servicioEncuadernadoList") ?>'
        })

        serviciosencuadernadosList.forEach((element) =>{
            
            const tarifa_id = element.tarifa_encuadernado_id
            var proveedor_nombre = element.proveedor===null?'<?= lang("Presupuestos.no_disponible") ?>': element.proveedor
            
            tableServiciosEnc.row.add([
                element.tarifa_encuadernado_id,
                element.nombre,
                '<select id="proveedor_enc_' + element.tarifa_encuadernado_id + '" class="proveedor_enc select2bs2" style="width: 100%;">' +
                    '<option value="' + element.proveedor_id + '"  selected >' + 
                        proveedor_nombre +
                    '</option>' +
                '</select>',
                '<span id="precio_unidad_encuadernado_' + element.tarifa_encuadernado_id + '">' + parseFloat(element.precio_unidad).toFixed(2) + '</span>',
                '<input class="update-totales" id="precio_total_encuadernado_' + element.tarifa_encuadernado_id +'" value="' + parseFloat(element.precio_total).toFixed(2) + '"></input>',
                '<span style="display: none;" class="update-totales" id="enc_margen_' + element.tarifa_encuadernado_id + '">' + parseFloat(element.margen).toFixed(2) + '</span>',
                '<a href="javascript:void(0);"><i class="ti ti-trash ti-sm btn-delete-serv mx-2" data-id="' + element.tarifa_encuadernado_id +'"></i></a>'
                ]).draw(false)
        
            $('#proveedor_enc_' + element.tarifa_encuadernado_id).select2({
                allowClear: false,
                minimumResultsForSearch: -1,
                ajax: {
                    url: '<?= route_to("menuItemsOfPresupuestoEncuadernaciones") ?>',
                    type: 'post',
                    dataType: 'json',

                    data: function (params) {
                        
                        if(parseInt($('#tirada').val())>0){
                            var tirada = parseInt($('#tirada').val())
                        }
                        else{
                            var tirada = 0
                        }
                        return {
                            tarifa_id: tarifa_id,
                            paginas: parseInt($('#paginas').val())>0?parseInt($('#paginas').val()):0,
                            tirada: tirada,
                            ancho: ancho_libro,
                            alto: alto_libro,
                            searchtxt: params.term, // search term
                            <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
                        };
                    },
                    delay: 60,
                    processResults: function (response) {
                        yeniden(response.<?= csrf_token() ?>);
                        return {
                            results: response.menu
                        };
                    },
                    cache: true
                }
            });
            $('#proveedor_enc_' + element.tarifa_encuadernado_id).on('change', proveedor_enc_event)
        });
        check_serv_enc_error()
        
    }

    function proveedor_enc_event(){
        const dimension = getDimensionLibro();
        if(parseInt($('#tirada').val())>0){
            var tirada = parseInt($('#tirada').val())
        }
        else{
            var tirada = 0
        }

        var datos = {
            tarifa_encuadernacion_id: this.id.split('_')[2],
            paginas: parseInt($('#paginas').val())>0?parseInt($('#paginas').val()):0,
            tirada: tirada,
            ancho: dimension.ancho,
            alto: dimension.alto,
            proveedor_id: parseInt($('#' + this.id).select2('data')[0].id),
            POD: <?php echo $POD; ?>,
            <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
        };

        $.ajax({
            type: "POST",
            url: '<?=route_to('dataTableOfPresupuestoEncuadernaciones') ?>',
            data: datos,
            success: function (data) {
                
                $('#precio_unidad_encuadernado_' + datos.tarifa_encuadernacion_id).text(parseFloat(data.values[0].precio_unidad).toFixed(2))
                $('#precio_total_encuadernado_' + datos.tarifa_encuadernacion_id).val(parseFloat(data.values[0].total).toFixed(2))
                $('#enc_margen_' + datos.tarifa_encuadernacion_id).val(parseFloat(data.values[0].margen).toFixed(2))
                yeniden(data.<?= csrf_token() ?>);
                return true;
            },
            error: function(e){
                return false;
            }
        })
        return false;
    }
    

    function check_serv_enc_error(){
        
        var htmlString = '';

        $('#tableOfServiciosEncuadernacion tr').each(function(){
            if($(this).find('td').eq(3).text() == '0.00'){
                htmlString = `
                <div class="alert alert-danger d-flex align-items-baseline" role="alert">
                    <span class="alert-icon alert-icon-lg text-primary me-2">
                        <i class="ti ti-ban ti-sm"></i>
                    </span>
                    <div class="d-flex flex-column ps-1">
                        <h5 class="alert-heading mb-2"><?= lang("Presupuestos.errores.error_servicios_anadidos") ?></h5>
                    </div>
                </div>`;    
            }
        })
        $('#serv-enc-error').html(htmlString)
    }

        
    async function get_tarifas_enc(tipo=null, tarifa_id = -1){
        const dimension = getDimensionLibro();
        
        if(parseInt($('#tirada').val())>0){
            var tirada = parseInt($('#tirada').val())
        }
        else{
            var tirada = 0
        }

        var datos = {
            tarifa_encuadernacion_id : tarifa_id,
            solapas: $('#solapas').is(':checked')?1:0,
            paginas: parseInt($('#paginas').val())>0?parseInt($('#paginas').val()):0,
            tirada: tirada,
            ancho: dimension.ancho,
            alto: dimension.alto,
            POD: <?php echo $POD; ?>,
            <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
        };

        if(tipo != null)
            datos['tipo'] = tipo;

        $.ajax({
            type: "POST",
            url: '<?=route_to('dataTableOfPresupuestoEncuadernaciones') ?>',
            data: datos,
            success: function (data) {
                
                if(tipo=='default')
                    tableServiciosEnc.clear().draw()

                data.values.forEach((row) => {
                    
                    tableServiciosEnc.row.add([
                        row.tarifa_id,
                        row.tarifa_nombre,
                        '<select id="proveedor_enc_' + row.tarifa_id + '" class="proveedor_enc select2bs2" style="width: 100%;">' +
                            '<option value="' + row.proveedor_id + '"  selected >' + 
                                row.proveedor +
                            '</option>' +
                        '</select>',
                        '<span id="precio_unidad_encuadernado_' + row.tarifa_id + '">' + parseFloat(row.precio_unidad).toFixed(2) + '</span>',
                        '<input class="update-totales" id="precio_total_encuadernado_' + row.tarifa_id +'" value="' + parseFloat(row.total).toFixed(2) + '"></input>',
                        '<span style="display: none;" class="update-totales" id="enc_margen_' + row.tarifa_id + '">' + parseFloat(row.margen).toFixed(2) + '</span>',
                        '<a href="javascript:void(0);"><i class="ti ti-trash ti-sm btn-delete-serv mx-2" data-id="' + row.tarifa_id +'"></i></a>'
                        ]).draw(false)
                    
                    $('#proveedor_enc_' + row.tarifa_id).select2({
                        allowClear: false,
                        minimumResultsForSearch: -1,
                        ajax: {
                            url: '<?= route_to("menuItemsOfPresupuestoEncuadernaciones") ?>',
                            type: 'post',
                            dataType: 'json',

                            data: function (params) {
                                
                                if( parseInt( $('#tirada').val() )>0){
                                    var tirada = parseInt($('#tirada').val())
                                }
                                else{
                                    var tirada = 0
                                }
                                return {
                                    tarifa_id: row.tarifa_id,
                                    paginas: parseInt($('#paginas').val())>0?parseInt($('#paginas').val()):0,
                                    tirada: tirada,
                                    ancho: ancho_libro,
                                    alto: alto_libro,
                                    searchtxt: params.term, // search term
                                    <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
                                };
                            },
                            delay: 60,
                            processResults: function (response) {
                                yeniden(response.<?= csrf_token() ?>);
                                return {
                                    results: response.menu
                                };
                            },
                            cache: true
                        }
                    });

                    $('#proveedor_enc_' + row.tarifa_id).on('change', proveedor_enc_event)

                    
                });

                check_serv_enc_error()
                yeniden(data.<?= csrf_token() ?>);
                return true;
            },
            error: function(e){
                return false;
            }
        })
        return false;
    }


    $('#insertar_serv_enc').on('click', function(){
        const tarifa_text = $('#add_servicio_enc_list').select2('data')[0].text.trim()
        
        if( $('#add_servicio_enc_list').select2('data')[0].text.trim().length > 0){
            if($('#tableOfServiciosEncuadernacion tr > td:contains(' + tarifa_text + ')').length == 0)
                get_tarifas_enc('tarifa', $('#add_servicio_enc_list').select2('data')[0].id);
            else{
                popErrorAlert("<?= lang("Presupuestos.errores.error_servicios_duplicados") ?>", 'serv-enc-alert')
            }
        }
        check_serv_enc_error()
    })

    function get_datos_encuadernacion(){
        
        var datosEnc = []
        if(tableServiciosEnc.rows().count()>0){
            $("#tableOfServiciosEncuadernacion tr").each(function (index,tr) {
                var values = {}
                $(this).find("td").each(function (index2) {
                    
                    switch (index2) {
                        case 0: 
                            values['tarifa_id'] = $(this).text()
                            break
                        case 2: 
                            values['proveedor_id'] = $(this).children(":first").select2('data')[0].id
                            break
                        case 3: 
                            values['precio_unidad'] = $(this).text()
                            break
                        case 4: 
                            values['precio_total'] = $(this).children(":first").val()
                            break
                        case 5: 
                            values['margen'] = $(this).text()
                            break
                    }
                })
                if(Object.keys(values).length>0)
                datosEnc.push(values)
            })
        }

        return datosEnc
    }

    
    init_servicio_encuadernado()

<?= $this->endSection() ?>

<!-------------------------------------------------------------->
<!-- Código JS comportamiento tabla servicios manipulados.    -->
<!-------------------------------------------------------------->
<?= $this->section("additionalInlineJs") ?>

    var tableServiciosManipulado = new DataTable('#tableOfServiciosManipulado',{
        scrollX: true,
        searching: false,
        paging: false,
        info: false,
        ordering: false,
        responsive: true,
        select: false,
        language: {
            url: "//cdn.datatables.net/plug-ins/1.13.4/i18n/<?= config('Basics')->i18n ?>.json"
        },
        "drawCallback": function(settings ) {
            updateTotales(false, true, false)
        }
    });

    function init_servicio_manipulado(){
        const serviciosmanipuladoList = <?php echo json_encode($serviciosManipuladoList); ?>;    

        $('#add_servicio_manipulado_list').select2({
                allowClear: false,
                minimumResultsForSearch: -1,
                placeholder: '<?= lang("Presupuestos.servicioManipuladoList") ?>'
        })

        serviciosmanipuladoList.forEach((element) =>{
            
            tableServiciosManipulado.row.add([
                element.tarifa_manipulado_id,
                element.nombre,
                '<span id="precio_unidad_manipulado_' + element.tarifa_manipulado_id + '">' + parseFloat(element.precio_unidad).toFixed(2) + '</span>',
                '<input class="update-totales" id="precio_total_manipulado_' + element.tarifa_manipulado_id +'" value="' + parseFloat(element.precio_total).toFixed(2) + '"></input>',
                '<span style="display: none;" class="update-totales" id="manipulado_margen_' + element.tarifa_manipulado_id + '">' + parseFloat(element.margen).toFixed(2) + '</span>',
                '<a href="javascript:void(0);"><i class="ti ti-trash ti-sm btn-delete-serv mx-2" data-id="' + element.tarifa_manipulado_id +'"></i></a>'
                ]).draw(false)
        
        })
        check_serv_manipulado_error()
    }

    function check_serv_manipulado_error(){
        
        var htmlString = '';

        $('#tableOfServiciosManipulado tr').each(function(){
            if($(this).find('td').eq(2).text() == '0.00'){
                htmlString = `
                <div class="alert alert-danger d-flex align-items-baseline" role="alert">
                    <span class="alert-icon alert-icon-lg text-primary me-2">
                        <i class="ti ti-ban ti-sm"></i>
                    </span>
                    <div class="d-flex flex-column ps-1">
                        <h5 class="alert-heading mb-2"><?= lang("Presupuestos.errores.error_servicios_anadidos") ?></h5>
                    </div>
                </div>`;  
            }
        })
        $('#serv-manipulado-error').html(htmlString)
    }

    async function get_tarifas_manipulado(tipo=null, tarifa_id = -1){
        
        if(parseInt($('#tirada').val())>0){
            var tirada = parseInt($('#tirada').val())
        }
        else{
            var tirada = 0
        }

        var datos = {
            tarifa_manipulado_id : tarifa_id,
            tirada: tirada,
            POD: <?php echo $POD; ?>,
            <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
        };

        if(tipo != null){
            datos['tipo'] = tipo;
            datos['solapas'] = $('#solapas').is(':checked')?1:0;
        }
            

        
        $.ajax({
            type: "POST",
            url: '<?=route_to('dataTableOfPresupuestoManipulados') ?>',
            data: datos,
            success: function (data) {
                
                if(tipo=='default')
                    tableServiciosManipulado.clear().draw()

                data.values.forEach((row) => {

                    tableServiciosManipulado.row.add([
                        row.tarifa_id,
                        row.tarifa_nombre,
                        '<span id="precio_unidad_manipulado_' + row.tarifa_id + '">' + parseFloat(row.precio_unidad).toFixed(2) + '</span>',
                        '<input class="update-totales" id="precio_total_manipulado_' + row.tarifa_id +'" value="' + parseFloat(row.total).toFixed(2) + '"></input>',
                        '<span style="display: none;" class="update-totales" id="manipulado_margen_' + row.tarifa_id + '">' + parseFloat(row.margen).toFixed(2) + '</span>',
                        '<a href="javascript:void(0);"><i class="ti ti-trash ti-sm btn-delete-serv mx-2" data-id="' + row.tarifa_id +'"></i></a>'
                        ]).draw(false)
                });

                check_serv_manipulado_error()
                yeniden(data.<?= csrf_token() ?>);
                return true;
            },
            error: function(e){
                return false;
            }
        })
        return false;
    }

    $('#insertar_serv_manipulado').on('click', function(){
        const tarifa_text = $('#add_servicio_manipulado_list').select2('data')[0].text.trim()
        
        if( $('#add_servicio_manipulado_list').select2('data')[0].text.trim().length > 0){
            if($('#tableOfServiciosManipulado tr > td:contains(' + tarifa_text + ')').length == 0){
                get_tarifas_manipulado(null, $('#add_servicio_manipulado_list').select2('data')[0].id);
            }
            else{
                popErrorAlert("<?= lang("Presupuestos.errores.error_servicios_duplicados") ?>", 'serv-manipulado-alert')
            }
        }
        check_serv_manipulado_error()
    })

    function get_datos_manipulado(){
        
        var datosManipulado = []
        if(tableServiciosManipulado.rows().count()>0){

            $("#tableOfServiciosManipulado tr").each(function (index,tr) {
                var values = {}
                $(this).find("td").each(function (index2) {
                    
                    switch (index2) {
                        case 0: 
                            values['tarifa_id'] = $(this).text()
                            break
                        case 2: 
                            values['precio_unidad'] = $(this).text()
                            break
                        case 3: 
                            values['precio_total'] = $(this).children(":first").val()
                            break
                        case 4: 
                            values['margen'] = $(this).text()
                            break
                    }
                })
                if(Object.keys(values).length>0)
                datosManipulado.push(values)
            })
        }

        return datosManipulado
    }

    init_servicio_manipulado()

<?= $this->endSection() ?>


<!-------------------------------------------------------------->
<!-- Código JS comportamiento tabla servicios preimpresion.   -->
<!-------------------------------------------------------------->
<?= $this->section("additionalInlineJs") ?>

    var tableServiciosPreimpresion = new DataTable('#tableOfServiciosPreimpresion',{
        scrollX: true,
        searching: false,
        paging: false,
        info: false,
        ordering: false,
        responsive: true,
        select: false,
        language: {
            url: "//cdn.datatables.net/plug-ins/1.13.4/i18n/<?= config('Basics')->i18n ?>.json"
        },
        "drawCallback": function(settings ) {
            updateTotales(false, true, false)
        }
    });

    
    function init_servicio_preimpresion(){
        const serviciospreimpresionList = <?php echo json_encode($serviciosPreimpresionList); ?>;    

        $('#add_servicio_preimpresion_list').select2({
                allowClear: false,
                minimumResultsForSearch: -1,
                placeholder: '<?= lang("Presupuestos.servicioPreimpresionList") ?>'
        })

        serviciospreimpresionList.forEach((element) =>{
            
            tableServiciosPreimpresion.row.add([
                element.tarifa_preimpresion_id,
                element.nombre,
                '<input class="update-totales" id="precio_preimpresion_' + element.tarifa_preimpresion_id +'" value="' + parseFloat(element.precio).toFixed(2) + '"></input>',
                '<span style="display: none;" class="update-totales" id="preimpresion_margen_' + element.tarifa_preimpresion_id + '">' + parseFloat(element.margen).toFixed(2) + '</span>',
                '<a href="javascript:void(0);"><i class="ti ti-trash ti-sm btn-delete-serv mx-2" data-id="' + element.tarifa_preimpresion_id +'"></i></a>'
                ]).draw(false)
        
        })
        check_serv_preimpresion_error()
    }

    function check_serv_preimpresion_error(){
        
        var htmlString = '';

        $('#tableOfServiciosPreimpresion tr').each(function(){
            
            if(parseFloat($(this).find('td:eq(2) input').val()) == '0'){
                htmlString = `
                <div class="alert alert-danger d-flex align-items-baseline" role="alert">
                    <span class="alert-icon alert-icon-lg text-primary me-2">
                        <i class="ti ti-ban ti-sm"></i>
                    </span>
                    <div class="d-flex flex-column ps-1">
                        <h5 class="alert-heading mb-2"><?= lang("Presupuestos.errores.error_servicios_anadidos") ?></h5>
                    </div>
                </div>`;  
            }
        })
        $('#serv-preimpresion-error').html(htmlString)
    }

    function get_tarifas_preimpresion(tarifa_id = -1){
        
        var datos = {
            tarifa_preimpresion_id : tarifa_id,
            <?= csrf_token() ?? "token" ?> : <?= csrf_token() ?>v
        };

        
        $.ajax({
            type: "POST",
            url: '<?=route_to('dataTableOfPresupuestoPreimpresiones') ?>',
            data: datos,
            success: function (data) {
                
                data.values.forEach((row) => {
                    
                    tableServiciosPreimpresion.row.add([
                        row.tarifa_id,
                        row.tarifa_nombre,
                        '<input class="update-totales" id="precio_preimpresion_' + row.tarifa_id +'" value="' + parseFloat(row.precio).toFixed(2) + '"></input>',
                        '<span style="display: none;" class="update-totales" id="preimpresion_margen_' + row.tarifa_id + '">' + parseFloat(row.margen).toFixed(2) + '</span>',
                        '<a href="javascript:void(0);"><i class="ti ti-trash ti-sm btn-delete-serv mx-2" data-id="' + row.tarifa_id +'"></i></a>'
                        ]).draw(false)
                });

                check_serv_preimpresion_error()
                yeniden(data.<?= csrf_token() ?>);
                return true;
            },
            error: function(e){
                return false;
            }
        })
        return false;
    }


    function servicioPrototipo(){
        if($('#prototipo').prop('checked')){
            $('#add_servicio_preimpresion_list').val(<?php echo $serviciosCheckboxes['prototipo'] ?>)
            $('#insertar_serv_preimpresion').click()        
        }
        else{
            var row_indexes = tableServiciosPreimpresion.rows().eq( 0 ).filter( function (rowIdx) {
                return tableServiciosPreimpresion.cell( rowIdx, 0 ).data() == <?php echo $serviciosCheckboxes['prototipo'] ?> ? true : false;
            } );
            if(row_indexes.length > 0){
                tableServiciosPreimpresion.row(row_indexes[0]).remove().draw()
                check_serv_preimpresion_error()
            }
        }
    }

    function servicioFerro(){
        var row_indexes = tableServiciosPreimpresion.rows().eq( 0 ).filter( function (rowIdx) {
            return tableServiciosPreimpresion.cell( rowIdx, 0 ).data() == <?php echo $serviciosCheckboxes['ferro'] ?> ? true : false;
        } );
        if($('#ferro').prop('checked')){
            if(row_indexes.length == 0){
                $('#add_servicio_preimpresion_list').val(<?php echo $serviciosCheckboxes['ferro'] ?>)
                $('#insertar_serv_preimpresion').click()        
            }
        }
        else{
            if(row_indexes.length > 0){
                tableServiciosPreimpresion.row(row_indexes[0]).remove().draw()
                check_serv_preimpresion_error()
            }
        }
    }

    $('#insertar_serv_preimpresion').on('click', function(){
        const tarifa_text = $('#add_servicio_preimpresion_list').select2('data')[0].text.trim()
        
        if( $('#add_servicio_preimpresion_list').select2('data')[0].text.trim().length > 0){
            if($('#tableOfServiciosPreimpresion tr > td:contains(' + tarifa_text + ')').length == 0)
                get_tarifas_preimpresion($('#add_servicio_preimpresion_list').select2('data')[0].id);
            else{
                popErrorAlert("<?= lang("Presupuestos.errores.error_servicios_duplicados") ?>", 'serv-preimpresion-alert')
            }
        }
        check_serv_preimpresion_error()
    })

    function get_datos_preimpresion(){
        
        var datosPreimpresion = []
        if(tableServiciosPreimpresion.rows().count()>0){

            $("#tableOfServiciosPreimpresion tr").each(function (index,tr) {
                var values = {}
                $(this).find("td").each(function (index2) {
                    
                    switch (index2) {
                        case 0: 
                            values['tarifa_id'] = $(this).text()
                            break
                        case 2: 
                            values['precio'] = $(this).children(":first").val()
                            break
                        case 3: 
                            values['margen'] = $(this).text()
                            break
                    }
                })
                if(Object.keys(values).length>0)
                    datosPreimpresion.push(values)
            })
        }

        return datosPreimpresion
    }

    init_servicio_preimpresion()

<?= $this->endSection() ?>
