{{-- Definición de campos de la orden de cargue (rexdefinicioncampospo). Catálogo con el kit ui-ctc (MigracionLayout.MD,
     Configuración). Valores solo se muestra con el tipo "Lista" (antes jQuery); oculto sigue enviándose, como antes. --}}
@php
    $tipoInicial = in_array($reg->tipo_campo, $datTipoCampo) ? (string) $reg->tipo_campo : '';
@endphp
<x-app-layout titulo="Definición de campos">
    <x-pagina>
        <x-encabezado-pagina ruta="Exportaciones · Definiciones" titulo="Definición Campos Dinamicos" />
        <x-catalogo.avisos />

        <x-catalogo.formulario :titulo="$reg->id ? 'Editar campo ' . $reg->descripcion . ' [ ' . $reg->id . ' ]' : 'Nuevo campo'"
                               :accion="route('rexdefinicioncampospo.store')" archivos :abierto="$reg->id || count($tblInfo) == 0">
            <input type="hidden" id="txtId" name="txtId" value="{{ $reg->id }}">
            <div class="contents" x-data="{ tipo: {{ \Illuminate\Support\Js::from($tipoInicial) }} }">
                <x-campo etiqueta="Tipo campo" para="cboTipocampo">
                    <x-select name="cboTipocampo" id="cboTipocampo" x-model="tipo">
                        <option value="">SIN ASIGNAR</option>
                        @foreach ($datTipoCampo as $fil)
                            <option @if ($fil == $reg->tipo_campo) selected="selected" @endif value="{{ $fil }}">{{ $fil }}</option>
                        @endforeach
                    </x-select>
                </x-campo>
                <x-campo etiqueta="Descripción" para="txtDescripcion">
                    <x-input type="text" id="txtDescripcion" name="txtDescripcion" value="{{ $reg->descripcion }}" required />
                </x-campo>
                <x-campo etiqueta="Valores" para="txtValores" ayuda='Utilice simbolo Barra de Piso "_" como espacio en blanco' x-show="tipo === 'Lista'" x-cloak>
                    <x-input type="text" name="txtValores" id="txtValores" value="{{ $reg->valores }}" x-on:keydown.space.prevent placeholder="Valores separados por coma" />
                </x-campo>
            </div>
            <x-campo etiqueta="Requerido" para="txtRequerido">
                <x-input type="text" id="txtRequerido" name="txtRequerido" value="{{ $reg->requerido }}" required />
            </x-campo>
            <x-campo etiqueta="Orden" para="txtOrden">
                <x-input type="text" id="txtOrden" name="txtOrden" value="{{ $reg->orden }}" required />
            </x-campo>
            <x-campo etiqueta="Grupo" para="cboGrupo">
                <x-select name="cboGrupo" id="cboGrupo">
                    <option value="">Seleccione</option>
                    @foreach ($datTipoGrupo as $fil)
                        <option @if ($fil == $reg->grupo) selected="selected" @endif value="{{ $fil }}">{{ $fil }}</option>
                    @endforeach
                </x-select>
            </x-campo>
            <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('/rexdefinicioncampospo') }}"><x-icono nombre="plus" variante="m" class="h-4 w-4" /> Nuevo</x-enlace-boton>
            </x-slot>
        </x-catalogo.formulario>

        <x-catalogo.busqueda :accion="url('rexdefinicioncamposposrh')" :valor="$reg->bus" placeholder="Descripción, tipo de campo o grupo"
                             :limpiar="url('/rexdefinicioncampospo')" requerido />

        <x-catalogo.lista titulo="Campos dinámicos" :total="$tblInfo->total()" :paginador="$tblInfo">
            <thead>
                <tr>
                    <th>Tipo campo</th>
                    <th>Descripción</th>
                    <th class="text-right">Orden</th>
                    <th>Grupo</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><x-etiqueta variante="neutro">{{ $fil->tipo_campo }}</x-etiqueta></td>
                        <td class="font-medium">{!! $fil->descripcion ? e($fil->descripcion) : '<span class="text-[var(--texto-tenue)]">—</span>' !!}</td>
                        <td class="text-right tabular-nums">{!! $fil->orden !== null ? e($fil->orden) : '<span class="text-[var(--texto-tenue)]">—</span>' !!}</td>
                        <td>{!! $fil->grupo ? e($fil->grupo) : '<span class="text-[var(--texto-tenue)]">—</span>' !!}</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 campo ' . $fil->descripcion" :editar="url('rexdefinicioncampospo/editar/' . base64_encode($fil->id))"
                                                 :eliminar="action('ExDefinicionCamposPoController@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>
</x-app-layout>