License Key Required
No license key entered.
Enter or update your key with php artisan health:license <key>,
or purchase one at scriptgain.com.
Receipt
site.pay.receipt
Status
Shipped Default
Shipped File
resources/views/site/pay/receipt.blade.php
Open The Live Page
Compiled PHP
What Blade turns your template into. This is what the syntax check parses.
Loading…Available Variables And Components
A guide to what this template can use, derived from the shipped source. Click any item to insert it at your cursor. It is a helpful reference, not a runtime guarantee.
Always Available
Shared with every public page by the site layout.- Validation error bag. Always present. Pairs with @error('field').
- All site settings as an array, e.g. $site['site_name'].
- The school's short display name.
- The full legal name, e.g. "City Of Springfield".
- Main navigation items. Loop over it with @foreach.
- The small utility links in the top bar.
- The footer navigation links.
- The Quick Links grid items.
- The first few Quick Links, featured in the hero.
- The current emergency alert, or null when none is live.
- Up to eight departments listed in the footer.
- The configured page-width class, e.g. max-w-7xl. Use on your outer container.
- The current year, for the footer copyright line.
- URL of the uploaded site logo, or null.
- URL of the uploaded favicon, or null.
In This Template
- Bill.
- Is Test Mode.
- Payment.
- Support Email.
- Support Phone.
Drop any of these in. Click to insert the opening tag at your cursor.
General
Admin Panel
Layouts
Records
Site (Public)
Common Blade
- Print a value, safely escaped. The default choice.
- Print raw HTML. Only for content you trust.
- Show something conditionally.
- Loop over a collection.
- Loop, with a fallback when the collection is empty.
- Show a validation message for a field.
- A small block of PHP. Never on line 1. Keep logic out of templates.
- A comment that never reaches the browser.
Civic Helpers
- Build a URL to a named route, e.g. a department page.
- Link to a single news post.
- Turn a stored upload path into a public URL.
- A cache-busted URL for a bundled asset.
- Read a config value, e.g. the site width class.
- Build an absolute URL to a path.
No History Yet
Every save, revert, and reset of this template is recorded here, with a one-click way back to any of them.
The Template That Shipped With The Product
Read only. This is what Reset To Default puts back.
<x-layouts.public title="Payment Receipt">
@if ($isTestMode)
<x-site.test-mode-banner />
@endif
<x-site.page-hero title="Payment Receipt"
eyebrow="Online Payments"
icon="check-circle"
:crumbs="[['label' => 'Pay Your Bill', 'href' => route('site.pay.index')], ['label' => 'Receipt']]" />
<x-site.section :divider="false">
<div class="mx-auto max-w-2xl">
{{-- Outcome banner. Pending is a real, expected state: the card
processor confirms out of band and can take a few seconds. --}}
@if ($payment->status === 'succeeded' || $payment->status === 'partially_refunded')
<div role="status" class="mb-6 flex items-start gap-4 rounded-2xl bg-emerald-50 p-6 ring-1 ring-emerald-200">
<span class="inline-flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-white text-emerald-600 ring-1 ring-emerald-200">
<x-icon name="check-circle" class="w-6 h-6" aria-hidden="true" />
</span>
<div class="min-w-0">
<h2 class="text-lg font-semibold text-emerald-900">Payment Received. Thank You.</h2>
<p class="mt-1 text-sm leading-relaxed text-emerald-800">
Your payment of <span class="font-semibold">{{ $payment->amountFormatted() }}</span> went through.
Keep the reference below as your proof of payment.
</p>
</div>
</div>
@elseif ($payment->status === 'pending')
<div role="status" class="mb-6 flex items-start gap-4 rounded-2xl bg-amber-50 p-6 ring-1 ring-amber-200">
<span class="inline-flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-white text-amber-600 ring-1 ring-amber-200">
<x-icon name="clock" class="w-6 h-6" aria-hidden="true" />
</span>
<div class="min-w-0">
<h2 class="text-lg font-semibold text-amber-900">Your Payment Is Still Processing</h2>
<p class="mt-1 text-sm leading-relaxed text-amber-800">
This usually takes only a few seconds. Refresh this page in a moment. Do not pay again:
if the payment went through, paying twice would charge you twice.
</p>
<a href="{{ route('site.pay.receipt', $payment->receipt_token) }}"
class="mt-3 inline-flex items-center gap-1.5 text-sm font-semibold text-amber-900 underline underline-offset-2">
<x-icon name="refresh" class="w-4 h-4" aria-hidden="true" />
Check Again
</a>
</div>
</div>
@elseif ($payment->status === 'refunded')
<div role="status" class="mb-6 flex items-start gap-4 rounded-2xl bg-slate-100 p-6 ring-1 ring-slate-300">
<span class="inline-flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-white text-slate-600 ring-1 ring-slate-300">
<x-icon name="restore" class="w-6 h-6" aria-hidden="true" />
</span>
<div class="min-w-0">
<h2 class="text-lg font-semibold text-slate-900">This Payment Was Refunded</h2>
<p class="mt-1 text-sm leading-relaxed text-slate-700">
{{ $payment->refundedFormatted() }} was returned to your card. Refunds usually appear on
your statement within five to ten working days.
</p>
</div>
</div>
@else
<div role="alert" class="mb-6 flex items-start gap-4 rounded-2xl bg-rose-50 p-6 ring-1 ring-rose-200">
<span class="inline-flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-white text-rose-600 ring-1 ring-rose-200">
<x-icon name="x-circle" class="w-6 h-6" aria-hidden="true" />
</span>
<div class="min-w-0">
<h2 class="text-lg font-semibold text-rose-900">This Payment Did Not Go Through</h2>
<p class="mt-1 text-sm leading-relaxed text-rose-800">
{{ $payment->failure_reason ?: 'The payment was not completed.' }}
You have not been charged, and the bill is still outstanding.
</p>
<a href="{{ route('site.pay.index') }}"
class="mt-3 inline-flex items-center gap-1.5 text-sm font-semibold text-rose-900 underline underline-offset-2">
Try Again
<x-icon name="chevron-right" class="w-4 h-4" aria-hidden="true" />
</a>
</div>
</div>
@endif
{{-- The receipt itself --}}
<div class="overflow-hidden rounded-2xl bg-white ring-1 ring-slate-200 shadow-sm">
<div class="flex flex-wrap items-start justify-between gap-3 border-b border-slate-100 bg-slate-50/70 px-6 py-4">
<div class="min-w-0">
<p class="text-xs font-semibold uppercase tracking-wide text-slate-500">Payment Reference</p>
<p class="mt-0.5 text-lg font-semibold tabular text-slate-900">{{ $payment->reference }}</p>
</div>
<div class="flex items-center gap-2">
@if ($isTestMode)
<x-badge color="warn" dot>Test Payment</x-badge>
@endif
<x-badge :color="$payment->statusColor()" dot>{{ $payment->statusLabel() }}</x-badge>
</div>
</div>
<dl class="divide-y divide-slate-100">
<div class="flex items-start justify-between gap-4 px-6 py-4">
<dt class="text-sm text-slate-500">Paid To</dt>
<dd class="text-right text-sm font-medium text-slate-900">{{ $siteName }}</dd>
</div>
<div class="flex items-start justify-between gap-4 px-6 py-4">
<dt class="text-sm text-slate-500">What This Was For</dt>
<dd class="text-right text-sm text-slate-900">
{{ $bill?->type?->label ?? $payment->type?->label ?? 'Payment' }}
@if ($bill?->description)
<span class="block text-slate-600">{{ $bill->description }}</span>
@elseif ($payment->notes)
<span class="block text-slate-600">{{ $payment->notes }}</span>
@endif
</dd>
</div>
@if ($bill)
<div class="flex items-start justify-between gap-4 px-6 py-4">
<dt class="text-sm text-slate-500">Bill Reference</dt>
<dd class="text-right text-sm tabular text-slate-900">{{ $bill->reference }}</dd>
</div>
@endif
@if ($payment->payer_name)
<div class="flex items-start justify-between gap-4 px-6 py-4">
<dt class="text-sm text-slate-500">Paid By</dt>
<dd class="text-right text-sm text-slate-900">{{ $payment->payer_name }}</dd>
</div>
@endif
<div class="flex items-start justify-between gap-4 px-6 py-4">
<dt class="text-sm text-slate-500">Date</dt>
<dd class="text-right text-sm text-slate-900">
{{ ($payment->paid_at ?? $payment->created_at)->format(config('health.date_format') . ', ' . config('health.time_format')) }}
</dd>
</div>
<div class="flex items-start justify-between gap-4 px-6 py-4">
<dt class="text-sm text-slate-500">Payment Method</dt>
<dd class="text-right text-sm text-slate-900">{{ $payment->instrumentLabel() }}</dd>
</div>
@if ($payment->refunded_cents > 0)
<div class="flex items-start justify-between gap-4 px-6 py-4">
<dt class="text-sm text-slate-500">Refunded</dt>
<dd class="text-right text-sm tabular text-slate-700">- {{ $payment->refundedFormatted() }}</dd>
</div>
@endif
</dl>
<div class="flex items-center justify-between gap-4 border-t-2 border-slate-200 bg-brand-50/60 px-6 py-5">
<span class="text-base font-semibold text-slate-900">Amount Paid</span>
<span class="text-2xl font-semibold tabular text-brand-800">{{ $payment->amountFormatted() }}</span>
</div>
@if ($bill && $bill->balanceCents() > 0)
<div class="border-t border-slate-100 bg-amber-50 px-6 py-4">
<p class="text-sm text-amber-900">
<span class="font-semibold">{{ $bill->balanceFormatted() }} is still outstanding</span>
on bill {{ $bill->reference }}.
<a href="{{ route('site.pay.lookup') }}" class="font-medium underline underline-offset-2">Pay the balance</a>.
</p>
</div>
@endif
</div>
@if ($payment->isSettled())
<div class="mt-6 flex flex-wrap items-center justify-center gap-3">
<a href="{{ route('site.pay.receipt.download', $payment->receipt_token) }}"
class="inline-flex items-center gap-2 rounded-lg bg-white px-5 py-2.5 text-sm font-semibold text-slate-700 ring-1 ring-inset ring-slate-300 transition hover:bg-slate-50">
<x-icon name="download" class="w-4 h-4" aria-hidden="true" />
Download Receipt
</a>
<button type="button" onclick="window.print()"
class="inline-flex items-center gap-2 rounded-lg bg-white px-5 py-2.5 text-sm font-semibold text-slate-700 ring-1 ring-inset ring-slate-300 transition hover:bg-slate-50">
<x-icon name="file-text" class="w-4 h-4" aria-hidden="true" />
Print This Page
</button>
</div>
<p class="mt-6 text-center text-sm text-slate-500">
Bookmark this page to come back to your receipt at any time.
@if ($payment->payer_email)
A copy has also been emailed to {{ $payment->payer_email }}.
@endif
</p>
@endif
@if ($supportEmail || $supportPhone)
<p class="mt-4 text-center text-sm text-slate-500">
Questions about this payment:
@if ($supportPhone)
<a href="tel:{{ preg_replace('/[^0-9+]/', '', $supportPhone) }}" class="font-medium text-brand-700 hover:underline">{{ $supportPhone }}</a>
@endif
@if ($supportEmail && $supportPhone) or @endif
@if ($supportEmail)
<a href="mailto:{{ $supportEmail }}" class="font-medium text-brand-700 hover:underline">{{ $supportEmail }}</a>
@endif
</p>
@endif
</div>
</x-site.section>
</x-layouts.public>
Blade In One Screen
The directives you will use most.
- Print a value, escaped. Safe by default.
- Print raw HTML. Only for content you trust.
- Show something conditionally.
- Loop over a collection.
- Use a shared component. Every component in Shared Components is available.
- A comment that never reaches the browser.
{{ $variable }}
{!! $html !!}
@if / @else / @endif
@foreach / @endforeach
<x-card>
{{-- comment --}}
House Rules
Follow these and your edits will survive updates.
-
Never start line 1 with
@php. Blade mis-parses it and the page fails. The editor refuses to save it. - Keep logic out of templates. If you need a calculation, it belongs in a composer or component class, not here.
- The shipped file is never modified. Reset To Default always gets you back.
- Every save is versioned. You can revert to any earlier version in one click.
- Press Tab inside the editor to indent rather than jump to the next field.