@extends('layouts.app')

@section('content')
    <!-- end sidebar menu -->
    <!-- start page content -->
    <div class="page-content-wrapper">
        <div class="page-content">
            <div class="page-bar">
                <div class="page-title-breadcrumb">
                    <div class="pull-left">
                        <div class="page-title text-primary">Pago Manual</div>
                    </div>
                    <ol class="breadcrumb page-breadcrumb pull-right">
                        <li><i class="fa fa-home"></i>&nbsp;<a class="parent-item" href="{{ url('/dashboard') }}">Inicio</a>&nbsp;<i class="fa fa-angle-right"></i>
                        </li>
                        <li>Débito Automático&nbsp;<i class="fa fa-angle-right"></i></li>

                        <li class="active">Pago Manual</li>
                    </ol>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12 col-sm-12 mb-3">
                    <div class="float-right">
                        <a data-toggle="modal" data-target="#modal_adelantar_cobros" class="btn btn-info"><i class="fa fa-random"></i>Adelantar Cobros</a>    
                        <a onclick="limpiar()" class="btn btn-primary"><i class="fa fa-eraser"></i>Limpiar</a>    
                    </div>
                </div>
            </div>
            <!-- start widget -->
            <!-- start admited patient list -->
            <div class="row">
                <div class="col-md-12 col-sm-12">
                    <div class="card  card-box">
                        <div class="card-head">
                            <header>Información Basica</header>
                        </div>
                         @if(isset($edit))
                            {!! Form::model($edit,['url' => ['puesto/actualizar/'.$edit->puesto_id],'method'=>'PATCH','id'=>'frmClientes']) !!}
                        @else
                            {!! Form::open(['url' => 'puesto','method'=>'POST','role'=>'form','id'=>'frmContratos']) !!}
                        @endif
                        <div class="card-body">
                            <div class="row col-md-12">
                                {!! Form::mselect('cliente',[],null,'Cliente',$errors,6,false,true,false,'consultar_contrato()') !!}

                               {{--  {!! Form::mselect('contrato',[],null,'Contrato',$errors,6,false,true,false,'consultar_servicios()') !!} --}}
                                {!! Form::mselect('contrato',[],null,'Contrato',$errors,6,false,true,false) !!}
                            </div>
                            <div class="row col-md-12">
                                {{-- {!! Form::mselect('servicio',[],null,'Servicio',$errors,6,false,true,false,'consultar_valor()') !!} --}}
                                {!! Form::mselect('servicio',[],null,'Servicio',$errors,6,false,true,false,'consultar_valor()') !!}

                                <!--{!! Form::mMonedaFormato('valor',null,'Valor',$errors,6) !!}-->
                                <div class="col-md-6">
                                <!--{!! Form::mMonedaFormato('valor', null, 'Saldo', $errors, 6, ['readonly' => 'readonly']) !!}-->
                                <label class="form-control-label text-color-dark" for="valor">Saldo<span class="text-danger">*</span></label>
                                <input class="form-control maskMoney" placeholder="Saldo" id="valor" name="valor" type="text"  readonly data-thousands="." data-decimal="," data-prefix="₡ ">
                                </div>
                            </div>
                        </div>
                        {!! Form::close() !!}
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12 col-sm-12">
                    <div  id="alerta_cobro" style="display:none">
                        <input type="hidden" name="tiene_mora" id="tiene_mora">
                        <input type="hidden" name="contrato_id" id="cobro_contrato_id">
                        <input type="hidden" name="" id="cobro_contrato_servicio_id">
                        <div class="alert alert-warning d-flex align-items-center" role="alert">
                          <div>
                            <i class="fa fa-exclamation-circle"></i> El cliente tiene cobros pendientes de pago para este servicio.
                          </div>
                        </div>
                    </div>
                    <div id="info_cobro" style="display:none">
                        <div class="alert alert-primary d-flex align-items-center" role="alert" >
                          <div>
                            <i class="fa fa-exclamation-triangle"></i> El cliente no tiene cobros pendientes de pago para este servicio.
                          </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row" id="cobros_pendientes" style="display:block">
                <div class="col-md-12 col-sm-12">
                    <div class="card  card-box">
                        <div class="card-head">
                            <header>Cobros Pendientes</header>
                        </div>
                        <div class="card-body">
                            <div class="row col-md-12">
                                <div class="table-responsive">
                                    <table class="table table-wrap">
                                        <thead>
                                            <tr>
                                                <th>#</th>
                                                <th>Contrato</th>
                                                <th>Cuota</th>
                                                <th>Concepto</th>
                                                <th>Recibo Asociado</th>
                                                <th>Valor</th>
                                                <th></th>
                                            </tr>
                                        </thead>
                                        <tbody id="rowsCobros">
                                            
                                        </tbody>
                                        <tfooter>
                                            <tr>
                                                <td colspan="5" class="text-right"><strong>TOTAL COBROS</strong></td>
                                                <input type="hidden" name="total_cobros" id="total_cobros" value="0">
                                                <td>₡<span id="total_cobro">0.00</span></td>
                                            </tr>
                                        </tfooter>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="row">
                <div class="col-md-12 col-sm-12">
                    <div class="card  card-box">
                        <div class="card-head">
                            <header>Medio de Pago</header>
                        </div>
                         @if(isset($edit))
                            {!! Form::model($edit,['url' => ['puesto/actualizar/'.$edit->puesto_id],'method'=>'PATCH','id'=>'frmClientes']) !!}
                        @else
                            {!! Form::open(['url' => 'puesto','method'=>'POST','role'=>'form','id'=>'frmContratos']) !!}
                        @endif
                            <input type="hidden" name="" id="is_cobro_padre">
                        <div class="card-body">
                            <div class="row col-md-12">
                                <div class="table-responsive">
                                    <table class="table table-wrap" id="tbl_metodos">
                                        <thead>
                                            <tr>
                                                <th width="50%">Medio de Pago</th>
                                                <th width="20%">Comprobante</th>
                                                <th width="20%">Valor</th>
                                                <th width="10%">Acciones</th>
                                            </tr>
                                            <tr>
                                                <th>
                                                    {!! Form::mselect('medio_pago',$medios_pagos,null,'Seleccionar',$errors,12,false,true,false,'requerir_comprobante()') !!}
                                                </th>
                                                <th>
                                                    {!! Form::mtext('comprobante',null,'',$errors,12,false,true,[['disabled'=>'disabled ']]) !!}
                                                </th>
                                                <th><br>
                                                    {!! Form::mMonedaFormato('valor_cobrar',null,'Valor',$errors,12,false,false) !!}
                                                </th>
                                                <th>
                                                    <a onclick="agrega_medio()" class="btn btn-primary"><i class="fa fa-plus"></i>Agregar Medio</a>
                                                </th>
                                            </tr>
                                        </thead>
                                        <tbody id="rowMedios">
                                            
                                        </tbody>
                                        <tfooter>
                                            <tr>
                                                <td colspan="3" class="text-right">TOTAL PAGADO</td>
                                                <input type="hidden" name="total_pagado" id="total_pagado" value="0">
                                                <td>₡<span id="s_total_pagado">0.00</span></td>
                                            </tr>
                                            <tr>
                                                <td colspan="3" class="text-right">DIFERENCIA</td>
                                                <input type="hidden" name="diferencia" id="diferencia" value="0">
                                                <td><span id="s_diferencia">0.00</span></td>
                                            </tr>
                                        </tfooter>
                                    </table>
                                </div>
                            </div>
                            <div class="row col-md-12"><br>
                                {!! Form::mtextAr('descripcion',isset($edit) ? $edit->puesto_descripcion : null,'Descripción',$errors,5,false,false,'onkeyup="javascript:this.value=this.value.toUpperCase()"') !!}

                                {!! Form::mDate('inicio',date('Y-m-d'),'Fecha de Pago',$errors,5) !!}

                                <div class="col-2">
                                    <a class="btn bg-success text-white btn-lg" onclick="alertNoRegistraPago()" id="payRegisterDisabled"><i class="fa fa-save"></i>Registrar Pago</a>
                                    @if (auth()->user()->hasPermissionTo('aplicarPagoManual_Debito'))                                        
                                        <a class="btn bg-success text-white btn-lg" onclick="registrar_pago()" id="payRegisterEnabled"><i class="fa fa-save"></i>Registrar Pago</a>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <input type="hidden" name="" id="forma_pago_manual_modulo" value="2">
                        <!-- Débito Automático==2-->

                        {!! Form::close() !!}
                    </div>
                </div>
            </div>
        </div>
    </div>
