homeos/resources/views/livewire/discovery/index.blade.php

64 lines
4.1 KiB
PHP

<div wire:poll.15s>
<x-topbar :title="__('nav.network')" :subtitle="__('discovery.subtitle')">
<x-slot:actions>
<button type="button" wire:click="rescan" wire:loading.attr="disabled" wire:target="rescan"
class="inline-flex items-center gap-1.5 rounded-lg border border-line-soft bg-raised px-3 py-1.5 text-[12px] font-semibold text-ink-2 hover:text-ink transition-colors disabled:opacity-60">
<span wire:loading.remove wire:target="rescan"><x-icon name="network" :size="15" /></span>
<span wire:loading wire:target="rescan"><x-icon name="network" :size="15" class="pulse-live" /></span>
{{ __('discovery.rescan') }}
</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 ($rescanning)
<div class="flex items-center gap-2 rounded-lg border border-accent/30 bg-accent/10 px-3.5 py-2.5 text-[12.5px] text-accent">
<x-icon name="network" :size="15" class="pulse-live" /> {{ __('discovery.rescanning') }}
</div>
@endif
<x-panel :title="__('discovery.new_title')">
<x-slot:actions><x-badge :variant="$new->count() > 0 ? 'accent' : 'default'">{{ $new->count() }}</x-badge></x-slot:actions>
@if ($new->isEmpty())
<div class="flex items-center gap-3 py-4 text-ink-3">
<x-icon name="network" :size="18" class="pulse-live" />
<span class="text-[13px]">{{ __('discovery.scanning') }}</span>
</div>
@else
<div class="flex flex-col divide-y divide-line-soft -my-1">
@foreach ($new as $f)
<div class="flex items-center gap-3 py-3 first:pt-1 last:pb-1">
<span class="grid place-items-center w-9 h-9 rounded-lg bg-inset text-accent shrink-0"><x-icon name="devices" :size="17" /></span>
<div class="min-w-0">
<div class="text-[13px] font-semibold text-ink truncate">{{ $f->name ?? $f->identifier }}</div>
<div class="text-[11.5px] text-ink-3 font-mono truncate">{{ $f->source }} · {{ $f->ip ?? $f->identifier }}</div>
</div>
<div class="ml-auto flex items-center gap-2 shrink-0">
<button type="button" wire:click="$dispatch('openModal', { component: 'modals.assign-device', arguments: { finding: @js($f->uuid) } })"
class="rounded-lg bg-accent px-3 py-1.5 text-[12px] font-bold text-base hover:brightness-110 transition-[filter]">{{ __('discovery.assign') }}</button>
<button type="button" wire:click="ignore('{{ $f->uuid }}')"
class="rounded-lg border border-line px-2.5 py-1.5 text-[12px] font-semibold text-ink-3 hover:text-ink transition-colors">{{ __('discovery.ignore') }}</button>
</div>
</div>
@endforeach
</div>
@endif
</x-panel>
@if ($ignored->isNotEmpty())
<x-panel :title="__('discovery.ignored_title')">
<x-slot:actions><x-badge>{{ $ignored->count() }}</x-badge></x-slot:actions>
<div class="flex flex-col divide-y divide-line-soft -my-1">
@foreach ($ignored as $f)
<div class="flex items-center gap-3 py-2.5 first:pt-1 last:pb-1 text-ink-3">
<span class="text-[13px] truncate">{{ $f->name ?? $f->identifier }}</span>
<span class="text-[11px] font-mono truncate">{{ $f->identifier }}</span>
<button type="button" wire:click="unignore('{{ $f->uuid }}')" class="ml-auto text-[12px] font-semibold text-ink-2 hover:text-ink">{{ __('discovery.restore') }}</button>
</div>
@endforeach
</div>
</x-panel>
@endif
</div>
</div>