@extends('adminlte::page')

@section('title', 'Informe Suspenciones')

@section('content')
    <br>

    <div style="display:none;" id="loader"></div>
    <div id="DivPrincipal">
        <div class="col-12">
            <!-- /.card -->
            <div class="card">
                <div class="card-header">
                    <h2><i class="fa fa-th" aria-hidden="true"></i> Socios Suspendidos por falta de pago</h2>
                </div>
                <div class="card-body">
                    <table id="table_solicudes" class="table table-striped table-bordered">
                        <thead>
                            <tr>
                                {{-- <th></th> --}}
                                <!--<th>No.Suspencion</th>-->
                                <th>Socio</th>
                                <th>Factura</th>
                                <th>Concepto</th>
                                <th>Saldo</th>
                                <th>Fecha Vencimiento</th>
                                <th>Observación</th>
                            </tr>
                        </thead>
                        <tbody id="tblSocios_seleccionar">

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

@stop

@section('js')
    <script>
    MostrarLoader();
        var tableSolicitudes = $('#table_solicudes').DataTable({
            "language": {
                "lengthMenu": "Mostrando _MENU_ por pagina",
                "zeroRecords": "Sin Registro..",
                "info": "Mostrando pagina _PAGE_ de _PAGES_",
                "infoEmpty": "Sin registros disponibles",
                "infoFiltered": "(filtered from _MAX_ total records)",
                "search": "Busq.",
                "paginate": {
                    "first": "Primero",
                    "last": "Ultimo",
                    "next": "Siguiente",
                    "previous": "Anterior"
                },
            },
            // "columns": [
            //     {
            //         "width": "1%"
            //     },
            //     {
            //         "width": "20%"
            //     },
            //     null,
            //     {
            //         "width": "20%"
            //     },
            //     null,
            //     null,
            //     null
               
            // ],
            // "columnDefs": [{
            //         "defaultContent": '<a href="javascript:void(0);" class=" btn btn-icon btn-xs btn-primary btn_licencia"><i class="fa fa-eye"></i></a>',
            //         "targets": 0,
            //         "data": null
            //     },

            // ],
        });
        const consultarSolicitudes = () => {
            $.ajax({
                url: '/suspeciones/listasuspenciones',
                type: 'GET',
                success: function(data) {
                    tableSolicitudes.rows().remove().draw();
                    if (data.status == 'ok') {
                         OcultarLoader();
                        $.each(data.datos, function(key, value) {
                            tableSolicitudes.row.add([
                                // '',
                                // value.id,
                                value.nombre_completo,
                                value.num_documento,
                                value.descripcion,
                                value.saldo,
                                value.fecha_vencimiento,
                                value.observacion,
                            ]).draw(false);
                        });
                    } else {
                        toastr.error(data.message);
                    }
                },
                cache: false,
                contentType: false,
                processData: false,
            });
        }
      
        consultarSolicitudes();
    </script>
@stop
