42 lines
2.4 KiB
PHP
42 lines
2.4 KiB
PHP
<div wire:poll.30s>
|
|
<x-topbar :title="__('nav.persons')" :subtitle="__('persons.subtitle')">
|
|
<x-slot:actions>
|
|
<button type="button" wire:click="$dispatch('openModal', { component: 'modals.add-person' })"
|
|
class="inline-flex items-center gap-1.5 rounded-lg bg-accent px-3 py-1.5 text-[12px] font-bold text-base hover:brightness-110 transition-[filter]">
|
|
<x-icon name="plus" :size="15" /> <span class="hidden sm:inline">{{ __('persons.add') }}</span>
|
|
</button>
|
|
</x-slot:actions>
|
|
</x-topbar>
|
|
|
|
<div class="px-5 lg:px-[26px] py-6 flex flex-col gap-5 max-w-[1560px] mx-auto w-full">
|
|
@if ($persons->isEmpty())
|
|
<x-panel>
|
|
<div class="flex flex-col items-center gap-3 py-8 text-center">
|
|
<span class="grid place-items-center w-12 h-12 rounded-xl bg-inset text-ink-3"><x-icon name="persons" :size="24" /></span>
|
|
<div>
|
|
<div class="text-[14px] font-semibold text-ink">{{ __('persons.empty_title') }}</div>
|
|
<div class="text-[12.5px] text-ink-3 mt-1 max-w-sm">{{ __('persons.empty_body') }}</div>
|
|
</div>
|
|
</div>
|
|
</x-panel>
|
|
@else
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 gap-4">
|
|
@foreach ($persons as $person)
|
|
<x-panel>
|
|
<div class="flex items-center gap-3">
|
|
<span class="grid place-items-center w-11 h-11 rounded-full bg-inset text-ink font-bold text-[15px] uppercase">{{ mb_substr($person->name, 0, 1) }}</span>
|
|
<div class="min-w-0">
|
|
<div class="text-[14px] font-bold text-ink truncate">{{ $person->name }}</div>
|
|
<div class="text-[11.5px] text-ink-3">{{ $person->presence_changed_at?->diffForHumans() ?? '—' }}</div>
|
|
</div>
|
|
<x-status-pill :state="$person->isHome() ? 'online' : ($person->presence === 'away' ? 'neutral' : 'warning')" class="ml-auto">
|
|
{{ __('persons.presence_'.$person->presence) }}
|
|
</x-status-pill>
|
|
</div>
|
|
</x-panel>
|
|
@endforeach
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|