homeos/resources/views/livewire/modals/add-person.blade.php

42 lines
2.9 KiB
PHP

<div class="flex flex-col">
<header class="flex items-center gap-3 px-5 py-4 border-b border-line-soft">
<span class="grid place-items-center w-9 h-9 rounded-lg bg-accent/10 text-accent shrink-0"><x-icon name="persons" :size="18" /></span>
<h2 class="text-[15px] font-bold text-ink">{{ __('persons.add_title') }}</h2>
<button type="button" wire:click="closeModal" class="ml-auto grid place-items-center w-9 h-9 rounded-lg text-ink-3 hover:bg-raised hover:text-ink transition-colors" aria-label="{{ __('common.close') }}">
<x-icon name="close" :size="18" />
</button>
</header>
<form wire:submit="save" class="p-5 flex flex-col gap-4">
<div class="flex flex-col gap-1.5">
<label for="p-name" class="text-[12px] font-semibold text-ink-2">{{ __('devices.name') }}</label>
<input wire:model="name" id="p-name" type="text" autofocus
class="w-full rounded-lg bg-raised border border-line px-3 py-2.5 text-sm text-ink outline-none focus:border-accent focus:ring-1 focus:ring-accent">
@error('name') <p class="text-[12px] text-offline">{{ $message }}</p> @enderror
</div>
<div class="flex flex-col gap-1.5">
<label for="p-mac" class="text-[12px] font-semibold text-ink-2">{{ __('persons.device') }}</label>
@if ($unifiError)
<p class="text-[12px] text-warning">{{ __('persons.unifi_error') }}</p>
<input wire:model="mac" id="p-mac" type="text" placeholder="aa:bb:cc:dd:ee:ff"
class="w-full rounded-lg bg-raised border border-line px-3 py-2.5 text-sm font-mono text-ink outline-none focus:border-accent focus:ring-1 focus:ring-accent">
@else
<select wire:model="mac" id="p-mac" class="w-full rounded-lg bg-raised border border-line px-3 py-2.5 text-sm text-ink outline-none focus:border-accent">
<option value="">{{ __('persons.pick_client') }}</option>
@foreach ($clientOptions as $o)
<option value="{{ $o['mac'] }}">{{ $o['label'] }} · {{ $o['mac'] }}</option>
@endforeach
</select>
<p class="text-[11.5px] text-ink-3">{{ __('persons.client_hint') }}</p>
@endif
@error('mac') <p class="text-[12px] text-offline">{{ $message }}</p> @enderror
</div>
<div class="flex items-center justify-end gap-2 pt-1">
<button type="button" wire:click="closeModal" class="rounded-lg border border-line px-3.5 py-2 text-[13px] font-semibold text-ink-2 hover:text-ink hover:bg-raised transition-colors">{{ __('common.cancel') }}</button>
<button type="submit" class="rounded-lg bg-accent px-3.5 py-2 text-[13px] font-bold text-base hover:brightness-110 transition-[filter]">{{ __('persons.add') }}</button>
</div>
</form>
</div>