From 06024f7692534b70386e493c1046a191f228d8ba Mon Sep 17 00:00:00 2001 From: Aris Mamo Date: Mon, 6 Jan 2025 10:44:25 +0100 Subject: [PATCH] - Refactoring chart widget to allow type selection --- .../datasource-configuration.component.ts | 1 - ...rce-configuration-parameter.component.html | 3 - .../chart-widget-configuration.component.html | 212 ++++++++++-------- .../components/chart-widget.component.ts | 19 +- .../app/widgets/chart/models/ChartWidget.ts | 4 - lec/src/assets/i18n/en.json | 1 + lec/src/assets/i18n/it.json | 1 + 7 files changed, 130 insertions(+), 111 deletions(-) diff --git a/lec/src/app/components/datasource-configuration/datasource-configuration.component.ts b/lec/src/app/components/datasource-configuration/datasource-configuration.component.ts index ec36e8c..af00c7f 100644 --- a/lec/src/app/components/datasource-configuration/datasource-configuration.component.ts +++ b/lec/src/app/components/datasource-configuration/datasource-configuration.component.ts @@ -62,5 +62,4 @@ export class DatasourceConfigurationComponent implements OnInit { this.datasourceConfiguration!.parametricQuery = query; this.resetParameters(); } - } diff --git a/lec/src/app/components/datasource-configuration/parameters/datasource-configuration-parameter.component.html b/lec/src/app/components/datasource-configuration/parameters/datasource-configuration-parameter.component.html index 212bee5..755edff 100644 --- a/lec/src/app/components/datasource-configuration/parameters/datasource-configuration-parameter.component.html +++ b/lec/src/app/components/datasource-configuration/parameters/datasource-configuration-parameter.component.html @@ -34,7 +34,6 @@
-
-
- diff --git a/lec/src/app/widgets/chart/components/chart-widget-configuration/chart-widget-configuration.component.html b/lec/src/app/widgets/chart/components/chart-widget-configuration/chart-widget-configuration.component.html index f6b9f59..6ed47c8 100644 --- a/lec/src/app/widgets/chart/components/chart-widget-configuration/chart-widget-configuration.component.html +++ b/lec/src/app/widgets/chart/components/chart-widget-configuration/chart-widget-configuration.component.html @@ -1,119 +1,141 @@ -
-
- - {{ 'CHART_WIDGET_CONFIGURATION.SORTDATA' | translate }} -
- - {{ 'CHART_WIDGET_CONFIGURATION.SKIPLABEL' | translate }} -
-
- -
-
- - -
+
+
+ + {{ 'CHART_WIDGET_CONFIGURATION.SORTDATA' | translate }} + + + {{ 'CHART_WIDGET_CONFIGURATION.SKIPLABEL' | translate }} + +
- - -
-
-
+ +
+
+ + +
+
+ + +
+
+
+ +
+ + +
+ +
+
-
+ class="shadow-2 p-3 mt-{{ i===0 ? '0' : '3'}}"> + +
+
Serie {{ i + 1 }}
-
Serie {{i+1}}
+ -

{{'CHART_WIDGET_CONFIGURATION.SELECTED_DATASOURCE' | translate}}:

+
+ + +
-
- - -
-
+ + - - +
+
+ + +
- +
+ -

{{'CHART_WIDGET_CONFIGURATION.SELECTED_COLUMNS' - | translate}}:

+ + +
- -

{{'CHART_WIDGET_CONFIGURATION.X_AXIS_COLUMN' - | translate}}:

+ +
- - - -
+
{{ style.column }} +
+ + -
{{style.column}}
- {{'CHART_WIDGET_CONFIGURATION.STYLE' - | translate}}: - - - {{ 'CHART_WIDGET_CONFIGURATION.INTERPOLATE' | translate }} -
- - {{ 'CHART_WIDGET_CONFIGURATION.FILL' | translate }} - -
- -
- -
+ + + {{ 'CHART_WIDGET_CONFIGURATION.INTERPOLATE' | translate }} + +
+ + {{ 'CHART_WIDGET_CONFIGURATION.FILL' | translate }} + + +
+ +
+ +
+
+
+
- -
- -
-
- + + \ No newline at end of file diff --git a/lec/src/app/widgets/chart/components/chart-widget.component.ts b/lec/src/app/widgets/chart/components/chart-widget.component.ts index 3241f3e..fc2d5e7 100644 --- a/lec/src/app/widgets/chart/components/chart-widget.component.ts +++ b/lec/src/app/widgets/chart/components/chart-widget.component.ts @@ -82,9 +82,10 @@ export class ChartWidgetComponent implements OnInit, OnDestroy { * Il sistema funziona SOLO per parametri che abbiano un valore numerico e non stringa. * Da perfezionare. */ - this.route.queryParams.subscribe(params => { + const subscription = this.route.queryParams.subscribe(params => { this.listenForConfigurationChanged(params); }); + this.subscriptions.push(subscription); this.setUpdatable(); } @@ -117,8 +118,12 @@ export class ChartWidgetComponent implements OnInit, OnDestroy { httpposts.push(this.dataService.getData(series.datasourceConfiguration!)); } + if (httpposts.length === 0) + this.loadingData = false; + forkJoin(httpposts).subscribe({ next: result => { + this.loadingData = false; for (let res of result) { let response = { "result": res?.result || [], @@ -129,7 +134,6 @@ export class ChartWidgetComponent implements OnInit, OnDestroy { } this.elaborateResponses(); - this.loadingData = false; this.chart?.update(); }, error: er => { @@ -143,9 +147,10 @@ export class ChartWidgetComponent implements OnInit, OnDestroy { this.data.labels = []; this.dataLocal.datasets = []; this.dataLocal.labels = []; - this.route.queryParams.subscribe(params => { + const subscription = this.route.queryParams.subscribe(params => { this.listenForConfigurationChanged(params); }); + this.subscriptions.push(subscription); } listenForConfigurationChanged(params: Params) { @@ -329,7 +334,6 @@ export class ChartWidgetComponent implements OnInit, OnDestroy { elaborateResponses() { let items = []; const validSeries = this.widget!.seriesList!.filter(o => !!o.datasourceConfiguration); - var response: Response = new Response(); if (this.debug) this.utils.showInfoMessage(validSeries.length + " = " + this.responses.length); if (validSeries.length === this.responses.length) { @@ -484,9 +488,9 @@ export class ChartWidgetComponent implements OnInit, OnDestroy { } hexToRGB(hex: string, alpha?: string) { - var r = parseInt(hex.slice(1, 3), 16), - g = parseInt(hex.slice(3, 5), 16), - b = parseInt(hex.slice(5, 7), 16); + var r = parseInt(hex?.slice(1, 3), 16), + g = parseInt(hex?.slice(3, 5), 16), + b = parseInt(hex?.slice(5, 7), 16); if (alpha) { return "rgba(" + r + ", " + g + ", " + b + ", " + alpha + ")"; @@ -495,7 +499,6 @@ export class ChartWidgetComponent implements OnInit, OnDestroy { } } - elaborateClick(evt: any, array: any[]) { //console.log(evt); //console.log(array); diff --git a/lec/src/app/widgets/chart/models/ChartWidget.ts b/lec/src/app/widgets/chart/models/ChartWidget.ts index a6f0684..a533411 100644 --- a/lec/src/app/widgets/chart/models/ChartWidget.ts +++ b/lec/src/app/widgets/chart/models/ChartWidget.ts @@ -51,10 +51,6 @@ export class SeriesStyle { const columnStyles = styles.filter(o => o.column === column); return columnStyles.length > 0 ? columnStyles[0] : new SeriesStyle(column); } - - - - } export class SeriesMetadata { diff --git a/lec/src/assets/i18n/en.json b/lec/src/assets/i18n/en.json index 74b9fec..fc89af3 100644 --- a/lec/src/assets/i18n/en.json +++ b/lec/src/assets/i18n/en.json @@ -16,6 +16,7 @@ "LOADING": "Loading", "MY_COMMUNITIES": "My communities", "SELECT_A_COMMUNITY": "Select a community", + "SELECT_VALUE": "Select a value", "MY_DEVICES": "My devices", "SELECT_LANGUAGE": "Select language", "MY_PROFILE": "My personal data", diff --git a/lec/src/assets/i18n/it.json b/lec/src/assets/i18n/it.json index f280af2..d7810c6 100644 --- a/lec/src/assets/i18n/it.json +++ b/lec/src/assets/i18n/it.json @@ -15,6 +15,7 @@ "LOADING": "Caricamento...", "MY_COMMUNITIES": "Le mie comunità", "SELECT_A_COMMUNITY": "Seleziona una comunità", + "SELECT_VALUE": "Seleziona un valore", "MY_DEVICES": "I miei dispositivi", "SELECT_LANGUAGE": "Scelta lingua", "MY_PROFILE": "Modifica info", -- GitLab