<div class="accordion accordion-bordered mt-3" id="accordioLineas">

    <div class="card accordion-item active">
        <h2 class="accordion-header" id="headingLineas">
            <button type="button" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#accordionLineasTip" aria-expanded="false" aria-controls="accordionLineasTip">
                <h3><?= lang("Pedidos.lineas") ?></h3>
            </button>
        </h2>

        <div id="accordionLineasTip" class="accordion-collapse collapse show" data-bs-parent="#accordioLineas">
            <div class="accordion-body">

                <table id="tableOfLineasPedido" class="table table-striped table-hover" style="width: 100%;">
                    <thead>
                        <tr>
                            <th></th>
                            <th><?= lang('Pedidos.presupuesto') ?></th>
                            <th><?= lang('Pedidos.unidades')?></th>
                            <th><?= lang('Pedidos.concepto') ?></th>
                            <th><?= lang('Pedidos.total') ?></th>
                        </tr>
                    </thead>
                    
                    <tbody>
                    </tbody>

                    <tfoot>
                        <tr>
                            <th colspan="5" style="text-align:right">Total:</th>
                        </tr>
                    </tfoot>
                </table>
            </div> <!-- /.accordion-body -->
        </div>
    </div>
</div>


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

const viewPresupuestoBtns = function(data) {
    return `
        <td class="text-right py-0 align-middle">
            <div class="btn-group btn-group-sm">
                <a href="javascript:void(0);"><i class="ti ti-file-search ti-sm btn-view mx-2" data-id="${data.numero}"></i></a>
            </div>
        </td>`;
};

var tableOfLineasPedido = new DataTable('#tableOfLineasPedido',{
    processing: true,
    serverSide: true,
    autoWidth: true,
    responsive: true,
    scrollX: true,
    searchable: false,
    info: false,
    dom: 't',
    language: {
        url: "/themes/vuexy/vendor/libs/datatables-sk/plugins/i18n/es-ES.json"
    },
    ajax : $.fn.dataTable.pipeline( {
        url: '<?= route_to('tablaLineasPedido') ?>',
        data: function ( d ) {
            d.pedido_id = <?= $pedidoEntity->id ?>;
        },
        method: 'POST',
        headers: {'X-Requested-With': 'XMLHttpRequest'},
        async: true,
    }),
    columns: [
        {data: 'numero'},
        {
          data: viewPresupuestoBtns,
          className: 'dt-center'
        },
        {data: 'unidades'},
        {data: 'concepto'},
        {data: 'total'},
    ],
    columnDefs: [
      {
        targets: 0,
        visible:      false,
        orderable:      false,
        searchable:   false
      },
      {
        targets: 1,
        orderable:      false,
        data:           null,
        defaultContent: ''
      },
      {
        targets: [2,3,4],
        orderable:      false,
      },
    ],
    drawCallback: function(){
        $(this.api().table().container()).find('table').css('width', '100%');
        this.api().columns.adjust();
        //cambios_cantidad_albaranes();
    },
    footerCallback: function (row, data, start, end, display) {
        let api = this.api();
 
        // Remove the formatting to get integer data for summation
        let intVal = function (i) {
            return typeof i === 'string'
                ? i.replace(/[\$,]/g, '') * 1
                : typeof i === 'number'
                ? i
                : 0;
        };
 
        // Total over all pages
        total = api
            .column(4)
            .data()
            .reduce((a, b) => intVal(a) + intVal(b), 0);
 
        // Update footer
        api.column(4).footer().innerHTML =
            'Total: ' + total;
    },
});




$(document).on('click', '.btn-view', function(e) {
    <?php if (!auth()->user()->inGroup('cliente-admin') && !auth()->user()->inGroup('cliente-editor')): ?>
        var url = '<?= route_to('editarPresupuestoAdmin', ':id') ?>';
    <?php else: ?>
        var url = '<?= route_to('editarPresupuestoCliente2', ':id') ?>';
    <?php endif; ?>
    url = url.replace(':id', `${$(this).attr('data-id')}` );
    window.open(
        url,
        '_blank' // <- This is what makes it open in a new window.
    );
});

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