@extends('adminlte::page')

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

@section('title', 'Asignar Responsable y Generar Listado | 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">Asignar Responsable y Generar Listado</h3>
                    </div>

                    <form id="formularioDeAsignarResponsableItems" method="POST" action="{{ $url }}">
                        @csrf
                        @method('put')

                        <div class="card-body">
                            @switch($etapa)
                                @case('Terreno')
                                    <div class="text-center">
                                        <h3 style="font-weight: 700;">Listado de Terreno</h3>
                                    </div>
                                @break

                                @case('Plataforma')
                                    <div class="text-center">
                                        <h3 style="font-weight: 700;">Listado de Plataforma</h3>
                                    </div>
                                @break

                                @case('Perforacion')
                                    <div class="text-center">
                                        <h3 style="font-weight: 700;">Listado de Perforación</h3>
                                    </div>
                                @break

                                @case('collar')
                                    <div class="text-center">
                                        <h3 style="font-weight: 700;">Listado de Collar</h3>
                                    </div>
                                @break

                                @default
                            @endswitch

                            <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>Servicio</label>
                                    <input type="text" class="form-control" value="{{ $ordenDeTrabajo->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 ($ordenDeTrabajo->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>
                                @endif

                                <div class="form-group">
                                    <label>Responsable de la medición</label>
                                    <select class="form-control lista-despegable-con-buscador" id="campoResponsable" name="id_responsable" data-live-search="true">
                                        <option value="">--Seleccionar Responsable--</option>
                                        @foreach ($supervisores as $supervisor)
                                            @if (old('id_responsable') == $supervisor->id)
                                                <option selected value="{{ $supervisor->id }}">{{ $supervisor->name }}</option>
                                            @else
                                                <option value="{{ $supervisor->id }}">{{ $supervisor->name }}</option>
                                            @endif
                                        @endforeach
                                    </select>
                                    <div class="invalid-feedback" id="validacionCampoResponsable">

                                    </div>
                                </div>

                                @if ($ordenDeTrabajo->servicio->nombre=="Sondajes")
                                    <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($ordenDeTrabajo->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($ordenDeTrabajo->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="dt-responsive table-responsive">
                                <table class="table table-bordered" role="grid" aria-describedby="base-style_info" id="tabla-items">
                                    <thead>
                                        <tr role="row">
                                            <th style="background-color: rgba(21, 21, 21, 1) !important;">#</th>
                                            <th style="background-color: rgba(21, 21, 21, 1) !important;">
                                                <div class="icheck-primary">
                                                    <input class="checkbox-seleccion-item" type="checkbox" id="checkboxitemTodos" value="todos" onchange="seleccionarTodosLosItems(this)">
                                                    <label for="checkboxitemTodos">Seleccionar</label>
                                                </div>
                                            </th>
                                            @if ($etapa == 'Plataforma')
                                                <th style="background-color: rgba(21, 21, 21, 1) !important;">Etapa Siguiente</th>
                                            @endif
                                            <th style="background-color: rgba(21, 21, 21, 1) !important;">Nombre del Punto</th>
                                            <th style="background-color: rgba(21, 21, 21, 1) !important;">Este</th>
                                            <th style="background-color: rgba(21, 21, 21, 1) !important;">Norte</th>
                                            <th style="background-color: rgba(21, 21, 21, 1) !important;">Cota</th>
                                            <th style="background-color: rgba(21, 21, 21, 1) !important;">Azimut</th>
                                            <th style="background-color: rgba(21, 21, 21, 1) !important;">Inclinación</th>
                                        </tr>
                                    </thead>
                                    <tbody id="registrosDeItems">
                                        @php
                                            $cantidadItems = 0;
                                        @endphp
                                        @if ($etapa == 'Terreno')
                                            @foreach ($items as $item)
                                                @if ($item->estado=="Operativo")
                                                    @if (!isset($item->puntosEnLaEtapaDeTerreno))
                                                        @php
                                                            $cantidadItems++;
                                                        @endphp
                                                        <tr>
                                                            <td>{{ $cantidadItems }}</td>
                                                            <td class="text-center">
                                                                <div class="icheck-primary">
                                                                    <input class="checkbox-seleccion-item" type="checkbox" id="checkboxitem{{ $item->id }}" value="{{ $item->id }}" name="items[]">
                                                                    <label for="checkboxitem{{ $item->id }}"></label>
                                                                </div>
                                                            </td>
                                                            <td>{{ $item->punto }}</td>
                                                            <td>{{ $item->este }}</td>
                                                            <td>{{ $item->norte }}</td>
                                                            <td>{{ $item->cota }}</td>
                                                            <td>{{ $item->azimut }}</td>
                                                            <td>{{ $item->inclinacion }}</td>
                                                        </tr>
                                                    @endif
                                                @endif
                                            @endforeach
                                        @elseif($etapa == 'Plataforma')
                                            @foreach ($items as $item)
                                                @if ($item->estado=="Operativo")
                                                    @isset($item->puntosEnLaEtapaDeTerreno)
                                                        @if ($item->puntosEnLaEtapaDeTerreno->estado=="Aceptada")
                                                            @if (!isset($item->puntosEnLaEtapaDePlataforma))
                                                                @php
                                                                    $cantidadItems++;
                                                                @endphp
                                                                <tr>
                                                                    <td>{{ $cantidadItems }}</td>
                                                                    @if (doubleval($item->azimut)==0 && (doubleval($item->inclinacion)<=-89.5 && doubleval($item->inclinacion)>=-90))
                                                                        <td class="text-center seleccionar-tabla">
                                                                            <div class="icheck-primary">
                                                                                <input class="checkbox-seleccion-item" type="checkbox" id="checkboxitem{{ $item->id  }}" value="{{ $item->id  }}" name="items[]" onchange="habilitarSelectEtapaSiguiente(this)">
                                                                                <label for="checkboxitem{{ $item->id }}"></label>
                                                                            </div>
                                                                        </td>
                                                                        <td class="etapa-siguiente-tabla">
                                                                            <select class="form-control lista-despegable-con-buscador select-etapa-siguiente" disabled="true" style="background-color: #e9ecef !important;">
                                                                                <option value="">--Seleccionar Etapa Siguiente--</option>
                                                                                <option value="Plataforma">Plataforma</option>
                                                                                <option value="Perforacion">Perforación</option>
                                                                            </select>
                                                                        </td>
                                                                    @else   
                                                                        <td class="text-center seleccionar-tabla">
                                                                            <div class="icheck-primary">
                                                                                <input class="checkbox-seleccion-item" type="checkbox" id="checkboxitem{{ $item->id  }}" value="{{ $item->id  }}" name="items[]">
                                                                                <label for="checkboxitem{{ $item->id }}"></label>
                                                                            </div>
                                                                        </td>
                                                                        <td class="etapa-siguiente-tabla">Plataforma</td>
                                                                    @endif
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->punto }}</td>
                                                                    @if ($ordenDeTrabajo->sistema_proyeccion=="Local")
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->este }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->norte }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->cota }}</td>
                                                                    @elseif($ordenDeTrabajo->sistema_proyeccion=="UTM")   
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->este_utm }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->norte_utm }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->cota_utm }}</td> 
                                                                    @endif
                                                                    <td>{{ $item->azimut }}</td>
                                                                    <td>{{ $item->inclinacion }}</td>
                                                                </tr>
                                                            @endif
                                                        @endif
                                                    @endisset
                                                @endif
                                            @endforeach
                                        @elseif($etapa == 'Perforacion')
                                            @foreach ($items as $item)
                                                @if ($item->estado=="Operativo")
                                                    @isset($item->puntosEnLaEtapaDePlataforma)
                                                        @if ($item->puntosEnLaEtapaDePlataforma->estado=="Aceptada")
                                                            @if (!isset($item->puntosEnLaEtapaDePerforacion))
                                                                @php
                                                                    $cantidadItems++;
                                                                @endphp
                                                                <tr>
                                                                    <td>{{ $cantidadItems }}</td>
                                                                    <td class="text-center">
                                                                        <div class="icheck-primary">
                                                                            <input class="checkbox-seleccion-item" type="checkbox" id="checkboxitem{{ $item->id  }}" value="{{ $item->id  }}" name="items[]">
                                                                            <label for="checkboxitem{{ $item->id }}"></label>
                                                                        </div>
                                                                    </td>
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->punto }}</td>
                                                                    @if ($ordenDeTrabajo->sistema_proyeccion=="Local")
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->este }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->norte }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->cota }}</td>
                                                                    @elseif($ordenDeTrabajo->sistema_proyeccion=="UTM")   
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->este_utm }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->norte_utm }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDeTerreno->cota_utm }}</td> 
                                                                    @endif
                                                                    <td>{{ $item->azimut }}</td>
                                                                    <td>{{ $item->inclinacion }}</td>
                                                                </tr>
                                                            @endif
                                                        @endif
                                                    @endisset
                                                @endif
                                            @endforeach
                                        @elseif($etapa == 'collar')
                                            @foreach ($items as $item)
                                                @if ($item->estado=="Operativo")
                                                    @isset($item->puntosEnLaEtapaDePerforacion)
                                                        @if ($item->puntosEnLaEtapaDePerforacion->estado=="Aceptada")
                                                            @if (!isset($item->puntosEnLaEtapaDeCollar))
                                                                @php
                                                                    $cantidadItems++;
                                                                @endphp
                                                                <tr>
                                                                    <td>{{ $cantidadItems }}</td>
                                                                    <td class="text-center">
                                                                        <div class="icheck-primary">
                                                                            <input class="checkbox-seleccion-item" type="checkbox" id="checkboxitem{{ $item->id  }}" value="{{ $item->id  }}" name="items[]">
                                                                            <label for="checkboxitem{{ $item->id }}"></label>
                                                                        </div>
                                                                    </td>
                                                                    <td>{{ $item->puntosEnLaEtapaDePerforacion->punto }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDePerforacion->este }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDePerforacion->norte }}</td>
                                                                    <td>{{ $item->puntosEnLaEtapaDePerforacion->cota }}</td>
                                                                    <td>{{ $item->azimut }}</td>
                                                                    <td>{{ $item->inclinacion }}</td>
                                                                </tr>
                                                            @endif
                                                        @endif
                                                    @endisset
                                                @endif
                                            @endforeach
                                        @endif
                                    </tbody>
                                </table>
                            </div>

                            <input type="hidden" name="listado_puntos_plataformas" id="listadoPuntosPlataforma" value="[]">
                        </div>

                        <div class=" card-footer">
                            <button type="button" onclick="generarListado()" class="btn btn-aspen" id="botonGuardarInformacion"><i class="fas fa-table" style="margin-right: 2px;"></i> Generar Listado </button>
                            @if ($ordenDeTrabajo->servicio->nombre=="Sondajes")
                            <a href="{{ route('orden-trabajo.index', $ordenDeTrabajo->servicio) }}" role="button" class="btn btn-secondary"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                            @elseif($ordenDeTrabajo->servicio->nombre=="Pilas")
                            <a href="{{ route('orden-trabajo.index-pila', $ordenDeTrabajo->servicio) }}" role="button" class="btn btn-secondary"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                            @endif
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@stop

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

