non-booking-time-blockers (nbtb)

This commit is contained in:
2026-03-04 11:38:34 +00:00
parent 861dd11c5b
commit 29b9776a93
12 changed files with 845 additions and 139 deletions
@@ -55,7 +55,10 @@
| 'client_cancelled'
| 'we_cancelled'
| 're-schedule'
| 'no_show';
| 'no_show'
| 'no_deposit';
deposit_required: boolean;
deposit_paid: boolean;
services: Array<{
service_name?: string;
}>;
@@ -434,27 +437,51 @@
return `${dateStr} at ${timeStr}`;
})()}
</div>
<div class="mt-1 flex items-center gap-2 text-xs">
<span
class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium
{booking.status === 'confirmed'
? 'bg-emerald-100 text-emerald-800'
: booking.status === 'pending'
? 'bg-yellow-100 text-yellow-800'
: booking.status === 'completed'
? 'bg-green-100 text-green-800'
: booking.status === 'cancelled' ||
booking.status === 'client_cancelled' ||
booking.status === 'we_cancelled'
? 'bg-red-100 text-red-800'
: 'bg-gray-100 text-gray-800'}"
>
{booking.status}
</span>
<span class="text-gray-500">
{booking.services.map((s) => s.service_name).join(', ')}
</span>
</div>
<div class="mt-1 flex flex-wrap items-center gap-2 text-xs">
<span
class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium
{booking.status === 'confirmed' || booking.status === 'in_progress'
? 'bg-emerald-100 text-emerald-800'
: booking.status === 'pending'
? 'bg-yellow-100 text-yellow-800'
: booking.status === 'completed'
? 'bg-green-100 text-green-800'
: booking.status === 'client_cancelled' ||
booking.status === 'we_cancelled' ||
booking.status === 'no_deposit'
? 'bg-red-100 text-red-800'
: 'bg-gray-100 text-gray-800'}"
>
{booking.status.replace('_', ' ')}
</span>
<!-- Deposit chip: pending = "will require deposit", confirmed+/!paid = "deposit due" -->
{#if booking.deposit_required}
{#if booking.status === 'pending'}
<span
class="inline-flex items-center rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-800"
>
Will Require Deposit
</span>
{:else if (booking.status === 'confirmed' || booking.status === 'in_progress') && !booking.deposit_paid}
<span
class="inline-flex items-center rounded-full bg-orange-100 px-2 py-0.5 text-xs font-medium text-orange-800"
>
Deposit Due
</span>
{:else if booking.deposit_paid}
<span
class="inline-flex items-center rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800"
>
Deposit Paid
</span>
{/if}
{/if}
<span class="text-gray-500">
{booking.services.map((s) => s.service_name).join(', ')}
</span>
</div>
<div class="mt-1 text-sm font-semibold text-gray-900">
£{booking.total_amount.toFixed(2)}
</div>