Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
63 changes: 39 additions & 24 deletions packages/invoice-dashboard/src/lib/dashboard/invoice-view.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -212,52 +212,54 @@
--secondaryColor: {config.colors.secondary};"
>
<div class="dates">
<p>Issued on: {formatDate(request?.contentData?.creationDate)}</p>
<p>Due by: {formatDate(request?.contentData?.paymentTerms?.dueDate)}</p>
<p>Issued on: {formatDate(request?.contentData?.creationDate || "-")}</p>
<p>
Due by: {formatDate(request?.contentData?.paymentTerms?.dueDate || "-")}
</p>
</div>
<h2 class="invoice-number">
Invoice #{request?.contentData?.invoiceNumber}
Invoice #{request?.contentData?.invoiceNumber || "-"}
<p class={`invoice-status ${isPaid ? "bg-green" : "bg-zinc"}`}>
{isPaid ? "Paid" : "Created"}
</p>
</h2>
<div class="invoice-address">
<h2>From:</h2>
<p>{request?.payee?.value}</p>
<p>{request?.payee?.value || "-"}</p>
</div>
{#if sellerInfo.length > 0}
<div class={`invoice-info bg-zinc-light`}>
{#each sellerInfo as { label, value }}
<p>
<span>{label}:</span>
{value}
<span>{label || "-"}:</span>
{value || "-"}
</p>
{/each}
</div>
{/if}
<div class="invoice-border"></div>
<div class="invoice-address">
<h2>Billed to:</h2>
<p>{request?.payer?.value}</p>
<p>{request?.payer?.value || "-"}</p>
</div>
{#if buyerInfo.length > 0}
<div class={`invoice-info bg-zinc-light`}>
{#each buyerInfo as { label, value }}
<p>
<span>{label}:</span>
{value}
<span>{label || "-"}:</span>
{value || "-"}
</p>
{/each}
</div>
{/if}

<h3 class="invoice-info-payment">
<span style="font-weight: 500;">Payment Chain:</span>
{currency?.network}
{currency?.network || "-"}
</h3>
<h3 class="invoice-info-payment">
<span style="font-weight: 500;">Invoice Currency:</span>
{currency?.symbol}
{currency?.symbol || "-"}
</h3>

{#if request?.contentData?.invoiceItems}
Expand All @@ -279,12 +281,20 @@
{#each firstItems as item, index (index)}
<tr class="table-row item-row">
<th scope="row" class="item-description">
<p class="truncate description-text">{item.name}</p>
<p class="truncate description-text">{item.name || "-"}</p>
</th>
<td>{item.quantity}</td>
<td>{formatUnits(item.unitPrice, currency?.decimals ?? 18)}</td>
<td>{formatUnits(item.discount, currency?.decimals ?? 18)}</td>
<td>{Number(item.tax.amount)}</td>
<td>{item.quantity || "-"}</td>
<td
>{item.unitPrice
? formatUnits(item.unitPrice, currency?.decimals ?? 18)
: "-"}</td
>
<td
>{item.discount
? formatUnits(item.discount, currency?.decimals ?? 18)
: "-"}</td
>
<td>{Number(item.tax.amount || "-")}</td>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should also make sure to add here and in the discount and such, these might now be available in some requests.

<td
>{truncateNumberString(
formatUnits(
Expand Down Expand Up @@ -319,16 +329,21 @@
<tr class="table-row item-row">
<th scope="row" class="item-description">
<p class="truncate description-text" style="margin: 4px 0;">
{item.name}
{item.name || "-"}
</p>
</th>
<td>{item.quantity}</td>
<td>{item.quantity || "-"}</td>
<td
>{formatUnits(item.unitPrice, currency?.decimals ?? 18)}</td
>{item.unitPrice
? formatUnits(item.unitPrice, currency?.decimals ?? 18)
: "-"}</td
>
<td>{formatUnits(item.discount, currency?.decimals ?? 18)}</td
<td
>{item.discount
? formatUnits(item.discount, currency?.decimals ?? 18)
: "-"}</td
>
<td>{Number(item.tax.amount)}</td>
<td>{Number(item.tax.amount || "-")}</td>
<td
>{truncateNumberString(
formatUnits(
Expand All @@ -351,15 +366,15 @@
<div class="note-container">
<p class="note-content">
<span class="note-title">Memo:</span> <br />
{request.contentData.note}
{request.contentData.note || "-"}
</p>
</div>
{/if}
<div class="labels-container">
{#if request?.contentData?.miscellaneous?.labels}
{#each request?.contentData?.miscellaneous?.labels as label, index (index)}
<div class="label">
{label}
{label || "-"}
</div>
{/each}
{/if}
Expand All @@ -369,7 +384,7 @@
{#if statuses.length > 0 && loading}
{#each statuses as status, index (index)}
<div class="status">
{status}
{status || "-"}
{#if (index === 0 && statuses.length === 2) || (index === 1 && statuses.length === 3)}
<i>
<Check />
Expand Down