<!----Adelantar cobros------>
<div class="modal fade" id="modal_adelantar_cobros" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" style="display: none;" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header bg-info">
        <h4 class="modal-title text-white" id="exampleModalLabel"><i class="fa fa-random"></i> Adelantar Cobros</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="row col-md-12">
            <p>
                Seleccione los contratos del cliente sobre los cuales desea adelantar saldo, adicional mente indique el numero de cobros que desea adelantar.
            </p>
        </div>
        <div class="row col-md-12">
            <div class="col-md-6">
                {!! Form::select('modale_contratos',[],null,['class'=>'form-control','id'=>'modale_contratos']) !!}    
            </div>
            {!! Form::mNumber('procentaje_interes_serv',null,'',$errors,6,false,false) !!}
        </div>
      </div>
      <div class="modal-footer text-center">
        <input type="hidden" name="id_registro" id="id_registro" value="">
        <button onclick="generar_cobros()" type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-random"></i> Generar Cobros</button>
        <button type="button" class="btn btn-warning" data-dismiss="modal"><i class="fa fa-times"></i> Cancelar</button>
      </div>
    </div>
  </div>
</div>
<!----condonar cobros------>
<div class="modal fade" id="modal_condonar_cobros" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" style="display: none;" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header bg-info">
        <h4 class="modal-title text-white" id="exampleModalLabel"><i class="fa fa-thumbs-o-up"></i> Condonar Cobro</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="row col-md-12">
            <p>
                Si realmente desea condonar el cobro seleccionado, por favor especifique el motivo de la condonación.
            </p>
        </div>
        <div class="row col-md-12">
            {!! Form::mtextAr('motivo',null,'Motivo de la condonación...',$errors,12,false) !!}
        </div>
      </div>
      <div class="modal-footer text-center">
        <input type="hidden" name="id_registro" id="id_registro" value="">
        <button onclick="condonar_cobro()" type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-thumbs-o-up"></i> Condonar Cobro</button>
        <button type="button" class="btn btn-warning" data-dismiss="modal"><i class="fa fa-times"></i> Cancelar</button>
      </div>
    </div>
  </div>
