@php
    $steps[] = [
        'title' => 'Ügyfél',
        'include' => 'order.form.customer',
    ];

    $steps[] = [
        'title' => 'Termékek',
        'include' => 'order.form.products',
    ];

    $steps[] = [
        'title' => 'Vásárlás adatai',
        'include' => 'order.form.order',
    ];
@endphp

<nav>
  <div class="nav nav-tabs" id="nav-tab" role="tablist">
    @foreach ($steps as $step_id => $step_data)
        <button
            class="nav-link @if($step_id == 0 )active @endif"
            id="nav-tab-{{ $step_id }}"
            data-toggle="tab"
            data-target="#nav-{{ $step_id }}"
            type="button"
            role="tab"
            aria-controls="nav-{{ $step_id }}"
            aria-selected="{{ $step_id == 0 ? 'true' : 'false' }}"
        >
            {{ $step_data['title'] }}
        </button>
    @endforeach
  </div>
</nav>
<div class="tab-content" id="nav-tabContent">
    @foreach ($steps as $step_id => $step_data)
        <div
            class="tab-pane fade pt-3 @if($step_id == 0 )show active @endif"
            id="nav-{{ $step_id }}"
            role="tabpanel"
            aria-labelledby="nav-tab-{{ $step_id }}"
        >
            <div>
                @if( isset($step_data['columns']) )
                    @php
                        $columns = $step_data['columns'];
                    @endphp
                    @include('admin.form.index')
                @endif

                @if( isset($step_data['include']) )
                    @include($step_data['include'])
                @endif

                @if ($step_id > 0)
                <button type="button" class="btn btn-secondary" onClick="$('#nav-tab-{{ $step_id - 1 }}').tab('show')">Előző</button>
                @endif

                @if ($step_id < count($steps) - 1 )
                <button type="button" class="btn btn-primary" onClick="$('#nav-tab-{{ $step_id + 1 }}').tab('show')">Következő</button>
                @endif
            </div>
        </div>
    @endforeach
</div>