<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>Predictive Campaign Call Report</h1>
<hr />
<form name="dialer_report" 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>{DIALER_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>Dropped Calls:</th>
  <td>{TOTAL_DROP}</td>
</tr>
<tr>
  <th>Average Call Length:</th>
  <td>{AVERAGE_CALL}</td>
</tr>
<tr>
  <th>Total Human Answered Calls:</th>
  <td>{HUMAN_TOTAL}</td>
</tr>
<tr>
  <th>Average Call Length Human Answered Calls:</th>
  <td>{AVERAGE_HUMAN_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>
{DIALER_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>