admin/38686-vm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Report: Chapter I (lifetime context) + chapter numbering

Browse Source 
Replaces the old narrow four-card All-Time/YTD row (dropped in Task 9)
with two wider cards under a numbered 'Chapter I - Lifetime Context'
heading. Projects card gains Start, Working Days, Total Cost, and
Avg R / Working Day columns per the design. Teams card keeps name +
total.

Adds .chapter-heading and .chapter-num CSS for the orange numbered
markers (I, II, III, IV) and .report-numeric class that applies
tabular-nums across the number columns of every report table.

Renames the existing 'Selected Period' heading to Chapter II.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Konrad du Plessis 2026-04-22 23:43:14 +02:00
parent 9632214f99
commit 68c9afd939
2 changed files with 97 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

65
core/templates/core/report.html
View File

@ -90,15 +90,74 @@
</div>
</div>
{# === CHAPTER I — Lifetime Context === #}
<h5 class="chapter-heading mb-3"><span class="chapter-num">I</span>Lifetime Context</h5>
<div class="row g-3 mb-4">
<div class="col-lg-7">
<div class="card h-100">
<div class="card-header py-3">
<h6 class="m-0 fw-bold"><i class="fas fa-project-diagram me-2" style="color: var(--accent);"></i>All Time &mdash; Projects</h6>
</div>
<div class="card-body p-0">
{% if alltime_projects %}
<div class="table-responsive">
<table class="table table-sm mb-0 report-numeric">
<thead>
<tr>
<th>Project</th>
<th>Start</th>
<th class="text-end">Working Days</th>
<th class="text-end">Total Cost</th>
<th class="text-end">Avg R / Working Day</th>
</tr>
</thead>
<tbody>
{% for item in alltime_projects %}
<tr>
<td class="fw-medium">{{ item.project }}</td>
<td>{% if item.start_date %}{{ item.start_date|date:"d M Y" }}{% else %}<span class="text-muted">&mdash;</span>{% endif %}</td>
<td class="text-end">{{ item.working_days|default:"—" }}</td>
<td class="text-end fw-semibold">R {{ item.total|money }}</td>
<td class="text-end">{% if item.working_days %}R {{ item.avg_per_working_day|money }}{% else %}<span class="text-muted">&mdash;</span>{% endif %}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}<p class="text-muted text-center py-3 mb-0">No lifetime project data.</p>{% endif %}
</div>
</div>
</div>
<div class="col-lg-5">
<div class="card h-100">
<div class="card-header py-3">
<h6 class="m-0 fw-bold"><i class="fas fa-users me-2" style="color: var(--accent);"></i>All Time &mdash; Teams</h6>
</div>
<div class="card-body p-0">
{% if alltime_teams %}
<div class="table-responsive">
<table class="table table-sm mb-0 report-numeric">
<thead><tr><th>Team</th><th class="text-end">Total Cost</th></tr></thead>
<tbody>
{% for item in alltime_teams %}
<tr><td>{{ item.team }}</td><td class="text-end fw-semibold">R {{ item.total|money }}</td></tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}<p class="text-muted text-center py-3 mb-0">No lifetime team data.</p>{% endif %}
</div>
</div>
</div>
</div>
<!-- ===================================================================
SELECTED PERIOD — detailed breakdown
Summary cards (totals for the chosen date range) now live here
under the Selected Period heading, grouped as Loans pair and
Advances pair for quick scanning.
=================================================================== -->
<h5 class="fw-bold mb-3" style="color: var(--text-primary);">
<i class="fas fa-filter me-2" style="color: var(--accent);"></i>Selected Period: {{ start_date|date:"d M Y" }} &mdash; {{ end_date|date:"d M Y" }}
</h5>
<h5 class="chapter-heading mb-3"><span class="chapter-num">II</span>Selected Period: {{ start_date|date:"d M Y" }} &ndash; {{ end_date|date:"d M Y" }}</h5>
<!-- === SUMMARY CARDS — scoped to the selected period === -->
<!-- Order: Total Paid Out, Worker-Days, Loans pair, Advances pair -->

35
static/css/custom.css
View File

@ -1686,3 +1686,38 @@ body, .card, .modal-content, .form-control, .form-select,
color: var(--text-tertiary);
margin-top: 0.6rem;
}
/* === Report chapter headings === */
/*
Numbered chapter markers (I, II, III, IV) on the executive report.
Each heading has an orange filled circle with the Roman numeral
followed by the chapter title. Used on Chapter I (Lifetime Context),
II (Selected Period), III (Worker Breakdown), IV (Team x Project).
*/
.chapter-heading {
display: flex;
align-items: center;
gap: 0.75rem;
color: var(--text-primary);
font-family: 'Poppins', sans-serif;
font-weight: 600;
}
.chapter-heading .chapter-num {
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.85rem;
height: 1.85rem;
border-radius: 50%;
background: var(--accent);
color: #fff;
font-size: 0.85rem;
font-weight: 700;
font-family: 'Inter', sans-serif;
}
/* tabular-nums for all numeric report tables */
.report-numeric td,
.report-numeric th {
font-variant-numeric: tabular-nums;
}