</div>
<!----Ver detalle cobros------>
<div class="modal fade" id="modal_detalle_cobros" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" style="display: none;" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title" id="exampleModalLabel">Ver Detalle Cobro</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="row col-md-12">
            <div class="float-right">
                <strong>Concepto: </strong> M/DICIEMBRE - APERTURA NICHO +IVA + FINANCIACIÓN<br>
                <strong>Fecha aplicación: </strong>2021-12-01
            </div>
        </div>
        <div class="row col-md-12">
            <div class="text-center">
                <strong><h4>APERTURA NICHO +IVA + FINANCIACIÓN (Por Cobrar - Cobro Principal)</h4></strong>
            </div>
        </div>
        <div class="row col-md-12">
            <div class="table-responsive">
                <table class="table table-hover">
                    <thead>
                        <tr>
                            <th>#</th>
                            <th>Concepto</th>
                            <th>Producto o Servicio Cobrado</th>
                            <th>Valor Cobrado</th>
                            <th>Valor Pagado</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
      </div>
      <div class="modal-footer text-center">
        <input type="hidden" name="id_registro" id="id_registro" value="">
        <button type="button" class="btn btn-warning" data-dismiss="modal"><i class="fa fa-times"></i> Cerrar</button>
      </div>
    </div>
  </div>
</div>
@endsection
@section('script')
@include('modals.informacion_cobro')

<script>

$(document).ready(function () {

$("#valor").maskMoney().maskMoney('mask');
$("#valor").on('blur', function() {
        $(this).maskMoney('mask');
    });

$("#valor_cobrar").on('blur', function() {
        $(this).maskMoney('mask');
    });
$('#payRegisterDisabled').hide()


//Initialize Select2 Elements
$('.select2').select2()

//cliente
$('#cliente').select2({
    ajax: {
        dataType: 'json',
        url: "{{asset('').'cliente/data/ajax'}}",
        delay: 250,
        minimumInputLength: 3,
        data: function(params) {       
                var query = {
                    search: params.term.toLowerCase(),
                    page: params.page || 1
                }
                console.log(query);
                return query;
        },
        processResults: function (data, page) {
            console.log(data);
            return {
            results: data
            };
        },
        theme: "classic"
    }
});

$('#frmContratos').validate({
   rules: {
     nombre: {
       required: true
     },
      estado: {
       required: true
     }, 
   },
   messages: {
     nombre: {
       required: "Campo nombre es requerido"
     },
     estado: {
       required: "Campo estado es requerido"
     },
   },
   errorElement: 'span',
   errorPlacement: function (error, element) {
     error.addClass('invalid-feedback');
     element.closest('.form-group').append(error);
   },
   highlight: function (element, errorClass, validClass) {
     $(element).addClass('is-invalid');
   },
   unhighlight: function (element, errorClass, validClass) {
     $(element).removeClass('is-invalid');
   }
});
});

