93 lines
3.2 KiB
HTML
93 lines
3.2 KiB
HTML
{% extends "layout.html" %}
|
|
{% block content %}
|
|
<div class="page-wide">
|
|
<div class="panel" style="width:100%;margin:0;">
|
|
<div class="panel toolbar" style="justify-content:space-between;flex-wrap:wrap;">
|
|
<div>
|
|
<div class="panel-title">Time Period Overview</div>
|
|
<div class="label">Period: <strong>{{ period_name }}</strong></div>
|
|
</div>
|
|
<div class="inline" style="gap:8px;">
|
|
<a class="btn" href="/review?timesheet_id={{ timesheet_id }}">Back to Review</a>
|
|
<button class="btn" type="button" onclick="openPrint('/overview/print?timesheet_id={{ timesheet_id }}')">Print Overview</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel" style="width:100%;margin:0;">
|
|
<div class="table-wrap" style="width:100%;">
|
|
<table class="table" style="width:100%;">
|
|
<thead>
|
|
<tr>
|
|
<th>Employee</th>
|
|
<th class="num">Regular</th>
|
|
<th class="num">Overtime</th>
|
|
<th class="num">PTO</th>
|
|
<th class="num">Holiday</th>
|
|
<th class="num">Other</th>
|
|
<th class="num">Paid Total</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for b in bundles %}
|
|
<tr>
|
|
<td>{{ b.employee.name }}</td>
|
|
<td class="num mono">{{ b.grouped.totals.regular|fmt2 }}</td>
|
|
<td class="num mono">{{ b.grouped.totals.overtime|fmt2 }}</td>
|
|
<td class="num mono">{{ b.grouped.totals.pto|fmt2 }}</td>
|
|
<td class="num mono">{{ b.grouped.totals.holiday|fmt2 }}</td>
|
|
<td class="num mono">{{ b.grouped.totals.bereavement|fmt2 }}</td>
|
|
<td class="num mono">{{ b.grouped.totals.paid_total|fmt2 }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
<tfoot>
|
|
<tr class="total">
|
|
<td>Total</td>
|
|
<td class="num mono">{{ totals.regular|fmt2 }}</td>
|
|
<td class="num mono">{{ totals.overtime|fmt2 }}</td>
|
|
<td class="num mono">{{ totals.pto|fmt2 }}</td>
|
|
<td class="num mono">{{ totals.holiday|fmt2 }}</td>
|
|
<td class="num mono">{{ totals.bereavement|fmt2 }}</td>
|
|
<td class="num mono">{{ totals.paid_total|fmt2 }}</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Hidden iframe used for printing without leaving the overview page -->
|
|
<iframe id="print-iframe" style="position:fixed; inset:0; width:0; height:0; border:0; visibility:hidden;"></iframe>
|
|
|
|
<script>
|
|
function openPrint(url) {
|
|
const iframe = document.getElementById('print-iframe');
|
|
iframe.src = url;
|
|
}
|
|
window.addEventListener('message', function (e) {
|
|
if (e && e.data && e.data.type === 'close-print') {
|
|
const iframe = document.getElementById('print-iframe');
|
|
if (iframe) {
|
|
iframe.removeAttribute('src'); // unload
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<style>
|
|
/* Uniform button sizing across this page */
|
|
.btn, .panel .btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
min-height: 36px;
|
|
padding: 0 14px;
|
|
font-size: 14px;
|
|
line-height: 1;
|
|
box-sizing: border-box;
|
|
}
|
|
.table thead th { text-align: left; }
|
|
.table .num { text-align: right; }
|
|
</style>
|
|
{% endblock %} |