@extends('../layouts/partials/header')

@section('content')

    <style>
        table {
            width: 100%; /* Ocupa el 100% del ancho del contenedor */
            border-collapse: collapse; /* Opcional: para eliminar el espacio entre bordes de celdas */
        }
        .img-custom-size {
            width: 300px;
            height: 150px;
            border: 2px solid black; border-radius: 15px; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
        }
        .table td {
            text-align: left;
        }

        .encabezado-gris {
            background-color: #343a40 !important;
            color: white !important;
        }

    </style>

    <div class="container mt-3">
        <br>
        <div class="card text-center">
            <div class="card-header">
                <!-- Nav Tabs -->
                <ul class="nav nav-tabs" id="myTab" role="tablist">
                    <li class="nav-item" role="presentation">
                        <a class="nav-link {{ session('active_tab', 'tab1') == 'tab1' ? 'active' : '' }}" id="tab1-tab" data-bs-toggle="tab" href="#tab1" role="tab" aria-controls="tab1" aria-selected="true">Instalaciones</a>
                    </li>
                </ul>
            </div>

            <div class="card-header">
                <div class="tab-content" id="myTabContent">
                    <div class="tab-pane fade  {{ session('active_tab', 'tab1') == 'tab1' ? 'show active' : '' }}" id="tab1" role="tabpanel" aria-labelledby="tab1-tab">
                        <div class="container">
                            <div class="row">
                                <h4>
                                    {{ $partida->odm }}<br>
                                    INSTALACIONES
                                </h4>
                            </div>

                            <div class="row">
                                <div class="col-md-12 text-center">
                                    <a href="{{ route('odms.edit',$partidaAd->id_odm) }}" >Regresar</a>
                                    <br><br>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-12 text-left">
                                    <table class="table table-bordered table-striped table-success">
                                        <thead>
                                            <tr>
                                                <th>Partida</th>
                                                <th>Actividad</th>
                                                <th>Unidad</th>
                                                <th>Volumen Contratado</th>
                                                <th>Contratista</th>
                                                <th>Fecha Inicio</th>
                                                <th>Fecha Fin</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <td>{{ $partida->partida }}</td>
                                            <td>{{ $partida->actividad }}<br>
                                                <i>{{ $partidaAd->nota }}</i>
                                            </td>
                                            <td>{{ $partida->um }}</td>
                                            <td>{{ $partida->cantidad }}</td>
                                            <td>{{ $contratista->rs ?? '' }}</td>
                                            <td>{{ $partidaAd->fecha_ini }}</td>
                                            <td>{{ $partidaAd->fecha_fin }}</td>
                                        </tbody>
                                    </table>
                                </div>
                            </div>

                            <form action="{{ isset($instalacionEdit) ? route('instalaciones.update', $instalacionEdit->id) : route('instalaciones.store', $partidaAd->id) }}"
                                method="POST"
                                id="formCaptura"
                                enctype="multipart/form-data">
                              @csrf
                              @if(isset($instalacionEdit))
                                  @method('PUT')
                              @endif

                                <div class="row">
                                    @if(session('success'))
                                    <div class="alert alert-success alert-dismissible fade show" role="alert">
                                        <strong>OK! :</strong>{{ session('success') }}
                                        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                    </div>
                                    @endif

                                    @if ( $errors->any() )
                                        <div class="alert alert-danger">
                                            <ul>
                                                @foreach ( $errors->all() as $error )
                                                    <li>{{ $error }}</li>
                                                @endforeach
                                            </ul>
                                        </div>
                                    @endif
                                </div>

                                <div class="row">
                                    <div class="col-md-3 text-left">
                                        <label for="catInstalacion" style="all: unset;"><strong>Buscar instalación:</strong></label>
                                        <input type="text" id="busqueda" placeholder="Buscar instalación..." class="form-control" name="q">
                                    </div>
                                    <div class="col-md-9 text-left">
                                        <label for="catInstalacion" style="all: unset;"><strong>*Selecciona una instalación:</strong></label>
                                        <select class="form-control" id="resultado-select" name="catInstalacion" style="font-size: 11px;">
                                        </select>                                        
                                    </div>
                                </div>


                                <div class="row">
                                    <div class="col-md-3 text-left">
                                        <label for="instalacion" style="all: unset;"><strong>*Instalación:</strong></label>
                                        <input readonly type="text" id="instalacion" name="instalacion" style="font-size: 11px;" value="{{old('instalacion', $instalacionEdit->instalacion ?? '')}}" class="form-control" required>
                                    </div>
                                    <div class="col-md-3 text-left">
                                        <label for="localizacion" style="all: unset;"><strong>*Localización:</strong></label>
                                        <input readonly type="text" id="localizacion" name="localizacion" style="font-size: 11px;" value="{{old('localizacion', $instalacionEdit->localizacion ?? '')}}" class="form-control" required>
                                    </div>
                                    <div class="col-md-2 text-left">
                                        <label for="coordenadas" style="all: unset;"><strong>Coordenadas:</strong></label>
                                        <input readonly type="text" id="coordenadas" name="coordenadas" style="font-size: 11px;" value="{{old('coordenadas', $instalacionEdit->coordenadas ?? '')}}" class="form-control">
                                    </div>
                                    <div class="col-md-2 text-left">
                                        <label for="tag" style="all: unset;"><strong>TAG:</strong></label>
                                        <input type="text" id="tag" name="tag" style="font-size: 11px;" value="{{old('tag', $instalacionEdit->tag ?? '')}}" class="form-control">
                                    </div>
                                    <div class="col-md-2 text-left">
                                        <br>
                                        <input type="hidden" name="id" id="id" value="{{ $partidaAd->id }}">
                                        @can('odms.registroDiario')
                                            <button type="submit" class="btn btn-primary">
                                                <i class="bi bi-save-fill"></i> {{ isset($instalacionEdit) ? 'Actualizar Instalación' : 'Agregar Instalación' }}
                                            </button>
                                        @elsecan('instalaciones.show')
                                            <button type="submit" class="btn btn-primary">
                                                <i class="bi bi-save-fill"></i> {{ isset($instalacionEdit) ? 'Actualizar Instalación' : 'Agregar Instalación' }}
                                            </button>
                                            @else
                                            <button type="submit" class="btn btn-primary">
                                                <i class="bi bi-save-fill"></i> {{ isset($instalacionEdit) ? 'Actualizar Instalación' : 'Agregar Instalación' }}
                                            </button>
                                        @endcan

                                        <br><br>
                                    </div>
                                </div>
                            </form>

                            {{-- <div class="row">
                                <h4>Operaciones Aritméticas</h4>
                            </div>
                            <div class="row">
                                <div class="col-md-2 text-left">
                                    <label for="area" style="all: unset;"><strong>Area :</strong></label>
                                    <input type="text" id="area" name="area" value="{{old('area')}}" class="form-control" placeholder="A1">
                                </div>
                                <div class="col-md-3 text-left">
                                    <label for="cantidad" style="all: unset;"><strong>Cantidad ({{ $partida->um }}) :</strong></label>
                                    <input type="text" id="cantidad" name="cantidad" value="{{old('cantidad')}}" class="form-control">
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-2 text-left">
                                    <label for="longitud" style="all: unset;"><strong>Longitud(M) :</strong></label>
                                    <input type="text" id="longitud" name="longitud" value="{{old('longitud')}}" class="form-control">
                                </div>
                                <div class="col-md-2 text-left">
                                    <label for="ancho" style="all: unset;"><strong>Ancho(M) :</strong></label>
                                    <input type="text" id="ancho" name="ancho" value="{{old('ancho')}}" class="form-control">
                                </div>
                                <div class="col-md-2 text-left">
                                    <label for="profundidad" style="all: unset;"><strong>Profundidad(M) :</strong></label>
                                    <input type="text" id="profundidad" name="profundidad" value="{{old('profundidad')}}" class="form-control">
                                </div>
                                <div class="col-md-2 text-left">
                                    <label for="total1" style="all: unset;"><strong>Total :</strong></label>
                                    <input type="text" id="total1" name="total1" value="{{old('total1')}}" class="form-control" disabled>
                                </div>
                            </div> --}}


                            <div class="row">
                                <div class="col-md-12 text-left">
                                    <table class="table table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th class="encabezado-gris"></th>
                                                <th class="encabezado-gris">Instalación</th>
                                                <th class="encabezado-gris">Localización</th>
                                                <th class="encabezado-gris">Coordenadas</th>
                                                <th class="encabezado-gris">Equipo/TAG</th>
                                                <th class="encabezado-gris">Avance</th>
                                                <th class="encabezado-gris">Cantidad de Obra</th>
                                                <th class="encabezado-gris">Capturó</th>
                                                {{-- <th class="encabezado-gris">Area</th>
                                                <th class="encabezado-gris">Cantidad ({{ $partida->um }})</th>
                                                <th class="encabezado-gris">Longitud</th>
                                                <th class="encabezado-gris">Ancho</th>
                                                <th class="encabezado-gris">Profun.</th>
                                                <th class="encabezado-gris">Total</th> --}}
                                                <th class="encabezado-gris">Acciones</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach($instalaciones as $instalacion)

                                                @php
                                                $esCreador = auth()->id() === $instalacion->user_id;
                                                @endphp

                                                <tr>
                                                    @can('odms.registroDiario')
                                                        <td><a href="{{route('avance.show',$instalacion->id)}}">Registro Diario</a></td>
                                                    @endcan
                                                    @cannot('odms.registroDiario')
                                                        <td>Registro Diario</td>
                                                    @endcannot

                                                    <td>{{ $instalacion->instalacion }}</td>
                                                    <td>{{ $instalacion->localizacion }}</td>
                                                    <td>
                                                        <a href="https://maps.google.com/?q={{$instalacion->coordenadas}}" target="_blank">
                                                            </i><br>{{$instalacion->coordenadas}}
                                                        </a>
                                                    </td>
                                                    <td>
                                                        <a href="#" data-bs-toggle="modal" data-bs-target="#modalInstalacion{{ $instalacion->id }}"><i class="fa fa-tag"></i></a>
                                                        {{ $instalacion->tag }}
                                                    </td>
                                                    <td>{{ $instalacion->insRegDiarios->max('porcentaje') ?? 0 }}% </i></td>
                                                    <td>
                                                        <a href="#" data-bs-toggle="modal" data-bs-target="#modalInstalacion{{ $instalacion->id }}"><i class="fa fa-hard-hat"></i></a>
                                                        {{ $instalacion->cantidad_obra }}
                                                    </td>
                                                    <td>{{ $instalacion->user->name ?? 'Usuario no asignado' }}<br>{{$instalacion->created_at }} </td>
                                                    <td>
                                                        @can('instalaciones.croquisForm')
                                                            <a href="{{ route('instalaciones.croquisForm',$instalacion->id) }}" onclick=""><i class="fas fa-map"></i></a> |
                                                        @else
                                                            <i class="fas fa-map"></i> |
                                                        @endcan

                                                        @can('instalaciones.fotosUpload')
                                                            <a href="{{ route('instalaciones.fotosForm',$instalacion->id) }}" onclick=""><i class="fas fa-camera"></i></a> |
                                                        @else
                                                            <i class="fas fa-camera"></i> |
                                                        @endcan


                                                        @if($esCreador)
                                                            <a href="#" onclick="eliminarRegistro({{ $instalacion->id }})"><i class="fas fa-trash"></i></a> |
                                                            <a href="{{ route('instalaciones.edit', $instalacion->id) }}"><i class="fas fa-pencil-alt"></i></a> |
                                                        @else
                                                        <i class="fas fa-trash"></i> |
                                                        <i class="fas fa-pencil-alt"></i> |
                                                        @endif
                                                    </td>
                                                </tr>
                                            @endforeach

                                            @foreach($instalaciones as $instalacion)
                                                <!-- Modal -->
                                                <div class="modal fade" id="modalInstalacion{{ $instalacion->id }}" tabindex="-1" aria-labelledby="modalLabel{{ $instalacion->id }}" aria-hidden="true">
                                                    <div class="modal-dialog modal-md">
                                                        <div class="modal-content">
                                                            <form action="{{ route('instalaciones.updateTAG', $instalacion->id) }}" method="POST">
                                                                @csrf
                                                                @method('PUT')

                                                                <div class="modal-header">
                                                                    <h5 class="modal-title" id="modalLabel{{ $instalacion->id }}">Editar TAG</h5>
                                                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Cerrar"></button>
                                                                </div>

                                                                <div class="modal-body">
                                                                    <div class="mb-3">
                                                                        <label for="tag{{ $instalacion->id }}" class="form-label">TAG</label>
                                                                        <input type="text" class="form-control" id="tag{{ $instalacion->id }}" name="tag" value="{{ $instalacion->tag }}" required>
                                                                    </div>
                                                                </div>

                                                                <div class="modal-body">
                                                                    <div class="mb-3">
                                                                        <label for="cantidad_obra{{ $instalacion->id }}" class="form-label">Cantidad de Obra (Contratista)</label>
                                                                        <input type="text" class="form-control" id="cantidad_obra{{ $instalacion->id }}" name="cantidad_obra" value="{{ $instalacion->cantidad_obra }}" placeholder="Capture solo números">
                                                                    </div>
                                                                </div>

                                                                @can('instalaciones.cantidadObraAdicional')
                                                                <div class="modal-body">
                                                                    <div class="mb-3">
                                                                        <label for="cantidad_obra_adicional{{ $instalacion->id }}" class="form-label">Cantidad adicional (CENAGAS)</label>
                                                                        <input type="text" class="form-control" id="cantidad_obra_adicional{{ $instalacion->id }}" name="cantidad_obra_adicional" value="{{ $instalacion->cantidad_obra_adicional }}" placeholder="Capture solo números">
                                                                    </div>
                                                                </div>
                                                                 @endcan

                                                                <div class="modal-footer">
                                                                    <button type="submit" class="btn btn-primary">Guardar</button>
                                                                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
                                                                </div>
                                                            </form>
                                                        </div>
                                                    </div>
                                                </div>
                                            @endforeach


                                            


                                        </tbody>
                                    </table>

                                </div>
                            </div>


                        </div>
                    </div>

                    <div class="tab-pane fade {{ session('active_tab') == 'tab2' ? 'show active' : '' }}" id="tab2" role="tabpanel" aria-labelledby="tab2-tab" style="padding-top: 20px;">
                        <div class="container">

                            <div class="row">
                                <div class="row" id="fotos">
                                    <h4>Evidencia Fotográfica</h4>
                                </div>
                            </div>
                            <div class="row">
                                <a href="#" onclick="activarTab('tab1')">Volver a Instalaciones</a>

                            </div>

                            <div class="row">
                                <div class="col-md-12 text-left">
                                    <table class="table table-bordered table-striped table-warning">
                                        <thead>
                                            <tr>
                                                <th class="encabezado-gris">Partida</th>
                                                <th class="encabezado-gris">Actividad</th>
                                                <th class="encabezado-gris">Unidad</th>
                                                <th class="encabezado-gris">Volumen Contratado</th>
                                                <th class="encabezado-gris">Contratista</th>
                                                <th class="encabezado-gris">Fecha Inicio</th>
                                                <th class="encabezado-gris">Fecha Fin</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <td>{{ $partida->partida }}</td>
                                            <td>{{ $partida->actividad }}</td>
                                            <td>{{ $partida->um }}</td>
                                            <td>{{ $partida->cantidad }}</td>
                                            <td>{{ $contratista->rs ?? '' }}</td>
                                            <td>{{ $partidaAd->fecha_ini }}</td>
                                            <td>{{ $partidaAd->fecha_fin }}</td>
                                        </tbody>
                                    </table>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-12 text-left">
                                    <table class="table table-bordered table-striped table-warning">
                                        <thead>
                                            <tr>
                                                <th class="encabezado-gris">Instalación</th>
                                                <th class="encabezado-gris">Localización</th>
                                                <th class="encabezado-gris">Coordenadas</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @if ( isset ( $instalacion ))
                                            <tr>
                                                <td>{{ $instalacion->instalacion }}</td>
                                                <td>{{ $instalacion->localizacion }}</td>
                                                <td>{{ $instalacion->coordenadas }}</td>
                                            </tr>
                                            @endif
                                        </tbody>
                                    </table>
                                </div>


                            </div>

                            <div class="row">
                                <form action="" method="POST" id="formCaptura" enctype="multipart/form-data">
                                    @csrf
                                    @method('put')

                                    <br>
                                    <div class="row">
                                        @if(session('success'))
                                        <div class="alert alert-success alert-dismissible fade show" role="alert">
                                            <strong>OK! :</strong>{{ session('success') }}
                                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                        </div>
                                        @endif

                                        @if ( $errors->any() )
                                            <div class="alert alert-danger">
                                                <ul>
                                                    @foreach ( $errors->all() as $error )
                                                        <li>{{ $error }}</li>
                                                    @endforeach
                                                </ul>
                                            </div>
                                        @endif
                                    </div>

                                    <div class="row">
                                        <div class="col-md-12">
                                            <table class="table table-responsive-sm table-condense table-bordered">
                                                <tbody>
                                                    <tr>
                                                        <td>
                                                            <label for="foto1" style="all: unset;"><strong>1. Ubicación Técnica:</strong></label>
                                                            <input class="form-control" type="file" id="foto1"  name="foto1" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto1) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                        <td>
                                                            <label for="foto2" style="all: unset;"><strong>2. Antes de la ejecución:</strong></label>
                                                            <input class="form-control" type="file" id="foto2"  name="foto2" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if( $odm )
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto2) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                    </tr>
                                                    <tr align="center">
                                                        <td>
                                                            <label for="foto3" style="all: unset;"><strong>3. Ejecución de los trabajos:</strong></label>
                                                            <input class="form-control" type="file" id="foto3"  name="foto3" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto3) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                        <td>
                                                            <label for="foto4" style="all: unset;"><strong>4. Ejecución de los trabajos:</strong></label>
                                                            <input class="form-control" type="file" id="foto4"  name="foto4" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto4) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                    </tr>
                                                    <tr align="center">
                                                        <td>
                                                            <label for="foto5" style="all: unset;"><strong>5. Ejecución de los trabajos:</strong></label>
                                                            <input class="form-control" type="file" id="foto5"  name="foto5" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto5) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                        <td>
                                                            <label for="foto6" style="all: unset;"><strong>6. Ejecución de los trabajos:</strong></label>
                                                            <input class="form-control" type="file" id="foto6"  name="foto6" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto6) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                    </tr>
                                                    <tr align="center">
                                                        <td>
                                                            <label for="foto7" style="all: unset;"><strong>7. Ejecución de los trabajos:</strong></label>
                                                            <input class="form-control" type="file" id="foto7"  name="foto7" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto7) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                        <td>
                                                            <label for="foto8" style="all: unset;"><strong>8. Ejecución de los trabajos:</strong></label>
                                                            <input class="form-control" type="file" id="foto8"  name="foto8" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto8) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                    </tr>
                                                    <tr align="center">
                                                        <td>
                                                            <label for="foto9" style="all: unset;"><strong>9. Ejecución de los trabajos:</strong></label>
                                                            <input class="form-control" type="file" id="foto9"  name="foto9" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto9) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                        <td>
                                                            <label for="foto10" style="all: unset;"><strong>10. Ejecución de los trabajos:</strong></label>
                                                            <input class="form-control" type="file" id="foto10"  name="foto10" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto10) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                    </tr>
                                                    <tr align="center">
                                                        <td>
                                                            <label for="foto11" style="all: unset;"><strong>11. Ejecución de los trabajos:</strong></label>
                                                            <input class="form-control" type="file" id="foto11"  name="foto11" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto11) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                        <td>
                                                            <label for="foto12" style="all: unset;"><strong>12. Ejecución de los trabajos:</strong></label>
                                                            <input class="form-control" type="file" id="foto12"  name="foto12" capture="camera" accept=".jpg, .jpeg"><br>
                                                            @if($odm)
                                                                <img src="{{ asset('uploads/fotos_partidas_pri/'.$odm->foto12) }}" class="img-custom-size">
                                                            @else
                                                                <p>Imagen no disponible</p>
                                                            @endif
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>

                                    @if ( isset ( $instalacion ))
                                    <input type="hidden" name="instalacion_id" id="instalacion_id" value="{{ $instalacion->id }}">
                                    @endif

                                    <button type="submit" class="btn btn-primary">
                                        <i class="bi bi-save-fill"></i> Guardar cambios
                                    </button>

                                </form>
                            </div>

                        </div>
                    </div>

                    <div class="tab-pane fade {{ session('active_tab') == 'tab3' ? 'show active' : '' }}" id="tab3" role="tabpanel" aria-labelledby="tab3-tab" style="padding-top: 20px;">
                        <div class="container">
                            <a href="#" onclick="activarTab('tab1')">Volver a Instalaciones</a>
                            <br>

                        </div>
                    </div>


                </div>
            </div>

        </div>



    </div>



    <script>

        function eliminarRegistro(id) {
            if (!confirm('¿Estás seguro de eliminar este registro?')) return;
            fetch(`/instalaciones/destroy/${id}`, {
                method: 'DELETE',
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                }
            })
            .then(response => response.json())
            .then(data => {
                //alert('Registro eliminado correctamente');
                location.reload();
            })
            .catch(error => console.error('Error:', error));
        }

        document.addEventListener("DOMContentLoaded", function () {
        let activeTab = "{{ session('active_tab') }}";
            if (activeTab) {
                let tab = document.querySelector(`[data-bs-target="#${activeTab}"]`);
                if (tab) {
                    new bootstrap.Tab(tab).show();
                }
            }
        });


        function activarTab(tabId) {
            let tabTrigger = new bootstrap.Tab(document.querySelector(`#${tabId}-tab`));
            tabTrigger.show();
        }

        
        document.getElementById('busqueda').addEventListener('input', function () {
            let q = this.value;

            fetch(`/buscar-instalaciones?q=${q}`)
                .then(response => response.json())
                .then(data => {
                    let select = document.getElementById('resultado-select');
                    select.innerHTML = '';

                    data.forEach(item => {
                        let option = document.createElement('option');
                        option.value = item.id;
                        option.textContent = item.instalacion + ' - ' + item.tipo_instalacion + ' - ' + item.sistema + ' - ' + item.ubicacion_tecnica + ' - ' + item.ubicacion_inmueble;
                        option.setAttribute('data-url', `https://maps.google.com/?q=${item.latitud},${item.longitud}`);
                        option.setAttribute('data-instalacion', item.instalacion);
                        option.setAttribute('data-tipo_instalacion', item.tipo_instalacion);
                        option.setAttribute('data-localizacion', item.localizacion);
                        option.setAttribute('data-coordenadas', item.latitud + ',' + item.longitud);
                        option.setAttribute('data-latitud', item.latitud);
                        option.setAttribute('data-longitud', item.longitud);

                        select.appendChild(option);
                    });

                    // Agregar opción vacía al final
                    const emptyOption = document.createElement('option');
                    emptyOption.value = "";
                    emptyOption.textContent = "-";
                    select.appendChild(emptyOption);

                    // Si quieres dejarla seleccionada por defecto
                    // select.value = "";
                });
        });
        

        // Evento de cambio en el select (único y correcto)
        document.getElementById('resultado-select').addEventListener('change', function () {
            let selected = this.options[this.selectedIndex];
            let valInst = selected.getAttribute('data-instalacion'); // o selected.textContent si quieres toda la línea
            let valLoc = selected.getAttribute('data-localizacion');
            document.getElementById('instalacion').value = valInst;
            document.getElementById('localizacion').value = valLoc;
            document.getElementById('coordenadas').value = selected.getAttribute('data-coordenadas');
        });

        


    </script>




@endsection


@extends('../layouts/partials/footer')