let data_servicios = [];
//consultar_valor();
//consultar_contrato();
function consultar_valor(){
var id_contrato = $('#contrato').val();//'105200';//$('#contrato').val();
var id_servicio = $('#servicio').val();//'198752';//$('#servicio').val();
var servicio = data_servicios.find(element => element.id == id_servicio);
//console.warn(servicio)
//$('#valor').val('₡ '+servicio.valor);
$('#valor').val(Number(servicio.valor).toFixed(2));
$("#valor").maskMoney().maskMoney('mask');
$("#valor").on('blur', function() {
        $(this).maskMoney('mask');
    });

    $("#valor_cobrar").on('blur', function() {
        $(this).maskMoney('mask');
    });


var url= "{{ URL::asset('pagos/asociacion/manual/cobros/ajax') }}"+"/"+id_contrato+'/'+id_servicio;

/* evaluar respuesta y si data > 0 y el mensaje es nulo muestro cobros sino muestra otra mensaje */


 $.get(url, function(res) {
 
    var obj = $.parseJSON(res);
    console.log(obj.isCobroPadre)
    if(obj.data?.length === 0 && obj.message == 'No se encontraron cobros registrados para este servicio.'){
        /* alert button Registrar pago  */
        $('#payRegisterDisabled').show()
        $('#payRegisterEnabled').hide()
    }else{
        /* alert button Registrar pago  */
        $('#payRegisterDisabled').hide()
       /*  $('#payRegisterDisabled').hide() */
       $('#payRegisterEnabled').show()
    }
    
    var html = '';
    var total_conbro = 0;

    if(obj.data?.length  != 0){
        document.getElementById('alerta_cobro').style.display = 'block';
        document.getElementById('cobros_pendientes').style.display = 'block';
        document.getElementById('info_cobro').style.display = 'none';
        document.getElementById('tiene_mora').value = 1;
        document.getElementById('cobro_contrato_id').value = obj.contrato_id;
        document.getElementById('cobro_contrato_servicio_id').value = obj.contrato_servicio_id;

       /*  is_cobro_padre */
        if(obj.isCobroPadre == 1){
            document.getElementById('is_cobro_padre').value = 1;
        }else{
            document.getElementById('is_cobro_padre').value = 0;
        }
    }
    else{
        document.getElementById('info_cobro').style.display = 'block';
        document.getElementById('alerta_cobro').style.display = 'none';
        document.getElementById('cobros_pendientes').style.display = 'none';
        document.getElementById('tiene_mora').value = 0;
    }
    let mes = '';
    for(var i = 0; i < obj.data?.length ; i++){
        if(obj.data[i].cobro_mes == 1)
            mes = 'Enero';
        else if(obj.data[i].cobro_mes == 2)
            mes = 'Febrero';
        else if(obj.data[i].cobro_mes == 3)
            mes = 'Marzo';
        else if(obj.data[i].cobro_mes == 4)
            mes = 'Abril';
        else if(obj.data[i].cobro_mes == 5)
            mes = 'Mayo';
        else if(obj.data[i].cobro_mes == 6)
            mes = 'Junio';
        else if(obj.data[i].cobro_mes == 7)
            mes = 'Julio';
        else if(obj.data[i].cobro_mes == 8)
            mes = 'Agosto';
        else if(obj.data[i].cobro_mes == 9)
            mes = 'Setiembre';
        else if(obj.data[i].cobro_mes == 10)
            mes = 'Octubre';
        else if(obj.data[i].cobro_mes == 11)
            mes = 'Noviembre';
        else if(obj.data[i].cobro_mes == 12)
            mes = 'Diciembre';
        var idFila = Math.floor(Math.random() * 99999);
        html += `<tr id="fila_cobros_${idFila}">
                    <td>${i+1}</td>
                    <td>${obj.data[i].contrato_codigo}</td>
                    <td>${obj.data[i].cobro_cuota}/${mes}/${obj.data[i].cobro_ano}</td>
                    <td>${obj.data[i].cobro_cuota}/${mes} - ${servicio.nombre}</td>
                    <td></td>
                    <td>₡${obj.data[i].cobro_valor}
                        <input type="hidden" id="cobro_${idFila}" value="${obj.data[i].cobro_valor}">
                        <input type="hidden" id="cobro_id" value="${obj.data[i].cobro_id}" name="cobro_id">
                    </td>
                    <td>
                        <a onclick="remover_row(${idFila})" class="btn btn-danger"><i class="fa fa-trash"></i>Remover</a>
                        <a 
                            onclick="detalle_cobro(${obj.data[i].cobro_id})"
                            data-toggle="modal"
                            data-target="#detalle_cobro"
                           
                            class="btn btn-info">
                            <i class="fa fa-eye"></i>Ver Detalle
                        </a>
                        <a  
                            
                            data-toggle="modal" 
                            data-target="#modal_condonar_cobros" 
                            class="btn btn-primary">
                            <i class="fa fa-thumbs-o-up"></i>Condonar Cobro
                        </a>
                    </td>
                </tr>`;
                total_conbro += Number(obj.data[i].cobro_valor);
    }
    
    document.getElementById('rowsCobros').innerHTML = html;
    $('#valor_cobrar').val(Number(total_conbro).toFixed(2));
    $("#valor_cobrar").maskMoney().maskMoney('mask');
    $("#valor_cobrar").on('blur', function() {
        $(this).maskMoney('mask');
    });
    document.getElementById('total_cobro').innerHTML = (Number(total_conbro).toFixed(2));
    $('#total_cobros').val(Number(total_conbro).toFixed(2));
    //$("#valor_cobrar").focus()
    calcular();
});
}
function limpiar(){
location.reload();
}
function detalle_cobro(cobro_id) {
$.ajax({
    type: "GET",
    url: "{{ asset('') . 'cobros/debito/automatico/agregar/lista/cambiar/estatus/cobro-detalle' }}",
    data: {
      
        cobro_id: cobro_id
    },
    success: function(res) {
        console.log(res);
        document.getElementById('concepto').innerHTML = res.data_cobro.cobro_concepto;
        document.getElementById('fecha_aplicacion').innerHTML = res.data_cobro
            .cobro_fecha_aplicacion;
        document.getElementById('texto_cobro').innerHTML = ``;
        var html = '';
        for (var i = 0; i < res.data_detalle.length; i++) {
            html += `<tr>
                    <td>${i+1}</td>
                    <td>${res.data_detalle[i].concepto}</td>
                    <td>${res.data_detalle[i].servicio_nombre}</td>
                    <td>${res.data_detalle[i].cobro_detalle_valor_cobrado}</td>
                    <td>${res.data_detalle[i].cobro_detalle_valor_pagado == null ? '(no definido)' : res.data_detalle[i].cobro_detalle_valor_pagado}</td>
                </tr>`
        }
        document.getElementById('registros_detalle_cobro').innerHTML = html;
    },
    dataType: "json"
});
}
function calcular(){
var total_cobrar = $('#total_cobros').val();
var valor_pagar = $('#total_pagado').val();
var resultado = Number(valor_pagar)-Number(total_cobrar);
$('#diferencia').val(resultado);
document.getElementById('s_diferencia').innerHTML = resultado < 0 ? `<div class="text-danger">₡${resultado.toFixed(2)}</div>` : `<div class="text-success">₡${resultado.toFixed(2)}</div>`;
}
function requerir_comprobante(){
var id_medio_pago = document.getElementById('medio_pago');
var text_medio_pago = id_medio_pago.options[id_medio_pago.selectedIndex].text;
var r_prompro = document.getElementById('comprobante');
var data_medio = id_medio_pago.value.split('_');
if(data_medio[0] == '1'){
    r_prompro.disabled  = true;
    r_prompro.value = '';
}
else{
    r_prompro.disabled  = false;
    r_prompro.value = '';
}
console.log(data_medio[0]);
}


