neptune/core/templates/billing.html

85 lines
2.7 KiB
HTML

{% extends "base.html" %}
{% block content %}
<h1 class="title">Billing/Plan Management</h1>
<div class="container">
<div class="row">
<div class="col-xs-10 col-md-4 col-lg-4">
<div class="panel panel-default">
<div class="panel-heading">
Products
</div>
<div class="panel-body">
<ul class="list-group">
<li class="list-group-item">
<span class="badge">{{ user.first_name }}</span>
First name
</li>
<li class="list-group-item">
<span class="badge">{{ user.last_name }}</span>
Last name
</li>
<li class="list-group-item">
{% for plan in user.plans.all %}
<span class="badge">{{ plan.name }}</span>
{% endfor %}
Plans
</li>
<li class="list-group-item">
<span class="badge">{{ user.paid }}</span>
Paid
</li>
<li class="list-group-item">
<span class="badge">{{ user.last_payment }}</span>
Last payment
</li>
</ul>
<form action="{% url 'portal' %}">
<input class="btn btn-lg btn-dark btn-block" type="submit" value="Subscription management">
</form>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
Available plans
</div>
<div class="panel-body">
{% include "partials/product-list.html" %}
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
// Create an instance of the Stripe object with your publishable API key
var stripe = Stripe("pk_test_51HbqYzAKLUD9ELc0KSyiQ9YohsfiUCeBpAfpflAIg2Uu2RFecx3sfWYXzM1xDtI5XlQihqHMnaPKd45JzDuqXdGP00pYWvRvRe");
var setupButton = document.getElementById('setup-button');
setupButton.addEventListener("click", function () {
fetch("/setup-bacs", {
method: "POST",
})
.then(function (response) {
return response.json();
})
.then(function (session) {
return stripe.redirectToCheckout({ sessionId: session.id });
})
.then(function (result) {
// If redirectToCheckout fails due to a browser or network
// error, you should display the localized error message to your
// customer using error.message.
if (result.error) {
alert(result.error.message);
}
})
.catch(function (error) {
console.error("Error:", error);
});
});
</script>
{% endblock %}