@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;
        }
        .encabezado-gris2 {
            background-color: #a5a590 !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>

                    {{-- <li class="nav-item" role="presentation">
                        <a class="nav-link {{ session('active_tab') == 'tab2' ? 'active' : '' }}" id="tab2-tab" data-bs-toggle="tab" href="#tab2" role="tab" aria-controls="tab2" aria-selected="false">Indicadores</a>
                    </li>

                    <li class="nav-item" role="presentation">
                        <a class="nav-link {{ session('active_tab') == 'tab3' ? 'active' : '' }}" id="tab3-tab" data-bs-toggle="tab" href="#tab3" role="tab" aria-controls="tab3" aria-selected="false">Fotos</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>
                                    REGISTRO DE ACTIVIDAD DIARIA
                                </h4>
                            </div>

                            <div class="row">
                                <div class="col-md-12 text-center">
                                    <a href="{{ route('instalaciones.show',$partidaAd->id) }}" >Regresar</a>
                                    <br><br>
                                </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">Partida</th>
                                                <th class="encabezado-gris" width="450px">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>
                                                <th class="encabezado-gris">Indicadores</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>
                                            <td>
                                                @csrf
                                                <input type="checkbox" class="toggle-check-p" data-campo="flg_reporte_contratista" data-id="{{ $partidaAd->id }}" >
                                                Reporte de Contratista <br>
                                                <input type="checkbox" class="toggle-check-p" data-campo="flg_estimacion_contratista" data-id="{{ $partidaAd->id }}" >
                                                Generador de Contratista <br>
                                                <input type="checkbox" class="toggle-check-p" data-campo="flg_estimacion_cenagas" data-id="{{ $partidaAd->id }}" >
                                                Estimación a CENAGAS <br>
                                                <input type="checkbox" class="toggle-check-p" data-campo="flg_estimacion_cenagas_aprobada" data-id="{{ $partidaAd->id }}" >
                                                Estimación Aprobada (CENAGAS) <br>
                                                <div id="mensaje-exito-p" style="display: none; color: rgb(75, 182, 75); font-weight: bold;">✔ Guardado en todas las instalaciones</div>
                                            </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>
                                                <th class="encabezado-gris">Indicadores</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>{{ $instalacion->instalacion }}</td>
                                                <td>{{ $instalacion->localizacion }}</td>
                                                <td>{{ $instalacion->coordenadas }}</td>
                                                <td>
                                                    @csrf
                                                    <input type="checkbox" class="toggle-check" data-campo="flg_reporte_contratista" data-id="{{ $instalacion->id }}" {{ $instalacion->flg_reporte_contratista ? 'checked' : '' }}>
                                                    Reporte de Contratista <br>

                                                    <input type="checkbox" class="toggle-check" data-campo="flg_estimacion_contratista" data-id="{{ $instalacion->id }}" {{ $instalacion->flg_estimacion_contratista ? 'checked' : '' }}>
                                                    Generador de Contratista <br>

                                                    <input type="checkbox" class="toggle-check" data-campo="flg_estimacion_cenagas" data-id="{{ $instalacion->id }}" {{ $instalacion->flg_estimacion_cenagas ? 'checked' : '' }}>
                                                    Estimación a CENAGAS <br>

                                                    <input type="checkbox" class="toggle-check" data-campo="flg_estimacion_cenagas_aprobada" data-id="{{ $instalacion->id }}" {{ $instalacion->flg_estimacion_cenagas_aprobada ? 'checked' : '' }}>
                                                    Estimación Aprobada (CENAGAS) <br>
                                                    <div id="mensaje-exito" style="display: none; color: rgb(75, 182, 75); font-weight: bold;">✔ Guardado</div>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>

                            </div>




                            <form action="{{ isset($registro) ? route('avance.updateActivity', [$instalacion->id, $registro->id]) : route('instalaciones.storeActivity', $instalacion->id) }}" method="POST" id="formCaptura" enctype="multipart/form-data">
                                @csrf
                                @if(isset($registro))
                                    @method('PUT')
                                @endif

                                <div class="row">
                                    <div class="col-md-11 text-left">
                                        Por favor registe la actividad diaria en el siguiente formulario.<br>
                                        El porcentaje de avance debe ser <strong style="color:red">ACUMULATIVO</strong>.
                                    </div>
                                    <br>
                                </div>
                                <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
                                    @if(session('error'))
                                        <div class="alert alert-danger alert-dismissible fade show" role="alert">
                                            <strong>Error:</strong> {{ session('error') }}
                                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                        </div>
                                    @endif

                                </div>

                                <div class="row">
                                    <div class="col-md-2 text-left">
                                        <label for="fecha" style="all: unset;"><strong>*Fecha de ejecución:</strong></label>
                                        <input type="date" name="fecha" class="form-control" required value="{{ old('fecha', $registro->fecha ?? '') }}">
                                    </div>
                                    <div class="col-md-2 text-left">
                                        <label for="porcentaje" style="all: unset;"><strong>*Porcentaje de avance:</strong></label>

                                        <select name="porcentaje" class="form-control" required>
                                            <option>- seleccione -</option>
                                            <option value="0" {{ old('porcentaje', $registro->porcentaje ?? '') == '0' ? 'selected' : '' }}>0%</option>
                                            <option value="5" {{ old('porcentaje', $registro->porcentaje ?? '') == '5' ? 'selected' : '' }}>5%</option>
                                            <option value="10" {{ old('porcentaje', $registro->porcentaje ?? '') == '10' ? 'selected' : '' }}>10%</option>
                                            <option value="20" {{ old('porcentaje', $registro->porcentaje ?? '') == '20' ? 'selected' : '' }}>20%</option>
                                            <option value="30" {{ old('porcentaje', $registro->porcentaje ?? '') == '30' ? 'selected' : '' }}>30%</option>
                                            <option value="40" {{ old('porcentaje', $registro->porcentaje ?? '') == '40' ? 'selected' : '' }}>40%</option>
                                            <option value="50" {{ old('porcentaje', $registro->porcentaje ?? '') == '50' ? 'selected' : '' }}>50%</option>
                                            <option value="60" {{ old('porcentaje', $registro->porcentaje ?? '') == '60' ? 'selected' : '' }}>60%</option>
                                            <option value="70" {{ old('porcentaje', $registro->porcentaje ?? '') == '70' ? 'selected' : '' }}>70%</option>
                                            <option value="80" {{ old('porcentaje', $registro->porcentaje ?? '') == '80' ? 'selected' : '' }}>80%</option>
                                            <option value="90" {{ old('porcentaje', $registro->porcentaje ?? '') == '90' ? 'selected' : '' }}>90%</option>
                                            <option value="95" {{ old('porcentaje', $registro->porcentaje ?? '') == '95' ? 'selected' : '' }}>95%</option>
                                            <option value="100" {{ old('porcentaje', $registro->porcentaje ?? '') == '100' ? 'selected' : '' }}>100%</option>
                                        </select>
                                    </div>
                                    <div class="col-md-2 text-left">
                                        <label for="ducto_id" style="all: unset;"><strong>Otro:</strong></label>
                                        <input type="text" id="otro" name="otro" value="{{old('otro', $registro->otro ?? '')}}" class="form-control">
                                    </div>
                                    <div class="col-md-4 text-left">
                                        <label for="nota" style="all: unset;"><strong>Nota:</strong></label>
                                        <input type="text" id="nota" name="nota" value="{{old('nota', $registro->nota ?? '')}}" class="form-control">
                                    </div>
                                    <div class="col-md-2 text-left">
                                        <br>
                                        <button type="submit" class="btn btn-warning">
                                            <i class="bi bi-save-fill"></i> {{ isset($registro) ? 'Actualizar' : 'Agregar' }}
                                        </button>
                                        <br><br>
                                    </div>

                                </div>

                            </form>

                            <div class="row">
                                <div class="col-md-12 text-left">
                                    <table class="table table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th colspan="7" style="text-align: center" class="encabezado-gris">Registro de Actividad Diaria</th>
                                            </tr>
                                            <tr>
                                                <th class="encabezado-gris">Fecha Ejecución</th>
                                                <th class="encabezado-gris">Otro</th>
                                                <th class="encabezado-gris">Avance</th>
                                                <th class="encabezado-gris">PDT</th>
                                                <th class="encabezado-gris">Nota</th>
                                                <th class="encabezado-gris">Capturo</th>
                                                <th class="encabezado-gris">Acciones</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach($registrosDiarios as $regDiario)

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

                                            <tr>
                                                <td>{{ $regDiario->fecha }}</td>
                                                <td>{{ $regDiario->otro }}</td>
                                                <td>
                                                    {{ $regDiario->porcentaje }} %
                                                    <br>
                                                    <a href="{{ route('avance.editActivity', [$instalacion->id, $regDiario->id]) }}">Modificar</a>
                                                </td>
                                                <td>
                                                    {{ $regDiario->pdt_folio }}<br>{{ $regDiario->pdt_fecha }}
                                                </td>
                                                <td>{{ $regDiario->nota }}</td>
                                                <td>{{ $regDiario->user->name }}<br>{{ $regDiario->updated_at }}</td>

                                                <td>
                                                    @if($esCreador)
                                                        <a href="#" onclick="eliminarRegistro({{ $regDiario->id }})"> <i class="fas fa-trash"></i></a> |
                                                        {{-- <i class="fas fa-trash"></i> | --}}
                                                    @else
                                                        <i class="fas fa-trash"></i> |
                                                    @endif

                                                    @can('regDiarioPDT.pdt')
                                                        <a href="{{ route('avance.pdt', $regDiario->id) }}">PDT</a>
                                                    @else
                                                        PDT |
                                                    @endcan


                                                </td>
                                            </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>

                        </div>
                    </div>

                </div>
            </div>

        </div>



    </div>



    <script>

        function eliminarRegistro(id) {
            if (!confirm('¿Estás seguro de eliminar este registro?')) return;

            fetch(`/avance/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();
            }
        }
         });

    </script>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
    $('.toggle-check').on('change', function () {
        let checkbox = $(this);
        let campo = checkbox.data('campo');
        let id = checkbox.data('id');
        let valor = checkbox.is(':checked') ? 1 : 0;

        $.ajax({
            url: '/instalaciones/' + id + '/toggle-checkbox',
            method: 'POST',
            data: {
                _token: '{{ csrf_token() }}',
                campo: campo,
                valor: valor
            },
            success: function (response) {
                // Mostrar mensaje
                $('#mensaje-exito').fadeIn().delay(1000).fadeOut();
            },
            error: function () {
                alert('Error al guardar el cambio');
            }
        });
    });
</script>
<script>
    $('.toggle-check-p').on('change', function () {

        let checkbox = $(this);
        let campo = checkbox.data('campo');
        let id = checkbox.data('id');
        let valor = checkbox.is(':checked') ? 1 : 0;

        $.ajax({
            url: '/instalaciones/' + id + '/toggle-checkbox-p',
            method: 'POST',
            data: {
                _token: '{{ csrf_token() }}',
                campo: campo,
                valor: valor
            },
            success: function (response) {
                // Mostrar mensaje
                $('#mensaje-exito-p').fadeIn().delay(1000).fadeOut();
            },
            error: function () {
                alert('Error al guardar el cambio');
            }
        });
    });
</script>




@endsection


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