Jira code: BTN-1223
Email template for the invoice record – packing list. This template is same as the Invoice PDF but no pricing, amounts and etc.
- Try to create the email template as a set of tables and set a proper width for all tables. Otherwise, it will show full width in mails, and which is not looks good in outlook, mail app, etc..
<html><head>
<style type="text/css">.headerRow {
font-weight: bold;
font-size: 8pt;
vertical-align: middle;
color: #000000;
margin-right: 6px;
border-color: #000000;
font-family: sans-serif;
}
p {
font-family: sans-serif;
}
th {
margin-left: 10px;
padding-bottom: 0px;
font-family: sans-serif;
}
.headerTH {
margin-right: 6px;
padding-bottom: 0px;
color: #185A7D;
font-weight: 500;
font-family: sans-serif;
}
td {
padding: 4px;
}
.title {
font-size: 30pt;
color: #185A7D;
font-family: sans-serif;
}
.titleSub {
font-size: 15px;
color: #185A7D;
font-family: sans-serif;
}
.number {
font-size: 16pt;
font-family: sans-serif;
}
.header2 {
font-size: 8pzt;
font-weight: 500;
margin-right: 6px;
color: #185A7D;
font-family: sans-serif;
font-size: 12px;
}
.header2Data {
background-color: #ededed;
margin-right: 6px;
color: #000000;
font-family: sans-serif;
font-size: 12px;
}
.fullListTHClass {
color: #000000;
font-weight: 500;
text-align: left;
font-family: sans-serif;
}
.listRowClass tr {
background: #185A7D;
font-family: sans-serif;
}
.listRowClass tr:nth-child(odd) {
background: #185A7D;
font-family: sans-serif;
}
.listRowClass tr:nth-child(even) {
background: #185A7D;
font-family: sans-serif;
}
.confirmButton {
background-color: #185A7D;
color: black;
text-align: center;
text-decoration: none;
display: inline-block;
width: 150pt;
height: 15px;
font-weight: bold;
}
.requestButton {
background-color: #185A7D;
color: white;
text-align: center;
text-decoration: none;
display: inline-block;
width: 150pt;
height: 15px;
font-weight: bold;
}
#pgn {
position: relative;
}
#pgn-content {
position: absolute;
bottom: 0;
left: 0;
}
.instructionClass {
display: inline-block;
}
.totalClass {
display: inline-block;
font-family: sans-serif;
}
#div1Head {
font-size: 20px;
}
#div2Para {
display: table;
margin: 0px auto 0px auto;
padding: 5px;
font-size: 12px;
background-color: #185A7D;
font-family: sans-serif;
}
#div3Para {
font-size: 10px;
font-family: sans-serif;
}
.pageNumClass {
font-size: 10px;
font-family: sans-serif;
}
.nameandaddress {
font-size: 11px;
font-family: sans-serif;
}
a {
color: #000;
text-decoration: none;
}
a:hover {
color: #607d8b;
}
</style>
</head><body style="font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;" width="600px" style="width: 600px;">
<table align="center" cellpadding="0" cellspacing="0" style="margin: 0 auto; width: 600px">
<tbody>
<tr style="width: 600px;" width="600px">
<td align="left" style="width: 200px;font-size: 15px;" width="200px"><span class="titleSub">Hi, here's your </span><br />
<font color="#185a7d" face="sans-serif"><span style="font-size: 15px;">Packing list</span></font></td>
<td style="width: 200px;" width="200px"><img src="https://www.cricket.balajiwireless.com/Images/Cricket/BalajiB-w.jpg" width="140" /></td>
<td style="width: 200px;" width="200px"><span class="nameandaddress">${companyInformation.companyName}</span><br />
<span class="nameandaddress">${companyInformation.addressText}</span></td>
</tr>
</tbody>
</table>
<table align="center" cellpadding="0" cellspacing="0" style="margin: 0 auto; width: 600px">
<tbody>
<tr>
<th align="left" class="headerTH" style="width: 200px;" width="200px">INV#</th>
<th align="left" class="headerTH" style="width: 200px;" width="200px">Created From</th>
<th align="left" class="headerTH" style="width: 200px;" width="200px">Customer PO#</th>
</tr>
<tr>
<td align="left" class="headerRow" height="30px" style="width: 200px;background-color:#ededed;height:30px;border: 1px solid white;" width="200px">${transaction.tranid}</td>
<td align="left" class="headerRow" height="30px" style="width: 200px;background-color:#ededed;height:30px;border: 1px solid white;" width="200px">
<p style="text-align:left">${transaction.createdfrom}</p>
</td>
<td align="left" class="headerRow" height="30px" style="width: 200px;background-color:#ededed;height:30px;border: 1px solid white;" width="200px">${transaction.otherrefnum}</td>
</tr>
</tbody>
</table>
<table align="center" cellpadding="0" cellspacing="0" style="margin: 0 auto; width: 600px;">
<tbody>
<tr>
<th align="left" class="headerTH" style="width: 200px;" width="200px">Invoice Date</th>
<th align="left" class="headerTH" style="width: 200px;" width="200px">Contact/Rep</th>
<th align="left" class="headerTH" style="width: 200px;" width="200px">Customer ID</th>
</tr>
<tr>
<td align="left" class="headerRow" height="30px" style="width: 200px;background:#ededed;height:30px;border: 1px solid white;" width="200px">${transaction.trandate}</td>
<td align="left" class="headerRow" height="30px" style="width: 200px;background:#ededed;height:30px;border: 1px solid white;" width="200px">${transaction.salesrep}</td>
<td align="left" class="headerRow" height="30px" style="width: 200px;background:#ededed;height:30px;border: 1px solid white;" width="200px">${transaction.entity.id}</td>
</tr>
</tbody>
</table>
<table align="center" cellpadding="0" cellspacing="0" style="margin: 0 auto; width: 600px;">
<tbody>
<tr>
<td style="width: 300px;font-weight: 700;" width="300px">${transaction.billaddress@label}:</td>
<td style="width: 300px;font-weight: 700;" width="300px">${transaction.shipaddress@label}:</td>
</tr>
<tr>
<td style="width: 300px;" width="300px">${transaction.billaddress}</td>
<td style="width: 300px;" width="300px">${transaction.shipaddress}<br />
</td>
</tr>
<tr>
<td colspan="2" style="width: 300px;font-weight: 700;" width="300px">Shipping Details:</td>
</tr>
<tr>
<td colspan="2" style="width: 300px;" width="300px">${transaction.shipmethod@label}: ${transaction.shipmethod}<br />
Ship Date: ${transaction.shipdate}
<p style="text-align:left;padding-top:-10px;"><b>Tracking #:</b><br />
${transaction.trackingnumbers}</p>
</td>
</tr>
</tbody>
</table>
<#if transaction.item?has_content>
<table align="center" cellpadding="0" cellspacing="0" style="margin: 0 auto; width: 600px;"><#list transaction.item as item><#if item.quantity!=0><#if item_index==0>
<thead style="border-color:#000000;background-color:#ededed">
<tr height="20px" style="margin-top:8px; margin-bottom:8px;font-size:13px;">
<th style="width: 100px;border: 1px solid white;line-height: 1.5;" width="100px">
<p style="text-align:center;">Quantity Ordered</p>
</th>
<th style="width: 100px;border: 1px solid white;line-height: 1.5;" width="100px">
<p style="text-align:center;">Quantity Shipped</p>
</th>
<th style="width: 50px;border: 1px solid white;line-height: 1.5;" width="100px">Qty</th>
<th style="width: 450px;border: 1px solid white;line-height: 1.5;" width="300px">${item.item@label}</th>
</tr>
</thead>
</#if>
<tbody>
<tr class="listRow">
<td style="width: 100px;text-align:center;" width="100px">${item.quantityordered}</td>
<td style="width: 100px;text-align:center;" width="100px">${item.quantity}</td>
<td style="width: 50px;" width="100px">${item.quantity}</td>
<td style="width: 450px;" width="300px"><b>${item.item}</b><br />
${item.description}<br />
${item.custcol_bwv_upc}</td>
</tr>
</#if></#list>
</tbody>
</table>
</#if><br />
<table align="center" cellpadding="0" cellspacing="0" style="margin: 0 auto; width: 600px;">
<tbody>
<tr>
<td><b align="center" style="width: 600px;" width="600px">THANK YOU AGAIN FOR YOUR BUSINESS!</b>
<p>Questions regarding this packing list? Please contact:</p>
</td>
</tr>
</tbody>
</table>
<table align="center" cellpadding="0" cellspacing="0" style="margin: 0 auto; width: 600px;">
<tbody>
<tr>
<td style="width: 600px;" width="600px"><#if transaction.salesrep.email?has_content>
<p align="left" style="color:#000000;font-size:12px;text-decoration:none !important;" text-decoration="none"><b><span style="font-size:9.0pt;color:black"><a href="mailto:${transaction.salesrep.email}" style="text-decoration: none;" target="_blank">${transaction.salesrep.email}</a> </span></b></p>
<#else>
<p align="left" style="color:#000000;font-size:12px;text-decoration:none !important;" text-decoration="none"><b><span style="font-size:9.0pt;color:black"><a href="mailto:info@balajiwireless.com" style="text-decoration: none;" target="_blank">info@balajiwireless.com </a> </span></b></p>
</#if><#if transaction.salesrep.phone?has_content>
<p align="left" style="color:#000000;font-size:12px;text-decoration:none !important;" text-decoration="none"><b><a href="tel:${transaction.salesrep.phone}" style="text-decoration: none !important;">${transaction.salesrep.phone}</a></b></p>
<#else>
<p align="left" style="color:#000000;font-size:12px;text-decoration:none !important;" text-decoration="none"><b><a href="tel:909-444-7999" style="text-decoration: none !important;">909-444-7999</a></b></p>
</#if></td>
</tr>
</tbody>
</table>
</body></html>