@section('js')
    <script>
        const etapaActual="{{$etapa}}";
        $('#campoResponsable').selectpicker({
            dropupAuto: false,
        });
        document.cookie = "descarga_archivo=null";

        function seleccionarTodosLosItems(checkbox) {
            if (checkbox.checked == true) {
                let todosLosCheckBox = document.querySelectorAll(".checkbox-seleccion-item");
                todosLosCheckBox.forEach(item => {
                    item.checked = true;
                    if(etapaActual=="Plataforma"){
                        const fila=item.parentElement.parentElement.parentElement;
                        let etapaSiguiente=fila.querySelector(".etapa-siguiente-tabla");
                        if(etapaSiguiente){
                            etapaSiguiente=etapaSiguiente.querySelector(".select-etapa-siguiente");
                            if(etapaSiguiente){
                                etapaSiguiente.value="";
                                etapaSiguiente.removeAttribute("disabled");
                                etapaSiguiente.style.backgroundColor="#fff";
                            }
                        }
                    }
                });
            } else if (checkbox.checked == false) {
                let todosLosCheckBox = document.querySelectorAll(".checkbox-seleccion-item");
                todosLosCheckBox.forEach(item => {
                    item.checked = false;
                    if(etapaActual=="Plataforma"){
                        const fila=item.parentElement.parentElement.parentElement;
                        let etapaSiguiente=fila.querySelector(".etapa-siguiente-tabla");
                        if(etapaSiguiente){
                            etapaSiguiente=etapaSiguiente.querySelector(".select-etapa-siguiente");
                            if(etapaSiguiente){
                                etapaSiguiente.value="";
                                etapaSiguiente.setAttribute("disabled","true");
                                etapaSiguiente.style.setProperty("background-color", "#e9ecef", "important");
                            }
                        }
                    }
                });
            }
        }

        function habilitarSelectEtapaSiguiente(checkbox){
            const fila=checkbox.parentElement.parentElement.parentElement;
            const etapaSiguiente=fila.querySelector(".etapa-siguiente-tabla").querySelector(".select-etapa-siguiente");
            etapaSiguiente.value="";
            if (checkbox.checked == true) {
                etapaSiguiente.removeAttribute("disabled");
                etapaSiguiente.style.backgroundColor="#fff";
            } else if (checkbox.checked == false) {
                etapaSiguiente.setAttribute("disabled","true");
                etapaSiguiente.style.setProperty("background-color", "#e9ecef", "important");
            }
        }

        function establecerPuntosPlataformasConLaEtapaSiguiente(){
            const filas = document.getElementById('tabla-items').tBodies[0].querySelectorAll("tr");
            let listadoDePuntosPlataforma = [];
            if(etapaActual=="Plataforma"){
                filas.forEach(elemento => {
                    if (elemento.querySelector(".etapa-siguiente-tabla")) {
                        if (elemento.querySelector(".etapa-siguiente-tabla").querySelector(".select-etapa-siguiente")) {
                            const campo=elemento.querySelector(".etapa-siguiente-tabla").querySelector(".select-etapa-siguiente");
                            const checkbox=elemento.querySelector(".seleccionar-tabla").querySelector(".checkbox-seleccion-item");
                            if(checkbox.checked == true){
                                if(campo.value=="Plataforma"){
                                    let item = {
                                        idPunto:checkbox.value,
                                        etapaSiguiente: "Plataforma"
                                    }
                                    listadoDePuntosPlataforma.push(item);
                                }else if(campo.value=="Perforacion"){
                                    let item = {
                                        idPunto:checkbox.value,
                                        etapaSiguiente: "Perforacion"
                                    }
                                    listadoDePuntosPlataforma.push(item);
                                }
                            }
                        }else{
                            if(elemento.querySelector(".etapa-siguiente-tabla").innerHTML=="Plataforma"){
                                const checkbox=elemento.querySelector(".seleccionar-tabla").querySelector(".checkbox-seleccion-item");
                                if(checkbox.checked == true){
                                    let item = {
                                        idPunto:checkbox.value,
                                        etapaSiguiente: "Plataforma"
                                    }
                                    listadoDePuntosPlataforma.push(item);
                                }
                            }
                        }
                    }
                });

                document.getElementById("listadoPuntosPlataforma").value=JSON.stringify(listadoDePuntosPlataforma);
            }
        }

        function validarPuntosPlataformasConLaEtapaSiguiente(){
            const filas = document.getElementById('tabla-items').tBodies[0].querySelectorAll("tr");
            let hayErrores=false;
            if(etapaActual=="Plataforma"){
                filas.forEach(elemento => {
                    if (elemento.querySelector(".etapa-siguiente-tabla")) {
                        if (elemento.querySelector(".etapa-siguiente-tabla").querySelector(".select-etapa-siguiente")) {
                            const campo=elemento.querySelector(".etapa-siguiente-tabla").querySelector(".select-etapa-siguiente");
                            const checkbox=elemento.querySelector(".seleccionar-tabla").querySelector(".checkbox-seleccion-item");
                            if(checkbox.checked == true){
                                if(campo.value!="Plataforma" && campo.value!="Perforacion"){
                                    hayErrores=true;
                                }
                            }
                        }
                    }
                });
            }

            return hayErrores;
        }

        function generarListado() {
            let todosLosCheckBox = document.querySelectorAll(".checkbox-seleccion-item");
            let itemsSeleccionados = [];
            todosLosCheckBox.forEach(item => {
                if (item.value != "todos" && item.checked == true) {
                    itemsSeleccionados.push(item.value);
                }
            });
            
            let responsable = document.getElementById("campoResponsable").value.trim();
            if (responsable.length > 0) {
                if (itemsSeleccionados.length > 0 && validarPuntosPlataformasConLaEtapaSiguiente()==false) {
                    if(etapaActual=="Plataforma"){
                        establecerPuntosPlataformasConLaEtapaSiguiente();
                    }

                    document.getElementById("campoResponsable").classList.remove('input-error-icon');
                    document.getElementById("campoResponsable").classList.add('input-success-icon');
                    document.getElementById("validacionCampoResponsable").innerHTML = "";
                    document.getElementById("validacionCampoResponsable").style.display = "none";

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

                    setTimeout(function() {
                        $('#campoResponsable').selectpicker('val', "");
                        document.getElementById("validacionCampoResponsable").innerHTML = "";
                        document.getElementById("campoResponsable").classList.remove('input-success-icon');
                        document.getElementById("campoResponsable").classList.remove('input-error-icon');
                        document.getElementById("validacionCampoResponsable").style.display = "none";

                        todosLosCheckBox.forEach(item => {
                            if (item.value != "todos" && item.checked == true) {
                                item.checked =false;
                            }else{
                                item.checked =false;
                            }
                        });
                        document.getElementById("preloader").style.height = "0px";
                        document.getElementById("img-preloader").style.display = "none";
                        document.getElementById("botonGuardarInformacion").removeAttribute("disabled");

                        Swal.fire({
                            icon: 'success',
                            title: '¡Operación Exitosa!',
                            text: 'La operación se realizó con éxito',
                            confirmButtonColor: "#448aff",
                            confirmButtonText: "Confirmar"
                        })
                    }, 2000);
                } else {
                    if(itemsSeleccionados.length == 0){
                        Swal.fire({
                            icon: 'error',
                            title: '¡Seleccione puntos!',
                            text: 'Debe seleccionar al menos un punto para generar el listado',
                            confirmButtonColor: "#448aff",
                            confirmButtonText: "Confirmar"
                        })
                    }

                    if(validarPuntosPlataformasConLaEtapaSiguiente()==true){
                        Swal.fire({
                            icon: 'error',
                            title: '¡Complete Campo!',
                            text: 'Debe completar el campo etapa siguiente en los items seleccionados',
                            confirmButtonColor: "#448aff",
                            confirmButtonText: "Confirmar"
                        })
                    }

                    if (responsable.length > 0) {
                        document.getElementById("campoResponsable").classList.remove('input-error-icon');
                        document.getElementById("campoResponsable").classList.add('input-success-icon');
                        document.getElementById("validacionCampoResponsable").innerHTML = "";
                        document.getElementById("validacionCampoResponsable").style.display = "none";
                    } else {
                        document.getElementById("campoResponsable").classList.remove('input-success-icon');
                        document.getElementById("campoResponsable").classList.add('input-error-icon');
                        document.getElementById("validacionCampoResponsable").innerHTML = "El campo responsable es obligatorio.";
                        document.getElementById("validacionCampoResponsable").style.display = "block";
                    }
                }
            } else {
                if (responsable.length > 0) {
                    document.getElementById("campoResponsable").classList.remove('input-error-icon');
                    document.getElementById("campoResponsable").classList.add('input-success-icon');
                    document.getElementById("validacionCampoResponsable").innerHTML = "";
                    document.getElementById("validacionCampoResponsable").style.display = "none";
                } else {
                    document.getElementById("campoResponsable").classList.remove('input-success-icon');
                    document.getElementById("campoResponsable").classList.add('input-error-icon');
                    document.getElementById("validacionCampoResponsable").innerHTML = "El campo responsable es obligatorio.";
                    document.getElementById("validacionCampoResponsable").style.display = "block";
                }
            }
        }
    </script>
@stop