diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/routes/(app)/[username]/payments/[...page]/+page.svelte | 32 | ||||
| -rw-r--r-- | src/routes/(app)/payment/[id]/+page.svelte | 39 |
2 files changed, 40 insertions, 31 deletions
diff --git a/src/routes/(app)/[username]/payments/[...page]/+page.svelte b/src/routes/(app)/[username]/payments/[...page]/+page.svelte index a502f8c3..84891b92 100644 --- a/src/routes/(app)/[username]/payments/[...page]/+page.svelte +++ b/src/routes/(app)/[username]/payments/[...page]/+page.svelte @@ -60,9 +60,11 @@ payments = payments.map((p) => ({ ...p, created: new Date(p.created), + total: p.amount + p.tip || 0, amount_fiat: f((p.amount * p.rate) / sats, p.currency), fee_fiat: p.fee ? f((p.fee * p.rate) / sats, p.currency) : null, - tip_fiat: p.tip ? f((p.tip * p.rate) / sats, p.currency) : null + tip_fiat: p.tip ? f((p.tip * p.rate) / sats, p.currency) : null, + total_fiat: f(((p.amount + p.tip || 0) * p.rate) / sats, p.currency) })); let keys = [ @@ -72,11 +74,13 @@ 'rate', 'currency', 'amount', - 'fee', 'tip', + 'total', + 'fee', 'amount_fiat', - 'fee_fiat', - 'tip_fiat' + 'tip_fiat', + 'total_fiat', + 'fee_fiat' ]; let csv = @@ -143,24 +147,20 @@ <a href={`/payment/${p.id}`}> <div class="grid grid-cols-3 border-b h-24 hover:bg-gray-100 px-4"> <div class="whitespace-nowrap my-auto"> - <div class="font-bold"> - {f(p.amount * (p.rate / sats), p.currency)} - + <div class="font-bold" class:text-red-800={p.amount < 0}> + {f((Math.abs(p.amount) + p.tip || 0) * (p.rate / sats), p.currency)} {#if p.tip} - <span class="text-sm"> - +{f(p.tip * (p.rate / sats), p.currency)} + <span class="text-xs text-secondary"> + {f(Math.abs(p.amount) * (p.rate / sats), p.currency)} + {f( + p.tip * (p.rate / sats), + p.currency + )} </span> {/if} </div> <div class="text-secondary"> - {sat(p.amount)} - - {#if p.tip} - <span class="text-sm"> - +{sat(p.tip)} - </span> - {/if} + {sat(p.amount + p.tip)} </div> </div> diff --git a/src/routes/(app)/payment/[id]/+page.svelte b/src/routes/(app)/payment/[id]/+page.svelte index 2e170a43..c3f8cdf0 100644 --- a/src/routes/(app)/payment/[id]/+page.svelte +++ b/src/routes/(app)/payment/[id]/+page.svelte @@ -7,6 +7,7 @@ export let data; let { user, payment: p } = data; + let { username } = user; let { id, amount, created, rate, type, ref, tip, ourfee, fee, currency } = p; let a = Math.abs(amount); @@ -36,33 +37,41 @@ </a> </div> {/if} - <div> <span class="text-lg text-secondary">Amount</span> <div> {f(fiat(a, rate), currency)} - {#if tip} - <span class="text-lg"> - + {f(fiat(tip, rate), currency)} - </span> - {/if} - <span class="text-secondary" - >⚡️{`${s(a)}`} - - {#if tip} - <span class="text-lg"> - + ⚡️{s(tip)} - </span> - {/if} + <span class="text-secondary text-lg"> + ⚡️{s(a)} </span> </div> </div> + {#if tip} + <div> + <span class="text-lg text-secondary">Tip</span> + <div> + {f(fiat(tip, rate), currency)} + <span class="text-secondary text-lg"> + ⚡️{s(tip)} + </span> + </div> + </div> + + <div> + <span class="text-lg text-secondary">Total</span> + <div> + {f(fiat(a + tip || 0, rate), currency)} + <span class="text-secondary text-lg">⚡️{`${s(a + tip || 0)}`} </span> + </div> + </div> + {/if} + <div> <span class="text-lg text-secondary">Network fee</span> <div> {f(fiat(fee, rate), currency)} - <span class="text-secondary">⚡️{`${s(fee)}`}</span> + <span class="text-secondary text-lg">⚡️{`${s(fee)}`}</span> </div> </div> |