@extends('adminlte::page')

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

@section('title', 'Crear Contrato | Guiñez Ingeniería')

@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-9">

                <div class="card card-aspen">
                    <div class="card-header">
                        <h3 class="card-title">Nuevo Contrato</h3>
                    </div>

                    <form id="formularioDeContrato" method="POST" action="{{ route('contrato.store') }}">
                        @csrf

                        <div class="card-body">

                            <div class="form-group">
                                <label for="numero_contrato">Número de Contrato</label>
                                <input type="text" class="form-control @if ($errors->any()) @if ($errors->has('numero_contrato')) is-invalid @else is-valid @endif @endif" name="numero_contrato" value="{{ old('numero_contrato') }}">
                                @if ($errors->any())
                                    @error('numero_contrato')
                                        <div class="invalid-feedback">
                                            {{ $message }}
                                        </div>
                                    @enderror
                                @endif
                            </div>

                            <div class="form-group clearfix">
                                <label>Proyectos </label>
                                @if (old('proyectos') != null)
                                    @if (count(old('proyectos')) == count($proyectos))
                                        <div class="icheck-primary">
                                            <input type="checkbox" checked id="checkboxTodosProyectos" value="todos" onclick="seleccionarTodosLosItems(this)">
                                            <label for="checkboxTodosProyectos">Todos/Ninguno</label>
                                        </div>
                                    @else
                                        <div class="icheck-primary">
                                            <input type="checkbox" id="checkboxTodosProyectos" value="todos" onclick="seleccionarTodosLosItems(this)">
                                            <label for="checkboxTodosProyectos">Todos/Ninguno</label>
                                        </div>
                                    @endif
                                @else
                                    <div class="icheck-primary">
                                        <input type="checkbox" id="checkboxTodosProyectos" value="todos" onclick="seleccionarTodosLosItems(this)">
                                        <label for="checkboxTodosProyectos">Todos/Ninguno</label>
                                    </div>
                                @endif
                                <div style="display: grid; grid-template-columns: 1fr 1fr; grid-column-gap:10px;">
                                    @foreach ($proyectos as $proyecto)
                                        @if (old('proyectos') != null)
                                            @php
                                                $proyectoOldSeleccionado = false;
                                                foreach (old('proyectos') as $proyectoOld) {
                                                    if ($proyecto->id == $proyectoOld) {
                                                        $proyectoOldSeleccionado = true;
                                                    }
                                                }
                                            @endphp
                                            @if ($proyectoOldSeleccionado == true)
                                                <div class="icheck-primary">
                                                    <input class="checkbox-seleccion-item" checked type="checkbox" id="checkboxProyecto{{ $proyecto->id }}" value="{{ $proyecto->id }}" name="proyectos[]">
                                                    <label for="checkboxProyecto{{ $proyecto->id }}">{{ $proyecto->nombre }}</label>
                                                </div>
                                            @else
                                                <div class="icheck-primary">
                                                    <input class="checkbox-seleccion-item" type="checkbox" id="checkboxProyecto{{ $proyecto->id }}" value="{{ $proyecto->id }}" name="proyectos[]">
                                                    <label for="checkboxProyecto{{ $proyecto->id }}">{{ $proyecto->nombre }}</label>
                                                </div>
                                            @endif
                                        @else
                                            <div class="icheck-primary">
                                                <input class="checkbox-seleccion-item" type="checkbox" id="checkboxProyecto{{ $proyecto->id }}" value="{{ $proyecto->id }}" name="proyectos[]">
                                                <label for="checkboxProyecto{{ $proyecto->id }}">{{ $proyecto->nombre }}</label>
                                            </div>
                                        @endif
                                    @endforeach
                                </div>
                            </div>

                            @if (Gate::check('contrato.edit-recursos'))
                                <fieldset class="fieldset-color-aspen">
                                    <legend class="titulo-fieldset-color-aspen">Recursos</legend>

                                    <div class="contenedor-dos-campos-por-fila">
                                        <div class="form-group">
                                            <label>Tipo Recurso</label>
                                            <select class="form-control lista-despegable-con-buscador" id="campoTipoDelRecurso" name="tipo_recurso">
                                                <option value="">--Seleccionar Tipo Recurso--</option>
                                                @foreach ($tiposDeRecursos as $tipoDelRecurso)
                                                    @if (old('tipo_recurso') == $tipoDelRecurso)
                                                        <option selected value="{{ $tipoDelRecurso }}">{{ $tipoDelRecurso }}</option>
                                                    @else
                                                        <option value="{{ $tipoDelRecurso }}">{{ $tipoDelRecurso }}</option>
                                                    @endif
                                                @endforeach
                                            </select>
                                            <div class="invalid-feedback" id="validacionCampoTipoDelRecurso">

                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label for="cargo">Nombre del Recurso</label>
                                            <input type="text" class="form-control" id="campoNombreDelRecurso">
                                            <div class="invalid-feedback" id="validacionCampoNombreDelRecurso">

                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label>Unidad de Medición</label>
                                            <select class="form-control lista-despegable-con-buscador" id="campoUnidadDeMedicionDelRecurso" name="id_unidad" data-live-search="true">
                                                <option value="">--Seleccionar Unidad de Medición--</option>
                                                @foreach ($unidadDeMedida as $unidad)
                                                    @if (old('id_unidad') == $unidad->id)
                                                        <option selected value="{{ $unidad->id }}">{{ $unidad->unidad }}</option>
                                                    @else
                                                        <option value="{{ $unidad->id }}">{{ $unidad->unidad }}</option>
                                                    @endif
                                                @endforeach
                                            </select>
                                            <div class="invalid-feedback" id="validacionCampoUnidadDeMedicionDelRecurso">

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

                                    <div class="form-group">
                                        <label for="descripcion">Descripción del Recurso</label>
                                        <textarea class="form-control" id="campoDescripcionDelRecurso" rows="3"></textarea>
                                        <div class="invalid-feedback" id="validacionCampoDescripcionDelRecurso">

                                        </div>
                                    </div>

                                    <button type="button" class="btn btn-aspen" onclick="agregarCamposDelRecurso()"> Agregar Recurso</button>
                                </fieldset>

                                <div class="dt-responsive table-responsive">
                                    <table class="table table-bordered" role="grid" aria-describedby="base-style_info" id="tabla-recursos">
                                        <thead>
                                            <tr role="row">
                                                <th>#</th>
                                                <th>Tipo Recurso</th>
                                                <th>Nombre del Recurso</th>
                                                <th>Unidad de Medición</th>
                                                <th>Descripción</th>
                                                <th>Acción</th>
                                            </tr>
                                        </thead>
                                        <tbody id="registrosDeRecursos">
                                            <tr id="recursosNoDisponibleEnLaTabla">
                                                <td colspan="6" class="text-center">No hay recursos disponibles en la tabla</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <input type="hidden" id="registrosRecursos" name="registros_recursos" value="{{ old('registros_recursos', '[]') }}">
                            @endif

                            <div class="form-group">
                                <label for="descripcion">Descripción</label>
                                <textarea class="form-control @if ($errors->any()) @if ($errors->has('descripcion')) is-invalid @else is-valid @endif @endif" name="descripcion" rows="3">{{ old('descripcion') }}</textarea>
                                @if ($errors->any())
                                    @error('descripcion')
                                        <div class="invalid-feedback">
                                            {{ $message }}
                                        </div>
                                    @enderror
                                @endif
                            </div>

                            <div class="contenedor-dos-campos-por-fila">

                                <div class="form-group">
                                    <label>Empresa</label>
                                    <select class="form-control lista-despegable-con-buscador @if ($errors->any()) @if ($errors->has('id_empresa')) input-error-icon @else input-success-icon @endif @endif" id="campoEmpresaDelContrato" name="id_empresa" data-live-search="true">
                                        <option value="">--Seleccionar Empresa--</option>
                                        @foreach ($empresas as $empresa)
                                            @if (old('id_empresa') == $empresa->id)
                                                <option selected value="{{ $empresa->id }}">{{ $empresa->nombre }}</option>
                                            @else
                                                <option value="{{ $empresa->id }}">{{ $empresa->nombre }}</option>
                                            @endif
                                        @endforeach
                                    </select>
                                    @if ($errors->any())
                                        @error('id_empresa')
                                            <div class="invalid-feedback" style="display: block;">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label>Administrador Contrato (Cliente)</label>
                                    <select class="form-control lista-despegable-con-buscador @if ($errors->any()) @if ($errors->has('id_admin_contrato_cliente')) input-error-icon @else input-success-icon @endif @endif" id="campoAdministradorContratoClienteDelContrato" name="id_admin_contrato_cliente" data-live-search="true">
                                        <option value="">--Seleccionar Empresa--</option>
                                        @foreach ($administradoresDeContratosClientes as $admin)
                                            @if (old('id_admin_contrato_cliente') == $admin->id)
                                                <option selected value="{{ $admin->id }}">{{ $admin->name }}</option>
                                            @else
                                                <option value="{{ $admin->id }}">{{ $admin->name }}</option>
                                            @endif
                                        @endforeach
                                    </select>
                                    @if ($errors->any())
                                        @error('id_admin_contrato_cliente')
                                            <div class="invalid-feedback" style="display: block;">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label>Administrador Contrato (Contratista)</label>
                                    <select class="form-control lista-despegable-con-buscador @if ($errors->any()) @if ($errors->has('id_admin_contrato_contratista')) input-error-icon @else input-success-icon @endif @endif" id="campoAdministradorContratoContratistaDelContrato" name="id_admin_contrato_contratista" data-live-search="true">
                                        <option value="">--Seleccionar Empresa--</option>
                                        @foreach ($administradoresDeContratosContratistas as $admin)
                                            @if (old('id_admin_contrato_contratista') == $admin->id)
                                                <option selected value="{{ $admin->id }}">{{ $admin->name }}</option>
                                            @else
                                                <option value="{{ $admin->id }}">{{ $admin->name }}</option>
                                            @endif
                                        @endforeach
                                    </select>
                                    @if ($errors->any())
                                        @error('id_admin_contrato_contratista')
                                            <div class="invalid-feedback" style="display: block;">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label for="tolerancia_norte">Tolerancia Norte</label>
                                    <input type="text" class="form-control @if ($errors->any()) @if ($errors->has('tolerancia_norte')) is-invalid @else is-valid @endif @endif" name="tolerancia_norte" value="{{ old('tolerancia_norte') }}">
                                    @if ($errors->any())
                                        @error('tolerancia_norte')
                                            <div class="invalid-feedback">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label for="tolerancia_este">Tolerancia Este</label>
                                    <input type="text" class="form-control @if ($errors->any()) @if ($errors->has('tolerancia_este')) is-invalid @else is-valid @endif @endif" name="tolerancia_este" value="{{ old('tolerancia_este') }}">
                                    @if ($errors->any())
                                        @error('tolerancia_este')
                                            <div class="invalid-feedback">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label for="tolerancia_cota">Tolerancia Cota</label>
                                    <input type="text" class="form-control @if ($errors->any()) @if ($errors->has('tolerancia_cota')) is-invalid @else is-valid @endif @endif" name="tolerancia_cota" value="{{ old('tolerancia_cota') }}">
                                    @if ($errors->any())
                                        @error('tolerancia_cota')
                                            <div class="invalid-feedback">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label for="fecha_inicio">Fecha Inicio</label>
                                    <input type="date" class="form-control @if ($errors->any()) @if ($errors->has('fecha_inicio')) is-invalid @else is-valid @endif @endif" name="fecha_inicio" value="{{ old('fecha_inicio') }}">
                                    @if ($errors->any())
                                        @error('fecha_inicio')
                                            <div class="invalid-feedback">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label for="fecha_termino">Fecha Termino</label>
                                    <input type="date" class="form-control @if ($errors->any()) @if ($errors->has('fecha_termino')) is-invalid @else is-valid @endif @endif" name="fecha_termino" value="{{ old('fecha_termino') }}">
                                    @if ($errors->any())
                                        @error('fecha_termino')
                                            <div class="invalid-feedback">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label>Estado</label>
                                    <select class="form-control lista-despegable-con-buscador @if ($errors->any()) @if ($errors->has('estado')) input-error-icon @else input-success-icon @endif @endif" id="campoEstadoDelContrato" name="estado" data-live-search="true">
                                        @if (old('estado') == 'Operativo')
                                            <option value="">--Seleccionar Estado--</option>
                                            <option value="Operativo" selected>Operativo</option>
                                            <option value="Inactivo">Inactivo</option>
                                        @elseif(old('estado') == 'Inactivo')
                                            <option value="">--Seleccionar Estado--</option>
                                            <option value="Operativo">Operativo</option>
                                            <option value="Inactivo" selected>Inactivo</option>
                                        @else
                                            <option value="">--Seleccionar Estado--</option>
                                            <option value="Operativo">Operativo</option>
                                            <option value="Inactivo">Inactivo</option>
                                        @endif
                                    </select>
                                    @if ($errors->any())
                                        @error('estado')
                                            <div class="invalid-feedback" style="display: block;">
                                                {{ $message }}
                                            </div>
                                        @enderror
                                    @endif
                                </div>
                            </div>

                            <div class="form-group">
                                <label for="observacion">Observación <span style="font-weight: 700; font-size:11px;">(Opcional)</span></label>
                                <textarea class="form-control @if ($errors->any()) @if ($errors->has('observacion')) is-invalid @else is-valid @endif @endif" name="observacion" rows="3">{{ old('observacion') }}</textarea>
                                @if ($errors->any())
                                    @error('observacion')
                                        <div class="invalid-feedback">
                                            {{ $message }}
                                        </div>
                                    @enderror
                                @endif
                            </div>

                        </div>

                        <div class=" card-footer">
                            <button type="button" onclick="EnviarCamposParaProcesarlo()" class="btn btn-aspen" id="botonDeCreacion"><i class="fas fa-plus-circle" style="margin-right: 2px;"></i> Crear Contrato </button>
                            <a href="{{ route('contrato.index') }}" role="button" class="btn btn-secondary"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@stop

