{{-- MODAL EDIT SOLICITUD --}}
<div class="modal fade" id="modalGestionSolicitud" data-bs-keyboard="false" data-bs-backdrop="static" role="dialog"
    aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-fullscreen">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel"></h5>
            </div>
            <div class="modal-body">
                <div class="editSolicitudIT">
                    <div class="row">
                        <div class="col-lg-4">
                            <div class="row asuntoSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="asuntoBox">Asunto:</label>
                                    <input type="text" class="form-control form-control-sm" name="asuntoBox"
                                        id="asuntoBox" readonly>
                                </div>
                            </div>
                            <div class="row descripcionSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label"
                                        for="descripcionBox">Descripción:</label>
                                    <textarea style="height: 295px" name="descripcionBox" id="descripcionBox" class="form-control" cols="8"
                                        rows="15" readonly></textarea>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <div class="row tipoSolicitudSection" style="display: none">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="tipoSolicitudBox">Tipo
                                        Solicitud:</label>
                                    <select type="text" class="form-select form-select-sm" name="tipoSolicitudBox"
                                        id="tipoSolicitudBox" disabled>
                                        @foreach ($tiposData as $tipo)
                                            <option value="{{ $tipo->pk_tipo }}">{{ $tipo->descripcion_tipo }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="row empleadoSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="empleadoBox">Solicitado
                                        por:</label>
                                    <input type="text" class="form-control form-control-sm" name="empleadoBox"
                                        id="empleadoBox" readonly>
                                </div>
                            </div>
                            <div class="row prioridadSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="prioridad">Prioridad:</label>
                                    <select type="text" class="form-select form-select-sm" name="prioridad"
                                        id="prioridad" disabled>
                                        @foreach ($prioridadesData as $prioridad)
                                            <option value="{{ $prioridad->id_prioridad }}">
                                                {{ $prioridad->prioridad }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="row sistemaSection" style="display: none">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="sistemaBox">Sistema:</label>
                                    <select type="text" class="form-select form-select-sm" name="sistemaBox"
                                        id="sistemaBox" disabled>
                                        @foreach ($sistemasData as $system)
                                            <option value="{{ $system->id }}">{{ $system->sistema }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="row sucursalSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="sucursalBox">Sucursal:</label>
                                    <select type="text" class="form-select form-select-sm" name="sucursalBox"
                                        id="sucursalBox" disabled>
                                        <option value="0">Seleccione una opción</option>
                                        @foreach ($sucursalesData as $sucursal)
                                            <option value="{{ $sucursal->id }}">{{ $sucursal->sucursal }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="row latitudSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="sucursalBox">Latitud:</label>
                                    <input type="text" class="form-control form-control-sm" id="latitud" readonly>
                                </div>
                            </div>
                            <div class="row latitudSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="sucursalBox">Longitud:</label>
                                    <input type="text" class="form-control form-control-sm" id="longitud"
                                        readonly>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <div class="row estadoSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="estadoOption">Estado:</label>
                                    <select type="text" class="form-select form-select-sm" name="estadoOption"
                                        id="estadoOption">
                                        <option value="0">Seleccione una opción</option>
                                        @foreach ($estadosSolicitudesData as $estado)
                                            <option value="{{ $estado->id }}" id="estado{{ $estado->id }}">
                                                {{ $estado->estado }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="row d-flex justify-content align-items-end fechaSection">
                                <div class="col-lg-9">
                                    <div class="form-group">
                                        <label for="" class="col-form-label" for="fechaSelect">Fecha
                                            Estimada:</label>
                                        <input type="datetime-local" class="form-control form-control-sm"
                                            name="fechaSelect" id="fechaSelect">
                                    </div>
                                </div>
                                <div class="col-lg-3">
                                    <div class="form-group">
                                        <button name="extender_tiempo" id="extender_tiempo"
                                            class="btn btn-sm btn-warning" type="button" data-bs-toggle="modal"
                                            data-bs-target="#modalExtenderFecha" disabled>Extender Fecha</button>
                                    </div>
                                </div>
                            </div>
                            <div class="row prioridadITSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="prioridadIT">Prioridad a
                                        Resolver:</label>
                                    <select type="text" class="form-select form-select-sm" name="prioridadIT"
                                        id="prioridadIT">
                                        <option value="0">Seleccione una opción</option>
                                        @foreach ($prioridadesData as $prioridad)
                                            <option value="{{ $prioridad->id_prioridad }}">
                                                {{ $prioridad->prioridad }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="row dificultadInicioSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="dificultadInicio">Dificultad
                                        Inicio:</label>
                                    <select type="text" class="form-select form-select-sm" name="dificultadInicio"
                                        id="dificultadInicio">
                                        <option value="0">Seleccione una opción</option>
                                        @foreach ($dificultadesData as $dificultad)
                                            <option value="{{ $dificultad->id_dificultad }}">
                                                {{ $dificultad->tiempo }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="row dificultadFinalSection">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="dificultadInicio">Dificultad
                                        Final:</label>
                                    <select class="form-select form-select-sm" name="dificultadFinal"
                                        id="dificultadFinal" disabled>
                                        <option value="0">Seleccione una opción</option>
                                        @foreach ($dificultadesData as $dificultad)
                                            <option value="{{ $dificultad->id_dificultad }}">
                                                {{ $dificultad->tiempo }}</option>
                                        @endforeach
                                    </select>

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

                <div class="errorUsuarioView">
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label for="" class="col-form-label" for="dificultadInicio">Error de
                                    Usuario:</label>
                                <select class="form-select form-select-sm" name="errorUsuarioCheck"
                                    id="errorUsuarioCheck">
                                    <option value="#">Seleccione si es o no Error de Usuario</option>
                                    <option value="0">NO ES ERROR DE USUARIO</option>
                                    <option value="1">SI ES ERROR DE USUARIO</option>
                                </select>
                            </div>
                            <div class="form-group">
                                <label for="" class="col-form-label" for="dificultadInicio">Nivel Error de
                                    Usuario:</label>
                                <select class="form-select form-select-sm" name="nivel_errorUsuarioCheck"
                                    id="nivel_errorUsuarioCheck">
                                    <option value="0" selected>Seleccione un Nivel de Error de Usuario</option>
                                    @foreach ($nivelesErrorData as $nvl)
                                        <option value="{{ $nvl->id_nivel_error_usuario }}"
                                            style="background-color: {{ $nvl->color }};">
                                            {{ $nvl->nivel_error_usuario }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label for="" class="col-form-label textControls"
                                    for="comment_errorUsuarioCheck">Comentario Error de Usuario:</label>
                                <textarea name="comment_errorUsuarioCheck" id="comment_errorUsuarioCheck" class="form-control" rows="3"></textarea>
                            </div>
                        </div>
                    </div>

                </div>

                <div class="editSolicitudIT">
                    <div class="row">
                        <div class="row">
                            <div class="form-group">
                                <label for="" class="col-form-label textControls"
                                    for="justificacionBox">Justificación:</label>
                                <textarea name="justificacionBox" id="justificacionBox" class="form-control textControlsArea"
                                    rows="3" readonly></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label for="" class="col-form-label" for="comentarioPausa">Comentario
                                    Pausa:</label>
                                <div name="comentarioPausa" id="comentarioPausa" class="form-control form-control-sm quill-editor"
                                rows="5" readonly></div>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label for="" class="col-form-label" for="comentarioFinal">Comentario
                                    Finalizado:</label>
                                <div name="comentarioFinal" id="comentarioFinal" class="form-control form-control-sm quill-editor"
                                rows="5" readonly></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-group">
                            <label for="">URL / Enlace: </label>
                            <input type="text" name="url" placeholder="Enlace..."
                                class="form-control form-control-sm inputControls" id="txtURL">
                        </div>
                    </div>

                    <div class="row">
                        <div class="mb-3">
                            <label for="pasos_resolver" class="form-label">Pasos para Resolver:</label>
                            <div class="form-control quill-editor" name="pasos_resolver" id="pasos_resolver" rows="5" readonly></div>
                        </div>
                    </div>
                </div>

                <div class="row rechazarSolicitudSection">
                    <div class="col-lg-12">
                        <div class="form-group">
                            <label for="" class="col-form-label" for="comentarioFinal">Comentario:</label>
                            <textarea name="comentarioRechazo" id="comentarioRechazo" class="form-control form-control-sm" cols="20"
                                rows="3"></textarea>
                        </div>
                    </div>
                </div>


                <div class="modal-footer">
                    <input type="hidden" id="hidden_solicitud_id">
                    <input type="hidden" id="hidden_estado_anterior">
                    <input type="hidden" id="hidden_optionReject">

                    <button type="submit" id="btnRechazar" class="btn btn-danger">Rechazar</button>
                    <button type="submit" id="btnGuardar" class="btn btn-success">Guardar</button>
                    <button type="button" class="btn btn-secondary" id="btnCancelar"
                        data-dismiss="modal">Cancelar</button>
                </div>
            </div>
        </div>
    </div>
</div>



<div class="modal fade" id="modalExtenderFecha" tabindex="-1" aria-labelledby="modalTitle" aria-hidden="true"
    data-bs-keyboard="false" data-bs-backdrop="static">

    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header" style="background-color: rgb(118, 177, 123);">
                <h5 class="modal-title" style="font-weight: 900; color: #ebebeb;" id="modalTitle">EXTENDER FECHA HORA
                    ESPERA FINALIZADO
                </h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"
                    style="font-weight: 900; color: white;" aria-label="Close"></button>
            </div>

            <div class="modal-body">

                <form id="formExtenderTiempo" method="POST">

                    <div class="row">

                        <div class="col-lg-6">
                            <div class="form-group">
                                <label for="nombre">Fecha Final Anterior:</label>
                                <input type="datetime-local" class="form-control form-control-sm"
                                    id="fecha_final_old" name="fecha_final_old" disabled>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label for="nombre">Fecha Final Nueva:</label>
                                <input type="datetime-local" class="form-control form-control-sm"
                                    id="fecha_final_new" name="fecha_final_new" autofocus required>
                            </div>
                        </div>

                    </div>

                    <div class="row">
                        <div class="form-group">
                            <label for="descripcion">Comentario de Tiempo Extendido:</label>
                            <textarea class="form-control form-control-sm" id="comentario_tiempo_extra" name="comentario_tiempo_extra"
                                rows="3" required></textarea>
                        </div>
                    </div>

                    <br>

                    <div class="modal-footer">
                        <button type="submit" class="btn btn-success">Guardar</button>
                        <button type="button" class="btn btn-danger" data-bs-dismiss="modal">Cancelar</button>
                    </div>

                </form>

            </div>

        </div>
    </div>

</div>