68 lines
3.2 KiB
HTML
68 lines
3.2 KiB
HTML
|
{{define "content"}}
|
||
|
|
<div class="space-y-6">
|
||
|
|
<div class="sm:flex sm:items-center sm:justify-between">
|
||
|
|
<div>
|
||
|
|
<h1 class="text-2xl font-bold text-gray-900">{{.Invoice.InvoiceNumber}}</h1>
|
||
|
|
<p class="mt-1 text-sm text-gray-500">{{.Invoice.CustomerName}}</p>
|
||
|
|
</div>
|
||
|
|
<div class="flex items-center space-x-3">
|
||
|
|
<a href="/invoices" class="text-sm text-gray-500 hover:text-gray-700">← All Invoices</a>
|
||
|
|
{{if eq .Invoice.Status "pending"}}
|
||
|
|
<button class="rounded-md bg-green-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-green-500"
|
||
|
|
hx-post="/invoices/{{.Invoice.ID}}/pay"
|
||
|
|
hx-confirm="Mark this invoice as paid? This will create a GL journal entry.">
|
||
|
|
Mark as Paid
|
||
|
|
</button>
|
||
|
|
{{end}}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="bg-white shadow sm:rounded-lg">
|
||
|
|
<div class="px-4 py-5 sm:p-6">
|
||
|
|
<dl class="grid grid-cols-1 gap-x-4 gap-y-6 sm:grid-cols-3">
|
||
|
|
<div>
|
||
|
|
<dt class="text-sm font-medium text-gray-500">Invoice Number</dt>
|
||
|
|
<dd class="mt-1 text-sm text-gray-900">{{.Invoice.InvoiceNumber}}</dd>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<dt class="text-sm font-medium text-gray-500">Customer</dt>
|
||
|
|
<dd class="mt-1 text-sm text-gray-900">
|
||
|
|
<a href="/customers/{{.Invoice.CustomerID}}" class="text-indigo-600 hover:text-indigo-900">{{.Invoice.CustomerName}}</a>
|
||
|
|
</dd>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<dt class="text-sm font-medium text-gray-500">Status</dt>
|
||
|
|
<dd class="mt-1">{{statusBadge .Invoice.Status}}</dd>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<dt class="text-sm font-medium text-gray-500">Amount</dt>
|
||
|
|
<dd class="mt-1 text-2xl font-semibold text-gray-900">{{formatMoney .Invoice.Amount}}</dd>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<dt class="text-sm font-medium text-gray-500">Due Date</dt>
|
||
|
|
<dd class="mt-1 text-sm text-gray-900">{{formatDate .Invoice.DueDate}}</dd>
|
||
|
|
</div>
|
||
|
|
{{if .Invoice.PaidDate.Valid}}
|
||
|
|
<div>
|
||
|
|
<dt class="text-sm font-medium text-gray-500">Paid Date</dt>
|
||
|
|
<dd class="mt-1 text-sm text-gray-900">{{formatDate .Invoice.PaidDate.String}}</dd>
|
||
|
|
</div>
|
||
|
|
{{end}}
|
||
|
|
{{if .Invoice.OrderID.Valid}}
|
||
|
|
<div>
|
||
|
|
<dt class="text-sm font-medium text-gray-500">Order</dt>
|
||
|
|
<dd class="mt-1 text-sm text-gray-900">
|
||
|
|
<a href="/orders/{{.Invoice.OrderID.Int64}}" class="text-indigo-600 hover:text-indigo-900">Order #{{.Invoice.OrderID.Int64}}</a>
|
||
|
|
</dd>
|
||
|
|
</div>
|
||
|
|
{{end}}
|
||
|
|
<div>
|
||
|
|
<dt class="text-sm font-medium text-gray-500">Created</dt>
|
||
|
|
<dd class="mt-1 text-sm text-gray-900">{{.Invoice.CreatedAt.Format "Jan 02, 2006 3:04 PM"}}</dd>
|
||
|
|
</div>
|
||
|
|
</dl>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{{end}}
|