Andrew Charlwood
7e0c851063
Extract chart type toggle and date filter dropdowns from filter_bar.py into a new sub-header component. Sub-header is fixed-position below the main header, visible across both views. Filter bar now contains only drug/trust/directorate buttons for Patient Pathways view.
84 lines
3.1 KiB
Python
84 lines
3.1 KiB
Python
"""Global filter sub-header — chart type toggle + date filter dropdowns.
|
|
|
|
Fixed bar below the main header, constant across both views.
|
|
"""
|
|
from dash import html, dcc
|
|
|
|
|
|
def make_sub_header():
|
|
"""Return the global filter sub-header bar."""
|
|
return html.Div(
|
|
className="sub-header",
|
|
children=[
|
|
# Chart type toggle
|
|
html.Div(
|
|
className="sub-header__group",
|
|
children=[
|
|
html.Span("View", className="sub-header__label"),
|
|
html.Div(
|
|
className="toggle-pills",
|
|
role="radiogroup",
|
|
**{"aria-label": "Chart view type"},
|
|
children=[
|
|
html.Button(
|
|
"By Directory",
|
|
id="chart-type-directory",
|
|
className="toggle-pill toggle-pill--active",
|
|
role="radio",
|
|
n_clicks=0,
|
|
**{"aria-checked": "true"},
|
|
),
|
|
html.Button(
|
|
"By Indication",
|
|
id="chart-type-indication",
|
|
className="toggle-pill",
|
|
role="radio",
|
|
n_clicks=0,
|
|
**{"aria-checked": "false"},
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
# Divider
|
|
html.Div(className="sub-header__divider"),
|
|
# Initiated filter
|
|
html.Div(
|
|
className="sub-header__group",
|
|
children=[
|
|
html.Span("Initiated", className="sub-header__label"),
|
|
dcc.Dropdown(
|
|
id="filter-initiated",
|
|
options=[
|
|
{"label": "All years", "value": "all"},
|
|
{"label": "Last 2 years", "value": "2yr"},
|
|
{"label": "Last 1 year", "value": "1yr"},
|
|
],
|
|
value="all",
|
|
clearable=False,
|
|
searchable=False,
|
|
className="filter-dropdown",
|
|
),
|
|
],
|
|
),
|
|
# Last seen filter
|
|
html.Div(
|
|
className="sub-header__group",
|
|
children=[
|
|
html.Span("Last seen", className="sub-header__label"),
|
|
dcc.Dropdown(
|
|
id="filter-last-seen",
|
|
options=[
|
|
{"label": "Last 6 months", "value": "6mo"},
|
|
{"label": "Last 12 months", "value": "12mo"},
|
|
],
|
|
value="6mo",
|
|
clearable=False,
|
|
searchable=False,
|
|
className="filter-dropdown",
|
|
),
|
|
],
|
|
),
|
|
],
|
|
)
|