@esfaenza/dashboard-feature 11.2.2

package/fesm2015/esfaenza-dashboard-feature.js

@@ -0,0 +1,955 @@
+import { InjectionToken, EventEmitter, Component, Inject, Input, Output, ChangeDetectionStrategy, ɵɵdefineInjectable, ɵɵinject, ComponentFactoryResolver, Injectable, ViewEncapsulation, ChangeDetectorRef, ViewChildren, ViewContainerRef, NgModule, Optional } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { GridsterModule } from 'angular-gridster2';
+import { MatProgressBarModule } from '@angular/material/progress-bar';
+import { Router, ActivatedRoute } from '@angular/router';
+import { InboundMessageTypes, InterComService } from '@esfaenza/extensions';
+import { LocalizationService } from '@esfaenza/localizations';
+import { FormsAndValidationsModule } from '@esfaenza/forms-and-validations';
+import { EsChartsModule } from '@esfaenza/es-charts';
+import { NgCircleProgressModule } from 'ng-circle-progress';
+import { HTTPService, HttpserviceModule } from '@esfaenza/httpservice';
+import { HttpParams } from '@angular/common/http';
+
+/**
+ * Injection Token della stringa che rappresenta il 'locale' nel sistema @es-faenza/localization
+ */
+const DSH_LOCALE = new InjectionToken('DSH_LOCALE');
+/**
+ * Injection Token dell'url del FE
+ */
+const DSH_BACKEND_URL = new InjectionToken('DSH_BACKEND_URL');
+/**
+ * Token di registrazione della DashboardFeatureService.
+ * Permette di fare l'override dell'implementazione di default a scopo di test delle widget
+ */
+const DSH_DATA_SERVICE = new InjectionToken('DSH_DATA_SERVICE');
+
+const DSH_OPTIONS = new InjectionToken('DSH_MODULE_OPTIONS');
+
+class JaceChartWidgetComponent {
+    constructor(dshService) {
+        this.dshService = dshService;
+        this.OnRemove = new EventEmitter();
+        this.configuration = false;
+        this.dataReady = false;
+        this.lastdate = "";
+        this.chartName = "";
+    }
+    setWidgetModel(widgetModel) {
+        this.model = widgetModel;
+        this.refreshData();
+    }
+    ngOnInit() { }
+    ngOnChanges(changes) {
+        //console.log(changes['DashboardDate'].currentValue);
+        if (changes['DashboardDate'].previousValue)
+            this.lastdate = changes['DashboardDate'].previousValue.toISOString();
+        let curdate = "";
+        if (changes['DashboardDate'].currentValue)
+            curdate = changes['DashboardDate'].currentValue.toISOString();
+        //fix per il datetimepicker material che cambia l'oggetto al momento del caricamento
+        if (this.lastdate != curdate) {
+            this.lastdate = curdate;
+            this.refreshData();
+        }
+    }
+    refreshData() {
+        if (!this.model)
+            return;
+        const pars = {};
+        if (this.DashboardDate)
+            pars["DT"] = this.DashboardDate.toISOString();
+        if (this.model.options && Object.keys(this.model.options).length != 0) {
+            for (let index = 0; index < Object.keys(this.model.options).length; index++) {
+                const k = Object.keys(this.model.options)[index];
+                pars[k] = this.model.options[k];
+            }
+        }
+        this.dshService.GetWidgetData(this.model.name, pars).subscribe(data => {
+            if (this.model) {
+                this.model.setData(data);
+                this.chartName = this.model.name;
+                this.dataReady = true;
+            }
+        });
+    }
+    removeWidget() {
+        if (!this.model)
+            return;
+        this.OnRemove.emit(this.model.name);
+    }
+    configure() {
+        if (this.configuration) {
+            //finito di configurare -> refreshData
+            this.refreshData();
+        }
+        this.configuration = !this.configuration;
+    }
+}
+JaceChartWidgetComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'jace-dsh-chart',
+                template: "<div class=\"jace-dsh-widget-header {{model?.name}}-header\">\r\n    <div class=\"jace-dsh-widget-title\" *ngIf=\"model.title\">\r\n        {{model.title}}\r\n    </div>\r\n    <div class=\"jace-dsh-widget-controls\" *ngIf=\"dataReady\">\r\n        <span class=\"transition drag-handler jace-dsh-widget-drag\" *ngIf=\"model.dragEnabled\">\r\n            <i class=\"fa fa-arrows-alt\"></i>\r\n        </span>\r\n        <span class=\"transition jace-dsh-widget-opts\" (click)=\"configure()\">\r\n            <i class=\"fa fa-cog\"></i>\r\n        </span>\r\n        <span (click)=\"removeWidget()\" class=\"transition remove-button jace-dsh-widget-close\">\r\n            <i class=\"fa fa-times\"></i>\r\n        </span>\r\n    </div>\r\n</div>\r\n<div class=\"jace-dsh-widget-body gridster-item-content {{model?.name}}-body\">\r\n    <div class=\"jace-dsh-widget-loading\" *ngIf=\"!dataReady\">\r\n        <i class=\"fa fa-spinner fa-spin\"></i>\r\n    </div>\r\n\r\n    <div class=\"jace-dsh-chart-container jace-dsh-widget-slide\"\r\n        [ngClass]=\"{'jace-dsh-widget-content-hide':configuration,'jace-dsh-widget-content-show':!configuration}\"\r\n        *ngIf=\"dataReady\">\r\n        <!-- [Type]=\"Widget.chartType\" -->\r\n        <h6 *ngIf=\"model?.queryerror\" class=\"fg-disabled\" style=\"margin-top: 0.5rem;\"><span\r\n                class=\"fa fa-times-circle-o\"></span>&nbsp;&nbsp;Error retrieving data</h6>\r\n        <es-chart [Legend]=\"model.legend\" [Theme]=\"'dataviz'\" [Type]=\"model.chartType\" [Data]=\"model.chartData\"\r\n            [name]=\"chartName\"></es-chart>\r\n    </div>\r\n\r\n    <div class=\"jace-dsh-widget-settings jace-dsh-widget-slide \"\r\n        [ngClass]=\"{'jace-dsh-widget-settings-hide':!configuration,'jace-dsh-widget-settings-show':configuration}\">\r\n        <p>Configuration</p>\r\n    </div>\r\n</div>",
+                styles: [""]
+            },] }
+];
+JaceChartWidgetComponent.ctorParameters = () => [
+    { type: undefined, decorators: [{ type: Inject, args: [DSH_DATA_SERVICE,] }] }
+];
+JaceChartWidgetComponent.propDecorators = {
+    DashboardDate: [{ type: Input }],
+    OnRemove: [{ type: Output }]
+};
+
+class JaceCounterWidgetComponent {
+    constructor(dshService) {
+        this.dshService = dshService;
+        this.OnRemove = new EventEmitter();
+        this.configuration = false;
+        this.dataReady = false;
+        this.lastdate = "";
+    }
+    setWidgetModel(widgetModel) {
+        this.model = widgetModel;
+        this.refreshData();
+    }
+    ngOnInit() { }
+    ngOnChanges(changes) {
+        //console.log(changes['DashboardDate'].currentValue);
+        if (changes['DashboardDate'].previousValue)
+            this.lastdate = changes['DashboardDate'].previousValue.toISOString();
+        let curdate = "";
+        if (changes['DashboardDate'].currentValue)
+            curdate = changes['DashboardDate'].currentValue.toISOString();
+        //fix per il datetimepicker material che cambia l'oggetto al momento del caricamento
+        if (this.lastdate != curdate) {
+            this.lastdate = curdate;
+            this.refreshData();
+        }
+    }
+    refreshData() {
+        if (!this.model)
+            return;
+        const pars = {};
+        if (this.DashboardDate)
+            pars["DT"] = this.DashboardDate.toISOString();
+        if (this.model.options && Object.keys(this.model.options).length != 0) {
+            for (let index = 0; index < Object.keys(this.model.options).length; index++) {
+                const k = Object.keys(this.model.options)[index];
+                pars[k] = this.model.options[k];
+            }
+        }
+        this.dshService.GetWidgetData(this.model.name, pars).subscribe(data => {
+            if (this.model) {
+                this.model.setData(data);
+                this.dataReady = true;
+            }
+        });
+    }
+    removeWidget() {
+        if (!this.model)
+            return;
+        this.OnRemove.emit(this.model.name);
+    }
+    configure() {
+        if (this.configuration) {
+            //finito di configurare -> refreshData
+            this.refreshData();
+        }
+        this.configuration = !this.configuration;
+    }
+}
+JaceCounterWidgetComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'jace-dsh-counter',
+                template: "<div class=\"jace-dsh-widget-header {{model?.name}}-header\">\r\n    <div class=\"jace-dsh-widget-title\" *ngIf=\"model.title\">\r\n        {{model.title}}\r\n    </div>\r\n    <div class=\"jace-dsh-widget-controls\" *ngIf=\"dataReady\">\r\n        <span class=\"transition drag-handler jace-dsh-widget-drag\" *ngIf=\"model.dragEnabled\">\r\n            <i class=\"fa fa-arrows-alt\"></i>\r\n        </span>\r\n        <span class=\"transition jace-dsh-widget-opts\" (click)=\"configure()\">\r\n            <i class=\"fa fa-cog\"></i>\r\n        </span>\r\n        <span (click)=\"removeWidget()\" class=\"transition remove-button jace-dsh-widget-close\">\r\n            <i class=\"fa fa-times\"></i>\r\n        </span>\r\n    </div>\r\n</div>\r\n<div class=\"jace-dsh-widget-body gridster-item-content {{model?.name}}-body\">\r\n    <div class=\"jace-dsh-widget-loading\" *ngIf=\"!dataReady\">\r\n        <i class=\"fa fa-spinner fa-spin\"></i>\r\n    </div>\r\n    <div class=\"jace-dsh-counter-body jace-dsh-widget-slide\"\r\n        [ngClass]=\"{'jace-dsh-widget-content-hide':configuration,'jace-dsh-widget-content-show':!configuration}\"\r\n        *ngIf=\"dataReady\">\r\n        <i class=\"jace-dsh-counter-icon fa fa-2x\" [ngClass]=\"[ model.icon ? model.icon : '']\" *ngIf=\"model.icon\"></i>\r\n        <div class=\"jace-dsh-counter-super\">{{model.superText}}</div>\r\n        <div class=\"jace-dsh-counter-value\"><span>{{model.value}}</span> <span\r\n                class=\"jace-dsh-counter-unit\">{{model.unit}}</span> </div>\r\n\r\n        <div class=\"jace-dsh-counter-sub\">{{model.subText}}</div>\r\n    </div>\r\n\r\n    <div class=\"jace-dsh-widget-settings jace-dsh-widget-slide \"\r\n        [ngClass]=\"{'jace-dsh-widget-settings-hide':!configuration,'jace-dsh-widget-settings-show':configuration}\">\r\n        <p>Configuration</p>\r\n    </div>\r\n</div>",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: [".jace-dsh-counter-body{padding:1em .5em}.jace-dsh-counter-value{font-size:2em;font-weight:700;text-align:center}.jace-dsh-counter-unit{margin-left:.08em;font-size:.5em;text-align:center}.jace-dsh-counter-super{font-size:1em;text-align:center}.jace-dsh-counter-sub{font-size:.8em;text-align:center}.jace-dsh-counter-icon{position:absolute;font-size:2.6em;color:#b0c4de}"]
+            },] }
+];
+JaceCounterWidgetComponent.ctorParameters = () => [
+    { type: undefined, decorators: [{ type: Inject, args: [DSH_DATA_SERVICE,] }] }
+];
+JaceCounterWidgetComponent.propDecorators = {
+    DashboardDate: [{ type: Input }],
+    OnRemove: [{ type: Output }]
+};
+
+class JaceListWidgetComponent {
+    constructor(dshService, router) {
+        this.dshService = dshService;
+        this.router = router;
+        this.OnRemove = new EventEmitter();
+        this.configuration = false;
+        this.dataReady = false;
+        this.lastdate = "";
+    }
+    setWidgetModel(widgetModel) {
+        this.model = widgetModel;
+        this.refreshData();
+    }
+    ngOnInit() { }
+    ngOnChanges(changes) {
+        //console.log(changes['DashboardDate'].currentValue);
+        if (changes['DashboardDate'].previousValue)
+            this.lastdate = changes['DashboardDate'].previousValue.toISOString();
+        let curdate = "";
+        if (changes['DashboardDate'].currentValue)
+            curdate = changes['DashboardDate'].currentValue.toISOString();
+        //fix per il datetimepicker material che cambia l'oggetto al momento del caricamento
+        if (this.lastdate != curdate) {
+            this.lastdate = curdate;
+            this.refreshData();
+        }
+    }
+    refreshData() {
+        if (!this.model)
+            return;
+        const pars = {};
+        if (this.DashboardDate)
+            pars["DT"] = this.DashboardDate.toISOString();
+        if (this.model.options && Object.keys(this.model.options).length != 0) {
+            for (let index = 0; index < Object.keys(this.model.options).length; index++) {
+                const k = Object.keys(this.model.options)[index];
+                pars[k] = this.model.options[k];
+            }
+        }
+        this.dshService.GetWidgetData(this.model.name, pars).subscribe(data => {
+            if (this.model) {
+                this.model.setData(data);
+                this.dataReady = true;
+            }
+        });
+    }
+    removeWidget() {
+        if (!this.model)
+            return;
+        this.OnRemove.emit(this.model.name);
+    }
+    itemClicked(item) {
+        if (item.link) {
+            //naviga al link
+            let to = item.link;
+            let par = {};
+            if (item.id && item.idParamName) {
+                par[item.idParamName] = item.id;
+            }
+            this.router.navigate([to, par]);
+        }
+    }
+    configure() {
+        if (this.configuration) {
+            //finito di configurare -> refreshData
+            this.refreshData();
+        }
+        this.configuration = !this.configuration;
+    }
+}
+JaceListWidgetComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'jace-dsh-list',
+                template: "<div class=\"jace-dsh-widget-header {{model?.name}}-header\">\r\n    <div class=\"jace-dsh-widget-title\" *ngIf=\"model.title\">\r\n        {{model.title}}\r\n    </div>\r\n    <div class=\"jace-dsh-widget-controls\" *ngIf=\"dataReady\">\r\n        <span class=\"transition drag-handler jace-dsh-widget-drag\" *ngIf=\"model.dragEnabled\">\r\n            <i class=\"fa fa-arrows-alt\"></i>\r\n        </span>\r\n        <span class=\"transition jace-dsh-widget-opts\" (click)=\"configure()\">\r\n            <i class=\"fa fa-cog\"></i>\r\n        </span>\r\n        <span (click)=\"removeWidget()\" class=\"transition remove-button jace-dsh-widget-close\">\r\n            <i class=\"fa fa-times\"></i>\r\n        </span>\r\n    </div>\r\n</div>\r\n<div class=\"jace-dsh-widget-body gridster-item-content {{model?.name}}-body\">\r\n    <div class=\"jace-dsh-widget-loading\" *ngIf=\"!dataReady\">\r\n        <i class=\"fa fa-spinner fa-spin\"></i>\r\n    </div>\r\n    <div class=\"jace-dsh-list-body jace-dsh-widget-slide\"\r\n        [ngClass]=\"{'jace-dsh-widget-content-hide':configuration,'jace-dsh-widget-content-show':!configuration}\"\r\n        *ngIf=\"dataReady\">\r\n        <div class=\"jace-dsh-list-super-text\" *ngIf=\"model.superText\">{{model.superText}}</div>\r\n        <div class=\"jace-dsh-list-item\" (click)=\"itemClicked(item)\" [class.jace-dsh-list-link]=\"item.link\"\r\n            *ngFor=\"let item of model.items\">\r\n            <div>\r\n                <span class=\"jace-dsh-list-item-id\" *ngIf=\"item.id\">{{item.id}}</span>\r\n                <span>{{item.description}}</span>\r\n            </div>\r\n            <div *ngIf=\"item.subline\">\r\n                <span class=\"jace-dsh-list-item-subline\">{{item.subline}}</span>\r\n            </div>\r\n        </div>\r\n\r\n    </div>\r\n    <div class=\"jace-dsh-widget-settings jace-dsh-widget-slide \"\r\n        [ngClass]=\"{'jace-dsh-widget-settings-hide':!configuration,'jace-dsh-widget-settings-show':configuration}\">\r\n        <p>Configuration</p>\r\n    </div>\r\n</div>",
+                styles: [".jace-dsh-list-body{height:100%;overflow-y:auto}.jace-dsh-list-super-text{font-weight:500}.jace-dsh-list-item{display:flow;flex-direction:row;justify-content:flex-start;padding:.4em;border:1px solid #eee;margin-top:2px}.jace-dsh-list-item-id{margin-right:1em;color:#fff;background:#637ca0;font-size:.8em;padding:.2em .5em;border-radius:.2em}.jace-dsh-list-link{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block}.jace-dsh-list-link:hover{cursor:pointer;color:#fff;background-color:#b0c4de;text-decoration:underline}.jace-dsh-list-item-subline{font-size:.5em}"]
+            },] }
+];
+JaceListWidgetComponent.ctorParameters = () => [
+    { type: undefined, decorators: [{ type: Inject, args: [DSH_DATA_SERVICE,] }] },
+    { type: Router }
+];
+JaceListWidgetComponent.propDecorators = {
+    DashboardDate: [{ type: Input }],
+    OnRemove: [{ type: Output }]
+};
+
+class JaceMultiprogWidgetComponent {
+    constructor(dshService, router) {
+        this.dshService = dshService;
+        this.router = router;
+        this.OnRemove = new EventEmitter();
+        this.configuration = false;
+        this.dataReady = false;
+        this.lastdate = "";
+    }
+    setWidgetModel(widgetModel) {
+        this.model = widgetModel;
+        this.refreshData();
+    }
+    ngOnInit() { }
+    ngOnChanges(changes) {
+        //console.log(changes['DashboardDate'].currentValue);
+        if (changes['DashboardDate'].previousValue)
+            this.lastdate = changes['DashboardDate'].previousValue.toISOString();
+        let curdate = "";
+        if (changes['DashboardDate'].currentValue)
+            curdate = changes['DashboardDate'].currentValue.toISOString();
+        //fix per il datetimepicker material che cambia l'oggetto al momento del caricamento
+        if (this.lastdate != curdate) {
+            this.lastdate = curdate;
+            this.refreshData();
+        }
+    }
+    refreshData() {
+        if (!this.model)
+            return;
+        const pars = {};
+        if (this.DashboardDate)
+            pars["DT"] = this.DashboardDate.toISOString();
+        if (this.model.options && Object.keys(this.model.options).length != 0) {
+            for (let index = 0; index < Object.keys(this.model.options).length; index++) {
+                const k = Object.keys(this.model.options)[index];
+                pars[k] = this.model.options[k];
+            }
+        }
+        this.dshService.GetWidgetData(this.model.name, pars).subscribe(data => {
+            if (this.model) {
+                this.model.setData(data);
+                this.dataReady = true;
+            }
+        });
+    }
+    removeWidget() {
+        if (!this.model)
+            return;
+        this.OnRemove.emit(this.model.name);
+    }
+    configure() {
+        if (this.configuration) {
+            //finito di configurare -> refreshData
+            this.refreshData();
+        }
+        this.configuration = !this.configuration;
+    }
+}
+JaceMultiprogWidgetComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'jace-dsh-multiprog',
+                template: "<div class=\"jace-dsh-widget-header {{model?.name}}-header\">\r\n    <div class=\"jace-dsh-widget-title\" *ngIf=\"model.title\">\r\n        {{model.title}}\r\n    </div>\r\n    <div class=\"jace-dsh-widget-controls\" *ngIf=\"dataReady\">\r\n        <span class=\"transition drag-handler jace-dsh-widget-drag\" *ngIf=\"model.dragEnabled\">\r\n            <i class=\"fa fa-arrows-alt\"></i>\r\n        </span>\r\n        <span class=\"transition jace-dsh-widget-opts\" (click)=\"configure()\">\r\n            <i class=\"fa fa-cog\"></i>\r\n        </span>\r\n        <span (click)=\"removeWidget()\" class=\"transition remove-button jace-dsh-widget-close\">\r\n            <i class=\"fa fa-times\"></i>\r\n        </span>\r\n\r\n    </div>\r\n</div>\r\n<div class=\"jace-dsh-widget-body gridster-item-content {{model?.name}}-body\">\r\n    <div class=\"jace-dsh-widget-loading\" *ngIf=\"!dataReady\">\r\n        <i class=\"fa fa-spinner\"></i>\r\n    </div>\r\n    <div class=\"jace-dsh-multiprog-container jace-dsh-widget-slide\"\r\n        [ngClass]=\"{'jace-dsh-widget-content-hide':configuration,'jace-dsh-widget-content-show':!configuration}\"\r\n        *ngIf=\"dataReady\">\r\n        <div *ngFor=\"let item of model.progressTitles; let i = index\" class=\"jace-dsh-multiprog-progress\">\r\n            <div class=\"jace-dsh-multiprog-title\">{{item}}</div>\r\n            <circle-progress [percent]=\"model.progressValues[i]\" [showSubtitle]=false [radius]=\"36\"\r\n                [outerStrokeWidth]=\"4\" [innerStrokeWidth]=\"2\" [outerStrokeColor]=\"'#7489AA'\"\r\n                [innerStrokeColor]=\"'#EFECCA'\" [animation]=\"true\" [animationDuration]=\"300\" [showTitle]=\"true\"\r\n                *ngIf=\"model.circleProgress\"></circle-progress>\r\n            <!-- [title] = \"model.progressValues[i]|number||''\" -->\r\n            <mat-progress-bar [value]=\"model.progressValues[i]\" [mode]=\"'determinate'\" *ngIf=\"!model.circleProgress\">\r\n            </mat-progress-bar>\r\n            <!-- <span>{{item}}</span>:<span>{{model.progressValues[i]}}</span> -->\r\n        </div>\r\n    </div>\r\n    <div class=\"jace-dsh-widget-settings jace-dsh-widget-slide \"\r\n        [ngClass]=\"{'jace-dsh-widget-settings-hide':!configuration,'jace-dsh-widget-settings-show':configuration}\">\r\n        <p>Configuration</p>\r\n    </div>\r\n</div>",
+                styles: [".jace-dsh-multiprog-title{text-align:center;font-weight:600;font-size:.8em}.jace-dsh-multiprog-container{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly;padding:.5rem}"]
+            },] }
+];
+JaceMultiprogWidgetComponent.ctorParameters = () => [
+    { type: undefined, decorators: [{ type: Inject, args: [DSH_DATA_SERVICE,] }] },
+    { type: Router }
+];
+JaceMultiprogWidgetComponent.propDecorators = {
+    DashboardDate: [{ type: Input }],
+    OnRemove: [{ type: Output }]
+};
+
+class BaseJaceWidgetModel {
+    constructor() {
+        this.resizeEnabled = false;
+        this.dataError = false;
+        this.options = {};
+    }
+    configureFromInstanceDetails(details) {
+        this.name = details.name;
+        this.widgetType = details.type;
+        this.title = details.title;
+        this.x = details.x;
+        this.y = details.y;
+        this.cols = details.cols;
+        this.rows = details.rows;
+        this.compactEnabled = details.compactenabled;
+        this.dragEnabled = details.dragenabled;
+        this.options = details.options;
+        this.dataError = details.queryerror;
+        this.resizeEnabled = details.resizeenabled;
+    }
+}
+
+class JaceChartWidgetModel extends BaseJaceWidgetModel {
+    constructor() {
+        super();
+        this.chartType = 'line';
+        this.legend = false;
+        this.widgetType = "CHART";
+    }
+    setData(data) {
+        if (!data)
+            return;
+        if (data['queryerror'])
+            this.dataError = data['queryerror'];
+        if (data['legend'])
+            this.legend = data['legend'];
+        else
+            this.legend = true;
+        if (data['charttype'])
+            this.chartType = data['charttype'];
+        if (data['chartdata']) {
+            this.chartData = data['chartdata'];
+        }
+        if (this.options && this.options['legend'] == undefined)
+            this.options['legend'] = true;
+    }
+}
+
+class JaceCounterWidgetModel extends BaseJaceWidgetModel {
+    constructor() {
+        super();
+        this.superText = undefined;
+        this.subText = undefined;
+        this.value = 0;
+        this.icon = undefined;
+        this.unit = undefined;
+        this.widgetType = "COUNTER";
+    }
+    setData(data) {
+        if (data['queryerror'])
+            this.dataError = data['queryerror'];
+        this.superText = data['supertext'];
+        this.subText = data['subtext'];
+        this.value = data['value'];
+        this.icon = data['icon'];
+        this.options = data['options'];
+        this.unit = data['unit'];
+    }
+}
+
+class JaceListItemWidget {
+}
+class JaceListWidgetModel extends BaseJaceWidgetModel {
+    constructor() {
+        super();
+        this.superText = undefined;
+        this.items = [];
+        this.widgetType = "LIST";
+    }
+    setData(data) {
+        if (!data)
+            return;
+        if (data['queryerror'])
+            this.dataError = data['queryerror'];
+        this.superText = data['supertext'];
+        if (data['items']) {
+            const d = data['items'];
+            this.items = [];
+            for (let index = 0; index < d.length; index++) {
+                const item = new JaceListItemWidget();
+                const element = d[index];
+                if (element['id'])
+                    item.id = element['id'];
+                if (element['idparamname'])
+                    item.idParamName = element['idparamname'];
+                if (element['link'])
+                    item.link = element['link'];
+                if (element['subline'])
+                    item.subline = element['subline'];
+                if (element['classes'])
+                    item.classes = element['classes'];
+                item.description = element.description;
+                this.items.push(item);
+            }
+        }
+    }
+}
+
+class JaceMultiprogWidgetModel extends BaseJaceWidgetModel {
+    constructor() {
+        super();
+        this.resizeEnabled = true;
+        this.progressTitles = [];
+        this.progressValues = [];
+        this.circleProgress = false;
+        this.widgetType = "MULTIPROGRESS";
+    }
+    setData(data) {
+        var _a, _b, _c;
+        if (data['queryerror'])
+            this.dataError = data['queryerror'];
+        this.progressTitles = (_a = data['progresstitles']) !== null && _a !== void 0 ? _a : [];
+        this.progressValues = (_b = data['progressvalues']) !== null && _b !== void 0 ? _b : [];
+        this.circleProgress = data['circleprogress'];
+        this.options = (_c = data['options']) !== null && _c !== void 0 ? _c : {};
+        if (this.circleProgress === undefined)
+            this.circleProgress = true;
+        if (this.cols === undefined && this.progressValues) {
+            if (this.progressValues.length == 1)
+                this.cols = 1;
+            else
+                this.cols = 2;
+        }
+    }
+}
+
+class DefaultDashboardModuleOptions {
+    constructor() {
+        this.locale = "it-IT";
+        this.widgetTypes = [
+            {
+                name: "COUNTER",
+                component: JaceCounterWidgetComponent,
+                model: JaceCounterWidgetModel
+            },
+            {
+                name: "LIST",
+                component: JaceListWidgetComponent,
+                model: JaceListWidgetModel
+            },
+            {
+                name: "CHART",
+                component: JaceChartWidgetComponent,
+                model: JaceChartWidgetModel
+            },
+            {
+                name: "MULTIPROGRESS",
+                component: JaceMultiprogWidgetComponent,
+                model: JaceMultiprogWidgetModel
+            }
+        ];
+    }
+}
+
+//singleton
+class DashboardWidgetFactory {
+    //verione ng 13
+    //constructor() { }
+    constructor(componentFactoryResolver) {
+        this.componentFactoryResolver = componentFactoryResolver;
+        this.types = {};
+    }
+    addOption(option) {
+        if (option.widgetTypes) {
+            option.widgetTypes.forEach((o) => {
+                this.types[o.name] = o;
+            });
+        }
+    }
+    //versione ng 13+
+    /* resolveComponent(type: string, vcr: ViewContainerRef): ComponentRef<IWidgetComponent> | null {
+
+        if (!this.types)
+            return null;
+
+        let t = this.types[type];
+
+        if (!t)
+            return null;
+
+        let componentRef: ComponentRef<IWidgetComponent> = vcr.createComponent(t.component);
+
+        return componentRef;
+    } */
+    //versione ng11 
+    resolveComponent(type, vcr) {
+        if (!this.types)
+            return null;
+        let t = this.types[type];
+        if (!t)
+            return null;
+        //DEPRECATO dopo ng11: è stato tolto il meccanismo dei ComponentFactory per i componenti dinamici
+        let cf = this.componentFactoryResolver.resolveComponentFactory(t.component);
+        let componentRef = vcr.createComponent(cf);
+        return componentRef;
+    }
+    resolveDefinition(type, details) {
+        if (!this.types)
+            return null;
+        let t = this.types[type];
+        if (!t)
+            return null;
+        let definitionInstance = this.createInstance(t.model);
+        definitionInstance.configureFromInstanceDetails(details);
+        return definitionInstance;
+    }
+    createInstance(type) {
+        return new type();
+    }
+}
+DashboardWidgetFactory.ɵprov = ɵɵdefineInjectable({ factory: function DashboardWidgetFactory_Factory() { return new DashboardWidgetFactory(ɵɵinject(ComponentFactoryResolver)); }, token: DashboardWidgetFactory, providedIn: "root" });
+DashboardWidgetFactory.decorators = [
+    { type: Injectable, args: [{ providedIn: 'root' },] }
+];
+DashboardWidgetFactory.ctorParameters = () => [
+    { type: ComponentFactoryResolver }
+];
+
+class DashboardLoc extends LocalizationService {
+    constructor(options) {
+        super(options.locale);
+        super.set("en->it", "Dashboard", ["Dashboard"]);
+    }
+}
+DashboardLoc.decorators = [
+    { type: Injectable }
+];
+DashboardLoc.ctorParameters = () => [
+    { type: undefined, decorators: [{ type: Inject, args: [DSH_OPTIONS,] }] }
+];
+
+class SaveJaceDashboardLayoutDTO {
+}
+
+//Definizione della widget restituita dal backend
+class JaceWidgetInstanceDetail {
+    constructor() {
+        this.queryerror = false;
+    }
+}
+
+/**
+ * Componente di base che rappresenta una dashboard.
+ * Utilizza Gridster2 per il layout delle widget [Gridster2](https://tiberiuzuld.github.io/angular-gridster2/)
+ */
+class DashboardComponent {
+    constructor(dshService, intercom, lc, route, cmpFactory, cdr) {
+        this.dshService = dshService;
+        this.intercom = intercom;
+        this.lc = lc;
+        this.route = route;
+        this.cmpFactory = cmpFactory;
+        this.cdr = cdr;
+        this.dashboardDate = new Date();
+        this.widgetDefinitions = [];
+        this.trackedSubscriptions = [];
+        this.intercom.send(InboundMessageTypes.Navigation, { sub: false, routeTitle: this.lc.loc(this.route.snapshot.data["title"]) });
+    }
+    ngOnInit() {
+    }
+    ngAfterViewInit() {
+        //qui this.gridItemRefs è 'riempito'
+        // sottoscrivo changes che sparerà tutte le volte che ngFor si aggiorna (ovvero quando cambia dashboard)
+        this.changesSub = this.gridItemRefs.changes.subscribe((comps) => {
+            this.renderLayout(comps);
+        });
+        //prima volta
+        /* if(this.Configuration)
+            this.reloadData(); */
+        setTimeout(() => this.reloadData(), 500);
+    }
+    ngOnDestroy() {
+        //unsubscribe dalle changes dei viewref
+        if (this.changesSub)
+            this.changesSub.unsubscribe();
+        this.clearTrackedSubscriptions();
+    }
+    clearTrackedSubscriptions() {
+        if (this.trackedSubscriptions) {
+            for (let index = 0; index < this.trackedSubscriptions.length; index++) {
+                const element = this.trackedSubscriptions[index];
+                element.unsubscribe();
+            }
+            this.trackedSubscriptions = [];
+        }
+    }
+    ngOnChanges(changes) {
+        if (changes.Configuration) {
+            //appena ho configuration
+        }
+    }
+    reloadData() {
+        this.dshService.GetUserDashboard(this.Configuration.accountId, this.Configuration.dashboardName).subscribe(c => {
+            this.dashboardLayout = c;
+            this.widgetDefinitions = c.widgets.map(i => {
+                return this.cmpFactory.resolveDefinition(i.type, i);
+            });
+        });
+    }
+    removeItem(widgetName) {
+        if (!this.dashboardLayout)
+            return;
+        let idx = this.dashboardLayout.widgets.findIndex(s => s.name == widgetName);
+        this.widgetDefinitions.splice(idx, 1);
+    }
+    saveDashboard() {
+        if (!this.dashboardLayout)
+            return;
+        const dto = new SaveJaceDashboardLayoutDTO();
+        dto.widgets = [];
+        for (let index = 0; index < this.widgetDefinitions.length; index++) {
+            const w = this.widgetDefinitions[index];
+            if (w == null)
+                continue;
+            let v = new JaceWidgetInstanceDetail();
+            v.id = w.id;
+            v.name = w.name;
+            v.x = w.x;
+            v.y = w.y;
+            v.cols = w.cols;
+            v.rows = w.rows;
+            v.compactenabled = w.compactEnabled;
+            v.dragenabled = w.dragEnabled;
+            v.resizeenabled = w.resizeEnabled;
+            v.type = w.widgetType;
+            v.title = w.title;
+            v.options = w.options;
+            dto.widgets.push(v);
+        }
+        this.dshService.SaveUserDashboard(dto).subscribe(res => {
+            if (res.success)
+                console.log('Dashboard saved');
+        });
+    }
+    renderLayout(comps) {
+        this.clearTrackedSubscriptions();
+        comps.map((host, index) => {
+            const vcr = host;
+            vcr.clear();
+            const widgetData = this.widgetDefinitions[index];
+            if (!widgetData || !widgetData.widgetType)
+                return;
+            let componentRef;
+            componentRef = this.cmpFactory.resolveComponent(widgetData === null || widgetData === void 0 ? void 0 : widgetData.widgetType, vcr);
+            if (!componentRef) {
+                console.log(`Tipo widget sconosciuto ${widgetData.widgetType}`);
+                return;
+            }
+            //setta l'input della data
+            if (this.Configuration.showDateInput)
+                componentRef.instance.DashboardDate = this.dashboardDate;
+            //setta il modello
+            componentRef.instance.setWidgetModel(widgetData);
+            //setta la callback per OnRemove
+            let s = componentRef.instance.OnRemove.subscribe(name => this.removeItem(name));
+            this.trackedSubscriptions.push(s);
+            //componentRef.changeDetectorRef.markForCheck();
+            //componentRef.changeDetectorRef.detectChanges();
+        });
+        this.cdr.detectChanges();
+    }
+    addItem() {
+        //this.dashboard.push({});
+    }
+}
+DashboardComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'dashboard',
+                encapsulation: ViewEncapsulation.None,
+                providers: [
+                    { provide: LocalizationService, useClass: DashboardLoc }
+                ],
+                template: "<ng-container *ngIf=\"Configuration\">\r\n\r\n    <form role=\"form\" class=\"jace-dsh-toolbar\" *ngIf=\"Configuration.showToolbar\">\r\n        <div *ngIf=\"Configuration.dashboardTitle\" class=\"jace-dsh-toolbar-title\">\r\n            {{Configuration.dashboardTitle}}\r\n        </div>\r\n        <div class=\"jace-dsh-toolbar-dtp\" *ngIf=\"Configuration?.showDateInput\">\r\n            <form-date [JsDates]=\"true\" [FormLayout]=\"false\" id=\"txt_dashboarddate\" [Validation]=\"false\"\r\n                autocomplete=\"off\" [(ngModel)]=\"dashboardDate\" name=\"dashboarddate\" [Placeholder]=\"'Dashboard Date'\">\r\n            </form-date>\r\n        </div>\r\n        <div class=\"jace-dsh-save-button\" (click)=\"saveDashboard()\">\r\n            <span class=\"transition\">\r\n                <i class=\"fa fa-save\"></i>\r\n            </span>\r\n        </div>\r\n    </form>\r\n\r\n    <gridster [options]=\"Configuration.gridsterConfig\" class=\"jace-dsh-widget-area\">\r\n        <gridster-item [item]=\"item\" *ngFor=\"let item of widgetDefinitions\" class=\"jace-dsh-widget {{item.name}}\">\r\n        <!-- <ng-container *ngFor=\"let item of widgetDefinitions\"> -->\r\n            <ng-template #grid_item></ng-template>\r\n        <!-- </ng-container> -->\r\n        </gridster-item>\r\n    </gridster>\r\n\r\n</ng-container>",
+                styles: [".jace-dsh-toolbar{font-size:smaller;display:flex;flex-flow:row;justify-content:flex-end;align-items:center;padding:0 1em .5em}.jace-dsh-toolbar-title{flex:2 1 auto;font-size:2em;color:#777;font-variant:small-caps}.jace-dsh-toolbar-dtp{flex:1 1 auto}.jace-dsh-save-button{font-size:larger;padding:.5em 1em;border-radius:4px;border:1px solid #ddd;color:#777;margin-left:.5em;cursor:pointer;flex:0 0 auto}.jace-dsh-save-button:hover{color:#000;border-color:#000}.jace-dsh-widget-area{background:#e9ebee;scroll-behavior:auto}.jace-dsh-widget{border:1px solid #ddd;border-radius:5px;min-width:204px}.jace-dsh-widget-header{margin:0 .5rem;display:flex;flex-flow:row;justify-content:left;align-items:center}.jace-dsh-widget-title{padding:.5rem .2rem .3rem;border-bottom:1px solid #ddd;text-transform:uppercase;font-size:.8rem}.jace-dsh-widget-body{margin:0 .5rem;display:flex;flex-wrap:nowrap;overflow-x:clip}.jace-dsh-widget-loading{padding:.5rem;width:100%;flex:0 0 auto;font-size:4rem;font-weight:700;text-align:center}.jace-dsh-widget-slide{transition-property:transform;transition-duration:.75s;transition-timing-function:ease;width:100%;flex:0 0 auto}.jace-dsh-widget-content-show{transform:translate(0) translateZ(0)}.jace-dsh-widget-content-hide,.jace-dsh-widget-settings-show{transform:translate(-100%) translateZ(0)}.jace-dsh-widget-settings-hide{transform:translate(0) translateZ(0)}.jace-dsh-widget-settings{padding:.5rem;width:100%;flex:0 0 auto}.jace-dsh-widget-controls{margin-left:auto;order:2;z-index:1;top:0;right:0;padding:.2rem .1rem;font-size:1rem;color:#bbb;align-items:center;cursor:pointer}.jace-dsh-widget-drag{font-size:.78em}.jace-dsh-widget-opts{font-size:.92em}.jace-dsh-widget-close{font-size:1.1em}.jace-dsh-widget-controls span{margin-right:.1rem;margin-left:.1rem}.jace-dsh-widget-controls span:hover{color:#637ca0}"]
+            },] }
+];
+DashboardComponent.ctorParameters = () => [
+    { type: undefined, decorators: [{ type: Inject, args: [DSH_DATA_SERVICE,] }] },
+    { type: InterComService },
+    { type: LocalizationService },
+    { type: ActivatedRoute },
+    { type: DashboardWidgetFactory },
+    { type: ChangeDetectorRef }
+];
+DashboardComponent.propDecorators = {
+    Configuration: [{ type: Input }],
+    gridItemRefs: [{ type: ViewChildren, args: ['grid_item', { read: ViewContainerRef },] }]
+};
+
+const Repository = {
+    GET_Dashboard_GetLayout: "/api/Dashboard/GetLayout",
+    POST_Dashboard_SaveLayout: "/api/Dashboard/SaveLayout",
+    GET_Dashboard_GetWidgetData: "/api/Dashboard/GetWidgetData"
+};
+
+class DashboardFeatureAPIDataService {
+    constructor(http, backend) {
+        this.http = http;
+        this.backend = backend;
+    }
+    GetUserDashboard(idaccount, dashboardName) {
+        let params = new HttpParams();
+        params = params.append("idaccount", idaccount.toString());
+        params = params.append("name", dashboardName);
+        return this.http.get(this.backend + Repository["GET_Dashboard_GetLayout"], params);
+    }
+    SaveUserDashboard(dto) {
+        return this.http.post(this.backend + Repository["POST_Dashboard_SaveLayout"], dto);
+    }
+    GetWidgetData(name, options) {
+        let params = new HttpParams();
+        params = params.append("name", name.toString());
+        if (options && Object.keys(options).length != 0) {
+            for (let index = 0; index < Object.keys(options).length; index++) {
+                const k = Object.keys(options)[index];
+                params = params.append(k, options[k]);
+            }
+        }
+        return this.http.get(this.backend + Repository["GET_Dashboard_GetWidgetData"], params);
+    }
+}
+DashboardFeatureAPIDataService.decorators = [
+    { type: Injectable }
+];
+DashboardFeatureAPIDataService.ctorParameters = () => [
+    { type: HTTPService },
+    { type: String, decorators: [{ type: Inject, args: [DSH_BACKEND_URL,] }] }
+];
+
+const MODULES = [
+    // Base
+    CommonModule,
+    FormsModule,
+    GridsterModule,
+    MatProgressBarModule,
+    FormsAndValidationsModule,
+    EsChartsModule,
+    HttpserviceModule,
+    /* EsChartsModule.forRoot({
+      locale: myconfig.LOCALE,
+      animations: true,
+      theme: 'spiritedaway',
+      adapter: null,
+      debugMode: false
+    }),  */
+    NgCircleProgressModule.forRoot({
+        // set defaults here
+        radius: 50,
+        outerStrokeWidth: 8,
+        innerStrokeWidth: 4,
+        outerStrokeColor: "#78C000",
+        innerStrokeColor: "#C7E596",
+        animationDuration: 300
+    })
+];
+const COMPONENTS = [
+    DashboardComponent,
+    JaceListWidgetComponent,
+    JaceCounterWidgetComponent,
+    JaceChartWidgetComponent,
+    JaceMultiprogWidgetComponent
+];
+class DashboardFeatureModule {
+    constructor(componentFactory, options) {
+        if (!options) {
+            //componentFactory.addOption(new DefaultDashboardModuleOptions());
+            return;
+        }
+        options.map((o) => componentFactory.addOption(o));
+    }
+    static forRoot(options) {
+        return {
+            ngModule: DashboardFeatureModule,
+            providers: [
+                { provide: DSH_OPTIONS, multi: true, useValue: new DefaultDashboardModuleOptions() },
+                { provide: DSH_OPTIONS, multi: true, useValue: options },
+                { provide: DSH_DATA_SERVICE, useClass: DashboardFeatureAPIDataService }
+            ]
+        };
+    }
+    static forChild(options) {
+        return {
+            ngModule: DashboardFeatureModule,
+            providers: [
+                { provide: DSH_OPTIONS, multi: true, useValue: new DefaultDashboardModuleOptions() },
+                { provide: DSH_OPTIONS, multi: true, useValue: options }
+            ]
+        };
+    }
+}
+DashboardFeatureModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [
+                    ...COMPONENTS
+                ],
+                imports: [
+                    ...MODULES
+                ],
+                exports: [
+                    ...COMPONENTS
+                ]
+            },] }
+];
+DashboardFeatureModule.ctorParameters = () => [
+    { type: DashboardWidgetFactory },
+    { type: Array, decorators: [{ type: Optional }, { type: Inject, args: [DSH_OPTIONS,] }] }
+];
+
+/**
+ * Classe di base astratta per la creazione di Widget custom.
+ */
+class BaseWidgetComponent {
+    constructor(dshService) {
+        this.dshService = dshService;
+        this.OnRemove = new EventEmitter();
+        this.configuration = false;
+        this.dataReady = false;
+        this.lastdate = "";
+    }
+    setWidgetModel(widgetModel) {
+        this.model = widgetModel;
+        this.refreshData();
+    }
+    ngOnInit() { }
+    ngOnChanges(changes) {
+        //console.log(changes['DashboardDate'].currentValue);
+        if (changes['DashboardDate'].previousValue)
+            this.lastdate = changes['DashboardDate'].previousValue.toISOString();
+        let curdate = "";
+        if (changes['DashboardDate'].currentValue)
+            curdate = changes['DashboardDate'].currentValue.toISOString();
+        //fix per il datetimepicker material che cambia l'oggetto al momento del caricamento
+        if (this.lastdate != curdate) {
+            this.lastdate = curdate;
+            this.refreshData();
+        }
+    }
+    /**
+     * Prepara i parametri e lancia la chiamata GetWidgetData della DashboardFeatureService.
+     * Imposta il model con i dati restituiti (setData) e imposta la variabile dataReady del campo a true
+     */
+    refreshData() {
+        if (!this.model)
+            return;
+        const pars = {};
+        if (this.DashboardDate)
+            pars["DT"] = this.DashboardDate.toISOString();
+        if (this.model.options && Object.keys(this.model.options).length != 0) {
+            for (let index = 0; index < Object.keys(this.model.options).length; index++) {
+                const k = Object.keys(this.model.options)[index];
+                pars[k] = this.model.options[k];
+            }
+        }
+        this.prepareGetDataParameters(pars);
+        this.dshService.GetWidgetData(this.model.name, pars).subscribe(data => {
+            if (this.model) {
+                this.model.setData(data);
+                this.dataReady = true;
+            }
+        });
+    }
+    /**
+     * Da chiamare quando l'utente preme il pulsante 'rimuovi' nella toolbar della widget.
+     */
+    removeWidget() {
+        if (!this.model)
+            return;
+        this.OnRemove.emit(this.model.name);
+    }
+    /**
+     * Da chiamare quando viene premuto il pulsante 'configure' nella toolbar della widget
+     */
+    configureWidget() {
+        if (this.configuration) {
+            //finito di configurare -> refreshData
+            this.refreshData();
+        }
+        this.configuration = !this.configuration;
+    }
+}
+BaseWidgetComponent.decorators = [
+    { type: Injectable }
+];
+BaseWidgetComponent.ctorParameters = () => [
+    { type: undefined, decorators: [{ type: Inject, args: [DSH_DATA_SERVICE,] }] }
+];
+
+var JaceWidgetTypes;
+(function (JaceWidgetTypes) {
+    JaceWidgetTypes["CHART"] = "CHART";
+    JaceWidgetTypes["COUNTER"] = "COUNTER";
+    JaceWidgetTypes["LIST"] = "LIST";
+    JaceWidgetTypes["MULTIPROGRESS"] = "MULTIPROGRESS";
+})(JaceWidgetTypes || (JaceWidgetTypes = {}));
+
+/*
+ * Public API Surface of dashboard-feature
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { BaseJaceWidgetModel, BaseWidgetComponent, DSH_BACKEND_URL, DSH_DATA_SERVICE, DSH_LOCALE, DashboardComponent, DashboardFeatureModule, DefaultDashboardModuleOptions, JaceChartWidgetComponent, JaceCounterWidgetComponent, JaceListWidgetComponent, JaceMultiprogWidgetComponent, JaceWidgetTypes, DashboardLoc as ɵa, DSH_OPTIONS as ɵb, DashboardWidgetFactory as ɵc, DashboardFeatureAPIDataService as ɵd };
+//# sourceMappingURL=esfaenza-dashboard-feature.js.map