CRUD зон/устройств/правил автоматизации + RBAC owner/viewer

Policies (ZonePolicy/DevicePolicy/AutomationRulePolicy): не multi-tenant изоляция по user_id, а household-wide RBAC — все авторизованные видят одни и те же данные, только owner может создавать/менять/удалять. user_id на записи — это created_by, а не граница видимости. Form Requests с authorize() через политики; DeviceRequest учитывает unique external_id с ignore на update. AutomationRuleRequest: action_type остаётся строкой (не enum), т.к. это открытый список из device_types.capabilities; для действия set_level в форме есть отдельное поле "level" (Alpine.js переключает его видимость), которое контроллер мапит в action_params — без сырого JSON-редактора для MVP. Контроллеры без show (index+create/edit достаточно), Blade-формы на базе Breeze-компонентов. Навигация и дашборд (счётчики зон/устройств/активных правил) обновлены. Добавлен DemoGrowboxSeeder (демо-зона с датчиком, вентилятором и правилом) и viewer-пользователь в сидер. Восстановлен трейт AuthorizesRequests в базовом Controller (Laravel 11+ убрал его по умолчанию) — нужен для $this->authorize(). Проверено: 33/33 теста (включая новые ZoneControllerTest, AutomationRuleControllerTest — маппинг level→action_params, 403 для viewer), полный CRUD-цикл вживую через браузер под owner (создание зоны, правила с set_level, Alpine-переключение поля "Уровень"), доступ viewer подтверждён как read-only (нет кнопок изменения, прямой заход на /zones/create отдаёт 403).
2026-08-11 16:54:26 +05:00
parent bb492785a4
commit 467a05542c
29 changed files with 1264 additions and 9 deletions
@@ -0,0 +1,116 @@
+@csrf
+@isset($rule)
+    @method('PUT')
+@endisset
+
+<div x-data="{ actionType: '{{ old('action_type', $rule->action_type ?? '') }}' }">
+    <div>
+        <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', $rule->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="condition_source_device_id" :value="__('Устройство-источник показания')" />
+        <select id="condition_source_device_id" name="condition_source_device_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 ($devices as $device)
+                <option value="{{ $device->id }}" @selected(old('condition_source_device_id', $rule->condition_source_device_id ?? '') == $device->id)>
+                    {{ $device->zone->name }} — {{ $device->name }} ({{ $device->deviceType->code }})
+                </option>
+            @endforeach
+        </select>
+        <x-input-error :messages="$errors->get('condition_source_device_id')" class="mt-2" />
+    </div>
+
+    <div class="mt-4 grid grid-cols-3 gap-4">
+        <div>
+            <x-input-label for="condition_sensor_type" :value="__('Тип показания')" />
+            <input list="sensor-types" id="condition_sensor_type" name="condition_sensor_type" type="text"
+                value="{{ old('condition_sensor_type', $rule->condition_sensor_type ?? '') }}" required
+                class="mt-1 block w-full border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm" />
+            <datalist id="sensor-types">
+                @foreach ($sensorTypeOptions as $option)
+                    <option value="{{ $option }}"></option>
+                @endforeach
+            </datalist>
+            <x-input-error :messages="$errors->get('condition_sensor_type')" class="mt-2" />
+        </div>
+
+        <div>
+            <x-input-label for="condition_operator" :value="__('Оператор')" />
+            <select id="condition_operator" name="condition_operator" required
+                class="mt-1 block w-full border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm">
+                @foreach (\App\Enums\ConditionOperator::cases() as $operator)
+                    <option value="{{ $operator->value }}" @selected(old('condition_operator', $rule->condition_operator->value ?? '') == $operator->value)>
+                        {{ $operator->value }}
+                    </option>
+                @endforeach
+            </select>
+            <x-input-error :messages="$errors->get('condition_operator')" class="mt-2" />
+        </div>
+
+        <div>
+            <x-input-label for="condition_value" :value="__('Порог')" />
+            <x-text-input id="condition_value" name="condition_value" type="number" step="any" class="mt-1 block w-full"
+                :value="old('condition_value', $rule->condition_value ?? '')" required />
+            <x-input-error :messages="$errors->get('condition_value')" class="mt-2" />
+        </div>
+    </div>
+
+    <div class="mt-4">
+        <x-input-label for="target_device_id" :value="__('Устройство-исполнитель')" />
+        <select id="target_device_id" name="target_device_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 ($devices as $device)
+                <option value="{{ $device->id }}" @selected(old('target_device_id', $rule->target_device_id ?? '') == $device->id)>
+                    {{ $device->zone->name }} — {{ $device->name }} ({{ $device->deviceType->code }})
+                </option>
+            @endforeach
+        </select>
+        <x-input-error :messages="$errors->get('target_device_id')" class="mt-2" />
+    </div>
+
+    <div class="mt-4 grid grid-cols-2 gap-4">
+        <div>
+            <x-input-label for="action_type" :value="__('Действие')" />
+            <select id="action_type" name="action_type" required x-model="actionType"
+                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 ($actionTypeOptions as $option)
+                    <option value="{{ $option }}">{{ $option }}</option>
+                @endforeach
+            </select>
+            <x-input-error :messages="$errors->get('action_type')" class="mt-2" />
+        </div>
+
+        <div x-show="actionType === 'set_level'">
+            <x-input-label for="level" :value="__('Уровень')" />
+            <x-text-input id="level" name="level" type="number" step="any" class="mt-1 block w-full"
+                :value="old('level', $rule->action_params['level'] ?? '')" />
+            <x-input-error :messages="$errors->get('level')" class="mt-2" />
+        </div>
+    </div>
+
+    <div class="mt-4">
+        <label class="inline-flex items-center">
+            <input type="hidden" name="is_active" value="0">
+            <input type="checkbox" name="is_active" value="1" class="rounded border-gray-300 text-indigo-600 shadow-sm"
+                @checked(old('is_active', $rule->is_active ?? true))>
+            <span class="ms-2 text-sm text-gray-600">{{ __('Правило активно') }}</span>
+        </label>
+    </div>
+
+    <div class="mt-4 flex items-center gap-4">
+        <x-primary-button>{{ __('Сохранить') }}</x-primary-button>
+        <a href="{{ route('automation-rules.index') }}" class="text-sm text-gray-600 hover:underline">{{ __('Отмена') }}</a>
+    </div>
+</div>
@@ -0,0 +1,15 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 leading-tight">{{ __('Новое правило автоматизации') }}</h2>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-2xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
+                <form method="POST" action="{{ route('automation-rules.store') }}">
+                    @include('automation-rules._form')
+                </form>
+            </div>
+        </div>
+    </div>
+</x-app-layout>
@@ -0,0 +1,15 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 leading-tight">{{ __('Изменить правило автоматизации') }}</h2>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-2xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
+                <form method="POST" action="{{ route('automation-rules.update', $rule) }}">
+                    @include('automation-rules._form')
+                </form>
+            </div>
+        </div>
+    </div>
+</x-app-layout>
@@ -0,0 +1,72 @@
+<x-app-layout>
+    <x-slot name="header">
+        <div class="flex justify-between items-center">
+            <h2 class="font-semibold text-xl text-gray-800 leading-tight">
+                {{ __('Правила автоматизации') }}
+            </h2>
+            @can('create', \App\Models\AutomationRule::class)
+                <x-primary-button onclick="window.location='{{ route('automation-rules.create') }}'">
+                    {{ __('Добавить правило') }}
+                </x-primary-button>
+            @endcan
+        </div>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
+                @if (session('status'))
+                    <div class="mb-4 text-sm text-green-600">{{ session('status') }}</div>
+                @endif
+
+                <table class="w-full text-left text-sm">
+                    <thead>
+                        <tr class="border-b">
+                            <th class="py-2">{{ __('Зона') }}</th>
+                            <th class="py-2">{{ __('Условие') }}</th>
+                            <th class="py-2">{{ __('Действие') }}</th>
+                            <th class="py-2">{{ __('Активно') }}</th>
+                            <th class="py-2"></th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        @forelse ($rules as $rule)
+                            <tr class="border-b">
+                                <td class="py-2">{{ $rule->zone->name }}</td>
+                                <td class="py-2">
+                                    {{ $rule->conditionSourceDevice->name }}:
+                                    {{ $rule->condition_sensor_type }}
+                                    {{ $rule->condition_operator->value }}
+                                    {{ $rule->condition_value }}
+                                </td>
+                                <td class="py-2">
+                                    {{ $rule->targetDevice->name }}: {{ $rule->action_type }}
+                                    @if (!empty($rule->action_params))
+                                        ({{ json_encode($rule->action_params) }})
+                                    @endif
+                                </td>
+                                <td class="py-2">{{ $rule->is_active ? __('да') : __('нет') }}</td>
+                                <td class="py-2 text-right space-x-2">
+                                    @can('update', $rule)
+                                        <a href="{{ route('automation-rules.edit', $rule) }}" class="text-indigo-600 hover:underline">{{ __('Изменить') }}</a>
+                                    @endcan
+                                    @can('delete', $rule)
+                                        <form method="POST" action="{{ route('automation-rules.destroy', $rule) }}" class="inline" onsubmit="return confirm('{{ __('Удалить правило?') }}')">
+                                            @csrf
+                                            @method('DELETE')
+                                            <button type="submit" class="text-red-600 hover:underline">{{ __('Удалить') }}</button>
+                                        </form>
+                                    @endcan
+                                </td>
+                            </tr>
+                        @empty
+                            <tr>
+                                <td colspan="5" class="py-4 text-gray-500">{{ __('Правил пока нет.') }}</td>
+                            </tr>
+                        @endforelse
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+</x-app-layout>
@@ -6,12 +6,19 @@
    </x-slot>

    <div class="py-12">
