$(document).ready(function() {
    var table = $('#mytable').DataTable({
        responsive: true,
        deferRender: true,
        columnDefs: [{
            "defaultContent": "-",
            "targets": "_all"
        }],
        "dom": 'tp',
        "autoWidth": false,
        "bProcessing": true,
        "aLengthMenu": [[6, 10, 25, 50, -1], [6, 10, 25, 50, "All"]],
        "language": {
            "lengthMenu": "Mostrar _MENU_ registros por página",
            "info": "Mostrando página _PAGE_ de _PAGES_",
            "infoEmpty": "No hay registros disponibles",
            "infoFiltered": "(filtrada de _MAX_ registros)",
            "search": "Buscar Total:",
            "zeroRecords": "No se encontraron registros coincidentes",
            "paginate": {
                "next": "Siguiente",
                "previous": "Anterior"
            },
        },
        "columns": [
            {
                "data": "mes",
                "render": function(data, type, row) {
                    return data + '-' + row.anio;
                }
            },
            { "data": "placa" },
            { "data": "total_cfadm" },
            { "data": "total_cfoperaciones" },
            { "data": "TotalCostoVariable" },
            {
                "render": function (data, type, full, row) {
                    return '<center><a href="view_tarifario.php?id='+ full.id +'" class="btn btn-info"><i class="fa fa-eye" aria-hidden="true"></i></a> <a href="edit_tarifario.php?id='+ full.id +'" class="btn btn-warning"><i class="fa fa-book" aria-hidden="true"></i></a></center>'; 
                }
            },
            {
                "visible": false,
                "data": "id"
            },
        ]
    });

    $('#buscar').click(function() {
        var anio = $('#anio').val();
        var mes = $('#mes').val();

        $.ajax({
            url: 'data/data.php',
            type: 'post',
            data: {
                mes: mes,
                anio: anio
            },
            dataType: 'json',
            success: function(data) {
                // Llena la tabla DataTable con los datos obtenidos
                table.clear().rows.add(data.aaData).draw();

               var tbody = $('#mytable tbody');
            
	            // Si no hay registros, muestra el mensaje correspondiente
	            if (data.aaData.length === 0) {
	                tbody.html('<tr><td colspan="6"><center>No se encontraron registros coincidentes</center></td></tr>');
	            } else {
	                tbody.html(table.rows().nodes().to$().addClass('show'));
	            }
	            
	            tbody.show();
	            }
        });
    });
});