@extends('adminlte::page')

@section('title', 'Tabla de Amortización')
@section('content_header')
    <div class="container-fluid">
        <h1><i class="fa fa-th" aria-hidden="true"></i> Tabla de Amortización</h1>
    </div>
@stop

@section('content')
    <br>
    <form id="motizacion_form" method="post" enctype="multipart/form-data">
        @csrf
        <div class="card card-warning" id="my-card">
            <div class="card-header">
                <h3 class="card-title"><strong> Datos de Búsqueda</strong></h3>
            </div>
            <div class="card-body">

                <div class="row">
                    <input name="_token" type="hidden" class="form-control" id="_token" value="{{ csrf_token() }}">

                    <div class="col-sm-3">
                    </div>
                    <div class="col-sm-3">
                        <label>No. Documento Pendiente de Cobro</label>
                        <div class="form-group">
                            <input type="text" class="form-control" readonly value="0" name='numerodoc'
                                id="numerodoc">
                        </div>
                    </div>

                    <div class="col-sm-3">
                        <div class="form-group">
                            <button type="button" class="btn btn-dark toastrDefaultSuccess mt-sm-4" id="busqueda"
                                data-toggle="modal"> <i class="fas fa-search">
                                    Buscar Documento</i>
                            </button>
                        </div>
                    </div>

                    <div class="col-sm-3">
                        <div class="form-group">
                            <button type="submit" class="btn btn-primary toastrDefaultSuccess mt-sm-4"> <i
                                    class="fas fa-file">
                                    Generar Pdf</i></button>
                        </div>
                    </div>


                </div>
                <div class="row">
                    <div class="col-12">

                        <div class="card">
                            <div class="card-header">
                                <h3 class="card-title"></h3>
                            </div>
                            <!-- /.card-header -->
                            <div class="card-body">
                                <table id="tblDetalleCuotas" class="table table-bordered table-striped">
                                    <thead>
                                        <tr>
                                            <th>No. Cuota</th>
                                            <th>Monto</th>
                                            <th>Abono</th>
                                            <th>Saldo</th>
                                        </tr>
                                    </thead>
                                    <tfoot>

                                    </tfoot>
                                </table>
                            </div>
                            <!-- /.card-body -->
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </form>
    <div class="modal fade" id="modal-Fact">
        <div class="modal-dialog modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title"> <i class="fas fa-search"> </i> Búsqueda de Documentos</h4>
                    <button id="CloseModal" type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <!--<p>One fine body&hellip;</p>-->
                    <div class="row">
                        <div class="col-12">

                            <!-- /.card -->
                            <div class="card">
                                <div class="card-header">
                                    <h3 class="card-title"></h3>
                                </div>
                                <!-- /.card-header -->
                                <div class="card-body">
                                    <table id="tblBuscarFacturas" class="table table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th># Codigo</th>
                                                <th>No. Documento</th>
                                                <th>Socio</th>
                                                <th>Fecha Emisión</th>
                                                <th>Metodo Pago</th>
                                                <th>Total</th>
                                            </tr>
                                        </thead>
                                        <tfoot>

                                        </tfoot>
                                    </table>
                                </div>
                                <!-- /.card-body -->
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer justify-content-between">
                    <!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                                                                                                                                                                              <button type="button" class="btn btn-primary">Save changes</button>-->
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
@stop

@section('js')
    <script>
        var dataInformacion = $('#tblDetalleCuotas').DataTable({
            "searching": false,
            "language": {
                "lengthMenu": "Mostrar _MENU_ registros por página",
                "zeroRecords": "No se encontró nada - lo siento",
                "info": "Mostrando la página _PAGE_ de _PAGES_",
                "infoEmpty": "No hay registros disponibles",
                "infoFiltered": "(filtrado de _MAX_ registros totales)",
                "search": "Buscar Cuota:",
                "paginate": {
                    "previous": "Anterior",
                    "next": "siguiente"
                }
            }
        });
        $("form#motizacion_form").submit(function(e) {
            e.preventDefault();
            const formData = new FormData(this);
            $.ajax({
                url: '/deudas/exitedocumento',
                type: 'POST',
                data: formData,
                success: function(data) {
                    if (data.status == 'ok') {
                        window.open(`/generarmotrizacion/${data.iddeuda}`);
                    } else {
                        toastr.error(data.message);
                    }
                },
                cache: false,
                contentType: false,
                processData: false,
            });

        });

        function CargarBusquedaFact() {
            $('#tblBuscarFacturas').DataTable({
                "processing": true,
                "destroy": true,
                "serverSide": true,
                "responsive": true,
                "lengthChange": false,
                "autoWidth": false,
                "select": true,
                "ajax": {
                    'url': '/deudas/ConsultarFactSocios',
                    'headers': {
                        'Content-Type': 'application/json',
                        "X-CSRF-Token": $("meta[name='csrf-token']").attr("content")
                    }
                },
                "columns": [{
                        data: 'id_factura_cab'
                    },
                    {
                        data: 'num_documento'
                    },
                    {
                        data: 'nombre_completo'
                    },
                    {
                        data: 'fecha_ingreso'
                    },
                    {
                        data: 'metodo_pago'
                    },
                    {
                        data: 'total'
                    }
                ],
                "language": {
                    "lengthMenu": "Mostrar _MENU_ registros por página",
                    "zeroRecords": "No se encontró nada - lo siento",
                    "info": "Mostrando la página _PAGE_ de _PAGES_",
                    "infoEmpty": "No hay registros disponibles",
                    "infoFiltered": "(filtrado de _MAX_ registros totales)",
                    "search": "Buscar Socio:",
                    "paginate": {
                        "previous": "Anterior",
                        "next": "siguiente"
                    }
                },

            }).buttons().container().appendTo('#tblBuscarFacturas_wrapper .col-md-6:eq(0)');

            var table = $('#tblBuscarFacturas').DataTable();
            $('#tblBuscarFacturas tbody').on('click', 'tr', function() {
                var row = table.row(this).data();
                CargarDatosFact(row);
            });

        }

        CargarBusquedaFact();


        function CargarDatosFact(item) {

            document.getElementById("numerodoc").value = item.num_documento;
            buscarInformacionMortizacion(item.num_documento);
            $("#modal-Fact").modal('hide');

        }

        $('#busqueda').on('click', function() {
            var table = $('#tblBuscarFacturas').DataTable();
            table.ajax.reload();
            $("#modal-Fact").modal('show');
        })

        function buscarInformacionMortizacion(dataValue) {
            $.ajax({
                url: "/buscarMortizacionGet/" + dataValue,
                type: "GET",

                success: function(data) {
                    if (data.status == "ok") {

                        const rows = dataInformacion.rows().remove().draw();
                        $.each(data.detalle, function(key, value) {
                            dataInformacion.row.add([
                                value.num_cuota,
                                value.monto,
                                value.credito,
                                value.saldo,
                            ]).draw(false);
                        });

                    } else {
                        toastr.error(data.message);
                    }
                },
                cache: false,
                contentType: false,
                processData: false,
            });
        }
    </script>
@stop