@extends('adminlte::page')

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

@section('content_header')
    <div class="container-fluid">
        <h1><i class="fa fa-th" aria-hidden="true"></i> Informe de Socios</h1>
    </div>
@stop
@section('content')
    <form id="usuario_form" method="post" enctype="multipart/form-data">
        @csrf
        <div class="row justify-content-center">
            <input name="_token" type="hidden" class="form-control" id="_token" value="{{ csrf_token() }}">
            <div class="col-md-12">
                <!-- general form elements -->
                <div class="card card-warning" id="my-card">
                    <div class="card-header">
                        <h3 class="card-title"><strong> Filtros de Búsqueda</strong></h3>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-sm-4">
                                <div class="form-group">
                                    <label>Fecha Desde</label>
                                    <input name="fechadesde" type="date" class="form-control" id="fechadesde">
                                </div>
                            </div>
                            <div class="col-sm-4">
                                <div class="form-group">
                                    <label>Fecha Hasta</label>
                                    <input name="fechahasta" type="date" class="form-control" id="fechahasta">
                                </div>
                            </div>
                            <div class="col-sm-4">
                                <!-- text input -->
                                <div class="form-group">
                                    <label>Estado</label>
                                    <select class="form-control" name='estado' id="estado">
                                        <option value="A">Activo</option>
                                        <option value="I">Inactivo</option>

                                    </select>
                                </div>
                            </div>
                        </div>
                           <div style="display:none;" id="loader"></div>
    <div id="DivPrincipal">
                        <div class="row">
                            
                            <button type="submit" class="btn btn-dark toastrDefaultSuccess m-2"> <i class="fas fa-search">
                                    Buscar Información</i></button>
                                    
                        </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        </div>
        </div>
    </form>
    <div class="row justify-content-center">
        <div class="col-11">

            <!-- /.card -->
            <div class="card">
                <div class="card-header">
                    <div class="float-right">
                        <button type="submit" class="btn btn-danger toastrDefaultSuccess" onclick="imprimirDocumento()">
                            Descargar Pdf</button>
                    </div>
                </div>
                <!-- /.card-header -->
                <div class="card-body">
                    <table id="tblSocios" class="table table-striped table-bordered">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>Cedula</th>
                                <th>Nombres</th>
                                <th>telefonos</th>
                                <th>correo</th>
                                <th>Tipo Licencia</th>
                                <th>Identificación</th>
                                <th>Ingreso</th>
                                <th>Licencia</th>
                            </tr>
                        </thead>
                        <tbody id="tblSocios_seleccionar">

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
@stop

@section('js')
    <script>
        const date = new Date();
        let existeInfo = false;
        const currentDate = date.toISOString().substring(0, 10);
        document.getElementById('fechadesde').value = currentDate;
        document.getElementById('fechahasta').value = currentDate;
        var dataInformacion = $('#tblSocios').DataTable({
            "ordering": false,
            "scrollX": true,
            "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"
                },
            },
            "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": 6,
                    "data": null
                },
                {
                    "defaultContent": '<a href="javascript:void(0);" class=" btn btn-icon btn-xs btn-primary btn_antecedente"><i class="fa fa-eye"></i></a>',
                    "targets": 7,
                    "data": null
                },
                {
                    "defaultContent": '<a href="javascript:void(0);" class=" btn btn-icon btn-xs btn-primary btn_id"><i class="fa fa-eye"></i></a>',
                    "targets": 8,
                    "data": null
                }
            ],
            "columns": [{

                    "width": "1%"
                },
                {

                    "width": "2%"
                },
                {
                    "width": "25%"
                },
                null,
                // null,
                null,
                // null,
                null,
                null,
                null,
                null
            ],
            // "dom": 'Bfrtip',
            // "buttons": [{
            //     extend: 'excelHtml5',
            //     text: 'EXCEL',
            //     'title': 'Informe de Socio',
            //     filename: 'inf_socios',
            //     titleAttr: 'Informe de Socio',
            //     className: 'btn btn-success'
            // }, ],
        });
        dataInformacion.buttons().disable();
        $("form#usuario_form").submit(function(e) {
            e.preventDefault();
            MostrarLoader();
            const formData = new FormData(this);
            
            $.ajax({
                url: '/admin/consultaSocio',
                type: 'POST',
                data: formData,
                success: function(data) {
                    const rows = dataInformacion.rows().remove().draw();
                    if (data.status == 'ok') {
                     OcultarLoader();
                        dataInformacion.buttons().enable();
                        $.each(data.dataEnte, function(key, value) {
                            dataInformacion.row.add([
                                value.id_ente,
                                value.num_docum_iden,
                                value.nombre_completo,
                                value.p_telefono + ' - ' + value.p_celular,
                                // value.p_fecha_nacimiento,
                                value.p_correo,
                                // value.p_direccion,
                                value.tipolicencia,
                                '',
                                '',
                                ''
                            ]).draw(false);
                        });

                        existeInfo = true;
                    } else {
                        toastr.error(data.message);
                    }
                },
                cache: false,
                contentType: false,
                processData: false,
            });

        });

        $('#tblSocios tbody ').on('click', '.btn_licencia', function() {
            const datosTablas = dataInformacion.row($(this).parents('tr')).data();
            window.open("/mostrarArchivo/" + datosTablas[0] + "/" + 1);
        });
        $('#tblSocios tbody ').on('click', '.btn_antecedente', function() {
            const datosTablas = dataInformacion.row($(this).parents('tr')).data();
            window.open("/mostrarArchivo/" + datosTablas[0] + "/" + 3);
        });
        $('#tblSocios tbody ').on('click', '.btn_id', function() {
            const datosTablas = dataInformacion.row($(this).parents('tr')).data();
            window.open("/mostrarArchivo/" + datosTablas[0] + "/" + 2);
        });
        const imprimirDocumento = () => {
            if (existeInfo) {
                window.open("/create-pdf-socio");
            } else {
                toastr.error('No existe información para exportar');
            }

        }
    </script>
@stop
