@extends('adminlte::page')

@section('title', 'Salidas de Contenedores')

@section('content_header')
    <div class="d-flex justify-content-between align-items-center mb-3">
        <h3 class="fw-bold text-primary">
            🚛 Salidas de Contenedores
        </h3>
        <span class="badge bg-dark fs-6 px-3 py-2">
            Total: {{ $data->total() }}
        </span>
    </div>
@endsection

@section('content')

@if(session('success'))
    <div class="alert alert-success alert-dismissible fade show" role="alert">
        ✅ {{ session('success') }}
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
@endif

@if(session('error'))
    <div class="alert alert-danger alert-dismissible fade show" role="alert">
        ❌ {{ session('error') }}
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
@endif

<div class="card shadow-sm">
    <div class="card-header bg-light">
        <form method="GET" action="{{ route('salida.index') }}">
            <div class="input-group">
                <input type="text" name="search" class="form-control form-control-lg"
                       placeholder="🔎 Buscar por EIR, contenedor, naviera, operador..."
                       value="{{ request('search') }}">
                <button class="btn btn-primary btn-lg">
                    Buscar
                </button>
            </div>
        </form>
    </div>

    <div class="card-body p-0">
        <table class="table table-hover table-striped mb-0">
            <thead class="bg-dark text-white text-center">
                <tr>
                    <th>EIR Salida</th>
                    <th>Contenedor</th>
                    <th>Fecha</th>
                    <th>Hora</th>
                    <th>Operador</th>
                    <th>Acciones</th>
                </tr>
            </thead>
            <tbody class="text-center">
                @forelse($data as $salida)
                    <tr>
                        <td>
                            <span class="badge bg-danger px-3 py-2 fs-6">{{ $salida->s_eir }}</span>
                        </td>
                        <td class="fw-bold">{{ $salida->e_contenedor }}</td>
                        <td>{{ $salida->s_fecha }}</td>
                        <td>{{ $salida->s_hora }}</td>
                        <td>{{ $salida->s_operador }}</td>
                        
                        <td class="text-center">
                            
                            {{-- 🔍 Consultar (abre modal) --}}
                            <button class="btn btn-xs btn-outline-info"
                                    data-toggle="modal"
                                    data-target="#modalDetalle{{ $salida->id }}">
                                🔍 Consultar
                            </button>

                            {{-- ✏️ Editar --}}
                            <a href="{{ route('salida.edit', $salida->id) }}" 
                               class="btn btn-xs btn-outline-primary">
                                ✏ Editar
                            </a>

                            {{-- 🗑️ Eliminar --}}
                            <form action="{{ route('salida.destroy', $salida->id) }}" 
                                  method="POST" 
                                  class="d-inline-block"
                                  onsubmit="return confirm('¿Eliminar esta salida? Esta acción no se puede deshacer.');">
                                @csrf
                                @method('DELETE')
                                <button class="btn btn-xs btn-outline-danger">
                                    🗑 Eliminar
                                </button>
                            </form>

                            {{-- 🧾 PDF --}}
                            <a href="{{ route('salida.pdf', $salida->id) }}" 
                               target="_blank"
                               class="btn btn-xs btn-outline-dark">
                                🧾 PDF
                            </a>

                            {{-- 🔄 Regresar al Patio --}}
                            <form action="{{ route('salida.undo', $salida->id) }}" 
                                  method="POST" 
                                  class="d-inline-block"
                                  onsubmit="return confirm('¿Reingresar este contenedor al patio?');">
                                @csrf
                                <button class="btn btn-xs btn-outline-warning text-dark">
                                    🔄 Patio
                                </button>
                            </form>
                        </td>  

                    </tr>

                    {{-- 🪟 Modal de Detalles Rápidos --}}
                        <div class="modal fade" id="modalDetalle{{ $salida->id }}" tabindex="-1" role="dialog" aria-labelledby="detalleLabel{{ $salida->id }}" aria-hidden="true">
                            <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                                <div class="modal-content">
                                <div class="modal-header bg-primary text-white">
                                    <h5 class="modal-title fw-bold" id="detalleLabel{{ $salida->id }}">
                                    📦 Detalles del Contenedor {{ $salida->e_contenedor }}
                                    </h5>
                                    <button type="button" class="close text-white" data-dismiss="modal" aria-label="Cerrar">
                                    <span aria-hidden="true">&times;</span>
                                    </button>
                                </div>

                                <div class="modal-body">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <h6 class="fw-bold text-primary border-bottom">🟢 Datos de Entrada</h6>
                                            <ul class="list-unstyled small">
                                                <li><b>EIR Entrada:</b> {{ $salida->e_eir }}</li>
                                                <li><b>Fecha Entrada:</b> {{ $salida->e_fecha_entrada }}</li>
                                                <li><b>Hora Entrada:</b> {{ $salida->e_hora_entrada }}</li>
                                                <li><b>Booking:</b> {{ $salida->e_booking }}</li>
                                                <li><b>Contenedor:</b> {{ $salida->e_contenedor }}</li>
                                                <li><b>Bordero:</b> {{ $salida->e_bordero }}</li>
                                                <li><b>Bill of Landing:</b> {{ $salida->e_bill_of_landing }}</li>
                                                <li><b>Sello:</b> {{ $salida->e_sello }}</li>
                                                <li><b>Full Single:</b> {{ $salida->e_full_single }}</li>
                                                <li><b>Carrier:</b> {{ $salida->e_carrier }}</li>
                                                <li><b>Tipo de Carga:</b> {{ $salida->e_tipo_de_carga }}</li>
                                                <li><b>Peso Contenedor:</b> {{ $salida->e_peso_contenedor }}</li>
                                                <li><b>Naviera:</b> {{ $salida->e_naviera }}</li>
                                                <li><b>TCGY:</b> {{ $salida->e_tcngy }}</li>
                                            </ul>
                                        </div>

                                        <div class="col-md-6">
                                            <h6 class="fw-bold text-danger border-bottom">🟡 Datos de Inventario</h6>
                                            <ul class="list-unstyled small">
                                                <li><b>Bahía:</b> {{ $salida->i_bahia }}</li>
                                                <li><b>Bahía No.:</b> {{ $salida->i_bahia_numero }}</li>
                                                <li><b>Fila:</b> {{ $salida->i_fila }}</li>
                                                <li><b>Altura:</b> {{ $salida->i_altura }}</li>
                                                <li><b>Cant. Mercancía:</b> {{ $salida->i_total_qty_of_goods }}</li>
                                                <li><b>Peso Neto:</b> {{ $salida->i_net_weight_goods }}</li>
                                                <li><b>Transporte:</b> {{ $salida->i_transport_goods }}</li>
                                                <li><b>Descripción:</b> {{ $salida->i_description }}</li>
                                            </ul>
                                        </div>

                                        <div class="col-md-6">
                                            <h6 class="fw-bold text-danger border-bottom">🔴 Datos de Salida</h6>
                                            <ul class="list-unstyled small">
                                                <li><b>EIR Salida:</b> {{ $salida->s_eir }}</li>
                                                <li><b>Fecha Salida:</b> {{ $salida->s_fecha }}</li>
                                                <li><b>Operación:</b> {{ $salida->s_operacion }}</li>
                                                <li><b>Cita:</b> {{ $salida->s_cita }}</li>
                                                <li><b>CCP:</b> {{ $salida->s_ccp }}</li>
                                                <li><b>Operador:</b> {{ $salida->s_operador }}</li>
                                                <li><b>Chasis:</b> {{ $salida->s_chasis ?? '—' }}</li>
                                                <li><b>Edi:</b> {{ $salida->s_edi ?? '—' }}</li>
                                                <li><b>Observaciones:</b> {{ $salida->i_description ?? '—' }}</li>
                                            </ul>
                                        </div>
                                    </div>

                                    <hr>
                                    <div class="text-end">
                                        <span class="badge {{ $salida->estatus_inventario === 'Salida' ? 'bg-danger' : 'bg-success' }}">
                                            {{ $salida->estatus_inventario ?? '—' }}
                                        </span>
                                    </div>
                                </div>

                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary btn-sm" data-dismiss="modal">Cerrar</button>
                                    <a href="{{ route('salida.pdf', $salida->id) }}" target="_blank" class="btn btn-sm btn-outline-dark">
                                        📄 PDF
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>

                @empty
                    <tr>
                        <td colspan="6" class="text-muted py-4">
                            😕 No hay salidas registradas aún
                        </td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>

    <div class="card-footer text-end">
        {{ $data->links() }}
    </div>
</div>

@endsection
@section('js')
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
@endsection