mirror of https://github.com/zulip/zulip.git
billing: Update the charged amount when user changes plan in upgrade page.
This commit is contained in:
parent
e7374a0852
commit
d64ba5d2be
|
@ -31,26 +31,26 @@
|
|||
<div class="payment-schedule">
|
||||
<h3>{{ _("Payment schedule") }}</h3>
|
||||
<label>
|
||||
<input type="radio" name="plan" value="{{ nickname_annual }}" checked />
|
||||
<input type="radio" name="plan" value="{{ nickname_annual }}" data-amount="{{ cloud_annual_price }}" checked />
|
||||
<div class="box">
|
||||
<div class="schedule-time">{{ _("Pay annually") }}</div>
|
||||
<div class="schedule-amount">
|
||||
$6.67/user/month
|
||||
${{ cloud_annual_price_per_month }}/user/month
|
||||
<div class="schedule-amount-2">
|
||||
($80/user/year)
|
||||
(${{ cloud_annual_price }}/user/year)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="plan" value="{{ nickname_monthly }}" />
|
||||
<input type="radio" name="plan" value="{{ nickname_monthly }}" data-amount="{{ cloud_monthly_price }}" />
|
||||
<div class="box">
|
||||
<div class="schedule-time">{{ _("Pay monthly") }}</div>
|
||||
<div class="schedule-amount">$8/user/month</div>
|
||||
<div class="schedule-amount">${{ cloud_monthly_price }}/user/month</div>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
<p>You’ll initially be charged <b><span id="charged_amount">XXX</span></b> for <b>{{ seat_count }}</b> users. You’ll receive prorated charges and credits as users are added, deactivated, or become inactive.</p>
|
||||
<p>You’ll initially be charged <b>$<span id="charged_amount">{{ cloud_annual_price * seat_count }}</span></b> for <b>{{ seat_count }}</b> users. You’ll receive prorated charges and credits as users are added, deactivated, or become inactive.</p>
|
||||
<script src="https://checkout.stripe.com/checkout.js" class="stripe-button"
|
||||
data-key="{{ publishable_key }}"
|
||||
data-image="/static/images/logo/zulip-icon-128x128.png"
|
||||
|
@ -65,6 +65,13 @@
|
|||
data-allow-remember-me="false"
|
||||
>
|
||||
</script>
|
||||
<script>
|
||||
const seat_count = parseInt($('input[name=seat_count]').val());
|
||||
$("input[type=radio][name=plan").change(function () {
|
||||
var charged_amount = parseInt($(this).data("amount")) * seat_count;
|
||||
$("#charged_amount").html(charged_amount);
|
||||
});
|
||||
</script>
|
||||
</form>
|
||||
<p>We can also bill by invoice for annual contracts over $2,000. Contact <a href="mailto:support@zulipchat.com">support@zulipchat.com</a> to pay by invoice or for any other billing questions.</p>
|
||||
</div>
|
||||
|
|
|
@ -198,6 +198,8 @@ class TemplateTestCase(ZulipTestCase):
|
|||
"login_time": "9:33am NewYork, NewYork",
|
||||
},
|
||||
api_uri_context={},
|
||||
cloud_annual_price=80,
|
||||
seat_count=8,
|
||||
)
|
||||
|
||||
context.update(kwargs)
|
||||
|
|
|
@ -213,6 +213,9 @@ def initial_upgrade(request: HttpRequest) -> HttpResponse:
|
|||
'nickname_monthly': Plan.CLOUD_MONTHLY,
|
||||
'nickname_annual': Plan.CLOUD_ANNUAL,
|
||||
'error_message': error_message,
|
||||
'cloud_monthly_price': 8,
|
||||
'cloud_annual_price': 80,
|
||||
'cloud_annual_price_per_month': 6.67,
|
||||
} # type: Dict[str, Any]
|
||||
response = render(request, 'zilencer/upgrade.html', context=context)
|
||||
response['error_description'] = error_description
|
||||
|
|
Loading…
Reference in New Issue