@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: 444px;
            height: 300px;
            border: 3px solid black; border-radius: 15px; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
        }
        .table td {
            text-align: left;
        }

    </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">PARTIDA</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">
                                <div class="text-left">
                                    <h4>Partida Principal dentro del Contrato</h4>
                                </div>
                            </div>
                            <div class="row">
                                <a href="{{route('partida.index')}}">Ver todas las Partidas</a>
                            </div>

                                <form action="{{route('partidaTarea.create')}}" method="POST" id="formCaratura" enctype="multipart/form-data" >
                                    @csrf
                                    <input type="hidden" name="partida_id" value="{{$partida->id}}">
                                    <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

                                        {{--
                                        @error('residencia')
                                        <div class="alert alert-danger alert-dismissible fade show" role="alert">
                                            <strong>Error! :</strong> {{ $message }}
                                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                        </div>
                                        @enderror --}}

                                        @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-2 text-start">
                                            <div class="form-group">
                                                <label for="partida" style="all: unset;"><strong>Partida:</strong></label>
                                                <input type="text" id="partida" name="partida" value="{{$partida->partida}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                        <div class="col-md-3 text-start">
                                            <div class="form-group">
                                                <label for="mantenimiento" style="all: unset;"><strong>Tipo.Mantenimiento:</strong></label>
                                                <input type="text" id="mantenimiento" name="mantenimiento" value="{{$partida->mantenimiento}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                        <div class="col-md-7 text-start">
                                            <div class="form-group">
                                                <label for="actividad" style="all: unset;"><strong>Actividad:</strong></label>
                                                <textarea class="form-control" name="actividad" id="actividad" rows="2" disabled>{{$partida->actividad}}</textarea>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-2 text-start">
                                            <div class="form-group">
                                                <label for="especialidad" style="all: unset;"><strong>Especialidad:</strong></label>
                                                <input type="text" id="especialidad" name="especialidad" value="{{$partida->especialidad}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                        <div class="col-md-10 text-start">
                                            <div class="form-group">
                                                <label for="ut" style="all: unset;"><strong>Ubicación Técnica:</strong></label>
                                                <input type="text" id="ut" name="ut" value="{{$partida->ut}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-2 text-start">
                                            <div class="form-group">
                                                <label for="gasoducto" style="all: unset;"><strong>Gasoducto:</strong></label>
                                                <input type="text" id="gasoducto" name="gasoducto" value="{{$partida->gasoducto}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                        <div class="col-md-3 text-start">
                                            <div class="form-group">
                                                <label for="periodicidad" style="all: unset;"><strong>Periodicidad:</strong></label>
                                                <input type="text" id="periodicidad" name="periodicidad" value="{{$partida->periodicidad}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                        <div class="col-md-7 text-start">
                                            <div class="form-group">
                                                <label for="tipo_instalacion" style="all: unset;"><strong>Tipo Instalación:</strong></label>
                                                <input type="text" id="tipo_instalacion" name="tipo_instalacion" value="{{$partida->tipo_instalacion}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-3 offset-md-2 text-start">
                                            <div class="form-group">
                                                <label for="um" style="all: unset;"><strong>Unidad Medida:</strong></label>
                                                <input type="text" id="um" name="um" value="{{$partida->um}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                        <div class="col-md-2 text-start">
                                            <div class="form-group">
                                                <label for="cantidad" style="all: unset;"><strong>Cantidad:</strong></label>
                                                <input type="text" id="cantidad" name="cantidad" value="{{$partida->cantidad}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                        <div class="col-md-2 text-start">
                                            <div class="form-group">
                                                <label for="precio_unitario" style="all: unset;"><strong>Precio Unitario:</strong></label>
                                                <input type="text" id="precio_unitario" name="precio_unitario" value="{{ number_format($partida->precio_unitario, 2, '.', ',')}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                        <div class="col-md-3 text-start">
                                            <div class="form-group">
                                                <label for="importe" style="all: unset;"><strong>Importe:</strong></label>
                                                <input type="text" id="importe" name="importe" value="{{ number_format($partida->importe, 2, '.', ',')}}" class="form-control" disabled>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                            Para generar una nueva ODM de la misma PARTIDA presiona el botón.<br>
                                            <a href="{{ route('partida.newodm', $partida->id) }}" class="btn btn-primary w-100">
                                                <i class="bi bi-plus-lg"></i> Nueva ODM
                                            </a>

                                        {{-- <div class="table-responsive col-md-12">
                                            <table class="table table-hover align-middle table-bordered" style="color: #f8f9fa;">
                                                <thead class="">
                                                    <tr class="table-dark">
                                                        <th>ODM</th>
                                                        <th>Status</th>
                                                        <th>Fec.Ini</th>
                                                        <th>Fec.Fin</th>
                                                        <th>Solicitante1</th>
                                                        <th>Vigencia De</th>
                                                        <th>Vigencia A</th>
                                                        <th>Caputuro</th>
                                                        <th>Fec.Captura</th>
                                                        <th></th>
                                                    </tr>
                                                </thead>
                                                <tbody class="bg-secondary text-white">
                                                    @if( isset($odms) )
                                                        @foreach($odms as $odm)
                                                            <tr>
                                                                <td>
                                                                    <p style="color: red;">
                                                                    <a href="{{ route('odms.edit',$odm->id) }}"><strong>{{ $odm->odm }}</strong>
                                                                    </p>
                                                                </td>
                                                                <td><strong>{{ $odm->status }}</strong></td>
                                                                <td>{{ $odm->fec_ini }}</td>
                                                                <td>{{ $odm->fec_fin }}</td>
                                                                <td>{{ $odm->solicitante1 }}</td>
                                                                <td>{{ $odm->vigencia_f1 }}</td>
                                                                <td>{{ $odm->vigencia_f2 }}</td>
                                                                <td>{{  $odm->user->name ?? 'Usuario no asignado' }}</td>
                                                                <td>{{ $odm->created_at }}</td>
                                                                <td>
                                                                    <a href="{{ route('odms.edit',$odm->id) }}"><i class="bi bi-pencil"></i></a>
                                                                </td>
                                                            </tr>
                                                        @endforeach
                                                    @endif

                                                </tbody>
                                            </table>
                                        </div> --}}
                                    </div>
                                </form>





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

        </div>



    </div>



    <script>
        document.addEventListener('DOMContentLoaded', function () {
        // Capturar el cambio de pestaña
        const tabs = document.querySelectorAll('a[data-bs-toggle="tab"]');
        tabs.forEach(tab => {
            tab.addEventListener('shown.bs.tab', function (e) {
                // Guardar el id de la pestaña activa en el input oculto
                document.getElementById('active_tab').value = e.target.getAttribute('href').substring(1);
            });
        });

        // Activar la pestaña correcta al cargar la página
        const activeTab = '{{ old('active_tab',session('active_tab', 'tab1')) }}';
        const tabElement = document.querySelector(`a[href="#${activeTab}"]`);
        if (tabElement) {
            const tabInstance = new bootstrap.Tab(tabElement);
            tabInstance.show();
        }
        });

    </script>


@endsection


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