diff --git a/core/templates/core/report.html b/core/templates/core/report.html index d2266f0..bc34843 100644 --- a/core/templates/core/report.html +++ b/core/templates/core/report.html @@ -30,6 +30,25 @@ +{# === FILTER PILLS === #} +
+ + {{ start_date|date:"d M Y" }} – {{ end_date|date:"d M Y" }} + + + {{ project_name }} + {% if selected_project_ids %} + × + {% endif %} + + + {{ team_name }} + {% if selected_team_ids %} + × + {% endif %} + +
+

FoxFitt Construction — Payroll Report

diff --git a/core/views.py b/core/views.py index b557aab..8f1cdfe 100644 --- a/core/views.py +++ b/core/views.py @@ -2382,6 +2382,17 @@ def generate_report(request): ) # Pass the raw query params so the "Download PDF" button can use them context['query_string'] = request.GET.urlencode() + # === FILTER PILL CLEAR LINKS === + # For the filter-pill x buttons: rebuild the querystring with one filter removed. + # QueryDict.pop() only removes the first occurrence, so for multi-value keys + # (e.g. project=1&project=2) we follow up with setlist(key, []) to strip them all. + def _qs_without(key): + qd = request.GET.copy() + qd.pop(key, None) + qd.setlist(key, []) + return qd.urlencode() + context['query_string_without_project'] = _qs_without('project') + context['query_string_without_team'] = _qs_without('team') # Pass projects and teams so the "New Report" modal's dropdowns can # populate (same lists the Dashboard modal uses) context['projects'] = Project.objects.all().order_by('name') diff --git a/static/css/custom.css b/static/css/custom.css index 68894ec..cdbba0c 100644 --- a/static/css/custom.css +++ b/static/css/custom.css @@ -1491,3 +1491,34 @@ body, .card, .modal-content, .form-control, .form-select, .work-log-row:hover td { background: var(--bg-card-hover); } + +/* === Report filter pills === */ +.filter-pill { + display: inline-flex; + align-items: center; + padding: 0.35rem 0.75rem; + font-size: 0.825rem; + background: var(--bg-inset); + color: var(--text-primary); + border: 1px solid var(--border-default); + border-radius: 999px; + line-height: 1.2; +} +.filter-pill i { + color: var(--accent); + font-size: 0.75rem; +} +.filter-pill__x { + margin-left: 0.5rem; + padding: 0 0.35rem; + color: var(--text-tertiary); + text-decoration: none; + font-weight: 600; + border-radius: 50%; + transition: color 120ms, background-color 120ms; +} +.filter-pill__x:hover { + color: var(--text-primary); + background: var(--bg-card-hover); + text-decoration: none; +}