jack leene
e1b817252c
feat: add feedback functionality and modal for category feedback style: add feedback button styles in CSS docs: add explanation tab for dashboard usage instructions
48 lines
1.7 KiB
Python
48 lines
1.7 KiB
Python
import pandas as pd
|
|
from dash import Dash, dcc, html
|
|
from src.components import (
|
|
bar_chart,
|
|
data_table,
|
|
year_dropdown,
|
|
week_dropdown,
|
|
category_dropdown,
|
|
feedback_tab,
|
|
explanation_tab,
|
|
)
|
|
|
|
def create_layout(app: Dash, data: pd.DataFrame) -> html.Div:
|
|
tab_content_style = {'height': 'calc(100vh - 220px)', 'overflowY': 'auto', 'padding': '15px'}
|
|
|
|
return html.Div(
|
|
className="app-div",
|
|
children=[
|
|
html.H1(app.title),
|
|
html.Hr(),
|
|
dcc.Tabs(id="tabs", value='tab-dashboard', children=[
|
|
dcc.Tab(label='Dashboard', value='tab-dashboard', children=[
|
|
html.Div(style=tab_content_style, children=[
|
|
html.Div(
|
|
className="dropdown-container",
|
|
children=[
|
|
year_dropdown.render(app, data),
|
|
week_dropdown.render(app, data),
|
|
category_dropdown.render(app, data),
|
|
],
|
|
),
|
|
bar_chart.render(app, data),
|
|
data_table.render(app, data),
|
|
])
|
|
]),
|
|
dcc.Tab(label='Feedback', value='tab-feedback', children=[
|
|
html.Div(style=tab_content_style, children=[
|
|
feedback_tab.render(app)
|
|
])
|
|
]),
|
|
dcc.Tab(label='Explanation', value='tab-explanation', children=[
|
|
html.Div(style=tab_content_style, children=[
|
|
explanation_tab.render(app)
|
|
])
|
|
]),
|
|
]),
|
|
],
|
|
) |