@extends('layouts.secundario.create')

@section('fields')

    @php
        $config = $model->configuracao;
        $lista = old('lista', $config?->lista ?? []) ?? [];
        $campoArquivo = $model->campoArquivo ?? $model->campoArquivo()->getRelated();
    @endphp

    <x-form.monta-campos
        :route="$acao->slug"
        :registro="$model"
        :editar="isset($editar) ? $model : null"
        :uniqidOffcanvas="$uniqid ?? null">
    </x-form.monta-campos>

    <div class="soel-form-field col-2 mt-2">
        <x-form.inputs.number
            name="configuracao[largura]"
            :value="$config?->largura ?? null"
            label="Largura (col)"
            :required="true">
        </x-form.inputs.number>
    </div>

    <div class="soel-form-field col-2 mt-2">
        <x-form.inputs.number
            name="configuracao[larguraGrid]"
            :value="$config?->larguraGrid ?? null"
            label="Largura no Grid (rem)"
            :required="false">
        </x-form.inputs.number>
    </div>

    <div id="divValorDefault" class="soel-form-field col-2 mt-2">
        <x-form.inputs.text
            name="configuracao[valorDefault]"
            :value="$config?->valorDefault ?? null"
            label="Valor Default"
            :required="false">
        </x-form.inputs.text>
    </div>

    <div id="divDescricao" class="soel-form-field col-4 mt-2">
        <x-form.inputs.textarea
            name="configuracao[descricao]"
            :value="$config?->descricao ?? null"
            customClass="descricao"
            label="Descrição"
            rows="1"
            :required="false">
        </x-form.inputs.textarea>
    </div>

    <div id="divObrigatorio" class="soel-form-field col-auto mt-2 d-flex align-items-end mb-1">
        <x-form.inputs.checkbox
            name="configuracao[obrigatorio]"
            :checked="$config?->obrigatorio ?? 0"
            label="Obrigatório"
            :required="false">
        </x-form.inputs.checkbox>
    </div>

    <div id="divFiltravel" class="soel-form-field col-auto mt-2 d-flex align-items-end mb-1">
        <x-form.inputs.checkbox
            name="configuracao[filtravel]"
            :checked="$config?->filtravel ?? 0"
            label="Filtrável"
            :required="false">
        </x-form.inputs.checkbox>
    </div>

    <div id="divVisivelConsulta" class="soel-form-field col-auto mt-2 d-flex align-items-end mb-1">
        <x-form.inputs.checkbox
            name="configuracao[visivel_consulta]"
            :checked="$config?->visivel_consulta ?? 0"
            label="Visível na Consulta"
            :required="false">
        </x-form.inputs.checkbox>
    </div>

    <div id="divInputMinimo" class="soel-form-field col-2 mt-2" style="{{ $config?->minimo ? '' : 'diplay: none;' }}">
        <x-form.inputs.number
            name="configuracao[minimo]"
            :value="$config?->minimo ?? null"
            label="Mínimo"
            :required="false">
        </x-form.inputs.number>
    </div>

    <div id="divInputMaximo" class="soel-form-field col-2 mt-2" style="{{ $config?->maximo ? '' : 'diplay: none;' }}">
        <x-form.inputs.number
            name="configuracao[maximo]"
            :value="$config?->maximo ?? null"
            label="Máximo"
            :required="false">
        </x-form.inputs.number>
    </div>

    <div id="divInputDecimais" class="soel-form-field col-2 mt-2" style="{{ $config?->decimais ? '' : 'diplay: none;' }}">
        <x-form.inputs.number
            name="configuracao[decimais]"
            :value="$config?->decimais ?? null"
            label="Decimais"
            :required="false">
        </x-form.inputs.number>
    </div>

    <div class="col-12">
        <div class="row">
            <x-repeater.repeater
                id="lista"
                name="configuracao[lista]"
                title="Itens da Lista"
                labelButtonAdd="Adicionar Item"
                customClass="col-12 {{ count($lista) == 0 ? 'd-none' : ''}}"
                linhasIniciais="1">

                @php
                    $header = [
                        ['titulo' => 'Valor', 'tamanho' => 3, 'obrigatorio' => true],
                        ['titulo' => 'Descrição', 'tamanho' => 5, 'obrigatorio' => true],
                        ['titulo' => 'Ordem', 'tamanho' => 2, 'obrigatorio' => false],
                        ['titulo' => 'Situação', 'tamanho' => 2, 'obrigatorio' => true]
                ];
                @endphp

                <x-repeater.repeater-header :colunas="$header"></x-repeater.repeater-header>

                @forelse($lista as $itemLista)
                    <x-repeater.repeater-item>
                        <div class="row">
                            <div class="soel-form-field col-3">
                                <x-form.inputs.text
                                    name="slug"
                                    :value="old('lista') ? ($itemLista['slug'] ?? '') : $itemLista->slug"
                                    :required="true">
                                </x-form.inputs.text>
                            </div>
                            <div class="soel-form-field col-5">
                                <x-form.inputs.text
                                    name="descricao"
                                    :value="old('lista') ? ($itemLista['descricao'] ?? '') : $itemLista->descricao"
                                    :required="true">
                                </x-form.inputs.text>
                            </div>
                            <div class="soel-form-field col-2">
                                <x-form.inputs.number
                                    name="ordem"
                                    :value="old('lista') ? ($itemLista['ordem'] ?? '') : $itemLista->ordem"
                                    :required="false"
                                    :customClass="\App\Structural\Enums\Tipagem::INTEIRO->value">
                                </x-form.inputs.number>
                            </div>
                            <div class="soel-form-field col-2">
                                <x-form.inputs.select
                                    name="situacao"
                                    :value="old('lista') ? ($itemLista['situacao'] ?? '') : $itemLista->situacao"
                                    :required="true"
                                    :options="\App\Structural\Enums\Situacao::valuesAssociative(true)">
                                </x-form.inputs.select>
                            </div>
                        </div>
                    </x-repeater.repeater-item>
                @empty
                    <x-repeater.repeater-item>
                        <div class="row">
                            <div class="soel-form-field col-3">
                                <x-form.inputs.text
                                    name="slug"
                                    :required="true">
                                </x-form.inputs.text>
                            </div>
                            <div class="soel-form-field col-5">
                                <x-form.inputs.text
                                    name="descricao"
                                    :required="true">
                                </x-form.inputs.text>
                            </div>
                            <div class="soel-form-field col-2">
                                <x-form.inputs.number
                                    name="ordem"
                                    :required="false"
                                    :customClass="\App\Structural\Enums\Tipagem::INTEIRO->value">
                                </x-form.inputs.number>
                            </div>
                            <div class="soel-form-field col-2">
                                <x-form.inputs.select
                                    name="situacao"
                                    :required="true"
                                    :options="\App\Structural\Enums\Situacao::valuesAssociative(true)">
                                </x-form.inputs.select>
                            </div>
                        </div>
                    </x-repeater.repeater-item>
                @endforelse
            </x-repeater.repeater>
        </div>
    </div>

    <div class="col-12 mt-3 config-arquivo @if(!$model->campo_arquivo_id) d-none @endif">
        <div class="card">
            <div class="card-body">
                <h5>Configurações de Arquivo</h5>
                <hr>
                <div class="row">
                    @foreach ($campoArquivo->getCampos() as $nome => $campo)
                        @if (in_array($nome, ['descricao', 'slug'])) @continue @endif
                        @php
                            $campo = $campoArquivo->getCampoByName($nome) ?? $campo;
                            $campo->setCampo('campo_arquivo['.$campo->getCampo().']');
                            $campo->getInputOptions()->setValorDefault($campoArquivo->$nome);
                        @endphp
                        <x-form.monta-campo
                            :route="$acao->slug"
                            :coluna="$campo"
                            :registro="$campoArquivo">
                        </x-form.monta-campo>
                    @endforeach

                    @include('recurso.campo_arquivo.config-fields', ['model' => $campoArquivo, 'array' => 'campo_arquivo'])
                </div>
            </div>
        </div>
    </div>

    <script src="{{ asset('/js/comportamento/campodinamico.js') }}" type="module"></script>

@endsection