-        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
-            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
-                <div class="p-6 text-gray-900">
-                    {{ __("You're logged in!") }}
-                </div>
-            </div>
+        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8 grid grid-cols-1 sm:grid-cols-3 gap-6">
+            <a href="{{ route('zones.index') }}" class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6 hover:shadow-md transition">
+                <div class="text-sm text-gray-500">{{ __('Зоны') }}</div>
+                <div class="text-3xl font-semibold text-gray-900">{{ $zonesCount }}</div>
+            </a>
+            <a href="{{ route('devices.index') }}" class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6 hover:shadow-md transition">
+                <div class="text-sm text-gray-500">{{ __('Устройства') }}</div>
+                <div class="text-3xl font-semibold text-gray-900">{{ $devicesCount }}</div>
+            </a>
+            <a href="{{ route('automation-rules.index') }}" class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6 hover:shadow-md transition">
+                <div class="text-sm text-gray-500">{{ __('Активных правил') }}</div>
+                <div class="text-3xl font-semibold text-gray-900">{{ $activeRulesCount }}</div>
+            </a>
        </div>
    </div>
 </x-app-layout>
@@ -0,0 +1,56 @@
+@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>
@@ -0,0 +1,15 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 leading-tight">{{ __('Новое устройство') }}</h2>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
+                <form method="POST" action="{{ route('devices.store') }}">
+                    @include('devices._form')
+                </form>
+            </div>
+        </div>
+    </div>
+</x-app-layout>
@@ -0,0 +1,15 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 leading-tight">{{ __('Изменить устройство') }}</h2>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
+                <form method="POST" action="{{ route('devices.update', $device) }}">
+                    @include('devices._form')
+                </form>
+            </div>
+        </div>
+    </div>
+</x-app-layout>
@@ -0,0 +1,64 @@
+<x-app-layout>
+    <x-slot name="header">
+        <div class="flex justify-between items-center">
+            <h2 class="font-semibold text-xl text-gray-800 leading-tight">
+                {{ __('Устройства') }}
+            </h2>
+            @can('create', \App\Models\Device::class)
+                <x-primary-button onclick="window.location='{{ route('devices.create') }}'">
+                    {{ __('Добавить устройство') }}
+                </x-primary-button>
+            @endcan
+        </div>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
+                @if (session('status'))
+                    <div class="mb-4 text-sm text-green-600">{{ session('status') }}</div>
+                @endif
+
+                <table class="w-full text-left text-sm">
+                    <thead>
+                        <tr class="border-b">
+                            <th class="py-2">{{ __('Название') }}</th>
+                            <th class="py-2">{{ __('Зона') }}</th>
+                            <th class="py-2">{{ __('Тип') }}</th>
+                            <th class="py-2">{{ __('External ID') }}</th>
+                            <th class="py-2">{{ __('Протокол') }}</th>
+                            <th class="py-2"></th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        @forelse ($devices as $device)
+                            <tr class="border-b">
+                                <td class="py-2">{{ $device->name }}</td>
+                                <td class="py-2">{{ $device->zone->name }}</td>
+                                <td class="py-2">{{ $device->deviceType->code }}</td>
+                                <td class="py-2 font-mono text-xs">{{ $device->external_id }}</td>
+                                <td class="py-2">{{ $device->protocol }}</td>
+                                <td class="py-2 text-right space-x-2">
+                                    @can('update', $device)
+                                        <a href="{{ route('devices.edit', $device) }}" class="text-indigo-600 hover:underline">{{ __('Изменить') }}</a>
+                                    @endcan
+                                    @can('delete', $device)
+                                        <form method="POST" action="{{ route('devices.destroy', $device) }}" class="inline" onsubmit="return confirm('{{ __('Удалить устройство?') }}')">
+                                            @csrf
+                                            @method('DELETE')
+                                            <button type="submit" class="text-red-600 hover:underline">{{ __('Удалить') }}</button>
+                                        </form>
+                                    @endcan
+                                </td>
+                            </tr>
+                        @empty
+                            <tr>
+                                <td colspan="6" class="py-4 text-gray-500">{{ __('Устройств пока нет.') }}</td>
+                            </tr>
+                        @endforelse
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+</x-app-layout>
@@ -15,6 +15,15 @@
                    <x-nav-link :href="route('dashboard')" :active="request()->routeIs('dashboard')">
                        {{ __('Dashboard') }}
                    </x-nav-link>
