<div>
    <form id="form" role="form" wire:submit.prevent="update">
        <div class="card-body">
            <div class="form-row">
                <div class="col">
                    <label for="attributeGroup.name">نام گروه *</label>
                    <input type="text" class="form-control @error('attributeGroup.name') is-invalid @enderror" id="attributeGroup.name"
                           wire:model.defer="attributeGroup.name" required>
                    @error('attributeGroup.name')
                        <span class="text-danger" role="alert">
                            <strong>{{ $message }}</strong>
                        </span>
                    @enderror
                </div>
                <div class="col">
                    <label for="attributeGroup.label">لیبل</label>
                    <input type="text" class="form-control @error('attributeGroup.label') is-invalid @enderror" id="attributeGroup.label"
                           wire:model.defer="attributeGroup.label">
                    @error('attributeGroup.label')
                    <span class="text-danger" role="alert">
                            <strong>{{ $message }}</strong>
                        </span>
                    @enderror
                </div>
                <div class="col">
                    <label for="attributeGroup.sort_order">ترتیب</label>
                    <input type="number" class="form-control @error('attributeGroup.sort_order') is-invalid @enderror" id="attributeGroup.sort_order"
                           wire:model.defer="attributeGroup.sort_order">
                    @error('attributeGroup.sort_order')
                        <span class="text-danger" role="alert">
                            <strong>{{ $message }}</strong>
                        </span>
                    @enderror
                </div>
                <div class="col">
                    <div class="form-group mb-0" wire:ignore>
                        <label for="category_id">دسته‌بندی</label>
                        <select class="form-control @error('category_id') is-invalid @enderror" id="category_id"
                                wire:model.defer="category_id" multiple>
                            @foreach($categories as $category)
                                <option value="{{ $category->id }}">{{ $category->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    @error('category_id')
                        <span class="text-danger" role="alert">
                            <strong>{{ $message }}</strong>
                        </span>
                    @enderror
                </div>
            </div>
            <table class="table table-hover mt-4">
                <thead>
                <tr>
                    <th>ویژگی *</th>
                    <th>برجسته</th>
                    <th>ترتیب</th>
                    <th>عملیات</th>
                </tr>
                </thead>
                <tbody>
                @if(count($attributes))
                    @foreach($attributes as $index => $attribute)
                        <tr>
                            <td>
                                <input type="text" class="form-control @error("attributes.$index.name") is-invalid @enderror" wire:model.defer="attributes.{{$index}}.name" required>
                                @error("attributes.$index.name")
                                <span class="text-danger" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </td>
                            <td>
                                <input type="checkbox" value="1" class="form-check @error("attributes.$index.highlight") is-invalid @enderror" wire:model.defer="attributes.{{$index}}.highlight">
                                @error("attributes.$index.highlight")
                                    <span class="text-danger" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </td>
                            <td>
                                <input type="number" class="form-control @error("attributes.$index.sort_order") is-invalid @enderror" min="0" wire:model.defer="attributes.{{$index}}.sort_order">
                                @error("attributes.$index.sort_order")
                                <span class="text-danger" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </td>
                            <td>
                                <button type="button" class="btn btn-danger btn-sm" wire:click="removeItem({{ $index }})">
                                    <span class="fa fa-trash"></span> حذف
                                </button>
                            </td>
                        </tr>
                    @endforeach
                @endif
                </tbody>
                <tfoot>
                <tr>
                    <td colspan="3"></td>
                    <td>
                        <button type="button" id="add-item" class="btn btn-success btn-sm" wire:click="addItem"><span class="fa fa-plus"></span> افزودن</button>
                    </td>
                </tr>
                </tfoot>
            </table>
        </div>
        <div class="card-footer">
            <button type="submit" class="btn btn-primary">ذخیره</button>
            <a href="{{ route('admin.attribute-groups.index') }}" class="btn btn-danger float-left">لغو</a>
        </div>
    </form>
</div>

@push('scripts')
    @include('livewire.admin.partials.select2', ['selectId' => 'category_id', 'selectVar' => 'category_id'])
@endpush