@csrf
@isset($device)
    @method('PUT')
@endisset

<div>
    <x-input-label for="name" :value="__('Название')" />
    <x-text-input id="name" name="name" type="text" class="mt-1 block w-full"
        :value="old('name', $device->name ?? '')" required autofocus />
    <x-input-error :messages="$errors->get('name')" class="mt-2" />
</div>

<div class="mt-4">
    <x-input-label for="zone_id" :value="__('Зона')" />
    <select id="zone_id" name="zone_id" required
        class="mt-1 block w-full border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm">
        <option value="">{{ __('— выбрать —') }}</option>
        @foreach ($zones as $zone)
            <option value="{{ $zone->id }}" @selected(old('zone_id', $device->zone_id ?? '') == $zone->id)>{{ $zone->name }}</option>
        @endforeach
    </select>
    <x-input-error :messages="$errors->get('zone_id')" class="mt-2" />
</div>

<div class="mt-4">
    <x-input-label for="device_type_id" :value="__('Тип устройства')" />
    <select id="device_type_id" name="device_type_id" required
        class="mt-1 block w-full border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm">
        <option value="">{{ __('— выбрать —') }}</option>
        @foreach ($deviceTypes as $deviceType)
            <option value="{{ $deviceType->id }}" @selected(old('device_type_id', $device->device_type_id ?? '') == $deviceType->id)>
                {{ $deviceType->code }} ({{ $deviceType->category->value }})
            </option>
        @endforeach
    </select>
    <x-input-error :messages="$errors->get('device_type_id')" class="mt-2" />
</div>

<div class="mt-4">
    <x-input-label for="external_id" :value="__('External ID (идентификатор физического устройства)')" />
    <x-text-input id="external_id" name="external_id" type="text" class="mt-1 block w-full font-mono"
        :value="old('external_id', $device->external_id ?? '')" required />
    <x-input-error :messages="$errors->get('external_id')" class="mt-2" />
</div>

<div class="mt-4">
    <x-input-label for="protocol" :value="__('Протокол')" />
    <x-text-input id="protocol" name="protocol" type="text" class="mt-1 block w-full"
        :value="old('protocol', $device->protocol ?? 'mqtt')" required />
    <x-input-error :messages="$errors->get('protocol')" class="mt-2" />
</div>

<div class="mt-4 flex items-center gap-4">
    <x-primary-button>{{ __('Сохранить') }}</x-primary-button>
    <a href="{{ route('devices.index') }}" class="text-sm text-gray-600 hover:underline">{{ __('Отмена') }}</a>
</div>