59 lines
4.1 KiB
PHP
59 lines
4.1 KiB
PHP
<form wire:submit="save">
|
|
<x-modal :title="$editing ? __('persons.edit_title') : __('persons.add_title')" icon="persons">
|
|
<div class="p-5 flex flex-col gap-4">
|
|
{{-- Avatar --}}
|
|
<div class="flex items-center gap-4">
|
|
<div class="relative shrink-0">
|
|
@php $preview = $avatar ? $avatar->temporaryUrl() : $currentAvatarUrl; @endphp
|
|
@if ($preview)
|
|
<img src="{{ $preview }}" alt="" class="w-16 h-16 rounded-full object-cover border border-line-soft">
|
|
@else
|
|
<span class="grid place-items-center w-16 h-16 rounded-full bg-accent/15 text-accent font-bold text-[20px] uppercase">{{ mb_substr($name ?: '?', 0, 1) }}</span>
|
|
@endif
|
|
<div wire:loading wire:target="avatar" class="absolute inset-0 grid place-items-center rounded-full bg-base/70">
|
|
<x-icon name="activity" :size="18" class="text-accent pulse-live" />
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-col gap-1.5">
|
|
<label class="inline-flex items-center gap-1.5 rounded-lg border border-line px-3 py-2 text-[12.5px] font-semibold text-ink-2 hover:text-ink hover:bg-raised transition-colors cursor-pointer w-max">
|
|
<x-icon name="persons" :size="14" /> {{ __('persons.avatar_upload') }}
|
|
<input type="file" wire:model="avatar" accept="image/*" class="hidden">
|
|
</label>
|
|
<span class="text-[11px] text-ink-3">{{ __('persons.avatar_hint') }}</span>
|
|
@error('avatar') <p class="text-[12px] text-offline">{{ $message }}</p> @enderror
|
|
</div>
|
|
</div>
|
|
|
|
<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>
|
|
|
|
<x-slot:footer>
|
|
<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]">{{ $editing ? __('persons.save') : __('persons.add') }}</button>
|
|
</x-slot:footer>
|
|
</x-modal>
|
|
</form>
|