function agrega_medio(){
var valor_pagar = $('#total_pagado').val();
let valorAPagar = limpiar_moneda($('#valor_cobrar').val());

//var valor_pagar = $('#total_pagado').val().replaceAll('.','').replaceAll(',','.');
//valor_pagar = Number(valor_pagar);
//valor_pagar = valor_pagar.toFixed(2);

//let valorAPagar = $('#valor_cobrar').val().replaceAll('₡', '');
//valorAPagar = Number(valorAPagar.replaceAll('.','').replaceAll(',','.'));
//valorAPagar = valorAPagar.toFixed(2);
//console.log({valorAPagar, valor_pagar});


let valorACobrar = $('#total_cobros').val();
/* flat value valorAPagar */
let valor_saldo = $('#valor').val().replaceAll('₡', '');
valor_pagar = Number(valor_saldo) - valorAPagar;

var id_medio_pago = document.getElementById('medio_pago');
let alert_cobro = document.getElementById('alerta_cobro');
let cobro_padre = document.getElementById('is_cobro_padre').value;

console.log("medio_pago: "+id_medio_pago.value);
if(id_medio_pago.value==""){
    return Swal.fire({
        title: 'Error!',
        text: 'Por favor seleccione un medio de pago.',
        icon: 'error',
        confirmButtonText: 'Aceptar'
    });
}

console.log({valorAPagar, valorACobrar});


//let valor_comprobante = valorAPagar;
let valor_comprobante = limpiar_moneda($('#valor_cobrar').val());


var text_medio_pago = id_medio_pago.options[id_medio_pago.selectedIndex].text;
var text_comprobante = $('#comprobante').val();


/*if( (valorAPagar > valorACobrar) && cobro_padre === '1'){
    return Swal.fire({
        title: 'Error!',
        text: 'El valor a pagar no puede ser mayor al valor del cobro.',
        icon: 'error',
        confirmButtonText: 'Aceptar'
    })
}*/
var error = '';
if(id_medio_pago.value != ''){
    var requerido = id_medio_pago.value.split('_')[0];
    console.log({requerido});
    if(valor_comprobante == '')
        error = 'Por favor ingrese un valor de pago mayor de "0" para agregar.';

    if(requerido != 1 && text_comprobante == '')
        error = 'Se requiere un número de comprobante para el medio de pago seleccionado.';

    if(error == ''){
        /* console.log(valor_comprobante.search('₡')); */
        valor_comprobante = Number(valor_comprobante);

        //console.log(valor_comprobante);
        var idFila = Math.floor(Math.random() * 99999);

        var html = `<tr id="m_fila_${idFila}" style="background-color: rgba(0,0,0,.05);">
                        <td>${text_medio_pago}</td>
                        <td>${text_comprobante}</td>
                        <td>₡${valor_comprobante.toFixed(2)}
                            <input type="hidden" id="valor_comprobante_${idFila}" value="${idFila}">
                            <input type="hidden" id="medio_pago_id_${idFila}" value="${requerido}">
                            <input type="hidden" id="pago_por_medio_de_pago_comprobante_${idFila}" value="${text_comprobante}">
                            <input type="hidden" id="pago_por_medio_de_pago_valor_${idFila}" value="${valor_comprobante}">
                        </td>
                        <td>
                            <a onclick="remover_row_comprobante(${idFila})" class="btn btn-danger"><i class="fa fa-trash"></i>Remover</a>
                        </td>
                    </tr>`;
        //$('#rowMedios').append(html);
        $('#rowMedios').html(html);

      

        if(alert_cobro.style.display === 'none'){
            //let valor_pagare = $('#total_pagado').val().replaceAll('.','').replaceAll(',','.');
            let valor_pagare = $('#total_pagado').val();
            let valor_saldo = limpiar_moneda($('#valor').val());
            let valor = limpiar_moneda($('#valor_cobrar').val()); 

            valor_pagare = Number(valor_saldo);
            /* console.log(valor_pagare); */
            $('#total_pagado').val(valor_pagare);
            document.getElementById('s_total_pagado').innerHTML = Number(valor_pagare).toFixed(2);
           
            //valor_pagare = Number(valor_pagare);
            //valor_pagare = valor_pagare.toFixed(2);

            //console.log(valor_pagare)
            
           /*  let valor_saldo = $('#valor').val().replaceAll('₡', '');
            let valor = $('#valor_cobrar').val().replaceAll('₡', '');
            
            valor_pagare = Number(valor_saldo) - valor_comprobante;
            console.log(valor_pagare);
            $('#total_pagado').val(valor_pagare);
            document.getElementById('s_total_pagado').innerHTML = Number(valor_pagare).toFixed(2); */
           /*  $('#total_pagado').val(valor_pagar);
            document.getElementById('s_total_pagado').innerHTML = Number(valor_pagar).toFixed(2); */
        }else{
            let valor_pagare = $('#total_pagado').val();
            valor_pagare = Number(valor_pagare) + valor_comprobante;
/*             console.log(valor_pagare); */
            $('#total_pagado').val(valor_pagare);
            document.getElementById('s_total_pagado').innerHTML = Number(valor_pagare).toFixed(2);
        }

       /*  $('#valor_cobrar').val(''); */
        calcular();
    }else{
         Swal.fire({
          icon: 'warning',
          title: 'Advertencia.',
          text: error,
        });
    }
}
}


