datacenterlight invoice redesigned

This commit is contained in:
Arvind Tiwari 2017-09-26 01:04:38 +05:30
parent 313b2b2f57
commit 63ea7dac37
6 changed files with 52 additions and 147 deletions

View file

@ -8,7 +8,7 @@ msgid ""
msgstr "" msgstr ""
"Project-Id-Version: PACKAGE VERSION\n" "Project-Id-Version: PACKAGE VERSION\n"
"Report-Msgid-Bugs-To: \n" "Report-Msgid-Bugs-To: \n"
"POT-Creation-Date: 2017-09-16 14:09+0000\n" "POT-Creation-Date: 2017-09-26 01:02+0530\n"
"PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n" "PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
"Last-Translator: FULL NAME <EMAIL@ADDRESS>\n" "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
"Language-Team: LANGUAGE <LL@li.org>\n" "Language-Team: LANGUAGE <LL@li.org>\n"
@ -336,35 +336,6 @@ msgstr "Weiter"
msgid "Enter your credit card number" msgid "Enter your credit card number"
msgstr "Deine Kreditkartennummer" msgstr "Deine Kreditkartennummer"
msgid "Confirm Order"
msgstr "Bestellung Bestätigen"
msgid "Date"
msgstr "Datum"
msgid "Billed To:"
msgstr "Rechnungsadresse"
msgid "Payment Method:"
msgstr "Bezahlmethode"
msgid "ending in"
msgstr "endend in"
msgid "Order summary"
msgstr "Bestellungsübersicht"
#, python-format
msgid ""
"By clicking \"Place order\" this plan will charge your credit card account "
"with the fee of %(vm_price)sCHF/month"
msgstr ""
"Wenn Du \"bestellen\" auswählst, wird Deine Kreditkarte mit %(vm_price)sCHF "
"pro Monat belastet"
msgid "Place order"
msgstr "Bestellen"
msgid "We are cutting down the costs significantly!" msgid "We are cutting down the costs significantly!"
msgstr "Wir sorgen dafür, dass die Kosten für Dich signifikant abnehmen" msgstr "Wir sorgen dafür, dass die Kosten für Dich signifikant abnehmen"
@ -485,6 +456,34 @@ msgstr "ist kein gültiger Name"
msgid "is not a proper email" msgid "is not a proper email"
msgstr "ist keine gültige E-Mailadresse" msgstr "ist keine gültige E-Mailadresse"
#~ msgid "Confirm Order"
#~ msgstr "Bestellung Bestätigen"
#~ msgid "Date"
#~ msgstr "Datum"
#~ msgid "Billed To:"
#~ msgstr "Rechnungsadresse"
#~ msgid "Payment Method:"
#~ msgstr "Bezahlmethode"
#~ msgid "ending in"
#~ msgstr "endend in"
#~ msgid "Order summary"
#~ msgstr "Bestellungsübersicht"
#~ msgid ""
#~ "By clicking \"Place order\" this plan will charge your credit card "
#~ "account with the fee of %(vm_price)sCHF/month"
#~ msgstr ""
#~ "Wenn Du \"bestellen\" auswählst, wird Deine Kreditkarte mit "
#~ "%(vm_price)sCHF pro Monat belastet"
#~ msgid "Place order"
#~ msgstr "Bestellen"
#~ msgid "" #~ msgid ""
#~ "\n" #~ "\n"
#~ "Hi,\n" #~ "Hi,\n"

View file

@ -1501,6 +1501,8 @@ tech-sub-sec h2 {
font-size: 14px; font-size: 14px;
font-weight: 300; font-weight: 300;
letter-spacing: 2px; letter-spacing: 2px;
line-height: 24px;
display: block;
} }
.content-section-a { .content-section-a {

View file

@ -16,7 +16,7 @@
<hr class="intro-divider"> <hr class="intro-divider">
<ul class="list-inline intro-social-buttons"> <ul class="list-inline intro-social-buttons">
<li> <li>
<a class="btn btn-default btn-lg btn-transparent url" href="#how"><i class="#Services"></i> <span class="network-name">{% trans "Highlights" %}</span></a> <a class="btn btn-default btn-lg btn-transparent url" href="#how"><span class="network-name">{% trans "Highlights" %}</span></a>
</li> </li>
<li> <li>
<a class="btn btn-primary btn-lg page-scroll url" href="#price"><span class="network-name">{% trans "I want it!" %}</span></a> <a class="btn btn-primary btn-lg page-scroll url" href="#price"><span class="network-name">{% trans "I want it!" %}</span></a>

View file

@ -1,106 +1,5 @@
{% extends "hosting/base_short.html" %} {% extends "hosting/order_detail.html" %}
{% load staticfiles bootstrap3 %}
{% load i18n %}
{% load custom_tags %}
{% block navbar %} {% block navbar %}
{% include "datacenterlight/includes/_navbar.html" %} {% include "datacenterlight/includes/_navbar.html" %}
{% endblock navbar %} {% endblock navbar %}
{% block content %}
<div class="order-detail-container">
{% if messages %}
<div class="row">
<div class="col-xs-12 col-md-8 col-md-offset-2">
<br/>
<div class="alert alert-warning">
{% for message in messages %}
<span>{{ message }}</span>
{% endfor %}
</div>
</div>
</div>
{% endif %}
{% if not error %}
<div class="row">
<div class="col-xs-12 col-md-8 col-md-offset-2">
<div class="invoice-title">
<h2>{% trans "Confirm Order"%}</h2>
</div>
<hr>
<div class="row">
<div class="col-xs-12 col-sm-6 pull-right order-confirm-date">
<address>
<strong>{% trans "Date"%}:</strong><br>
<span id="order-created_at">{% now "Y-m-d H:i" %}</span><br><br>
</address>
</div>
<div class="col-xs-12 col-sm-6">
<address>
<h3><b>{% trans "Billed To:"%}</b></h3>
{% with request.session.billing_address_data as billing_address %}
{{billing_address|get_value_from_dict:'cardholder_name'}}<br> {{billing_address|get_value_from_dict:'street_address'}}, {{billing_address|get_value_from_dict:'postal_code'}}<br>
{{billing_address|get_value_from_dict:'city'}}, {{billing_address|get_value_from_dict:'country'}}.
{% endwith %}
</address>
</div>
</div>
<div class="row">
<div class="col-xs-6">
<address>
<strong>{% trans "Payment Method:"%}</strong><br>
{{cc_brand}} {% trans "ending in" %} **** {{cc_last4}}<br>
{{request.session.user.email}}
</address>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h3><b>{% trans "Order summary"%}</b></h3>
<hr>
<div class="content">
{% with request.session.specs as vm %}
<p><b>{% trans "Cores"%}</b> <span class="pull-right">{{vm.cpu}}</span></p>
<hr>
<p><b>{% trans "Memory"%}</b> <span class="pull-right">{{vm.memory}} GB</span></p>
<hr>
<p><b>{% trans "Disk space"%}</b> <span class="pull-right">{{vm.disk_size}} GB</span></p>
<hr>
<p><b>{% trans "Configuration"%}</b> <span class="pull-right">{{request.session.template.name}}</span></p>
<hr>
<h4>{% trans "Total"%}<p class="pull-right"><b>{{vm.price}} CHF</b><span class="dcl-price-month"> /{% trans "Month" %}</span></p></h4>
{% endwith %}
</div>
<br/>
<form method="post">
{% csrf_token %}
<div class="row">
<div class="col-sm-8">
<p class="dcl-place-order-text">{% blocktrans with vm_price=request.session.specs.price %}By clicking "Place order" this plan will charge your credit card account with the fee of {{ vm_price }}CHF/month{% endblocktrans %}.</p>
</div>
<div class="col-sm-4 content">
<a href="{{next_url}}" ><button class="btn btn-info pull-right">{% trans "Place order"%}</button></a>
</div>
</div>
</form>
</div>
</div>
{% endif %}
</div>
<script type="text/javascript">
window.onload = function () {
var locale_date = moment.utc(document.getElementById("order-created_at").textContent,'YYYY-MM-DD HH:mm').toDate();
locale_date = moment(locale_date).format("YYYY-MM-DD h:mm:ss a");
document.getElementById('order-created_at').innerHTML = locale_date;
};
</script>
{%endblock%}

View file

@ -484,10 +484,10 @@ class OrderConfirmationView(DetailView):
@cache_control(no_cache=True, must_revalidate=True, no_store=True) @cache_control(no_cache=True, must_revalidate=True, no_store=True)
def get(self, request, *args, **kwargs): def get(self, request, *args, **kwargs):
if 'specs' not in request.session or 'user' not in request.session: # if 'specs' not in request.session or 'user' not in request.session:
return HttpResponseRedirect(reverse('datacenterlight:index')) # return HttpResponseRedirect(reverse('datacenterlight:index'))
if 'token' not in request.session: # if 'token' not in request.session:
return HttpResponseRedirect(reverse('datacenterlight:payment')) # return HttpResponseRedirect(reverse('datacenterlight:payment'))
stripe_customer_id = request.session.get('customer') stripe_customer_id = request.session.get('customer')
customer = StripeCustomer.objects.filter(id=stripe_customer_id).first() customer = StripeCustomer.objects.filter(id=stripe_customer_id).first()
stripe_utils = StripeUtils() stripe_utils = StripeUtils()
@ -503,7 +503,8 @@ class OrderConfirmationView(DetailView):
context = { context = {
'site_url': reverse('datacenterlight:index'), 'site_url': reverse('datacenterlight:index'),
'cc_last4': card_details.get('response_object').get('last4'), 'cc_last4': card_details.get('response_object').get('last4'),
'cc_brand': card_details.get('response_object').get('brand') 'cc_brand': card_details.get('response_object').get('brand'),
'vm': request.session.get('specs')
} }
return render(request, self.template_name, context) return render(request, self.template_name, context)

View file

@ -17,10 +17,12 @@
<h1 class="dashboard-title-thin"> <h1 class="dashboard-title-thin">
<img src="{% static 'hosting/img/billing.svg' %}" class="un-icon">{% blocktrans with page_header_text=page_header_text|default:"Invoice" %}{{page_header_text}}{% endblocktrans %} <img src="{% static 'hosting/img/billing.svg' %}" class="un-icon">{% blocktrans with page_header_text=page_header_text|default:"Invoice" %}{{page_header_text}}{% endblocktrans %}
</h1> </h1>
{% if order %}
<div class="dashboard-container-options"> <div class="dashboard-container-options">
<button type="button" class="btn-plain btn-pdf" data-target="#order-detail{{order.pk}}"><img src="{% static 'hosting/img/icon-pdf.svg' %}" class="svg-img"></button> <button type="button" class="btn-plain btn-pdf" data-target="#order-detail{{order.pk}}"><img src="{% static 'hosting/img/icon-pdf.svg' %}" class="svg-img"></button>
<button type="button" class="btn-plain btn-print"><img src="{% static 'hosting/img/icon-print.svg' %}" class="svg-img"></button> <button type="button" class="btn-plain btn-print"><img src="{% static 'hosting/img/icon-print.svg' %}" class="svg-img"></button>
</div> </div>
{% endif %}
</div> </div>
<div class="order-details"> <div class="order-details">
{% if order %} {% if order %}
@ -198,8 +200,10 @@
{%endblock%} {%endblock%}
{% block js_extra %} {% block js_extra %}
{% if order %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>
<script src="{% static 'hosting/js/html2pdf.js' %}"></script> <script src="{% static 'hosting/js/html2pdf.js' %}"></script>
<script src="{% static 'hosting/js/order.js' %}"></script> <script src="{% static 'hosting/js/order.js' %}"></script>
{% endif %}
{% endblock js_extra %} {% endblock js_extra %}