<div class="card border-primary mb-12">
<div class="card-header">Cotizacion</div>
    <div class="card-body">
        <table class="table table-bordered" id="cotizacion-table">
            <thead>
                <tr>
                    <th>Folio</th>
                    <th>Estatus</th>
                    <th>captura</th>
                    <th>autorizada</th>
                    <th>cancelada</th>
                    <th>rechazada</th>
                    <th>porautorizar</th>
                    <th>finalizada</th>
                    <th>Cliente</th>
                    <th>RUT</th>
                    <th>Solicita</th>
                    <th>Patente</th>
                    <th>Fecha</th>
                    <th>Hora Servicio</th>
                    <th>Vendedor</th>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
            </thead>
        </table>
    </div>
</div>

<script>
$.fn.dataTable.ext.search.push(
 function( settings, data, dataIndex ) {
console.log("llego");
return false;
});

$(document).ready(function() {
var table = $('#cotizacion-table').DataTable({
    serverSide: true,
    processing: true,
    ajax: '{!! route('cotizacion_data') !!}',
    columnDefs: [
        { "targets": [ 2 ], "visible": false, "searchable": false },
        { "targets": [ 3 ], "visible": false, "searchable": false },
        { "targets": [ 5 ], "visible": false, "searchable": false },
        { "targets": [ 4 ], "visible": false, "searchable": false },
        { "targets": [ 6 ], "visible": false, "searchable": false },
        { "targets": [ 7 ], "visible": false, "searchable": false },
    ],
    columns: [
        { data: 'folio', name: 'folio' },
        { data: 'estado', name: 'estado' },
        { data: 'captura', name: 'captura' },
        { data: 'autorizada', name: 'autorizada' },
        { data: 'cancelada', name: 'cancelada' },
        { data: 'rechazada', name: 'rechazada' },
        { data: 'porautorizar', name: 'porautorizar' },
        { data: 'finalizada', name: 'finalizada' },

        { data: 'cliente', name: 'cliente' },
        { name: 'rut',
            data: null,
            render: function ( data, type, row )
            {
                    return data.rut+"-" +data.dv;
            }
        },
        { data: 'solicita', name: 'solicita' },
        { data: 'patente', name: 'patente' },
        { data: 'fecha', name: 'fecha' },
        { data: 'horaservicio', name: 'horaservicio' },
        { data: 'vendedor', name: 'vendedor' },
        { data: 'actionEdit', name: 'actionEdit', orderable: false, searchable: false},
        { data: 'actionFin', name: 'actionFin', orderable: false, searchable: false},
        { data: 'actionCan', name: 'actionCan', orderable: false, searchable: false},
        { data: 'actionAut', name: 'actionAut', orderable: false, searchable: false},
        { data: 'actionRec', name: 'actionRec', orderable: false, searchable: false},
        { data: 'actionRea', name: 'actionRea', orderable: false, searchable: false}
    ],
    dom: '<"toolbar">frtip',
});

$("div.toolbar").html('<div class="row"> ' +
                '   <div class="col-xs-2 col-sm-2"> </div>' +
                '   <div class="custom-control custom-switch col-xs-2 col-sm-2"> ' +
                '     <a href="{{ url ('/admin/cotizacion/create') }}" title="Reasignar" class="btn btn-xs btn-primary"> '+
                '        <i class="glyphicon glyphicon-plus"></i> Nuevo' +
                '     </a>' +
                '   </div> '+
                '   <div class="custom-control custom-switch col-xs-2 col-sm-2"> ' +
                '      <input type="checkbox" class="custom-control-input" id="Finalizada" > ' +
                '      <label class="custom-control-label" for="Finalizada">Finalizada</label> ' +
                '   </div> '+
                '   <div class="custom-control custom-switch col-xs-2 col-sm-2"> ' +
                '      <input type="checkbox" class="custom-control-input" id="Cancelada" > ' +
                '      <label class="custom-control-label" for="Cancelada">Cancelada</label> ' +
                '   </div> '+
                '</div>');
$("#Finalizada, #Cancelada")
    .off()
    .on("change", function ()
    {
        console.log ("Entro");
        table.draw();
    });`});`