function remover_row(row){
console.log(row);
var total_cobros = $('#total_cobros').val();
var row_cobro = $('#cobro_'+row).val();
var res_remove = Number(total_cobros)-Number(row_cobro);

$('#total_cobros').val(Number(res_remove).toFixed(2));
$('#valor_cobrar').val(Number(res_remove).toFixed(2));
document.getElementById('total_cobro').innerHTML = res_remove.toFixed(2);
$('#fila_cobros_'+row).remove();
calcular();
$("#valor_cobrar").maskMoney().maskMoney('mask');
$("#valor_cobrar").focus();
}
function remover_row_comprobante(row){
var total_compro = $('#total_pagado').val();
var valor_row = $('#valor_comprobante_'+row).val();
//var res = Number(total_compro) - Number(valor_row);
var res = Number(0);

$('#total_pagado').val(res);
document.getElementById('s_total_pagado').innerHTML = res.toFixed(2);
calcular();
$('#m_fila_'+row).remove();

}
/* function consultar_servicios(){
var id_contrato = $('#contrato').val();
console.log(id_contrato);
if(id_contrato != ''){
    var url= "{{ URL::asset('pagos/asociacion/manual/servicios/ajax') }}"+"/"+id_contrato;
    $.get(url, function(res) {
        var obj = $.parseJSON(res);
        document.getElementById('servicio').innerHTML = "";
        document.getElementById("servicio").options[document.getElementById("servicio").options.length]=new Option('Seleccionar', ' ');
        for(var i = 0; i < obj.length; i++){
            document.getElementById("servicio").options[document.getElementById("servicio").options.length]=new Option(obj[i].servicio_nombre+'-'+(obj[i].contrato_servicio_estado == 1 ? '(Activo)' : '(Inactivo)'),obj[i].contrato_servicio_id);
            data_servicios.push({
                                    'id':obj[i].contrato_servicio_id,
                                    'nombre':obj[i].servicio_nombre,
                                    'estado':obj[i].contrato_servicio_estado,
                                    'valor':obj[i].contrato_servicio_saldo_actual == null ? 0 : obj[i].contrato_servicio_saldo_actual
                                });
        }
    });

}
} */


        $("#contrato").on('change', function(){
            let url = "{{ URL::asset('pagos/asociacion/manual/servicios/ajax') }}"+"/"+$(this).val();

            $.get(url, function(res) {
                    var obj = $.parseJSON(res);
                    document.getElementById('servicio').innerHTML = "";
                    document.getElementById("servicio").options[document.getElementById("servicio").options.length]=new Option('Seleccionar', ' ');
                    for(var i = 0; i < obj.length; i++){
                        document.getElementById("servicio").options[document.getElementById("servicio").options.length]=new Option(obj[i].servicio_nombre+'-'+(obj[i].contrato_servicio_estado == 1 ? '(Activo)' : '(Inactivo)'),obj[i].contrato_servicio_id);
                        data_servicios.push({
                                                'id':obj[i].contrato_servicio_id,
                                                'nombre':obj[i].servicio_nombre,
                                                'estado':obj[i].contrato_servicio_estado,
                                                'valor':obj[i].contrato_servicio_saldo_actual == null ? 0 : obj[i].contrato_servicio_saldo_actual
                                            });
                    }
                    
                  
                });
                
                document.getElementById('rowsCobros').innerHTML = '';
                document.getElementById('total_cobro').innerHTML = '0.00';
                $('#total_cobros').val('0.00');
                $('#valor_cobrar').val('0.00');
                $("#s_diferencia").html('0.00');
                $("#rowMedios").html('');
                $("#total_pagado").val('0.00');
                $("#s_total_pagado").html('0.00');

        });



function consultar_contrato(){
    $("#modale_contratos").empty();
    $('#contrato').empty();
data_servicios = [];
var id_cliente = $('#cliente').val();//'1';//$('#cliente').val();
if(id_cliente != ''){
    var url= "{{ URL::asset('pagos/asociacion/manual/contratos/ajax') }}"+"/"+id_cliente;
    console.log(url);
    $.get(url, function(res) {
        var obj = $.parseJSON(res);
        /* document.getElementById('modale_contratos').innerHTML = ""; */
        document.getElementById("modale_contratos").options[document.getElementById("contrato").options.length]=new Option('Seleccionar', ' ');

        document.getElementById('contrato').innerHTML = "";
        document.getElementById("contrato").options[document.getElementById("contrato").options.length]=new Option('Seleccionar', ' ');
        for(var i = 0 ; i < obj.length ; i++){
            document.getElementById("contrato").options[document.getElementById("contrato").options.length]=new Option(('Contrato Nro.:'+obj[i].contrato_codigo),obj[i].contrato_id);
            document.getElementById("modale_contratos").options[document.getElementById("modale_contratos").options.length]=new Option((obj[i].contrato_codigo),obj[i].contrato_id);
        }
    });

}
//$('#contrato').select2();
}


function generar_cobros() {

let prm_contrato_id = document.getElementById('contrato').value;
let prm_servicio_id = $('#servicio').val();
let num_cobros = $('#procentaje_interes_serv').val()
Swal.fire({
title: 'Confirmar',
text: '¿ Estás seguro de que desea adelantar los cobros?',
icon: 'question',
showLoaderOnConfirm: true,
showCancelButton: true,
confirmButtonText: `<i class="fa fa-check"></i> De Acuerdo`,
cancelButtonText: '<i class="fa fa-ban"></i> Cancelar',
confirmButtonColor: '#3085d6'
}).then((result) => {
/* Read more about isConfirmed, isDenied below */
if (result.isConfirmed) {

    $.ajax({
        type: "POST",
        url: "{{asset('').'adelantar-cobros'}}",
        data: {
            "_token": "{{ csrf_token() }}",
            
            contrato_id: prm_contrato_id,
            servicio_id: prm_servicio_id,
            num_cobros
        },
        success: function(res) {
            console.log(res)
            if (res) {
                Swal.fire({
                    title: 'Generar Cobro',
                    text: "Se genero el cobro satisfactoriamente.",
                    icon: 'success',
                    showCancelButton: false,
                    confirmButtonColor: '#3085d6'
                }).then((result) => {
                    // Reload the Page
                    /* location.reload(); */
                    consultar_valor();
                });
            }
        },
        dataType: "json"
    });

}
});
document.getElementById('procentaje_interes_serv').value = '';
}

function alertNoRegistraPago(){
Swal.fire({
title: 'No se puede registrar el pago',
text: "Este contrato requiere que genere cobros para poder registrar pagos.",
icon: 'info',
showCancelButton: false,
confirmButtonColor: '#3085d6'
}).then((result) => {
// Reload the Page
/* location.reload(); */
consultar_valor();
});

}



