@extends('adminlte::page')

@section('plugins.Sweetalert2', true)
@section('plugins.Select1', true)
@section('plugins.Datatables', true)

@section('title', 'Intranet | Solicitud Pronto Pago De Relaciones Laborales')

@section('content_header')
    <div class="container-fluid">

    </div>
@stop

@section('content')

    <div class="container-fluid">
        <div class="row justify-content-center">
            <div class="col-lg-8">

                <div class="card card-primary card-tabs">

                    <div class="card-header p-0 pt-1">
                        <ul class="nav nav-tabs" id="custom-tabs-one-tab" role="tablist">
                            <li class="nav-item">
                                <a class="nav-link active" id="custom-tabs-one-home-tab" data-toggle="pill" href="#custom-tabs-one-home" role="tab" aria-controls="custom-tabs-one-home" aria-selected="true">Pronto De Pago RRLL</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="custom-tabs-one-profile-tab" data-toggle="pill" href="#custom-tabs-one-profile" role="tab" aria-controls="custom-tabs-one-profile" aria-selected="false">Datos Bancarios</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="custom-tabs-one-messages-tab" data-toggle="pill" href="#custom-tabs-one-messages" role="tab" aria-controls="custom-tabs-one-messages" aria-selected="false">Adjuntos</a>
                            </li>
                        </ul>
                    </div>

                    <form method="POST" action="{{ route('pronto-pago.store-solicitud-relaciones-laborales') }}" id="formularioDeSolicitudProntoPago" enctype="multipart/form-data">
                        @csrf
                        <div class="card-body">
                            <div class="tab-content" id="custom-tabs-one-tabContent">
                                <div class="tab-pane fade show active" id="custom-tabs-one-home" role="tabpanel" aria-labelledby="custom-tabs-one-home-tab">
                                    <div id="contenedorPrimerElemento"></div>

                                    <div id="contenedorDeTodosLosCamposReferentesAlTipoSolicitud">
                                        <div class="form-group">
                                            <label>Tipo De Solicitud</label>
                                            <select class="form-control listaDespegableConBuscador" id="campoTipoSolicitud" name="tipo_solicitud" data-live-search="true" onchange="establecerAccionCuandoSeCambieElTipoSolicitud(this)">
                                                <option value="">--Seleccionar Tipo Solicitud--</option>
                                                @foreach ($tiposSolicitudes as $tipoSolicitud)
                                                    @if (old('tipo_solicitud') == $tipoSolicitud)
                                                        <option selected value="{{ $tipoSolicitud }}">{{ $tipoSolicitud }}</option>
                                                    @else
                                                        <option value="{{ $tipoSolicitud }}">{{ $tipoSolicitud }}</option>
                                                    @endif
                                                @endforeach
                                            </select>
                                            <div class="invalid-feedback" id="valicacionCampoTipoSolicitud">

                                            </div>
                                        </div>

                                        <div class="form-group" id="contenedorCampoDescripcionTipoSolicitud" style="display: none;">
                                            <label for="descripcionTipoSolicitud">Descripción Tipo De Solicitud</label>
                                            <textarea class="form-control" id="descripcionTipoSolicitud" name="descripcion_tipo_solicitud" rows="3"></textarea>
                                            <div class="invalid-feedback" id="valicacionCampoDescripcionTipoSolicitud">

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

                                    <div class="form-group">
                                        <label>Forma De Pago</label>
                                        <select class="form-control listaDespegableConBuscador" id="campoFormaDePago" name="forma_pago" data-live-search="true">
                                            <option value="">--Seleccionar Forma De Pago--</option>
                                            @foreach ($formasDePagos as $formaDePago)
                                                @if (old('forma_pago') == $formaDePago)
                                                    <option selected value="{{ $formaDePago }}">{{ $formaDePago }}</option>
                                                @else
                                                    <option value="{{ $formaDePago }}">{{ $formaDePago }}</option>
                                                @endif
                                            @endforeach
                                        </select>
                                        <div class="invalid-feedback" id="valicacionCampoFormaDePago">

                                        </div>
                                    </div>

                                    <fieldset class="fieldset-color-azul" id="fieldsetArticulo">
                                        <legend class="titulo-fieldset-color-azul" id="legendArticulo">Documento</legend>

                                        <div class="form-group">
                                            <label for="numeroDocumento">Tipo De Documento</label>
                                            <input type="text" class="form-control" id="campoTipoDocumento" name="tipo_documento" value="{{ old('tipo_documento') }}">
                                            <div class="invalid-feedback" id="valicacionCampoTipoDocumento">

                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label for="numeroDocumento">Numero Documento</label>
                                            <input type="text" class="form-control" id="numeroDocumento" name="numero_documento" value="{{ old('numero_documento') }}">
                                            <div class="invalid-feedback" id="valicacionCampoNumeroDocumento">

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

                                    <div class="form-group">
                                        <label>Reembolsable</label>
                                        <select class="form-control listaDespegableConBuscador" id="campoReembolsable" name="reembolsable" data-live-search="true">
                                            <option value="">--Seleccionar Reembolsable--</option>
                                            @foreach ($reembolsables as $reembolsable)
                                                @if (old('reembolsable') == $reembolsable)
                                                    <option selected value="{{ $reembolsable }}">{{ $reembolsable }}</option>
                                                @else
                                                    <option value="{{ $reembolsable }}">{{ $reembolsable }}</option>
                                                @endif
                                            @endforeach
                                        </select>
                                        <div class="invalid-feedback" id="valicacionCampoReembolsable">

                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label>Centro De Costo</label>
                                        <select class="form-control listaDespegableConBuscador" id="idCentroCosto" name="id_centro_costo" data-live-search="true">
                                            <option value="">--Seleccionar Centro De Costo--</option>
                                            @foreach ($centrosCostos as $cc)
                                                @if (old('id_centro_costo') == $cc->id)
                                                    <option selected value="{{ $cc->id }}">{{ $cc->centro_costo }}</option>
                                                @else
                                                    <option value="{{ $cc->id }}">{{ $cc->centro_costo }}</option>
                                                @endif
                                            @endforeach
                                        </select>
                                        <div class="invalid-feedback" id="validarIdCentroCosto">

                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="montoNetoTexto">Monto Neto</label>
                                        <input type="text" class="form-control" id="montoNetoTexto" name="monto_neto_texto" value="{{ old('monto_neto_texto') }}" onfocus="focusValorMontoNeto(this)" onblur="establecerValoresAlCampoMontoNeto(this)" onkeypress="return validarCampoQueSoloSeIngreseNumeros(event,this)">
                                        <div class="invalid-feedback" id="valicacionCampoMontoNetoTexto">

                                        </div>
                                    </div>
                                    <input type="hidden" name="monto_neto_numero" id="montoNetoNumero">
                                </div>

                                <div class="tab-pane fade" id="custom-tabs-one-profile" role="tabpanel" aria-labelledby="custom-tabs-one-profile-tab">
                                    <div class="contenedorDosCamposPorFilaEnLosFormulario">
                                        <div class="form-group">
                                            <label>Banco </label>
                                            <select class="form-control listaDespegableConBuscador" id="idBanco" name="id_banco" data-live-search="true">
                                                <option value="">--Seleccionar Nombre Del Banco--</option>
                                                @foreach ($bancos as $banco)
                                                    @if (old('id_banco') == $banco->id)
                                                        <option selected value="{{ $banco->id }}">{{ $banco->banco }}</option>
                                                    @else
                                                        <option value="{{ $banco->id }}">{{ $banco->banco }}</option>
                                                    @endif
                                                @endforeach
                                            </select>
                                            <div class="invalid-feedback" id="validarIdBanco">

                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label>Tipo De Cuenta </label>
                                            <select class="form-control listaDespegableConBuscador" name="tipo_cuenta_bancaria" id="tipoCuentaBancaria" data-live-search="true">
                                                <option value="">--Seleccionar Tipo De Cuenta Bancaria--</option>
                                                @foreach ($tiposCuentaBancarias as $tiposCuentaBancaria)
                                                    @if (old('tipo_cuenta_bancaria') == $tiposCuentaBancaria)
                                                        <option selected value="{{ $tiposCuentaBancaria }}">{{ $tiposCuentaBancaria }}</option>
                                                    @else
                                                        <option value="{{ $tiposCuentaBancaria }}">{{ $tiposCuentaBancaria }}</option>
                                                    @endif
                                                @endforeach
                                            </select>
                                            <div class="invalid-feedback" id="validarTipoCuentaBancaria">

                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label>Numero De Cuenta </label>
                                            <input type="text" class="form-control" id="numeroCuentaBancaria" name="numero_cuenta_bancaria" value="{{ old('numero_cuenta_bancaria') }}">
                                            <div class="invalid-feedback" id="validarNumeroCuentaBancaria">

                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label>Rut Cuenta Bancaria</label>
                                            <input type="text" class="form-control" name="rut_cuenta_bancaria" value="{{ old('rut_cuenta_bancaria') }}" id="rut2" onblur="cambiarCampoRutHaTexto(this)" onkeypress="return validarCampoRut(event,this)" onfocus="cambiarCampoRutHaNumero(this)">
                                            <div class="invalid-feedback" id="validarRutCuentaBancaria">

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

                                <div class="tab-pane fade" id="custom-tabs-one-messages" role="tabpanel" aria-labelledby="custom-tabs-one-messages-tab">

                                    <div class="dt-responsive table-responsive">
                                        <table class="table table-striped table-bordered" role="grid" aria-describedby="base-style_info">
                                            <thead>
                                                <tr role="row">
                                                    <th colspan="3" class="text-center">ARCHIVOS DEL PRONTO DE PAGO </th>
                                                </tr>
                                                <tr role="row">
                                                    <th>Acción</th>
                                                    <th>Archivo</th>
                                                    <th>Tipo</th>
                                                </tr>
                                            </thead>
                                            <tbody id="registroDeArchivos">
                                                <tr id="archivosNoDisponibleEnLaTabla">
                                                    <td colspan="3" class="text-center">No hay archivos disponibles en la tabla</td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>


                                    <div class="form-group" id="contenedorDelSeleccionadorDeArchivo">
                                        <label>Seleccionar Archivos</label>
                                        <input type="file" class="form-control-file" id="a93541" onchange="GuardarArchivoAlSeleccionarlo(this)">
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class=" card-footer">
                            <button type="button" class="btn btn-primary" id="botonDeCreacion" onclick="registrarProntoPago()"><i class="fas fa-plus-circle" style="margin-right: 2px;"></i> Crear Pronto Pago </button>
                            <a href="{{ route('pronto-pago.index') }}" role="button" class="btn btn-secondary mt-1"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                        </div>
                    </form>

                </div>

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

