@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;
        }

        .small-radio {
            transform: scale(1.5); /* Ajusta el valor según el tamaño deseado */
            margin-right: 5px;
        }

    </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">Inv. Patio</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">Fotografías</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>
                            <div class="row">
                                <div class="text-center">
                                    <strong>STOCK DE INVENTARIO</strong><br><br>
                                </div>
                            </div>
                            
                            <div class="row">
                                <div class="col-md-4 text-start">
                                    <div class="form-group">
                                        <a href="{{ route('stock.index') }}">Ver lista de inventarios</a> | <a href="{{ route('stock.create') }}">Crear nuevo registro</a>
                                        <br>
                                        Los campos marcados con (*) son mandatorios.<br>
                                    </div>
                                </div>
                            </div>


                            <form action="{{route('stock.update',$data)}}" method="POST" id="formCaptura" enctype="multipart/form-data" >
                                @csrf
                                @method('put')
                                <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="fecha" style="all: unset;"><strong>*Fecha:</strong></label>
                                            <input type="date" id="fecha" name="fecha" value="{{old('fecha',$data->fecha)}}" class="form-control" required>
                                        </div>
                                    </div>
                                    <div class="col-md-2 text-start">
                                        <div class="form-group">
                                            <label for="hora" style="all: unset;"><strong>*Hora:</strong></label>
                                            <input type="time" id="hora" name="hora" value="{{old('hora',$data->hora)}}" class="form-control" required>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-md-2 text-start">
                                        <div class="form-group">
                                            <label for="contenedor" style="all: unset;"><strong>*Contenedor:</strong></label>
                                            <input type="text" id="contenedor" name="contenedor" value="{{ old('contenedor',$data->contenedor) }}" class="form-control" maxlength="30" required>
                                        </div>
                                    </div>
                                    <div class="col-md-3 text-start">
                                        <div class="form-group">
                                            <label for="tipo" style="all: unset;"><strong>*Tipo:</strong></label>
                                            <select name="tipo" id="tipo" class="form-control" required>
                                                <option value="" {{ old('tipo') == '' ? 'selected' : '' }}>-</option>
                                                <option value="20DC" {{ old('tipo',$data->tipo) == '20DC' ? 'selected' : '' }}>20DC</option>
                                                <option value="20HC" {{ old('tipo',$data->tipo) == '20HC' ? 'selected' : '' }}>20HC</option>
                                                <option value="40DC" {{ old('tipo',$data->tipo) == '40DC' ? 'selected' : '' }}>40DC</option>
                                                <option value="40HC" {{ old('tipo',$data->tipo) == '40HC' ? 'selected' : '' }}>40HC</option>
                                                <option value="53" {{ old('tipo',$data->tipo) == '53' ? 'selected' : '' }}>53"</option>
                                                <option value="20 ISOTANQUE" {{ old('tipo',$data->tipo) == '20 ISOTANQUE' ? 'selected' : '' }}>20" ISOTANQUE"</option>
                                                <option value="40RF" {{ old('tipo',$data->tipo) == '40RF' ? 'selected' : '' }}>40RF</option>
                                                <option value="40OT" {{ old('tipo',$data->tipo) == '40OT' ? 'selected' : '' }}>40OT</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-md-2 text-start">
                                        <div class="form-group">
                                            <label for="ubicacion" style="all: unset;"><strong>*Ubicación:</strong></label>
                                            <select name="ubicacion" id="ubicacion" class="form-control" required>
                                                <option value="" {{ old('ubicacion',$data->ubicacion) == '' ? 'selected' : '' }}>-</option>
                                                <option value="LP" {{ old('ubicacion',$data->ubicacion) == 'LP' ? 'selected' : '' }}>LP</option>
                                                <option value="2C" {{ old('ubicacion',$data->ubicacion) == '2C' ? 'selected' : '' }}>2C</option>
                                                <option value="FP3" {{ old('ubicacion',$data->ubicacion) == 'FP3' ? 'selected' : '' }}>FP3</option>
                                                <option value="LC" {{ old('ubicacion',$data->ubicacion) == 'LC' ? 'selected' : '' }}>LC</option>
                                                <option value="LL40" {{ old('ubicacion',$data->ubicacion) == 'LL40' ? 'selected' : '' }}>LL40</option>
                                                <option value="LL20" {{ old('ubicacion',$data->ubicacion) == 'LL20' ? 'selected' : '' }}>LL20</option>
                                                <option value="2-3" {{ old('ubicacion',$data->ubicacion) == '2-3' ? 'selected' : '' }}>2-3</option>
                                                <option value="2-4" {{ old('ubicacion',$data->ubicacion) == '2-4' ? 'selected' : '' }}>2-4</option>
                                                <option value="2-1" {{ old('ubicacion',$data->ubicacion) == '2-1' ? 'selected' : '' }}>2-1</option>
                                                <option value="2-2" {{ old('ubicacion',$data->ubicacion) == '2-2' ? 'selected' : '' }}>2-2</option>
                                                <option value="1-1" {{ old('ubicacion',$data->ubicacion) == '1-1' ? 'selected' : '' }}>1-1</option>
                                                <option value="PXR" {{ old('ubicacion',$data->ubicacion) == 'PXR' ? 'selected' : '' }}>PXR</option>
                                                <option value="TALLER" {{ old('ubicacion',$data->ubicacion) == 'TALLER' ? 'selected' : '' }}>TALLER</option>
                                                <option value="AREA DE LAVADO" {{ old('ubicacion',$data->ubicacion) == 'AREA DE LAVADO' ? 'selected' : '' }}>AREA DE LAVADO</option>
                                                <option value="1-3" {{ old('ubicacion',$data->ubicacion) == '1-3' ? 'selected' : '' }}>1-3</option>
                                                <option value="1-2" {{ old('ubicacion',$data->ubicacion) == '1-2' ? 'selected' : '' }}>1-2</option>
                                                <option value="S" {{ old('ubicacion',$data->ubicacion) == 'S' ? 'selected' : '' }}>S</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="col-md-1 text-start">
                                        <div class="form-group">
                                            <label for="bahia" style="all: unset;"><strong>* Bahía:</strong></label>
                                            <input type="text" id="bahia" name="bahia" value="{{ old('bahia', $data->bahia) }}" class="form-control" required>
                                        </div>
                                    </div>
                                    <div class="col-md-1 text-start">
                                        <div class="form-group">
                                            <label for="fila" style="all: unset;"><strong>* Fila:</strong></label>
                                            <input type="text" id="fila" name="fila" value="{{ old('fila', $data->fila) }}" class="form-control" required>
                                        </div>
                                    </div>

                                    <div class="col-md-1 text-start">
                                        <div class="form-group">
                                            <label for="nivel" style="all: unset;"><strong>* Nivel:</strong></label>
                                            <select name="nivel" id="nivel" class="form-control" required>
                                                <option value="" {{ old('nivel',$data->nivel) == '' ? 'selected' : '' }}>-</option>
                                                <option value="1" {{ old('nivel',$data->nivel) == '1' ? 'selected' : '' }}>1</option>
                                                <option value="2" {{ old('nivel',$data->nivel) == '2' ? 'selected' : '' }}>2</option>
                                                <option value="3" {{ old('nivel',$data->nivel) == '3' ? 'selected' : '' }}>3</option>
                                                <option value="4" {{ old('nivel',$data->nivel) == '4' ? 'selected' : '' }}>4</option>
                                                <option value="S" {{ old('nivel',$data->nivel) == 'S' ? 'selected' : '' }}>S</option>
                                            </select>                                            
                                        </div>
                                    </div>
    
                                    <div class="col-md-2 text-start">
                                        <div class="form-group">
                                            <label for="montacarguista" style="all: unset;"><strong>* Montacarguista:</strong></label>
                                            <select name="montacarguista" id="montacarguista" class="form-control" required>
                                                <option value="" {{ old('montacarguista',$data->montacarguista) == '' ? 'selected' : '' }}>-</option>
                                                <option value="JUAN SANTANA" {{ old('montacarguista',$data->montacarguista) == 'JUAN SANTANA' ? 'selected' : '' }}>JUAN SANTANA</option>
                                                <option value="EDGARDO" {{ old('montacarguista',$data->montacarguista) == 'EDGARDO' ? 'selected' : '' }}>EDGARDO</option>
                                                <option value="JESUS" {{ old('montacarguista',$data->montacarguista) == 'JESUS' ? 'selected' : '' }}>JESUS</option>
                                                <option value="MANUEL MIRANDA" {{ old('montacarguista',$data->montacarguista) == 'MANUEL MIRANDA' ? 'selected' : '' }}>MANUEL MIRANDA</option>
                                                <option value="SR. ZUÑIGA" {{ old('montacarguista',$data->montacarguista) == 'SR. ZUÑIGA' ? 'selected' : '' }}>SR. ZUÑIGA</option>
                                                <option value="ARTURO" {{ old('montacarguista',$data->montacarguista) == 'ARTURO' ? 'selected' : '' }}>ARTURO</option>
                                            </select>                                            
                                        </div>
                                    </div>

                                    <div class="col-md-2 text-start">
                                        <div class="form-group">
                                            <label for="maniobra" style="all: unset;"><strong>*Maniobra:</strong></label>
                                            <select name="maniobra" id="maniobra" class="form-control" required>
                                                <option value="" {{ old('maniobra',$data->maniobra) == '' ? 'selected' : '' }}>-</option>
                                                <option value="ENTRADA" {{ old('maniobra',$data->maniobra) == 'ENTRADA' ? 'selected' : '' }}>ENTRADA</option>
                                                <option value="SALIDA" {{ old('maniobra',$data->maniobra) == 'SALIDA' ? 'selected' : '' }}>SALIDA</option>
                                                <option value="REACOMODO" {{ old('maniobra',$data->maniobra) == 'REACOMODO' ? 'selected' : '' }}>REACOMODO</option>
                                                <option value="TEMPORAL" {{ old('maniobra',$data->maniobra) == 'TEMPORAL' ? 'selected' : '' }}>TEMPORAL</option>
                                                <option value="Traspaso(De un Camion a Otro)" {{ old('maniobra',$data->maniobra) == 'Traspaso(De un Camion a Otro)' ? 'selected' : '' }}>Traspaso(De un Camion a Otro)</option>
                                                <option value="Reacomodo (Misma Unidad)" {{ old('maniobra',$data->maniobra) == 'Reacomodo (Misma Unidad)' ? 'selected' : '' }}>Reacomodo (Misma Unidad)</option>
                                                <option value="Traspaso (Misma Unidad)" {{ old('maniobra',$data->maniobra) == 'Traspaso (Misma Unidad)' ? 'selected' : '' }}>Traspaso (Misma Unidad)</option>       
                                                <option value="Stock Semanal" {{ old('maniobra',$data->maniobra) == 'Stock Semanal' ? 'selected' : '' }}>Stock Semanal</option>
                                            </select>
                                        </div>
                                    </div>

                                </div>
                                <div class="row">
                                    <div class="col-md-5 text-start">
                                        <div class="form-group">
                                            <label for="foto_puerta_1" style="all: unset;"><strong>Foto de puerta:</strong></label>
                                            <input class="form-control" type="file" id="foto_puerta_1"  name="foto_puerta_1" accept=".jpg, .jpeg"><br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_puerta_1) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                            <br>
                                        </div>
                                    </div>
                                    <div class="col-md-5 text-start">
                                        <div class="form-group">
                                            <label for="nota" style="all: unset;"><strong>Notas:</strong></label>
                                            <textarea class="form-control" id="nota" name="nota" rows="4">{{ old('nota',$data->nota) }}</textarea>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-md-12 text-right">
                                        <div class="form-group">
                                            <i>
                                                {{ $data->user->name }}<br>
                                                {{ $data->created_at }}
                                            </i>
                                        </div>
                                    </div>
                                </div>


                                <div class="row">
                                    <input type="hidden" name="active_tab" id="active_tab" value="{{ old('active_tab',session('active_tab', 'tab2')) }}">
                                    <button type="submit" class="btn btn-primary btn-sm">Guardar</button>
                                </div>


                            </form>

                            
                        </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="text-center">
                                    <strong>Evidencia Fotográfica</strong><br><br>
                                </div>
                            </div>

                            <div class="row">
                                <form action="{{route('stock.fotosUpload',$data->id)}}" method="POST" id="form3" 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="foto_1" style="all: unset;"><strong>1. Evidencia Fotográfica:</strong></label>
                                                            <input class="form-control" type="file" id="foto_1"  name="foto_1"  accept=".jpg, .jpeg"><br>
                                                            
                                                        </td>
                                                        <td>
                                                            <label for="foto_2" style="all: unset;"><strong>2. Evidencia Fotográfica:</strong></label>
                                                            <input class="form-control" type="file" id="foto_2"  name="foto_2"  accept=".jpg, .jpeg"><br>
                                                        </td>
                                                    </tr>
                                                    <tr align="center">
                                                        <td>
                                                            <label for="foto_3" style="all: unset;"><strong>3. Evidencia Fotográfica:</strong></label>
                                                            <input class="form-control" type="file" id="foto_3"  name="foto_3"  accept=".jpg, .jpeg"><br>
                                                        </td>
                                                        <td>
                                                            <label for="foto_4" style="all: unset;"><strong>4. Evidencia Fotográfica:</strong></label>
                                                            <input class="form-control" type="file" id="foto_4"  name="foto_4"  accept=".jpg, .jpeg"><br>
                                                        </td>
                                                    </tr>



                                                    <tr align="center">
                                                        <td>
                                                            <label for="foto_5" style="all: unset;"><strong>5. Evidencia Fotográfica:</strong></label>
                                                            <input class="form-control" type="file" id="foto_5"  name="foto_5"  accept=".jpg, .jpeg"><br>
                                                           
                                                        </td>
                                                        <td>
                                                            <label for="foto_6" style="all: unset;"><strong>6. Evidencia Fotográfica:</strong></label>
                                                            <input class="form-control" type="file" id="foto_6"  name="foto_6"  accept=".jpg, .jpeg"><br>
                                                            
                                                        </td>
                                                    </tr>
                                                    <tr align="center">
                                                        <td>
                                                            <label for="foto_7" style="all: unset;"><strong>7. Evidencia Fotográfica:</strong></label>
                                                            <input class="form-control" type="file" id="foto_7"  name="foto_7"  accept=".jpg, .jpeg"><br>
                                                            
                                                        </td>
                                                        <td>
                                                            <label for="foto_8" style="all: unset;"><strong>8. Evidencia Fotográfica:</strong></label>
                                                            <input class="form-control" type="file" id="foto_8"  name="foto_8"  accept=".jpg, .jpeg"><br>
                                                           
                                                        </td>
                                                    </tr>
                                                    <tr align="center">
                                                        <td>
                                                            <label for="foto_9" style="all: unset;"><strong>9. Evidencia Fotográfica:</strong></label>
                                                            <input class="form-control" type="file" id="foto_9"  name="foto_9"  accept=".jpg, .jpeg"><br>
                                                            
                                                        </td>
                                                        <td>
                                                            <label for="foto_10" style="all: unset;"><strong>10. Evidencia Fotográfica:</strong></label>
                                                            <input class="form-control" type="file" id="foto_10"  name="foto_10"  accept=".jpg, .jpeg"><br>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>

                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-md-3">
                                            Foto 1 <br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_1) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                        </div>
                                        <div class="col-md-3">
                                            Foto 2 <br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_2) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                        </div>
                                        <div class="col-md-3">
                                            Foto 3 <br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_3) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                        </div>
                                        <div class="col-md-3">
                                            Foto 4 <br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_4) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                        </div>                                    
                                    </div>
                                    <div class="row">
                                        <div class="col-md-3">
                                            Foto 5 <br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_5) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                        </div>
                                        <div class="col-md-3">
                                            Foto 6 <br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_6) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                        </div>
                                        <div class="col-md-3">
                                            Foto 7 <br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_7) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                        </div>
                                        <div class="col-md-3">
                                            Foto 8 <br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_8) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                        </div>                                    
                                    </div>
                                    <div class="row">
                                        <div class="col-md-3">
                                            Foto 9 <br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_9) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                        </div>
                                        <div class="col-md-3">
                                            Foto 10 <br>
                                            @if($data)
                                                <img src="{{ asset('uploads/stock/'.$data->foto_10) }}" class="img-custom-size">
                                            @else
                                                <p>Imagen no disponible</p>
                                            @endif
                                        </div>
                                    </div>



                                    <div class="row">
                                        <input type="hidden" name="active_tab" id="active_tab" value="{{ old('active_tab',session('active_tab', 'tab2')) }}">
                                        <button type="submit" class="btn btn-primary btn-sm">Guardar</button>
                                    </div>

                                </form>
                            </div>

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

        document.addEventListener('DOMContentLoaded', function () {
        // Función para asignar "S" a los campos deseados
        const maniobraSelect = document.getElementById('maniobra');

        maniobraSelect.addEventListener('change', function () {
            if (this.value === 'SALIDA') {
                document.getElementById('ubicacion').value = 'S';
                document.getElementById('bahia').value = 'S';
                document.getElementById('fila').value = 'S';
                document.getElementById('nivel').value = 'S';
            }
        });
    });

    </script>

    


@endsection


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