<script>
  $(function() {
    $( "#start_date" ).datepicker();
    $( "#start_date" ).datepicker( "option", "dateFormat", "yy-mm-dd");
    $( "#start_date" ).datepicker( "setDate", "{START_DATE}");
    $( "#end_date" ).datepicker();
    $( "#end_date" ).datepicker( "option", "dateFormat", "yy-mm-dd");
    $( "#end_date" ).datepicker( "setDate", "{END_DATE}");
  });
</script>
<h1>Dialer Campaign Call Report</h1>
<hr />
<form method="post" action="{SELF}">
<h2>Report Parameters:</h2>
<table class="crSettings"">
<tr>
  <th style="width: 30px;\">&nbsp;</th>
  <th style="width: 80px;">Date Range</th>
  <th style="text-align: center;">Campaign(s)</th>
  <th>&nbsp;</th>
</tr>
<tr>
  <td>From:</td>
  <td><input type="text" name="data[start_date]" value="{START_DATE}" size="10" id="start_date"></td>
  <td rowspan="2"><select name="data[dialer_cid][]" multiple>{CAMPAIGNS}</select></td>
  <td rowspan="2"><input type="submit" value="Update"></td>
</tr>
<tr>
  <td>To:</td>
  <td><input type="text" name="data[end_date]" value="{END_DATE}" size="10" id="end_date"></td>
</tr>
</table>
<h2>Outbound Calling Stats</h2>
<table class="ocsCR">
<tr>
  <th>Total Calls Placed:</th>
  <td>{TOTAL_CALLS}</td>
</tr>
<tr>
  <th>Average Call Length:</th>
  <td>{AVERAGE_CALL}</td>
</tr>
<tr>
  <th>Total Transfered Calls:</th>
  <td>{TRANSFERED_TOTAL}</td>
</tr>
<tr>
  <th>Average Call Length Transfered Calls:</th>
  <td>{AVERAGE_TRANSFERED_CALL}</td>
</tr>
</table>
<h2>Call Status Stats</h2>
</form>
<table class="paymentMethods">
<tr>
  <th>Code</td>
  <th>Description</th>
  <th>Calls</th>
  <th>Total Time</th>
  <th>AVG Time</th>
  <th>CPM</th>
  <th>Total Cost</th>
</tr>
{ROWS}
<tr style="font-weight: bold;">
  <td>Total:</td>
  <td>&nbsp;</td>
  <td>{TOTAL_CALLS}</td>
  <td>{TOTAL_TIME}</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>${TOTAL_COST}</td>
</tr>
</table>