function condonar_cobro(id){
Swal.fire({
title: 'Confirmar',
text: '¿ Estás seguro de que desea condonar el cobro?',
icon: 'question',
showLoaderOnConfirm: true,
showCancelButton: true,
confirmButtonText: `<i class="fa fa-check"></i> De Acuerdo`,
cancelButtonText: '<i class="fa fa-ban"></i> Cancelar',
confirmButtonColor: '#3085d6'
}).then((result) => {
/* Read more about isConfirmed, isDenied below */
if (result.isConfirmed) {

    $.ajax({
        type: "POST",
        url: "{{asset('').'pagos/manual/condonar/cobro'}}",
        data: {
            "_token": "{{ csrf_token() }}",
            cobro_id: $('#cobro_id').val(),
            motivo: $('#motivo').val()
        },
        success: function(res) {
                        console.log(res)
                        if (res.ok) {
                            Swal.fire({
                                title: 'Exito',
                                text: res.message,
                                icon: 'success',
                                showCancelButton: false,
                                confirmButtonColor: '#3085d6'
                            }).then((result) => {
                                // Reload the Page
                                consultar_valor();
                            });
                        }else{
                            Swal.fire({
                                title: 'Error',
                                text: res.message,
                                icon: 'error',
                                showCancelButton: false,
                                confirmButtonColor: '#3085d6'
                            }).then((result) => {
                                // Reload the Page
                                consultar_valor();
                            });
                        }
                    },
                    error: function(res) {
                        //console.log(res)
                        if (res) {
                            Swal.fire({
                                title: 'Error',
                                text: res.message,
                                icon: 'error',
                                showCancelButton: false,
                                confirmButtonColor: '#3085d6'
                            }).then((result) => {
                                // Reload the Page
                                location.reload();
                            });
                        }
                    },
        dataType: "json"
    });

}
})
}

function limpiar_moneda(moneda_string){
var limpieza =  moneda_string.replaceAll('₡', '').replaceAll('.', '');

limpieza = (limpieza.replaceAll(',', '.'));
return limpieza;
}

