$('#employee_payslip-table').DataTable().clear().destroy();


var table_table = $('#employee_payslip-table').DataTable({
    initComplete: function () {
        this.api().columns([0]).every(function () {
            var column = this;
            var select = $('<select><option value=""></option></select>')
                .appendTo($(column.footer()).empty())
                .on('change', function () {
                    var val = $.fn.dataTable.util.escapeRegex(
                        $(this).val()
                    );

                    column
                        .search(val ? '^' + val + '$' : '', true, false)
                        .draw();
                });

            column.data().unique().sort().each(function (d, j) {
                select.append('<option value="' + d + '">' + d + '</option>');
                $('select').selectpicker('refresh');
            });
        });
    },
    responsive: true,
    fixedHeader: {
        header: true,
        footer: true
    },
    serverSide: true,
    ajax: {
        url: "{{ route('employee_payslip.index',$employee->id) }}",
    },

    columns: [
        {
            data: 'net_salary',
            name: 'net_salary',
render: function (data) {
if ('{{config('variable.currency_format') =='suffix'}}') {
return data + ' {{config('variable.currency')}}';
} else {
return '{{config('variable.currency')}} ' + data;

}
}
        },
        {
            data: 'month_year',
            name: 'month_year',
        },
        {
            data: 'created_at',
            name: 'created_at',

        },
        {
            data: 'status',
            name: 'status',
render: function (data) {
if (data == 1) {
return "<td><div class = 'badge badge-success'>{{trans('Paid')}}</div>"
    } else {
    return "<td><div class = 'badge badge-danger'>{{trans('Unpaid')}}</div>"
    }
    }
    },  {
            data: 'action',
            name: 'action',
            orderable: false
        }
    ],


    "order": [],
    'language': {
        'lengthMenu': '_MENU_ {{__("records per page")}}',
        "info": '{{trans("Showing")}} _START_ - _END_ (_TOTAL_)',
        "search": '{{trans("Search")}}',
        'paginate': {
            'previous': '{{trans("Previous")}}',
            'next': '{{trans("Next")}}'
        }
    },
    'columnDefs': [
        {
            "orderable": false,
            'targets': [0, 4],
        },
    ],


    'select': {style: 'multi', selector: 'td:first-child'},
    'lengthMenu': [[10, 25, 50, -1], [10, 25, 50, "All"]],
    dom: '<"row"lfB>rtip',
    buttons: [
        {
            extend: 'pdf',
            text: '<i title="export to pdf" class="fa fa-file-pdf"></i>',
            exportOptions: {
                columns: ':visible:Not(.not-exported)',
                rows: ':visible'
            },
        },
        {
            extend: 'csv',
            text: '<i title="export to csv" class="fa fa-file-csv"></i>',
            exportOptions: {
                columns: ':visible:Not(.not-exported)',
                rows: ':visible'
            },
        },
        {
            extend: 'print',
            text: '<i title="print" class="fa fa-print"></i>',
            exportOptions: {
                columns: ':visible:Not(.not-exported)',
                rows: ':visible'
            },
        }
    ],
});
new $.fn.dataTable.FixedHeader(table_table);