Skip to content

Instantly share code, notes, and snippets.

@marceloleiva

marceloleiva/base.html

Forked from roadsideseb/base.html
Created August 10, 2014 21:08
Show Gist options
  • Save marceloleiva/d93dff66a0315b32e47c to your computer and use it in GitHub Desktop.
Save marceloleiva/d93dff66a0315b32e47c to your computer and use it in GitHub Desktop.
Download ZIP
Raw
base.html
{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
@page {
size: a4 portrait;
margin: 1cm;
margin-left:2cm;
margin-right:2cm;
/* header of the document with top red line
* logo and address on the left and shipping
* address label to peel off on the right.
*/
@frame headerLogo {
top: 23mm;
left: 20mm;
width: 50mm;
height: 24mm;
-pdf-frame-content: headerLogo;
}
@frame headerSender {
top: 54mm;
left: 20mm;
width: 50mm;
height: 23mm;
-pdf-frame-content: headerSender;
}
@frame headerShippingLabel {
top: 23mm;
left: 105mm;
height: 54mm;
width: 85mm;
margin: 5mm;
-pdf-frame-content: headerShippingLabel;
}
/* Shipping address and billing address section
* that is separated by two yellow lines
*/
@frame shippingBillingAddresses{
top: 83mm;
left: 20mm;
right: 20mm;
height: 33mm;
-pdf-frame-content: shippingBillingAddresses;
}
@frame billingAddress{
top: 87mm;
left: 20mm;
right: 105mm;
height: 30mm;
-pdf-frame-content: billingAddress;
}
@frame shippingAddress{
top: 87mm;
left: 85mm;
right: 20mm;
height: 30mm;
-pdf-frame-content: shippingAddress;
}
@frame paymentMethod{
top: 87mm;
left: 140mm;
right: 20mm;
height: 30mm;
-pdf-frame-content: paymentMethod;
}
/* the gift card message section */
@frame deliveryNotes{
top: 120mm;
left: 110mm;
width: 90mm;
height: 24mm;
-pdf-frame-content: deliveryNotes;
}
/* now comes the actual order information */
@frame orderDetails{
top: 150mm;
left: 20mm;
right: 20mm;
height: 18mm;
-pdf-frame-content: orderDetails;
}
@frame footerLeft{
top: 250mm;
left: 20mm;
right: 105mm;
height: 26mm;
-pdf-frame-content: footerLeft;
}
@frame footerRight{
top: 250mm;
left: 105mm;
right: 20mm;
height: 26mm;
-pdf-frame-content: footerRight;
}
@frame pageNumber {
top: 280mm;
right: 20mm;
left: 20mm;
height: 5mm;
-pdf-keep-in-frame-mode: overflow;
-pdf-frame-content: pageNumber;
}
}
@page nextPage {
size: a4 portrait;
margin: 1cm;
@frame headerLogo {
top: 23mm;
left: 20mm;
width: 50mm;
height: 24mm;
-pdf-frame-content: headerLogo;
}
@frame headerSender {
top: 54mm;
left: 20mm;
width: 50mm;
height: 23mm;
-pdf-frame-content: headerSender;
}
/* now comes the actual order information */
@frame orderDetails{
top: 83mm;
left: 20mm;
right: 20mm;
height: 18mm;
-pdf-frame-content: orderDetails;
}
@frame pageNumber {
top: 280mm;
right: 20mm;
left: 20mm;
height: 5mm;
-pdf-keep-in-frame-mode: overflow;
-pdf-frame-content: pageNumber;
}
}
img { zoom: 100%; }
#headerSender{
line-height: 3mm;
-pdf-keep-in-frame-mode: overflow;
}
#headerSender h1{
font-size: 1em;
}
#shippingBillingAddresses {
border-top: 2px solid black;
border-bottom: 2px solid black;
line-height: 15.9mm;
}
#headerShippingLabel {
font-size: 1.5em;
-pdf-keep-in-frame-mode: overflow;
}
#shippingAddress, #billingAddress, #paymentMethod {
-pdf-keep-in-frame-mode: overflow;
}
#deliveryNotes {
-pdf-keep-in-frame-mode: overflow;
}
.table-title {
vertical-align: top;
}
.coloured-table tr{
border-bottom: 1px solid black;
}
.coloured-table th{
width: 25%;
background-color: black;
}
.coloured-table td,th{
vertical-align: justify;
text-align: center;
padding-top: 1mm;
padding-bottom: .5mm;
font-size:8.5pt;
padding-left:1mm;
padding-right:1mm;
}
.turn-page-title {
width: 100%;
text-align: center;
}
.turn-page-title h1 {
font-size: 2em;
}
table {
border-spacing: 0;
border-collapse: collapse;
}
#footerRight td,th {
text-align: left;
}
#footerLeft td, #footerRight td {
padding: 0px;
}
.page-number {
text-align: right;
}
</style>
</head>
<body>
<div id="headerLogo">
<img src="{% static "you/static/image/path/logo-print.png" %}" />
</div>
<div id="headerSender">
{%block pageheader%}
<h1>Fancy Company</h1>
<h3>Tax Invoice</h3>
1 Some Stree<br />
Far Out VIC 9999<br />
Australia<br />
{% endblock %}
</div>
<div id="headerShippingLabel">
{% block shipping-address-label %}
{% endblock %}
</div>
<div id="shippingBillingAddresses"><br></div>
<div id="billingAddress">
<table>
<tr>
<td><strong>Billing Address:</strong></rd>
</tr>
<tr>
<td>{% block billing-address %}{% endblock %}</td>
</tr>
</table>
</div>
<div id="shippingAddress">
<table>
<tr>
<td><strong>Shipping Address:</strong></td>
</tr>
<tr>
<td>{% block shipping-address %}{% endblock %}</td>
</tr>
</table>
</div>
<div id="paymentMethod">
<table>
<tr>
<td><strong>Payment Method:</strong></td>
</tr>
<tr>
<td>{% block payment-method %}{% endblock %}</td>
</tr>
{% block phone-number %}{% endblock %}
</table>
</div>
<div id="deliveryNotes">
<h3>Delivery Instructions:</h3>
{% block delivery-notes %}{% endblock %}
</div>
<div id="orderDetails">
{% block order-details %}{% endblock %}
</div>
<pdf:spacer height='160mm'>
<div>
{% block product-table %}{% endblock %}
{% block order-sums %}{% endblock %}
</div>
<div id="footerLeft">
<strong>Used as a checklist for packing.</strong>
</div>
<div id="footerRight">
<table>
<tr>
<th>Courier used:</th>
</tr>
<tr>
<td style="padding-top: 5mm; border-bottom: 2px solid black"></td>
</tr>
<tr>
<th>Staff member who processed the order:</th>
</tr>
<tr>
<td style="padding-top: 5mm; border-bottom: 2px solid black"></td>
</tr>
</table>
</div>
<div id="pageNumber">
<div class="page-number" style="font-size: .5em;">
Page <pdf:pagenumber />
</div>
</div>
</body>
</html>
Raw
order_packing_slip.html
{% extends "dashboard/orders/pdf/base.html" %}
{% load currency_filters %}
{% block shipping-address-label %}
{% with address=order.shipping_address %}
{% if address.title %}{{ address.title }}{% endif %}
{% if address.first_name %}{{ address.first_name }}{% endif %}
{% if address.last_name %}{{ address.last_name }}<br />{% endif %}
<br />
{{ address.line1 }}<br />
{% if address.line2 %}
{{ address.line2 }}<br />
{% endif %}
{% if address.line3 %}
{{ address.line3 }}<br />
{% endif %}
{{ address.line4 }} {{ address.state }} {{ address.postcode }}<br />
{{ address.country.printable_name }}
{% endwith %}
{% endblock %}
{% block billing-address %}
{% with address=order.billing_address %}
{% if address.title %}{{ address.title }}{% endif %}
{% if address.first_name %}{{ address.first_name }}{% endif %}
{% if address.last_name %}{{ address.last_name }}<br />{% endif %}
<br />
{{ address.line1 }}<br />
{% if address.line2 %}
{{ address.line2 }}<br />
{% endif %}
{% if address.line3 %}
{{ address.line3 }}<br />
{% endif %}
{{ address.line4 }} {{ address.state }} {{ address.postcode }}<br />
{{ address.country.printable_name|truncatechars:30 }}
{% if address.phone_number %}
Phone: {{ address.phone_number }}<br />
{% endif %}
{% endwith %}
{% endblock %}
{% block shipping-address %}
{% with address=order.shipping_address %}
{% if address.title %}{{ address.title }}{% endif %}
{% if address.first_name %}{{ address.first_name }}{% endif %}
{% if address.last_name %}{{ address.last_name }}<br />{% endif %}
<br />
{{ address.line1 }}<br />
{% if address.line2 %}
{{ address.line2 }}<br />
{% endif %}
{% if address.line3 %}
{{ address.line3 }}<br />
{% endif %}
{{ address.line4 }} {{ address.state }} {{ address.postcode }}<br />
{{ address.country.printable_name|truncatechars:30 }}
{% if address.phone_number %}
<br/>
Phone: {{ address.phone_number }}
{% endif %}
{% endwith %}
{% endblock %}
{% block payment-method %}
<ul>
{% for source in order.sources.all %}
<li>{{ source.source_type.name }}</li>
{% endfor %}
</ul>
{% endblock %}
{% block phone-number %}
{% if order.user and order.user.get_profile.phone %}
<tr><td>&nbsp;</td></tr>
<tr>
<td><strong>Contact Number:</strong></td>
</tr>
<tr>
<td>{{ order.user.get_profile.phone }}</td>
</tr>
{% endif %}
{% endblock %}
{% block delivery-notes %}
{% if order.shipping_address.notes %}
{{ order.shipping_address.notes }}
{% else %}
No special delivery instructions.
{% endif %}
{% endblock %}
{% block order-details %}
<table width="100%" class="coloured-table">
<tr>
<th style="text-align: left;">Order Number</th>
<th style="text-align: center;">Purchase Date</th>
<th style="text-align: center;">Shipping Method</th>
<th style="text-align: center;">Lines</th>
</tr>
<tr>
<td style="text-align: left;">{{ order.number }}</td>
<td>{{ order.date_placed|date:"jS M Y" }}</td>
<td>{{ order.shipping_method }}</td>
<td>{{ order.lines.count }}</td>
</tr>
</table>
{% endblock %}
{% block product-table %}
{% with max_on_first=6 max_following=19%}
{% if order.lines.count > max_on_first %}
<div class="turn-page-title">
<h1>Please turn over for full order listing</h1>
<pdf:nexttemplate name="nextPage">
<pdf:nextpage>
<pdf:spacer height='100mm'>
</div>
{% endif %}
{% for line in order.lines.all %}
{% if forloop.first or forloop.counter|divisibleby:max_following %}
{% if not forloop.first %}
</table>
{% if forloop.counter|divisibleby:max_following %}
<pdf:nexttemplate name="nextPage">
<pdf:nextpage>
<pdf:spacer height='100mm'>
{% endif %}
{% endif %}
<table class="coloured-table">
<tr>
<th style="text-align: left; width: 10mm;">Qty<br></th>
<th style="text-align: center; width: 15mm;">SKU<br></th>
<th style="text-align: left;">Product<br></th>
<th style="text-align: center; width: 20mm;">Unit Price<br><small>(incl GST)</small></th>
<th style="text-align: center; width: 20mm;">Total Price<br><small>(incl GST)</small></th>
</tr>
{% endif %}
<tr>
<td style="text-align: left;">{{ line.quantity }}</td>
<td style="text-align: center;">{{ line.product.stockrecord.sku|default:line.partner_sku }}</td>
<td style="text-align: left; vertical-align: top" width="50%">{{ line.title }}</td>
<td style="text-align: center;">{{ line.unit_price_incl_tax|currency }}</td>
<td style="text-align: right;padding-right:2mm">{{ line.line_price_before_discounts_incl_tax|currency }}</td>
</tr>
{% if forloop.last %}
</table>
{% endif %}
{% endfor %}
{% endwith %}
{% endblock %}
{% block order-sums %}
<table class="coloured-table" width="100%">
<tr style="border: none;">
<td colspan="5" style="border-top: 2px solid black; text-align: left;"></td>
<td colspan="2" style="text-align: right; border-top: 2px solid black;"><strong>Total discounts (incl GST)</strong></td>
<td style="text-align: right; border-top: 2px solid black;padding-right:2mm">- {{ order.total_discount_incl_tax|currency }}</td>
</tr>
<tr style="border: none;">
<td colspan="5" style="text-align: left;">
{% if voucher_codes %}
Voucher{% if voucher_codes|length > 1 %}s{% endif %} used:
{% for code in voucher_codes %}
{{ code }}{% if not forloop.last %},{% endif %}
{% endfor %}
{% endif %}
</td>
<td colspan="2" style="text-align: right;"><strong>Shipping (incl GST)</strong></td>
<td style="text-align: right;padding-right:2mm">{{ order.shipping_incl_tax|currency }}</td>
</tr>
<tr style="border: none;">
<td colspan="5"></td>
<td colspan="2" style="text-align: right;"><strong>Total tax 10%</strong></td>
<td style="text-align: right;padding-right:2mm">{{ order.total_tax|currency }}</td>
</tr>
<tr style="border: none;">
<td colspan="5"></td>
<td colspan="2" style="text-align: right; border-bottom: 2px solid black;"><strong>Total (incl. GST)</strong></td>
<td style="text-align: right; border-bottom: 2px solid black;padding-right:2mm">{{ order.total_incl_tax|currency }}</td>
</tr>
</table>
{% endblock %}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment