51 lines
3.1 KiB
PHP
51 lines
3.1 KiB
PHP
<div wire:poll.30s>
|
|
<x-topbar :title="__('nav.windows')" :subtitle="__('windows.subtitle')" />
|
|
|
|
<div class="px-5 lg:px-[26px] py-6 flex flex-col gap-5 max-w-[1560px] mx-auto w-full">
|
|
@if ($total === 0)
|
|
<x-panel><p class="text-[13px] text-ink-3 text-center py-6">{{ __('windows.empty') }}</p></x-panel>
|
|
@else
|
|
{{-- summary --}}
|
|
<section class="relative overflow-hidden rounded-card border border-line-soft {{ $open > 0 ? 'bg-warning/10' : 'bg-online/10' }}">
|
|
<span class="absolute inset-y-0 left-0 w-[3px] {{ $open > 0 ? 'bg-warning' : 'bg-online' }}"></span>
|
|
<div class="flex items-center gap-3.5 p-4 pl-5">
|
|
<span class="grid place-items-center w-10 h-10 rounded-lg bg-base/40 {{ $open > 0 ? 'text-warning' : 'text-online' }} shrink-0">
|
|
<x-icon :name="$open > 0 ? 'window' : 'check'" :size="20" />
|
|
</span>
|
|
<div>
|
|
<h2 class="text-[15px] font-bold text-ink">
|
|
{{ $open > 0 ? trans_choice('windows.open_count', $open, ['count' => $open]) : __('windows.all_closed') }}
|
|
</h2>
|
|
<p class="text-[12.5px] text-ink-2">{{ trans_choice('windows.sensor_count', $total, ['count' => $total]) }}</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
@foreach ($groups as $roomName => $sensors)
|
|
<x-panel :title="$roomName">
|
|
<div class="flex flex-col divide-y divide-line-soft -my-1">
|
|
@foreach ($sensors as $sensor)
|
|
@php
|
|
$battery = $sensor->device->entities->firstWhere('type', 'battery');
|
|
$pct = $battery ? (int) data_get($battery->state, 'state.percent', 0) : null;
|
|
@endphp
|
|
<div class="flex items-center gap-3 py-3 first:pt-1 last:pb-1">
|
|
<span class="grid place-items-center w-8 h-8 rounded-lg bg-inset text-ink-2 shrink-0">
|
|
<x-icon :name="$sensor->type === 'motion' ? 'activity' : 'window'" :size="16" />
|
|
</span>
|
|
<a href="{{ route('devices.show', $sensor->device) }}" wire:navigate class="text-[13px] font-semibold text-ink hover:text-accent transition-colors truncate">{{ $sensor->device->name }}</a>
|
|
<div class="ml-auto flex items-center gap-2 shrink-0">
|
|
@if (! is_null($pct))
|
|
<x-status-pill :state="$pct < 20 ? 'offline' : 'neutral'">{{ __('devices.battery') }} · <span class="font-mono">{{ $pct }}%</span></x-status-pill>
|
|
@endif
|
|
<x-entity-state :entity="$sensor" />
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</x-panel>
|
|
@endforeach
|
|
@endif
|
|
</div>
|
|
</div>
|