<script>
function sOrder(sO) {
  var sOrd = document.getElementById("s_order");
  var sCat = document.getElementById("s_cat");

  if (sCat.value == sO) {
    if (sOrd.value == '1')
      sOrd.value = '2';
    else
      sOrd.value = '1';
  }
  else {
    sCat.value = sO;
    sOrd.value = '1';
  }

  document.cdrForm.submit();

}
</script>
<a href="/?data[logout]=yes">Log Out</a>
<h1>Call Detail Report</h1>
<hr />
<form name="cdrForm" method="post" action="{SELF}">
<input type="hidden" name="data[s_cat]" value="{S_CAT}" id="s_cat">
<input type="hidden" name="data[s_order]" value="{S_ORDER}" id="s_order">
<table>
<tr>
  <td>Date Range:</td>
  <td><input type="text" name="data[start]" value="{START}"> - <input type="text" name="data[end]" value="{END}"></td>
</tr>
<tr>
  <td>&nbsp;</td>
  <td><input type="submit" name="data[filter]" value="Filter"></td>
</tr>
</table>
<table class="paymentMethods">
  <tr>
  <td colspan="10">
  </td>
  </tr>
  <tr>
    <th><a href="#" onClick="sOrder(1);">Date</a></th>
    <th><a href="#" onClick="sOrder(2);">Origination</a></th>
    <th><a href="#" onClick="sOrder(3);">Call Path</a></th>
    <th><a href="#" onClick="sOrder(4);">Destination</a></th>
    <th><a href="#" onClick="sOrder(7);">Duration</a></th>
    <th><a href="#" onClick="sOrder(5);">Disposition</a></th>
    <th>Recording</th>
  </tr>
{ROWS}
</table>
<br /><br />
<strong>
Total Calls: {TOTAL_CALLS}<br />
Total Talk Time: {TOTAL_TALK} Minutes<br />
</strong>
<!-- <a href="/csv.php?data[start]={START}&data[end]={END}&data[ext]={EXT}">Download CSV</a> -->
</form>