Add hero sections to Queue index pages and soften analytics cards.
Deploy Ladill Queue / deploy (push) Successful in 36s

Introduce shared x-qms.page-hero with summary stats across queues,
tickets, counters, admin pages, and insights; remove bordered cards on
Analytics, Reports, Feedback, and Branches list views.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
isaacclad
2026-07-06 07:32:10 +00:00
co-authored by Cursor
parent 29bf896f21
commit bf879d6abe
26 changed files with 850 additions and 526 deletions
+45 -36
View File
@@ -1,42 +1,51 @@
<x-app-layout title="Analytics">
<h1 class="mb-6 text-2xl font-semibold">Analytics</h1>
<div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
@foreach ([
'waiting' => 'Waiting now',
'serving' => 'Being served',
'served_today' => 'Served today',
'no_shows_today' => 'No-shows today',
'avg_wait_seconds' => 'Avg wait (sec)',
'appointments_today' => 'Appointments today',
'feedback_avg_30d' => 'Avg rating (30d)',
] as $key => $label)
<div class="rounded-2xl border bg-white p-4 dark:border-slate-700 dark:bg-slate-900">
<div class="text-xs font-semibold uppercase text-slate-500">{{ $label }}</div>
<div class="mt-2 text-2xl font-semibold">{{ $overview[$key] ?? 0 }}</div>
<div class="space-y-6">
<x-qms.page-hero
badge="Live ops · Trends · Performance"
title="Analytics"
description="Real-time queue performance, wait times, and customer satisfaction across your organization."
:stats="[
['value' => number_format($overview['waiting'] ?? 0), 'label' => 'Waiting now'],
['value' => number_format($overview['served_today'] ?? 0), 'label' => 'Served today'],
['value' => $overview['feedback_avg_30d'] ?? '—', 'label' => 'Avg rating (30d)'],
]" />
<div class="grid gap-6 lg:grid-cols-2">
<div class="rounded-2xl bg-white p-6 shadow-sm">
<h2 class="text-sm font-semibold uppercase text-slate-500">14-day trend</h2>
<table class="mt-4 w-full text-sm">
<thead><tr><th class="text-left py-1">Date</th><th class="text-right">Issued</th><th class="text-right">Completed</th></tr></thead>
<tbody>
@foreach ($trend as $day)
<tr class="border-t border-slate-100"><td class="py-1">{{ $day['date'] }}</td><td class="text-right">{{ $day['issued'] }}</td><td class="text-right">{{ $day['completed'] }}</td></tr>
@endforeach
</tbody>
</table>
</div>
<div class="rounded-2xl bg-white p-6 shadow-sm">
<h2 class="text-sm font-semibold uppercase text-slate-500">Busiest queues</h2>
<ul class="mt-4 space-y-2 text-sm">
@forelse ($overview['busiest_queues'] ?? [] as $q)
<li class="flex justify-between"><span>{{ $q['name'] }}</span><span class="font-medium">{{ $q['waiting'] }} waiting</span></li>
@empty
<li class="text-slate-500">No active queues.</li>
@endforelse
</ul>
</div>
@endforeach
</div>
<div class="mt-8 grid gap-6 lg:grid-cols-2">
<div class="rounded-2xl border bg-white p-6 dark:border-slate-700 dark:bg-slate-900">
<h2 class="text-sm font-semibold uppercase text-slate-500">14-day trend</h2>
<table class="mt-4 w-full text-sm">
<thead><tr><th class="text-left py-1">Date</th><th class="text-right">Issued</th><th class="text-right">Completed</th></tr></thead>
<tbody>
@foreach ($trend as $day)
<tr class="border-t"><td class="py-1">{{ $day['date'] }}</td><td class="text-right">{{ $day['issued'] }}</td><td class="text-right">{{ $day['completed'] }}</td></tr>
@endforeach
</tbody>
</table>
</div>
<div class="rounded-2xl border bg-white p-6 dark:border-slate-700 dark:bg-slate-900">
<h2 class="text-sm font-semibold uppercase text-slate-500">Busiest queues</h2>
<ul class="mt-4 space-y-2 text-sm">
@forelse ($overview['busiest_queues'] ?? [] as $q)
<li class="flex justify-between"><span>{{ $q['name'] }}</span><span class="font-medium">{{ $q['waiting'] }} waiting</span></li>
@empty
<li class="text-slate-500">No active queues.</li>
@endforelse
</ul>
<div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
@foreach ([
'serving' => 'Being served',
'no_shows_today' => 'No-shows today',
'avg_wait_seconds' => 'Avg wait (sec)',
'appointments_today' => 'Appointments today',
] as $key => $label)
<div class="rounded-2xl bg-white p-4 shadow-sm">
<div class="text-xs font-semibold uppercase text-slate-500">{{ $label }}</div>
<div class="mt-2 text-2xl font-semibold text-slate-900">{{ $overview[$key] ?? 0 }}</div>
</div>
@endforeach
</div>
</div>
</x-app-layout>