Edit Dashboard | SeekTable

^* Name

Enable Exports

All-dashboard exports to download multiple reports as a one file.

^* HTML Template Hint: use copy-paste to edit HTML code in your favourite editor (VSCode, Notepad++ etc).

<div class="stFilter">
<Widget:Parameter>{"CubeId":"48bd26aa515641b19fdcfecb3ac4c88b","ParameterName":"filter_customer_id"}</Widget:Parameter>
<Widget:Parameter>{"CubeId":"48bd26aa515641b19fdcfecb3ac4c88b","ParameterName":"filter_order_id"}</Widget:Parameter>
</div>

<div class="orderIdNotSelected" style="padding:20px;margin-right:10px;background-color:#F0F0F0;text-align:center;font-size:14px;display:none;">Please select an order.</div>

<div class="orderIdSelected" style="display:none;">

<style>
.customerInfo {
 font-size:14px;
}
.customerInfo th, .customerInfo td { padding-bottom:5px; vertical-align:top; border:0px; }
.customerInfo th { padding-right:20px; }
</style>

<script type="text/template" id="customerInfoTpl">

<div style="padding:20px;background-color:#F0F0F0;">
  <div style="float:left; font-size:30px;">
     Northwind Company
  </div>
  <div style="float:right;">
     <div style="font-weight:bold; font-size:30px; color:#999;">INVOICE</div>
     <div style="font-size:12px; text-align:right;">Invoice №: <span class="OrderID"/></div>
     <div style="font-size:12px; text-align:right;">Order Date: <span class="OrderDate"/></div>
  </div>
  <div style="clear:both;"></div>
</div>

<div style="float:right; margin-top:40px;">
<div style="border-bottom:1px solid black;font-size:14px;margin-bottom:5px;">Bill to</div>
<table class="customerInfo">
<tr>
   <th>Company:</th><td class="CompanyName"></td>
</tr>
<tr>
   <th>Contact Name:</th><td class="ContactName"></td>
</tr>
<tr>
   <th>Address:</th>
   <td>
    <div class="Address"></div>
    <div><span class="City"/>, <span class="PostalCode"/></div>
    <div class="Country"></div>
   </td>
</tr>
<tr>
   <th>Phone:</th><td class="Phone"></td>
</tr>
</table>
</div>
<div style="clear:both;"></div>
</script>

<Widget:Report>{
 "ReportId":"cf976bd9a76743a89f5a54570a67c40a",
 "ClientCustomRenderFunction": "renderCustomerInfo",
 "ApplyParameters": { "filter_order_id":"filter_order_id" }
}</Widget:Report>
<script>
function renderCustomerInfo(context) {
 console.log(context.reportData);
 var orderSelected = context.reportData.Data.length==1;
 $('.orderIdSelected').toggle(orderSelected );
 $('.orderIdNotSelected').toggle(!orderSelected);
 if (!orderSelected)  return;
 context.$el.html( $('#customerInfoTpl').html() );
 var $orderEl = $('.orderIdSelected');
 var orderRow = context.reportData.Data[0];
 for (var i=0; i<context.reportData.Columns.length; i++) {
  var colName = context.reportData.Columns[i];
  var colVal = orderRow[i];
  $orderEl.find('.'+colName.Name).text(colVal);
 }
}
</script>

<style>
.invoiceLineItems { margin-top:40px; margin-bottom:20px;}
.invoiceLineItems th { background-color:transparent !important; }
.invoiceLineItems th.pvtRowLabel { width:70% !important; color:black !important; }
.invoiceLineItems th.pvtMeasure { width:10% !important; }
.invoiceLineItems td, .invoiceLineItems th  { border-right: none !important; border-left: none !important; padding:5px; }
.invoiceLineItems table { border:none !important!; font-size: 14px; }
.invoiceLineItems tr:last-child th, .invoiceLineItems tr:last-child td { border-bottom:none !important; }
.invoiceLineItems th.pvtRowLabel, .invoiceLineItems th.pvtColumn { border-top:none !important; }
.invoiceLineItems tr:not(:last-child) td, .invoiceLineItems th.pvtRow { font-weight:normal !important; }
</style>
<div class="invoiceLineItems">
<Widget:Report>{
"ReportId":"9aa49b503fac432a943ee75aa827f829",
"Static":true,
"ApplyParameters": { "filter_order_id":"filter_order_id" }
}</Widget:Report>
</div>

<div style='text-align:center;'><a href="#" class="stExportButton" data-format="pdf" data-loadingspinner="true">Generate Invoice PDF</a></div>

</div>

Insert report Insert parameter Insert "Filter" button Template reference

Cancel