@extends('adminlte::page')

@section('title', 'Generar Deudas')

{{-- @section('content_header')
    <h1>Crear Socio</h1>
@stop --}}

@section('content')
    <div style="display:none;" id="loader"></div>
    <div id="DivPrincipal">
        <form id="deuda_form" method="post" enctype="multipart/form-data">
            @csrf
            <div class="container-fluid p-2">
                <div class="row">
                    <!-- left column -->
                    <div class="col-md-6">
                        <h3><i class="fa fa-th" aria-hidden="true"></i> Generación de Deudas</h3>
                    </div>

                    <div class="col-md-6">
                        <br><br>
                        <div class="float-right">
                            <button type="button" class="btn btn-primary" id="busquedaVeh" data-toggle="modal"
                                onclick="CargarBusquedaDeuda()"> <i class="fas fa-search"></i>
                                Buscar
                            </button>
                            {{-- <button type="button" class="btn btn-info" onclick="GrabarDeuda()"> <i class="fas fa-save">
                                    Grabar</i></button> --}}
                            <button type="button" class="btn btn-danger" onclick="limpiarDocumentos()"> <i
                                    class="fas fa-trash">
                                    Limpiar</i></button>
                        </div>

                    </div>
                </div>
            </div>



            <!-- DUALLISTBOX -->
            <div class="card card-primary">
                <div class="card-header">
                    <h3 class="card-title">Seleccionar Socios a Generar Deuda.</h3>
                </div>
                <!-- /.card-header -->
                <div class="card-body">
                    <div class="row">
                        <div class="col-12">
                            <div class="form-group">
                                <label>Socios:</label>
                                <select class="duallistbox" multiple="multiple" id="listSocios" name="listSocios">
                                    {{-- <option selected>Cristian</option> --}}
                                    @foreach ($socios as $socio)
                                        <option value="{{ $socio->IdSocios }}"> {{ $socio->nombre_completo }} </option>
                                    @endforeach
                                </select>
                            </div>
                            <!-- /.form-group -->
                        </div>
                        <!-- /.col -->
                    </div>
                    <!-- /.row -->
                </div>
                <!-- /.card-body -->
                <div class="card-footer">

                </div>
            </div>
            <!-- /.card -->
            <!-- /.DUALLISTBOX -->

            <div class="card card-success">
                <div class="card-header bg-success">
                    <h3 class="card-title">Rubros</h3>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="row">
                                <div class="col-sm-4">
                                    <div class="form-group text-center">
                                        <h4 align="right">A�0�9adir Rubros: </h4>
                                    </div>
                                </div>
                                <div class="col-sm-2">
                                    <div class="form-group">
                                        <button type="button" class="btn btn-light" id="addRubros" name="addRubros"> <i
                                                class="fas fa-plus"></i>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-sm-12">
                            <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="tblRubrosDeuda" class="table table-bordered table-hover">
                                                <thead>
                                                    <tr>
                                                        <th>C��digo</th>
                                                        <th>Rubro</th>
                                                        <th>Precio</th>
                                                        <th>% Desc</th>
                                                        <th>Descuento</th>
                                                        <th>Iva</th>
                                                        <th>Total</th>
                                                    </tr>
                                                </thead>
                                                <tbody id="tbodyRubrosDeuda">
                                                    {{-- <tr>
                                                <td>1</td>
                                                <td>PAGOS MES ABRIL</td>
                                                <td>5,00</td>
                                                <td>0,60</td>
                                                <td>0,00</td>
                                                <td>5,60</td>
                                            </tr>
                                            <tr>
                                                <td>2</td>
                                                <td>PAGO DE OPERACI�0�7N</td>
                                                <td>20,00</td>
                                                <td>4,00</td>
                                                <td>0,00</td>
                                                <td>24,00</td>
                                            </tr> --}}
                                                </tbody>
                                                <tfoot>
                                                    <tr>
                                                        <th></th>
                                                        <th></th>
                                                        <th></th>
                                                        <th></th>
                                                        <th></th>
                                                        <th></th>
                                                        <th class="tfood">0,00</th>
                                                    </tr>
                                                </tfoot>
                                            </table>
                                        </div>
                                        <!-- /.card-body -->
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!--general-->
            <div class="row">
                <!-- general form elements -->
                <div class="col-md-12">
                    <div class="card card-warning">
                        <div class="card-header">
                            <h3 class="card-title">Datos de la Deuda.</h3>

                        </div>
                        <div class="card-body">
                            <input type="text" class="form-control" name='id_deuda_cab' id="id_deuda_cab" hidden="true"
                                value="0">
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>Nombre Deuda:</label>
                                        <input type="text" class="form-control" name='nombre_deuda' id="nombre_deuda"
                                            placeholder="Descripci��n" required>

                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>M��todo de Pago: </label>
                                        <select class="form-control" name='metodo_pago' id="metodo_pago">
                                            <option value="CON">CONTADO</option>
                                            <option selected value="CRE">CR�0�7DITO</option>
                                        </select>
                                    </div>
                                </div>
                                {{-- <div class="col-sm-6">
                                    <div class="form-group">
                                        <label>Estado: </label>
                                        <select class="form-control" name='estado_deuda' id="estado_deuda" disabled="true">
                                            <option selected value="NUE">NUEVO</option>
                                            <option value="PRO">PROCESANDO</option>
                                            <option value="GEN">GENERADO</option>
                                        </select>
                                    </div>
                                </div> --}}
                            </div>

                            <div class="row">
                                
                                <div class="col-sm-3">
                                    <div class="form-group">
                                        <label>Fecha Inicio: </label>
                                        <div class="input-group date" id="reservationdate2" data-target-input="nearest">
                                            <input type="text" class="form-control datetimepicker-input"
                                                id="dateInicio" name="dateInicio" data-target="#reservationdate2" />
                                            <div class="input-group-append" data-target="#reservationdate2"
                                                data-toggle="datetimepicker">
                                                <div class="input-group-text"><i class="fa fa-calendar"></i></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-3">
                                    <div class="form-group">
                                        <label>Rango de dias: </label>
                                        <input type="number" max="30" class="form-control" name='rango_dias'
                                            id="rango_dias" required value="30">
                                    </div>
                                </div>
                                <div class="col-sm-3">
                                    <div class="form-group">
                                        <label>N��mero de Cuotas: </label>
                                        <input type="number" class="form-control" name='num_cuotas' id="num_cuotas"
                                            required value="12">
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="float-left">
                                        <button type="button" class="btn btn-info" id="btnvisualizarDeuda"
                                            name="btnvisualizarDeuda">
                                            <i class="fas fa-cog"> Visualizar Generaci��n Deuda </i>
                                        </button>
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-12">
                                    <br><br>
                                    <div class="float-right">
                                        {{-- <button type="button" class="btn btn-success" id="btnProcesar"
                                            name="btnProcesar" onclick="ProcesarDeuda()"> <i class="fas fa-play-circle">
                                                Procesar</i></button> --}}
                                        <button type="button" class="btn btn-success" onclick="GrabarDeuda()"
                                            id="btnGrabaDeuda" name="btnGrabaDeuda"> <i class="fas fa-play-circle">
                                                Procesar Deuda</i></button>
                                        <button type="button" class="btn btn-danger" onclick="Limpiar()"> <i
                                                class="fas fa-trash">
                                                Limpiar</i></button>
                                    </div>
                                </div>
                            </div>

                        </div>

                    </div>
                </div>


            </div>

        </form>
    </div>
    <!-- /.general-->

    <!-- modal Visualizar Rubros-->
    <div class="modal fade" id="modal-rubros-cuotas">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title"> <i class="fa fa-taxi" aria-hidden="true"></i> Visualizar Deudas </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">
                                    <div class="row justify-content-center">
                                        <div class="col-md-6">
                                            <table id="tblCalculoDeuda" class="table table-bordered table-striped">
                                                <thead>
                                                    <th>Fecha</th>
                                                    <th>Monto</th>
                                                </thead>
                                                <tbody id="bodyCalculoDeuda">

                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </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>

    <!-- /.modal Visualizar Rubros-->

    <!-- modal buscar Deuda-->
    <div class="modal fade" id="modal-buscar-deuda">
        <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 Deudas</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="tblBuscarDeudas" class="table table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th>Codigo</th>
                                                <th>Descripci��n</th>
                                                <th>Estado</th>
                                                <th>Fecha Inicio</th>
                                                <th>Rango Dias</th>
                                                <th>Cuotas</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>
        </div>
    </div>
    <!-- /.modal buscar Deuda-->

    <div class="modal fade" id="modal-xl">
        <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 Rubros</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="tblBuscarRubros" class="table table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th>Codigo Rubro</th>
                                                <th>Descripci��n</th>
                                                <th>Descripci��n Larga</th>
                                                <th>Precio</th>
                                                <th>Aplica Iva</th>
                                                <th>Precio Iva</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>

    <!-- Modal Imprime Recibo-->
    <div class="modal fade" id="modal_imprime_recibo" tabindex="-1" role="dialog"
        aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLongTitle">GENERACI�0�7N DE DEUDA A SOCIO EXITOSA.!</h5>
                    {{-- <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button> --}}
                </div>
                <div class="modal-body">
                    Generacion de Deuda Exitoso. Desea Imprimir el Recibo.?
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal"
                        onclick="NOimprimirCotizacion()">No</button>
                    <button type="button" class="btn btn-primary" onclick="ImprimirCotizacion()">Si</button>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal Imprime Recibo inf-->
    <div class="modal fade" id="modal_imprime_recibo_inf" tabindex="-1" role="dialog"
        aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLongTitle">GENERACI�0�7N DE DEUDAS A SOCIOS EXITOSA.!</h5>
                    {{-- <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button> --}}
                </div>
                <div class="modal-body">
                    Debe Dirigirse al modulo de reporteria e imprimir el recibo..!
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal"
                        onclick="NOimprimirCotizacion()">Aceptar</button>

                </div>
            </div>
        </div>
    </div>