function showLoadingAlert() {
Swal.fire({
    title: 'Cargando!',
    text: 'Espere un momento...',// add html attribute if you want or remove
    allowOutsideClick: false,
    didOpen: () => {
         Swal.showLoading();
    },
});
}

    /*function registrar_pago() {
        
        let prm_contrato_id = document.getElementById('contrato').value;
        let prm_servicio_id = $('#servicio').val();
        let tiene_mora = $('#tiene_mora').val();
        var valor_comprobante = $('#valor_cobrar').val();
        let cobro_id = document.getElementById('cobro_id')?.value;
        
        let inicio = document.getElementById('inicio').value;
        let cliente_id = document.getElementById('cliente').value;
        let contrato_servicio_id = document.getElementById('cobro_contrato_servicio_id').value;
        let total_cobros = $('#total_cobros').val();
        let formS =  $("#frmContract");
        let cobros = $('#rowsCobros').find("input[name^='cobro_id']").serializeArray();
        let medio_pago = $('#medio_pago').val();
        //var url = "{{ URL::asset('action_pago_manual') }}" + "/" + id_contrato
        Swal.fire({
            title: 'Confirmar',
            text: '¿ Estás seguro de que desea registrar el pago?',
            icon: 'question',
            showLoaderOnConfirm: true,
            showCancelButton: true,
            confirmButtonText: `<i class="fa fa-check"></i> De Acuerdo`,
            cancelButtonText: '<i class="fa fa-ban"></i> Cancelar',
            confirmButtonColor: '#3085d6'
        }).then((result) => {
            if (result.isConfirmed) {

                $.ajax({
                    type: "POST",
                    url: "{{asset('').'action_pago_manual_oficina'}}",
                    data: {
                        "_token": "{{ csrf_token() }}",                        
                        contrato_id: prm_contrato_id,
                        servicio_id: prm_servicio_id,
                        tiene_mora,
                        total_valor_pagado: valor_comprobante,
                        cobro_id,
                        inicio,
                        cliente_id,
                        total_cobros,
                        cobros,
                        medio_pago,
                    },
                    success: function(res) {
                        console.log(res)
                        if (res) {
                            Swal.fire({
                                title: 'Exito',
                                text: "Pago registrado",
                                icon: 'success',
                                showCancelButton: false,
                                confirmButtonColor: '#3085d6'
                            }).then((result) => {
                                // Reload the Page
                               // location.reload();
                               window.location.href = "{{asset('').'pagos/asociaciones/pago_manual/success'}}";
                            });
                        }
                    },
                    dataType: "json"
                });

            }
        });
    }*/

    function registrar_pago() {


        if($('#contrato').val() === "" || $('#servicio').val() === "" || $('#servicio').val() === " "){
            return Swal.fire({
                title: 'Error!',
                text: 'Por favor seleccione un contrato y/o un servicio.',
                icon: 'error',
                confirmButtonText: 'Aceptar'
            });
        }
        
        let prm_contrato_id = document.getElementById('contrato').value;
        let prm_servicio_id = $('#servicio').val();
        let tiene_mora = $('#tiene_mora').val();
        var valor_comprobante = $('#valor_cobrar').val();
        let medio_pago = $('#medio_pago').val();
        let cobro_id = document.getElementById('cobro_id')?.value;
        //let caja_id = document.getElementById('caja_ingresos')?.value;
        let inicio = document.getElementById('inicio').value;
        let cliente_id = document.getElementById('cliente').value;
        let contrato_servicio_id = document.getElementById('cobro_contrato_servicio_id').value;
        let total_cobros = $('#total_cobros').val();
        let formS =  $("#frmContract");
        let comprobante = $("#comprobante").val();
        let cobros = $('#rowsCobros').find("input[name^='cobro_id']").serializeArray();

        let servicio_saldo= $("#valor").val();
        let obs= $("#descripcion").val();

        let data = [];
        let rows = document.querySelectorAll('#rowMedios tr');
        rows.forEach((row) => {
            let id = row.id.split('_')[2]; // Obtén el id del medio de pago de la id de la fila
            let medio_pago_id_= document.getElementById(`medio_pago_id_${id}`).value;
            let comprobante = document.getElementById(`pago_por_medio_de_pago_comprobante_${id}`).value;
            let valor = document.getElementById(`pago_por_medio_de_pago_valor_${id}`).value;

            data.push({
                "pago_por_medio_de_pago_medio_de_pago_id": medio_pago_id_,
                "pago_por_medio_de_pago_comprobante": comprobante,
                "pago_por_medio_de_pago_valor": valor
            });
        });
        //var url = "{{ URL::asset('action_pago_manual') }}" + "/" + id_contrato
        Swal.fire({
            title: 'Confirmar',
            text: '¿ Estás seguro de que desea registrar el pago?',
            icon: 'question',
            showLoaderOnConfirm: true,
            showCancelButton: true,
            confirmButtonText: `<i class="fa fa-check"></i> De Acuerdo`,
            cancelButtonText: '<i class="fa fa-ban"></i> Cancelar',
            confirmButtonColor: '#3085d6'
        }).then((result) => {
            /* Read more about isConfirmed, isDenied below */
            if (result.isConfirmed) {


                $.ajax({
                        type: "POST",
                        url: "{{ asset('') . 'verificar-pago-duplicado' }}",
                        beforeSend: function(xhr) {
                            showLoadingAlert();
                        },
                        data: {
                            "_token": "{{ csrf_token() }}",
                            'pago_cliente_id': cliente_id,
                            'pago_contrato_id': prm_contrato_id,
                            'contrato_servicio_id': prm_servicio_id,
                            'servicio_saldo': limpiar_moneda(servicio_saldo),
                            'pago-servicio_saldo-disp': servicio_saldo,
                            'PagoDetalle': cobros,
                            'medio_de_pago_id': medio_pago,
                            'medio_de_pago_valor-disp': valor_comprobante,
                            'medio_de_pago_valor': valor_comprobante,
                            'PagoPorMedioDePago': data,
                            'total_valor_pagado': limpiar_moneda(valor_comprobante),
                            'observacion': obs,
                            'fecha_pago': inicio,
                            'tiene_mora': tiene_mora,
                            //'caja_ingresos_id': caja_id,
                            'forma_pago_manual_modulo': $("#forma_pago_manual_modulo").val(),
                            'pago_tipo_pago': $("#pago_tipo_pago").val(),
                            'comprobante': comprobante,

                        },

                        success: function(res) {

                            if (res.ok) {
                               

                               return Swal.fire({
                                   title: 'Ya existe un pago registrado con los mismos datos',
                                   text: res.mensaje,
                                   icon: 'info',
                                   showCancelButton: false,
                                   confirmButtonColor: '#3085d6'
                               })
                               

                           } else{
                            
                            $.ajax({
                    type: "POST",
                    //url: "{{asset('').'action_pago_manual'}}",
                    url: "{{asset('').'action_pago_manual_oficina'}}",

                    beforeSend: function(xhr) {
                        showLoadingAlert();
                    },
                    data: {
                        /*"_token": "{{ csrf_token() }}",                        
                        contrato_id: prm_contrato_id,
                        servicio_id: prm_servicio_id,
                        tiene_mora,
                        total_valor_pagado: valor_comprobante,
                        cobro_id,
                        inicio,
                        cliente_id,
                        total_cobros,
                        cobros,
                        medio_pago,*/
                        "_token": "{{ csrf_token() }}",
                        'pago_cliente_id':cliente_id,
                        'pago_contrato_id':prm_contrato_id,
                        'contrato_servicio_id':prm_servicio_id,
                        'servicio_saldo':limpiar_moneda(servicio_saldo),
                        'pago-servicio_saldo-disp':servicio_saldo,
                        'PagoDetalle':cobros,
                        'medio_de_pago_id':medio_pago,
                        'medio_de_pago_valor-disp':valor_comprobante,
                        'medio_de_pago_valor':valor_comprobante,
                        'PagoPorMedioDePago':data,
                        'total_valor_pagado':limpiar_moneda(valor_comprobante),
                        'observacion':obs,
                        'fecha_pago':inicio,
                        'tiene_mora':tiene_mora,
                        //'caja_ingresos_id':'',
                        'forma_pago_manual_modulo':$("#forma_pago_manual_modulo").val(),
                        'pago_tipo_pago':$("#pago_tipo_pago").val()
                    },
                    success: function(res) {
                        Swal.close(); // Close loading indicator

                        if (res.error==false) {
                            Swal.fire({
                                title: 'Exito',
                                text: res.mensaje,
                                icon: 'success',
                                showCancelButton: false,
                                confirmButtonColor: '#3085d6'
                            }).then((result) => {
                                // Reload the Page
                               // location.reload();
                               //window.location.href = "{{asset('').'pagos/oficina/caja/activa'}}";
                               //window.location.href = "{{asset('').'pagos/asociaciones/pago_manual/success'}}";
                               window.location.href = "{{asset('').'pagos/pago_manual/success?forma=2'}}";

                            });
                        }else{
                            Swal.fire({
                                title: 'Error',
                                html: res.mensaje,
                                icon: 'error',
                                showCancelButton: false,
                                confirmButtonColor: '#3085d6'
                            }).then((result) => {
                                // Reload the Page
                                location.reload();
                            });
                        }
                    },
                                    dataType: "json"
                                });
                            }
                        },
                        dataType: "json"
                    });




                }
            });
        }

</script>
@endsection