@section('css')
    <link rel="stylesheet" href="{{ asset('css/generico.css') }}">
@stop

@section('js')
    <script>
        $('#campoEmpresaDelContrato').selectpicker({
            dropupAuto: false,
        });
        $('#campoAdministradorContratoClienteDelContrato').selectpicker({
            dropupAuto: false
        });
        $('#campoAdministradorContratoContratistaDelContrato').selectpicker({
            dropupAuto: false
        });
        $('#campoEstadoDelContrato').selectpicker({
            dropupAuto: false
        });
        $('#campoTipoDelRecurso').selectpicker({
            dropupAuto: false
        });
        $('#campoUnidadDeMedicionDelRecurso').selectpicker({
            dropupAuto: false
        });
    </script>

    @if (Gate::check('contrato.edit-recursos'))
        <script>
            function EnviarCamposParaProcesarlo() {
                let registrosDeRecursos= [];
                let filasRecursos = document.getElementById('tabla-recursos').tBodies[0].querySelectorAll("tr");
                filasRecursos.forEach(filaRecurso => {
                    if (filaRecurso.querySelector(".tabla-contador-recursos")) {
                        let tipoRecurso = filaRecurso.querySelector(".tabla-tipo-recurso-recursos").innerHTML.trim();
                        let nombreRecurso = filaRecurso.querySelector(".tabla-nombre-recurso-recursos").innerHTML.trim();
                        let unidadDeMedidaRecurso = filaRecurso.querySelector(".tabla-unidad-medicion-recursos").innerHTML.trim();
                        let descripcionRecurso = filaRecurso.querySelector(".tabla-descripcion-recursos").innerHTML.trim();

                        let objectoRecurso = {
                            tipoRecurso: tipoRecurso,
                            nombreRecurso: nombreRecurso,
                            unidadDeMedidaRecurso: unidadDeMedidaRecurso,
                            descripcionRecurso: descripcionRecurso
                        };

                        registrosDeRecursos.push(objectoRecurso);
                    }
                });
                registrosDeRecursos = JSON.stringify(registrosDeRecursos);
                document.getElementById("registrosRecursos").value = registrosDeRecursos;

                document.getElementById("botonDeCreacion").setAttribute("disabled", true);
                document.getElementById("preloader").removeAttribute("style");
                document.getElementById("img-preloader").style.display = "block";
                document.getElementById("formularioDeContrato").submit();
            }

            let cantidadMaximaDeRegistrosDeRecursos = 0;
            let registrosDeRecursosOld = JSON.parse(document.getElementById("registrosRecursos").value);
            if (registrosDeRecursosOld.length > 0) {
                registrosDeRecursosOld.forEach(elemento => {
                    cantidadMaximaDeRegistrosDeRecursos++;
                    if (document.getElementById("recursosNoDisponibleEnLaTabla")) {
                        document.getElementById("recursosNoDisponibleEnLaTabla").remove();
                    }
                    document.getElementById("registrosDeRecursos").innerHTML +=
                        '<tr role="row" class="odd">' +
                        '<td class="tabla-contador-recursos">' + cantidadMaximaDeRegistrosDeRecursos + '</td>' +
                        '<td class="tabla-tipo-recurso-recursos">' + elemento.tipoRecurso + '</td>' +
                        '<td class="tabla-nombre-recurso-recursos">' + elemento.nombreRecurso + '</td>' +
                        '<td class="tabla-unidad-medicion-recursos">' + elemento.unidadDeMedidaRecurso + '</td>' +
                        '<td class="tabla-descripcion-recursos">' + elemento.descripcionRecurso + '</td>' +
                        '<td class="tabla-accion-recursos">' +
                        '<button onclick="habilitarBotonConfirmarEliminacionDelRecurso(this)" type="button" class="btn btn-danger mr-1"><i class="fas fa-trash-alt"></i></button>' +
                        '<button onclick="eliminarFilaDelRecurso(this)" style="display: none;" type="button" class="btn btn-danger boton-confirmar-recurso mr-1">Confirmar</button>' +
                        '</td>' +
                        '</tr>';
                });
            }

            function agregarCamposDelRecurso() {
                let campoTipoDelRecurso = document.getElementById("campoTipoDelRecurso").value.trim();
                let campoNombreDelRecurso = document.getElementById("campoNombreDelRecurso").value.trim();
                let campoUnidadDeMedicion = document.getElementById("campoUnidadDeMedicionDelRecurso").value.trim();
                let campoNombreUnidadDeMedicion = document.getElementById("campoUnidadDeMedicionDelRecurso").options[document.getElementById("campoUnidadDeMedicionDelRecurso").selectedIndex].text;
                let campoDescripcionDelRecurso = document.getElementById("campoDescripcionDelRecurso").value.trim();
                if (campoTipoDelRecurso.length > 0 && campoNombreDelRecurso.length > 0 && campoUnidadDeMedicion.length > 0 && campoDescripcionDelRecurso.length > 0) {
                    cantidadMaximaDeRegistrosDeRecursos++;
                    if (document.getElementById("recursosNoDisponibleEnLaTabla")) {
                        document.getElementById("recursosNoDisponibleEnLaTabla").remove();
                    }
                    document.getElementById("registrosDeRecursos").innerHTML +=
                        '<tr role="row" class="odd">' +
                        '<td class="tabla-unidad-medicion-recursos" style="display:none;">' + campoUnidadDeMedicion + '</td>' +
                        '<td class="tabla-contador-recursos">' + cantidadMaximaDeRegistrosDeRecursos + '</td>' +
                        '<td class="tabla-tipo-recurso-recursos">' + campoTipoDelRecurso + '</td>' +
                        '<td class="tabla-nombre-recurso-recursos">' + campoNombreDelRecurso + '</td>' +
                        '<td class="tabla-nombre-unidad-medicion-recursos">' + campoNombreUnidadDeMedicion + '</td>' +
                        '<td class="tabla-descripcion-recursos">' + campoDescripcionDelRecurso + '</td>' +
                        '<td class="tabla-accion-recursos">' +
                        '<button onclick="habilitarBotonConfirmarEliminacionDelRecurso(this)" type="button" class="btn btn-danger mr-1"><i class="fas fa-trash-alt"></i></button>' +
                        '<button onclick="eliminarFilaDelRecurso(this)" style="display: none;" type="button" class="btn btn-danger boton-confirmar-recurso mr-1">Confirmar</button>' +
                        '</td>' +
                        '</tr>';

                    $('#campoTipoDelRecurso').selectpicker('val', "");
                    document.getElementById("validacionCampoTipoDelRecurso").innerHTML = "";
                    document.getElementById("campoTipoDelRecurso").classList.remove('input-success-icon');
                    document.getElementById("campoTipoDelRecurso").classList.remove('input-error-icon');
                    document.getElementById("validacionCampoTipoDelRecurso").style.display = "none";

                    document.getElementById("campoNombreDelRecurso").value = "";
                    document.getElementById("validacionCampoNombreDelRecurso").innerHTML = "";
                    document.getElementById("campoNombreDelRecurso").setAttribute("class", "form-control");

                    $('#campoUnidadDeMedicionDelRecurso').selectpicker('val', "");
                    document.getElementById("validacionCampoUnidadDeMedicionDelRecurso").innerHTML = "";
                    document.getElementById("campoUnidadDeMedicionDelRecurso").classList.remove('input-success-icon');
                    document.getElementById("campoUnidadDeMedicionDelRecurso").classList.remove('input-error-icon');
                    document.getElementById("validacionCampoUnidadDeMedicionDelRecurso").style.display = "none";

                    document.getElementById("campoDescripcionDelRecurso").value = "";
                    document.getElementById("validacionCampoDescripcionDelRecurso").innerHTML = "";
                    document.getElementById("campoDescripcionDelRecurso").setAttribute("class", "form-control");
                } else {
                    if (campoTipoDelRecurso.length > 0) {
                        document.getElementById("campoTipoDelRecurso").classList.remove('input-error-icon');
                        document.getElementById("campoTipoDelRecurso").classList.add('input-success-icon');
                        document.getElementById("validacionCampoTipoDelRecurso").innerHTML = "";
                        document.getElementById("validacionCampoTipoDelRecurso").style.display = "none";
                    } else {
                        document.getElementById("campoTipoDelRecurso").classList.remove('input-success-icon');
                        document.getElementById("campoTipoDelRecurso").classList.add('input-error-icon');
                        document.getElementById("validacionCampoTipoDelRecurso").innerHTML = "El campo tipo del recurso es obligatorio";
                        document.getElementById("validacionCampoTipoDelRecurso").style.display = "block";
                    }

                    if (campoNombreDelRecurso.length > 0) {
                        document.getElementById("campoNombreDelRecurso").setAttribute("class", "form-control is-valid");
                        document.getElementById("validacionCampoNombreDelRecurso").innerHTML = "";
                    } else {
                        document.getElementById("campoNombreDelRecurso").setAttribute("class", "form-control is-invalid");
                        document.getElementById("validacionCampoNombreDelRecurso").innerHTML = "El campo nombre recurso es obligatorio";
                    }

                    if (campoUnidadDeMedicion.length > 0) {
                        document.getElementById("campoUnidadDeMedicionDelRecurso").classList.remove('input-error-icon');
                        document.getElementById("campoUnidadDeMedicionDelRecurso").classList.add('input-success-icon');
                        document.getElementById("validacionCampoUnidadDeMedicionDelRecurso").innerHTML = "";
                        document.getElementById("validacionCampoUnidadDeMedicionDelRecurso").style.display = "none";
                    } else {
                        document.getElementById("campoUnidadDeMedicionDelRecurso").classList.remove('input-success-icon');
                        document.getElementById("campoUnidadDeMedicionDelRecurso").classList.add('input-error-icon');
                        document.getElementById("validacionCampoUnidadDeMedicionDelRecurso").innerHTML = "El campo unidad de medición del recurso es obligatorio";
                        document.getElementById("validacionCampoUnidadDeMedicionDelRecurso").style.display = "block";
                    }

                    if (campoDescripcionDelRecurso .length > 0) {
                        document.getElementById("campoDescripcionDelRecurso").setAttribute("class", "form-control is-valid");
                        document.getElementById("validacionCampoDescripcionDelRecurso").innerHTML = "";
                    } else {
                        document.getElementById("campoDescripcionDelRecurso").setAttribute("class", "form-control is-invalid");
                        document.getElementById("validacionCampoDescripcionDelRecurso").innerHTML = "El campo descripción del recurso es obligatorio";
                    }
                }
            }

            function deshabilitarBotonesConfirmarEliminacionRecurso() {
                let botones = document.querySelectorAll(".boton-confirmar-recurso");
                botones.forEach(elemento => {
                    elemento.style.display = 'none';
                });
            }

            function habilitarBotonConfirmarEliminacionDelRecurso(boton) {

                if (boton.nextElementSibling.style.display == 'none') {
                    deshabilitarBotonesConfirmarEliminacionRecurso();
                    boton.nextElementSibling.style.display = 'inline-block';
                } else {
                    if (boton.nextElementSibling.style.display == 'inline-block') {
                        deshabilitarBotonesConfirmarEliminacionRecurso();
                    }
                }

            }

            function eliminarFilaDelRecurso(boton) {
                let elementoFila = boton.parentElement.parentElement;
                elementoFila.remove();
                cantidadMaximaDeRegistrosDeRecursos = 0;
                let filas = document.getElementById('tabla-recursos').tBodies[0].querySelectorAll("tr");
                if (filas.length > 0) {
                    filas.forEach(elemento => {
                        cantidadMaximaDeRegistrosDeRecursos++;
                        elemento.querySelector(".tabla-contador-recursos").innerHTML = cantidadMaximaDeRegistrosDeRecursos;
                    });
                } else {
                    document.getElementById("registrosDeRecursos").innerHTML =
                        '<tr id="recursosNoDisponibleEnLaTabla">' +
                        '<td colspan="6" class="text-center">No hay recursos disponibles en la tabla</td>' +
                        '</tr>';
                }
            }
        </script>
    @else
        <script>
            function EnviarCamposParaProcesarlo() {
                document.getElementById("botonDeCreacion").setAttribute("disabled", true);
                document.getElementById("preloader").removeAttribute("style");
                document.getElementById("img-preloader").style.display = "block";
                document.getElementById("formularioDeContrato").submit();
            }
        </script>
    @endif

    <script>
        function seleccionarTodosLosItems(checkbox) {
            if (checkbox.checked == true) {
                let todosLosCheckBox = document.querySelectorAll(".checkbox-seleccion-item");
                todosLosCheckBox.forEach(item => {
                    item.checked = true;
                });
            } else if (checkbox.checked == false) {
                let todosLosCheckBox = document.querySelectorAll(".checkbox-seleccion-item");
                todosLosCheckBox.forEach(item => {
                    item.checked = false;
                });
            }
        }
    </script>

    @if (session('alerta') != null)
        <script>
            Swal.fire({
                icon: 'success',
                title: '¡Contrato Creado!',
                text: '{{ session('alerta') }}',
                confirmButtonColor: "#448aff",
                confirmButtonText: "Confirmar"
            })
        </script>
    @endif
@stop