@extends('adminlte::page')

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

@section('title', 'Detalle Orden de Trabajo | 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-8">

                <div class="card card-aspen">
                    <div class="card-header">
                        <h3 class="card-title">Detalle Orden de Trabajo </h3>
                    </div>

                    <form id="formularioDeOrdenDeTrabajo">
                        @csrf

                        <div class="card-body">

                            <div class="contenedor-dos-campos-por-fila">
                                <div class="form-group">
                                    <label>Número de Orden de Trabajo</label>
                                    <input type="text" class="form-control" value="{{ $ordenDeTrabajo->numero_orden_trabajo}}" disabled="true">
                                </div>

                                <div class="form-group">
                                    <label>Contrato</label>
                                    <input type="text" class="form-control" value="{{ $ordenDeTrabajo->contrato->numero_contrato }}" disabled="true">
                                </div>

                                <div class="form-group">
                                    <label>Cliente</label>
                                    <input type="text" class="form-control" value="{{ $ordenDeTrabajo->cliente->name }}" disabled="true">
                                </div>

                                @if (isset($ordenDeTrabajo->proyecto))
                                    <div class="form-group">
                                        <label>Proyecto</label>
                                        <input type="text" class="form-control" value="{{ $ordenDeTrabajo->proyecto->nombre }}" disabled="true">
                                    </div>
                                @else
                                    <div class="form-group">
                                        <label>Proyecto</label>
                                        <input type="text" class="form-control" value="" disabled="true">
                                    </div>
                                @endif

                                <div class="form-group">
                                    <label>Área/Sector</label>
                                    <input type="text" class="form-control" value="{{ $ordenDeTrabajo->area->nombre}}" disabled="true">
                                </div>

                                <div class="form-group">
                                    <label>Servicio</label>
                                    <input type="text" class="form-control" value="{{ $servicio->nombre }}" disabled="true">
                                </div>

                                <div class="form-group">
                                    <label>Tipo de Pozo</label>
                                    <input type="text" class="form-control" class="form-control" name="tipo_servicio" value="{{ $ordenDeTrabajo->tipo_servicio }}"  disabled="true">
                                </div>

                                @if ($servicio->nombre=="Sondajes")
                                    <div class="form-group">
                                        <label>Sistema de Referencia de Origen</label>
                                        <input type="text" class="form-control" value="{{ $ordenDeTrabajo->sistema_referencia_origen}}" disabled="true">
                                    </div>
    
                                    <div class="form-group">
                                        <label>Sistema de Proyección</label>
                                        <input type="text" class="form-control" value="{{ $ordenDeTrabajo->sistema_proyeccion }}" readonly="true">
                                    </div>
    
                                    <div class="form-group">
                                        <label>Conversión a</label>
                                        <input type="text" class="form-control" value="{{ $ordenDeTrabajo->sistema_proyeccion_visualización }}" readonly="true">
                                    </div>
                                @elseif($servicio->nombre=="Pilas")
                                    <div class="form-group">
                                        <label>Sistema de Proyección</label>
                                        <input type="text" class="form-control" value="{{ $ordenDeTrabajo->sistema_proyeccion }}" readonly="true">
                                    </div>
    
                                    <div class="form-group">
                                        <label>Conversión a</label>
                                        <input type="text" class="form-control" value="{{ $ordenDeTrabajo->sistema_proyeccion_visualización }}" readonly="true">
                                    </div>
                                @elseif($servicio->nombre=="Calicatas")
                                    <div class="form-group">
                                        <label>Sistema de Proyección</label>
                                        <input type="text" class="form-control" value="{{ $ordenDeTrabajo->sistema_proyeccion }}" readonly="true">
                                    </div>
    
                                    <div class="form-group">
                                        <label>Conversión a</label>
                                        <input type="text" class="form-control" value="{{ $ordenDeTrabajo->sistema_proyeccion_visualización }}" readonly="true">
                                    </div>
                                @endif
                            </div>

                            <div class="form-group">
                                <label for="descripcion">Descripción</label>
                                <textarea class="form-control" name="descripcion" rows="3" readonly="true">{{ $ordenDeTrabajo->descripcion }}</textarea>
                            </div>

                            <div class="contenedor-dos-campos-por-fila">
                                <div class="form-group">
                                    <label>Fecha Inicio</label>
                                    <input type="date" class="form-control" name="fecha_inicio" value="{{ $ordenDeTrabajo->fecha_inicio }}" readonly="true">
                                </div>

                                <div class="form-group">
                                    <label>Estado</label>
                                    <input type="text" class="form-control" name="fecha_inicio" value="{{ $ordenDeTrabajo->estado}}" readonly="true">
                                </div>
                            </div>

                            <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>Acción</th>
                                            <th>Archivo</th>
                                            <th>Tipo</th>
                                        </tr>
                                    </thead>
                                    <tbody id="registrosDeArchivosRegistrados">
                                        @if (count($ordenDeTrabajo->archivos) > 0)
                                            @foreach ($ordenDeTrabajo->archivos as $archivoOt)
                                                <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">
                                                                @if (strtolower($archivoOt->extension)== "png" || strtolower($archivoOt->extension)== "jpeg" 
                                                                || strtolower($archivoOt->extension)== "gif" || strtolower($archivoOt->extension)== "jpg"
                                                                || strtolower($archivoOt->extension)== "bmp" || strtolower($archivoOt->extension)== "pdf"
                                                                || strtolower($archivoOt->extension)== "txt")
                                                                    <a class="dropdown-item" href="#" onclick="visualizarArchivoRegistrado('{{ $archivoOt->nombre_Archivo }}', '{{ strtolower($archivoOt->extension) }}','{{ $archivoOt->id_orden_trabajo }}','{{ $archivoOt->nombre_Archivo }}')"><i class="fas fa-eye" aria-hidden="true"></i> Visualizar Archivo</a>
                                                                @endif
                                                                <a class="dropdown-item" href="{{route('orden-trabajo.descargar-archivo',$archivoOt)}}"><i class="fas fa-download" aria-hidden="true"></i> Descargar Archivo</a>
                                                            </div>
                                                        </div>
                                                    </td>
                                                    <td class="{{obtenerEstiloDelTipoArchivo($archivoOt->extension)}}">{{ $archivoOt->nombre_Archivo }}</td>
                                                    <td>{{ obtenerNombreDeLaExtensionDelArchivo($archivoOt->extension) }}</td>
                                                </tr>
                                            @endforeach
                                        @else
                                            <tr id="archivosNoDisponibleEnLaTabla">
                                                <td colspan="3" class="text-center">No hay archivos disponibles en la tabla</td>
                                            </tr>
                                        @endif
                                    </tbody>
                                </table>
                            </div>

                            @if (count($ordenDeTrabajo->puntos)>0)
                                <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>Acción</th>
                                                <th>Nombre del Punto</th>
                                                <th>Nombre del Sondaje</th>
                                                <th>Observación</th>
                                                <th>Motivo del descarte</th>
                                                <th>Estado</th>
                                            </tr>
                                        </thead>
                                        <tbody id="registrosDePuntosIngresados">
                                            @foreach ($ordenDeTrabajo->puntos as $item)
                                                @php
                                                    $motivoRechazo="";
                                                    if($item->replanteo==true){
                                                        $motivoRechazo="punto no replanteado";
                                                    }else if(isset($item->puntosEnLaEtapaDePlataforma)){
                                                        if($item->puntosEnLaEtapaDePlataforma->azimut_cumple==false){
                                                            $motivoRechazo="azimut no cumple";
                                                        }
                                                    }
                                                @endphp
                                                <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">
                                                                <a class="dropdown-item" href="{{route("orden-trabajo.show-item", [$ordenDeTrabajo->id, $item->id])}}"><i class="fas fa-eye" aria-hidden="true"></i> Detalle Punto</a>
                                                                
                                                                @if (Gate::check('orden-trabajo.editar-punto'))
                                                                    <a class="dropdown-item" href="{{route("orden-trabajo.edit-punto", $item->id)}}"><i class="fas fa-edit" aria-hidden="true"></i> Editar Punto</a>
                                                                @endif
                                                                
                                                                @if ($ordenDeTrabajo->estado=="Abierto")
                                                                @if (!isset($item->puntosEnLaEtapaDeCollar))
                                                                    @if (Gate::check('orden-trabajo.edit-estado-punto'))
                                                                        @if (Gate::check('orden-trabajo.edit'))
                                                                            @if ($item->estado=="Operativo")
                                                                                <a onclick="abrirModalDeRechazarItem(this.parentElement.parentElement.parentElement.parentElement,'{{ $item->punto }}','{{ $item->id }}')" class="dropdown-item" href="#"><i class="fas fa-award" aria-hidden="true"></i> Descartar Punto</a>
                                                                            @endif
                
                                                                            @if ($item->estado=="Descartado")
                                                                                <a onclick="aprobarItem('{{ $item->punto }}','{{ $item->id }}','{{$motivoRechazo}}')" class="dropdown-item" href="#"><i class="fas fa-award" aria-hidden="true"></i> Utilizar Punto (Operativo)</a>
                                                                            @endif
                                                                        @else
                                                                            @if (Gate::check('orden-trabajo.edit-creadas') && $ordenDeTrabajo->id_cliente == auth()->user()->id)
                                                                                @if ($item->estado=="Operativo")
                                                                                    <a onclick="abrirModalDeRechazarItem(this.parentElement.parentElement.parentElement.parentElement,'{{ $item->punto }}','{{ $item->id }}')" class="dropdown-item" href="#"><i class="fas fa-award" aria-hidden="true"></i> Descartar Punto</a>
                                                                                @endif
                    
                                                                                @if ($item->estado=="Descartado")
                                                                                    <a onclick="aprobarItem('{{ $item->punto }}','{{ $item->id }}','{{$motivoRechazo}}')" class="dropdown-item" href="#"><i class="fas fa-award" aria-hidden="true"></i> Utilizar Punto (Operativo)</a>
                                                                                @endif
                                                                            @endif
                                                                        @endif
                                                                    @endif  
                                                                @endif
                                                                @endif

                                                                @isset($item->puntosEnLaEtapaDeTerreno)
                                                                    @if (Gate::check('orden-trabajo.retrocer-etapa-puntos'))
                                                                        @if (isset($item->puntosEnLaEtapaDeCollar))
                                                                            <a onclick="abrirModalRetrocederEtapaDelItem('{{ $item->punto }}','{{ $item->id }}','collar')" class="dropdown-item" href="#"><i class="fas fa-hourglass-half" aria-hidden="true"></i>  Retroceder Etapa</a>
                                                                        @elseif(isset($item->puntosEnLaEtapaDePerforacion))
                                                                            <a onclick="abrirModalRetrocederEtapaDelItem('{{ $item->punto }}','{{ $item->id }}','perforacion')" class="dropdown-item" href="#"><i class="fas fa-hourglass-half" aria-hidden="true"></i>  Retroceder Etapa</a>
                                                                        @elseif(isset($item->puntosEnLaEtapaDePlataforma))
                                                                            <a onclick="abrirModalRetrocederEtapaDelItem('{{ $item->punto }}','{{ $item->id }}','plataforma')" class="dropdown-item" href="#"><i class="fas fa-hourglass-half" aria-hidden="true"></i>  Retroceder Etapa</a>
                                                                        @elseif(isset($item->puntosEnLaEtapaDeTerreno))
                                                                            <a onclick="abrirModalRetrocederEtapaDelItem('{{ $item->punto }}','{{ $item->id }}','terreno')" class="dropdown-item" href="#"><i class="fas fa-hourglass-half" aria-hidden="true"></i>  Retroceder Etapa</a>
                                                                        @endif
                                                                    @endif
                                                                @endisset

                                                                @isset($item->puntosEnLaEtapaDeCollar)
                                                                    <a class="dropdown-item" href="{{route('orden-trabajo.descargar-reporte-punto',[$ordenDeTrabajo,$item])}}"><i class="fas fa-book" aria-hidden="true"></i> Control TopoGráfico</a>
                                                                @endisset    
                                                                
                                                                @if (count($item->historialDeEtapasRetrocedidas)>0)
                                                                    <a class="dropdown-item" href="#" onclick="abrirModalParaMostrarHistorialDeEtapasRetrocedidas('{{$item->punto}}','{{json_encode($item->historialDeEtapasRetrocedidas)}}')"><i class="fas fa-dna" aria-hidden="true"></i> Historial de etapas Retrocedidas</a>
                                                                @endif
                                                                <a class="dropdown-item" href="{{route('orden-trabajo.descargar-archivo-kml',[$ordenDeTrabajo,$item])}}"><i class="fas fa-map" aria-hidden="true"></i> Archivo KML</a>
                                                                
                                                                @if ($ordenDeTrabajo->estado=="Abierto")
                                                                    @if (Gate::check('orden-trabajo.eliminar-punto'))
                                                                        <a onclick="eliminarItem('{{ $item->id }}')" class="dropdown-item" href="#"><i class="fas fa-trash" aria-hidden="true"></i> Eliminar Punto</a>
                                                                    @endif
                                                                @endif
                                                            </div>
                                                        </div>
                                                    </td>
                                                    <td>{{$item->punto}}</td>
                                                    <td>{{$item->punto_definitivo}}</td>
                                                    <td>
                                                        @isset($item->observacion)
                                                            <button type="button" onclick="verObservacion('{{$item->punto}}','{{ $item->observacion }}')" class="btn btn-block btn-default"><i class="fas fa-eye" aria-hidden="true"></i></button>
                                                        @endisset
                                                    </td>
                                                    <td>
                                                        @isset($item->observacion_estado)
                                                            <button type="button" onclick="verMotivoDeLaInactividad('{{$item->punto}}','{{ $item->observacion_estado }}')" class="btn btn-block btn-default"><i class="fas fa-eye" aria-hidden="true"></i></button>
                                                        @endisset
                                                    </td>
                                                    @if ($item->estado=="Operativo")
                                                        <td><span class="badge badge-success">{{$item->estado}}</span></td>
                                                    @else    
                                                        <td><span class="badge badge-danger">{{$item->estado}}</span></td>
                                                    @endif
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            @endif
                        </div>

                        <div class=" card-footer">
                            @if (Gate::check('orden-trabajo.index')  || Gate::check('orden-trabajo.index-creadas'))
                                @if (Gate::check('orden-trabajo.index-cliente') || Gate::check('orden-trabajo.index-creadas-cliente'))
                                    @if ($servicio->nombre=="Sondajes")
                                        <a href="{{ route('orden-trabajo.index',$servicio) }}" role="button" class="btn btn-secondary"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                                    @elseif($servicio->nombre=="Pilas")
                                        <a href="{{ route('orden-trabajo.index-pila',$servicio) }}" role="button" class="btn btn-secondary"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                                    @endif  
                                @else   
                                    @if ($servicio->nombre=="Sondajes")
                                        <a href="{{ route('orden-trabajo.index',$servicio) }}" role="button" class="btn btn-secondary"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                                    @elseif($servicio->nombre=="Pilas")
                                        <a href="{{ route('orden-trabajo.index-pila',$servicio) }}" role="button" class="btn btn-secondary"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                                    @endif  
                                @endif
                            @elseif(Gate::check('orden-trabajo.index-cliente') || Gate::check('orden-trabajo.index-creadas-cliente')) 
                                @if ($servicio->nombre=="Sondajes")
                                    <a href="{{ route('orden-trabajo.index-cliente',$servicio) }}" role="button" class="btn btn-secondary"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                                @elseif($servicio->nombre=="Pilas")
                                    <a href="{{ route('orden-trabajo.index-cliente-pila',$servicio) }}" role="button" class="btn btn-secondary"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                                @endif  
                            @endif
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modalVisualizarArchivo" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <form>
            <div class="modal-dialog modal-xl">
                <div class="modal-content">
                    <div class="modal-header" style="background-color: #007bff; color:white;">
                        <h5 class="modal-title" id="modalTituloVisualizarArchivo"></h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color:white;">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div id="modalContenidoModalVisualizarArchivo" style="text-align: center;">

                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <div class="modal fade" id="modalVerMotivoDeLaInactividadItem" tabindex="-1" aria-labelledby="LabelObservacionItem" aria-hidden="true">
        <form id="formularioModalVerMotivoDelRechazoItem">
            @csrf
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header" style="background-color: #007bff; color:white;">
                        <h5 class="modal-title" id="LabelModalVerMotivoDeLaInactividadItem"></h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color:white;">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <label>Motivo De La Inactividad</label>
                            <textarea class="form-control" id="verModalMotivoDeLaInactividadItem" rows="3" readonly="true"></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <div class="modal fade" id="modalRechazarItem" tabindex="-1" aria-labelledby="LabelRechazoRequisicion" aria-hidden="true">
        <form id="formularioModalDescartePostulante" method="POST">
            @csrf
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header" style="background-color: #007bff; color:white;">
                        <h5 class="modal-title" id="LabelModalRechazarItem"></h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color:white;">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <label>Motivo Del Descarte</label>
                            <textarea class="form-control" id="motivoDelRechazoModalRechazarItem" name="motivo_rechazo" rows="3"></textarea>
                            <div class="invalid-feedback" id="validacionMotivoDelRechazoModalRechazarItem">

                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger" id="botonModalRecharItem">Descartar Punto</button>
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <div class="modal fade" id="modalRetrocederEtapaDeUnPunto" tabindex="-1" aria-labelledby="LabelRechazoRequisicion" aria-hidden="true">
        <form id="formularioModalRetrocederEtapaDeUnPunto" method="POST">
            @csrf
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header" style="background-color: #007bff; color:white;">
                        <h5 class="modal-title" id="LabelModalRetrocederEtapaDeUnPunto"></h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color:white;">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">

                        <div class="form-group">
                            <label>Etapa</label>
                            <select class="form-control lista-despegable-con-buscador" id="campoRetrocederEtapaDeUnPunto" name="retroceder_etapa_punto" data-live-search="true">
                                
                            </select>
                            <div class="invalid-feedback" id="validacionCampoRetrocederEtapaDeUnPunto">

                            </div>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-aspen" id="botonModalRetrocederEtapaDeUnPunto">Retroceder Etapa</button>
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
    
    <div class="modal fade" id="modalVerObservacionItem" tabindex="-1" aria-labelledby="LabelObservacionItem" aria-hidden="true">
        <form id="formularioModalVerObservacionItem">
            @csrf
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header" style="background-color: #007bff; color:white;">
                        <h5 class="modal-title" id="LabelModalVerObservacionItem"></h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color:white;">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <label>Observación</label>
                            <textarea class="form-control" id="verModalObservacionItem" rows="3" readonly="true"></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
    
    <div class="modal fade" id="modalVerHistorialDeEtapasRetrocedidas" tabindex="-1" aria-labelledby="LabelObservacionItem" aria-hidden="true">
        <form id="formularioModalVerHistorialDeEtapasRetrocedidas">
            @csrf
            <div class="modal-dialog modal-xl">
                <div class="modal-content">
                    <div class="modal-header" style="background-color: #007bff; color:white;">
                        <h5 class="modal-title" id="LabelModalVerHistorialDeEtapasRetrocedidas"></h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color:white;">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <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>Etapa Antes</th>
                                        <th>Etapa Despues</th>
                                        <th>Usuario</th>
                                    </tr>
                                </thead>
                                <tbody id="registrosDeHistorial">
                                    
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
@stop

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

@section('js')
    <script src="{{ asset('js/generico.js') }}"></script>
    <script>
        $('#campoRetrocederEtapaDeUnPunto').selectpicker({
            dropupAuto: false,
        });
    </script>

    <script>
        function visualizarArchivoRegistrado(archivo, tipo, idOrdenTrabajo, nombreArchivo) {
            var rutaUrl = 'storage/orden-trabajo/' + idOrdenTrabajo + '/' + archivo;
            var url = '{{ asset('') }}';
            url = url + rutaUrl;

            if (tipo.toLowerCase() == "png" ||
                tipo.toLowerCase() == "jpeg" ||
                tipo.toLowerCase() == "gif" ||
                tipo.toLowerCase() == "jpg" ||
                tipo.toLowerCase() == "bmp") {
                document.getElementById("modalContenidoModalVisualizarArchivo").innerHTML =
                    '<img src="' + url + '" style="max-width: 100%;">';
            } else if (tipo.toLowerCase() == "pdf") {
                document.getElementById("modalContenidoModalVisualizarArchivo").innerHTML =
                    '<iframe src="' + url + '" style="width:95%; height:600px;"></iframe>';
            } else if (tipo.toLowerCase() == "txt") {
                document.getElementById("modalContenidoModalVisualizarArchivo").innerHTML =
                    '<iframe src="' + url + '" style="width:95%; height:600px;"></iframe>';
            }
            document.getElementById("modalTituloVisualizarArchivo").innerHTML = nombreArchivo;
            $("#modalVisualizarArchivo").modal("show");
        }

        function verMotivoDeLaInactividad(punto, observacion){
            document.getElementById("LabelModalVerMotivoDeLaInactividadItem").innerHTML="Punto "+punto;

            document.getElementById("verModalMotivoDeLaInactividadItem").value=observacion;
            $("#modalVerMotivoDeLaInactividadItem").modal("show");
        }
        
        function verObservacion(punto, observacion){
            document.getElementById("LabelModalVerObservacionItem").innerHTML="Punto "+punto;

            document.getElementById("verModalObservacionItem").value=observacion;
            $("#modalVerObservacionItem").modal("show");
        }

        function abrirModalDeRechazarItem(fila, nombreItem, idPunto) {
            document.getElementById("motivoDelRechazoModalRechazarItem").value = "";
            document.getElementById("motivoDelRechazoModalRechazarItem").setAttribute("class", "form-control");
            document.getElementById("LabelModalRechazarItem").innerHTML = "Descartar Punto " + nombreItem;
            document.getElementById("botonModalRecharItem").addEventListener("click", function() {
                rechazarItem(fila, nombreItem, idPunto);
            }, false);
            $("#modalRechazarItem").modal("show");
        }

        function rechazarItem(fila, nombreItem, idPunto) {
            document.getElementById("botonModalRecharItem").setAttribute("disabled", true);
            let motivoRechazo = document.getElementById("motivoDelRechazoModalRechazarItem").value.trim();
            if (motivoRechazo.length > 0) {
                Swal.fire({
                    title: '¿Esta seguro?',
                    text: "El punto cambiará su estado a descartado",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: '¡Si, descartar!',
                    cancelButtonText: 'Cancelar'
                }).then((result) => {
                    if (result.isConfirmed) {
                        document.getElementById("preloader").removeAttribute("style");
                        document.getElementById("img-preloader").style.display = "block";
                        document.getElementById("botonModalRecharItem").removeAttribute("disabled");
                        let url='{{ route('orden-trabajo.rechazar-item', [$ordenDeTrabajo,':punto']) }}';
                        url = url.replace(':punto', idPunto);
                        document.getElementById("formularioModalDescartePostulante").setAttribute("action",url);
                        document.getElementById("formularioModalDescartePostulante").submit();
                        $("#modalRechazarItem").modal("hide");
                    }
                })
            } else {
                document.getElementById("botonModalRecharItem").removeAttribute("disabled");
                document.getElementById("motivoDelRechazoModalRechazarItem").setAttribute("class", "form-control is-invalid");
                document.getElementById("validacionMotivoDelRechazoModalRechazarItem").innerHTML = "El campo motivo del descarte es obligatorio";
            }
        }

        function aprobarItem(nombreItem, idPunto, motivoRechazo){
            if(motivoRechazo=="punto no replanteado"){
                Swal.fire({
                    icon: 'error',
                    title: '¡El Punto No Puede Carmbiar De Estado!',
                    text: 'No es posible utilizar el punto, los puntos no replanteado no pueden cambiar su estado',
                    confirmButtonColor: "#448aff",
                    confirmButtonText: "Confirmar"
                })
            }else if(motivoRechazo=="azimut no cumple"){
                Swal.fire({
                    icon: 'error',
                    title: '¡El Punto No Puede Carmbiar De Estado!',
                    text: 'No es posible utilizar el punto, los puntos que no cumplen con la verificación de azimut en la etapa de plataforma no pueden cambiar su estado',
                    confirmButtonColor: "#448aff",
                    confirmButtonText: "Confirmar"
                })
            }else{
                Swal.fire({
                    title: '¿Esta seguro?',
                    text: "El punto "+nombreItem+" cambiará su estado a operativo",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: '¡Si, cambiar estado!',
                    cancelButtonText: 'Cancelar'
                }).then((result) => {
                    if (result.isConfirmed) {
                        document.getElementById("preloader").removeAttribute("style");
                        document.getElementById("img-preloader").style.display = "block";
                        let url='{{ route('orden-trabajo.aprobar-item', [$ordenDeTrabajo,':punto']) }}';
                        url = url.replace(':punto', idPunto);
                        document.getElementById("formularioDeOrdenDeTrabajo").setAttribute("method","POST");
                        document.getElementById("formularioDeOrdenDeTrabajo").setAttribute("action",url);
                        document.getElementById("formularioDeOrdenDeTrabajo").submit();
                    }
                })
            }
        }
        
        function eliminarItem( idPunto) {
            Swal.fire({
                title: '¿Esta seguro?',
                text: "El punto se eliminara de la plataforma",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: '¡Si, eliminar!',
                cancelButtonText: 'Cancelar'
            }).then((result) => {
                if (result.isConfirmed) {
                    document.getElementById("preloader").removeAttribute("style");
                    document.getElementById("img-preloader").style.display = "block";
                    let url='{{ route('orden-trabajo.eliminar-item', [$ordenDeTrabajo,':punto']) }}';
                    url = url.replace(':punto', idPunto);
                    document.getElementById("formularioDeOrdenDeTrabajo").setAttribute("method","POST");
                    document.getElementById("formularioDeOrdenDeTrabajo").setAttribute("action",url);
                    document.getElementById("formularioDeOrdenDeTrabajo").submit();
                }
            })
        }
    </script>

    <script>
        function abrirModalRetrocederEtapaDelItem(nombreItem, idPunto, etapa){
            document.getElementById("LabelModalRetrocederEtapaDeUnPunto").innerHTML = "Retroceder Etapa Del Punto " + nombreItem;
            switch(etapa){
                case "collar":
                    document.getElementById("campoRetrocederEtapaDeUnPunto").innerHTML=
                    '<option value="asignacion_etapa_collar">Asignación Etapa de Collar</option>'+
                    '<option value="asignacion_etapa_perforacion">Asignación Etapa de Perforación</option>'+
                    '<option value="asignacion_etapa_plataforma">Asignación Etapa de Plataforma</option>'+
                    '<option value="asignacion_etapa_terreno">Asignación Etapa de Terreno</option>';
                    $('#campoRetrocederEtapaDeUnPunto').selectpicker('refresh');
                    $('#campoRetrocederEtapaDeUnPunto').selectpicker('val', 'asignacion_etapa_collar');
                break;
                case "perforacion":
                document.getElementById("campoRetrocederEtapaDeUnPunto").innerHTML=
                    '<option value="asignacion_etapa_perforacion">Asignación Etapa de Perforación</option>'+
                    '<option value="asignacion_etapa_plataforma">Asignación Etapa de Plataforma</option>'+
                    '<option value="asignacion_etapa_terreno">Asignación Etapa de Terreno</option>';
                    $('#campoRetrocederEtapaDeUnPunto').selectpicker('refresh');
                    $('#campoRetrocederEtapaDeUnPunto').selectpicker('val', 'asignacion_etapa_perforacion');
                break;
                case "plataforma":
                document.getElementById("campoRetrocederEtapaDeUnPunto").innerHTML=
                    '<option value="asignacion_etapa_plataforma">Asignación Etapa de Plataforma</option>'+
                    '<option value="asignacion_etapa_terreno">Asignación Etapa de Terreno</option>';
                    $('#campoRetrocederEtapaDeUnPunto').selectpicker('refresh');
                    $('#campoRetrocederEtapaDeUnPunto').selectpicker('val', 'asignacion_etapa_plataforma');
                break;
                case "terreno":
                document.getElementById("campoRetrocederEtapaDeUnPunto").innerHTML=
                    '<option value="asignacion_etapa_terreno">Asignación Etapa de Terreno</option>';
                    $('#campoRetrocederEtapaDeUnPunto').selectpicker('refresh');
                    $('#campoRetrocederEtapaDeUnPunto').selectpicker('val', 'asignacion_etapa_terreno');
                break;
            }
            document.getElementById("botonModalRetrocederEtapaDeUnPunto").addEventListener("click", function() {
                retrocederEtapaDelItem(nombreItem, idPunto, etapa);
            }, false);
            $("#modalRetrocederEtapaDeUnPunto").modal("show");
        }

        function retrocederEtapaDelItem(nombreItem, idPunto, etapa){
            document.getElementById("botonModalRetrocederEtapaDeUnPunto").setAttribute("disabled", true);
            let etapaSeleccionada = document.getElementById("campoRetrocederEtapaDeUnPunto").value.trim();
            if (etapaSeleccionada.length > 0) {
                Swal.fire({
                    title: '¿Esta seguro?',
                    text: "El punto retrocera etapas segun la selecionada",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: '¡Si, retrocer etapa!',
                    cancelButtonText: 'Cancelar'
                }).then((result) => {
                    if (result.isConfirmed) {
                        document.getElementById("preloader").removeAttribute("style");
                        document.getElementById("img-preloader").style.display = "block";
                        document.getElementById("botonModalRetrocederEtapaDeUnPunto").removeAttribute("disabled");
                        let url='{{ route('orden-trabajo.retroceder-etapa-item', [$ordenDeTrabajo,':punto']) }}';
                        url = url.replace(':punto', idPunto);
                        document.getElementById("formularioModalRetrocederEtapaDeUnPunto").setAttribute("action",url);
                        document.getElementById("formularioModalRetrocederEtapaDeUnPunto").submit();
                        $("#modalRetrocederEtapaDeUnPunto").modal("hide");
                    }
                })
            } else {
                document.getElementById("botonModalRetrocederEtapaDeUnPunto").removeAttribute("disabled");
                document.getElementById("campoRetrocederEtapaDeUnPunto").setAttribute("class", "form-control is-invalid");
                document.getElementById("validacionCampoRetrocederEtapaDeUnPunto").innerHTML = "El campo etapa es obligatorio";
            }
        }
        
        function abrirModalParaMostrarHistorialDeEtapasRetrocedidas(nombreItem, historial){
            document.getElementById("LabelModalVerHistorialDeEtapasRetrocedidas").innerHTML = "Historial Etapa Retrocedidas Del Punto " + nombreItem;
            let histo=JSON.parse(historial);

            document.getElementById("registrosDeHistorial").innerHTML="";
            histo.forEach((elemento) => {
                document.getElementById("registrosDeHistorial").innerHTML+=`
                <tr>
                    <td>${elemento.etapa_antes}</td>
                    <td>${elemento.atapa_despues}</td>
                    <td>${elemento.usuario.name}</td>
                </tr>
                `;
            });

            $("#modalVerHistorialDeEtapasRetrocedidas").modal("show");
        }
    </script>

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

    @if (session('alerta_retroceso_etapa') != null)
        <script>
            Swal.fire({
                icon: 'success',
                title: '¡El Punto Retrocedio de Etapa!',
                text: '{{ session('alerta_retroceso_etapa') }}',
                confirmButtonColor: "#448aff",
                confirmButtonText: "Confirmar"
            })
        </script>
    @endif
    
    @if (session('alerta_eliminacion') != null)
        <script>
            Swal.fire({
                icon: 'success',
                title: '¡El Punto Fue Eliminado!',
                text: '{{ session('alerta_eliminacion') }}',
                confirmButtonColor: "#448aff",
                confirmButtonText: "Confirmar"
            })
        </script>
    @endif
@stop