<div class="page-header">
    <h3>Transaction overview</h3>
</div>

<form method="post">
<div class="row">
    <div class="span6">

        <div># Queries: ${count}</div>
        <div>Time span: ${deltaTime} (${fromTime} - ${toTime})</div>
        <div>Avg. time/query: ${avgTime}</div>
    </div>
    <div class="span3 pull-right">
        <input type="submit" name="action" value="Clear queries" class="btn btn-danger" />
    </div>
</div>
</form>

<ul class="nav nav-pills">
    <li ${if(sortTotalTime)}class="active"${/if}><a href="/transactions/total">Total time</a></li>
    <li ${if(sortQueryTime)}class="active"${/if}><a href="/transactions/query">Query time</a></li>
    <li ${if(sortAvgTime)}class="active"${/if}><a href="/transactions/average">Avg. time</a></li>
    <li ${if(sortTotalCalls)}class="active"${/if}><a href="/transactions/calls"># Queries</a></li>
</ul>

<table class="table table-condensed table-striped " id="overview">
    <thead>
    <tr>
        <th> </th>
        <th>Total time (ms)</th>
        <th>Query time (ms)</th>
        <th>Avg. time (ms)</th>
        <th># Queries</th>
        <th>Sql</th>
    </tr>
    </thead>
    <tbody>
    ${each(transactions as t)}
    <tr>
        <td><a href="/transaction/${each(t.queries as q)}${q.hash}_${q.nano}/${eachlast}${q.hash}_${q.nano}${/each}"><i class=" icon-zoom-in"></i></a></td>
        <td>${t.formattedTotalTime}</td>
        <td>${t.formattedQueryTime}</td>
        <td>${t.formattedAvgTime}</td>
        <td>${t.count}</td>
        <td><pre><code class="sql">${!t.sql}</code></pre></td>
    </tr>
    ${/each}
    </tbody>
</table>