admin/HighCostDrugsDemo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: header fraction KPIs replacing KPI row (Task 10.3)

Browse Source 
Remove KPI card row, add 3 inline fraction KPIs to header bar:
filtered/total patients, drugs, cost. Breadcrumb removed.
KPI callback refactored for 6 output IDs (3 filtered + 3 total).
total_cost added to load_initial_data() reference data.
This commit is contained in:
Andrew Charlwood
2026-02-06 21:45:13 +00:00
parent 6c9f68d880
commit 11b5cc5b81
6 changed files with 131 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dash_app/components/header.py
+27 -9
View File
@@ -1,13 +1,13 @@
"""Top header bar component matching 01_nhs_classic.html design."""
"""Top header bar component with NHS branding, fraction KPIs, and data freshness."""
from dash import html
def make_header():
"""Return the fixed top header with NHS branding and data freshness indicators."""
"""Return the fixed top header with NHS branding, fraction KPIs, and freshness indicators."""
return html.Header(
className="top-header",
children=[
# Brand area (NHS logo + title) with angled clip-path
# Left: brand (NHS logo + title)
html.Div(
className="top-header__brand",
children=[
@@ -17,15 +17,33 @@ def make_header():
),
],
),
# Breadcrumb
# Center: 3 fraction KPIs (filtered / total)
html.Div(
className="top-header__breadcrumb",
className="top-header__kpis",
children=[
"Dashboard \u203A ",
html.Strong("Pathway Analysis"),
html.Div(className="header-kpi", children=[
html.Span("—", id="kpi-filtered-patients", className="header-kpi__num"),
html.Span(" / ", className="header-kpi__sep"),
html.Span("—", id="kpi-total-patients", className="header-kpi__den"),
html.Span("patients", className="header-kpi__label"),
]),
html.Div(className="header-kpi", children=[
html.Span("—", id="kpi-filtered-drugs", className="header-kpi__num"),
html.Span(" / ", className="header-kpi__sep"),
html.Span("—", id="kpi-total-drugs", className="header-kpi__den"),
html.Span("drugs", className="header-kpi__label"),
]),
html.Div(className="header-kpi", children=[
html.Span("—", id="kpi-filtered-cost", className="header-kpi__num"),
html.Span(" / ", className="header-kpi__sep"),
html.Span("—", id="kpi-total-cost", className="header-kpi__den"),
html.Span("cost", className="header-kpi__label"),
]),
],
),
# Right side: status dot + record count + last updated
# Right: data freshness (status dot + record count + last updated)
html.Div(
className="top-header__right",
children=[
@@ -37,7 +55,7 @@ def make_header():
),
html.Span(
children=[
"Last updated: ",
"Updated: ",
html.Span("...", id="header-last-updated"),
],
),