Move Devices under Settings like Branches and Team.
Deploy Ladill POS / deploy (push) Successful in 29s
Deploy Ladill POS / deploy (push) Successful in 29s
Drop Devices from the main sidebar, surface a Devices card on the Settings page, and nest device routes under /settings/devices with legacy redirects.
This commit is contained in:
isaacclad
@@ -1,96 +1,101 @@
|
||||
<x-app-layout title="Edit device">
|
||||
<div class="mx-auto max-w-lg space-y-6">
|
||||
<div>
|
||||
<a href="{{ route('pos.devices.index') }}" class="text-sm font-medium text-slate-500 hover:text-slate-800">← Devices</a>
|
||||
<h1 class="mt-2 text-2xl font-semibold text-slate-900">Edit device</h1>
|
||||
<p class="mt-1 text-sm text-slate-500">{{ $deviceTypes[$device->type] ?? $device->type }} · {{ $device->location?->name ?? 'No branch' }}</p>
|
||||
<x-settings.page description="{{ ($deviceTypes[$device->type] ?? $device->type) }} · {{ $device->location?->name ?? 'No branch' }}">
|
||||
<div class="mb-4 flex flex-wrap items-center gap-1 text-sm text-slate-500">
|
||||
<a href="{{ route('pos.settings') }}" class="hover:text-slate-800">Settings</a>
|
||||
<span class="px-1">/</span>
|
||||
<a href="{{ route('pos.devices.index') }}" class="hover:text-slate-800">Devices</a>
|
||||
<span class="px-1">/</span>
|
||||
<span class="font-medium text-slate-900">{{ $device->name }}</span>
|
||||
</div>
|
||||
|
||||
@if (session('success'))
|
||||
<div class="rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 text-sm text-emerald-800">{{ session('success') }}</div>
|
||||
<div class="mb-4 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 text-sm text-emerald-800">{{ session('success') }}</div>
|
||||
@endif
|
||||
|
||||
<form method="POST" action="{{ route('pos.devices.update', $device) }}"
|
||||
class="space-y-4 rounded-2xl border border-slate-200 bg-white p-6"
|
||||
x-data="{ type: @js(old('type', $device->type)), hints: @js($hints) }">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Name</label>
|
||||
<input type="text" name="name" value="{{ old('name', $device->name) }}" required
|
||||
class="mt-1.5 w-full rounded-xl border-slate-300 text-sm shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Type</label>
|
||||
<select name="type" required x-model="type"
|
||||
class="mt-1.5 w-full rounded-xl border-slate-300 text-sm shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
@foreach ($deviceTypes as $key => $label)
|
||||
<option value="{{ $key }}">{{ $label }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<p class="mt-2 text-xs text-slate-500" x-text="hints[type] || ''"></p>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Status</label>
|
||||
<select name="status"
|
||||
class="mt-1.5 w-full rounded-xl border-slate-300 text-sm shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
@foreach (['online', 'offline', 'maintenance'] as $status)
|
||||
<option value="{{ $status }}" @selected(old('status', $device->status) === $status)>{{ ucfirst($status) }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Branch</label>
|
||||
<select name="location_id"
|
||||
class="mt-1.5 w-full rounded-xl border-slate-300 text-sm shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
<option value="">— Optional / all branches —</option>
|
||||
@foreach ($locations as $location)
|
||||
<option value="{{ $location->id }}" @selected((string) old('location_id', $device->location_id) === (string) $location->id)>
|
||||
{{ $location->name }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
|
||||
@if ($device->device_token)
|
||||
<div class="rounded-xl border border-slate-100 bg-slate-50 p-4">
|
||||
<p class="text-xs font-semibold uppercase tracking-wide text-slate-500">Device token</p>
|
||||
<code class="mt-2 block break-all text-xs text-slate-700">{{ $device->device_token }}</code>
|
||||
@if ($openUrl)
|
||||
<a href="{{ $openUrl }}" target="_blank" rel="noopener"
|
||||
class="mt-3 inline-flex text-sm font-semibold text-indigo-600 hover:text-indigo-800">
|
||||
Open device URL →
|
||||
</a>
|
||||
@endif
|
||||
<p class="mt-2 text-xs text-slate-500">Last online: {{ $device->last_online_at?->diffForHumans() ?? 'Never' }}</p>
|
||||
<x-settings.card title="Edit {{ $device->name }}">
|
||||
<form method="POST" action="{{ route('pos.devices.update', $device) }}"
|
||||
class="space-y-4"
|
||||
x-data="{ type: @js(old('type', $device->type)), hints: @js($hints) }">
|
||||
@csrf
|
||||
@method('PUT')
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Name</label>
|
||||
<input type="text" name="name" value="{{ old('name', $device->name) }}" required
|
||||
class="mt-1.5 w-full rounded-xl border-slate-300 text-sm shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Type</label>
|
||||
<select name="type" required x-model="type"
|
||||
class="mt-1.5 w-full rounded-xl border-slate-300 text-sm shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
@foreach ($deviceTypes as $key => $label)
|
||||
<option value="{{ $key }}">{{ $label }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<p class="mt-2 text-xs text-slate-500" x-text="hints[type] || ''"></p>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Status</label>
|
||||
<select name="status"
|
||||
class="mt-1.5 w-full rounded-xl border-slate-300 text-sm shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
@foreach (['online', 'offline', 'maintenance'] as $status)
|
||||
<option value="{{ $status }}" @selected(old('status', $device->status) === $status)>{{ ucfirst($status) }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700">Branch</label>
|
||||
<select name="location_id"
|
||||
class="mt-1.5 w-full rounded-xl border-slate-300 text-sm shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
<option value="">— Optional / all branches —</option>
|
||||
@foreach ($locations as $location)
|
||||
<option value="{{ $location->id }}" @selected((string) old('location_id', $device->location_id) === (string) $location->id)>
|
||||
{{ $location->name }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="flex gap-3 pt-1">
|
||||
<a href="{{ route('pos.devices.index') }}" class="inline-flex flex-1 items-center justify-center rounded-xl border border-slate-200 px-4 py-2.5 text-sm font-medium text-slate-700 hover:bg-slate-50">Back</a>
|
||||
<button type="submit" class="btn-primary flex-1">Save</button>
|
||||
</div>
|
||||
</form>
|
||||
@if ($device->device_token)
|
||||
<div class="rounded-xl border border-slate-100 bg-slate-50 p-4">
|
||||
<p class="text-xs font-semibold uppercase tracking-wide text-slate-500">Device token</p>
|
||||
<code class="mt-2 block break-all text-xs text-slate-700">{{ $device->device_token }}</code>
|
||||
@if ($openUrl)
|
||||
<a href="{{ $openUrl }}" target="_blank" rel="noopener"
|
||||
class="mt-3 inline-flex text-sm font-semibold text-indigo-600 hover:text-indigo-800">
|
||||
Open device URL →
|
||||
</a>
|
||||
@endif
|
||||
<p class="mt-2 text-xs text-slate-500">Last online: {{ $device->last_online_at?->diffForHumans() ?? 'Never' }}</p>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="space-y-3 rounded-2xl border border-rose-100 bg-white p-5">
|
||||
<p class="text-sm font-semibold text-slate-900">Device actions</p>
|
||||
@if ($device->device_token)
|
||||
<form method="POST" action="{{ route('pos.devices.regenerate-token', $device) }}"
|
||||
onsubmit="return confirm('Regenerate token? Existing display sessions will stop until reopened.');">
|
||||
<div class="flex flex-wrap gap-3 pt-1">
|
||||
<a href="{{ route('pos.settings') }}#devices" class="inline-flex items-center justify-center rounded-xl border border-slate-200 px-4 py-2.5 text-sm font-medium text-slate-700 hover:bg-slate-50">Back</a>
|
||||
<button type="submit" class="btn-primary">Save</button>
|
||||
</div>
|
||||
</form>
|
||||
</x-settings.card>
|
||||
|
||||
<x-settings.card title="Device actions" class="mt-6">
|
||||
<div class="space-y-3">
|
||||
@if ($device->device_token)
|
||||
<form method="POST" action="{{ route('pos.devices.regenerate-token', $device) }}"
|
||||
onsubmit="return confirm('Regenerate token? Existing display sessions will stop until reopened.');">
|
||||
@csrf
|
||||
<button type="submit" class="w-full rounded-xl border border-amber-200 bg-amber-50 px-4 py-2.5 text-sm font-medium text-amber-900 hover:bg-amber-100 sm:w-auto">
|
||||
Regenerate token
|
||||
</button>
|
||||
</form>
|
||||
@endif
|
||||
<form method="POST" action="{{ route('pos.devices.destroy', $device) }}"
|
||||
onsubmit="return confirm('Remove this device?');">
|
||||
@csrf
|
||||
<button type="submit" class="w-full rounded-xl border border-amber-200 bg-amber-50 px-4 py-2.5 text-sm font-medium text-amber-900 hover:bg-amber-100">
|
||||
Regenerate token
|
||||
@method('DELETE')
|
||||
<button type="submit" class="w-full rounded-xl border border-rose-200 bg-rose-50 px-4 py-2.5 text-sm font-medium text-rose-800 hover:bg-rose-100 sm:w-auto">
|
||||
Remove device
|
||||
</button>
|
||||
</form>
|
||||
@endif
|
||||
<form method="POST" action="{{ route('pos.devices.destroy', $device) }}"
|
||||
onsubmit="return confirm('Remove this device?');">
|
||||
@csrf
|
||||
@method('DELETE')
|
||||
<button type="submit" class="w-full rounded-xl border border-rose-200 bg-rose-50 px-4 py-2.5 text-sm font-medium text-rose-800 hover:bg-rose-100">
|
||||
Remove device
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</x-settings.card>
|
||||
</x-settings.page>
|
||||
</x-app-layout>
|
||||
|
||||
Reference in New Issue
Block a user