@include('livewire.tenant.common.modalHead')

<div class="row">

    <div class="col-sm-12">
        <div class="form-group input-group">
            <div class="input-group-prepend">
                <span class="input-group-text">
                    <span class="far fa-edit"></span>
                </span>
            </div>
            <input type="text" wire:model.blur='name' class="form-control" placeholder="ej: Bebidas">
        </div>
        @error('name')
            <span class="text-danger er">{{ $message }}</span>
        @enderror
    </div>
    <div class="col-sm-12">
        <div class="form-group">
            <select wire:model.live='principal' class="form-control form-control-sm">
                <option value="">Sin Categoría Padre</option>
                @foreach ($allCategories as $allCategory)
                    <option value="{{ $allCategory->id }}">{{ $allCategory->name }}</option>
                @endforeach
            </select>
        </div>
        @error('principal')
            <span class="text-danger er">{{ $message }}</span>
        @enderror
    </div>
    <div class="col-sm-12">
        <div class="form-group">
            <select wire:model.live='status' class="form-control form-control-sm">
                <option value="">Seleccionar status</option>
                <option value="Activada">Activada</option>
                <option value="Opción">Opción</option>
                <option value="Desactivada">Desactivada</option>
            </select>
        </div>
        @error('status')
            <span class="text-danger er">{{ $message }}</span>
        @enderror
    </div>

    <div class="col-sm-12 mt-3">
        <div class="form-group custom-file">
            <input type="file" class="custom-file-input" wire:model.live='image'
                accept="image/x-png, image/gif, image/jpeg">
            <label class="custom-file-label">Imágen {{ $image }}</label>
        </div>
        @error('image')
            <span class="text-danger er">{{ $message }}</span>
        @enderror
    </div>
</div>


@include('livewire.tenant.common.modalFooter')