+                    <x-nav-link :href="route('zones.index')" :active="request()->routeIs('zones.*')">
+                        {{ __('Зоны') }}
+                    </x-nav-link>
+                    <x-nav-link :href="route('devices.index')" :active="request()->routeIs('devices.*')">
+                        {{ __('Устройства') }}
+                    </x-nav-link>
+                    <x-nav-link :href="route('automation-rules.index')" :active="request()->routeIs('automation-rules.*')">
+                        {{ __('Правила') }}
+                    </x-nav-link>
                </div>
            </div>

@@ -70,6 +79,15 @@
            <x-responsive-nav-link :href="route('dashboard')" :active="request()->routeIs('dashboard')">
                {{ __('Dashboard') }}
            </x-responsive-nav-link>
+            <x-responsive-nav-link :href="route('zones.index')" :active="request()->routeIs('zones.*')">
+                {{ __('Зоны') }}
+            </x-responsive-nav-link>
+            <x-responsive-nav-link :href="route('devices.index')" :active="request()->routeIs('devices.*')">
+                {{ __('Устройства') }}
+            </x-responsive-nav-link>
+            <x-responsive-nav-link :href="route('automation-rules.index')" :active="request()->routeIs('automation-rules.*')">
+                {{ __('Правила') }}
+            </x-responsive-nav-link>
        </div>

        <!-- Responsive Settings Options -->
