{{-- Etapas (retapas), actualizar. Formulario con el kit ui-ctc (MigracionLayout.MD, Configuración). --}}
<x-app-layout titulo="Etapas">
    <x-pagina>
        <x-encabezado-pagina ruta="Importaciones · Configuración · Etapas" titulo="Actualizar Registro de Etapas" />
        <x-catalogo.avisos />

        <x-tarjeta :titulo="'Etapa ' . $etapas->codigo" class="max-w-4xl">
            <form method="POST" action="{{ route('retapas.update', $etapas->id) }}" accept-charset="utf-8">
                @csrf
                @method('PUT')
                <div class="grid gap-x-4 gap-y-3.5 [grid-template-columns:repeat(auto-fill,minmax(220px,1fr))]">
                    <x-campo etiqueta="Código" para="txtCodigo"><x-input type="text" name="txtCodigo" id="txtCodigo" value="{{ $etapas->codigo }}" /></x-campo>
                    <x-campo etiqueta="Nombre" para="txtNombre"><x-input type="text" name="txtNombre" id="txtNombre" value="{{ $etapas->descripcion }}" /></x-campo>

                    @if (auth()->user()->operacion == "E")
                        <x-campo etiqueta="Origen" para="cboOrigen">
                            <x-select name="cboOrigen" id="cboOrigen" onchange="Filtrar(this)" onselect="Filtrar(this)">
                                @foreach ($EnumOrigen as $item)
                                    <option value="{{ $item }}" @selected($item == $etapas->origen)>{{ $item }}</option>
                                @endforeach
                            </x-select>
                        </x-campo>
                        <x-campo etiqueta="Codigo Estado de Hechos" para="txtCodigoEH" id="CodigoEH" style="display:none">
                            <x-input type="text" name="txtCodigoEH" id="txtCodigoEH" value="{{ $etapas->codigo_eh }}" />
                        </x-campo>
                        <x-campo etiqueta="Tabla WebSimex" para="txtTablaWS" id="TablaWS" style="display:none">
                            <x-input type="text" name="txtTablaWS" id="txtTablaWS" value="{{ $etapas->tabla_ws }}" />
                        </x-campo>
                        <x-campo etiqueta="Campo WebSimex" para="txtCampoWS" id="CampoWS" style="display:none">
                            <x-input type="text" name="txtCampoWS" id="txtCampoWS" value="{{ $etapas->campo_ws }}" />
                        </x-campo>
                    @endif

                    <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="$etapas->inactivo == 1" /> Inactivar Registro
                    </label>
                </div>
                <div class="mt-4 flex flex-wrap items-center gap-2">
                    <x-button><x-icono nombre="check" variante="m" class="h-4 w-4" /> Actualizar</x-button>
                    <x-enlace-boton href="{{ route('retapas.index') }}"><x-icono nombre="x-mark" variante="m" class="h-4 w-4" /> Cancelar</x-enlace-boton>
                </div>
            </form>
        </x-tarjeta>
    </x-pagina>

    @push('scripts')
        <script>
            // Muestra los campos que corresponden al origen: eh = estado de hechos; ws = tabla y campo de Websimex; po = ninguno.
            function Filtrar(sender) {
                if (!sender) return; // sin el combo (usuario que no es de operación E)
                var ver = function (id, si) { document.getElementById(id).style.display = si ? '' : 'none'; };
                ver('CodigoEH', sender.value == 'eh');
                ver('TablaWS', sender.value == 'ws');
                ver('CampoWS', sender.value == 'ws');
            }
            Filtrar(document.getElementById("cboOrigen"));
        </script>
    @endpush
</x-app-layout>