{{-- Reportes de exportación a la medida de un cliente (OTIF Brinsa: exbrinsa; global exportaciones Imusa: eximusa), kit
     ui-ctc (MigracionLayout.MD L3, pantallas de L2a). Los dos componentes tienen los mismos filtros (Fechaini, Fechafin,
     numero_do), consultan al pulsar Consultar o Enter y descargan con exportar(). Solo consultan con una fecha inicial o
     una búsqueda. Parámetros: $titulo, $descripcion, $ruta (migas), $columnas [etiqueta => [campo, tipo, mapa]] (tipo:
     fecha, etiqueta, numero, texto, largo, do, mapa: etiqueta con la variante de mapa[valor]), $data (paginador o
     colección vacía). También lo usa contenedores_ternium (importación), con los mismos filtros. --}}
@php
    $vacio = '<span class="text-[var(--texto-tenue)]">—</span>';
    $chips = [];
    if ($numero_do) { $chips['numero_do'] = ['Búsqueda', $numero_do]; }
    $hayConsulta = $Fechaini || $numero_do;
@endphp
<div>
<x-pagina>
    <x-encabezado-pagina :ruta="$ruta ?? 'Exportaciones · Reportes'" :titulo="$titulo" :descripcion="$descripcion">
        <x-slot name="acciones">
            <x-secondary-button wire:click="exportar" wire:loading.attr="disabled" wire:target="exportar">
                <x-icono nombre="table-cells" class="h-4 w-4 text-emerald-600 dark:text-emerald-400" />
                <span wire:loading.remove wire:target="exportar">Descargar</span>
                <span wire:loading wire:target="exportar">Generando…</span>
            </x-secondary-button>
        </x-slot>
    </x-encabezado-pagina>

    <x-barra-busqueda modelo="numero_do" accion="$refresh" placeholder="Buscar por DO o pedido" :abierto="true" :activos="count($chips)">
        <x-slot name="filtros">
            <x-campo etiqueta="Fecha apertura inicio" para="Fechaini"><x-input type="date" id="Fechaini" wire:model="Fechaini" /></x-campo>
            <x-campo etiqueta="Fecha apertura fin" para="Fechafin"><x-input type="date" id="Fechafin" wire:model="Fechafin" /></x-campo>
        </x-slot>
        <x-slot name="ayuda">Indique una fecha inicial o una búsqueda y pulse Consultar.</x-slot>
        @if (count($chips))
            <x-slot name="chips"><x-chip-filtro etiqueta="Búsqueda" :valor="$numero_do" wire:click="$set('numero_do', '')" /></x-slot>
        @endif
    </x-barra-busqueda>

    <section class="min-w-0 overflow-hidden rounded-xl border border-[var(--borde)] bg-[var(--superficie)]">
        <div class="flex items-center justify-between gap-3 border-b border-[var(--borde)] px-5 py-3 text-[12px] text-[var(--texto-suave)]">
            <span><b class="font-bold text-[var(--texto)]">{{ number_format(method_exists($data, 'total') ? $data->total() : 0, 0, ',', '.') }}</b> resultados</span>
            <span wire:loading.delay class="flex items-center gap-1.5 text-[var(--acento-texto)]" role="status"><x-icono nombre="arrow-path" class="h-4 w-4 animate-spin" /> Consultando…</span>
        </div>
        <div class="ctc-tabla-caja">
            <table class="ctc-tabla">
                <thead>
                    <tr>@foreach ($columnas as $etiqueta => $def)@php $tipo = $def[1]; @endphp<th @class(['!text-right' => $tipo === 'numero'])>{{ $etiqueta }}</th>@endforeach</tr>
                </thead>
                <tbody>
                    @forelse ($data as $row)
                        <tr>
                            @foreach ($columnas as $etiqueta => $def)
                                @php [$campo, $tipo] = $def; $valor = $row->{$campo} ?? null; @endphp
                                @if ($valor === null || $valor === '')
                                    <td>{!! $vacio !!}</td>
                                @elseif ($tipo === 'fecha')
                                    <td class="whitespace-nowrap">{{ \Carbon\Carbon::parse($valor)->format('Y-m-d') }}</td>
                                @elseif ($tipo === 'etiqueta')
                                    <td><x-etiqueta class="font-mono">{{ $valor }}</x-etiqueta></td>
                                @elseif ($tipo === 'numero')
                                    <td class="text-right">{{ $valor }}</td>
                                @elseif ($tipo === 'mapa')
                                    <td><x-etiqueta :variante="$def[2][$valor] ?? 'neutro'">{{ $valor }}</x-etiqueta></td>
                                @elseif ($tipo === 'largo')
                                    <td class="min-w-[200px] max-w-[320px] text-[12.5px] leading-snug">{{ $valor }}</td>
                                @elseif ($tipo === 'do')
                                    <td class="whitespace-nowrap font-semibold">{{ $valor }}</td>
                                @else
                                    <td class="whitespace-nowrap">{{ $valor }}</td>
                                @endif
                            @endforeach
                        </tr>
                    @empty
                        <tr data-sin-hover>
                            <td colspan="{{ count($columnas) }}" class="!p-0">
                                <div class="ctc-vacio py-12 text-center text-[14px] text-[var(--texto-suave)]"><x-icono nombre="magnifying-glass" class="mx-auto h-7 w-7 text-[var(--texto-tenue)]" />
                                <p class="mt-2">{{ $hayConsulta ? 'No hay resultados para los filtros seleccionados.' : 'Indique una fecha inicial o una búsqueda para consultar.' }}</p></div>
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
        @if (method_exists($data, 'hasPages') && $data->hasPages())
            <div class="border-t border-[var(--borde)] px-5 py-3">{{ $data->links('vendor.pagination.ctc-livewire') }}</div>
        @endif
    </section>
</x-pagina>
</div>