From: Tibor Frank Date: Wed, 27 Apr 2022 08:28:47 +0000 (+0200) Subject: feat(uti): Add offcanvas to stats X-Git-Url: https://gerrit.fd.io/r/gitweb?p=csit.git;a=commitdiff_plain;h=cb61767fb2133890a786fc8f580109e9f8f3c5c5 feat(uti): Add offcanvas to stats Change-Id: I5d807944b0158e51998bfc709a87d9d6c826112c Signed-off-by: Tibor Frank --- diff --git a/resources/tools/dash/app/pal/stats/layout.py b/resources/tools/dash/app/pal/stats/layout.py index 18f7b69612..0ae83cf3a4 100644 --- a/resources/tools/dash/app/pal/stats/layout.py +++ b/resources/tools/dash/app/pal/stats/layout.py @@ -19,6 +19,7 @@ import dash_bootstrap_components as dbc from dash import dcc from dash import html +from dash import callback_context, no_update from dash import Input, Output from dash.exceptions import PreventUpdate from yaml import load, FullLoader, YAMLError @@ -48,7 +49,7 @@ class Layout: data_stats, data_mrr, data_ndrpdr = Data( data_spec_file=self._data_spec_file, debug=True - ).read_stats(days=180) + ).read_stats() df_tst_info = pd.concat([data_mrr, data_ndrpdr], ignore_index=True) @@ -157,16 +158,22 @@ class Layout: self._add_navbar(), ] ), + dcc.Loading( + dbc.Offcanvas( + class_name="w-50", + id="offcanvas-metadata", + title="Detailed Information", + placement="end", + is_open=False, + children=[ + dbc.Row(id="row-metadata") + ] + ) + ), dbc.Row( id="row-main", class_name="g-0", children=[ - dcc.Store( - id="selected-tests" - ), - dcc.Store( - id="control-panel" - ), self._add_ctrl_col(), self._add_plotting_col(), ] @@ -255,7 +262,9 @@ class Layout: dcc.Loading(children=[ dbc.Button( id="btn-download-data", - children=["Download Data"] + children=["Download Data"], + class_name="me-1", + color="info" ), dcc.Download(id="download-data") ]) @@ -270,25 +279,37 @@ class Layout: """ return dbc.Row( id="row-ctrl-panel", - class_name="g-0 p-2", + class_name="g-0", children=[ - dbc.Label("Choose the Trending Job"), - dbc.RadioItems( - id="ri_job", - value=self.jobs[0], - options=[{"label": i, "value": i} for i in self.jobs] + dbc.Row( + class_name="g-0 p-2", + children=[ + dbc.Label("Choose the Trending Job"), + dbc.RadioItems( + id="ri_job", + value=self.jobs[0], + options=[ + {"label": i, "value": i} for i in self.jobs + ] + ) + ] ), - dbc.Label("Choose the Time Period"), - dcc.DatePickerRange( - id="dpr-period", - className="d-flex justify-content-center", - min_date_allowed=\ - datetime.utcnow()-timedelta(days=180), - max_date_allowed=datetime.utcnow(), - initial_visible_month=datetime.utcnow(), - start_date=datetime.utcnow() - timedelta(days=180), - end_date=datetime.utcnow(), - display_format="D MMMM YY" + dbc.Row( + class_name="g-0 p-2", + children=[ + dbc.Label("Choose the Time Period"), + dcc.DatePickerRange( + id="dpr-period", + className="d-flex justify-content-center", + min_date_allowed=\ + datetime.utcnow()-timedelta(days=180), + max_date_allowed=datetime.utcnow(), + initial_visible_month=datetime.utcnow(), + start_date=datetime.utcnow() - timedelta(days=180), + end_date=datetime.utcnow(), + display_format="D MMMM YY" + ) + ] ) ] ) @@ -329,3 +350,63 @@ class Layout: raise PreventUpdate return dcc.send_data_frame(self.data.to_csv, "statistics.csv") + + @app.callback( + Output("row-metadata", "children"), + Output("offcanvas-metadata", "is_open"), + Input("graph-passed", "clickData"), + Input("graph-duration", "clickData"), + prevent_initial_call=True + ) + def _show_metadata_from_graphs( + passed_data: dict, duration_data: dict) -> tuple: + """ + """ + + if not (passed_data or duration_data): + raise PreventUpdate + + metadata = no_update + open_canvas = False + title = "Job Statistics" + trigger_id = callback_context.triggered[0]["prop_id"].split(".")[0] + if trigger_id == "graph-passed": + graph_data = passed_data["points"][0].get("hovertext", "") + elif trigger_id == "graph-duration": + graph_data = duration_data["points"][0].get("text", "") + if graph_data: + metadata = [ + dbc.Card( + class_name="gy-2 p-0", + children=[ + dbc.CardHeader(children=[ + dcc.Clipboard( + target_id="metadata", + title="Copy", + style={"display": "inline-block"} + ), + title + ]), + dbc.CardBody( + id="metadata", + class_name="p-0", + children=[dbc.ListGroup( + children=[ + dbc.ListGroupItem( + [ + dbc.Badge( + x.split(":")[0] + ), + x.split(": ")[1] + ] + ) for x in graph_data.split("
") + ], + flush=True), + ] + ) + ] + ) + ] + open_canvas = True + + return metadata, open_canvas diff --git a/resources/tools/dash/app/pal/trending/layout.py b/resources/tools/dash/app/pal/trending/layout.py index ac866cfe40..fa5f8218ad 100644 --- a/resources/tools/dash/app/pal/trending/layout.py +++ b/resources/tools/dash/app/pal/trending/layout.py @@ -68,12 +68,12 @@ class Layout: data_mrr = Data( data_spec_file=self._data_spec_file, debug=True - ).read_trending_mrr(days=180) + ).read_trending_mrr() data_ndrpdr = Data( data_spec_file=self._data_spec_file, debug=True - ).read_trending_ndrpdr(days=180) + ).read_trending_ndrpdr() self._data = pd.concat([data_mrr, data_ndrpdr], ignore_index=True)