{{-- Documentos de facturas (rdocumentosfacturas). Catálogo con el kit ui-ctc (MigracionLayout.MD, Configuración).
     La búsqueda por número DO carga los documentos (cti) y las facturas que ofrece el formulario. Los selectores ocultos
     cboTipoDocumento y cboFactura se llenan en el navegador con el texto elegido en Documento y Factura (como antes con jQuery). --}}
@php
    // El número DO sugerido es el del último documento de la lista (antes salía de la variable del último @foreach).
    $ultimoDocumento = count($infoDocumento_cti) ? end($infoDocumento_cti) : null;
@endphp
<x-app-layout titulo="Documentos de facturas">
    <x-pagina>
        <x-encabezado-pagina ruta="Importaciones · Configuración" titulo="Documentos de facturas" />
        <x-catalogo.avisos />

        <x-catalogo.busqueda :accion="url('rdocumentosfacturassrh')" :valor="$reg->bus" placeholder="Número DO" :limpiar="url('/rdocumentosfacturas')" requerido />

        <x-catalogo.formulario :titulo="$reg->id ? 'Editar documento de factura' : 'Nuevo documento de factura'" :accion="route('rdocumentosfacturas.store')" :abierto="(bool) $reg->id || (string) $reg->bus !== ''">
            <input type="hidden" id="txtId" name="txtId" value="{{ $reg->id }}">
            <x-campo etiqueta="Documento" para="cboTipoDocumentoId" ayuda="Busque un número DO para cargar sus documentos y facturas.">
                <x-select name="cboTipoDocumentoId" id="cboTipoDocumentoId" onchange="TraerDatos();">
                    <option value="">SIN ASIGNAR</option>
                    @foreach ($infoDocumento_cti as $file)
                        <option value="{{ $file->id }}">{{ $file->nombre }}</option>
                    @endforeach
                </x-select>
            </x-campo>
            <x-campo etiqueta="Ruta" para="cboRuta">
                <x-select name="cboRuta" id="cboRuta">
                    <option value="">SIN ASIGNAR</option>
                    @foreach ($infoDocumento_cti as $file)
                        <option value="{{ $file->ruta }}">{{ $file->nombre }}</option>
                    @endforeach
                </x-select>
            </x-campo>
            <x-campo etiqueta="Número DO" para="txtDo">
                <x-input id="txtDo" name="txtDo" readonly="readonly" value="{{ !empty($ultimoDocumento->do) ? $ultimoDocumento->do : '' }}" />
            </x-campo>
            <x-campo etiqueta="Factura" para="cboFacturaId">
                <x-select name="cboFacturaId" id="cboFacturaId" onchange="TraerFactura()">
                    <option value="">SIN ASIGNAR</option>
                    @foreach ($fac as $file)
                        <option value="{{ $file->id }}">{{ $file->nro_factura }}</option>
                    @endforeach
                </x-select>
            </x-campo>
            {{-- Ocultos: guardan el nombre del documento y el número de la factura elegidos. --}}
            <div class="hidden" aria-hidden="true">
                <select name="cboTipoDocumento" id="cboTipoDocumento">
                    <option value="">SIN ASIGNAR</option>
                    @foreach ($infoDocumento_cti as $file)
                        <option value="{{ $file->nombre }}">{{ $file->nombre }}</option>
                    @endforeach
                </select>
                <select name="cboFactura" id="cboFactura">
                    <option value="">SIN ASIGNAR</option>
                    @foreach ($fac as $file)
                        <option value="{{ $file->nro_factura }}">{{ $file->nro_factura }}</option>
                    @endforeach
                </select>
            </div>
            <label class="flex items-center gap-2 self-end pb-2 text-[13px] text-[var(--texto)]">
                <x-checkbox id="chkInactivo" name="chkInactivo" value="1" :checked="$reg->inactivo == 1" /> Inactivo
            </label>
            <x-slot name="botones">
                <x-button><x-icono nombre="check" variante="m" class="h-4 w-4" /> Guardar</x-button>
                <x-enlace-boton href="{{ url('/rdocumentosfacturas') }}"><x-icono nombre="plus" variante="m" class="h-4 w-4" /> Nuevo</x-enlace-boton>
            </x-slot>
        </x-catalogo.formulario>

        <x-catalogo.lista titulo="Documentos de facturas" :total="$tblInfo->total()" :paginador="$tblInfo">
            <thead>
                <tr>
                    <th>Número DO</th>
                    <th>Documento AWS</th>
                    <th>Factura CTC</th>
                    <th>Ruta</th>
                    <th>Estado</th>
                    <th><span class="sr-only">Acciones</span></th>
                </tr>
            </thead>
            <tbody>
                @forelse ($tblInfo as $fil)
                    <tr @if ($fil->inactivo == 1) data-sin-hover style="background-color: color-mix(in srgb, #F59E0B 14%, transparent);" @endif>
                        <td class="font-medium tabular-nums">{{ $fil->numero_do }}</td>
                        <td>{!! $fil->documento_aws ? e($fil->documento_aws) : '<span class="text-[var(--texto-tenue)]">—</span>' !!}</td>
                        <td class="tabular-nums">{!! $fil->factura_ctc ? e($fil->factura_ctc) : '<span class="text-[var(--texto-tenue)]">—</span>' !!}</td>
                        <td>
                            <a href="{{ $fil->ruta }}" target="_blank" rel="noopener" class="ctc-accion" title="Abrir documento" aria-label="Abrir documento">
                                <x-icono nombre="document-text" class="h-[18px] w-[18px]" />
                            </a>
                        </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="'el documento del DO ' . $fil->numero_do" :editar="url('rdocumentosfacturas/editar/' . base64_encode($fil->id))"
                                                 :eliminar="action('DocumentosFacturasController@destroy', base64_encode($fil->id))" />
                        </td>
                    </tr>
                @empty
                    <tr data-sin-hover><td colspan="6" 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>

    <script>
        // Copian el texto elegido al valor de la opción seleccionada del selector oculto (antes con jQuery).
        function TraerFactura() {
            var origen = document.getElementById('cboFacturaId'), destino = document.getElementById('cboFactura');
            destino.options[destino.selectedIndex].value = origen.options[origen.selectedIndex].text;
        }
        function TraerDatos() {
            var origen = document.getElementById('cboTipoDocumentoId'), destino = document.getElementById('cboTipoDocumento');
            destino.options[destino.selectedIndex].value = origen.options[origen.selectedIndex].text;
        }
    </script>
</x-app-layout>