@@ -0,0 +1,23 @@
+@csrf
+@isset($zone)
+    @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', $zone->name ?? '')" required autofocus />
+    <x-input-error :messages="$errors->get('name')" class="mt-2" />
+</div>
+
+<div class="mt-4">
+    <x-input-label for="description" :value="__('Описание')" />
+    <textarea id="description" name="description" rows="3"
+        class="mt-1 block w-full border-gray-300 focus:border-indigo-500 focus:ring-indigo-500 rounded-md shadow-sm">{{ old('description', $zone->description ?? '') }}</textarea>
+    <x-input-error :messages="$errors->get('description')" class="mt-2" />
+</div>
+
+<div class="mt-4 flex items-center gap-4">
+    <x-primary-button>{{ __('Сохранить') }}</x-primary-button>
+    <a href="{{ route('zones.index') }}" class="text-sm text-gray-600 hover:underline">{{ __('Отмена') }}</a>
+</div>
@@ -0,0 +1,15 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 leading-tight">{{ __('Новая зона') }}</h2>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
+                <form method="POST" action="{{ route('zones.store') }}">
+                    @include('zones._form')
+                </form>
+            </div>
+        </div>
+    </div>
+</x-app-layout>
@@ -0,0 +1,15 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 leading-tight">{{ __('Изменить зону') }}</h2>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
+                <form method="POST" action="{{ route('zones.update', $zone) }}">
+                    @include('zones._form')
+                </form>
+            </div>
+        </div>
+    </div>
+</x-app-layout>
@@ -0,0 +1,60 @@
+<x-app-layout>
+    <x-slot name="header">
+        <div class="flex justify-between items-center">
+            <h2 class="font-semibold text-xl text-gray-800 leading-tight">
+                {{ __('Зоны') }}
+            </h2>
+            @can('create', \App\Models\Zone::class)
+                <x-primary-button onclick="window.location='{{ route('zones.create') }}'">
+                    {{ __('Добавить зону') }}
+                </x-primary-button>
+            @endcan
+        </div>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg p-6">
+                @if (session('status'))
+                    <div class="mb-4 text-sm text-green-600">{{ session('status') }}</div>
+                @endif
+
+                <table class="w-full text-left text-sm">
+                    <thead>
+                        <tr class="border-b">
+                            <th class="py-2">{{ __('Название') }}</th>
+                            <th class="py-2">{{ __('Описание') }}</th>
+                            <th class="py-2">{{ __('Устройств') }}</th>
+                            <th class="py-2"></th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        @forelse ($zones as $zone)
+                            <tr class="border-b">
+                                <td class="py-2">{{ $zone->name }}</td>
+                                <td class="py-2 text-gray-500">{{ $zone->description }}</td>
+                                <td class="py-2">{{ $zone->devices_count }}</td>
+                                <td class="py-2 text-right space-x-2">
+                                    @can('update', $zone)
+                                        <a href="{{ route('zones.edit', $zone) }}" class="text-indigo-600 hover:underline">{{ __('Изменить') }}</a>
+                                    @endcan
+                                    @can('delete', $zone)
+                                        <form method="POST" action="{{ route('zones.destroy', $zone) }}" class="inline" onsubmit="return confirm('{{ __('Удалить зону?') }}')">
+                                            @csrf
+                                            @method('DELETE')
+                                            <button type="submit" class="text-red-600 hover:underline">{{ __('Удалить') }}</button>
+                                        </form>
+                                    @endcan
+                                </td>
+                            </tr>
+                        @empty
+                            <tr>
+                                <td colspan="4" class="py-4 text-gray-500">{{ __('Зон пока нет.') }}</td>
+                            </tr>
+                        @endforelse
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+</x-app-layout>