@stop

@section('css')
    <link rel="stylesheet" href="{{ asset('css\mantenimiento\socio\estilos_socio.css') }}">
@stop

@section('js')
    {{-- <script src="{{ asset('js\mantenimientos\Deudas\deudas.js') }}"></script> --}}
    <script>
        // var editor; // use a global for the submit and return data rendering in the examples

        // $(document).ready(function() {
        //     editor = new $.fn.dataTable.Editor( {
        //         table: "#tblRubrosDeuda",
        //         fields: [ {
        //                 label: "Codigo",
        //                 name: "Codigo"
        //             }, {
        //                 label: "Rubro",
        //                 name: "Rubro"
        //             }, {
        //                 label: "Precio",
        //                 name: "Precio"
        //             }, {
        //                 label: "Iva:",
        //                 name: "Iva"
        //             }, {
        //                 label: "Descuento:",
        //                 name: "Descuento"
        //             }, {
        //                 label: "Total",
        //                 name: "Total"
        //             }
        //         ]
        //     } );

        //     // Activate an inline edit on click of a table cell
        //     $('#tblRubrosDeuda').on( 'click', 'tbody td:not(:first-child)', function (e) {
        //         editor.inline( this );
        //     } );
        // } );

        const csrfToken = document.head.querySelector("[name~=csrf-token][content]").content;
        const formulario = document.getElementById("deuda_form");
        var total_rubros = 0;
        var g_set_name_deuda = 0;
        var g_id_factura = 0;

        $(document).ready(function() {
            var now = new Date();

            var day = ("0" + now.getDate()).slice(-2);
            var month = ("0" + (now.getMonth() + 1)).slice(-2);

            var today = (day) + "/" + (month) + "/" + now.getFullYear();

            //$('#reservationdate2').val(today);
            document.getElementById("dateInicio").value = today;
        });

        function SetDatePanelDeuda() {
            var now = new Date();

            var day = ("0" + now.getDate()).slice(-2);
            var month = ("0" + (now.getMonth() + 1)).slice(-2);

            var today = (day) + "/" + (month) + "/" + now.getFullYear();

            //$('#reservationdate2').val(today);
            document.getElementById("dateInicio").value = today;
        }

        $("form#marca_form").submit(function(e) {
            e.preventDefault();
            MostrarLoader();
            // validacion de campos
            //toastr.error("Ingrese un numero de identificaci��n valido.!!");
            const formData = new FormData(this);
            $.ajax({
                url: "/admin/createMarcas",
                type: "POST",
                data: formData,
                success: function(data) {
                    if (data.status == "ok") {
                        toastr.success(data.message);
                        formulario.reset();
                    } else {
                        toastr.error(data.message);
                    }
                    setTimeout(function() {
                        OcultarLoader();
                    }, 100);
                },
                cache: false,
                contentType: false,
                processData: false,
            });
        });

        const Limpiar = () => {
            formulario.reset();
        }

        function GrabarDeuda() {
            var cadenaJsonDeuda = "";
            var nombre_deuda = document.getElementById("nombre_deuda").value;
            var estado_deuda = document.getElementById("estado_deuda").value;
            var metodo_pago = document.getElementById("metodo_pago").value;
            var fecha_inicio = document.getElementById("dateInicio").value;
            var rango_dias = document.getElementById("rango_dias").value;
            var num_cuotas = document.getElementById("num_cuotas").value;

            var lista_socios = ObtenerSociosJson();

            var JsonRubros = ObtenerJsonTable('tblRubrosDeuda');

            //validaciones
            if (verificarValue(nombre_deuda, 'S')) {
                toastr.error('ingrese una descripci��n.');
                return;
            }
            if (verificarValue(estado_deuda, 'S')) {
                toastr.error('ingrese un estado.');
                return;
            }
            if (verificarValue(metodo_pago, 'S')) {
                toastr.error('seleccione un metodo de pago.');
                return;
            }
            if (verificarValue(fecha_inicio, 'S')) {
                toastr.error('seleccione una fecha de inicio.');
                return;
            }
            if (metodo_pago == 'CRE') {
                if (verificarValue(rango_dias, 'I')) {
                    toastr.error('ingrese un rango de dias.');
                    return;
                }
                if (verificarValue(num_cuotas, 'I')) {
                    toastr.error('seleccione un n��mero de cuota.');
                    return;
                }
            }
            if (verificarValue(lista_socios, 'O')) {
                toastr.error('debe cargar un socio.');
                return;
            }
            if (verificarValue(JsonRubros, 'O')) {
                toastr.error('debe cargar un Rubro.');
                return;
            }


            var myObjet = {};
            myObjet.nombre_deuda = nombre_deuda;
            myObjet.estado_deuda = estado_deuda;
            myObjet.metodo_pago = metodo_pago;
            myObjet.fecha_inicio = fecha_inicio;
            myObjet.rango_dias = rango_dias;
            myObjet.num_cuotas = num_cuotas;
            myObjet.socios = lista_socios;
            myObjet.rubros = JsonRubros;

            //console.log(JSON.stringify(myObjet));
            cadenaJsonDeuda = JSON.stringify(myObjet);


            $.ajax({
                url: "/deudas/GrabarDeuda",
                type: "POST",
                data: cadenaJsonDeuda,
                headers: {
                    'Content-Type': 'application/json',
                    "X-CSRF-Token": csrfToken
                },
                success: function(data) {
                    OcultarLoader();
                    if (data.status == "ok") {
                        ProcesarDeuda(data.id_deuda_cab);
                        //toastr.success(data.message);
                    } else {
                        toastr.error(data.message);
                    }
                },
                cache: false,
                contentType: false,
                processData: false,
            });

        }

        function verificarValue(cadena, modo) {
            var bool = false;

            switch (modo) {
                case 'S':
                    if (cadena.length <= 0) {
                        bool = true;
                    }
                    break;

                case 'I':
                    if (cadena <= 0) {
                        bool = true;
                    }
                    break;
                case 'O':
                    if (Object.entries(cadena).length === 0) {
                        bool = true;
                    }
                    break;
                default:
                    break;
            }

            return bool;
        }

        function ObtenerSociosJson() {
            var lista_socios = [];
            var index = 0;
            for (var option of document.getElementById('listSocios').options) {
                if (option.selected) {
                    //lista_socios.push(option.value);
                    lista_socios[index] = {};
                    lista_socios[index]['id_socio'] = option.value;
                    index++;
                }
            }
            return lista_socios;
        }

        function ObtenerJsonTable(nombreTabla) {
            var myRows = [];
            var head = "#" + nombreTabla + " th";
            var $headers = $(head);
            var table = "#" + nombreTabla + " tbody tr";
            var $rows = $(table).each(function(index) {
                $cells = $(this).find("td");
                myRows[index] = {};
                $cells.each(function(cellIndex) {
                    switch ($($headers[cellIndex]).html()) {
                        case '% Desc':
                            myRows[index]['porc_desc'] = $('.ValorDescuento', this).val();
                            break;
                        case 'Precio':
                            myRows[index][$($headers[cellIndex]).html()] = $('.precio', this).val();
                            break;
                        default:
                            myRows[index][$($headers[cellIndex]).html()] = $(this).html();
                            break;
                    }
                    // var ValorDescuento = $('.ValorDescuento', $tr).val();
                    //console.log();

                });
            });
            var myObj = {};
            myObj.tableDeudas = myRows;
            //alert(JSON.stringify(myObj));
            //return JSON.stringify(myObj);
            return myRows;
        }





        $('#btnvisualizarDeuda').on('click', function() {

            var metodo_pago = document.getElementById("metodo_pago").value;
            var fecha_inicio = document.getElementById("dateInicio").value;
            var rango_dias = document.getElementById("rango_dias").value;
            var num_cuotas = document.getElementById("num_cuotas").value;
            var total = total_rubros;
            var JsonRubros = ObtenerJsonTable('tblRubrosDeuda');

            if (metodo_pago != 'CRE') {
                toastr.error('El m��todo de pago debe ser Credito');
                $("#bodyCalculoDeuda").empty();
                return;
            }

            if (verificarValue(rango_dias, 'I')) {
                toastr.error('el rango de dias debe ser mayor a 0.');
                return;
            }
            if (verificarValue(num_cuotas, 'I')) {
                toastr.error('la cuota debe ser mayor a 0.');
                return;
            }
            if (verificarValue(JsonRubros, 'O')) {
                toastr.error('debe cargar un Rubro.');
                return;
            }

            var totalDivido = (total / num_cuotas).toFixed(2);
            var fechaI = ConvertStringDate(fecha_inicio);

            $("#bodyCalculoDeuda").empty();
            //$("").find("tr:gt(0)").remove();

            //var cadena ="";
            for (var i = 1; i <= parseInt(num_cuotas); i++) {

                //cadena += '<tr id="row' + i + '"><td>' + format(fechaI) + '</td>'+'<td>' + totalDivido + '</td>'+'</tr>';
                $("#tblCalculoDeuda>tbody").append('<tr id="row' + i + '"><td>' + format(fechaI) + '</td>' +
                    '<td>' + totalDivido + '</td>' + '</tr>');
                fechaI = sumarDias(fechaI, parseInt(rango_dias));
            }

            $("#modal-rubros-cuotas").modal('show');

        });

        function sumarDias(fecha, dias) {
            fecha.setDate(fecha.getDate() + dias);
            return fecha;
        }

        function format(inputDate) {
            let fecha = new Date(inputDate);
            let date, month, year;

            date = fecha.getDate() + 1;
            month = fecha.getMonth() + 1;
            year = fecha.getFullYear();

            date = date
                .toString()
                .padStart(2, '0');

            month = month
                .toString()
                .padStart(2, '0');

            return `${date}/${month}/${year}`;
        }

        function ConvertStringDate(str) {
            //const str = '28/06/2022';
            const [day, month, year] = str.split('/');
            // console.log(day); // 28
            // console.log(month); // 06
            // console.log(year); // 2022
            var date = new Date(+year, +month - 1, +day);
            return date;
        }


        function CargarBusquedaRubros() {
            $('#tblBuscarRubros').DataTable({
                "processing": true,
                "serverSide": true,
                "responsive": true,
                "lengthChange": false,
                "autoWidth": false,
                "select": true,
                //"ajax": "{{ url('/buscarVehiculos') }}",
                "ajax": {
                    'url': 'consultarRubrosActivos',
                    'headers': {
                        'Content-Type': 'application/json',
                        "X-CSRF-Token": csrfToken
                    }
                },
                "columns": [{
                        data: 'id_item'
                    },
                    {
                        data: 'descripcion'
                    },
                    {
                        data: 'descripcion_larga'
                    },
                    {
                        data: 'precio'
                    },
                    {
                        data: 'aplica_iva'
                    },
                    {
                        data: 'iva'
                    }
                ],
                "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 Rubros:",
                    "paginate": {
                        "previous": "Anterior",
                        "next": "siguiente"
                    }
                },
                "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
            }).buttons().container().appendTo('#tblBuscarVehiculos_wrapper .col-md-6:eq(0)');

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

            });
        }

        CargarBusquedaRubros();

        $('#addRubros').on('click', function() {
            $("#modal-xl").modal('show');
        })

        function CargarDatosSelect(item) {

            $("#modal-xl").modal('hide');
            var Precio = item.precio;
            var id_item = item.id_item;
            var aplica_iva = item.aplica_iva;
            var Rubro = item.descripcion;
            var Iva = item.iva;
            var descuento = 0;
            var porcDescuento = 0;
            var total = (Precio - descuento + Iva).toFixed(2);

            var rowPrecio = '<td width="100"><input type="number" value="' + Precio +
                '" class="form-control form-control-border precio" ></td>';
            var rowPorcDescuento = '<td width="90"><input type="number" value="' + porcDescuento +
                '" class="form-control form-control-border ValorDescuento" ></td>';
            var rowDescuento = '<td width="90"><input type="number" value="' + descuento +
                '" class="form-control form-control-border" ></td>';
            var rowDelete =
                '<td width="50"> <button type="button" class="btn btn-danger" onclick="elimnarRowRubros(this)" ><i class="fa fa-trash"> </i> </button> </td>';



            $("#tblRubrosDeuda>tbody").append('<tr id="row' + id_item + '"><td width="100" >' + id_item + '</td>' + '<td>' +
                Rubro + '</td>' + rowPrecio + rowPorcDescuento + '<td width="100" class="descuento">' + 0.00 + '</td>' +
                '<td width="100" class="iva">' + Iva + '</td>' + '<td width="100" class="total2">' + total + '</td>' +
                rowDelete + '</tr>');

            CalcularTotalRubros("tblRubrosDeuda");
            SetNameFirstDeuda(item.descripcion);
        }

        $('#tblRubrosDeuda').on('keyup', '.ValorDescuento', function(e) {
            if (e.which == 13) {
                CalcularTableRubros(this);
                CalcularTotalRubros("tblRubrosDeuda");
            }
        });

        $('#tblRubrosDeuda').on('keyup', '.precio', function(e) {
            if (e.which == 13) {
                CalcularTableRubros(this);
                CalcularTotalRubros("tblRubrosDeuda");
            }
        });

        $("#tblRubrosDeuda").on('change', '.ValorDescuento', function(e) {
            CalcularTableRubros(this);
            CalcularTotalRubros("tblRubrosDeuda");
        })

        $("#tblRubrosDeuda").on('change', '.precio', function(e) {
            CalcularTableRubros(this);
            CalcularTotalRubros("tblRubrosDeuda");
        })

        function SetNameFirstDeuda(name) {
            if (g_set_name_deuda <= 0) {
                document.getElementById("nombre_deuda").value = name;
            }

            g_set_name_deuda = 1;
        }

        function CalcularTableRubros(table) {
            var $tr = $(table).closest('tr');
            //var precio = $('.precio', $tr).text();
            var precio = $('.precio', $tr).val();
            var ValorDescuento = $('.ValorDescuento', $tr).val();
            var descuento = $('.descuento', $tr).text();
            var total = $('.total2', $tr).text();
            var iva = $('.iva', $tr).text();

            //console.log(precio+" ",ValorDescuento," ",total," ",descuento);
            //calculamos descuento
            var auxdesc = (precio * (ValorDescuento / 100)).toFixed(2);
            $('.descuento', $tr).text(auxdesc);

            var Subtotal = (precio - auxdesc).toFixed(2);
            //calculamos el iva
            var ivaNew = 0;
            if (iva > 0) {
                ivaNew = ((Subtotal) * (12 / 100)).toFixed(2);
            } else {
                ivaNew = 0;
            }
            $('.iva', $tr).text(ivaNew);

            //calculamos el total
            var totalNew = (parseFloat(Subtotal) + parseFloat(ivaNew)).toFixed(2);
            $('.total2', $tr).text(totalNew);
        }

        function CalcularTotalRubros(nombreTabla) {
            var myRows = [];
            var head = "#" + nombreTabla + " th";
            var $headers = $(head);
            var table = "#" + nombreTabla + " tbody tr";
            var total = 0;
            var $rows = $(table).each(function(index) {
                $cells = $(this).find("td");
                myRows[index] = {};
                $cells.each(function(cellIndex) {
                    switch ($($headers[cellIndex]).html()) {
                        case 'Total':
                            total += parseFloat($(this).html());
                            // if ($.isNumeric(parseFloat(total))) {
                            //     total += parseFloat(total);
                            // }
                            break;
                    }
                });
            });
            total_rubros = total.toFixed(2);
            let index = $(this).parents('tr').find('.total2').index(this);
            $('.tfood').eq(index).html(total.toFixed(2));
        }

        function elimnarRowRubros(table) {
            //document.getElementsByTagName("tr")[2].remove();
            var $tr = $(table).closest('tr');
            $($tr).remove();

            CalcularTotalRubros("tblRubrosDeuda");
        }

        function CargarBusquedaDeuda() {
            var table = $('#tblBuscarDeudas').DataTable();
            table.ajax.reload();
            $("#modal-buscar-deuda").modal('show');

        }

        function CargarDeudas() {
            $('#tblBuscarDeudas').DataTable({
                "processing": true,
                "serverSide": true,
                "responsive": true,
                "lengthChange": false,
                "autoWidth": false,
                "select": true,
                //"ajax": "{{ url('/buscarVehiculos') }}",
                "ajax": {
                    'url': '/deudas/consultarDeudas',
                    'headers': {
                        'Content-Type': 'application/json',
                        "X-CSRF-Token": csrfToken
                    }
                },
                "columns": [{
                        data: 'id_deuda_cab'
                    },
                    {
                        data: 'descripcion'
                    },
                    {
                        data: 'estado'
                    },
                    {
                        data: 'metodo_pago'
                    },
                    {
                        data: 'fecha_inicio'
                    },
                    {
                        data: 'rango_plazo'
                    },
                    {
                        data: 'num_cuotas'
                    }
                ],
                "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 Deuda:",
                    "paginate": {
                        "previous": "Anterior",
                        "next": "siguiente"
                    }
                },
                "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
            }).buttons().container().appendTo('#tblBuscarDeudas_wrapper .col-md-6:eq(0)');

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

            });
        }

        CargarDeudas();

        function getSociosDeuda(id_deuda) {
            $.ajax({
                url: "/deudas/consultarSociosDeudas",
                type: "POST",
                data: JSON.stringify({
                    id_deuda_cab: id_deuda
                }),
                headers: {
                    'Content-Type': 'application/json',
                    "X-CSRF-Token": csrfToken
                },
                success: function(data) {
                    OcultarLoader();
                    if (data.status == "ok") {
                        for (var optiona of document.getElementById('listSocios').options) {
                            for (var optionb of data.object) {
                                if (parseInt(optiona.value) == parseInt(optionb.id_socio)) {
                                    $("#listSocios option[value='" + optiona.value + "']").attr("selected",
                                        true).change();
                                    $("#listSocios").bootstrapDualListbox('refresh');
                                    continue;
                                }
                            }
                        }
                    } else {
                        toastr.error("Se ha producido un error al cargar socios!!");
                    }
                },
                cache: false,
                contentType: false,
                processData: false,
            });
        }

        function CargarDatosDeudas(item) {

            var id_deuda = item.id_deuda_cab;
            console.log('CargarDatosDeudas');
            console.log(item.estado);
            document.getElementById("id_deuda_cab").value = item.id_deuda_cab;
            document.getElementById("nombre_deuda").value = item.descripcion;
            $("#metodo_pago").val(item.metodo_pago).change();
            $("#estado_deuda").val(item.estado).change();
            document.getElementById("dateInicio").value = format(item.fecha_inicio);
            document.getElementById("rango_dias").value = item.rango_plazo;
            document.getElementById("num_cuotas").value = item.num_cuotas;

            getSociosDeuda(id_deuda);
            getRubrosDeusa(id_deuda);


            $("#modal-buscar-deuda").modal('hide');
            CalcularTotalRubros("tblRubrosDeuda");
            ocultarOpciones();
        }

        function getRubrosDeusa(id_deuda) {
            $.ajax({
                url: "/deudas/consultarRubrosDeudas",
                type: "POST",
                data: JSON.stringify({
                    id_deuda_cab: id_deuda
                }),
                headers: {
                    'Content-Type': 'application/json',
                    "X-CSRF-Token": csrfToken
                },
                success: function(data) {
                    OcultarLoader();
                    if (data.status == "ok") {
                        $("#tbodyRubrosDeuda").empty();

                        for (var option of data.object) {
                            var rowPrecio = '<td width="100"><input type="number" value="' + option.subtotal +
                                '" class="form-control form-control-border precio" ></td>';
                            var rowPorcDescuento = '<td width="90"><input type="number" value="' + option
                                .porc_descuento +
                                '" class="form-control form-control-border ValorDescuento" ></td>';
                            var rowDescuento = '<td width="90"><input type="number" value="' + option
                                .descuento + '" class="form-control form-control-border" ></td>';
                            var rowDelete =
                                '<td width="50"> <button type="button" class="btn btn-danger" onclick="elimnarRowRubros(this)" ><i class="fa fa-trash"> </i> </button> </td>';

                            $("#tblRubrosDeuda>tbody").append('<tr id="row' + option.id_deuda_det +
                                '"><td width="100" >' + option.id_item + '</td>' + '<td>' + option
                                .descripcion + '</td>' + rowPrecio + rowPorcDescuento +
                                '<td width="100" class="descuento">' + option.descuento + '</td>' +
                                '<td width="100" class="iva">' + option.iva + '</td>' +
                                '<td width="100" class="total2">' + option.total + '</td>' + rowDelete +
                                '</tr>');
                        }

                        CalcularTotalRubros("tblRubrosDeuda");
                    } else {
                        toastr.error("Se ha producido un error al cargar rubros!!");
                    }
                },
                cache: false,
                contentType: false,
                processData: false,
            });

        }


        function ocultarOpciones() {
            var id_deuda = document.getElementById("id_deuda_cab").value;
            var estado_deuda = document.getElementById("estado_deuda").value;
            if (id_deuda > 0) {
                if (estado_deuda == 'NUE') {
                    //document.getElementById('btnProcesar').style.visibility = 'visible';
                    document.getElementById('btnGrabaDeuda').style.visibility = 'visible';
                } else {
                    //document.getElementById('btnProcesar').style.visibility = 'hidden';
                    document.getElementById('btnGrabaDeuda').style.visibility = 'hidden';
                }

            } else {
                //document.getElementById('btnProcesar').style.visibility = 'hidden';
            }
        }

        ocultarOpciones();

        function ProcesarDeuda(p_id_deuda) {
            //var id_deuda = parseInt(document.getElementById("id_deuda_cab").value);
            var id_deuda = p_id_deuda;
            if (id_deuda <= 0) {
                toastr.error('Se produjo un error al procesar la Deuda');
                return;
            }

            var metodo_pago = document.getElementById("metodo_pago").value;
            var fecha_inicio = document.getElementById("dateInicio").value;
            var rango_dias = document.getElementById("rango_dias").value;
            var num_cuotas = document.getElementById("num_cuotas").value;
            var total = total_rubros;
            var JsonRubros = ObtenerJsonTable('tblRubrosDeuda');

            var jsonCuotas = {};
            if (metodo_pago =='CRE') {
                if (verificarValue(rango_dias, 'I')) {
                    toastr.error('el rango de dias debe ser mayor a 0.');
                    return;
                }
                if (verificarValue(num_cuotas, 'I')) {
                    toastr.error('la cuota debe ser mayor a 0.');
                    return;
                }
                if (verificarValue(JsonRubros, 'O')) {
                    toastr.error('debe cargar un Rubro.');
                    return;
                }

                var totalDivido = (total / num_cuotas).toFixed(2);
                var fechaI = ConvertStringDate(fecha_inicio);

                var myFechasList = [];
                for (var i = 0; i < parseInt(num_cuotas); i++) {
                    myFechasList[i] = {};


                    myFechasList[i]['fecha'] = format(fechaI);
                    myFechasList[i]['monto'] = totalDivido;

                    fechaI = sumarDias(fechaI, parseInt(rango_dias));
                }

                // var jsonCuotas = {};
                // jsonCuotas.tablecuotas = myFechasList;
                jsonCuotas = JSON.stringify(myFechasList);
            }

            //obtenemos valores a enviar
            var myObjet = {};
            myObjet.id_deuda_cab = id_deuda;
            myObjet.json_cuotas = jsonCuotas;

            $.ajax({
                url: "/deudas/procesarSociosCuotas",
                type: "POST",
                data: JSON.stringify(myObjet),
                headers: {
                    'Content-Type': 'application/json',
                    "X-CSRF-Token": csrfToken
                },
                success: function(data) {
                    OcultarLoader();
                    if (data.status == "ok") {
                        var count_socios = data.count_socios;
                        if (count_socios == 1) {
                            g_id_factura = data.id_factura;
                            $("#modal_imprime_recibo").modal('show');
                        } else {
                            $("#modal_imprime_recibo_inf").modal('show');
                        }
                        toastr.success("Se han generado las cuotas a los socios!!");
                    } else {
                        toastr.error("Se ha producido un error al cargar socios!!");
                    }
                },
                cache: false,
                contentType: false,
                processData: false,
            });

        }
        //Ejemplo 1
        //Se ejecuta si se cambia la cantidad con los n��meros del teclado
        // $("#tblRubrosDeuda tbody").keyup(function (e) {
        //     console.log('teclado');
        //     let total = 0;
        //     //Captura la posici��n de la columna en la que se est�� haciendo el cambio
        //     let index = $(this).parents('tr').find('.cantidad').index(this);
        //     //Captura el valor que hay en cada celda
        //     $("tblRubrosDeuda tbody tr").each(function (i, row) {
        //         let cantidad = $(row).find('td').eq(index + 1).find('.cantidad').val();
        //         //Si el valor es num��rico se hace la suma para evitar que muestre NaN en el total cuando las cantidades est��n vac��as
        //         if ($.isNumeric(parseFloat(cantidad))) {
        //             total = parseInt(total) + parseInt(cantidad)
        //         }
        //     });
        //     //Se asigna la suma al total correspondiente
        //     $('.total').eq(index).html(total);
        // });


        //Ejemplo 2
        //Se ejecuta si se cambia la cantidad con los controles del campo de tipo number
        $("#tblRubrosDeuda .cantidad").change(function() {
            console.log('chang');
            let total = 0;
            let index = $(this).parents('tr').find('.cantidad').index(this);
            $("tblRubrosDeuda tbody tr").each(function(i, row) {
                let cantidad = $(row).find('td').eq(index + 1).find('.cantidad').val();
                if ($.isNumeric(parseFloat(cantidad))) {
                    total = parseInt(total) + parseInt(cantidad)
                }
            });
            $('.total').eq(index).html(total);
        });

        function ImprimirCotizacion() {
            //window.open("/cotizacionpdf/" + codigo_cotizacion );
            window.open("/pdf-recibopdf/" + g_id_factura);
            $("#modal_imprime_cotizacion").modal('hide');
            g_id_factura = 0;
            setTimeout(function() {
                location.reload();
            }, 1000);
        }

        function NOimprimirCotizacion() {
            g_id_factura = 0;
            setTimeout(function() {
                location.reload();
            }, 1000);
        }
        const verificarPdf = (tipo) => {
            console.log($('#id_socio').val());
            if ($('#id_socio').val() == "") {
                toastr.error("Escoja el usuario.!!");
            } else {
                window.open("/mostrarArchivo/" + $('#id_socio').val() + "/" + tipo);
            }
        }
        const limpiarDocumentos = () => {
            location.reload();
        }
        //Bootstrap Duallistbox
        $('.duallistbox').bootstrapDualListbox({
            infoText : 'Total Socios {0}',
            infoTextEmpty : 'Lista Vacia',
            filterPlaceHolder : 'Buscar Socio'
        })

        $('#example2').DataTable({
            "paging": true,
            "lengthChange": false,
            "searching": false,
            "ordering": true,
            "info": true,
            "autoWidth": false,
            "responsive": true,
        });

        $('#reservationdate').datetimepicker({
            format: 'DD/MM/YYYY'
        });

        $('#reservationdate2').datetimepicker({
            format: 'DD/MM/YYYY'
        });

        $('#reservationdate3').datetimepicker({
            format: 'DD/MM/YYYY'
        });

        var valCheked = document.getElementById("metodo_pago");
        valCheked.addEventListener('change', function() {
            var valor = document.getElementById("metodo_pago").value;
            if (valor == 'CRE') {
                document.getElementById("rango_dias").value = 30;
                document.getElementById("num_cuotas").value = 12;
                SetDatePanelDeuda();

                document.getElementById("rango_dias").disabled = false;
                document.getElementById("num_cuotas").disabled = false;
                document.getElementById("dateInicio").disabled = false;
            } else
            if (valor == 'CON') {
                document.getElementById("rango_dias").value = 0;
                document.getElementById("num_cuotas").value = 0;
                SetDatePanelDeuda();

                document.getElementById("rango_dias").disabled = true;
                document.getElementById("num_cuotas").disabled = true;
                document.getElementById("dateInicio").disabled = true;
            }
        });
    </script>
@stop