39 lines
2.2 KiB
PHP
39 lines
2.2 KiB
PHP
<div wire:poll.30s>
|
|
<x-topbar :title="$room->name" :subtitle="__('nav.rooms')">
|
|
<x-slot:actions>
|
|
<a href="{{ route('rooms.index') }}" wire:navigate
|
|
class="inline-flex items-center gap-1.5 rounded-lg border border-line-soft bg-raised px-2.5 py-1.5 text-[12px] font-semibold text-ink-2 hover:text-ink transition-colors">
|
|
<x-icon name="chevron" :size="14" class="rotate-180" />
|
|
<span class="hidden sm:inline">{{ __('nav.rooms') }}</span>
|
|
</a>
|
|
</x-slot:actions>
|
|
</x-topbar>
|
|
|
|
<div class="px-5 lg:px-[26px] py-6 flex flex-col gap-4 max-w-[1560px] mx-auto w-full">
|
|
@forelse ($room->devices as $device)
|
|
<x-panel>
|
|
<div class="flex flex-col gap-3">
|
|
<div class="flex items-center gap-2.5">
|
|
<x-status-dot :state="$device->isOnline() ? 'online' : 'offline'" :pulse="$device->isOnline()" />
|
|
<a href="{{ route('devices.show', $device) }}" wire:navigate class="text-[14px] font-bold text-ink hover:text-accent transition-colors truncate">{{ $device->name }}</a>
|
|
<span class="ml-auto text-[11px] font-mono text-ink-3 truncate">{{ $device->model }}</span>
|
|
</div>
|
|
<div class="flex flex-wrap items-center gap-x-3 gap-y-2">
|
|
@foreach ($device->entities as $entity)
|
|
<div class="flex items-center gap-2">
|
|
<x-entity-state :entity="$entity" />
|
|
@if (in_array($entity->type, ['switch', 'light']))
|
|
<x-toggle :on="(bool) data_get($entity->state?->state, 'on', false)"
|
|
wire:click="toggleEntity({{ $entity->id }})" :label="$entity->name ?? $entity->key" />
|
|
@endif
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</x-panel>
|
|
@empty
|
|
<x-panel><p class="text-[13px] text-ink-3 text-center py-6">{{ __('rooms.no_devices') }}</p></x-panel>
|
|
@endforelse
|
|
</div>
|
|
</div>
|