{{-- Tarifas e Itinerario de exportación (Po\ExTarifasComponent, ruta ExPoTarifas). Catálogo con el kit ui-ctc:
     formulario plegable (se abre con toggle, editar y nuevo, como el acordeón anterior), búsqueda mientras se escribe,
     Excel y lista paginada de 10 con editar y eliminar. --}}
<div>
    @php $vacio = '<span class="text-[var(--texto-tenue)]">—</span>'; @endphp
    <x-pagina>
        <x-encabezado-pagina ruta="Exportaciones · Operaciones" titulo="Tarifas e Itinerario" />
        <x-catalogo.avisos />

        <x-catalogo.formulario :titulo="$id_tarifa ? 'Editar tarifa' : 'Nueva tarifa'" entangle="toggle">
            <input wire:model.live="id_tarifa" type="text" hidden id="txtId" name="txtId" value="">
            <x-campo etiqueta="Línea" para="cboLinea">
                <x-select wire:model.live="id_linea" name="cboLinea" id="cboLinea">
                    <option value="">SIN ASIGNAR</option>
                    @foreach ($datLinea as $fil)
                        <option value="{{ $fil->id }}">{{ $fil->nombre }}</option>
                    @endforeach
                </x-select>
            </x-campo>
            <x-campo etiqueta="Origen" para="cboOrigen">
                <x-select wire:model.live="id_origen" name="cboOrigen" id="cboOrigen">
                    <option value="">SIN ASIGNAR</option>
                    @foreach ($datOrigen as $fil)
                        <option value="{{ $fil->id }}">{{ $fil->nombre }}</option>
                    @endforeach
                </x-select>
            </x-campo>
            <x-campo etiqueta="País" para="cboPais">
                <x-select wire:model.live="id_pais" name="cboPais" id="cboPais">
                    <option value="">SIN ASIGNAR</option>
                    @foreach ($datPais as $fil)
                        <option value="{{ $fil->id }}">{{ $fil->nombre }}</option>
                    @endforeach
                </x-select>
            </x-campo>
            <x-campo etiqueta="Destino" para="cboDestino">
                <x-select wire:model.live="id_destino" name="cboDestino" id="cboDestino">
                    <option value="">SIN ASIGNAR</option>
                    @foreach ($datDestino as $fil)
                        <option value="{{ $fil->id }}">{{ $fil->nombre }}</option>
                    @endforeach
                </x-select>
            </x-campo>
            <x-campo etiqueta="Lugar de entrega" para="txtLugar_Entrega"><x-input wire:model.live="lugar_entrega" type="text" id="txtLugar_Entrega" name="txtLugar_Entrega" required /></x-campo>
            <x-campo etiqueta="Vigencia" para="txtVigencia"><x-input wire:model.live="vigencia" type="date" id="txtVigencia" name="txtVigencia" required /></x-campo>
            <x-campo etiqueta="Contrato" para="txtContrato"><x-input wire:model.live="contrato" type="text" id="txtContrato" name="txtContrato" required /></x-campo>
            <x-campo etiqueta="Tiempo de tránsito" para="txtTtransito"><x-input wire:model.live="ttransito" type="text" id="txtTtransito" name="txtTtransito" required /></x-campo>
            <x-campo etiqueta="Días libres origen" para="txtDia_Libre_Origen"><x-input wire:model.live="dia_libre_origen" type="text" id="txtDia_Libre_Origen" name="txtDia_Libre_Origen" required /></x-campo>
            <x-campo etiqueta="Días libres destino" para="txtDia_Libre_Destino"><x-input wire:model.live="dia_libre_destino" type="text" id="txtDia_Libre_Destino" name="txtDia_Libre_Destino" required /></x-campo>
            <x-campo etiqueta="Valor emisión BL" para="txtValor_Emision_Bl"><x-input wire:model.live="valor_emision_bl" type="text" id="txtValor_Emision_Bl" name="txtValor_Emision_Bl" required /></x-campo>
            <x-campo etiqueta="C20" para="txtC20"><x-input wire:model.live="c20" type="text" id="txtC20" name="txtC20" required /></x-campo>
            <x-campo etiqueta="GD20" para="txtGd20"><x-input wire:model.live="gd20" type="text" id="txtGd20" name="txtGd20" required /></x-campo>
            <x-campo etiqueta="C40" para="txtC40"><x-input wire:model.live="c40" type="text" id="txtC40" name="txtC40" required /></x-campo>
            <x-campo etiqueta="GD40" para="txtGd40"><x-input wire:model.live="gd40" type="text" id="txtGd40" name="txtGd40" required /></x-campo>
            <x-campo etiqueta="Zarpe" para="txtZarpe"><x-input wire:model.live="zarpe" type="text" id="txtZarpe" name="txtZarpe" required /></x-campo>
            <x-campo etiqueta="Ruta" para="txtRuta"><x-input wire:model.live="ruta" type="text" id="txtRuta" name="txtRuta" required /></x-campo>
            <label class="flex items-center gap-2 self-end pb-2 text-[13px] text-[var(--texto)]">
                <x-checkbox wire:model.live="inactivo" id="chkInactivo" name="chkInactivo" value="" /> Inactivo
            </label>
            <x-slot name="botones">
                <x-button type="button" wire:click="store()"><x-icono nombre="check" variante="m" class="h-4 w-4" /> Guardar</x-button>
                <x-secondary-button wire:click="new()"><x-icono nombre="plus" variante="m" class="h-4 w-4" /> Nuevo</x-secondary-button>
            </x-slot>
        </x-catalogo.formulario>

        <x-catalogo.busqueda modelo="buscar" placeholder="Buscar por línea, país, destino, contrato y lugar de entrega">
            <x-secondary-button wire:click="excel()" id="btnExportar" class="h-11" title="Exportar la consulta en formato Excel">
                <x-icono nombre="table-cells" class="h-4 w-4 text-emerald-600 dark:text-emerald-400" /> Exportar
            </x-secondary-button>
        </x-catalogo.busqueda>

        <x-catalogo.lista titulo="Tarifas e itinerario" :total="$tblInfo->total()" :paginador="$tblInfo" livewire>
            <thead>
                <tr>
                    <th>Línea</th>
                    <th>Origen</th>
                    <th>País</th>
                    <th>Destino</th>
                    <th>Lugar de entrega</th>
                    <th>Vigencia</th>
                    <th>Contrato</th>
                    <th>Tiempo tránsito</th>
                    <th class="text-right">Días libres origen</th>
                    <th class="text-right">Días libres destino</th>
                    <th class="text-right">Valor emisión BL</th>
                    <th class="text-right">C20</th>
                    <th class="text-right">GD20</th>
                    <th class="text-right">C40</th>
                    <th class="text-right">GD40</th>
                    <th>Zarpe</th>
                    <th>Ruta</th>
                    <th>Estado</th>
                    <th><span class="sr-only">Acciones</span></th>
                </tr>
            </thead>
            <tbody>
                @forelse ($tblInfo as $fil)
                    <tr wire:key="tarifa-{{ $fil->id }}" @if ($fil->inactivo == 1) data-sin-hover style="background-color: color-mix(in srgb, #F59E0B 14%, transparent);" @endif>
                        <td class="font-medium">{!! $fil->linea ? e($fil->linea) : $vacio !!}</td>
                        <td>{!! $fil->origen ? e($fil->origen) : $vacio !!}</td>
                        <td>{!! $fil->pais ? e($fil->pais) : $vacio !!}</td>
                        <td>{!! $fil->destino ? e($fil->destino) : $vacio !!}</td>
                        <td>{{ $fil->lugar_entrega }}</td>
                        <td class="whitespace-nowrap">{{ $fil->vigencia }}</td>
                        <td>{{ $fil->contrato }}</td>
                        <td>{{ $fil->ttransito }}</td>
                        <td class="text-right tabular-nums">{{ $fil->dia_libre_origen }}</td>
                        <td class="text-right tabular-nums">{{ $fil->dia_libre_destino }}</td>
                        <td class="text-right tabular-nums">{{ $fil->valor_emision_bl }}</td>
                        <td class="text-right tabular-nums">{{ $fil->c20 }}</td>
                        <td class="text-right tabular-nums">{{ $fil->gd20 }}</td>
                        <td class="text-right tabular-nums">{{ $fil->c40 }}</td>
                        <td class="text-right tabular-nums">{{ $fil->gd40 }}</td>
                        <td>{{ $fil->zarpe }}</td>
                        <td>{{ $fil->ruta }}</td>
                        <td>@if ($fil->inactivo == 1)<x-etiqueta variante="aviso">Inactivo</x-etiqueta>@else<x-etiqueta variante="exito">Activo</x-etiqueta>@endif</td>
                        <td class="w-[1%] whitespace-nowrap !px-2">
                            <x-catalogo.acciones etiqueta="la tarifa" :editar-click="'edit(' . (int) $fil->id . ')'" :eliminar-click="'delete(' . (int) $fil->id . ')'" />
                        </td>
                    </tr>
                @empty
                    <tr data-sin-hover><td colspan="19" class="!p-0"><div class="ctc-vacio py-10 text-center text-[14px] text-[var(--texto-suave)]">No hay registros.</div></td></tr>
                @endforelse
            </tbody>
        </x-catalogo.lista>
    </x-pagina>
</div>