@section('footer')
    <div class="float-right d-none d-sm-inline">
        Intranet
    </div>
    <strong>Copyright © 2021 <a href="http://guinezingenieria.cl/">GuiñezIngeniería.cl</a>.</strong>
@stop

@section('css')
    <link rel="stylesheet" href="{{ asset('css/estilo-generico.css') }}">
    <style>
        .hide_column {
            display: none;
        }

        .kv-file-upload {
            display: none;
        }

        .contenedorParaVisualizarImagenDelArchivo {
            background-color: rgba(0, 0, 0, .8);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 10000;
            display: grid;
            grid-template-rows: 10vh 90vh;
            color: white;

        }

        .contenedorVolver {
            padding-left: 10px;
            padding-right: 10px;
            display: grid;
            grid-template-columns: 90% 10%;
        }

        .contenedorDeImagenes {
            display: grid;
            grid-template-columns: 100%;
        }

        .tamanoImagen {
            max-width: 80%;
        }

        .tamanoIframe {
            width: 80%;
            height: 700px;
        }

        .tamanoIframeTxt {
            width: 80%;
            height: 700px;
            background-color: white;
            "

        }
    </style>
@stop

@section('js')
    <script src="{{ asset('js/funcionalidades-genericas.js') }}"></script>

    <script>
        $('#campoTipoSolicitud').selectpicker({
            dropupAuto: false,
        });
        $('#campoFormaDePago').selectpicker({
            dropupAuto: false,
        });
        $('#campoReembolsable').selectpicker({
            dropupAuto: false,
        });
        $('#idCentroCosto').selectpicker({
            dropupAuto: false,
        });
        $('#idBanco').selectpicker({
            dropupAuto: false,
        });
        $('#tipoCuentaBancaria').selectpicker({
            dropupAuto: false,
        });
    </script>

    <script>
        function establecerAccionCuandoSeCambieElTipoSolicitud(tipoSolicitud) {
            var valorTipoSolicitud = tipoSolicitud.value;
            switch (valorTipoSolicitud) {
                case "":
                    document.getElementById("contenedorPrimerElemento").after(document.getElementById("contenedorDeTodosLosCamposReferentesAlTipoSolicitud"));
                    document.getElementById("contenedorCampoDescripcionTipoSolicitud").style.display = "none";
                    if (document.getElementById("fieldsetCamposTipoSolicitud")) {
                        document.getElementById("fieldsetCamposTipoSolicitud").remove();
                    }
                    break;
                case "Bono":
                    document.getElementById("contenedorPrimerElemento").after(document.getElementById("contenedorDeTodosLosCamposReferentesAlTipoSolicitud"));
                    document.getElementById("contenedorCampoDescripcionTipoSolicitud").style.display = "none";
                    if (document.getElementById("fieldsetCamposTipoSolicitud")) {
                        document.getElementById("fieldsetCamposTipoSolicitud").remove();
                    }
                    break;
                case "Anticipos":
                    document.getElementById("contenedorPrimerElemento").after(document.getElementById("contenedorDeTodosLosCamposReferentesAlTipoSolicitud"));
                    document.getElementById("contenedorCampoDescripcionTipoSolicitud").style.display = "none";
                    if (document.getElementById("fieldsetCamposTipoSolicitud")) {
                        document.getElementById("fieldsetCamposTipoSolicitud").remove();
                    }
                    break;
                case "Convenio":
                    document.getElementById("contenedorPrimerElemento").after(document.getElementById("contenedorDeTodosLosCamposReferentesAlTipoSolicitud"));
                    document.getElementById("contenedorCampoDescripcionTipoSolicitud").style.display = "none";
                    if (document.getElementById("fieldsetCamposTipoSolicitud")) {
                        document.getElementById("fieldsetCamposTipoSolicitud").remove();
                    }
                    break;
                case "Finiquitos":
                    document.getElementById("contenedorPrimerElemento").after(document.getElementById("contenedorDeTodosLosCamposReferentesAlTipoSolicitud"));
                    document.getElementById("contenedorCampoDescripcionTipoSolicitud").style.display = "none";
                    if (document.getElementById("fieldsetCamposTipoSolicitud")) {
                        document.getElementById("fieldsetCamposTipoSolicitud").remove();
                    }
                    break;
                case "Donacion Voluntaria":
                    document.getElementById("contenedorPrimerElemento").after(document.getElementById("contenedorDeTodosLosCamposReferentesAlTipoSolicitud"));
                    document.getElementById("contenedorCampoDescripcionTipoSolicitud").style.display = "none";
                    if (document.getElementById("fieldsetCamposTipoSolicitud")) {
                        document.getElementById("fieldsetCamposTipoSolicitud").remove();
                    }
                    break;
                case "Otros":
                    if (document.getElementById("fieldsetCamposTipoSolicitud")) {
                        document.getElementById("descripcionTipoSolicitud").value = "";
                        document.getElementById("contenedorCampoDescripcionTipoSolicitud").style.display = "block";
                    } else {
                        var nuevoFieldset = document.createElement("fieldset");
                        //nuevoFieldset.style.cssText = 'padding:10px; border:2px solid #007bff; margin-bottom: 15px; border-radius: 10px 10px 10px 10px;';
                        nuevoFieldset.setAttribute('id', 'fieldsetCamposTipoSolicitud');
                        nuevoFieldset.setAttribute('class', 'fieldset-color-azul');
                        var nuevolegend = document.createElement("legend");
                        nuevolegend.setAttribute('class', 'titulo-fieldset-color-azul');
                        //nuevolegend.style.cssText = 'margin:0px; padding-right: 10px; padding-left: 10px;  background-color: #007bff; color:white; border-radius: 5px 5px 5px 5px;';
                        //nuevolegend.style.removeProperty('width');
                        var nuevoContenidolegend = document.createTextNode("Tipo De Solicitud");
                        nuevolegend.appendChild(nuevoContenidolegend);
                        nuevoFieldset.appendChild(nuevolegend);

                        document.getElementById("contenedorPrimerElemento").after(nuevoFieldset);
                        $("#contenedorDeTodosLosCamposReferentesAlTipoSolicitud").appendTo("#fieldsetCamposTipoSolicitud");

                        document.getElementById("descripcionTipoSolicitud").value = "";
                        document.getElementById("contenedorCampoDescripcionTipoSolicitud").style.display = "block";
                    }
                    break;
            }
        }

        function validarCampoQueSoloSeIngreseNumeros(event, cantidad) {
            if (event.key != 1 && event.key != 2 && event.key != 3 && event.key != 4 && event.key != 5 && event.key != 6 && event.key != 7 && event.key != 8 && event.key != 9 && event.key != 0) {
                return false;
            } else {
                return true;
            }
        }

        function establecerValoresAlCampoMontoNeto(monto) {
            if (monto.value.trim() != "") {
                document.getElementById("montoNetoNumero").value = monto.value.trim().replace(",", ".");
                monto.value = monto.value.replace(",", ".");
                var formatoMonedaEntero = new Intl.NumberFormat("es-CL", {
                    style: "currency",
                    currency: "CLP",
                })

                var valor = formatoMonedaEntero.format(monto.value.trim());
                valor = valor.replace("$", "");
                valor = valor.replace("CLP", "");
                document.getElementById("montoNetoTexto").value = "CLP $ " + valor;
            } else {
                document.getElementById("montoNetoNumero").value = "";
            }
        }

        function focusValorMontoNeto(monto) {
            document.getElementById("montoNetoTexto").value = document.getElementById("montoNetoNumero").value
        }
    </script>

    <script>
        function getDV(numero) {
            nuevo_numero = numero.toString().split("").reverse().join("");
            for (i = 0, j = 2, suma = 0; i < nuevo_numero.length; i++, ((j == 7) ? j = 2 : j++)) {
                suma += (parseInt(nuevo_numero.charAt(i)) * j);
            }
            n_dv = 11 - (suma % 11);
            return ((n_dv == 11) ? 0 : ((n_dv == 10) ? "K" : n_dv));
        }

        function cambiarCampoRutHaNumero(campo) {
            campo.setAttribute("maxlength", "9");
            switch (campo.value.length) {
                case 2:
                    var rutNumerico = campo.value.slice(1, 2);
                    campo.value = rutNumerico;
                    break;
                case 3:
                    var rutNumerico1 = campo.value.slice(0, 1);
                    var rutNumerico2 = campo.value.slice(2, 3);
                    campo.value = rutNumerico1 + rutNumerico2;
                    break;
                case 4:
                    var rutNumerico1 = campo.value.slice(0, 2);
                    var rutNumerico2 = campo.value.slice(3, 4);
                    campo.value = rutNumerico1 + rutNumerico2;
                    break;
                case 5:
                    var rutNumerico1 = campo.value.slice(0, 3);
                    var rutNumerico2 = campo.value.slice(4, 5);
                    campo.value = rutNumerico1 + rutNumerico2;
                    break;
                case 7:
                    var rutNumerico1 = campo.value.slice(0, 1);
                    var rutNumerico2 = campo.value.slice(2, 5);
                    var rutNumerico3 = campo.value.slice(6, 7);
                    campo.value = rutNumerico1 + rutNumerico2 + rutNumerico3;
                    break;
                case 8:
                    var rutNumerico1 = campo.value.slice(0, 2);
                    var rutNumerico2 = campo.value.slice(3, 6);
                    var rutNumerico3 = campo.value.slice(7, 8);
                    campo.value = rutNumerico1 + rutNumerico2 + rutNumerico3;
                    break;
                case 9:
                    var rutNumerico1 = campo.value.slice(0, 3);
                    var rutNumerico2 = campo.value.slice(4, 7);
                    var rutNumerico3 = campo.value.slice(8, 9);
                    campo.value = rutNumerico1 + rutNumerico2 + rutNumerico3;
                    break;
                case 11:
                    var rutNumerico1 = campo.value.slice(0, 1);
                    var rutNumerico2 = campo.value.slice(2, 5);
                    var rutNumerico3 = campo.value.slice(6, 9);
                    var rutNumerico4 = campo.value.slice(10, 11);
                    campo.value = rutNumerico1 + rutNumerico2 + rutNumerico3 + rutNumerico4;
                    break;
                case 12:
                    var rutNumerico1 = campo.value.slice(0, 2);
                    var rutNumerico2 = campo.value.slice(3, 6);
                    var rutNumerico3 = campo.value.slice(7, 10);
                    var rutNumerico4 = campo.value.slice(11, 12);
                    campo.value = rutNumerico1 + rutNumerico2 + rutNumerico3 + rutNumerico4;
                    break;
            }
        }

        function cambiarCampoRutHaTexto(campo) {
            campo.setAttribute("maxlength", "12");
            switch (campo.value.length) {
                case 1:
                    var rutNumerico = campo.value;
                    campo.value = "-" + rutNumerico;
                    break;
                case 2:
                    var rutNumerico1 = campo.value.slice(0, 1);
                    var rutNumerico2 = campo.value.slice(1, 2);
                    campo.value = rutNumerico1 + "-" + rutNumerico2;
                    break;
                case 3:
                    var rutNumerico1 = campo.value.slice(0, 2);
                    var rutNumerico2 = campo.value.slice(2, 3);
                    campo.value = rutNumerico1 + "-" + rutNumerico2;
                    break;
                case 4:
                    var rutNumerico1 = campo.value.slice(0, 3);
                    var rutNumerico2 = campo.value.slice(3, 4);
                    campo.value = rutNumerico1 + "-" + rutNumerico2;
                    break;
                case 5:
                    var rutNumerico1 = campo.value.slice(0, 1);
                    var rutNumerico2 = campo.value.slice(1, 4);
                    var rutNumerico3 = campo.value.slice(4, 5);
                    campo.value = rutNumerico1 + "." + rutNumerico2 + "-" + rutNumerico3;
                    break;
                case 6:
                    var rutNumerico1 = campo.value.slice(0, 2);
                    var rutNumerico2 = campo.value.slice(2, 5);
                    var rutNumerico3 = campo.value.slice(5, 6);
                    campo.value = rutNumerico1 + "." + rutNumerico2 + "-" + rutNumerico3;
                    break;
                case 7:
                    var rutNumerico1 = campo.value.slice(0, 3);
                    var rutNumerico2 = campo.value.slice(3, 6);
                    var rutNumerico3 = campo.value.slice(6, 7);
                    campo.value = rutNumerico1 + "." + rutNumerico2 + "-" + rutNumerico3;
                    break;
                case 8:
                    var rutNumerico1 = campo.value.slice(0, 1);
                    var rutNumerico2 = campo.value.slice(1, 4);
                    var rutNumerico3 = campo.value.slice(4, 7);
                    var rutNumerico4 = campo.value.slice(7, 8);
                    campo.value = rutNumerico1 + "." + rutNumerico2 + "." + rutNumerico3 + "-" + rutNumerico4;
                    break;
                case 9:
                    var rutNumerico1 = campo.value.slice(0, 2);
                    var rutNumerico2 = campo.value.slice(2, 5);
                    var rutNumerico3 = campo.value.slice(5, 8);
                    var rutNumerico4 = campo.value.slice(8, 9);
                    campo.value = rutNumerico1 + "." + rutNumerico2 + "." + rutNumerico3 + "-" + rutNumerico4;
                    break;
            }
        }

        function validarCampoRut(event, campoRut) {
            if (event.key != 1 && event.key != 2 && event.key != 3 && event.key != 4 && event.key != 5 && event.key != 6 && event.key != 7 && event.key != 8 && event.key != 9 && event.key != 0 && event.key != "k" && event.key != "K") {
                return false;
            } else {
                if (campoRut.value.length > 8) {
                    return false;
                } else {
                    return true;
                }
            }
        }
    </script>

    <script>
        function visualizarArchivoDeLaordenDeCompra(archivo, tipo) {
            var body = document.getElementsByTagName("body")[0];
            var html = document.getElementsByTagName("html")[0];
            var contenedor = document.createElement("div");
            var contenerdorVolver = document.createElement("div");
            var contenerdorDeImagenes = document.createElement("div");

            if (tipo == "imagen") {
                var elementoImagen = document.createElement("img");
                var contenerdorImg = document.createElement("div");

                elementoImagen.setAttribute("src", archivo);
                elementoImagen.setAttribute("class", "tamanoImagen");
                elementoImagen.setAttribute("id", "imagenDelArchivo");
                contenerdorImg.setAttribute("style", "text-align: center;");

                contenedor.setAttribute("class", "contenedorParaVisualizarImagenDelArchivo");
                contenedor.setAttribute("id", "contenedorParaVisualizarImagenDelArchivo");
                contenerdorVolver.setAttribute("class", "contenedorVolver");
                contenerdorDeImagenes.setAttribute("class", "contenedorDeImagenes");

                contenerdorVolver.innerHTML =
                    "<div></div>" +
                    '<div style="display: flex; justify-content: center; align-items: center; "><button onClick="cerrarVisualizarDeArchivo()" type="button" style=" border: 0;padding: 0px; background-color: transparent;  margin: 0; color:white; cursor:pointer;"><i class="fas fa-times"></i></button></div>';

                contenerdorImg.appendChild(elementoImagen);

                contenerdorDeImagenes.appendChild(contenerdorImg);

                contenedor.appendChild(contenerdorVolver);
                contenedor.appendChild(contenerdorDeImagenes);
                body.appendChild(contenedor);

                var tamanoLetraVolver = Math.round(contenerdorVolver.offsetHeight * 0.8);
                contenerdorVolver.style.fontSize = tamanoLetraVolver + "px";
                contenerdorDeImagenes.style.fontSize = tamanoLetraVolver + "px";

                setTimeout(function() {
                    if (elementoImagen.offsetHeight > html.offsetHeight) {
                        var alturaDePantalla = elementoImagen.offsetHeight + contenerdorVolver.offsetHeight + 50;
                        contenedor.style.height = alturaDePantalla + "px";
                    } else {
                        contenedor.style.height = html.offsetHeight + "px";
                    }
                }, 100);
            }

            if (tipo == "pdf") {
                var elementoImagen = document.createElement("iframe");
                var contenerdorImg = document.createElement("div");

                elementoImagen.setAttribute("src", archivo);
                elementoImagen.setAttribute("class", "tamanoIframe");
                elementoImagen.setAttribute("id", "imagenDelArchivo");
                contenerdorImg.setAttribute("style", "text-align: center;");

                contenedor.setAttribute("class", "contenedorParaVisualizarImagenDelArchivo");
                contenedor.setAttribute("id", "contenedorParaVisualizarImagenDelArchivo");
                contenerdorVolver.setAttribute("class", "contenedorVolver");
                contenerdorDeImagenes.setAttribute("class", "contenedorDeImagenes");

                contenerdorVolver.innerHTML =
                    "<div></div>" +
                    '<div style="display: flex; justify-content: center; align-items: center; "><button onClick="cerrarVisualizarDeArchivo()" type="button" style=" border: 0;padding: 0px; background-color: transparent;  margin: 0; color:white; cursor:pointer;"><i class="fas fa-times"></i></button></div>';

                contenerdorImg.appendChild(elementoImagen);

                contenerdorDeImagenes.appendChild(contenerdorImg);

                contenedor.appendChild(contenerdorVolver);
                contenedor.appendChild(contenerdorDeImagenes);
                body.appendChild(contenedor);

                var tamanoLetraVolver = Math.round(contenerdorVolver.offsetHeight * 0.8);
                contenerdorVolver.style.fontSize = tamanoLetraVolver + "px";
                contenerdorDeImagenes.style.fontSize = tamanoLetraVolver + "px";

                setTimeout(function() {
                    if (elementoImagen.offsetHeight > html.offsetHeight) {
                        var alturaDePantalla = elementoImagen.offsetHeight + contenerdorVolver.offsetHeight + 50;
                        contenedor.style.height = alturaDePantalla + "px";
                    } else {
                        contenedor.style.height = html.offsetHeight + "px";
                    }
                }, 100);
            }

            if (tipo == "txt") {
                var elementoImagen = document.createElement("iframe");
                var contenerdorImg = document.createElement("div");

                elementoImagen.setAttribute("src", archivo);
                elementoImagen.setAttribute("class", "tamanoIframeTxt");
                elementoImagen.setAttribute("id", "imagenDelArchivo");
                contenerdorImg.setAttribute("style", "text-align: center; ");

                contenedor.setAttribute("class", "contenedorParaVisualizarImagenDelArchivo");
                contenedor.setAttribute("id", "contenedorParaVisualizarImagenDelArchivo");
                contenerdorVolver.setAttribute("class", "contenedorVolver");
                contenerdorDeImagenes.setAttribute("class", "contenedorDeImagenes");

                contenerdorVolver.innerHTML =
                    "<div></div>" +
                    '<div style="display: flex; justify-content: center; align-items: center; "><button onClick="cerrarVisualizarDeArchivo()" type="button" style=" border: 0;padding: 0px; background-color: transparent;  margin: 0; color:white; cursor:pointer;"><i class="fas fa-times"></i></button></div>';

                contenerdorImg.appendChild(elementoImagen);

                contenerdorDeImagenes.appendChild(contenerdorImg);

                contenedor.appendChild(contenerdorVolver);
                contenedor.appendChild(contenerdorDeImagenes);
                body.appendChild(contenedor);

                var tamanoLetraVolver = Math.round(contenerdorVolver.offsetHeight * 0.8);
                contenerdorVolver.style.fontSize = tamanoLetraVolver + "px";
                contenerdorDeImagenes.style.fontSize = tamanoLetraVolver + "px";

                setTimeout(function() {
                    if (elementoImagen.offsetHeight > html.offsetHeight) {
                        var alturaDePantalla = elementoImagen.offsetHeight + contenerdorVolver.offsetHeight + 50;
                        contenedor.style.height = alturaDePantalla + "px";
                    } else {
                        contenedor.style.height = html.offsetHeight + "px";
                    }
                }, 100);
            }

        }

        function cerrarVisualizarDeArchivo() {
            var contenedor = document.getElementById("contenedorParaVisualizarImagenDelArchivo");
            var body = document.getElementsByTagName("body")[0];
            body.removeChild(contenedor);
        }

        function uuid() {
            var dt = new Date().getTime();
            var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
                var r = (dt + Math.random() * 16) % 16 | 0;
                dt = Math.floor(dt / 16);
                return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);
            });
            return uuid;
        }

        function eliminarArchivoDeLaTabla(registro, archivo) {
            document.getElementById(archivo).remove();
            registro.remove();

            if (document.getElementById("registroDeArchivos").innerHTML.trim().length == 0) {
                document.getElementById("registroDeArchivos").innerHTML =
                    '<tr id="archivosNoDisponibleEnLaTabla">' +
                    '<td colspan="3" class="text-center">No hay archivos disponibles en la tabla</td>' +
                    '</tr>';
            }
        }

        function GuardarArchivoAlSeleccionarlo(archivo) {
            var nombreArchivo = archivo.files[0].name;
            var extensionarchivo = nombreArchivo.split('.');
            extensionarchivo = extensionarchivo[extensionarchivo.length - 1];
            var extensionArchivoSinCambio = extensionarchivo;
            var accionesRegistroDeArchivo = "";

            if (document.getElementById("archivosNoDisponibleEnLaTabla")) {
                document.getElementById("archivosNoDisponibleEnLaTabla").remove();
            }

            var reader = new FileReader();
            reader.readAsDataURL(archivo.files[0]);
            reader.onload = function() {
                var base64 = reader.result;

                if (extensionarchivo.toLowerCase() == "png" || extensionarchivo.toLowerCase() == "jpeg" || extensionarchivo.toLowerCase() == "gif" || extensionarchivo.toLowerCase() == "jpg" || extensionarchivo.toLowerCase() == "bmp") {
                    extensionarchivo = "IMAGEN";
                    accionesRegistroDeArchivo =
                        '<a class="dropdown-item" href="#" onclick="visualizarArchivoDeLaordenDeCompra(\'' + base64 + '\',\'imagen\')"><i class="fas fa-eye" aria-hidden="true"></i> Visualizar Archivo</a>' +
                        '<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>';
                } else if (extensionarchivo.toLowerCase() == "mp3" || extensionarchivo.toLowerCase() == "wav" || extensionarchivo.toLowerCase() == "wma" || extensionarchivo.toLowerCase() == "ogg") {
                    extensionarchivo = "ARCHIVO DE AUDIO";
                    accionesRegistroDeArchivo = '<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>';
                } else if (extensionarchivo.toLowerCase() == "zip" || extensionarchivo.toLowerCase() == "rar" || extensionarchivo.toLowerCase() == "tgz" || extensionarchivo.toLowerCase() == "tar") {
                    extensionarchivo = "ARCHIVO COMPRIMIDO";
                    accionesRegistroDeArchivo = '<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>';
                } else if (extensionarchivo.toLowerCase() == "pdf") {
                    extensionarchivo = "PDF";
                    accionesRegistroDeArchivo =
                        '<a class="dropdown-item" href="#" onclick="visualizarArchivoDeLaordenDeCompra(\'' + base64 + '\',\'pdf\')"><i class="fas fa-eye" aria-hidden="true"></i> Visualizar Archivo</a>' +
                        '<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>';
                } else if (extensionarchivo.toLowerCase() == "xlsx" || extensionarchivo.toLowerCase() == "xls") {
                    extensionarchivo = "OFFICE EXCEL";
                    accionesRegistroDeArchivo = '<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>';
                } else if (extensionarchivo.toLowerCase() == "pptx" || extensionarchivo.toLowerCase() == "ppt") {
                    extensionarchivo = "OFFICE POWER POINT";
                    accionesRegistroDeArchivo = '<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>';
                } else if (extensionarchivo.toLowerCase() == "docx" || extensionarchivo.toLowerCase() == "doc") {
                    extensionarchivo = "OFFICE WORD";
                    accionesRegistroDeArchivo = '<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>';
                } else if (extensionarchivo.toLowerCase() == "txt") {
                    extensionarchivo = "ARCHIVO DE TEXTO";
                    accionesRegistroDeArchivo =
                        '<a class="dropdown-item" href="#" onclick="visualizarArchivoDeLaordenDeCompra(\'' + base64 + '\',\'txt\')"><i class="fas fa-eye" aria-hidden="true"></i> Visualizar Archivo</a>' +
                        '<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>';
                } else if (
                    extensionarchivo.toLowerCase() == "mp4" || extensionarchivo.toLowerCase() == "webm" || extensionarchivo.toLowerCase() == "avi" ||
                    extensionarchivo.toLowerCase() == "asf" || extensionarchivo.toLowerCase() == "dvd" || extensionarchivo.toLowerCase() == "m1v" ||
                    extensionarchivo.toLowerCase() == "movie" || extensionarchivo.toLowerCase() == "mpeg" || extensionarchivo.toLowerCase() == "wn" || extensionarchivo.toLowerCase() == "wmv"
                ) {
                    extensionarchivo = "ARCHIVO DE VIDEO";
                    accionesRegistroDeArchivo = '<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>';
                } else {
                    extensionarchivo = "ARCHIVO DESCONOCIDO";
                    accionesRegistroDeArchivo = '<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>';
                }

                document.getElementById("registroDeArchivos").innerHTML +=
                    '<tr>' +
                    '<td>' +
                    '<div class="btn-group ">' +
                    '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">' +
                    'Acciones' +
                    '</button>' +
                    '<div class="dropdown-menu">' +
                    accionesRegistroDeArchivo +
                    //'<a class="dropdown-item" href="'+url+'" target="_blank"><i class="fas fa-eye" aria-hidden="true"></i> Visualizar Archivo</a>'+
                    //'<a class="dropdown-item" href="#" onclick="eliminarArchivoDeLaTabla(this.parentElement.parentElement.parentElement.parentElement,\'' + archivo.id + '\')"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Archivo</a>' +
                    '</div>' +
                    '</div>' +
                    '</td>' +
                    '<td>' + nombreArchivo + '</td>' +
                    '<td>' + extensionarchivo + '</td>' +
                    '</tr>';

                archivo.style.display = "none";
                var inputFile = document.createElement("input");
                inputFile.setAttribute("type", "file");
                inputFile.setAttribute("class", "form-control-file");
                inputFile.setAttribute("id", uuid());
                inputFile.setAttribute("onchange", "GuardarArchivoAlSeleccionarlo(this)");
                document.getElementById("contenedorDelSeleccionadorDeArchivo").appendChild(inputFile);

            };
            reader.onerror = function(error) {

            };

        }
    </script>

    <script>
        function validarCampos(data) {
            if (typeof data.responseJSON.errors.tipo_solicitud !== 'undefined') {
                document.getElementById("campoTipoSolicitud").classList.remove('input-success-icon');
                document.getElementById("campoTipoSolicitud").classList.add('input-error-icon');
                document.getElementById("valicacionCampoTipoSolicitud").innerHTML = data.responseJSON.errors.tipo_solicitud;
                document.getElementById("valicacionCampoTipoSolicitud").style.display = "block";
            } else {
                document.getElementById("campoTipoSolicitud").classList.remove('input-error-icon');
                document.getElementById("campoTipoSolicitud").classList.add('input-success-icon');
                document.getElementById("valicacionCampoTipoSolicitud").innerHTML = "";
                document.getElementById("valicacionCampoTipoSolicitud").style.display = "none";
            }

            if (typeof data.responseJSON.errors.descripcion_tipo_solicitud !== 'undefined') {
                document.getElementById("descripcionTipoSolicitud").setAttribute("class", "form-control is-invalid");
                document.getElementById("valicacionCampoDescripcionTipoSolicitud").innerHTML = data.responseJSON.errors.descripcion_tipo_solicitud;
            } else {
                document.getElementById("descripcionTipoSolicitud").setAttribute("class", "form-control is-valid");
                document.getElementById("valicacionCampoDescripcionTipoSolicitud").innerHTML = "";
            }

            if (typeof data.responseJSON.errors.forma_pago !== 'undefined') {
                document.getElementById("campoFormaDePago").classList.remove('input-success-icon');
                document.getElementById("campoFormaDePago").classList.add('input-error-icon');
                document.getElementById("valicacionCampoFormaDePago").innerHTML = data.responseJSON.errors.forma_pago;
                document.getElementById("valicacionCampoFormaDePago").style.display = "block";
            } else {
                document.getElementById("campoFormaDePago").classList.remove('input-error-icon');
                document.getElementById("campoFormaDePago").classList.add('input-success-icon');
                document.getElementById("valicacionCampoFormaDePago").innerHTML = "";
                document.getElementById("valicacionCampoFormaDePago").style.display = "none";
            }

            if (typeof data.responseJSON.errors.tipo_documento !== 'undefined') {
                document.getElementById("campoTipoDocumento").setAttribute("class", "form-control is-invalid");
                document.getElementById("valicacionCampoTipoDocumento").innerHTML = data.responseJSON.errors.tipo_documento;
            } else {
                document.getElementById("campoTipoDocumento").setAttribute("class", "form-control is-valid");
                document.getElementById("valicacionCampoTipoDocumento").innerHTML = "";
            }


            if (typeof data.responseJSON.errors.numero_documento !== 'undefined') {
                document.getElementById("numeroDocumento").setAttribute("class", "form-control is-invalid");
                document.getElementById("valicacionCampoNumeroDocumento").innerHTML = data.responseJSON.errors.numero_documento;
            } else {
                document.getElementById("numeroDocumento").setAttribute("class", "form-control is-valid");
                document.getElementById("valicacionCampoNumeroDocumento").innerHTML = "";
            }

            if (typeof data.responseJSON.errors.reembolsable !== 'undefined') {
                document.getElementById("campoReembolsable").classList.remove('input-success-icon');
                document.getElementById("campoReembolsable").classList.add('input-error-icon');
                document.getElementById("valicacionCampoReembolsable").innerHTML = data.responseJSON.errors.reembolsable;
                document.getElementById("valicacionCampoReembolsable").style.display = "block";
            } else {
                document.getElementById("campoReembolsable").classList.remove('input-error-icon');
                document.getElementById("campoReembolsable").classList.add('input-success-icon');
                document.getElementById("valicacionCampoReembolsable").innerHTML = "";
                document.getElementById("valicacionCampoReembolsable").style.display = "none";
            }

            if (typeof data.responseJSON.errors.id_centro_costo !== 'undefined') {
                document.getElementById("idCentroCosto").classList.remove('input-success-icon');
                document.getElementById("idCentroCosto").classList.add('input-error-icon');
                document.getElementById("validarIdCentroCosto").innerHTML = data.responseJSON.errors.id_centro_costo;
                document.getElementById("validarIdCentroCosto").style.display = "block";
            } else {
                document.getElementById("idCentroCosto").classList.remove('input-error-icon');
                document.getElementById("idCentroCosto").classList.add('input-success-icon');
                document.getElementById("validarIdCentroCosto").innerHTML = "";
                document.getElementById("validarIdCentroCosto").style.display = "none";
            }

            if (typeof data.responseJSON.errors.monto_neto_texto !== 'undefined') {
                document.getElementById("montoNetoTexto").setAttribute("class", "form-control is-invalid");
                document.getElementById("valicacionCampoMontoNetoTexto").innerHTML = data.responseJSON.errors.monto_neto_texto;
            } else {
                if (typeof data.responseJSON.errors.monto_neto_numero !== 'undefined') {
                    document.getElementById("montoNetoTexto").setAttribute("class", "form-control is-invalid");
                    document.getElementById("valicacionCampoMontoNetoTexto").innerHTML = data.responseJSON.errors.monto_neto_numero;
                } else {
                    document.getElementById("montoNetoTexto").setAttribute("class", "form-control is-valid");
                    document.getElementById("valicacionCampoMontoNetoTexto").innerHTML = "";
                }
            }

            if (typeof data.responseJSON.errors.id_banco !== 'undefined') {
                document.getElementById("idBanco").classList.remove('input-success-icon');
                document.getElementById("idBanco").classList.add('input-error-icon');
                document.getElementById("validarIdBanco").innerHTML = data.responseJSON.errors.id_banco;
                document.getElementById("validarIdBanco").style.display = "block";
            } else {
                document.getElementById("idBanco").classList.remove('input-error-icon');
                document.getElementById("idBanco").classList.add('input-success-icon');
                document.getElementById("validarIdBanco").innerHTML = "";
                document.getElementById("validarIdBanco").style.display = "none";
            }

            if (typeof data.responseJSON.errors.tipo_cuenta_bancaria !== 'undefined') {
                document.getElementById("tipoCuentaBancaria").classList.remove('input-success-icon');
                document.getElementById("tipoCuentaBancaria").classList.add('input-error-icon');
                document.getElementById("validarTipoCuentaBancaria").innerHTML = data.responseJSON.errors.tipo_cuenta_bancaria;
                document.getElementById("validarTipoCuentaBancaria").style.display = "block";
            } else {
                document.getElementById("tipoCuentaBancaria").classList.remove('input-error-icon');
                document.getElementById("tipoCuentaBancaria").classList.add('input-success-icon');
                document.getElementById("validarTipoCuentaBancaria").innerHTML = "";
                document.getElementById("validarTipoCuentaBancaria").style.display = "none";
            }

            if (typeof data.responseJSON.errors.numero_cuenta_bancaria !== 'undefined') {
                document.getElementById("numeroCuentaBancaria").setAttribute("class", "form-control is-invalid");
                document.getElementById("validarNumeroCuentaBancaria").innerHTML = data.responseJSON.errors.numero_cuenta_bancaria;
            } else {
                document.getElementById("numeroCuentaBancaria").setAttribute("class", "form-control is-valid");
                document.getElementById("validarNumeroCuentaBancaria").innerHTML = "";
            }

            if (typeof data.responseJSON.errors.rut_cuenta_bancaria !== 'undefined') {
                document.getElementById("rut2").setAttribute("class", "form-control is-invalid");
                document.getElementById("validarRutCuentaBancaria").innerHTML = data.responseJSON.errors.rut_cuenta_bancaria;
            } else {
                document.getElementById("rut2").setAttribute("class", "form-control is-valid");
                document.getElementById("validarRutCuentaBancaria").innerHTML = "";
            }
        }

        function registrarProntoPago() {
            document.getElementById("botonDeCreacion").setAttribute("disabled", true);
            generarLoading('{{ asset('img/logo.png') }}')
            var formData = new FormData();
            formData.append('tipo_solicitud', document.getElementById("campoTipoSolicitud").value);
            formData.append('descripcion_tipo_solicitud', document.getElementById("descripcionTipoSolicitud").value);
            formData.append('forma_pago', document.getElementById("campoFormaDePago").value);
            formData.append('numero_documento', document.getElementById("numeroDocumento").value);
            formData.append('tipo_documento', document.getElementById("campoTipoDocumento").value);
            formData.append('reembolsable', document.getElementById("campoReembolsable").value);
            formData.append('id_centro_costo', document.getElementById("idCentroCosto").value);
            formData.append('monto_neto_texto', document.getElementById("montoNetoTexto").value);
            formData.append('monto_neto_numero', document.getElementById("montoNetoNumero").value);
            formData.append('id_banco', document.getElementById("idBanco").value);
            formData.append('tipo_cuenta_bancaria', document.getElementById("tipoCuentaBancaria").value);
            formData.append('numero_cuenta_bancaria', document.getElementById("numeroCuentaBancaria").value);
            formData.append('rut_cuenta_bancaria', document.getElementById("rut2").value);

            let totalDeArchivos = document.getElementsByClassName("form-control-file").length;
            let archivosOc = document.getElementsByClassName("form-control-file");
            let asignacionDeIdArchivo = 0;
            for (let i = 0; i < totalDeArchivos; i++) {
                if (archivosOc[i].files.length > 0) {
                    asignacionDeIdArchivo++;
                    formData.append('archivos' + i, archivosOc[i].files[0]);
                }
            }
            formData.append('totalDeArchivos', asignacionDeIdArchivo);
            var csrf = '{{ csrf_token() }}';

            $.ajax({
                url: '{{ route('pronto-pago.store-solicitud-relaciones-laborales') }}',
                method: 'POST',
                data: formData,
                contentType: false,
                processData: false,
                dataType: 'json',
                headers: {
                    'X-CSRF-TOKEN': csrf
                },
                success: function(dataOc) {
                    console.log(dataOc)
                    eliminarLoading()
                    Swal.fire({
                            icon: 'success',
                            title: '¡Creado!',
                            text: 'La solicitud del pronto de pago se genero con éxito',
                            confirmButtonColor: "#448aff",
                            confirmButtonText: "Confirmar"
                        }).then((result) => {
                            location.reload();
                        })
                        .catch((error) => {
                            location.reload();
                        });
                },
                error: function(data) {
                    console.log(data)
                    validarCampos(data)
                    document.getElementById("botonDeCreacion").removeAttribute("disabled");
                    eliminarLoading()
                }
            })
        }
    </script>
@stop