mirror of
https://github.com/btcpayserver/btcpayserver.git
synced 2025-02-26 15:41:29 +01:00
58 lines
2.9 KiB
Text
58 lines
2.9 KiB
Text
@using BTCPayServer.BIP78.Sender
|
|
@model BTCPayServer.Models.InvoicingModels.PaymentModel
|
|
|
|
<template id="bitcoin-method-checkout-template">
|
|
@await Component.InvokeAsync("UiExtensionPoint", new {location = "checkout-v2-bitcoin-pre-content", model = Model})
|
|
<div class="payment-box">
|
|
<div v-if="model.invoiceBitcoinUrlQR" class="qr-container" :data-qr-value="model.invoiceBitcoinUrlQR" :data-clipboard="model.btcAddress">
|
|
<div>
|
|
<qrcode :value="model.invoiceBitcoinUrlQR" tag="div" :options="qrOptions" />
|
|
</div>
|
|
<img class="qr-icon" :src="model.cryptoImage" :alt="model.paymentMethodName"/>
|
|
</div>
|
|
<div v-if="model.btcAddress" class="input-group mt-3">
|
|
<div class="form-floating">
|
|
<input id="Address_@Model.PaymentMethodId" class="form-control-plaintext" readonly="readonly" :value="model.btcAddress">
|
|
<label for="Address_@Model.PaymentMethodId" v-t="{ path: 'address', args: { paymentMethod: model.paymentMethodName }}"></label>
|
|
</div>
|
|
<button type="button" class="btn btn-link" data-clipboard-target="#Address_@Model.PaymentMethodId">
|
|
<vc:icon symbol="copy" />
|
|
</button>
|
|
</div>
|
|
<div v-if="lightning" class="input-group mt-3">
|
|
<div class="form-floating">
|
|
<input id="Lightning_@Model.PaymentMethodId" class="form-control-plaintext" readonly="readonly" :value="lightning" />
|
|
<label for="Lightning_@Model.PaymentMethodId" v-t="'lightning'"></label>
|
|
</div>
|
|
<button type="button" class="btn btn-link" data-clipboard-target="#Lightning_@Model.PaymentMethodId">
|
|
<vc:icon symbol="copy" />
|
|
</button>
|
|
</div>
|
|
<a v-if="model.invoiceBitcoinUrl" class="btn btn-primary rounded-pill w-100 mt-4" target="_top" id="PayInWallet"
|
|
:href="model.invoiceBitcoinUrl" :title="$t(hasPayjoin ? 'BIP21 payment link with PayJoin support' : 'BIP21 payment link')" v-t="'pay_in_wallet'"></a>
|
|
@await Component.InvokeAsync("UiExtensionPoint", new {location = "checkout-v2-bitcoin-post-content", model = Model})
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
Vue.component('BitcoinLikeMethodCheckout', {
|
|
props: ["model"],
|
|
template: "#bitcoin-method-checkout-template",
|
|
components: {
|
|
qrcode: VueQrcode
|
|
},
|
|
data () {
|
|
// currentTab is needed for backwards-compatibility with old plugin versions
|
|
return { currentTab: undefined };
|
|
},
|
|
computed: {
|
|
hasPayjoin () {
|
|
return this.model.invoiceBitcoinUrl.indexOf('@PayjoinClient.BIP21EndpointKey=') !== -1;
|
|
},
|
|
lightning () {
|
|
const match = this.model.invoiceBitcoinUrl.match(/[&?]lightning=(.*)&?/i);
|
|
return match ? match[1].toLowerCase() : null;
|
|
}
|
|
}
|
|
});
|
|
</script>
|