Hide QR code after receiving payment

This commit is contained in:
silverpill 2022-09-25 22:20:29 +00:00
parent 408677921b
commit 4469fb85e2

View file

@ -68,7 +68,7 @@
<button <button
type="submit" type="submit"
class="btn primary" class="btn primary"
:disabled="!canPay()" :disabled="!canCreateInvoice()"
@click.prevent="onCreateInvoice()" @click.prevent="onCreateInvoice()"
> >
<template v-if="!isSubscribed()"> <template v-if="!isSubscribed()">
@ -78,14 +78,16 @@
</button> </button>
</form> </form>
<div class="invoice" v-if="invoice"> <div class="invoice" v-if="invoice">
<div>Please send {{ formatXmrAmount(invoice.amount) }} XMR to this address:</div> <template v-if="invoice.status === 'open' || invoice.status === 'timeout'">
<a <div>Please send {{ formatXmrAmount(invoice.amount) }} XMR to this address:</div>
class="payment-address" <a
:href="getPaymentUri(invoice)" class="payment-address"
> :href="getPaymentUri(invoice)"
{{ invoice.payment_address }} >
</a> {{ invoice.payment_address }}
<qr-code :url="getPaymentUri(invoice)"></qr-code> </a>
<qr-code :url="getPaymentUri(invoice)"></qr-code>
</template>
<div class="invoice-status"> <div class="invoice-status">
<template v-if="invoice.status === 'open'">Waiting for payment</template> <template v-if="invoice.status === 'open'">Waiting for payment</template>
<template v-else-if="invoice.status === 'paid'">Processing payment</template> <template v-else-if="invoice.status === 'paid'">Processing payment</template>
@ -201,7 +203,7 @@ const paymentAmount = $computed<number | null>(() => {
return getPaymentAmount(subscriptionOption.price, paymentDuration) return getPaymentAmount(subscriptionOption.price, paymentDuration)
}) })
function canPay(): boolean { function canCreateInvoice(): boolean {
return paymentAmount !== null return paymentAmount !== null
} }
@ -377,7 +379,6 @@ function getPaymentUri(invoice: Invoice): string {
.payment-address { .payment-address {
font-family: monospace; font-family: monospace;
max-width: 100%; max-width: 100%;
user-select: all;
word-wrap: break-word; word-wrap: break-word;
} }
} }