95 lines
3.2 KiB
Plaintext
95 lines
3.2 KiB
Plaintext
{{ template "base" . }}
|
|
{{ define "title" }}
|
|
Virtual Terminal
|
|
{{ end }}
|
|
{{ define "content" }}
|
|
<h2 class="mt-3 text-center">Virtual Terminal</h2>
|
|
<hr>
|
|
<div class="alert alert-danger text-center d-none" id="card-messages"></div>
|
|
<form action="/payment-succeeded"
|
|
method="post"
|
|
name="charge_form"
|
|
id="charge_form"
|
|
class="d-blick needs-validation charge-form"
|
|
autocomplete="off"
|
|
novalidate="">
|
|
<div class="mb-3">
|
|
<label for="amount" class="form-label">Amount</label>
|
|
<input type="text"
|
|
id="charge_amount"
|
|
name="charge_amount"
|
|
autocomplete="charge_amount-new"
|
|
required=""
|
|
class="form-control">
|
|
<input type="hidden" id="amount" name="amount" value="value">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="cardholder-name" class="form-label">Cardholder Name</label>
|
|
<input type="text"
|
|
id="cardholder-name"
|
|
name="cardholder_name"
|
|
autocomplete="cardholder-name-new"
|
|
required=""
|
|
class="form-control">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="cardholder-email" class="form-label">Cardholder Email</label>
|
|
<input type="text"
|
|
id="cardholder-email"
|
|
name="cardholder_email"
|
|
autocomplete="cardholder-email-new"
|
|
required=""
|
|
class="form-control">
|
|
</div>
|
|
<!-- card number will be built by stripe -->
|
|
<div class="mb-3">
|
|
<label for="card-element" class="form-label">Credit Card</label>
|
|
<div class="form-control" id="card-element"></div>
|
|
<div class="alert-danger text-center" id="card-errors" role="alert"></div>
|
|
<div class="alert-success text-center" id="card-success" role="alert"></div>
|
|
</div>
|
|
<hr>
|
|
<a href="javascript:void(0)"
|
|
id="pay-button"
|
|
class="btn btn-primary"
|
|
onclick="termVal()">Charge Card</a>
|
|
<div class="text-center d-none" id="processing-payment">
|
|
<div class="spinner-border text-primary" role="status">
|
|
<span class="visually-hidden">Loading...</span>
|
|
</div>
|
|
</div>
|
|
<input id="payment_intent"
|
|
type="hidden"
|
|
name="payment_intent"
|
|
value="payment_intent">
|
|
<input id="payment_method"
|
|
type="hidden"
|
|
name="payment_method"
|
|
value="payment_method">
|
|
<input id="payment_amount"
|
|
type="hidden"
|
|
name="payment_amount"
|
|
value="payment_amount">
|
|
<input id="payment_currency"
|
|
type="hidden"
|
|
name="payment_currency"
|
|
value="payment_currency">
|
|
</form>
|
|
{{ end }}
|
|
{{ define "js" }}
|
|
<script src="https://js.stripe.com/v3/"></script>
|
|
<script src="/static/js/stripe.js"></script>
|
|
<script>
|
|
stripeInit('{{.StripePubKey}}');
|
|
function termVal() {
|
|
const chargeAmount = document.getElementById("charge_amount");
|
|
if (chargeAmount.value !== "") {
|
|
document.getElementById("amount").value = chargeAmount.value * 100;
|
|
} else {
|
|
document.getElementById("amount").value = 0;
|
|
}
|
|
val({{.API}});
|
|
}
|
|
</script>
|
|
{{ end }}
|