@esfaenza/es-table 13.1.14 → 13.1.18

package/fesm2015/esfaenza-es-table.mjs

@@ -5,26 +5,29 @@ import { LocalizationService, LocalizationModule } from '@esfaenza/localizations
 import * as i5 from '@esfaenza/extensions';
 import { UtilityService, ExportService, HashingService, MessageService } from '@esfaenza/extensions';
 import * as i3 from '@angular/material/form-field';
-import * as i10 from '@angular/common';
+import * as i11 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i5$1 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
 import * as i1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import { __awaiter } from 'tslib';
-import * as i15 from '@angular/cdk/drag-drop';
+import * as i16 from '@angular/cdk/drag-drop';
 import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
+import { Subject } from 'rxjs';
 import * as i2$1 from '@esfaenza/preferences';
 import * as i1$1 from '@angular/platform-browser';
-import * as i9 from '@esfaenza/ngx-contextmenu';
+import * as i9 from '@esfaenza/forms-and-validations';
+import { FormsAndValidationsModule } from '@esfaenza/forms-and-validations';
+import * as i10 from '@esfaenza/ngx-contextmenu';
 import { ContextMenuModule } from '@esfaenza/ngx-contextmenu';
-import * as i11 from '@ctrl/ngx-csv';
+import * as i12 from '@ctrl/ngx-csv';
 import { CsvModule } from '@ctrl/ngx-csv';
-import * as i12 from 'ngx-bootstrap/dropdown';
+import * as i13 from 'ngx-bootstrap/dropdown';
 import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
-import * as i13 from '@angular/router';
+import * as i14 from '@angular/router';
 import { RouterModule } from '@angular/router';
-import * as i14 from 'ngx-bootstrap/modal';
+import * as i15 from 'ngx-bootstrap/modal';
 import { ModalModule } from 'ngx-bootstrap/modal';
 import { MatSelectModule } from '@angular/material/select';
 
@@ -128,7 +131,7 @@ class TablePagerComponent {
     }
 }
 TablePagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: TablePagerComponent, deps: [{ token: i5.MessageService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: EST_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-TablePagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: TablePagerComponent, selector: "app-paging", inputs: { CurrentPageSize: "CurrentPageSize", View: "View", WarnOnAll: "WarnOnAll", AllSearch: "AllSearch", DefaultAll: "DefaultAll", GroupMode: "GroupMode", GroupCount: "GroupCount", CountLabel: "CountLabel", ShowCount: "ShowCount", ShowPaging: "ShowPaging", PagerCount: "PagerCount", Hidden: "Hidden" }, outputs: { pagingSelected: "pagingSelected" }, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!Hidden\">\r\n  <span class=\"est-fs-14\"> {{CountLabel && !GroupMode ? CountLabel : ((GroupMode ? 'Shown Groups' : 'Shown Elements') | localize : lc)}}:&nbsp;</span>\r\n  <ng-container *ngIf=\"ShowPaging && Model && (Model == DefaultAll || PagerCount >= Model || PagerCount == -1)\">\r\n    <mat-form-field [appearance]=\"'legacy'\" class=\"mat-paginator-page-size-select est-fs-14 est-ipp-bold\">\r\n      <select matNativeControl [ngModel]=\"Model\" name=\"input\" (ngModelChange)=\"choice($event)\">\r\n        <ng-container *ngFor=\"let pOpt of PagingOptions\">\r\n          <option *ngIf=\"pOpt == DefaultAll || PagerCount >= pOpt || PagerCount == -1\" [value]=\"pOpt\">{{ pOpt == DefaultAll ? ('All' | localize : lc) : pOpt.toString()}}</option>\r\n        </ng-container>\r\n      </select>\r\n    </mat-form-field>\r\n    <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">&nbsp;/&nbsp;</span>\r\n  </ng-container>\r\n  <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">{{PagerCount | number : '0.0-0' : locale}}</span>\r\n</ng-container>", styles: [".est-rg-ipp-sel-all,.est-rg-ipp-sel,.est-ipp-sel-all,.est-ipp-sel{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block;display:inline}.est-ipp-bold{font-weight:700}.mat-paginator-page-size-select{margin:6px 4px 0;width:50px}.mat-paginator-page-size-select .mat-form-field-wrapper{height:52px!important;margin-top:-15px!important;padding:0!important}.mat-form-field-type-mat-native-select .mat-form-field-infix:after{margin-top:-5.5px!important}\n"], components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], pipes: { "localize": i2.LocalizePipe, "number": i10.DecimalPipe }, viewProviders: [{ provide: LocalizationService, useClass: TablePagerLoc }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+TablePagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: TablePagerComponent, selector: "app-paging", inputs: { CurrentPageSize: "CurrentPageSize", View: "View", WarnOnAll: "WarnOnAll", AllSearch: "AllSearch", DefaultAll: "DefaultAll", GroupMode: "GroupMode", GroupCount: "GroupCount", CountLabel: "CountLabel", ShowCount: "ShowCount", ShowPaging: "ShowPaging", PagerCount: "PagerCount", Hidden: "Hidden" }, outputs: { pagingSelected: "pagingSelected" }, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!Hidden\">\r\n  <span class=\"est-fs-14\"> {{CountLabel && !GroupMode ? CountLabel : ((GroupMode ? 'Shown Groups' : 'Shown Elements') | localize : lc)}}:&nbsp;</span>\r\n  <ng-container *ngIf=\"ShowPaging && Model && (Model == DefaultAll || PagerCount >= Model || PagerCount == -1)\">\r\n    <mat-form-field [appearance]=\"'legacy'\" class=\"mat-paginator-page-size-select est-fs-14 est-ipp-bold\">\r\n      <select matNativeControl [ngModel]=\"Model\" name=\"input\" (ngModelChange)=\"choice($event)\">\r\n        <ng-container *ngFor=\"let pOpt of PagingOptions\">\r\n          <option *ngIf=\"pOpt == DefaultAll || PagerCount >= pOpt || PagerCount == -1\" [value]=\"pOpt\">{{ pOpt == DefaultAll ? ('All' | localize : lc) : pOpt.toString()}}</option>\r\n        </ng-container>\r\n      </select>\r\n    </mat-form-field>\r\n    <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">&nbsp;/&nbsp;</span>\r\n  </ng-container>\r\n  <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">{{PagerCount | number : '0.0-0' : locale}}</span>\r\n</ng-container>", styles: [".est-rg-ipp-sel-all,.est-rg-ipp-sel,.est-ipp-sel-all,.est-ipp-sel{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block;display:inline}.est-ipp-bold{font-weight:700}.mat-paginator-page-size-select{margin:6px 4px 0;width:50px}.mat-paginator-page-size-select .mat-form-field-wrapper{height:52px!important;margin-top:-15px!important;padding:0!important}.mat-form-field-type-mat-native-select .mat-form-field-infix:after{margin-top:-5.5px!important}\n"], components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], pipes: { "localize": i2.LocalizePipe, "number": i11.DecimalPipe }, viewProviders: [{ provide: LocalizationService, useClass: TablePagerLoc }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: TablePagerComponent, decorators: [{
             type: Component,
             args: [{ selector: "app-paging", viewProviders: [{ provide: LocalizationService, useClass: TablePagerLoc }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!Hidden\">\r\n  <span class=\"est-fs-14\"> {{CountLabel && !GroupMode ? CountLabel : ((GroupMode ? 'Shown Groups' : 'Shown Elements') | localize : lc)}}:&nbsp;</span>\r\n  <ng-container *ngIf=\"ShowPaging && Model && (Model == DefaultAll || PagerCount >= Model || PagerCount == -1)\">\r\n    <mat-form-field [appearance]=\"'legacy'\" class=\"mat-paginator-page-size-select est-fs-14 est-ipp-bold\">\r\n      <select matNativeControl [ngModel]=\"Model\" name=\"input\" (ngModelChange)=\"choice($event)\">\r\n        <ng-container *ngFor=\"let pOpt of PagingOptions\">\r\n          <option *ngIf=\"pOpt == DefaultAll || PagerCount >= pOpt || PagerCount == -1\" [value]=\"pOpt\">{{ pOpt == DefaultAll ? ('All' | localize : lc) : pOpt.toString()}}</option>\r\n        </ng-container>\r\n      </select>\r\n    </mat-form-field>\r\n    <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">&nbsp;/&nbsp;</span>\r\n  </ng-container>\r\n  <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">{{PagerCount | number : '0.0-0' : locale}}</span>\r\n</ng-container>", styles: [".est-rg-ipp-sel-all,.est-rg-ipp-sel,.est-ipp-sel-all,.est-ipp-sel{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block;display:inline}.est-ipp-bold{font-weight:700}.mat-paginator-page-size-select{margin:6px 4px 0;width:50px}.mat-paginator-page-size-select .mat-form-field-wrapper{height:52px!important;margin-top:-15px!important;padding:0!important}.mat-form-field-type-mat-native-select .mat-form-field-infix:after{margin-top:-5.5px!important}\n"] }]
@@ -252,6 +255,8 @@ class EsTdDirective {
         this.Template = Template;
         /** Variabile interna che indica il fatto che questo componente è una direttiva. Serve per disambigualrlo dell'EsTdComponent */
         this._directive = true;
+        /** Variabile interna che indica il fatto che questo template si riferisce a una proprietà multipla */
+        this._multi = false;
         /** Indica se la cella è visibile o meno di default */
         this.tdVisible = true;
         /** Equivalente dell'NgIf sul td */
@@ -275,9 +280,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
 
 /** Direttiva per la dichiarazione snella di un EsTh da emettere come header */
 class EsThDirective {
-    /**
-     * @ignore
-     */
+    /** @ignore */
     constructor(Template) {
         this.Template = Template;
         /** Variabile interna all'interno della quale viene raccolta la cache delle aggregazioni specificate in thAggregation */
@@ -288,6 +291,10 @@ class EsThDirective {
         this._directive = true;
         /** Variabile interna impostata dall'**EsTable**, per controllare che ci sia almeno un TD che utilizzi quest'header */
         this._referenced = false;
+        /** Variabile interna che indica il fatto che questo template si riferisce a una proprietà multipla */
+        this._multi = false;
+        /** Variabile interna che indica il contenuto dell'header in caso di multi */
+        this._multi_content = "";
         /** Id della colonna, dev'essere lo stesso per tutti i **td** relativi */
         this.th = "";
         /** Indica se la colonna è pinnata o no */
@@ -316,10 +323,12 @@ class EsThDirective {
         this.thGroup = false;
         /** Indica che bisogna fare una aggregazione su questa colonna, a fronte di almeno un altra con un raggruppamento */
         this.thAggregation = null;
+        /** Impostazioni per la modifica inline di questo campo: la **Property** di riferimento e il **Type** (a scelta fra quelli supportati dal form-adaptive) */
+        this.thUserEdits = null;
     }
 }
 EsThDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsThDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-EsThDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: EsThDirective, selector: "[th]", inputs: { th: "th", thPinned: "thPinned", thPinnable: "thPinnable", thPinnedWidth: "thPinnedWidth", thVisible: "thVisible", thFixed: "thFixed", thParent: "thParent", thOrder: "thOrder", thOrderable: "thOrderable", thWrap: "thWrap", thResizable: "thResizable", thClass: "thClass", thGroupClass: "thGroupClass", thIf: "thIf", thEmpty: "thEmpty", thGroup: "thGroup", thAggregation: "thAggregation" }, ngImport: i0 });
+EsThDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: EsThDirective, selector: "[th]", inputs: { th: "th", thPinned: "thPinned", thPinnable: "thPinnable", thPinnedWidth: "thPinnedWidth", thVisible: "thVisible", thFixed: "thFixed", thParent: "thParent", thOrder: "thOrder", thOrderable: "thOrderable", thWrap: "thWrap", thResizable: "thResizable", thClass: "thClass", thGroupClass: "thGroupClass", thIf: "thIf", thEmpty: "thEmpty", thGroup: "thGroup", thAggregation: "thAggregation", thUserEdits: "thUserEdits", thMulti: "thMulti" }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsThDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[th]' }]
@@ -357,6 +366,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                 type: Input
             }], thAggregation: [{
                 type: Input
+            }], thUserEdits: [{
+                type: Input
+            }], thMulti: [{
+                type: Input
             }] } });
 
 /** Classe di localizzazione per il componente **EsTableComponent** */
@@ -531,9 +544,11 @@ class EsTableColumn {
      * @param {boolean} pinned Indica se è una colonna pinnata
      * @param {number} pinnedWidth Indica la dimensione da assegnare a questa colonna quando è pinnata
      * @param {TemplateRef<any>} template Indica il template da usare per mostrare il testo dell'Header
-     * @param {TemplateRef<any>[]} parentTemplates Indica la lista di template padri collegata a questo header
+     * @param {{ tmpl: TemplateRef<any>, content: string }[]} parentTemplates Indica la lista di template padri collegata a questo header, rappresentati come Template o come stringa qualora fosse generato automaticamente (caso **Multi**)
+     * @param {boolean} multi Indica che la colonna deriva da una direttiva **Multi**
+     * @param {string} multiContent Indica il contenuto della direttiva **Multi** per questa colonna
      */
-    constructor(id, description, visible, fixed, pinned, pinnable, pinnedWidth, template, parentTemplates) {
+    constructor(id, description, visible, fixed, pinned, pinnable, pinnedWidth, template, parentTemplates, multi, multiContent) {
         this.id = id;
         this.description = description;
         this.visible = visible;
@@ -543,6 +558,8 @@ class EsTableColumn {
         this.pinnedWidth = pinnedWidth;
         this.template = template;
         this.parentTemplates = parentTemplates;
+        this.multi = multi;
+        this.multiContent = multiContent;
     }
 }
 
@@ -628,7 +645,7 @@ class ColumnMetadataHandler {
             // Di default la visibilità è quella impostata nel componente
             if ((this.est.HiddenColumns || th.thVisible) && th.thIf) {
                 let previouslyPinned = !this.est.ColumnsList || this.est.ColumnsList.length == 0 ? null : this.est.ColumnsList.find(t => t.id == column) || null;
-                let toAdd = new EsTableColumn(column, null, th.thVisible, (th.thFixed || th.thGroup), previouslyPinned == null ? th.thPinned : previouslyPinned.pinned, th.thPinnable, th.thPinnedWidth, th.Template, th._thParents);
+                let toAdd = new EsTableColumn(column, null, th.thVisible, (th.thFixed || th.thGroup), previouslyPinned == null ? th.thPinned : previouslyPinned.pinned, th.thPinnable, th.thPinnedWidth, th.Template, th._thParents, th._multi, th._multi_content);
                 if (previouslyPinned)
                     toAdd.prev_index = previouslyPinned.prev_index;
                 this.est.TMPColumnsList.push(toAdd);
@@ -637,6 +654,110 @@ class ColumnMetadataHandler {
         this.est.ColumnsList = [];
         this.est.TMPColumnsList.forEach(c => { this.est.ColumnsList.push(Object.assign({}, c)); });
     }
+    expandMultiThsAndTds(ths, tds, items) {
+        // Registro le info sui multiprovider
+        let multiDefs = {};
+        for (let i = 0; i < ths.length; i++) {
+            let th = ths[i];
+            if (!th.thMulti)
+                continue;
+            multiDefs[th.th] = { On: th.th, tdref: null, thref: th, thgen: {}, tdgen: {} };
+        }
+        // Assegno le info anche ai td
+        for (let i = 0; i < tds.length; i++) {
+            let td = tds[i];
+            td._multi = !!multiDefs[td.td];
+            if (td._multi)
+                multiDefs[td.td].tdref = td;
+        }
+        // Rimuovo i multitemplate dalle balle
+        // N.B: Dato che la prima operazione su th e td è questa il riferimento originale viene sovrascritto, questo significa che devo ri-emettere i due nuovi array
+        ths = ths.filter(t => !t.thMulti);
+        tds = tds.filter(t => !t._multi);
+        let parentThs = {};
+        let addedHeaders = {};
+        let tdsToAdd = {};
+        let thsToAdd = [];
+        // Per ogni item vedo se ci sono dei multi per le proprietà che li definiscono
+        for (let i = 0; i < items.length; i++) {
+            let itm = items[i];
+            for (let prop in multiDefs) {
+                // Se la proprietà del multi esiste nell'oggetto ed ha una lunghezza
+                if (itm[prop] && itm[prop].length) {
+                    let multiRef = multiDefs[prop];
+                    let reftd = multiRef.tdref;
+                    let refth = multiRef.thref;
+                    for (let ii = 0; ii < itm[prop].length; ii++) {
+                        // Header già aggiunto, non devo inserire altri template di header/colonna
+                        let estmv = itm[prop][ii];
+                        if (!estmv._headersHierarchy)
+                            estmv._headersHierarchy = estmv.header_group ? estmv.header_group.split(">").map(t => t.trim()) : [];
+                        let headerValue = estmv.header;
+                        let parent = estmv.header_group || null;
+                        let parentsHier = estmv._headersHierarchy;
+                        if (addedHeaders[`${parent}_${headerValue}`])
+                            continue;
+                        else
+                            addedHeaders[`${parent}_${headerValue}`] = true;
+                        // Per ogni valore diverso delle proprietà devo aggiungere un td e un th, quest'ultimo dev'essere eventualmente collegato ad un header
+                        let newtH = new EsThDirective(refth.Template);
+                        newtH._multi = true;
+                        newtH._multi_content = headerValue;
+                        newtH.th = `${prop}_${ii}`;
+                        newtH.thClass = refth.thClass;
+                        newtH.thIf = refth.thIf;
+                        newtH.thVisible = refth.thVisible;
+                        newtH.thWrap = refth.thWrap;
+                        // Il parent è sempre l'ultimo nella gerarchia di padri
+                        newtH.thParent = parentsHier[parentsHier.length - 1];
+                        newtH.thOrderable = false;
+                        for (let i = 0; i < parentsHier.length; i++) {
+                            let par = parentsHier[i];
+                            if (!parentThs[par])
+                                parentThs[par] = true;
+                            else
+                                continue;
+                            let thParent = new EsThDirective(null);
+                            thParent.th = par;
+                            thParent._multi_content = par;
+                            thParent.thParent = i > 0 ? parentsHier[i - 1] : null;
+                            thsToAdd.push(thParent);
+                        }
+                        thsToAdd.push(newtH);
+                        let newTd = new EsTdDirective(reftd.Template);
+                        newTd._multi = true;
+                        newTd.td = `${prop}_${ii}`;
+                        newTd.tdClass = reftd.tdClass;
+                        newTd.tdIf = reftd.tdIf;
+                        newTd.tdVisible = reftd.tdVisible;
+                        tdsToAdd[newTd.td] = newTd;
+                    }
+                }
+            }
+        }
+        // Ordino gli header aggiunti in base al Parent, se presente, e li aggiungo alla lista dei th, dopodiché in base allo stesso ordinamento aggiungo i relativi td
+        let orderedThs = [];
+        // Prima metto tutti i th senza parent, poi per ogni parent prendo i th ordinati come li trovo nella lista
+        for (let i = 0; i < thsToAdd.length; i++) {
+            if (!thsToAdd[i].thParent)
+                orderedThs.push(thsToAdd[i]);
+        }
+        for (let prop in parentThs) {
+            for (let i = 0; i < thsToAdd.length; i++) {
+                let th = thsToAdd[i];
+                if (th.thParent && th.thParent == prop)
+                    orderedThs.push(th);
+            }
+        }
+        ths = [...ths, ...thsToAdd];
+        for (let i = 0; i < thsToAdd.length; i++) {
+            // Se il th è un header td verrebbe undefined. Lo aggiungo solo se è effettivamente presente
+            let td = tdsToAdd[thsToAdd[i].th];
+            if (td)
+                tds.push(td);
+        }
+        return { expTds: tds, expThs: ths };
+    }
     /**
      * Prende i th e i td in modalità diretive e li ordina in base a se ci sono colonne fixed o meno
      */
@@ -762,9 +883,9 @@ class ColumnMetadataHandler {
             this.est.changed();
     }
     /**
-     * In base alla visibilità registrata nelle **ColumnsList** questo metodo si occupa di prendere tutti i **EsThs** ed **EsTds** relativi e nasonderli/mostrarli
+     * In base alla visibilità registrata nelle **ColumnsList** questo metodo si occupa di prendere tutti i **EsThDirective** ed **EsTdDirective** relativi e nasonderli/mostrarli
      *
-     * Costo: 1 scan ColumnsList, 1 scan EsThs, 1 scan EsTds
+     * Costo: 1 scan ColumnsList, 1 scan EsThDirectives, 1 scan EsTdDirectives
      *
      * @param {EsThDirective[]} ths Header della tabella
      * @param {EsTdDirective[]} tds Celle della tabella
@@ -912,13 +1033,13 @@ class ColumnMetadataHandler {
                     currentSpan++;
                 else {
                     if (currentSpan > 0)
-                        levelArray.push({ Span: currentSpan, Template: (currentParent ? infos.thsCache[currentParent].Template : null), Borders: !!currentParent });
+                        levelArray.push({ Span: currentSpan, Template: currentParent ? infos.thsCache[currentParent].Template : null, Content: currentParent ? infos.thsCache[currentParent]._multi_content : null, Borders: !!currentParent });
                     currentSpan = 1;
                     currentParent = item;
                 }
             }
             // Ultima aggiunta che altrimenti mi rimarrebbe in cache
-            levelArray.push({ Span: currentSpan, Template: (currentParent ? infos.thsCache[currentParent].Template : null), Borders: !!currentParent });
+            levelArray.push({ Span: currentSpan, Template: currentParent ? infos.thsCache[currentParent].Template : null, Content: currentParent ? infos.thsCache[currentParent]._multi_content : null, Borders: !!currentParent });
             if (this.est.Removal)
                 levelArray.push({ Span: 1, Template: null });
             if (this.est.Export || this.est.HiddenColumns || this.est.ColumnsOrdering || this.est.CornerMenuOptions)
@@ -942,8 +1063,10 @@ class ColumnMetadataHandler {
             parent = th.thParent;
             if (parent) {
                 th = thsCache[parent];
-                if (!th.thEmpty)
-                    parentsPrepend.unshift(th.Template);
+                if (!th.thEmpty && !th._multi_content)
+                    parentsPrepend.unshift({ tmpl: th.Template });
+                else if (!th.thEmpty && th._multi_content)
+                    parentsPrepend.unshift({ content: th._multi_content });
                 jumps++;
             }
         } while (parent);
@@ -3006,7 +3129,7 @@ class EsTh {
     }
 }
 EsTh.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsTh, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-EsTh.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: EsTh, selector: "[es-th]", inputs: { ID: ["es-th", "ID"], Order: "Order", Orderable: "Orderable", Display: "Display", Resizable: "Resizable", Pinned: "Pinned", SearchInProgress: "SearchInProgress", OrderBy: "OrderBy", Wrap: "Wrap", Fixed: "Fixed", Template: "Template", Visible: "Visible" }, outputs: { onOrderChange: "onOrderChange", onUnpinning: "onUnpinning" }, host: { listeners: { "window:mouseup.out-zone": "onMouseUp()", "window:mousemove.out-zone": "onMouseMove($event)" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: "<span (click)=\"setupNextOrderAndNotify()\" [class.app-no-selection]=\"!!ID && Orderable\" [class.app-pointer]=\"!!ID && Orderable\">\r\n    <span #content>\r\n        <ng-container *ngIf=\"Template\">\r\n            <ng-container *ngTemplateOutlet=\"Template\"></ng-container>\r\n        </ng-container>\r\n        <ng-content *ngIf=\"!Template\"></ng-content>\r\n    </span>&nbsp;\r\n    <span class=\"fa\" [class.fa-chevron-down]=\"Order == 'DESC'\" [class.fa-chevron-up]=\"Order == 'ASC'\"></span>\r\n</span>\r\n<span *ngIf=\"Pinned && !Fixed\" class=\"app-pointer fa fa-thumb-tack est-quick-unpin\" (click)=\"unpin()\"></span>\r\n<div [hidden]=\"!Resizable || Fixed || Pinned\" class=\"est-head-resizer\" (mousedown)=\"onResizeStart($event)\">\r\n    <div class=\"est-head-resizer-internal\"></div>\r\n</div>", directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+EsTh.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: EsTh, selector: "[es-th]", inputs: { ID: ["es-th", "ID"], Order: "Order", Orderable: "Orderable", Display: "Display", Resizable: "Resizable", Pinned: "Pinned", SearchInProgress: "SearchInProgress", OrderBy: "OrderBy", Wrap: "Wrap", Fixed: "Fixed", Template: "Template", Visible: "Visible" }, outputs: { onOrderChange: "onOrderChange", onUnpinning: "onUnpinning" }, host: { listeners: { "window:mouseup.out-zone": "onMouseUp()", "window:mousemove.out-zone": "onMouseMove($event)" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: "<span (click)=\"setupNextOrderAndNotify()\" [class.app-no-selection]=\"!!ID && Orderable\" [class.app-pointer]=\"!!ID && Orderable\">\r\n    <span #content>\r\n        <ng-container *ngIf=\"Template\">\r\n            <ng-container *ngTemplateOutlet=\"Template\"></ng-container>\r\n        </ng-container>\r\n        <ng-content *ngIf=\"!Template\"></ng-content>\r\n    </span>&nbsp;\r\n    <span class=\"fa\" [class.fa-chevron-down]=\"Order == 'DESC'\" [class.fa-chevron-up]=\"Order == 'ASC'\"></span>\r\n</span>\r\n<span *ngIf=\"Pinned && !Fixed\" class=\"app-pointer fa fa-thumb-tack est-quick-unpin\" (click)=\"unpin()\"></span>\r\n<div [hidden]=\"!Resizable || Fixed || Pinned\" class=\"est-head-resizer\" (mousedown)=\"onResizeStart($event)\">\r\n    <div class=\"est-head-resizer-internal\"></div>\r\n</div>", directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsTh, decorators: [{
             type: Component,
             args: [{ selector: "[es-th]", changeDetection: ChangeDetectionStrategy.OnPush, template: "<span (click)=\"setupNextOrderAndNotify()\" [class.app-no-selection]=\"!!ID && Orderable\" [class.app-pointer]=\"!!ID && Orderable\">\r\n    <span #content>\r\n        <ng-container *ngIf=\"Template\">\r\n            <ng-container *ngTemplateOutlet=\"Template\"></ng-container>\r\n        </ng-container>\r\n        <ng-content *ngIf=\"!Template\"></ng-content>\r\n    </span>&nbsp;\r\n    <span class=\"fa\" [class.fa-chevron-down]=\"Order == 'DESC'\" [class.fa-chevron-up]=\"Order == 'ASC'\"></span>\r\n</span>\r\n<span *ngIf=\"Pinned && !Fixed\" class=\"app-pointer fa fa-thumb-tack est-quick-unpin\" (click)=\"unpin()\"></span>\r\n<div [hidden]=\"!Resizable || Fixed || Pinned\" class=\"est-head-resizer\" (mousedown)=\"onResizeStart($event)\">\r\n    <div class=\"est-head-resizer-internal\"></div>\r\n</div>" }]
@@ -3139,6 +3262,10 @@ class EsTableComponent {
         this.expExts = expExts;
         this.dateExts = dateExts;
         this.msgExts = msgExts;
+        /** Subject utilizzato internamente lato EsTable per causare il Focus lato componente di Input */
+        this.FocusSubject = new Subject();
+        /** Se vengono effettuati 2 click a distanza inferiore a questi Millisecondi viene considerato un doppio click */
+        this.doubleClickBufferMs = 200;
         /** View finale su cui bindarsi lato Frontend, il tipo può essere IAppSearch<any> (per la **viewMode**), any[] (per l'**arrayMode**) e ReportDefinition per la **reportMode** */
         this.View = null;
         /** Indica se l'es-table deve mostrare il check globale nell'header per fare il "seleziona tutto" */
@@ -3342,6 +3469,8 @@ class EsTableComponent {
         this.UseSelectionCache = null;
         /** Permette di decidere se, in modalità raggruppamento, mostrare o meno il valore delle colonne di gruppo negli oggetti finali. Di default sono nascosti */
         this.ShowItemGroupsColumns = null;
+        /** Indica che tutti i campi che definiscono le modalità di modifica campo possono essere modificati in base alle impostazioni */
+        this.UserEdits = false;
         /** Evento che viene richiamato al cambio di oridnamento di una colonna */
         this.onOrderChanged = new EventEmitter();
         /**
@@ -3553,8 +3682,12 @@ class EsTableComponent {
                         console.error("Non posso utilizzare le preference senza che il pacchetto @esfaenza/preferences sia installato");
                     else {
                         var prefs = yield this.prefService.getItem(this.ngControl.name).toPromise();
-                        this.View.columns = (prefs === null || prefs === void 0 ? void 0 : prefs.columns) || [];
-                        this.View.column_ordering = (prefs === null || prefs === void 0 ? void 0 : prefs.column_ordering) || [];
+                        // In casi la gente si metta a spammare refresh con ngif strani sull'estable creandola e distruggendola N volte al secondo nel tempo che ci mette
+                        // a tirare su le preference da qui sopra la View potrebbe essere cambiata
+                        if (this.View) {
+                            this.View.columns = (prefs === null || prefs === void 0 ? void 0 : prefs.columns) || [];
+                            this.View.column_ordering = (prefs === null || prefs === void 0 ? void 0 : prefs.column_ordering) || [];
+                        }
                     }
                 }
                 // La paginazione devo farla solamente quando richiedo o un gruppo principale (se sono in row grouping) o se non richiedo gruppi (in tutti lgi altri casi)
@@ -3687,6 +3820,10 @@ class EsTableComponent {
             let si = this.viewMode ? view.selection : this.arraymodeSelection;
             // N.B: Rispettare l'ordine di queste 3 macrocategorie è VITALE
             // *************************************        Sistemazioni di TH, TD, e visibilità varie      *************************************
+            // Espando i th e i td multipli duplicandoli
+            let ret = this.columnMetadata_H.expandMultiThsAndTds(ths, tds, itemsAndGroups);
+            ths = ret.expThs;
+            tds = ret.expTds;
             // Prepassaggio per tirare fuori tutte le info utili sugli headers in modo da non ricacolarseli sempre dopo
             let hI = this.columnMetadata_H.evaluateHeadersGroupingInfos(ths);
             if (this.arrayMode) { // In modalità array non ho un backend...
@@ -3843,7 +3980,7 @@ class EsTableComponent {
                     let thCasted = th;
                     let isFixed = th.thFixed || th.thGroup || th.thPinned;
                     let itemToAdd = item._item ?
-                        { LeftBorder: thCasted._lbord, RightBorder: thCasted._rbord, ID: key, Pinned: columnsCache[td.td].pinned, PinnedWidth: thCasted.thPinnedWidth, GroupHeader: false, GroupAggregation: false, Visible: columnsCache[td.td].visible, Wraps: false, Class: td.tdClass, Template: thCasted.thGroup && !this.ShowItemGroupsColumns ? null : td.Template } :
+                        { LeftBorder: thCasted._lbord, RightBorder: thCasted._rbord, ID: key, Pinned: columnsCache[td.td].pinned, PinnedWidth: thCasted.thPinnedWidth, GroupHeader: false, GroupAggregation: false, Visible: columnsCache[td.td].visible, Wraps: false, Class: td.tdClass, Template: thCasted.thGroup && !this.ShowItemGroupsColumns ? null : td.Template, Multi: td._multi, MultiProp: td._multi ? td.td.split('_')[0] : null, MultiIndex: td._multi ? td.td.split('_')[1] : null, UserEdits: th.thUserEdits } :
                         { LeftBorder: thCasted._lbord, RightBorder: thCasted._rbord, ID: key, Pinned: columnsCache[td.td].pinned, PinnedWidth: thCasted.thPinnedWidth, GroupHeader: thCasted.thGroup, GroupAggregation: !!thCasted.thAggregation, Visible: columnsCache[td.td].visible, Wraps: false, Class: thCasted.thGroupClass || '', Content: this.rowGrouping_H.getGroupCellDisplay(item, key, th) };
                     if (this.TMPRowTDs[ctx]) {
                         this.TMPRowTDs[ctx].push(itemToAdd);
@@ -3895,7 +4032,7 @@ class EsTableComponent {
             let toAdd;
             if (th.thIf || th.thGroup) {
                 let thClass = (th.thClass || '') + (th.thGroup ? " est-col-min" : "");
-                toAdd = { Pinned: columnsListCache[th.th].pinned, Fixed: th.thFixed, PinnedWidth: th.thPinnedWidth, ID: th.th, Visible: th.thVisible, Class: thClass, Order: th.thOrder, Orderable: th.thOrderable, Template: th.Template, Content: null, Wrap: th.thWrap, LeftBorder: th._lbord, RightBorder: th._rbord };
+                toAdd = { Pinned: columnsListCache[th.th].pinned, Fixed: th.thFixed, PinnedWidth: th.thPinnedWidth, ID: th.th, Visible: th.thVisible, Class: thClass, Order: th.thOrder, Orderable: th.thOrderable, Template: th.Template, Content: null, Wrap: th.thWrap, LeftBorder: th._lbord, RightBorder: th._rbord, Multi: th._multi, MultiContent: th._multi_content };
                 this.TMPRowTHs.push(toAdd);
                 // Se ho un modello che deve funzionare a rowgrouping ma non è ancora stata effettuata nessuna ricerca sui gruppi principali (groupingsUndefined)
                 // li genero e mando la prima ricerca che dev'essere spedita al backend per il primo caricamento dei gruppi
@@ -4177,9 +4314,7 @@ class EsTableComponent {
         this.writeValue(this.View);
         this.internalWriteCall = false;
     }
-    /**
-     * Metodo eventualmente richiamabile anche dal componente esterno che permette di forzare un refresh della tabella
-     */
+    /** Metodo eventualmente richiamabile anche dal componente esterno che permette di forzare un refresh della tabella */
     forceRefresh() {
         // Se sono in modalità View viene mantenuto in automatico il numero di pagina, ma per la modalità array devo prendere le info di paginazione prima e riapplicarle dopo
         let arrayPage;
@@ -4195,12 +4330,86 @@ class EsTableComponent {
             this.arrayGoToPage(arrayPage);
         }
     }
+    /**
+     * Funzione che in base ai click su una cella capisce se sto effettuando un'operazione di selezione o se sto entrando nell'edit di una cella con un doppio click
+     *
+     * @param {any} $event Evento nativo javascript
+     * @param {TdElement} rowItem Riferimento a binder della riga
+     * @param {any} item Item che rappresenta il contesto su cui è stato effettuato un click
+     */
+    dbClickEditOrSingleClickRowSelection($event, rowItem, item) {
+        // Tutti i click su una cella già in edit non devono effettuare la selezione della riga
+        if (rowItem._editing)
+            return;
+        // Per evitare di rallentare a prescindere
+        if (!this.UserEdits) {
+            this.handleRowClick($event, item, this.Selection);
+            return;
+        }
+        // Secondo click: se il timer non è scaduto è un doppio click ed eseguo il resto
+        if (this.cellDbClickTimer) {
+            if (this.UserEdits && rowItem.UserEdits)
+                this.setupUserEdit(rowItem);
+            this.clearCellClickTimer();
+            return;
+        }
+        // Primo click: non fa niente e se il tempo per il secondo click scade resetta tutto
+        this.cellDbClickTimer = setTimeout(() => {
+            this.clearCellClickTimer();
+            this.handleRowClick($event, item, this.Selection);
+        }, this.doubleClickBufferMs);
+    }
+    /**
+     * Ripulisce il timer utilizzato per capire se è stato effettuato un doppio click o meno
+     */
+    clearCellClickTimer() {
+        clearTimeout(this.cellDbClickTimer);
+        this.cellDbClickTimer = null;
+    }
+    /**
+     * Handler click singolo su una riga
+     *
+     * @param {any} $event Evento nativo javascript
+     * @param {any} item Item che rappresenta il contesto su cui è stato effettuato un click
+     * @param {boolean} selection Indica se la selezione è attiva
+     *
+     */
+    handleRowClick($event, item, selection) {
+        if (selection && !item.locked && !item._sep && !item._group)
+            this.handleClick($event, item);
+        else if (item._group)
+            this.handleGroupClick(item);
+        // Ora che non è attaccato direttamente all'html devo fare un markforcheck finite le operazioni sui grouping
+        this.cdr.markForCheck();
+    }
+    /**
+     * La modifica dell'utente è iniziata. Si imposta la variabile relativa a "true" in modo da mostrare l'input di testo
+     *
+     * Dopo che l'input è apparso, dopo un ciclo di Change Detection viene attivato il Subject collegato all'input che servirà a effettuare il focus
+     *
+     * @param {TdElement} rowItem Elemento di riga su cui è stata attivata la modifica
+     */
+    setupUserEdit(rowItem) {
+        if (this.UserEdits && rowItem.UserEdits)
+            rowItem._editing = true;
+        this.cdr.detectChanges();
+        setTimeout(() => { this.FocusSubject.next(); });
+    }
+    /**
+     * La modifica dell'utente è terminata. Si reimposta la variabile relativa a "false" in modo da nascondere l'input di testo
+     *
+     * @param {TdElement} rowItem Elemento di riga su cui è stata attivata la modifica
+     * @param {any} item Oggetto sopra il quale è stata attivata la modifica
+     */
+    finalizeUserEdit(rowItem, item) {
+        rowItem._editing = false;
+    }
 }
 EsTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsTableComponent, deps: [{ token: i1.NgControl, optional: true, self: true }, { token: i2$1.PreferencesService, optional: true }, { token: EST_DEFAULTS, optional: true }, { token: EST_LOCALE, optional: true }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: UtilitiesHandler }, { token: i5.UtilityService }, { token: i5.ExportService }, { token: i5.DateService }, { token: i5.MessageService }], target: i0.ɵɵFactoryTarget.Component });
-EsTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: EsTableComponent, selector: "es-table", inputs: { CornerMenuOptions: "CornerMenuOptions", ColumnsResizable: "ColumnsResizable", ColumnsPinnable: "ColumnsPinnable", AutoUpdate: "AutoUpdate", UseCustomCells: "UseCustomCells", MaxHeight: "MaxHeight", ContainerClass: "ContainerClass", XLSXExport: "XLSXExport", CSVExport: "CSVExport", AllSearch: "AllSearch", HighCellDensity: "HighCellDensity", Selection: "Selection", ShowLoadingOnBootstrap: "ShowLoadingOnBootstrap", Removal: "Removal", RemovalCondition: "RemovalCondition", Export: "Export", ShiftClick: "ShiftClick", CountLabel: "CountLabel", HidePaging: "HidePaging", HidePagingCount: "HidePagingCount", HidePagingButtons: "HidePagingButtons", ContextMenu: "ContextMenu", ExportFileName: "ExportFileName", TableClass: "TableClass", ExportFunction: "ExportFunction", HasHeaderGroup: "HasHeaderGroup", HasSecondaryHeaderGroup: "HasSecondaryHeaderGroup", HeaderHidden: "HeaderHidden", BodyHidden: "BodyHidden", SelectionDisabled: "SelectionDisabled", SingleSelection: "SingleSelection", RowClassAssigner: "RowClassAssigner", OrderByColumn: "OrderByColumn", MultipleOrderingDirectives: "MultipleOrderingDirectives", HiddenColumns: "HiddenColumns", ColumnsOrdering: "ColumnsOrdering", SearchView: "SearchView", SelectAll: "SelectAll", UseArrayModePaging: "UseArrayModePaging", DynamicRowColumnsDefinition: "DynamicRowColumnsDefinition", DynamicOperations: "DynamicOperations", Hierarchy: "Hierarchy", ParentKey: "ParentKey", OwnKey: "OwnKey", StartsExpanded: "StartsExpanded", SavePreferences: "SavePreferences", PagingStyle: "PagingStyle", RowGroupingPagingStyle: "RowGroupingPagingStyle", SecondarySource: "SecondarySource", TertiarySource: "TertiarySource", UseSelectionCache: "UseSelectionCache", ShowItemGroupsColumns: "ShowItemGroupsColumns", ArraymodeItemsPerPage: "ArraymodeItemsPerPage" }, outputs: { onOrderChanged: "onOrderChanged", onSearchRequest: "onSearchRequest", onSelectionChanged: "onSelectionChanged", onRemoval: "onRemoval", onAbortRemoval: "onAbortRemoval", onCornerAction: "onCornerAction", onDynamicOperation: "onDynamicOperation" }, queries: [{ propertyName: "bodyRef", first: true, predicate: ["body"], descendants: true }, { propertyName: "headerRef", first: true, predicate: ["header"], descendants: true }, { propertyName: "headerGroupRef", first: true, predicate: ["headerGroup"], descendants: true }, { propertyName: "secondaryHeaderGroupRef", first: true, predicate: ["secondaryHeaderGroup"], descendants: true }, { propertyName: "EsTdsDirective", predicate: EsTdDirective }, { propertyName: "EsThsDirective", predicate: EsThDirective }], viewQueries: [{ propertyName: "exportDownloader", first: true, predicate: ["exportDownloader"], descendants: true }, { propertyName: "tableEmptyMenu", first: true, predicate: ["emptyMenu"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<!-- Patacchino di autoaggiornamento -->\r\n<div class=\"w-100\" *ngIf=\"AutoUpdate\">\r\n    <div class=\"pull-right\">\r\n        {{'Update every' | localize : lc}}&nbsp;<input [readonly]=\"autoUpdate\" maxlength=\"3\" class=\"form-control est-custom-input\" type=\"text\" [(ngModel)]=\"seconds\" />&nbsp;{{'second/s' | localize : lc}}\r\n    </div>\r\n    <div class=\"pull-right m-t-2\">\r\n        <label class=\"est-switch\">\r\n            <input type=\"checkbox\" [(ngModel)]=\"autoUpdate\" (ngModelChange)=\"autoUpdateChanged();\" />\r\n            <div class=\"est-slider round\"></div>\r\n        </label>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<div *ngIf=\"View\" class=\"est-relative\">\r\n    <div *ngIf=\"FirstBind && ShowLoadingOnBootstrap\" class=\"est-loading-box\">\r\n        <div class=\"est-loading-content\">\r\n            <span class=\"fa fa-spinner fa-spin\"></span>&nbsp;{{'Performing Table bootstrap' | localize: lc}}...\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"est-top-pager\" *ngIf=\"PagingStyle == 'both' || PagingStyle == 'top'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"est-top-allselect\" *ngIf=\"canSelectAll || (!reportMode && (View?.selection || arraymodeSelection)?.all)\">\r\n        <span>{{ (selectedObjects == -1 ? ('All the' | localize : lc) : ((selectedObjects || 0) | number : '0.0-0' : locale)) + ' ' + ((selectedObjects == 1 ? 'Object Selected' : 'Objects Selected') | localize : lc) }}</span>&nbsp;\r\n        <span class=\"est-link est-inline\" (click)=\"selection_H.selectAllOrResetSelection()\">{{ (View?.selection || arraymodeSelection)?.all ? ('Reset Selection' | localize : lc) : ('Select Everything' | localize : lc)}}</span>\r\n    </div>\r\n\r\n    <div class=\"table-responsive datatable {{ContainerClass}}\" [style.max-height.px]=\"MaxHeight\">\r\n        <table class=\"{{ TableClass }} est-margin-bottom-10\"  [class.est-high-density]=\"HighCellDensity\">\r\n            <thead [hidden]=\"HeaderHidden || FirstBind\">\r\n                <!-- Aggiungo il pezzo che gestisce la selezione di tutto se attivo da config -->\r\n                <tr *ngIf=\"SelectAll || PagingStyle != 'bottom'\">\r\n                    <th class=\"est-no-selection\" [attr.colspan]=\"Columns.Global\" [class.est-hidden-view]=\"!canSelectAll && (reportMode || !(View?.selection || arraymodeSelection)?.all) && PagingStyle == 'bottom'\">\r\n                        <p class=\"est-hidden-view app-margin-bottom-0\">\u00A7</p>\r\n                    </th>\r\n                </tr>\r\n\r\n                <!-- Blocco header group -->\r\n                <ng-container *ngIf=\"RowThGroups\">\r\n                    <tr *ngFor=\"let level of RowThGroups\">\r\n                        <th *ngFor=\"let cell of level\" [attr.colspan]=\"cell.Span\" \r\n                            [class.est-pinned-header]=\"cell.Pinned\" [class.est-col-min]=\"cell.Pinned\"\r\n                            [class.est-ltab-border]=\"cell.Borders\" [class.est-rtab-border]=\"cell.Borders\"\r\n                            class=\"est-text-center\">\r\n                            <ng-container *ngIf=\"cell.Pinned; Else: cell.Template\">\r\n                                <div class=\"est-pinned-border est-cell-group-padding\"></div>\r\n                            </ng-container>\r\n                        </th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!RowThGroups\">\r\n                    <tr *ngIf=\"HasHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"headerGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n    \r\n                    <!-- Blocco header group secondario -->\r\n                    <tr *ngIf=\"HasSecondaryHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"secondaryHeaderGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <!-- Blocco effettivo degli header -->\r\n                <tr>\r\n                    <!-- Aggiungo una checkbox se la selezione \u00E8 attiva -->\r\n                    <th class=\"est-col-min\" *ngIf=\"Selection && !HasPinnedColumns\">\r\n                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                    </th>\r\n\r\n                    <!-- Header che valgono per view mode e array mode -->\r\n                    <ng-container *ngIf=\"(viewMode || arrayMode)\">\r\n\r\n                        <!-- In una tabella base prendo semplicemente i th scritti dall'utente nell'HTML -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs) && !DynamicRowColumnsDefinition\">\r\n                            <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se ho un modello dinamico dell'oggetto creo le colonne in base alle propriet\u00E0 -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs) && DynamicRowColumnsDefinition\">\r\n                            <th *ngFor=\"let operation of DynamicOperations\" class=\"est-col-min est-no-side-padding\"></th>\r\n                            \r\n                            <ng-container *ngFor=\"let rowHeader of DynamicRowColumnsDefinition\">\r\n                                <ng-container *ngIf=\"rowHeader.visible\">\r\n                                    <th *ngIf=\"OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"thOrderChanged(rowHeader.propertyName, $event)\">{{rowHeader.description}}</th>\r\n                                    <th *ngIf=\"!OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\">{{rowHeader.description}}</th>\r\n                                </ng-container>\r\n                            </ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se non ho un modello dinamico ma invece delle celle custom, genero gli header in base ai row th -->\r\n                        <ng-container *ngIf=\"UseCustomCells && RowTHs\">\r\n                            <th *ngIf=\"HasPinnedColumns\" class=\"est-pinned-header est-col-min\">\r\n                                <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-simple-border-bottom\">\r\n                                    <th class=\"est-col-min est-no-border\" *ngIf=\"Selection\" [style.width.px]=\"20\">\r\n                                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                                    </th>\r\n                                    <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n                                        <th *ngIf=\"rowHeader && rowHeader.Visible && rowHeader.Pinned\" [style.width.px]=\"rowHeader.PinnedWidth\" es-th=\"{{rowHeader.ID}}\" \r\n                                            class=\"{{rowHeader.Class || ''}}\" \r\n                                            [class.est-pinned-internal-header]=\"true\" \r\n                                            [class.est-no-border]=\"true\" \r\n                                            [class.est-nowrap]=\"!rowHeader.Wrap\" \r\n                                            [Pinned]=\"true\" [Fixed]=\"rowHeader.Fixed\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onUnpinning)=\"columnMetadata_H.unpinColumn($event)\" (onOrderChange)=\"OrderByColumn && thOrderChanged(rowHeader.ID, $event)\">\r\n                                            <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template;\"></ng-container></ng-container>\r\n                                            <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                        </th>\r\n                                    </ng-container>\r\n                                </div>\r\n                            </th>\r\n                            <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n                                <th *ngIf=\"rowHeader && rowHeader.Visible && !rowHeader.Pinned\" es-th=\"{{rowHeader.ID}}\" class=\"{{rowHeader.Class || ''}}\" [class.est-ltab-border]=\"rowHeader.LeftBorder\" [class.est-rtab-border]=\"rowHeader.RightBorder\" [class.est-nowrap]=\"!rowHeader.Wrap\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"OrderByColumn && thOrderChanged(rowHeader.ID, $event)\">\r\n                                    <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template;\"></ng-container></ng-container>\r\n                                    <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                </th>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </ng-container>\r\n\r\n                    <!--Casistica in cui ho il setup proveniente da un report. Gli header sono definiti da come \u00E8 fatto il report-->\r\n                    <ng-container *ngIf=\"reportMode\">\r\n                        <th [style.color]=\"clm.color\" *ngFor=\"let clm of ReportValues.columns\" class=\"est-no-selection est-pointer est-nowrap\" (click)=\"reportMode_H.setupNextOrderAndSearch(clm)\">\r\n                            {{clm.description}}<span class=\"fa\" [class.fa-chevron-down]=\"clm.order == 'DESC'\" [class.fa-chevron-up]=\"clm.order == 'ASC'\"></span>\r\n                        </th>\r\n                    </ng-container>\r\n\r\n                    <!--Per l'eliminazione mi serve un header aggiuntivo-->\r\n                    <th *ngIf=\"Removal\" [class.est-right-9]=\"Export || HiddenColumns\" class=\"est-col-min est-sticky-last-column\"><span class=\"fa fa-trash\"></span></th>\r\n\r\n                    <!--Per l'esportazione mi serve l'header extra da cui faccio uscire i 3 pallocchi-->\r\n                    <th *ngIf=\"Export || HiddenColumns || ColumnsOrdering || CornerMenuOptions\" class=\"est-table-dotted-menu est-sticky-last-column est-col-min text-sm-center\">\r\n                        \r\n                        <!-- Link nascosto che serve a scaricare il file -->\r\n                        <a *ngIf=\"headers\" hidden #exportDownloader csvLink [data]=\"data\" [headers]=\"headers\" [delimiter]=\"';'\" [filename]=\"ExportFileName.endsWith('.xlsx') ? ExportFileName.replace('.xlsx', '.csv') : ExportFileName.endsWith('.csv') ? ExportFileName : ExportFileName + '.csv'\"></a>\r\n\r\n                        <!-- Blocco con i 3 pallocchi che tira fuori il context menu delle operazioni -->\r\n                        <div class=\"btn-group\" container=\"body\" placement=\"bottom right\" dropdown #dropdown=\"bs-dropdown\" [autoClose]=\"true\">\r\n                            <span dropdownToggle class=\"fa fa-ellipsis-v est-fs-18 est-pointer est-padding-3\"></span>\r\n\r\n                            <div *dropdownMenu class=\"dropdown-menu dropdown-menu-right est-bring-to-front-strong\">\r\n                                <div class=\"est-pointer\">\r\n                                    <a class=\"dropdown-item\" *ngIf=\"HiddenColumns || ColumnsOrdering\" (click)=\"columnMetadata_H.resetColumnVisSelection(); changeColumnVisibilityModal.show();\">\r\n                                        <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                                            {{'Columns Visibility' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Visibility and Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                    </a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && CSVExport\" (click)=\"export_H.tryExport('CSV')\">{{'Export View' | localize : lc}} (CSV)</a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && XLSXExport\" (click)=\"export_H.tryExport('XLSX')\">{{'Export View' | localize : lc}} (XLSX)</a>\r\n                                    <a class=\"dropdown-item\" *ngFor=\"let option of CornerMenuOptions\" (click)=\"cornerActionClicked(option.id)\">{{option.description}}</a>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </th>\r\n                </tr>\r\n            </thead>\r\n            \r\n            <!-- Valido per modalit\u00E0 View o Array. Se sono in report mode il body \u00E8 creato in altro modo -->\r\n            <tbody [hidden]=\"BodyHidden || FirstBind\" *ngIf=\"(arrayMode || viewMode)\">\r\n                <!--Con selection attiva richiamo il template che gestisce il context menu-->\r\n                <ng-container *ngIf=\"Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBodySelection; context: { $implicit: { selDisabled: arrayMode ? false : SelectionDisabled, sel: Selection }}\"></ng-container>\r\n                </ng-container>\r\n\r\n                <!--Senza selection richiamo il template che NON gestisce il context menu-->\r\n                <ng-container *ngIf=\"!Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBody\"></ng-container>\r\n                </ng-container>\r\n            </tbody>\r\n\r\n            <!-- Per la modalit\u00E0 a report c'\u00E8 un body particolare semi-dinamico -->\r\n            <tbody [hidden]=\"BodyHidden\" *ngIf=\"reportMode\">\r\n                <tr *ngFor=\"let row of ReportValues.rows; let even = even;\">\r\n                    <td class=\"est-nowrap\" *ngFor=\"let val of row.values\">{{val}}</td>\r\n                    <td class=\"est-sticky-last-column{{even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n                </tr>\r\n            </tbody>\r\n        </table>\r\n    </div>\r\n\r\n    <div *ngIf=\"PagingStyle == 'both' || PagingStyle == 'bottom'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n</div>\r\n\r\n<!-- Template che contiene tutte le info di paginazione in modo da poterlo replicare anche sopra -->\r\n<ng-template #pagingElement>\r\n    <ng-container *ngIf=\"!FirstBind\">\r\n        <!-- Pulsanti avanti-indietro di paginazione -->\r\n        <div *ngIf=\"PagerOptions.ShowPaging && PagerOptions.ShowButtons && (PagerOptions.PagerCount > 10 || PagerOptions.PagerCount == -1)\" class=\"pull-right btn-toolbar\">\r\n            <ng-container *ngIf=\"(!reportMode || View?.pagingavailable) && (!arrayMode || SearchView)\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: addToPage.bind(this), GTP: goToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"arrayMode && UseArrayModePaging && !SearchView\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: arrayAddToPage.bind(this), GTP: arrayGoToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n        <!-- Paginatore dove appare la count e le opzioni di paginazione -->\r\n        <div class=\"pull-right\" *ngIf=\"PagerOptions.ShowCount || PagerOptions.ShowPagingOptions\">\r\n            <div class=\"est-mt-min-5\" *ngIf=\"PagerOptions.ShowPaging\">\r\n                <app-paging *ngIf=\"!PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [WarnOnAll]=\"false\" [CurrentPageSize]=\"ArraymodeItemsPerPage\" (pagingSelected)=\"items_H.refreshPaging($event)\"></app-paging>\r\n                <app-paging *ngIf=\"PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [GroupMode]=\"PagerOptions.Searches == 'groups'\" [AllSearch]=\"AllSearch\" [View]=\"PagerOptions.View\" (pagingSelected)=\"onItemsPerPageChanged($event);\"></app-paging>\r\n            </div>\r\n            <div *ngIf=\"reportMode && !PagerOptions.ShowPaging\"><em>{{'Paging options are not available for this report' | localize: lc}}</em></div>\r\n        </div>\r\n        <div class=\"clearfix\"></div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Template che contiene i pulsanti per cambiare pagina -->\r\n<ng-template #pagingButtons let-options>\r\n    <div class=\"est-flex\" [class.est-margin-left-50]=\"options.Margin\">\r\n        <a class=\"btn\" class=\"est-page-prev app-pointer\" (click)=\"options.ATP(-1, options.separator)\"><span class=\"fa fa-chevron-left\"></span></a>\r\n        <div *ngIf=\"options.Array\" class=\"est-inline\"><a *ngFor=\"let p of options.Array\" class=\"btn est-page-sel {{p.cssClass}}\" (click)=\"options.GTP(p.val, options.separator)\">{{p.val}}</a></div>\r\n        <a class=\"btn\" class=\"est-page-next app-pointer\" (click)=\"options.ATP(1, options.separator)\"><span class=\"fa fa-chevron-right\"></span></a>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Questi due template rappresentano effettivamente il body della tabella. essendo il tr l'unica cosa che davvero cambia, il resto \u00E8 templatizzato -->\r\n<ng-template #TBodySelection let-templateOptions>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even; let i=index; trackBy: bodyTrackBy\">\r\n        <tr *ngIf=\"item._visible || (!Hierarchy && !ArrayGrouping)\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\" \r\n            [class.est-pointer]=\"!item.locked\" \r\n            [class.est-white-selected]=\"item._selected && !item.locked\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            [contextMenu]=\"!item.locked ? (ContextMenu || emptyMenu) : emptyMenu\" [contextMenuSubject]=\"item\"\r\n            (click)=\"(!item.locked && !item._sep && !item._group && handleClick($event, item)) || item._group && handleGroupClick(item)\">\r\n\r\n            <td *ngIf=\"!item.locked && !item._sep && !HasPinnedColumns\">\r\n                <input  type=\"checkbox\" \r\n                        [disabled]=\"templateOptions.selDisabled\" \r\n                        [class.est-pointer]=\"!item.locked\"\r\n                        [(ngModel)]=\"item._selected\" name=\"check{{i}}\" \r\n                        (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n            </td>\r\n            <td *ngIf=\"(item.locked || item._sep) && !HasPinnedColumns\"></td>\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container> </ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item, templateOptions: templateOptions }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #TBody>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even;\">\r\n        <tr *ngIf=\"item._visible || !Hierarchy\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            (click)=\"item._group && handleGroupClick(item)\">\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container></ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #groupPager let-item>\r\n    <td class=\"est-pinned-body \" *ngIf=\"HasPinnedColumns\"><div class=\"est-pinned-border est-cell-group-padding\"></div></td>\r\n    <td *ngIf=\"item._grouplevel > 1\" [attr.colspan]=\"item._grouplevel-1\"></td>\r\n    <td [attr.colspan]=\"Columns.VisibleUnpinned - (item._grouplevel > 0 ? item._grouplevel - 1 : 0)\">\r\n        <div class=\"est-rg-sep-flex-right\" *ngIf=\"RowGroupingPagingStyle == 'right'\">\r\n            <div class=\"est-rg-page\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n            <div class=\"est-rg-ipp\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><app-paging [CountLabel]=\"CountLabel\" [AllSearch]=\"AllSearch\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n        </div>\r\n\r\n        <div class=\"est-rg-sep-flex-left\" *ngIf=\"RowGroupingPagingStyle == 'left'\">\r\n            <div class=\"est-rg-ipp\"><app-paging [AllSearch]=\"AllSearch\" [CountLabel]=\"CountLabel\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n            <div class=\"est-rg-page\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n        </div>\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle semplici, con header e body scritti a manazza -->\r\n<ng-template #basicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || !RowTDs) && !DynamicRowColumnsDefinition\">\r\n        <ng-container *ngTemplateOutlet=\"bodyRef; context : {$implicit: item}\"></ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle definite in maniera dinamica dal modello -->\r\n<ng-template #dynamicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || !RowTDs) && DynamicRowColumnsDefinition\">\r\n        <ng-container *ngFor=\"let operation of DynamicOperations; let first = first; let last = last;\">\r\n            <ng-container *ngIf=\"!operation.conditionField || (item.properties[operation.conditionField] == operation.conditionValue)\">\r\n                <td [class.est-no-right-padding]=\"last\" [class.est-no-left-padding]=\"!first\" class=\"est-col-min\"><span title=\"{{operation.title}}\" class=\"{{operation.iconClass}} est-pointer\" (click)=\"dynamicOperation(item, operation.id)\">{{operation.text}}</span></td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"operation.conditionField && (item.properties[operation.conditionField] != operation.conditionValue)\">\r\n                <td class=\"est-col-min est-no-side-padding\"></td>\r\n            </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngFor=\"let rowItem of DynamicRowColumnsDefinition\">\r\n            <ng-container *ngIf=\"rowItem.routePath && rowItem.visible\">\r\n                <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n                    <a [routerLink]=\"dynamicMode_H.generateRouterLink(rowItem.routePath, rowItem.routeParameterProperties, item)\" class=\"est-link\" [innerHTML]=\"item.properties[rowItem.propertyName]\"></a>\r\n                </td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!rowItem.routePath && rowItem.visible\">\r\n                <ng-container *ngTemplateOutlet=\"findEsTd(rowItem.propertyName) || defaultEsTd; context: { $implicit: item.properties[rowItem.propertyName], rowItem : rowItem, item : item }\"> </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #defaultEsTd let-value let-rowItem='rowItem' let-item='item'>\r\n    <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n        {{value}}\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale delle celle custom se configurate -->\r\n<ng-template #customCells let-item let-opt=\"templateOptions\">\r\n    <ng-container *ngIf=\"UseCustomCells && RowTDs\">\r\n\r\n        <td *ngIf=\"HasPinnedColumns\" class=\"est-pinned-body est-col-min\" [class.est-white-selected]=\"item._selected\">\r\n            <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border\">\r\n                <td *ngIf=\"!item.locked && !item._sep && Selection\" class=\"est-no-border est-col-min\" [style.width.px]=\"20\">\r\n                    <input type=\"checkbox\" [disabled]=\"opt.selDisabled\" [class.est-pointer]=\"!item.locked\" [(ngModel)]=\"item._selected\" name=\"check{{item._hash}}\" (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n                </td>\r\n                <td class=\"est-no-border est-col-min\" *ngIf=\"(item.locked || item._sep) && Selection\" [style.width.px]=\"20\"></td>\r\n\r\n                <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n                    <td *ngIf=\"rowItem && rowItem.Pinned && rowItem.Visible\" [style.width.px]=\"rowItem.PinnedWidth\" es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-no-border]=\"true\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container></ng-container>\r\n                        <ng-container *ngIf=\"rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container></ng-container>\r\n                        <span *ngIf=\"!rowItem.Template\">{{rowItem.Content}}</span>\r\n                    </td>\r\n                </ng-container>\r\n            </div>\r\n        </td>\r\n\r\n        <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n            <ng-container *ngIf=\"rowItem && !rowItem.Pinned\">\r\n\r\n                <!-- Casistica senza bodyRef, quindi con direttive per i td -->\r\n                <ng-container *ngIf=\"!bodyRef && rowItem.Visible\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-ltab-border]=\"rowItem.LeftBorder\" [class.est-rtab-border]=\"rowItem.RightBorder\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container></ng-container>\r\n                        <ng-container *ngIf=\"rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container></ng-container>\r\n                        <span *ngIf=\"!rowItem.Template\">{{rowItem.Content}}</span>\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <a [routerLink]='rowItem.RouterLink' class=\"est-link\" [innerHTML]=\"rowItem.Content\"></a>\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (NON RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"!rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"rowItem.Template\">\r\n                            <ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <span *ngIf=\"!rowItem.Template\" [innerHTML]=\"rowItem.Content\"></span>\r\n                    </td>\r\n                </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #HierarchyNavigator let-item>\r\n    <span *ngIf=\"!item.parent\" class=\"fa fa-chevron-down\" style=\"visibility:hidden\"></span>\r\n    <span *ngIf=\"item.parent && item._expanded\" class=\"fa fa-chevron-down est-pointer est-no-selection\" (click)=\"hierarchyMode_H.collapseParent(item[this.OwnKey])\"></span>\r\n    <span *ngIf=\"item.parent && !item._expanded\" class=\"fa fa-chevron-up est-pointer est-no-selection\" (click)=\"hierarchyMode_H.expandParent(item[this.OwnKey])\"></span>\r\n    &nbsp;\r\n</ng-template>\r\n\r\n<!-- Questo template contiene i pulsanti di eliminazione/undo eliminazione ed esportazione che vanno in fondo ad un record edlla tabella -->\r\n<ng-template #bodyDeleteAndExport let-options>\r\n    <ng-container *ngIf=\"Removal && !RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted)\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted)\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"Removal && RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!options.item[RemovalCondition]\"><span class=\"fa fa-remove est-hidden-view\"></span></td>\r\n    </ng-container>\r\n    <td *ngIf=\"Export || HiddenColumns || CornerMenuOptions\" class=\"est-sticky-last-column{{options.even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n</ng-template>\r\n\r\n<!-- Context menu vuoto default per tutte le tabella che non ce l'hanno, in modo che al click destro appaia \"nessuna op disponibile\" -->\r\n<context-menu #emptyMenu>\r\n    <ng-template contextMenuItem>\r\n        <span>\r\n            <em>{{'No operations available' | localize : lc}}...</em>\r\n        </span>\r\n    </ng-template>\r\n</context-menu>\r\n\r\n<!-- Modal per cambiare posizione e visibilit\u00E0 delle colonne dell'es-table -->\r\n<div bsModal #changeColumnVisibilityModal=\"bs-modal\" class=\"modal fade\" role=\"dialog\" aria-hidden=\"true\">\r\n    <div class=\"modal-dialog modal-lg\" cdkDrag>\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header est-pointer\" cdkDragHandle>\r\n                <h5 class=\"modal-title pull-left\">\r\n                    <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Order' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                        {{'Columns Visibility' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Visibility and Order' | localize : lc}}\r\n                    </ng-container>\r\n                </h5>\r\n                <button type=\"button\" class=\"close pull-right\" (click)=\"changeColumnVisibilityModal.hide();\" aria-label=\"Close\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div *ngIf=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"card card-info est-padding-10 est-margin-bottom-0\">\r\n                    {{'There are no columns configured to be hidden/shown in this view' | localize : lc}}\r\n                </div>\r\n                <div *ngIf=\"TMPColumnsList && TMPColumnsList.length > 0\" style=\"max-height:500px; overflow-y:auto\">\r\n                    <!--Aaaaaaah la tristezza... qui mi servirebbe l'es-table per facilitare la selezione multipla ecc... peccato che se la linko qui entro in un loop impressionante-->\r\n                    <table class=\"table table-striped table-sm est-margin-bottom-0\">\r\n                        <thead>\r\n                            <tr>\r\n                                <th class=\"est-col-min\" *ngIf=\"HiddenColumns\">\r\n                                    <input class=\"est-pointer\" type=\"checkbox\" [(ngModel)]=\"globalColVisCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"columnMetadata_H.globalColVisCheckChanged();\">\r\n                                </th>\r\n                                <!-- <th class=\"est-col-min\" *ngIf=\"ColumnsOrdering\"></th> -->\r\n                                <th class=\"est-col-min est-nowrap\">{{'Column Name' | localize : lc}}</th>\r\n                                <!--Filler-->\r\n                                <th></th>\r\n                                <!-- Pinner -->\r\n                                <th *ngIf=\"DirectivesBased\" class=\"est-col-min\"></th>\r\n                            </tr>\r\n                        </thead>\r\n                        <tbody \r\n                            cdkDropList \r\n                            [cdkDropListData]=\"TMPColumnsList\" \r\n                            (cdkDropListDropped)=\"columnMetadata_H.columnReordered($event)\" \r\n                            [cdkDropListSortPredicate]=\"columnMetadata_H.sortPredicate.bind(this.columnMetadata_H)\"\r\n                            class=\"est-dropbox\">\r\n\r\n                            <tr *ngFor=\"let item of TMPColumnsList; let i = index; let last = last\" \r\n                                class=\"est-pointer est-droplist\" \r\n                                [class.est-white-selected]=\"lastSelectedItemID == item.id\" \r\n                                [class.est-no-selection]=\"!item.visible\"\r\n                                cdkDrag\r\n                                [cdkDragData]=\"item\"\r\n                                [cdkDragDisabled]=\"!ColumnsOrdering || item.fixed || item.pinned\">\r\n\r\n                                <td *ngIf=\"HiddenColumns\">\r\n                                    <input type=\"checkbox\" [class.est-hidden-view]=\"item.fixed\" class=\"est-pointer\" [(ngModel)]=\"item.visible\" name=\"visible{{i}}\" (ngModelChange)=\"columnMetadata_H.updateGlobalColVisCheck();\" />\r\n                                </td>\r\n                                <td class=\"est-nowrap drag-visible\" (click)=\"columnMetadata_H.columnClicked(item);\">\r\n                                    <ng-container *ngIf=\"item.template\">\r\n                                        <!-- Padri -->\r\n                                        <span *ngIf=\"item.parentTemplates && item.parentTemplates.length > 0\" class=\"est-fw-bold est-fs-13\">\r\n                                            (&nbsp;\r\n                                            <ng-container *ngFor=\"let parent of item.parentTemplates; let last=last\">\r\n                                                <ng-container *ngTemplateOutlet=\"parent\"></ng-container>\r\n                                                <span *ngIf=\"!last\">&nbsp;-&nbsp;</span>\r\n                                            </ng-container>\r\n                                            &nbsp;)\r\n                                        </span>\r\n                                        <!-- Template header originale -->\r\n                                        <ng-container *ngTemplateOutlet=\"item.template\"></ng-container>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"!item.template\">{{item.description}}</ng-container>\r\n                                </td>\r\n                                <!--Filler-->\r\n                                <td (click)=\"columnMetadata_H.columnClicked(item);\"></td>\r\n                                <!-- Pinner -->\r\n                                <td *ngIf=\"DirectivesBased && ColumnsPinnable\"><span *ngIf=\"!item.fixed && item.pinnable\" class=\"fa fa-thumb-tack\" [class.text-success]=\"item.pinned\" (click)=\"columnMetadata_H.pinOrUnpinColumn(item)\"></span></td>\r\n                            </tr>\r\n                        </tbody>\r\n                    </table>\r\n                </div>\r\n            </div>\r\n            <div class=\"modal-footer\">\r\n                <button type=\"button\" class=\"btn btn-secondary est-margin-right-10\" (click)=\"lastSelectedItemID = null; changeColumnVisibilityModal.hide();\">{{'Close' | localize : lc}}</button>\r\n                <button type=\"button\" [disabled]=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"btn btn-primary\" (click)=\"columnMetadata_H.confirmColumnVisibilitySelection() && changeColumnVisibilityModal.hide()\">{{'Confirm' | localize : lc}}</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".est-loading-box{height:200px;text-align:center;position:relative;background:#ccc}.est-loading-content{margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:35px}.est-scrollable{max-height:600px;overflow:auto}.est-head-resizer{top:0;right:0;bottom:0;width:7px;position:absolute;cursor:col-resize}.est-head-resizer-internal{top:0;right:0px;left:6px;bottom:0;width:1px;position:absolute;background-color:#ccc;height:100%}.est-pointer{cursor:pointer}.est-high-density th,.est-high-density td{padding:0;padding-left:.2rem;padding-right:.2rem}.est-no-selection{-webkit-user-select:none;-moz-user-select:none;-khtml-user-select:none;-ms-user-select:none}.est-hidden-view{visibility:hidden}.est-no-border{border:none!important}.est-nowrap{white-space:nowrap}.est-mt-min-5{margin-top:-5px}.est-white-selected{background-color:#ddd!important}.est-line-through{text-decoration:line-through}.est-no-side-padding{padding-left:0;padding-right:0}.est-no-left-padding,.est-no-right-padding{padding-left:0}.est-col-min{width:1px}.est-margin-bottom-0{margin-bottom:0!important}.est-margin-right-10{margin-right:10px!important}.est-right-9{right:9px!important}.est-table-dotted-menu{padding:0 0 2px!important;color:#999}.est-fs-18{font-size:18px}.est-fs-14,.est-fs-13{font-size:14px}.est-fw-bold{font-weight:700}.est-padding-3{padding:3px!important}.est-page-container{position:relative}.est-bring-to-front-strong{z-index:99999999!important}.est-switch{position:relative;display:inline-block;width:30px;height:17px;margin-bottom:0;margin-right:5px;margin-left:5px}.est-switch input{display:none}.est-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}.est-slider:before{position:absolute;content:\"\";height:13px;width:13px;left:3px;bottom:2px;background-color:#fff;transition:.4s}input:checked+.est-slider{background-color:#2196f3}input:focus+.est-slider{box-shadow:0 0 1px #2196f3}input:checked+.est-slider:before{transform:translate(11px)}.est-slider.round{border-radius:10px}.est-slider.round:before{border-radius:50%}.est-custom-input{width:30px;display:inline;padding:1px;height:20px}.est-row-lvl-1 td:first-child{padding-left:5px}.est-row-lvl-2 td:first-child{padding-left:20px}.est-row-lvl-3 td:first-child{padding-left:35px}.est-row-lvl-4 td:first-child{padding-left:50px}.est-row-lvl-5 td:first-child{padding-left:65px}.est-row-lvl-6 td:first-child{padding-left:80px}.est-row-lvl-7 td:first-child{padding-left:95px}.est-row-lvl-8 td:first-child{padding-left:110px}.est-row-lvl-9 td:first-child{padding-left:125px}.est-row-lvl-10 td:first-child{padding-left:140px}.est-row-lvl-11 td:first-child{padding-left:155px}.est-row-lvl-12 td:first-child{padding-left:170px}.est-row-lvl-13 td:first-child{padding-left:185px}.est-row-lvl-14 td:first-child{padding-left:200px}.est-row-lvl-15 td:first-child{padding-left:215px}.est-row-lvl-16 td:first-child{padding-left:230px}.est-row-lvl-17 td:first-child{padding-left:245px}.est-row-lvl-18 td:first-child{padding-left:260px}.est-row-lvl-19 td:first-child{padding-left:275px}.est-row-lvl-20 td:first-child{padding-left:290px}.est-row-lvl-21 td:first-child{padding-left:305px}.est-row-lvl-22 td:first-child{padding-left:320px}.est-row-lvl-23 td:first-child{padding-left:335px}.est-row-lvl-24 td:first-child{padding-left:350px}.est-row-lvl-25 td:first-child{padding-left:365px}.est-row-lvl-26 td:first-child{padding-left:380px}.est-row-lvl-27 td:first-child{padding-left:395px}.est-row-lvl-28 td:first-child{padding-left:410px}.est-row-lvl-29 td:first-child{padding-left:425px}.est-row-lvl-30 td:first-child{padding-left:440px}.est-row-lvl-31 td:first-child{padding-left:455px}.est-row-lvl-32 td:first-child{padding-left:470px}.est-row-lvl-33 td:first-child{padding-left:485px}.est-row-lvl-34 td:first-child{padding-left:500px}.est-row-lvl-35 td:first-child{padding-left:515px}.est-row-lvl-36 td:first-child{padding-left:530px}.est-row-lvl-37 td:first-child{padding-left:545px}.est-row-lvl-38 td:first-child{padding-left:560px}.est-row-lvl-39 td:first-child{padding-left:575px}.est-row-lvl-40 td:first-child{padding-left:590px}.est-row-lvl-41 td:first-child{padding-left:605px}.est-row-lvl-42 td:first-child{padding-left:620px}.est-row-lvl-43 td:first-child{padding-left:635px}.est-row-lvl-44 td:first-child{padding-left:650px}.est-row-lvl-45 td:first-child{padding-left:665px}.est-row-lvl-46 td:first-child{padding-left:680px}.est-row-lvl-47 td:first-child{padding-left:695px}.est-row-lvl-48 td:first-child{padding-left:710px}.est-row-lvl-49 td:first-child{padding-left:725px}.est-row-lvl-50 td:first-child{padding-left:740px}.est-row-lvl-51 td:first-child{padding-left:755px}.est-row-lvl-52 td:first-child{padding-left:770px}.est-row-lvl-53 td:first-child{padding-left:785px}.est-row-lvl-54 td:first-child{padding-left:800px}.est-row-lvl-55 td:first-child{padding-left:815px}.est-row-lvl-56 td:first-child{padding-left:830px}.est-row-lvl-57 td:first-child{padding-left:845px}.est-row-lvl-58 td:first-child{padding-left:860px}.est-row-lvl-59 td:first-child{padding-left:875px}.est-row-lvl-60 td:first-child{padding-left:890px}.est-row-lvl-61 td:first-child{padding-left:905px}.est-row-lvl-62 td:first-child{padding-left:920px}.est-row-lvl-63 td:first-child{padding-left:935px}.est-row-lvl-64 td:first-child{padding-left:950px}.est-row-lvl-65 td:first-child{padding-left:965px}.est-row-lvl-66 td:first-child{padding-left:980px}.est-row-lvl-67 td:first-child{padding-left:995px}.est-row-lvl-68 td:first-child{padding-left:1010px}.est-row-lvl-69 td:first-child{padding-left:1025px}.est-row-lvl-70 td:first-child{padding-left:1040px}.est-row-lvl-71 td:first-child{padding-left:1055px}.est-row-lvl-72 td:first-child{padding-left:1070px}.est-row-lvl-73 td:first-child{padding-left:1085px}.est-row-lvl-74 td:first-child{padding-left:1100px}.est-row-lvl-75 td:first-child{padding-left:1115px}.est-row-lvl-76 td:first-child{padding-left:1130px}.est-row-lvl-77 td:first-child{padding-left:1145px}.est-row-lvl-78 td:first-child{padding-left:1160px}.est-row-lvl-79 td:first-child{padding-left:1175px}.est-row-lvl-80 td:first-child{padding-left:1190px}.est-row-lvl-81 td:first-child{padding-left:1205px}.est-row-lvl-82 td:first-child{padding-left:1220px}.est-row-lvl-83 td:first-child{padding-left:1235px}.est-row-lvl-84 td:first-child{padding-left:1250px}.est-row-lvl-85 td:first-child{padding-left:1265px}.est-row-lvl-86 td:first-child{padding-left:1280px}.est-row-lvl-87 td:first-child{padding-left:1295px}.est-row-lvl-88 td:first-child{padding-left:1310px}.est-row-lvl-89 td:first-child{padding-left:1325px}.est-row-lvl-90 td:first-child{padding-left:1340px}.est-row-lvl-91 td:first-child{padding-left:1355px}.est-row-lvl-92 td:first-child{padding-left:1370px}.est-row-lvl-93 td:first-child{padding-left:1385px}.est-row-lvl-94 td:first-child{padding-left:1400px}.est-row-lvl-95 td:first-child{padding-left:1415px}.est-row-lvl-96 td:first-child{padding-left:1430px}.est-row-lvl-97 td:first-child{padding-left:1445px}.est-row-lvl-98 td:first-child{padding-left:1460px}.est-row-lvl-99 td:first-child{padding-left:1475px}.est-relative{position:relative}.est-top-pager{position:absolute;right:0;top:5px}.est-top-allselect{position:absolute;left:0;top:5px;font-weight:700}.est-padding-10{padding:10px!important}.est-margin-right-50{margin-right:50px}.est-margin-left-50{margin-left:50px}.est-quick-unpin{color:#000;margin-left:8px;font-size:14px;transform:rotate(45deg)}.est-page-sel{color:#000;margin-left:3px;margin-right:3px;padding:0 5px;font-size:inherit;border:none;border-radius:15px}.est-page-prev,.est-page-next{color:#000;padding:2px 0 0;font-size:inherit}.est-pinned-header{background-color:#fff;left:0;top:0;position:sticky;z-index:1;border-bottom:1px solid #dee2e6!important;padding:0!important}.est-simple-border-bottom{border-bottom:1px solid #dee2e6}.est-pinned-internal-header{border-top:0;border-bottom:0px solid #dee2e6}.est-pinned-border{border-right:2px solid #dee2e6!important}.est-cell-padding{padding:.3rem}.est-pinned-body{background-color:#fff;left:0;position:sticky;z-index:1;border-top:1px solid #dee2e6!important;padding:0!important}.est-inline{display:inline!important}.est-inline-block{display:inline-block!important}.est-link{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block}.est-link:hover{color:#23527c!important;cursor:pointer;text-decoration:underline!important}.est-sticky-last-column{right:-1px;position:sticky;z-index:0;background-color:#fff}.est-sticky-last-column-alt{right:-1px;position:sticky;z-index:0;background-color:#f2f2f2}.est-ltab-border{border-left:2px solid #bbb}.est-rtab-border{border-right:2px solid #bbb}.est-cell-group-padding{padding:calc(.3rem + 1px);position:absolute;top:0;left:0;height:100%;width:100%}.est-margin-bottom-10{margin-bottom:10px}.est-text-center{text-align:center}.est-flex{display:flex}.est-rg-sep-flex-right{display:flex;flex-direction:row-reverse;width:100%;margin:-5px}.est-rg-sep-flex-left{display:flex;flex-direction:row;width:100%;margin:-5px}.est-rg-hdr{font-weight:700}.est-rg-agg{font-style:italic}.est-rg{background-color:#7777!important}.est-rg-sep{font-size:12px;padding-right:20px!important;background-color:#bbbb!important}.est-rg-ipp{text-align:left;display:inline-flex;margin-right:25px}.est-rg-page{text-align:right;display:inline-flex;font-size:inherit;padding-top:5px}.est-droplist.cdk-drag-placeholder{opacity:0}.est-droplist.cdk-drag-preview{z-index:999999999!important;opacity:1;box-sizing:border-box;border-radius:4px;background-color:#fff;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.est-droplist.cdk-drag-preview td:not(.drag-visible){visibility:hidden}.est-droplist.cdk-drag-preview td.drag-visible{padding-top:3px}.est-droplist.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.est-droplist.cdk-drop-list-dragging .est-dropbox:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], components: [{ type: EsTh, selector: "[es-th]", inputs: ["es-th", "Order", "Orderable", "Display", "Resizable", "Pinned", "SearchInProgress", "OrderBy", "Wrap", "Fixed", "Template", "Visible"], outputs: ["onOrderChange", "onUnpinning"] }, { type: TablePagerComponent, selector: "app-paging", inputs: ["CurrentPageSize", "View", "WarnOnAll", "AllSearch", "DefaultAll", "GroupMode", "GroupCount", "CountLabel", "ShowCount", "ShowPaging", "PagerCount", "Hidden"], outputs: ["pagingSelected"] }, { type: EsTd, selector: "[es-td]", inputs: ["es-td", "Internal", "RouterLink", "Display", "Template", "Context", "Visible"] }, { type: i9.ContextMenuComponent, selector: "context-menu", inputs: ["menuClass", "autoFocus", "useBootstrap4", "disabled"], outputs: ["close", "open"] }], directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i11.CsvDirective, selector: "[csvLink]", inputs: ["data", "headers", "delimiter", "filename", "uFEFF", "target"] }, { type: i12.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { type: i12.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i12.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i9.ContextMenuAttachDirective, selector: "[contextMenu]", inputs: ["contextMenuSubject", "contextMenu"] }, { type: i13.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i9.ContextMenuItemDirective, selector: "[contextMenuItem]", inputs: ["subMenu", "divider", "enabled", "passive", "visible"], outputs: ["execute"] }, { type: i14.ModalDirective, selector: "[bsModal]", inputs: ["config", "closeInterceptor"], outputs: ["onShow", "onShown", "onHide", "onHidden"], exportAs: ["bs-modal"] }, { type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }], pipes: { "localize": i2.LocalizePipe, "number": i10.DecimalPipe }, viewProviders: [{ provide: LocalizationService, useClass: EsTableLoc }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+EsTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: EsTableComponent, selector: "es-table", inputs: { CornerMenuOptions: "CornerMenuOptions", ColumnsResizable: "ColumnsResizable", ColumnsPinnable: "ColumnsPinnable", AutoUpdate: "AutoUpdate", UseCustomCells: "UseCustomCells", MaxHeight: "MaxHeight", ContainerClass: "ContainerClass", XLSXExport: "XLSXExport", CSVExport: "CSVExport", AllSearch: "AllSearch", HighCellDensity: "HighCellDensity", Selection: "Selection", ShowLoadingOnBootstrap: "ShowLoadingOnBootstrap", Removal: "Removal", RemovalCondition: "RemovalCondition", Export: "Export", ShiftClick: "ShiftClick", CountLabel: "CountLabel", HidePaging: "HidePaging", HidePagingCount: "HidePagingCount", HidePagingButtons: "HidePagingButtons", ContextMenu: "ContextMenu", ExportFileName: "ExportFileName", TableClass: "TableClass", ExportFunction: "ExportFunction", HasHeaderGroup: "HasHeaderGroup", HasSecondaryHeaderGroup: "HasSecondaryHeaderGroup", HeaderHidden: "HeaderHidden", BodyHidden: "BodyHidden", SelectionDisabled: "SelectionDisabled", SingleSelection: "SingleSelection", RowClassAssigner: "RowClassAssigner", OrderByColumn: "OrderByColumn", MultipleOrderingDirectives: "MultipleOrderingDirectives", HiddenColumns: "HiddenColumns", ColumnsOrdering: "ColumnsOrdering", SearchView: "SearchView", SelectAll: "SelectAll", UseArrayModePaging: "UseArrayModePaging", DynamicRowColumnsDefinition: "DynamicRowColumnsDefinition", DynamicOperations: "DynamicOperations", Hierarchy: "Hierarchy", ParentKey: "ParentKey", OwnKey: "OwnKey", StartsExpanded: "StartsExpanded", SavePreferences: "SavePreferences", PagingStyle: "PagingStyle", RowGroupingPagingStyle: "RowGroupingPagingStyle", SecondarySource: "SecondarySource", TertiarySource: "TertiarySource", UseSelectionCache: "UseSelectionCache", ShowItemGroupsColumns: "ShowItemGroupsColumns", UserEdits: "UserEdits", ArraymodeItemsPerPage: "ArraymodeItemsPerPage" }, outputs: { onOrderChanged: "onOrderChanged", onSearchRequest: "onSearchRequest", onSelectionChanged: "onSelectionChanged", onRemoval: "onRemoval", onAbortRemoval: "onAbortRemoval", onCornerAction: "onCornerAction", onDynamicOperation: "onDynamicOperation" }, queries: [{ propertyName: "bodyRef", first: true, predicate: ["body"], descendants: true }, { propertyName: "headerRef", first: true, predicate: ["header"], descendants: true }, { propertyName: "headerGroupRef", first: true, predicate: ["headerGroup"], descendants: true }, { propertyName: "secondaryHeaderGroupRef", first: true, predicate: ["secondaryHeaderGroup"], descendants: true }, { propertyName: "EsTdsDirective", predicate: EsTdDirective }, { propertyName: "EsThsDirective", predicate: EsThDirective }], viewQueries: [{ propertyName: "inputField", first: true, predicate: ["input"], descendants: true }, { propertyName: "exportDownloader", first: true, predicate: ["exportDownloader"], descendants: true }, { propertyName: "tableEmptyMenu", first: true, predicate: ["emptyMenu"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<!-- Patacchino di autoaggiornamento -->\r\n<div class=\"w-100\" *ngIf=\"AutoUpdate\">\r\n    <div class=\"pull-right\">\r\n        {{'Update every' | localize : lc}}&nbsp;<input [readonly]=\"autoUpdate\" maxlength=\"3\" class=\"form-control est-custom-input\" type=\"text\" [(ngModel)]=\"seconds\" />&nbsp;{{'second/s' | localize : lc}}\r\n    </div>\r\n    <div class=\"pull-right m-t-2\">\r\n        <label class=\"est-switch\">\r\n            <input type=\"checkbox\" [(ngModel)]=\"autoUpdate\" (ngModelChange)=\"autoUpdateChanged();\" />\r\n            <div class=\"est-slider round\"></div>\r\n        </label>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<div *ngIf=\"View\" class=\"est-relative\">\r\n    <div *ngIf=\"FirstBind && ShowLoadingOnBootstrap\" class=\"est-loading-box\">\r\n        <div class=\"est-loading-content\">\r\n            <span class=\"fa fa-spinner fa-spin\"></span>&nbsp;{{'Performing Table bootstrap' | localize: lc}}...\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"est-top-pager\" *ngIf=\"PagingStyle == 'both' || PagingStyle == 'top'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"est-top-allselect\" *ngIf=\"canSelectAll || (!reportMode && (View?.selection || arraymodeSelection)?.all)\">\r\n        <span>{{ (selectedObjects == -1 ? ('All the' | localize : lc) : ((selectedObjects || 0) | number : '0.0-0' : locale)) + ' ' + ((selectedObjects == 1 ? 'Object Selected' : 'Objects Selected') | localize : lc) }}</span>&nbsp;\r\n        <span class=\"est-link est-inline\" (click)=\"selection_H.selectAllOrResetSelection()\">{{ (View?.selection || arraymodeSelection)?.all ? ('Reset Selection' | localize : lc) : ('Select Everything' | localize : lc)}}</span>\r\n    </div>\r\n\r\n    <div class=\"table-responsive datatable {{ContainerClass}}\" [style.max-height.px]=\"MaxHeight\">\r\n        <table class=\"{{ TableClass }} est-margin-bottom-10 est\"  [class.est-high-density]=\"HighCellDensity\">\r\n            <thead [hidden]=\"HeaderHidden || FirstBind\">\r\n                <!-- Aggiungo il pezzo che gestisce la selezione di tutto se attivo da config -->\r\n                <tr *ngIf=\"SelectAll || PagingStyle != 'bottom'\">\r\n                    <th class=\"est-no-selection\" [attr.colspan]=\"Columns.Global\" [class.est-hidden-view]=\"!canSelectAll && (reportMode || !(View?.selection || arraymodeSelection)?.all) && PagingStyle == 'bottom'\">\r\n                        <p class=\"est-hidden-view app-margin-bottom-0\">\u00A7</p>\r\n                    </th>\r\n                </tr>\r\n\r\n                <!-- Blocco header group -->\r\n                <ng-container *ngIf=\"RowThGroups\">\r\n                    <tr *ngFor=\"let level of RowThGroups\">\r\n                        <th *ngFor=\"let cell of level\" [attr.colspan]=\"cell.Span\" \r\n                            [class.est-pinned-header]=\"cell.Pinned\" [class.est-col-min]=\"cell.Pinned\"\r\n                            [class.est-ltab-border]=\"cell.Borders\" [class.est-rtab-border]=\"cell.Borders\"\r\n                            class=\"est-text-center\">\r\n                            <ng-container *ngIf=\"cell.Pinned;\">\r\n                                <div class=\"est-pinned-border est-cell-group-padding\"></div>\r\n                            </ng-container>\r\n                            <ng-container *ngIf=\"!cell.Pinned && cell.Content; Else: cell.Template\">\r\n                                {{cell.Content}}\r\n                            </ng-container>\r\n                        </th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!RowThGroups\">\r\n                    <tr *ngIf=\"HasHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"headerGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n    \r\n                    <!-- Blocco header group secondario -->\r\n                    <tr *ngIf=\"HasSecondaryHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"secondaryHeaderGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <!-- Blocco effettivo degli header -->\r\n                <tr>\r\n                    <!-- Aggiungo una checkbox se la selezione \u00E8 attiva -->\r\n                    <th class=\"est-col-min\" *ngIf=\"Selection && !HasPinnedColumns\">\r\n                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                    </th>\r\n\r\n                    <!-- Header che valgono per view mode e array mode -->\r\n                    <ng-container *ngIf=\"(viewMode || arrayMode)\">\r\n\r\n                        <!-- In una tabella base prendo semplicemente i th scritti dall'utente nell'HTML -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs) && !DynamicRowColumnsDefinition\">\r\n                            <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se ho un modello dinamico dell'oggetto creo le colonne in base alle propriet\u00E0 -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs) && DynamicRowColumnsDefinition\">\r\n                            <th *ngFor=\"let operation of DynamicOperations\" class=\"est-col-min est-no-side-padding\"></th>\r\n                            \r\n                            <ng-container *ngFor=\"let rowHeader of DynamicRowColumnsDefinition\">\r\n                                <ng-container *ngIf=\"rowHeader.visible\">\r\n                                    <th *ngIf=\"OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"thOrderChanged(rowHeader.propertyName, $event)\">{{rowHeader.description}}</th>\r\n                                    <th *ngIf=\"!OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\">{{rowHeader.description}}</th>\r\n                                </ng-container>\r\n                            </ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se non ho un modello dinamico ma invece delle celle custom, genero gli header in base ai row th -->\r\n                        <ng-container *ngIf=\"UseCustomCells && RowTHs\">\r\n                            <th *ngIf=\"HasPinnedColumns\" class=\"est-pinned-header est-col-min\">\r\n                                <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-simple-border-bottom\">\r\n                                    <th class=\"est-col-min est-no-border\" *ngIf=\"Selection\" [style.width.px]=\"20\">\r\n                                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                                    </th>\r\n                                    <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n                                        <th *ngIf=\"rowHeader && rowHeader.Visible && rowHeader.Pinned\" [style.width.px]=\"rowHeader.PinnedWidth\" es-th=\"{{rowHeader.ID}}\" \r\n                                            class=\"{{rowHeader.Class || ''}}\" \r\n                                            [class.est-pinned-internal-header]=\"true\" \r\n                                            [class.est-no-border]=\"true\" \r\n                                            [class.est-nowrap]=\"!rowHeader.Wrap\" \r\n                                            [Pinned]=\"true\" [Fixed]=\"rowHeader.Fixed\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onUnpinning)=\"columnMetadata_H.unpinColumn($event)\" (onOrderChange)=\"OrderByColumn && thOrderChanged(rowHeader.ID, $event)\">\r\n                                            <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null } \"></ng-container></ng-container>\r\n                                            <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                        </th>\r\n                                    </ng-container>\r\n                                </div>\r\n                            </th>\r\n                            <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n                                <th *ngIf=\"rowHeader && rowHeader.Visible && !rowHeader.Pinned\" es-th=\"{{rowHeader.ID}}\" class=\"{{rowHeader.Class || ''}}\" [class.est-ltab-border]=\"rowHeader.LeftBorder\" [class.est-rtab-border]=\"rowHeader.RightBorder\" [class.est-nowrap]=\"!rowHeader.Wrap\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"OrderByColumn && thOrderChanged(rowHeader.ID, $event)\">\r\n                                    <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null }\"></ng-container></ng-container>\r\n                                    <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                </th>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </ng-container>\r\n\r\n                    <!--Casistica in cui ho il setup proveniente da un report. Gli header sono definiti da come \u00E8 fatto il report-->\r\n                    <ng-container *ngIf=\"reportMode\">\r\n                        <th [style.color]=\"clm.color\" *ngFor=\"let clm of ReportValues.columns\" class=\"est-no-selection est-pointer est-nowrap\" (click)=\"reportMode_H.setupNextOrderAndSearch(clm)\">\r\n                            {{clm.description}}<span class=\"fa\" [class.fa-chevron-down]=\"clm.order == 'DESC'\" [class.fa-chevron-up]=\"clm.order == 'ASC'\"></span>\r\n                        </th>\r\n                    </ng-container>\r\n\r\n                    <!--Per l'eliminazione mi serve un header aggiuntivo-->\r\n                    <th *ngIf=\"Removal\" [class.est-right-9]=\"Export || HiddenColumns\" class=\"est-col-min est-sticky-last-column\"><span class=\"fa fa-trash\"></span></th>\r\n\r\n                    <!--Per l'esportazione mi serve l'header extra da cui faccio uscire i 3 pallocchi-->\r\n                    <th *ngIf=\"Export || HiddenColumns || ColumnsOrdering || CornerMenuOptions\" class=\"est-table-dotted-menu est-sticky-last-column est-col-min text-sm-center\">\r\n                        \r\n                        <!-- Link nascosto che serve a scaricare il file -->\r\n                        <a *ngIf=\"headers\" hidden #exportDownloader csvLink [data]=\"data\" [headers]=\"headers\" [delimiter]=\"';'\" [filename]=\"ExportFileName.endsWith('.xlsx') ? ExportFileName.replace('.xlsx', '.csv') : ExportFileName.endsWith('.csv') ? ExportFileName : ExportFileName + '.csv'\"></a>\r\n\r\n                        <!-- Blocco con i 3 pallocchi che tira fuori il context menu delle operazioni -->\r\n                        <div class=\"btn-group\" container=\"body\" placement=\"bottom right\" dropdown #dropdown=\"bs-dropdown\" [autoClose]=\"true\">\r\n                            <span dropdownToggle class=\"fa fa-ellipsis-v est-fs-18 est-pointer est-padding-3\"></span>\r\n\r\n                            <div *dropdownMenu class=\"dropdown-menu dropdown-menu-right est-bring-to-front-strong\">\r\n                                <div class=\"est-pointer\">\r\n                                    <a class=\"dropdown-item\" *ngIf=\"HiddenColumns || ColumnsOrdering\" (click)=\"columnMetadata_H.resetColumnVisSelection(); changeColumnVisibilityModal.show();\">\r\n                                        <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                                            {{'Columns Visibility' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Visibility and Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                    </a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && CSVExport\" (click)=\"export_H.tryExport('CSV')\">{{'Export View' | localize : lc}} (CSV)</a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && XLSXExport\" (click)=\"export_H.tryExport('XLSX')\">{{'Export View' | localize : lc}} (XLSX)</a>\r\n                                    <a class=\"dropdown-item\" *ngFor=\"let option of CornerMenuOptions\" (click)=\"cornerActionClicked(option.id)\">{{option.description}}</a>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </th>\r\n                </tr>\r\n            </thead>\r\n            \r\n            <!-- Valido per modalit\u00E0 View o Array. Se sono in report mode il body \u00E8 creato in altro modo -->\r\n            <tbody [hidden]=\"BodyHidden || FirstBind\" *ngIf=\"(arrayMode || viewMode)\">\r\n                <!--Con selection attiva richiamo il template che gestisce il context menu-->\r\n                <ng-container *ngIf=\"Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBodySelection; context: { $implicit: { selDisabled: arrayMode ? false : SelectionDisabled, sel: Selection }}\"></ng-container>\r\n                </ng-container>\r\n\r\n                <!--Senza selection richiamo il template che NON gestisce il context menu-->\r\n                <ng-container *ngIf=\"!Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBody\"></ng-container>\r\n                </ng-container>\r\n            </tbody>\r\n\r\n            <!-- Per la modalit\u00E0 a report c'\u00E8 un body particolare semi-dinamico -->\r\n            <tbody [hidden]=\"BodyHidden\" *ngIf=\"reportMode\">\r\n                <tr *ngFor=\"let row of ReportValues.rows; let even = even;\">\r\n                    <td class=\"est-nowrap\" *ngFor=\"let val of row.values\">{{val}}</td>\r\n                    <td class=\"est-sticky-last-column{{even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n                </tr>\r\n            </tbody>\r\n        </table>\r\n    </div>\r\n\r\n    <div *ngIf=\"PagingStyle == 'both' || PagingStyle == 'bottom'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n</div>\r\n\r\n<!-- Template che contiene tutte le info di paginazione in modo da poterlo replicare anche sopra -->\r\n<ng-template #pagingElement>\r\n    <ng-container *ngIf=\"!FirstBind\">\r\n        <!-- Pulsanti avanti-indietro di paginazione -->\r\n        <div *ngIf=\"PagerOptions.ShowPaging && PagerOptions.ShowButtons && (PagerOptions.PagerCount > 10 || PagerOptions.PagerCount == -1)\" class=\"pull-right btn-toolbar\">\r\n            <ng-container *ngIf=\"(!reportMode || View?.pagingavailable) && (!arrayMode || SearchView)\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: addToPage.bind(this), GTP: goToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"arrayMode && UseArrayModePaging && !SearchView\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: arrayAddToPage.bind(this), GTP: arrayGoToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n        <!-- Paginatore dove appare la count e le opzioni di paginazione -->\r\n        <div class=\"pull-right\" *ngIf=\"PagerOptions.ShowCount || PagerOptions.ShowPagingOptions\">\r\n            <div class=\"est-mt-min-5\" *ngIf=\"PagerOptions.ShowPaging\">\r\n                <app-paging *ngIf=\"!PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [WarnOnAll]=\"false\" [CurrentPageSize]=\"ArraymodeItemsPerPage\" (pagingSelected)=\"items_H.refreshPaging($event)\"></app-paging>\r\n                <app-paging *ngIf=\"PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [GroupMode]=\"PagerOptions.Searches == 'groups'\" [AllSearch]=\"AllSearch\" [View]=\"PagerOptions.View\" (pagingSelected)=\"onItemsPerPageChanged($event);\"></app-paging>\r\n            </div>\r\n            <div *ngIf=\"reportMode && !PagerOptions.ShowPaging\"><em>{{'Paging options are not available for this report' | localize: lc}}</em></div>\r\n        </div>\r\n        <div class=\"clearfix\"></div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Template che contiene i pulsanti per cambiare pagina -->\r\n<ng-template #pagingButtons let-options>\r\n    <div class=\"est-flex\" [class.est-margin-left-50]=\"options.Margin\">\r\n        <a class=\"btn\" class=\"est-page-prev app-pointer\" (click)=\"options.ATP(-1, options.separator)\"><span class=\"fa fa-chevron-left\"></span></a>\r\n        <div *ngIf=\"options.Array\" class=\"est-inline\"><a *ngFor=\"let p of options.Array\" class=\"btn est-page-sel {{p.cssClass}}\" (click)=\"options.GTP(p.val, options.separator)\">{{p.val}}</a></div>\r\n        <a class=\"btn\" class=\"est-page-next app-pointer\" (click)=\"options.ATP(1, options.separator)\"><span class=\"fa fa-chevron-right\"></span></a>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Questi due template rappresentano effettivamente il body della tabella. essendo il tr l'unica cosa che davvero cambia, il resto \u00E8 templatizzato -->\r\n<ng-template #TBodySelection let-templateOptions>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even; let i=index; trackBy: bodyTrackBy\">\r\n        <tr *ngIf=\"item._visible || (!Hierarchy && !ArrayGrouping)\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\" \r\n            [class.est-pointer]=\"!item.locked\" \r\n            [class.est-white-selected]=\"item._selected && !item.locked\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            [contextMenu]=\"!item.locked ? (ContextMenu || emptyMenu) : emptyMenu\" [contextMenuSubject]=\"item\"\r\n            (click)=\"!UseCustomCells && handleRowClick($event, item, true)\">\r\n\r\n            <td *ngIf=\"!item.locked && !item._sep && !HasPinnedColumns\">\r\n                <input  type=\"checkbox\" \r\n                        [disabled]=\"templateOptions.selDisabled\" \r\n                        [class.est-pointer]=\"!item.locked\"\r\n                        [(ngModel)]=\"item._selected\" name=\"check{{i}}\" \r\n                        (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n            </td>\r\n            <td *ngIf=\"(item.locked || item._sep) && !HasPinnedColumns\"></td>\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container> </ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item, templateOptions: templateOptions }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #TBody>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even;\">\r\n        <tr *ngIf=\"item._visible || !Hierarchy\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            (click)=\"!UseCustomCells && handleRowClick($event, item, false)\">\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container></ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #groupPager let-item>\r\n    <td class=\"est-pinned-body \" *ngIf=\"HasPinnedColumns\"><div class=\"est-pinned-border est-cell-group-padding\"></div></td>\r\n    <td *ngIf=\"item._grouplevel > 1\" [attr.colspan]=\"item._grouplevel-1\"></td>\r\n    <td [attr.colspan]=\"Columns.VisibleUnpinned - (item._grouplevel > 0 ? item._grouplevel - 1 : 0)\">\r\n        <div class=\"est-rg-sep-flex-right\" *ngIf=\"RowGroupingPagingStyle == 'right'\">\r\n            <div class=\"est-rg-page\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n            <div class=\"est-rg-ipp\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><app-paging [CountLabel]=\"CountLabel\" [AllSearch]=\"AllSearch\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n        </div>\r\n\r\n        <div class=\"est-rg-sep-flex-left\" *ngIf=\"RowGroupingPagingStyle == 'left'\">\r\n            <div class=\"est-rg-ipp\"><app-paging [AllSearch]=\"AllSearch\" [CountLabel]=\"CountLabel\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n            <div class=\"est-rg-page\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n        </div>\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle semplici, con header e body scritti a manazza -->\r\n<ng-template #basicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || !RowTDs) && !DynamicRowColumnsDefinition\">\r\n        <ng-container *ngTemplateOutlet=\"bodyRef; context : {$implicit: item}\"></ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle definite in maniera dinamica dal modello -->\r\n<ng-template #dynamicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || !RowTDs) && DynamicRowColumnsDefinition\">\r\n        <ng-container *ngFor=\"let operation of DynamicOperations; let first = first; let last = last;\">\r\n            <ng-container *ngIf=\"!operation.conditionField || (item.properties[operation.conditionField] == operation.conditionValue)\">\r\n                <td [class.est-no-right-padding]=\"last\" [class.est-no-left-padding]=\"!first\" class=\"est-col-min\"><span title=\"{{operation.title}}\" class=\"{{operation.iconClass}} est-pointer\" (click)=\"dynamicOperation(item, operation.id)\">{{operation.text}}</span></td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"operation.conditionField && (item.properties[operation.conditionField] != operation.conditionValue)\">\r\n                <td class=\"est-col-min est-no-side-padding\"></td>\r\n            </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngFor=\"let rowItem of DynamicRowColumnsDefinition\">\r\n            <ng-container *ngIf=\"rowItem.routePath && rowItem.visible\">\r\n                <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n                    <a [routerLink]=\"dynamicMode_H.generateRouterLink(rowItem.routePath, rowItem.routeParameterProperties, item)\" class=\"est-link\" [innerHTML]=\"item.properties[rowItem.propertyName]\"></a>\r\n                </td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!rowItem.routePath && rowItem.visible\">\r\n                <ng-container *ngTemplateOutlet=\"findEsTd(rowItem.propertyName) || defaultEsTd; context: { $implicit: item.properties[rowItem.propertyName], rowItem : rowItem, item : item }\"> </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #defaultEsTd let-value let-rowItem='rowItem' let-item='item'>\r\n    <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n        {{value}}\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale delle celle custom se configurate -->\r\n<ng-template #customCells let-item let-opt=\"templateOptions\">\r\n    <ng-container *ngIf=\"UseCustomCells && RowTDs\">\r\n\r\n        <td *ngIf=\"HasPinnedColumns\" class=\"est-pinned-body est-col-min\" [class.est-white-selected]=\"item._selected\">\r\n            <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border\">\r\n                <td *ngIf=\"!item.locked && !item._sep && Selection\" class=\"est-no-border est-col-min\" [style.width.px]=\"20\">\r\n                    <input type=\"checkbox\" [disabled]=\"opt.selDisabled\" [class.est-pointer]=\"!item.locked\" [(ngModel)]=\"item._selected\" name=\"check{{item._hash}}\" (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n                </td>\r\n                <td class=\"est-no-border est-col-min\" *ngIf=\"(item.locked || item._sep) && Selection\" [style.width.px]=\"20\"></td>\r\n\r\n                <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n                    <td *ngIf=\"rowItem && rowItem.Pinned\" [style.width.px]=\"rowItem.PinnedWidth\" es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-no-selection]=\"rowItem.UserEdits\" [class.est-no-border]=\"true\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\" (click)=\"dbClickEditOrSingleClickRowSelection($event, rowItem, item)\">\r\n\r\n                        <div [class.est-edit-hidden]=\"rowItem._editing\" class=\"est-pre\">\r\n                            <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: rowItem.Multi ? (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) : item }\"></ng-container></ng-container>\r\n                            <ng-container *ngIf=\"!rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: rowItem.Multi ? (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) : item }\"></ng-container></ng-container>\r\n                            <span *ngIf=\"rowItem.Multi\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) }\"></ng-container></span>\r\n                            <span *ngIf=\"!rowItem.Template && !rowItem.Multi\">{{rowItem.Content}}</span>\r\n                        </div>\r\n                        \r\n                        <div *ngIf=\"rowItem._editing\" class=\"est-mt-min-5\">\r\n                            <form-adaptive [FormLayout]=\"false\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"item[rowItem.UserEdits.Property]\" name=\"{{ rowItem.UserEdits.Property + '_' + item._hash }}\" [Type]=\"rowItem.UserEdits.Type\" (inputChange)=\"finalizeUserEdit(rowItem, item)\" (inputFocus)=\"$event.stopPropagation();\" ></form-adaptive>\r\n                        </div>\r\n                    </td>\r\n                </ng-container>\r\n            </div>\r\n        </td>\r\n\r\n        <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n            <ng-container *ngIf=\"rowItem && !rowItem.Pinned\">\r\n\r\n                <!-- Casistica senza bodyRef, quindi con direttive per i td -->\r\n                <ng-container *ngIf=\"!bodyRef && rowItem.Visible\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-ltab-border]=\"rowItem.LeftBorder\" [class.est-rtab-border]=\"rowItem.RightBorder\" [class.est-no-selection]=\"rowItem.UserEdits\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\" (click)=\"dbClickEditOrSingleClickRowSelection($event, rowItem, item)\">\r\n\r\n                        <div [class.est-edit-hidden]=\"rowItem._editing\" class=\"est-pre\">\r\n                            <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container></ng-container>\r\n                            <ng-container *ngIf=\"!rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container></ng-container>\r\n                            <span *ngIf=\"rowItem.Multi\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) }\"></ng-container></span>\r\n                            <span *ngIf=\"!rowItem.Template && !rowItem.Multi\">{{rowItem.Content}}</span>\r\n                        </div>\r\n\r\n                        <div *ngIf=\"rowItem._editing\" class=\"est-mt-min-5\" #input>\r\n                            <form-adaptive [FormLayout]=\"false\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"item[rowItem.UserEdits.Property]\" name=\"{{ rowItem.UserEdits.Property + '_' + item._hash }}\" [Type]=\"rowItem.UserEdits.Type\" (inputFinalized)=\"finalizeUserEdit(rowItem, item)\"></form-adaptive>\r\n                        </div>\r\n\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <a [routerLink]='rowItem.RouterLink' class=\"est-link\" [innerHTML]=\"rowItem.Content\"></a>\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (NON RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"!rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"rowItem.Template\">\r\n                            <ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <span *ngIf=\"!rowItem.Template\" [innerHTML]=\"rowItem.Content\"></span>\r\n                    </td>\r\n                </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #HierarchyNavigator let-item>\r\n    <span *ngIf=\"!item.parent\" class=\"fa fa-chevron-down\" style=\"visibility:hidden\"></span>\r\n    <span *ngIf=\"item.parent && item._expanded\" class=\"fa fa-chevron-down est-pointer est-no-selection\" (click)=\"hierarchyMode_H.collapseParent(item[this.OwnKey])\"></span>\r\n    <span *ngIf=\"item.parent && !item._expanded\" class=\"fa fa-chevron-up est-pointer est-no-selection\" (click)=\"hierarchyMode_H.expandParent(item[this.OwnKey])\"></span>\r\n    &nbsp;\r\n</ng-template>\r\n\r\n<!-- Questo template contiene i pulsanti di eliminazione/undo eliminazione ed esportazione che vanno in fondo ad un record edlla tabella -->\r\n<ng-template #bodyDeleteAndExport let-options>\r\n    <ng-container *ngIf=\"Removal && !RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted)\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted)\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"Removal && RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!options.item[RemovalCondition]\"><span class=\"fa fa-remove est-hidden-view\"></span></td>\r\n    </ng-container>\r\n    <td *ngIf=\"Export || HiddenColumns || CornerMenuOptions\" class=\"est-sticky-last-column{{options.even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n</ng-template>\r\n\r\n<!-- Context menu vuoto default per tutte le tabella che non ce l'hanno, in modo che al click destro appaia \"nessuna op disponibile\" -->\r\n<context-menu #emptyMenu>\r\n    <ng-template contextMenuItem>\r\n        <span>\r\n            <em>{{'No operations available' | localize : lc}}...</em>\r\n        </span>\r\n    </ng-template>\r\n</context-menu>\r\n\r\n<!-- Modal per cambiare posizione e visibilit\u00E0 delle colonne dell'es-table -->\r\n<div bsModal #changeColumnVisibilityModal=\"bs-modal\" class=\"modal fade\" role=\"dialog\" aria-hidden=\"true\">\r\n    <div class=\"modal-dialog modal-lg\" cdkDrag>\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header est-pointer\" cdkDragHandle>\r\n                <h5 class=\"modal-title pull-left\">\r\n                    <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Order' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                        {{'Columns Visibility' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Visibility and Order' | localize : lc}}\r\n                    </ng-container>\r\n                </h5>\r\n                <button type=\"button\" class=\"close pull-right\" (click)=\"changeColumnVisibilityModal.hide();\" aria-label=\"Close\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div *ngIf=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"card card-info est-padding-10 est-margin-bottom-0\">\r\n                    {{'There are no columns configured to be hidden/shown in this view' | localize : lc}}\r\n                </div>\r\n                <div *ngIf=\"TMPColumnsList && TMPColumnsList.length > 0\" style=\"max-height:500px; overflow-y:auto\">\r\n                    <!--Aaaaaaah la tristezza... qui mi servirebbe l'es-table per facilitare la selezione multipla ecc... peccato che se la linko qui entro in un loop impressionante-->\r\n                    <table class=\"table table-striped table-sm est-margin-bottom-0\">\r\n                        <thead>\r\n                            <tr>\r\n                                <th class=\"est-col-min\" *ngIf=\"HiddenColumns\">\r\n                                    <input class=\"est-pointer\" type=\"checkbox\" [(ngModel)]=\"globalColVisCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"columnMetadata_H.globalColVisCheckChanged();\">\r\n                                </th>\r\n                                <!-- <th class=\"est-col-min\" *ngIf=\"ColumnsOrdering\"></th> -->\r\n                                <th class=\"est-col-min est-nowrap\">{{'Column Name' | localize : lc}}</th>\r\n                                <!--Filler-->\r\n                                <th></th>\r\n                                <!-- Pinner -->\r\n                                <th *ngIf=\"DirectivesBased\" class=\"est-col-min\"></th>\r\n                            </tr>\r\n                        </thead>\r\n                        <tbody \r\n                            cdkDropList \r\n                            [cdkDropListData]=\"TMPColumnsList\" \r\n                            (cdkDropListDropped)=\"columnMetadata_H.columnReordered($event)\" \r\n                            [cdkDropListSortPredicate]=\"columnMetadata_H.sortPredicate.bind(this.columnMetadata_H)\"\r\n                            class=\"est-dropbox\">\r\n\r\n                            <tr *ngFor=\"let item of TMPColumnsList; let i = index; let last = last\" \r\n                                class=\"est-pointer est-droplist\" \r\n                                [class.est-white-selected]=\"lastSelectedItemID == item.id\" \r\n                                [class.est-no-selection]=\"!item.visible\"\r\n                                cdkDrag\r\n                                [cdkDragData]=\"item\"\r\n                                [cdkDragDisabled]=\"!ColumnsOrdering || item.fixed || item.pinned\">\r\n\r\n                                <td *ngIf=\"HiddenColumns\">\r\n                                    <input type=\"checkbox\" [class.est-hidden-view]=\"item.fixed\" class=\"est-pointer\" [(ngModel)]=\"item.visible\" name=\"visible{{i}}\" (ngModelChange)=\"columnMetadata_H.updateGlobalColVisCheck();\" />\r\n                                </td>\r\n                                <td class=\"est-nowrap drag-visible\" (click)=\"columnMetadata_H.columnClicked(item);\">\r\n                                    <ng-container *ngIf=\"item.template\">\r\n                                        <!-- Padri -->\r\n                                        <span *ngIf=\"item.parentTemplates && item.parentTemplates.length > 0\" class=\"est-fw-bold est-fs-13\">\r\n                                            (&nbsp;\r\n                                            <ng-container *ngFor=\"let parent of item.parentTemplates; let last=last\">\r\n                                                <ng-container *ngIf=\"parent.tmpl\"><ng-container *ngTemplateOutlet=\"parent.tmpl\"></ng-container></ng-container>\r\n                                                <ng-container *ngIf=\"parent.content\">{{parent.content}}</ng-container>\r\n                                                <span *ngIf=\"!last\">&nbsp;-&nbsp;</span>\r\n                                            </ng-container>\r\n                                            &nbsp;)\r\n                                        </span>\r\n                                        <!-- Template header originale -->\r\n                                        <ng-container *ngTemplateOutlet=\"item.template; context: { $implicit: item.multi ? item.multiContent : null }\"></ng-container>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"!item.template\">{{item.description}}</ng-container>\r\n                                </td>\r\n                                <!--Filler-->\r\n                                <td (click)=\"columnMetadata_H.columnClicked(item);\"></td>\r\n                                <!-- Pinner -->\r\n                                <td *ngIf=\"DirectivesBased && ColumnsPinnable\"><span *ngIf=\"!item.fixed && item.pinnable\" class=\"fa fa-thumb-tack\" [class.text-success]=\"item.pinned\" (click)=\"columnMetadata_H.pinOrUnpinColumn(item)\"></span></td>\r\n                            </tr>\r\n                        </tbody>\r\n                    </table>\r\n                </div>\r\n            </div>\r\n            <div class=\"modal-footer\">\r\n                <button type=\"button\" class=\"btn btn-secondary est-margin-right-10\" (click)=\"lastSelectedItemID = null; changeColumnVisibilityModal.hide();\">{{'Close' | localize : lc}}</button>\r\n                <button type=\"button\" [disabled]=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"btn btn-primary\" (click)=\"columnMetadata_H.confirmColumnVisibilitySelection() && changeColumnVisibilityModal.hide()\">{{'Confirm' | localize : lc}}</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".est-loading-box{height:200px;text-align:center;position:relative;background:#ccc}.est-loading-content{margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:35px}.est-scrollable{max-height:600px;overflow:auto}.est-head-resizer{top:0;right:0;bottom:0;width:7px;position:absolute;cursor:col-resize}.est-head-resizer-internal{top:0;right:0px;left:6px;bottom:0;width:1px;position:absolute;background-color:#ccc;height:100%}.est-pointer{cursor:pointer}.est-high-density th,.est-high-density td{padding:0;padding-left:.2rem;padding-right:.2rem}.est-no-selection{-webkit-user-select:none;-moz-user-select:none;-khtml-user-select:none;-ms-user-select:none}.est-edit-hidden{visibility:hidden;height:1px!important}.est-hidden-view{visibility:hidden}.est-no-border{border:none!important}.est-nowrap{white-space:nowrap}.est-mt-min-5{margin-top:-5px}.est-white-selected{background-color:#ddd!important}.est-line-through{text-decoration:line-through}.est-no-side-padding{padding-left:0;padding-right:0}.est-no-left-padding,.est-no-right-padding{padding-left:0}.est-col-min{width:1px}.est-margin-bottom-0{margin-bottom:0!important}.est-margin-right-10{margin-right:10px!important}.est-right-9{right:9px!important}.est-table-dotted-menu{padding:0 0 2px!important;color:#999}.est-fs-18{font-size:18px}.est-fs-14,.est-fs-13{font-size:14px}.est-fw-bold{font-weight:700}.est-padding-3{padding:3px!important}.est-page-container{position:relative}.est-bring-to-front-strong{z-index:99999999!important}.est-switch{position:relative;display:inline-block;width:30px;height:17px;margin-bottom:0;margin-right:5px;margin-left:5px}.est-switch input{display:none}.est-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}.est-slider:before{position:absolute;content:\"\";height:13px;width:13px;left:3px;bottom:2px;background-color:#fff;transition:.4s}input:checked+.est-slider{background-color:#2196f3}input:focus+.est-slider{box-shadow:0 0 1px #2196f3}input:checked+.est-slider:before{transform:translate(11px)}.est-slider.round{border-radius:10px}.est-slider.round:before{border-radius:50%}.est-custom-input{width:30px;display:inline;padding:1px;height:20px}.est-row-lvl-1 td:first-child{padding-left:5px}.est-row-lvl-2 td:first-child{padding-left:20px}.est-row-lvl-3 td:first-child{padding-left:35px}.est-row-lvl-4 td:first-child{padding-left:50px}.est-row-lvl-5 td:first-child{padding-left:65px}.est-row-lvl-6 td:first-child{padding-left:80px}.est-row-lvl-7 td:first-child{padding-left:95px}.est-row-lvl-8 td:first-child{padding-left:110px}.est-row-lvl-9 td:first-child{padding-left:125px}.est-row-lvl-10 td:first-child{padding-left:140px}.est-row-lvl-11 td:first-child{padding-left:155px}.est-row-lvl-12 td:first-child{padding-left:170px}.est-row-lvl-13 td:first-child{padding-left:185px}.est-row-lvl-14 td:first-child{padding-left:200px}.est-row-lvl-15 td:first-child{padding-left:215px}.est-row-lvl-16 td:first-child{padding-left:230px}.est-row-lvl-17 td:first-child{padding-left:245px}.est-row-lvl-18 td:first-child{padding-left:260px}.est-row-lvl-19 td:first-child{padding-left:275px}.est-row-lvl-20 td:first-child{padding-left:290px}.est-row-lvl-21 td:first-child{padding-left:305px}.est-row-lvl-22 td:first-child{padding-left:320px}.est-row-lvl-23 td:first-child{padding-left:335px}.est-row-lvl-24 td:first-child{padding-left:350px}.est-row-lvl-25 td:first-child{padding-left:365px}.est-row-lvl-26 td:first-child{padding-left:380px}.est-row-lvl-27 td:first-child{padding-left:395px}.est-row-lvl-28 td:first-child{padding-left:410px}.est-row-lvl-29 td:first-child{padding-left:425px}.est-row-lvl-30 td:first-child{padding-left:440px}.est-row-lvl-31 td:first-child{padding-left:455px}.est-row-lvl-32 td:first-child{padding-left:470px}.est-row-lvl-33 td:first-child{padding-left:485px}.est-row-lvl-34 td:first-child{padding-left:500px}.est-row-lvl-35 td:first-child{padding-left:515px}.est-row-lvl-36 td:first-child{padding-left:530px}.est-row-lvl-37 td:first-child{padding-left:545px}.est-row-lvl-38 td:first-child{padding-left:560px}.est-row-lvl-39 td:first-child{padding-left:575px}.est-row-lvl-40 td:first-child{padding-left:590px}.est-row-lvl-41 td:first-child{padding-left:605px}.est-row-lvl-42 td:first-child{padding-left:620px}.est-row-lvl-43 td:first-child{padding-left:635px}.est-row-lvl-44 td:first-child{padding-left:650px}.est-row-lvl-45 td:first-child{padding-left:665px}.est-row-lvl-46 td:first-child{padding-left:680px}.est-row-lvl-47 td:first-child{padding-left:695px}.est-row-lvl-48 td:first-child{padding-left:710px}.est-row-lvl-49 td:first-child{padding-left:725px}.est-row-lvl-50 td:first-child{padding-left:740px}.est-row-lvl-51 td:first-child{padding-left:755px}.est-row-lvl-52 td:first-child{padding-left:770px}.est-row-lvl-53 td:first-child{padding-left:785px}.est-row-lvl-54 td:first-child{padding-left:800px}.est-row-lvl-55 td:first-child{padding-left:815px}.est-row-lvl-56 td:first-child{padding-left:830px}.est-row-lvl-57 td:first-child{padding-left:845px}.est-row-lvl-58 td:first-child{padding-left:860px}.est-row-lvl-59 td:first-child{padding-left:875px}.est-row-lvl-60 td:first-child{padding-left:890px}.est-row-lvl-61 td:first-child{padding-left:905px}.est-row-lvl-62 td:first-child{padding-left:920px}.est-row-lvl-63 td:first-child{padding-left:935px}.est-row-lvl-64 td:first-child{padding-left:950px}.est-row-lvl-65 td:first-child{padding-left:965px}.est-row-lvl-66 td:first-child{padding-left:980px}.est-row-lvl-67 td:first-child{padding-left:995px}.est-row-lvl-68 td:first-child{padding-left:1010px}.est-row-lvl-69 td:first-child{padding-left:1025px}.est-row-lvl-70 td:first-child{padding-left:1040px}.est-row-lvl-71 td:first-child{padding-left:1055px}.est-row-lvl-72 td:first-child{padding-left:1070px}.est-row-lvl-73 td:first-child{padding-left:1085px}.est-row-lvl-74 td:first-child{padding-left:1100px}.est-row-lvl-75 td:first-child{padding-left:1115px}.est-row-lvl-76 td:first-child{padding-left:1130px}.est-row-lvl-77 td:first-child{padding-left:1145px}.est-row-lvl-78 td:first-child{padding-left:1160px}.est-row-lvl-79 td:first-child{padding-left:1175px}.est-row-lvl-80 td:first-child{padding-left:1190px}.est-row-lvl-81 td:first-child{padding-left:1205px}.est-row-lvl-82 td:first-child{padding-left:1220px}.est-row-lvl-83 td:first-child{padding-left:1235px}.est-row-lvl-84 td:first-child{padding-left:1250px}.est-row-lvl-85 td:first-child{padding-left:1265px}.est-row-lvl-86 td:first-child{padding-left:1280px}.est-row-lvl-87 td:first-child{padding-left:1295px}.est-row-lvl-88 td:first-child{padding-left:1310px}.est-row-lvl-89 td:first-child{padding-left:1325px}.est-row-lvl-90 td:first-child{padding-left:1340px}.est-row-lvl-91 td:first-child{padding-left:1355px}.est-row-lvl-92 td:first-child{padding-left:1370px}.est-row-lvl-93 td:first-child{padding-left:1385px}.est-row-lvl-94 td:first-child{padding-left:1400px}.est-row-lvl-95 td:first-child{padding-left:1415px}.est-row-lvl-96 td:first-child{padding-left:1430px}.est-row-lvl-97 td:first-child{padding-left:1445px}.est-row-lvl-98 td:first-child{padding-left:1460px}.est-row-lvl-99 td:first-child{padding-left:1475px}.est-relative{position:relative}.est-top-pager{position:absolute;right:0;top:5px}.est-top-allselect{position:absolute;left:0;top:5px;font-weight:700}.est-padding-10{padding:10px!important}.est-margin-right-50{margin-right:50px}.est-margin-left-50{margin-left:50px}.est-quick-unpin{color:#000;margin-left:8px;font-size:14px;transform:rotate(45deg)}.est-page-sel{color:#000;margin-left:3px;margin-right:3px;padding:0 5px;font-size:inherit;border:none;border-radius:15px}.est-page-prev,.est-page-next{color:#000;padding:2px 0 0;font-size:inherit}.est-pinned-header{background-color:#fff;left:0;top:0;position:sticky;z-index:1;border-bottom:1px solid #dee2e6!important;padding:0!important}.est-simple-border-bottom{border-bottom:1px solid #dee2e6}.est-pinned-internal-header{border-top:0;border-bottom:0px solid #dee2e6}.est-pinned-border{border-right:2px solid #dee2e6!important}.est-cell-padding{padding:.3rem}.est-pinned-body{background-color:#fff;left:0;position:sticky;z-index:1;border-top:1px solid #dee2e6!important;padding:0!important}.est-inline{display:inline!important}.est-inline-block{display:inline-block!important}.est-link{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block}.est-link:hover{color:#23527c!important;cursor:pointer;text-decoration:underline!important}.est-sticky-last-column{right:-1px;position:sticky;z-index:0;background-color:#fff}.est-sticky-last-column-alt{right:-1px;position:sticky;z-index:0;background-color:#f2f2f2}.est-ltab-border{border-left:2px solid #bbb}.est-rtab-border{border-right:2px solid #bbb}.est-cell-group-padding{padding:calc(.3rem + 1px);position:absolute;top:0;left:0;height:100%;width:100%}.est-margin-bottom-10{margin-bottom:10px}.est-text-center{text-align:center}.est-flex{display:flex}.est-rg-sep-flex-right{display:flex;flex-direction:row-reverse;width:100%;margin:-5px}.est-rg-sep-flex-left{display:flex;flex-direction:row;width:100%;margin:-5px}.est-rg-hdr{font-weight:700}.est-rg-agg{font-style:italic}.est-rg{background-color:#7777!important}.est-rg-sep{font-size:12px;padding-right:20px!important;background-color:#bbbb!important}.est-rg-ipp{text-align:left;display:inline-flex;margin-right:25px}.est-rg-page{text-align:right;display:inline-flex;font-size:inherit;padding-top:5px}.est-droplist.cdk-drag-placeholder{opacity:0}.est-droplist.cdk-drag-preview{z-index:999999999!important;opacity:1;box-sizing:border-box;border-radius:4px;background-color:#fff;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.est-droplist.cdk-drag-preview td:not(.drag-visible){visibility:hidden}.est-droplist.cdk-drag-preview td.drag-visible{padding-top:3px}.est-droplist.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.est-droplist.cdk-drop-list-dragging .est-dropbox:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.est-pre{white-space:pre}.est .mat-form-field-flex{height:29px!important;padding:0!important}.est .mat-form-field-flex .mat-form-field-outline{color:#00f}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-start{border-left:none;border-top:none;border-radius:0}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-end{border-top:none;border-radius:0;border-right:none}.est .mat-form-field-wrapper{height:20px;min-height:20px!important;margin-top:0!important}.est .mat-form-field-infix{width:100%!important;min-width:50px!important}.est input{height:20px;padding-top:0!important}\n"], components: [{ type: EsTh, selector: "[es-th]", inputs: ["es-th", "Order", "Orderable", "Display", "Resizable", "Pinned", "SearchInProgress", "OrderBy", "Wrap", "Fixed", "Template", "Visible"], outputs: ["onOrderChange", "onUnpinning"] }, { type: TablePagerComponent, selector: "app-paging", inputs: ["CurrentPageSize", "View", "WarnOnAll", "AllSearch", "DefaultAll", "GroupMode", "GroupCount", "CountLabel", "ShowCount", "ShowPaging", "PagerCount", "Hidden"], outputs: ["pagingSelected"] }, { type: EsTd, selector: "[es-td]", inputs: ["es-td", "Internal", "RouterLink", "Display", "Template", "Context", "Visible"] }, { type: i9.FormAdaptiveComponent, selector: "form-adaptive", inputs: ["Type", "TypeMissingMessage", "Pattern", "AllowDownload", "Precision", "Alignment", "SearchFunction", "MinChars", "CaseSensitive"] }, { type: i10.ContextMenuComponent, selector: "context-menu", inputs: ["menuClass", "autoFocus", "useBootstrap4", "disabled"], outputs: ["close", "open"] }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i12.CsvDirective, selector: "[csvLink]", inputs: ["data", "headers", "delimiter", "filename", "uFEFF", "target"] }, { type: i13.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { type: i13.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i13.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i10.ContextMenuAttachDirective, selector: "[contextMenu]", inputs: ["contextMenuSubject", "contextMenu"] }, { type: i14.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i10.ContextMenuItemDirective, selector: "[contextMenuItem]", inputs: ["subMenu", "divider", "enabled", "passive", "visible"], outputs: ["execute"] }, { type: i15.ModalDirective, selector: "[bsModal]", inputs: ["config", "closeInterceptor"], outputs: ["onShow", "onShown", "onHide", "onHidden"], exportAs: ["bs-modal"] }, { type: i16.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i16.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i16.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }], pipes: { "localize": i2.LocalizePipe, "number": i11.DecimalPipe }, viewProviders: [{ provide: LocalizationService, useClass: EsTableLoc }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'es-table', viewProviders: [{ provide: LocalizationService, useClass: EsTableLoc }], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<!-- Patacchino di autoaggiornamento -->\r\n<div class=\"w-100\" *ngIf=\"AutoUpdate\">\r\n    <div class=\"pull-right\">\r\n        {{'Update every' | localize : lc}}&nbsp;<input [readonly]=\"autoUpdate\" maxlength=\"3\" class=\"form-control est-custom-input\" type=\"text\" [(ngModel)]=\"seconds\" />&nbsp;{{'second/s' | localize : lc}}\r\n    </div>\r\n    <div class=\"pull-right m-t-2\">\r\n        <label class=\"est-switch\">\r\n            <input type=\"checkbox\" [(ngModel)]=\"autoUpdate\" (ngModelChange)=\"autoUpdateChanged();\" />\r\n            <div class=\"est-slider round\"></div>\r\n        </label>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<div *ngIf=\"View\" class=\"est-relative\">\r\n    <div *ngIf=\"FirstBind && ShowLoadingOnBootstrap\" class=\"est-loading-box\">\r\n        <div class=\"est-loading-content\">\r\n            <span class=\"fa fa-spinner fa-spin\"></span>&nbsp;{{'Performing Table bootstrap' | localize: lc}}...\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"est-top-pager\" *ngIf=\"PagingStyle == 'both' || PagingStyle == 'top'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"est-top-allselect\" *ngIf=\"canSelectAll || (!reportMode && (View?.selection || arraymodeSelection)?.all)\">\r\n        <span>{{ (selectedObjects == -1 ? ('All the' | localize : lc) : ((selectedObjects || 0) | number : '0.0-0' : locale)) + ' ' + ((selectedObjects == 1 ? 'Object Selected' : 'Objects Selected') | localize : lc) }}</span>&nbsp;\r\n        <span class=\"est-link est-inline\" (click)=\"selection_H.selectAllOrResetSelection()\">{{ (View?.selection || arraymodeSelection)?.all ? ('Reset Selection' | localize : lc) : ('Select Everything' | localize : lc)}}</span>\r\n    </div>\r\n\r\n    <div class=\"table-responsive datatable {{ContainerClass}}\" [style.max-height.px]=\"MaxHeight\">\r\n        <table class=\"{{ TableClass }} est-margin-bottom-10\"  [class.est-high-density]=\"HighCellDensity\">\r\n            <thead [hidden]=\"HeaderHidden || FirstBind\">\r\n                <!-- Aggiungo il pezzo che gestisce la selezione di tutto se attivo da config -->\r\n                <tr *ngIf=\"SelectAll || PagingStyle != 'bottom'\">\r\n                    <th class=\"est-no-selection\" [attr.colspan]=\"Columns.Global\" [class.est-hidden-view]=\"!canSelectAll && (reportMode || !(View?.selection || arraymodeSelection)?.all) && PagingStyle == 'bottom'\">\r\n                        <p class=\"est-hidden-view app-margin-bottom-0\">\u00A7</p>\r\n                    </th>\r\n                </tr>\r\n\r\n                <!-- Blocco header group -->\r\n                <ng-container *ngIf=\"RowThGroups\">\r\n                    <tr *ngFor=\"let level of RowThGroups\">\r\n                        <th *ngFor=\"let cell of level\" [attr.colspan]=\"cell.Span\" \r\n                            [class.est-pinned-header]=\"cell.Pinned\" [class.est-col-min]=\"cell.Pinned\"\r\n                            [class.est-ltab-border]=\"cell.Borders\" [class.est-rtab-border]=\"cell.Borders\"\r\n                            class=\"est-text-center\">\r\n                            <ng-container *ngIf=\"cell.Pinned; Else: cell.Template\">\r\n                                <div class=\"est-pinned-border est-cell-group-padding\"></div>\r\n                            </ng-container>\r\n                        </th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!RowThGroups\">\r\n                    <tr *ngIf=\"HasHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"headerGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n    \r\n                    <!-- Blocco header group secondario -->\r\n                    <tr *ngIf=\"HasSecondaryHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"secondaryHeaderGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <!-- Blocco effettivo degli header -->\r\n                <tr>\r\n                    <!-- Aggiungo una checkbox se la selezione \u00E8 attiva -->\r\n                    <th class=\"est-col-min\" *ngIf=\"Selection && !HasPinnedColumns\">\r\n                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                    </th>\r\n\r\n                    <!-- Header che valgono per view mode e array mode -->\r\n                    <ng-container *ngIf=\"(viewMode || arrayMode)\">\r\n\r\n                        <!-- In una tabella base prendo semplicemente i th scritti dall'utente nell'HTML -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs) && !DynamicRowColumnsDefinition\">\r\n                            <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se ho un modello dinamico dell'oggetto creo le colonne in base alle propriet\u00E0 -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs) && DynamicRowColumnsDefinition\">\r\n                            <th *ngFor=\"let operation of DynamicOperations\" class=\"est-col-min est-no-side-padding\"></th>\r\n                            \r\n                            <ng-container *ngFor=\"let rowHeader of DynamicRowColumnsDefinition\">\r\n                                <ng-container *ngIf=\"rowHeader.visible\">\r\n                                    <th *ngIf=\"OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"thOrderChanged(rowHeader.propertyName, $event)\">{{rowHeader.description}}</th>\r\n                                    <th *ngIf=\"!OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\">{{rowHeader.description}}</th>\r\n                                </ng-container>\r\n                            </ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se non ho un modello dinamico ma invece delle celle custom, genero gli header in base ai row th -->\r\n                        <ng-container *ngIf=\"UseCustomCells && RowTHs\">\r\n                            <th *ngIf=\"HasPinnedColumns\" class=\"est-pinned-header est-col-min\">\r\n                                <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-simple-border-bottom\">\r\n                                    <th class=\"est-col-min est-no-border\" *ngIf=\"Selection\" [style.width.px]=\"20\">\r\n                                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                                    </th>\r\n                                    <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n                                        <th *ngIf=\"rowHeader && rowHeader.Visible && rowHeader.Pinned\" [style.width.px]=\"rowHeader.PinnedWidth\" es-th=\"{{rowHeader.ID}}\" \r\n                                            class=\"{{rowHeader.Class || ''}}\" \r\n                                            [class.est-pinned-internal-header]=\"true\" \r\n                                            [class.est-no-border]=\"true\" \r\n                                            [class.est-nowrap]=\"!rowHeader.Wrap\" \r\n                                            [Pinned]=\"true\" [Fixed]=\"rowHeader.Fixed\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onUnpinning)=\"columnMetadata_H.unpinColumn($event)\" (onOrderChange)=\"OrderByColumn && thOrderChanged(rowHeader.ID, $event)\">\r\n                                            <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template;\"></ng-container></ng-container>\r\n                                            <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                        </th>\r\n                                    </ng-container>\r\n                                </div>\r\n                            </th>\r\n                            <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n                                <th *ngIf=\"rowHeader && rowHeader.Visible && !rowHeader.Pinned\" es-th=\"{{rowHeader.ID}}\" class=\"{{rowHeader.Class || ''}}\" [class.est-ltab-border]=\"rowHeader.LeftBorder\" [class.est-rtab-border]=\"rowHeader.RightBorder\" [class.est-nowrap]=\"!rowHeader.Wrap\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"OrderByColumn && thOrderChanged(rowHeader.ID, $event)\">\r\n                                    <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template;\"></ng-container></ng-container>\r\n                                    <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                </th>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </ng-container>\r\n\r\n                    <!--Casistica in cui ho il setup proveniente da un report. Gli header sono definiti da come \u00E8 fatto il report-->\r\n                    <ng-container *ngIf=\"reportMode\">\r\n                        <th [style.color]=\"clm.color\" *ngFor=\"let clm of ReportValues.columns\" class=\"est-no-selection est-pointer est-nowrap\" (click)=\"reportMode_H.setupNextOrderAndSearch(clm)\">\r\n                            {{clm.description}}<span class=\"fa\" [class.fa-chevron-down]=\"clm.order == 'DESC'\" [class.fa-chevron-up]=\"clm.order == 'ASC'\"></span>\r\n                        </th>\r\n                    </ng-container>\r\n\r\n                    <!--Per l'eliminazione mi serve un header aggiuntivo-->\r\n                    <th *ngIf=\"Removal\" [class.est-right-9]=\"Export || HiddenColumns\" class=\"est-col-min est-sticky-last-column\"><span class=\"fa fa-trash\"></span></th>\r\n\r\n                    <!--Per l'esportazione mi serve l'header extra da cui faccio uscire i 3 pallocchi-->\r\n                    <th *ngIf=\"Export || HiddenColumns || ColumnsOrdering || CornerMenuOptions\" class=\"est-table-dotted-menu est-sticky-last-column est-col-min text-sm-center\">\r\n                        \r\n                        <!-- Link nascosto che serve a scaricare il file -->\r\n                        <a *ngIf=\"headers\" hidden #exportDownloader csvLink [data]=\"data\" [headers]=\"headers\" [delimiter]=\"';'\" [filename]=\"ExportFileName.endsWith('.xlsx') ? ExportFileName.replace('.xlsx', '.csv') : ExportFileName.endsWith('.csv') ? ExportFileName : ExportFileName + '.csv'\"></a>\r\n\r\n                        <!-- Blocco con i 3 pallocchi che tira fuori il context menu delle operazioni -->\r\n                        <div class=\"btn-group\" container=\"body\" placement=\"bottom right\" dropdown #dropdown=\"bs-dropdown\" [autoClose]=\"true\">\r\n                            <span dropdownToggle class=\"fa fa-ellipsis-v est-fs-18 est-pointer est-padding-3\"></span>\r\n\r\n                            <div *dropdownMenu class=\"dropdown-menu dropdown-menu-right est-bring-to-front-strong\">\r\n                                <div class=\"est-pointer\">\r\n                                    <a class=\"dropdown-item\" *ngIf=\"HiddenColumns || ColumnsOrdering\" (click)=\"columnMetadata_H.resetColumnVisSelection(); changeColumnVisibilityModal.show();\">\r\n                                        <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                                            {{'Columns Visibility' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Visibility and Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                    </a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && CSVExport\" (click)=\"export_H.tryExport('CSV')\">{{'Export View' | localize : lc}} (CSV)</a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && XLSXExport\" (click)=\"export_H.tryExport('XLSX')\">{{'Export View' | localize : lc}} (XLSX)</a>\r\n                                    <a class=\"dropdown-item\" *ngFor=\"let option of CornerMenuOptions\" (click)=\"cornerActionClicked(option.id)\">{{option.description}}</a>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </th>\r\n                </tr>\r\n            </thead>\r\n            \r\n            <!-- Valido per modalit\u00E0 View o Array. Se sono in report mode il body \u00E8 creato in altro modo -->\r\n            <tbody [hidden]=\"BodyHidden || FirstBind\" *ngIf=\"(arrayMode || viewMode)\">\r\n                <!--Con selection attiva richiamo il template che gestisce il context menu-->\r\n                <ng-container *ngIf=\"Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBodySelection; context: { $implicit: { selDisabled: arrayMode ? false : SelectionDisabled, sel: Selection }}\"></ng-container>\r\n                </ng-container>\r\n\r\n                <!--Senza selection richiamo il template che NON gestisce il context menu-->\r\n                <ng-container *ngIf=\"!Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBody\"></ng-container>\r\n                </ng-container>\r\n            </tbody>\r\n\r\n            <!-- Per la modalit\u00E0 a report c'\u00E8 un body particolare semi-dinamico -->\r\n            <tbody [hidden]=\"BodyHidden\" *ngIf=\"reportMode\">\r\n                <tr *ngFor=\"let row of ReportValues.rows; let even = even;\">\r\n                    <td class=\"est-nowrap\" *ngFor=\"let val of row.values\">{{val}}</td>\r\n                    <td class=\"est-sticky-last-column{{even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n                </tr>\r\n            </tbody>\r\n        </table>\r\n    </div>\r\n\r\n    <div *ngIf=\"PagingStyle == 'both' || PagingStyle == 'bottom'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n</div>\r\n\r\n<!-- Template che contiene tutte le info di paginazione in modo da poterlo replicare anche sopra -->\r\n<ng-template #pagingElement>\r\n    <ng-container *ngIf=\"!FirstBind\">\r\n        <!-- Pulsanti avanti-indietro di paginazione -->\r\n        <div *ngIf=\"PagerOptions.ShowPaging && PagerOptions.ShowButtons && (PagerOptions.PagerCount > 10 || PagerOptions.PagerCount == -1)\" class=\"pull-right btn-toolbar\">\r\n            <ng-container *ngIf=\"(!reportMode || View?.pagingavailable) && (!arrayMode || SearchView)\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: addToPage.bind(this), GTP: goToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"arrayMode && UseArrayModePaging && !SearchView\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: arrayAddToPage.bind(this), GTP: arrayGoToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n        <!-- Paginatore dove appare la count e le opzioni di paginazione -->\r\n        <div class=\"pull-right\" *ngIf=\"PagerOptions.ShowCount || PagerOptions.ShowPagingOptions\">\r\n            <div class=\"est-mt-min-5\" *ngIf=\"PagerOptions.ShowPaging\">\r\n                <app-paging *ngIf=\"!PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [WarnOnAll]=\"false\" [CurrentPageSize]=\"ArraymodeItemsPerPage\" (pagingSelected)=\"items_H.refreshPaging($event)\"></app-paging>\r\n                <app-paging *ngIf=\"PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [GroupMode]=\"PagerOptions.Searches == 'groups'\" [AllSearch]=\"AllSearch\" [View]=\"PagerOptions.View\" (pagingSelected)=\"onItemsPerPageChanged($event);\"></app-paging>\r\n            </div>\r\n            <div *ngIf=\"reportMode && !PagerOptions.ShowPaging\"><em>{{'Paging options are not available for this report' | localize: lc}}</em></div>\r\n        </div>\r\n        <div class=\"clearfix\"></div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Template che contiene i pulsanti per cambiare pagina -->\r\n<ng-template #pagingButtons let-options>\r\n    <div class=\"est-flex\" [class.est-margin-left-50]=\"options.Margin\">\r\n        <a class=\"btn\" class=\"est-page-prev app-pointer\" (click)=\"options.ATP(-1, options.separator)\"><span class=\"fa fa-chevron-left\"></span></a>\r\n        <div *ngIf=\"options.Array\" class=\"est-inline\"><a *ngFor=\"let p of options.Array\" class=\"btn est-page-sel {{p.cssClass}}\" (click)=\"options.GTP(p.val, options.separator)\">{{p.val}}</a></div>\r\n        <a class=\"btn\" class=\"est-page-next app-pointer\" (click)=\"options.ATP(1, options.separator)\"><span class=\"fa fa-chevron-right\"></span></a>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Questi due template rappresentano effettivamente il body della tabella. essendo il tr l'unica cosa che davvero cambia, il resto \u00E8 templatizzato -->\r\n<ng-template #TBodySelection let-templateOptions>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even; let i=index; trackBy: bodyTrackBy\">\r\n        <tr *ngIf=\"item._visible || (!Hierarchy && !ArrayGrouping)\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\" \r\n            [class.est-pointer]=\"!item.locked\" \r\n            [class.est-white-selected]=\"item._selected && !item.locked\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            [contextMenu]=\"!item.locked ? (ContextMenu || emptyMenu) : emptyMenu\" [contextMenuSubject]=\"item\"\r\n            (click)=\"(!item.locked && !item._sep && !item._group && handleClick($event, item)) || item._group && handleGroupClick(item)\">\r\n\r\n            <td *ngIf=\"!item.locked && !item._sep && !HasPinnedColumns\">\r\n                <input  type=\"checkbox\" \r\n                        [disabled]=\"templateOptions.selDisabled\" \r\n                        [class.est-pointer]=\"!item.locked\"\r\n                        [(ngModel)]=\"item._selected\" name=\"check{{i}}\" \r\n                        (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n            </td>\r\n            <td *ngIf=\"(item.locked || item._sep) && !HasPinnedColumns\"></td>\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container> </ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item, templateOptions: templateOptions }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #TBody>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even;\">\r\n        <tr *ngIf=\"item._visible || !Hierarchy\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            (click)=\"item._group && handleGroupClick(item)\">\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container></ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #groupPager let-item>\r\n    <td class=\"est-pinned-body \" *ngIf=\"HasPinnedColumns\"><div class=\"est-pinned-border est-cell-group-padding\"></div></td>\r\n    <td *ngIf=\"item._grouplevel > 1\" [attr.colspan]=\"item._grouplevel-1\"></td>\r\n    <td [attr.colspan]=\"Columns.VisibleUnpinned - (item._grouplevel > 0 ? item._grouplevel - 1 : 0)\">\r\n        <div class=\"est-rg-sep-flex-right\" *ngIf=\"RowGroupingPagingStyle == 'right'\">\r\n            <div class=\"est-rg-page\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n            <div class=\"est-rg-ipp\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><app-paging [CountLabel]=\"CountLabel\" [AllSearch]=\"AllSearch\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n        </div>\r\n\r\n        <div class=\"est-rg-sep-flex-left\" *ngIf=\"RowGroupingPagingStyle == 'left'\">\r\n            <div class=\"est-rg-ipp\"><app-paging [AllSearch]=\"AllSearch\" [CountLabel]=\"CountLabel\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n            <div class=\"est-rg-page\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n        </div>\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle semplici, con header e body scritti a manazza -->\r\n<ng-template #basicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || !RowTDs) && !DynamicRowColumnsDefinition\">\r\n        <ng-container *ngTemplateOutlet=\"bodyRef; context : {$implicit: item}\"></ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle definite in maniera dinamica dal modello -->\r\n<ng-template #dynamicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || !RowTDs) && DynamicRowColumnsDefinition\">\r\n        <ng-container *ngFor=\"let operation of DynamicOperations; let first = first; let last = last;\">\r\n            <ng-container *ngIf=\"!operation.conditionField || (item.properties[operation.conditionField] == operation.conditionValue)\">\r\n                <td [class.est-no-right-padding]=\"last\" [class.est-no-left-padding]=\"!first\" class=\"est-col-min\"><span title=\"{{operation.title}}\" class=\"{{operation.iconClass}} est-pointer\" (click)=\"dynamicOperation(item, operation.id)\">{{operation.text}}</span></td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"operation.conditionField && (item.properties[operation.conditionField] != operation.conditionValue)\">\r\n                <td class=\"est-col-min est-no-side-padding\"></td>\r\n            </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngFor=\"let rowItem of DynamicRowColumnsDefinition\">\r\n            <ng-container *ngIf=\"rowItem.routePath && rowItem.visible\">\r\n                <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n                    <a [routerLink]=\"dynamicMode_H.generateRouterLink(rowItem.routePath, rowItem.routeParameterProperties, item)\" class=\"est-link\" [innerHTML]=\"item.properties[rowItem.propertyName]\"></a>\r\n                </td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!rowItem.routePath && rowItem.visible\">\r\n                <ng-container *ngTemplateOutlet=\"findEsTd(rowItem.propertyName) || defaultEsTd; context: { $implicit: item.properties[rowItem.propertyName], rowItem : rowItem, item : item }\"> </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #defaultEsTd let-value let-rowItem='rowItem' let-item='item'>\r\n    <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n        {{value}}\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale delle celle custom se configurate -->\r\n<ng-template #customCells let-item let-opt=\"templateOptions\">\r\n    <ng-container *ngIf=\"UseCustomCells && RowTDs\">\r\n\r\n        <td *ngIf=\"HasPinnedColumns\" class=\"est-pinned-body est-col-min\" [class.est-white-selected]=\"item._selected\">\r\n            <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border\">\r\n                <td *ngIf=\"!item.locked && !item._sep && Selection\" class=\"est-no-border est-col-min\" [style.width.px]=\"20\">\r\n                    <input type=\"checkbox\" [disabled]=\"opt.selDisabled\" [class.est-pointer]=\"!item.locked\" [(ngModel)]=\"item._selected\" name=\"check{{item._hash}}\" (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n                </td>\r\n                <td class=\"est-no-border est-col-min\" *ngIf=\"(item.locked || item._sep) && Selection\" [style.width.px]=\"20\"></td>\r\n\r\n                <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n                    <td *ngIf=\"rowItem && rowItem.Pinned && rowItem.Visible\" [style.width.px]=\"rowItem.PinnedWidth\" es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-no-border]=\"true\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container></ng-container>\r\n                        <ng-container *ngIf=\"rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container></ng-container>\r\n                        <span *ngIf=\"!rowItem.Template\">{{rowItem.Content}}</span>\r\n                    </td>\r\n                </ng-container>\r\n            </div>\r\n        </td>\r\n\r\n        <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n            <ng-container *ngIf=\"rowItem && !rowItem.Pinned\">\r\n\r\n                <!-- Casistica senza bodyRef, quindi con direttive per i td -->\r\n                <ng-container *ngIf=\"!bodyRef && rowItem.Visible\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-ltab-border]=\"rowItem.LeftBorder\" [class.est-rtab-border]=\"rowItem.RightBorder\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container></ng-container>\r\n                        <ng-container *ngIf=\"rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container></ng-container>\r\n                        <span *ngIf=\"!rowItem.Template\">{{rowItem.Content}}</span>\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <a [routerLink]='rowItem.RouterLink' class=\"est-link\" [innerHTML]=\"rowItem.Content\"></a>\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (NON RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"!rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"rowItem.Template\">\r\n                            <ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <span *ngIf=\"!rowItem.Template\" [innerHTML]=\"rowItem.Content\"></span>\r\n                    </td>\r\n                </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #HierarchyNavigator let-item>\r\n    <span *ngIf=\"!item.parent\" class=\"fa fa-chevron-down\" style=\"visibility:hidden\"></span>\r\n    <span *ngIf=\"item.parent && item._expanded\" class=\"fa fa-chevron-down est-pointer est-no-selection\" (click)=\"hierarchyMode_H.collapseParent(item[this.OwnKey])\"></span>\r\n    <span *ngIf=\"item.parent && !item._expanded\" class=\"fa fa-chevron-up est-pointer est-no-selection\" (click)=\"hierarchyMode_H.expandParent(item[this.OwnKey])\"></span>\r\n    &nbsp;\r\n</ng-template>\r\n\r\n<!-- Questo template contiene i pulsanti di eliminazione/undo eliminazione ed esportazione che vanno in fondo ad un record edlla tabella -->\r\n<ng-template #bodyDeleteAndExport let-options>\r\n    <ng-container *ngIf=\"Removal && !RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted)\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted)\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"Removal && RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!options.item[RemovalCondition]\"><span class=\"fa fa-remove est-hidden-view\"></span></td>\r\n    </ng-container>\r\n    <td *ngIf=\"Export || HiddenColumns || CornerMenuOptions\" class=\"est-sticky-last-column{{options.even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n</ng-template>\r\n\r\n<!-- Context menu vuoto default per tutte le tabella che non ce l'hanno, in modo che al click destro appaia \"nessuna op disponibile\" -->\r\n<context-menu #emptyMenu>\r\n    <ng-template contextMenuItem>\r\n        <span>\r\n            <em>{{'No operations available' | localize : lc}}...</em>\r\n        </span>\r\n    </ng-template>\r\n</context-menu>\r\n\r\n<!-- Modal per cambiare posizione e visibilit\u00E0 delle colonne dell'es-table -->\r\n<div bsModal #changeColumnVisibilityModal=\"bs-modal\" class=\"modal fade\" role=\"dialog\" aria-hidden=\"true\">\r\n    <div class=\"modal-dialog modal-lg\" cdkDrag>\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header est-pointer\" cdkDragHandle>\r\n                <h5 class=\"modal-title pull-left\">\r\n                    <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Order' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                        {{'Columns Visibility' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Visibility and Order' | localize : lc}}\r\n                    </ng-container>\r\n                </h5>\r\n                <button type=\"button\" class=\"close pull-right\" (click)=\"changeColumnVisibilityModal.hide();\" aria-label=\"Close\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div *ngIf=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"card card-info est-padding-10 est-margin-bottom-0\">\r\n                    {{'There are no columns configured to be hidden/shown in this view' | localize : lc}}\r\n                </div>\r\n                <div *ngIf=\"TMPColumnsList && TMPColumnsList.length > 0\" style=\"max-height:500px; overflow-y:auto\">\r\n                    <!--Aaaaaaah la tristezza... qui mi servirebbe l'es-table per facilitare la selezione multipla ecc... peccato che se la linko qui entro in un loop impressionante-->\r\n                    <table class=\"table table-striped table-sm est-margin-bottom-0\">\r\n                        <thead>\r\n                            <tr>\r\n                                <th class=\"est-col-min\" *ngIf=\"HiddenColumns\">\r\n                                    <input class=\"est-pointer\" type=\"checkbox\" [(ngModel)]=\"globalColVisCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"columnMetadata_H.globalColVisCheckChanged();\">\r\n                                </th>\r\n                                <!-- <th class=\"est-col-min\" *ngIf=\"ColumnsOrdering\"></th> -->\r\n                                <th class=\"est-col-min est-nowrap\">{{'Column Name' | localize : lc}}</th>\r\n                                <!--Filler-->\r\n                                <th></th>\r\n                                <!-- Pinner -->\r\n                                <th *ngIf=\"DirectivesBased\" class=\"est-col-min\"></th>\r\n                            </tr>\r\n                        </thead>\r\n                        <tbody \r\n                            cdkDropList \r\n                            [cdkDropListData]=\"TMPColumnsList\" \r\n                            (cdkDropListDropped)=\"columnMetadata_H.columnReordered($event)\" \r\n                            [cdkDropListSortPredicate]=\"columnMetadata_H.sortPredicate.bind(this.columnMetadata_H)\"\r\n                            class=\"est-dropbox\">\r\n\r\n                            <tr *ngFor=\"let item of TMPColumnsList; let i = index; let last = last\" \r\n                                class=\"est-pointer est-droplist\" \r\n                                [class.est-white-selected]=\"lastSelectedItemID == item.id\" \r\n                                [class.est-no-selection]=\"!item.visible\"\r\n                                cdkDrag\r\n                                [cdkDragData]=\"item\"\r\n                                [cdkDragDisabled]=\"!ColumnsOrdering || item.fixed || item.pinned\">\r\n\r\n                                <td *ngIf=\"HiddenColumns\">\r\n                                    <input type=\"checkbox\" [class.est-hidden-view]=\"item.fixed\" class=\"est-pointer\" [(ngModel)]=\"item.visible\" name=\"visible{{i}}\" (ngModelChange)=\"columnMetadata_H.updateGlobalColVisCheck();\" />\r\n                                </td>\r\n                                <td class=\"est-nowrap drag-visible\" (click)=\"columnMetadata_H.columnClicked(item);\">\r\n                                    <ng-container *ngIf=\"item.template\">\r\n                                        <!-- Padri -->\r\n                                        <span *ngIf=\"item.parentTemplates && item.parentTemplates.length > 0\" class=\"est-fw-bold est-fs-13\">\r\n                                            (&nbsp;\r\n                                            <ng-container *ngFor=\"let parent of item.parentTemplates; let last=last\">\r\n                                                <ng-container *ngTemplateOutlet=\"parent\"></ng-container>\r\n                                                <span *ngIf=\"!last\">&nbsp;-&nbsp;</span>\r\n                                            </ng-container>\r\n                                            &nbsp;)\r\n                                        </span>\r\n                                        <!-- Template header originale -->\r\n                                        <ng-container *ngTemplateOutlet=\"item.template\"></ng-container>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"!item.template\">{{item.description}}</ng-container>\r\n                                </td>\r\n                                <!--Filler-->\r\n                                <td (click)=\"columnMetadata_H.columnClicked(item);\"></td>\r\n                                <!-- Pinner -->\r\n                                <td *ngIf=\"DirectivesBased && ColumnsPinnable\"><span *ngIf=\"!item.fixed && item.pinnable\" class=\"fa fa-thumb-tack\" [class.text-success]=\"item.pinned\" (click)=\"columnMetadata_H.pinOrUnpinColumn(item)\"></span></td>\r\n                            </tr>\r\n                        </tbody>\r\n                    </table>\r\n                </div>\r\n            </div>\r\n            <div class=\"modal-footer\">\r\n                <button type=\"button\" class=\"btn btn-secondary est-margin-right-10\" (click)=\"lastSelectedItemID = null; changeColumnVisibilityModal.hide();\">{{'Close' | localize : lc}}</button>\r\n                <button type=\"button\" [disabled]=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"btn btn-primary\" (click)=\"columnMetadata_H.confirmColumnVisibilitySelection() && changeColumnVisibilityModal.hide()\">{{'Confirm' | localize : lc}}</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".est-loading-box{height:200px;text-align:center;position:relative;background:#ccc}.est-loading-content{margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:35px}.est-scrollable{max-height:600px;overflow:auto}.est-head-resizer{top:0;right:0;bottom:0;width:7px;position:absolute;cursor:col-resize}.est-head-resizer-internal{top:0;right:0px;left:6px;bottom:0;width:1px;position:absolute;background-color:#ccc;height:100%}.est-pointer{cursor:pointer}.est-high-density th,.est-high-density td{padding:0;padding-left:.2rem;padding-right:.2rem}.est-no-selection{-webkit-user-select:none;-moz-user-select:none;-khtml-user-select:none;-ms-user-select:none}.est-hidden-view{visibility:hidden}.est-no-border{border:none!important}.est-nowrap{white-space:nowrap}.est-mt-min-5{margin-top:-5px}.est-white-selected{background-color:#ddd!important}.est-line-through{text-decoration:line-through}.est-no-side-padding{padding-left:0;padding-right:0}.est-no-left-padding,.est-no-right-padding{padding-left:0}.est-col-min{width:1px}.est-margin-bottom-0{margin-bottom:0!important}.est-margin-right-10{margin-right:10px!important}.est-right-9{right:9px!important}.est-table-dotted-menu{padding:0 0 2px!important;color:#999}.est-fs-18{font-size:18px}.est-fs-14,.est-fs-13{font-size:14px}.est-fw-bold{font-weight:700}.est-padding-3{padding:3px!important}.est-page-container{position:relative}.est-bring-to-front-strong{z-index:99999999!important}.est-switch{position:relative;display:inline-block;width:30px;height:17px;margin-bottom:0;margin-right:5px;margin-left:5px}.est-switch input{display:none}.est-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}.est-slider:before{position:absolute;content:\"\";height:13px;width:13px;left:3px;bottom:2px;background-color:#fff;transition:.4s}input:checked+.est-slider{background-color:#2196f3}input:focus+.est-slider{box-shadow:0 0 1px #2196f3}input:checked+.est-slider:before{transform:translate(11px)}.est-slider.round{border-radius:10px}.est-slider.round:before{border-radius:50%}.est-custom-input{width:30px;display:inline;padding:1px;height:20px}.est-row-lvl-1 td:first-child{padding-left:5px}.est-row-lvl-2 td:first-child{padding-left:20px}.est-row-lvl-3 td:first-child{padding-left:35px}.est-row-lvl-4 td:first-child{padding-left:50px}.est-row-lvl-5 td:first-child{padding-left:65px}.est-row-lvl-6 td:first-child{padding-left:80px}.est-row-lvl-7 td:first-child{padding-left:95px}.est-row-lvl-8 td:first-child{padding-left:110px}.est-row-lvl-9 td:first-child{padding-left:125px}.est-row-lvl-10 td:first-child{padding-left:140px}.est-row-lvl-11 td:first-child{padding-left:155px}.est-row-lvl-12 td:first-child{padding-left:170px}.est-row-lvl-13 td:first-child{padding-left:185px}.est-row-lvl-14 td:first-child{padding-left:200px}.est-row-lvl-15 td:first-child{padding-left:215px}.est-row-lvl-16 td:first-child{padding-left:230px}.est-row-lvl-17 td:first-child{padding-left:245px}.est-row-lvl-18 td:first-child{padding-left:260px}.est-row-lvl-19 td:first-child{padding-left:275px}.est-row-lvl-20 td:first-child{padding-left:290px}.est-row-lvl-21 td:first-child{padding-left:305px}.est-row-lvl-22 td:first-child{padding-left:320px}.est-row-lvl-23 td:first-child{padding-left:335px}.est-row-lvl-24 td:first-child{padding-left:350px}.est-row-lvl-25 td:first-child{padding-left:365px}.est-row-lvl-26 td:first-child{padding-left:380px}.est-row-lvl-27 td:first-child{padding-left:395px}.est-row-lvl-28 td:first-child{padding-left:410px}.est-row-lvl-29 td:first-child{padding-left:425px}.est-row-lvl-30 td:first-child{padding-left:440px}.est-row-lvl-31 td:first-child{padding-left:455px}.est-row-lvl-32 td:first-child{padding-left:470px}.est-row-lvl-33 td:first-child{padding-left:485px}.est-row-lvl-34 td:first-child{padding-left:500px}.est-row-lvl-35 td:first-child{padding-left:515px}.est-row-lvl-36 td:first-child{padding-left:530px}.est-row-lvl-37 td:first-child{padding-left:545px}.est-row-lvl-38 td:first-child{padding-left:560px}.est-row-lvl-39 td:first-child{padding-left:575px}.est-row-lvl-40 td:first-child{padding-left:590px}.est-row-lvl-41 td:first-child{padding-left:605px}.est-row-lvl-42 td:first-child{padding-left:620px}.est-row-lvl-43 td:first-child{padding-left:635px}.est-row-lvl-44 td:first-child{padding-left:650px}.est-row-lvl-45 td:first-child{padding-left:665px}.est-row-lvl-46 td:first-child{padding-left:680px}.est-row-lvl-47 td:first-child{padding-left:695px}.est-row-lvl-48 td:first-child{padding-left:710px}.est-row-lvl-49 td:first-child{padding-left:725px}.est-row-lvl-50 td:first-child{padding-left:740px}.est-row-lvl-51 td:first-child{padding-left:755px}.est-row-lvl-52 td:first-child{padding-left:770px}.est-row-lvl-53 td:first-child{padding-left:785px}.est-row-lvl-54 td:first-child{padding-left:800px}.est-row-lvl-55 td:first-child{padding-left:815px}.est-row-lvl-56 td:first-child{padding-left:830px}.est-row-lvl-57 td:first-child{padding-left:845px}.est-row-lvl-58 td:first-child{padding-left:860px}.est-row-lvl-59 td:first-child{padding-left:875px}.est-row-lvl-60 td:first-child{padding-left:890px}.est-row-lvl-61 td:first-child{padding-left:905px}.est-row-lvl-62 td:first-child{padding-left:920px}.est-row-lvl-63 td:first-child{padding-left:935px}.est-row-lvl-64 td:first-child{padding-left:950px}.est-row-lvl-65 td:first-child{padding-left:965px}.est-row-lvl-66 td:first-child{padding-left:980px}.est-row-lvl-67 td:first-child{padding-left:995px}.est-row-lvl-68 td:first-child{padding-left:1010px}.est-row-lvl-69 td:first-child{padding-left:1025px}.est-row-lvl-70 td:first-child{padding-left:1040px}.est-row-lvl-71 td:first-child{padding-left:1055px}.est-row-lvl-72 td:first-child{padding-left:1070px}.est-row-lvl-73 td:first-child{padding-left:1085px}.est-row-lvl-74 td:first-child{padding-left:1100px}.est-row-lvl-75 td:first-child{padding-left:1115px}.est-row-lvl-76 td:first-child{padding-left:1130px}.est-row-lvl-77 td:first-child{padding-left:1145px}.est-row-lvl-78 td:first-child{padding-left:1160px}.est-row-lvl-79 td:first-child{padding-left:1175px}.est-row-lvl-80 td:first-child{padding-left:1190px}.est-row-lvl-81 td:first-child{padding-left:1205px}.est-row-lvl-82 td:first-child{padding-left:1220px}.est-row-lvl-83 td:first-child{padding-left:1235px}.est-row-lvl-84 td:first-child{padding-left:1250px}.est-row-lvl-85 td:first-child{padding-left:1265px}.est-row-lvl-86 td:first-child{padding-left:1280px}.est-row-lvl-87 td:first-child{padding-left:1295px}.est-row-lvl-88 td:first-child{padding-left:1310px}.est-row-lvl-89 td:first-child{padding-left:1325px}.est-row-lvl-90 td:first-child{padding-left:1340px}.est-row-lvl-91 td:first-child{padding-left:1355px}.est-row-lvl-92 td:first-child{padding-left:1370px}.est-row-lvl-93 td:first-child{padding-left:1385px}.est-row-lvl-94 td:first-child{padding-left:1400px}.est-row-lvl-95 td:first-child{padding-left:1415px}.est-row-lvl-96 td:first-child{padding-left:1430px}.est-row-lvl-97 td:first-child{padding-left:1445px}.est-row-lvl-98 td:first-child{padding-left:1460px}.est-row-lvl-99 td:first-child{padding-left:1475px}.est-relative{position:relative}.est-top-pager{position:absolute;right:0;top:5px}.est-top-allselect{position:absolute;left:0;top:5px;font-weight:700}.est-padding-10{padding:10px!important}.est-margin-right-50{margin-right:50px}.est-margin-left-50{margin-left:50px}.est-quick-unpin{color:#000;margin-left:8px;font-size:14px;transform:rotate(45deg)}.est-page-sel{color:#000;margin-left:3px;margin-right:3px;padding:0 5px;font-size:inherit;border:none;border-radius:15px}.est-page-prev,.est-page-next{color:#000;padding:2px 0 0;font-size:inherit}.est-pinned-header{background-color:#fff;left:0;top:0;position:sticky;z-index:1;border-bottom:1px solid #dee2e6!important;padding:0!important}.est-simple-border-bottom{border-bottom:1px solid #dee2e6}.est-pinned-internal-header{border-top:0;border-bottom:0px solid #dee2e6}.est-pinned-border{border-right:2px solid #dee2e6!important}.est-cell-padding{padding:.3rem}.est-pinned-body{background-color:#fff;left:0;position:sticky;z-index:1;border-top:1px solid #dee2e6!important;padding:0!important}.est-inline{display:inline!important}.est-inline-block{display:inline-block!important}.est-link{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block}.est-link:hover{color:#23527c!important;cursor:pointer;text-decoration:underline!important}.est-sticky-last-column{right:-1px;position:sticky;z-index:0;background-color:#fff}.est-sticky-last-column-alt{right:-1px;position:sticky;z-index:0;background-color:#f2f2f2}.est-ltab-border{border-left:2px solid #bbb}.est-rtab-border{border-right:2px solid #bbb}.est-cell-group-padding{padding:calc(.3rem + 1px);position:absolute;top:0;left:0;height:100%;width:100%}.est-margin-bottom-10{margin-bottom:10px}.est-text-center{text-align:center}.est-flex{display:flex}.est-rg-sep-flex-right{display:flex;flex-direction:row-reverse;width:100%;margin:-5px}.est-rg-sep-flex-left{display:flex;flex-direction:row;width:100%;margin:-5px}.est-rg-hdr{font-weight:700}.est-rg-agg{font-style:italic}.est-rg{background-color:#7777!important}.est-rg-sep{font-size:12px;padding-right:20px!important;background-color:#bbbb!important}.est-rg-ipp{text-align:left;display:inline-flex;margin-right:25px}.est-rg-page{text-align:right;display:inline-flex;font-size:inherit;padding-top:5px}.est-droplist.cdk-drag-placeholder{opacity:0}.est-droplist.cdk-drag-preview{z-index:999999999!important;opacity:1;box-sizing:border-box;border-radius:4px;background-color:#fff;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.est-droplist.cdk-drag-preview td:not(.drag-visible){visibility:hidden}.est-droplist.cdk-drag-preview td.drag-visible{padding-top:3px}.est-droplist.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.est-droplist.cdk-drop-list-dragging .est-dropbox:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"] }]
+            args: [{ selector: 'es-table', viewProviders: [{ provide: LocalizationService, useClass: EsTableLoc }], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<!-- Patacchino di autoaggiornamento -->\r\n<div class=\"w-100\" *ngIf=\"AutoUpdate\">\r\n    <div class=\"pull-right\">\r\n        {{'Update every' | localize : lc}}&nbsp;<input [readonly]=\"autoUpdate\" maxlength=\"3\" class=\"form-control est-custom-input\" type=\"text\" [(ngModel)]=\"seconds\" />&nbsp;{{'second/s' | localize : lc}}\r\n    </div>\r\n    <div class=\"pull-right m-t-2\">\r\n        <label class=\"est-switch\">\r\n            <input type=\"checkbox\" [(ngModel)]=\"autoUpdate\" (ngModelChange)=\"autoUpdateChanged();\" />\r\n            <div class=\"est-slider round\"></div>\r\n        </label>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<div *ngIf=\"View\" class=\"est-relative\">\r\n    <div *ngIf=\"FirstBind && ShowLoadingOnBootstrap\" class=\"est-loading-box\">\r\n        <div class=\"est-loading-content\">\r\n            <span class=\"fa fa-spinner fa-spin\"></span>&nbsp;{{'Performing Table bootstrap' | localize: lc}}...\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"est-top-pager\" *ngIf=\"PagingStyle == 'both' || PagingStyle == 'top'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"est-top-allselect\" *ngIf=\"canSelectAll || (!reportMode && (View?.selection || arraymodeSelection)?.all)\">\r\n        <span>{{ (selectedObjects == -1 ? ('All the' | localize : lc) : ((selectedObjects || 0) | number : '0.0-0' : locale)) + ' ' + ((selectedObjects == 1 ? 'Object Selected' : 'Objects Selected') | localize : lc) }}</span>&nbsp;\r\n        <span class=\"est-link est-inline\" (click)=\"selection_H.selectAllOrResetSelection()\">{{ (View?.selection || arraymodeSelection)?.all ? ('Reset Selection' | localize : lc) : ('Select Everything' | localize : lc)}}</span>\r\n    </div>\r\n\r\n    <div class=\"table-responsive datatable {{ContainerClass}}\" [style.max-height.px]=\"MaxHeight\">\r\n        <table class=\"{{ TableClass }} est-margin-bottom-10 est\"  [class.est-high-density]=\"HighCellDensity\">\r\n            <thead [hidden]=\"HeaderHidden || FirstBind\">\r\n                <!-- Aggiungo il pezzo che gestisce la selezione di tutto se attivo da config -->\r\n                <tr *ngIf=\"SelectAll || PagingStyle != 'bottom'\">\r\n                    <th class=\"est-no-selection\" [attr.colspan]=\"Columns.Global\" [class.est-hidden-view]=\"!canSelectAll && (reportMode || !(View?.selection || arraymodeSelection)?.all) && PagingStyle == 'bottom'\">\r\n                        <p class=\"est-hidden-view app-margin-bottom-0\">\u00A7</p>\r\n                    </th>\r\n                </tr>\r\n\r\n                <!-- Blocco header group -->\r\n                <ng-container *ngIf=\"RowThGroups\">\r\n                    <tr *ngFor=\"let level of RowThGroups\">\r\n                        <th *ngFor=\"let cell of level\" [attr.colspan]=\"cell.Span\" \r\n                            [class.est-pinned-header]=\"cell.Pinned\" [class.est-col-min]=\"cell.Pinned\"\r\n                            [class.est-ltab-border]=\"cell.Borders\" [class.est-rtab-border]=\"cell.Borders\"\r\n                            class=\"est-text-center\">\r\n                            <ng-container *ngIf=\"cell.Pinned;\">\r\n                                <div class=\"est-pinned-border est-cell-group-padding\"></div>\r\n                            </ng-container>\r\n                            <ng-container *ngIf=\"!cell.Pinned && cell.Content; Else: cell.Template\">\r\n                                {{cell.Content}}\r\n                            </ng-container>\r\n                        </th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!RowThGroups\">\r\n                    <tr *ngIf=\"HasHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"headerGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n    \r\n                    <!-- Blocco header group secondario -->\r\n                    <tr *ngIf=\"HasSecondaryHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"secondaryHeaderGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <!-- Blocco effettivo degli header -->\r\n                <tr>\r\n                    <!-- Aggiungo una checkbox se la selezione \u00E8 attiva -->\r\n                    <th class=\"est-col-min\" *ngIf=\"Selection && !HasPinnedColumns\">\r\n                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                    </th>\r\n\r\n                    <!-- Header che valgono per view mode e array mode -->\r\n                    <ng-container *ngIf=\"(viewMode || arrayMode)\">\r\n\r\n                        <!-- In una tabella base prendo semplicemente i th scritti dall'utente nell'HTML -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs) && !DynamicRowColumnsDefinition\">\r\n                            <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se ho un modello dinamico dell'oggetto creo le colonne in base alle propriet\u00E0 -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs) && DynamicRowColumnsDefinition\">\r\n                            <th *ngFor=\"let operation of DynamicOperations\" class=\"est-col-min est-no-side-padding\"></th>\r\n                            \r\n                            <ng-container *ngFor=\"let rowHeader of DynamicRowColumnsDefinition\">\r\n                                <ng-container *ngIf=\"rowHeader.visible\">\r\n                                    <th *ngIf=\"OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"thOrderChanged(rowHeader.propertyName, $event)\">{{rowHeader.description}}</th>\r\n                                    <th *ngIf=\"!OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\">{{rowHeader.description}}</th>\r\n                                </ng-container>\r\n                            </ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se non ho un modello dinamico ma invece delle celle custom, genero gli header in base ai row th -->\r\n                        <ng-container *ngIf=\"UseCustomCells && RowTHs\">\r\n                            <th *ngIf=\"HasPinnedColumns\" class=\"est-pinned-header est-col-min\">\r\n                                <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-simple-border-bottom\">\r\n                                    <th class=\"est-col-min est-no-border\" *ngIf=\"Selection\" [style.width.px]=\"20\">\r\n                                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                                    </th>\r\n                                    <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n                                        <th *ngIf=\"rowHeader && rowHeader.Visible && rowHeader.Pinned\" [style.width.px]=\"rowHeader.PinnedWidth\" es-th=\"{{rowHeader.ID}}\" \r\n                                            class=\"{{rowHeader.Class || ''}}\" \r\n                                            [class.est-pinned-internal-header]=\"true\" \r\n                                            [class.est-no-border]=\"true\" \r\n                                            [class.est-nowrap]=\"!rowHeader.Wrap\" \r\n                                            [Pinned]=\"true\" [Fixed]=\"rowHeader.Fixed\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onUnpinning)=\"columnMetadata_H.unpinColumn($event)\" (onOrderChange)=\"OrderByColumn && thOrderChanged(rowHeader.ID, $event)\">\r\n                                            <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null } \"></ng-container></ng-container>\r\n                                            <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                        </th>\r\n                                    </ng-container>\r\n                                </div>\r\n                            </th>\r\n                            <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n                                <th *ngIf=\"rowHeader && rowHeader.Visible && !rowHeader.Pinned\" es-th=\"{{rowHeader.ID}}\" class=\"{{rowHeader.Class || ''}}\" [class.est-ltab-border]=\"rowHeader.LeftBorder\" [class.est-rtab-border]=\"rowHeader.RightBorder\" [class.est-nowrap]=\"!rowHeader.Wrap\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"OrderByColumn && thOrderChanged(rowHeader.ID, $event)\">\r\n                                    <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null }\"></ng-container></ng-container>\r\n                                    <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                </th>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </ng-container>\r\n\r\n                    <!--Casistica in cui ho il setup proveniente da un report. Gli header sono definiti da come \u00E8 fatto il report-->\r\n                    <ng-container *ngIf=\"reportMode\">\r\n                        <th [style.color]=\"clm.color\" *ngFor=\"let clm of ReportValues.columns\" class=\"est-no-selection est-pointer est-nowrap\" (click)=\"reportMode_H.setupNextOrderAndSearch(clm)\">\r\n                            {{clm.description}}<span class=\"fa\" [class.fa-chevron-down]=\"clm.order == 'DESC'\" [class.fa-chevron-up]=\"clm.order == 'ASC'\"></span>\r\n                        </th>\r\n                    </ng-container>\r\n\r\n                    <!--Per l'eliminazione mi serve un header aggiuntivo-->\r\n                    <th *ngIf=\"Removal\" [class.est-right-9]=\"Export || HiddenColumns\" class=\"est-col-min est-sticky-last-column\"><span class=\"fa fa-trash\"></span></th>\r\n\r\n                    <!--Per l'esportazione mi serve l'header extra da cui faccio uscire i 3 pallocchi-->\r\n                    <th *ngIf=\"Export || HiddenColumns || ColumnsOrdering || CornerMenuOptions\" class=\"est-table-dotted-menu est-sticky-last-column est-col-min text-sm-center\">\r\n                        \r\n                        <!-- Link nascosto che serve a scaricare il file -->\r\n                        <a *ngIf=\"headers\" hidden #exportDownloader csvLink [data]=\"data\" [headers]=\"headers\" [delimiter]=\"';'\" [filename]=\"ExportFileName.endsWith('.xlsx') ? ExportFileName.replace('.xlsx', '.csv') : ExportFileName.endsWith('.csv') ? ExportFileName : ExportFileName + '.csv'\"></a>\r\n\r\n                        <!-- Blocco con i 3 pallocchi che tira fuori il context menu delle operazioni -->\r\n                        <div class=\"btn-group\" container=\"body\" placement=\"bottom right\" dropdown #dropdown=\"bs-dropdown\" [autoClose]=\"true\">\r\n                            <span dropdownToggle class=\"fa fa-ellipsis-v est-fs-18 est-pointer est-padding-3\"></span>\r\n\r\n                            <div *dropdownMenu class=\"dropdown-menu dropdown-menu-right est-bring-to-front-strong\">\r\n                                <div class=\"est-pointer\">\r\n                                    <a class=\"dropdown-item\" *ngIf=\"HiddenColumns || ColumnsOrdering\" (click)=\"columnMetadata_H.resetColumnVisSelection(); changeColumnVisibilityModal.show();\">\r\n                                        <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                                            {{'Columns Visibility' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Visibility and Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                    </a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && CSVExport\" (click)=\"export_H.tryExport('CSV')\">{{'Export View' | localize : lc}} (CSV)</a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && XLSXExport\" (click)=\"export_H.tryExport('XLSX')\">{{'Export View' | localize : lc}} (XLSX)</a>\r\n                                    <a class=\"dropdown-item\" *ngFor=\"let option of CornerMenuOptions\" (click)=\"cornerActionClicked(option.id)\">{{option.description}}</a>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </th>\r\n                </tr>\r\n            </thead>\r\n            \r\n            <!-- Valido per modalit\u00E0 View o Array. Se sono in report mode il body \u00E8 creato in altro modo -->\r\n            <tbody [hidden]=\"BodyHidden || FirstBind\" *ngIf=\"(arrayMode || viewMode)\">\r\n                <!--Con selection attiva richiamo il template che gestisce il context menu-->\r\n                <ng-container *ngIf=\"Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBodySelection; context: { $implicit: { selDisabled: arrayMode ? false : SelectionDisabled, sel: Selection }}\"></ng-container>\r\n                </ng-container>\r\n\r\n                <!--Senza selection richiamo il template che NON gestisce il context menu-->\r\n                <ng-container *ngIf=\"!Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBody\"></ng-container>\r\n                </ng-container>\r\n            </tbody>\r\n\r\n            <!-- Per la modalit\u00E0 a report c'\u00E8 un body particolare semi-dinamico -->\r\n            <tbody [hidden]=\"BodyHidden\" *ngIf=\"reportMode\">\r\n                <tr *ngFor=\"let row of ReportValues.rows; let even = even;\">\r\n                    <td class=\"est-nowrap\" *ngFor=\"let val of row.values\">{{val}}</td>\r\n                    <td class=\"est-sticky-last-column{{even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n                </tr>\r\n            </tbody>\r\n        </table>\r\n    </div>\r\n\r\n    <div *ngIf=\"PagingStyle == 'both' || PagingStyle == 'bottom'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n</div>\r\n\r\n<!-- Template che contiene tutte le info di paginazione in modo da poterlo replicare anche sopra -->\r\n<ng-template #pagingElement>\r\n    <ng-container *ngIf=\"!FirstBind\">\r\n        <!-- Pulsanti avanti-indietro di paginazione -->\r\n        <div *ngIf=\"PagerOptions.ShowPaging && PagerOptions.ShowButtons && (PagerOptions.PagerCount > 10 || PagerOptions.PagerCount == -1)\" class=\"pull-right btn-toolbar\">\r\n            <ng-container *ngIf=\"(!reportMode || View?.pagingavailable) && (!arrayMode || SearchView)\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: addToPage.bind(this), GTP: goToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"arrayMode && UseArrayModePaging && !SearchView\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: arrayAddToPage.bind(this), GTP: arrayGoToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n        <!-- Paginatore dove appare la count e le opzioni di paginazione -->\r\n        <div class=\"pull-right\" *ngIf=\"PagerOptions.ShowCount || PagerOptions.ShowPagingOptions\">\r\n            <div class=\"est-mt-min-5\" *ngIf=\"PagerOptions.ShowPaging\">\r\n                <app-paging *ngIf=\"!PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [WarnOnAll]=\"false\" [CurrentPageSize]=\"ArraymodeItemsPerPage\" (pagingSelected)=\"items_H.refreshPaging($event)\"></app-paging>\r\n                <app-paging *ngIf=\"PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [GroupMode]=\"PagerOptions.Searches == 'groups'\" [AllSearch]=\"AllSearch\" [View]=\"PagerOptions.View\" (pagingSelected)=\"onItemsPerPageChanged($event);\"></app-paging>\r\n            </div>\r\n            <div *ngIf=\"reportMode && !PagerOptions.ShowPaging\"><em>{{'Paging options are not available for this report' | localize: lc}}</em></div>\r\n        </div>\r\n        <div class=\"clearfix\"></div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Template che contiene i pulsanti per cambiare pagina -->\r\n<ng-template #pagingButtons let-options>\r\n    <div class=\"est-flex\" [class.est-margin-left-50]=\"options.Margin\">\r\n        <a class=\"btn\" class=\"est-page-prev app-pointer\" (click)=\"options.ATP(-1, options.separator)\"><span class=\"fa fa-chevron-left\"></span></a>\r\n        <div *ngIf=\"options.Array\" class=\"est-inline\"><a *ngFor=\"let p of options.Array\" class=\"btn est-page-sel {{p.cssClass}}\" (click)=\"options.GTP(p.val, options.separator)\">{{p.val}}</a></div>\r\n        <a class=\"btn\" class=\"est-page-next app-pointer\" (click)=\"options.ATP(1, options.separator)\"><span class=\"fa fa-chevron-right\"></span></a>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Questi due template rappresentano effettivamente il body della tabella. essendo il tr l'unica cosa che davvero cambia, il resto \u00E8 templatizzato -->\r\n<ng-template #TBodySelection let-templateOptions>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even; let i=index; trackBy: bodyTrackBy\">\r\n        <tr *ngIf=\"item._visible || (!Hierarchy && !ArrayGrouping)\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\" \r\n            [class.est-pointer]=\"!item.locked\" \r\n            [class.est-white-selected]=\"item._selected && !item.locked\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            [contextMenu]=\"!item.locked ? (ContextMenu || emptyMenu) : emptyMenu\" [contextMenuSubject]=\"item\"\r\n            (click)=\"!UseCustomCells && handleRowClick($event, item, true)\">\r\n\r\n            <td *ngIf=\"!item.locked && !item._sep && !HasPinnedColumns\">\r\n                <input  type=\"checkbox\" \r\n                        [disabled]=\"templateOptions.selDisabled\" \r\n                        [class.est-pointer]=\"!item.locked\"\r\n                        [(ngModel)]=\"item._selected\" name=\"check{{i}}\" \r\n                        (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n            </td>\r\n            <td *ngIf=\"(item.locked || item._sep) && !HasPinnedColumns\"></td>\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container> </ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item, templateOptions: templateOptions }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #TBody>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even;\">\r\n        <tr *ngIf=\"item._visible || !Hierarchy\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            (click)=\"!UseCustomCells && handleRowClick($event, item, false)\">\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container></ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #groupPager let-item>\r\n    <td class=\"est-pinned-body \" *ngIf=\"HasPinnedColumns\"><div class=\"est-pinned-border est-cell-group-padding\"></div></td>\r\n    <td *ngIf=\"item._grouplevel > 1\" [attr.colspan]=\"item._grouplevel-1\"></td>\r\n    <td [attr.colspan]=\"Columns.VisibleUnpinned - (item._grouplevel > 0 ? item._grouplevel - 1 : 0)\">\r\n        <div class=\"est-rg-sep-flex-right\" *ngIf=\"RowGroupingPagingStyle == 'right'\">\r\n            <div class=\"est-rg-page\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n            <div class=\"est-rg-ipp\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><app-paging [CountLabel]=\"CountLabel\" [AllSearch]=\"AllSearch\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n        </div>\r\n\r\n        <div class=\"est-rg-sep-flex-left\" *ngIf=\"RowGroupingPagingStyle == 'left'\">\r\n            <div class=\"est-rg-ipp\"><app-paging [AllSearch]=\"AllSearch\" [CountLabel]=\"CountLabel\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n            <div class=\"est-rg-page\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n        </div>\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle semplici, con header e body scritti a manazza -->\r\n<ng-template #basicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || !RowTDs) && !DynamicRowColumnsDefinition\">\r\n        <ng-container *ngTemplateOutlet=\"bodyRef; context : {$implicit: item}\"></ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle definite in maniera dinamica dal modello -->\r\n<ng-template #dynamicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || !RowTDs) && DynamicRowColumnsDefinition\">\r\n        <ng-container *ngFor=\"let operation of DynamicOperations; let first = first; let last = last;\">\r\n            <ng-container *ngIf=\"!operation.conditionField || (item.properties[operation.conditionField] == operation.conditionValue)\">\r\n                <td [class.est-no-right-padding]=\"last\" [class.est-no-left-padding]=\"!first\" class=\"est-col-min\"><span title=\"{{operation.title}}\" class=\"{{operation.iconClass}} est-pointer\" (click)=\"dynamicOperation(item, operation.id)\">{{operation.text}}</span></td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"operation.conditionField && (item.properties[operation.conditionField] != operation.conditionValue)\">\r\n                <td class=\"est-col-min est-no-side-padding\"></td>\r\n            </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngFor=\"let rowItem of DynamicRowColumnsDefinition\">\r\n            <ng-container *ngIf=\"rowItem.routePath && rowItem.visible\">\r\n                <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n                    <a [routerLink]=\"dynamicMode_H.generateRouterLink(rowItem.routePath, rowItem.routeParameterProperties, item)\" class=\"est-link\" [innerHTML]=\"item.properties[rowItem.propertyName]\"></a>\r\n                </td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!rowItem.routePath && rowItem.visible\">\r\n                <ng-container *ngTemplateOutlet=\"findEsTd(rowItem.propertyName) || defaultEsTd; context: { $implicit: item.properties[rowItem.propertyName], rowItem : rowItem, item : item }\"> </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #defaultEsTd let-value let-rowItem='rowItem' let-item='item'>\r\n    <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n        {{value}}\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale delle celle custom se configurate -->\r\n<ng-template #customCells let-item let-opt=\"templateOptions\">\r\n    <ng-container *ngIf=\"UseCustomCells && RowTDs\">\r\n\r\n        <td *ngIf=\"HasPinnedColumns\" class=\"est-pinned-body est-col-min\" [class.est-white-selected]=\"item._selected\">\r\n            <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border\">\r\n                <td *ngIf=\"!item.locked && !item._sep && Selection\" class=\"est-no-border est-col-min\" [style.width.px]=\"20\">\r\n                    <input type=\"checkbox\" [disabled]=\"opt.selDisabled\" [class.est-pointer]=\"!item.locked\" [(ngModel)]=\"item._selected\" name=\"check{{item._hash}}\" (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n                </td>\r\n                <td class=\"est-no-border est-col-min\" *ngIf=\"(item.locked || item._sep) && Selection\" [style.width.px]=\"20\"></td>\r\n\r\n                <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n                    <td *ngIf=\"rowItem && rowItem.Pinned\" [style.width.px]=\"rowItem.PinnedWidth\" es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-no-selection]=\"rowItem.UserEdits\" [class.est-no-border]=\"true\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\" (click)=\"dbClickEditOrSingleClickRowSelection($event, rowItem, item)\">\r\n\r\n                        <div [class.est-edit-hidden]=\"rowItem._editing\" class=\"est-pre\">\r\n                            <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: rowItem.Multi ? (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) : item }\"></ng-container></ng-container>\r\n                            <ng-container *ngIf=\"!rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: rowItem.Multi ? (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) : item }\"></ng-container></ng-container>\r\n                            <span *ngIf=\"rowItem.Multi\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) }\"></ng-container></span>\r\n                            <span *ngIf=\"!rowItem.Template && !rowItem.Multi\">{{rowItem.Content}}</span>\r\n                        </div>\r\n                        \r\n                        <div *ngIf=\"rowItem._editing\" class=\"est-mt-min-5\">\r\n                            <form-adaptive [FormLayout]=\"false\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"item[rowItem.UserEdits.Property]\" name=\"{{ rowItem.UserEdits.Property + '_' + item._hash }}\" [Type]=\"rowItem.UserEdits.Type\" (inputChange)=\"finalizeUserEdit(rowItem, item)\" (inputFocus)=\"$event.stopPropagation();\" ></form-adaptive>\r\n                        </div>\r\n                    </td>\r\n                </ng-container>\r\n            </div>\r\n        </td>\r\n\r\n        <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n            <ng-container *ngIf=\"rowItem && !rowItem.Pinned\">\r\n\r\n                <!-- Casistica senza bodyRef, quindi con direttive per i td -->\r\n                <ng-container *ngIf=\"!bodyRef && rowItem.Visible\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-ltab-border]=\"rowItem.LeftBorder\" [class.est-rtab-border]=\"rowItem.RightBorder\" [class.est-no-selection]=\"rowItem.UserEdits\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\" (click)=\"dbClickEditOrSingleClickRowSelection($event, rowItem, item)\">\r\n\r\n                        <div [class.est-edit-hidden]=\"rowItem._editing\" class=\"est-pre\">\r\n                            <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container></ng-container>\r\n                            <ng-container *ngIf=\"!rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container></ng-container>\r\n                            <span *ngIf=\"rowItem.Multi\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) }\"></ng-container></span>\r\n                            <span *ngIf=\"!rowItem.Template && !rowItem.Multi\">{{rowItem.Content}}</span>\r\n                        </div>\r\n\r\n                        <div *ngIf=\"rowItem._editing\" class=\"est-mt-min-5\" #input>\r\n                            <form-adaptive [FormLayout]=\"false\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"item[rowItem.UserEdits.Property]\" name=\"{{ rowItem.UserEdits.Property + '_' + item._hash }}\" [Type]=\"rowItem.UserEdits.Type\" (inputFinalized)=\"finalizeUserEdit(rowItem, item)\"></form-adaptive>\r\n                        </div>\r\n\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <a [routerLink]='rowItem.RouterLink' class=\"est-link\" [innerHTML]=\"rowItem.Content\"></a>\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (NON RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"!rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"rowItem.Template\">\r\n                            <ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <span *ngIf=\"!rowItem.Template\" [innerHTML]=\"rowItem.Content\"></span>\r\n                    </td>\r\n                </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #HierarchyNavigator let-item>\r\n    <span *ngIf=\"!item.parent\" class=\"fa fa-chevron-down\" style=\"visibility:hidden\"></span>\r\n    <span *ngIf=\"item.parent && item._expanded\" class=\"fa fa-chevron-down est-pointer est-no-selection\" (click)=\"hierarchyMode_H.collapseParent(item[this.OwnKey])\"></span>\r\n    <span *ngIf=\"item.parent && !item._expanded\" class=\"fa fa-chevron-up est-pointer est-no-selection\" (click)=\"hierarchyMode_H.expandParent(item[this.OwnKey])\"></span>\r\n    &nbsp;\r\n</ng-template>\r\n\r\n<!-- Questo template contiene i pulsanti di eliminazione/undo eliminazione ed esportazione che vanno in fondo ad un record edlla tabella -->\r\n<ng-template #bodyDeleteAndExport let-options>\r\n    <ng-container *ngIf=\"Removal && !RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted)\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted)\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"Removal && RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!options.item[RemovalCondition]\"><span class=\"fa fa-remove est-hidden-view\"></span></td>\r\n    </ng-container>\r\n    <td *ngIf=\"Export || HiddenColumns || CornerMenuOptions\" class=\"est-sticky-last-column{{options.even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n</ng-template>\r\n\r\n<!-- Context menu vuoto default per tutte le tabella che non ce l'hanno, in modo che al click destro appaia \"nessuna op disponibile\" -->\r\n<context-menu #emptyMenu>\r\n    <ng-template contextMenuItem>\r\n        <span>\r\n            <em>{{'No operations available' | localize : lc}}...</em>\r\n        </span>\r\n    </ng-template>\r\n</context-menu>\r\n\r\n<!-- Modal per cambiare posizione e visibilit\u00E0 delle colonne dell'es-table -->\r\n<div bsModal #changeColumnVisibilityModal=\"bs-modal\" class=\"modal fade\" role=\"dialog\" aria-hidden=\"true\">\r\n    <div class=\"modal-dialog modal-lg\" cdkDrag>\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header est-pointer\" cdkDragHandle>\r\n                <h5 class=\"modal-title pull-left\">\r\n                    <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Order' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                        {{'Columns Visibility' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Visibility and Order' | localize : lc}}\r\n                    </ng-container>\r\n                </h5>\r\n                <button type=\"button\" class=\"close pull-right\" (click)=\"changeColumnVisibilityModal.hide();\" aria-label=\"Close\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div *ngIf=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"card card-info est-padding-10 est-margin-bottom-0\">\r\n                    {{'There are no columns configured to be hidden/shown in this view' | localize : lc}}\r\n                </div>\r\n                <div *ngIf=\"TMPColumnsList && TMPColumnsList.length > 0\" style=\"max-height:500px; overflow-y:auto\">\r\n                    <!--Aaaaaaah la tristezza... qui mi servirebbe l'es-table per facilitare la selezione multipla ecc... peccato che se la linko qui entro in un loop impressionante-->\r\n                    <table class=\"table table-striped table-sm est-margin-bottom-0\">\r\n                        <thead>\r\n                            <tr>\r\n                                <th class=\"est-col-min\" *ngIf=\"HiddenColumns\">\r\n                                    <input class=\"est-pointer\" type=\"checkbox\" [(ngModel)]=\"globalColVisCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"columnMetadata_H.globalColVisCheckChanged();\">\r\n                                </th>\r\n                                <!-- <th class=\"est-col-min\" *ngIf=\"ColumnsOrdering\"></th> -->\r\n                                <th class=\"est-col-min est-nowrap\">{{'Column Name' | localize : lc}}</th>\r\n                                <!--Filler-->\r\n                                <th></th>\r\n                                <!-- Pinner -->\r\n                                <th *ngIf=\"DirectivesBased\" class=\"est-col-min\"></th>\r\n                            </tr>\r\n                        </thead>\r\n                        <tbody \r\n                            cdkDropList \r\n                            [cdkDropListData]=\"TMPColumnsList\" \r\n                            (cdkDropListDropped)=\"columnMetadata_H.columnReordered($event)\" \r\n                            [cdkDropListSortPredicate]=\"columnMetadata_H.sortPredicate.bind(this.columnMetadata_H)\"\r\n                            class=\"est-dropbox\">\r\n\r\n                            <tr *ngFor=\"let item of TMPColumnsList; let i = index; let last = last\" \r\n                                class=\"est-pointer est-droplist\" \r\n                                [class.est-white-selected]=\"lastSelectedItemID == item.id\" \r\n                                [class.est-no-selection]=\"!item.visible\"\r\n                                cdkDrag\r\n                                [cdkDragData]=\"item\"\r\n                                [cdkDragDisabled]=\"!ColumnsOrdering || item.fixed || item.pinned\">\r\n\r\n                                <td *ngIf=\"HiddenColumns\">\r\n                                    <input type=\"checkbox\" [class.est-hidden-view]=\"item.fixed\" class=\"est-pointer\" [(ngModel)]=\"item.visible\" name=\"visible{{i}}\" (ngModelChange)=\"columnMetadata_H.updateGlobalColVisCheck();\" />\r\n                                </td>\r\n                                <td class=\"est-nowrap drag-visible\" (click)=\"columnMetadata_H.columnClicked(item);\">\r\n                                    <ng-container *ngIf=\"item.template\">\r\n                                        <!-- Padri -->\r\n                                        <span *ngIf=\"item.parentTemplates && item.parentTemplates.length > 0\" class=\"est-fw-bold est-fs-13\">\r\n                                            (&nbsp;\r\n                                            <ng-container *ngFor=\"let parent of item.parentTemplates; let last=last\">\r\n                                                <ng-container *ngIf=\"parent.tmpl\"><ng-container *ngTemplateOutlet=\"parent.tmpl\"></ng-container></ng-container>\r\n                                                <ng-container *ngIf=\"parent.content\">{{parent.content}}</ng-container>\r\n                                                <span *ngIf=\"!last\">&nbsp;-&nbsp;</span>\r\n                                            </ng-container>\r\n                                            &nbsp;)\r\n                                        </span>\r\n                                        <!-- Template header originale -->\r\n                                        <ng-container *ngTemplateOutlet=\"item.template; context: { $implicit: item.multi ? item.multiContent : null }\"></ng-container>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"!item.template\">{{item.description}}</ng-container>\r\n                                </td>\r\n                                <!--Filler-->\r\n                                <td (click)=\"columnMetadata_H.columnClicked(item);\"></td>\r\n                                <!-- Pinner -->\r\n                                <td *ngIf=\"DirectivesBased && ColumnsPinnable\"><span *ngIf=\"!item.fixed && item.pinnable\" class=\"fa fa-thumb-tack\" [class.text-success]=\"item.pinned\" (click)=\"columnMetadata_H.pinOrUnpinColumn(item)\"></span></td>\r\n                            </tr>\r\n                        </tbody>\r\n                    </table>\r\n                </div>\r\n            </div>\r\n            <div class=\"modal-footer\">\r\n                <button type=\"button\" class=\"btn btn-secondary est-margin-right-10\" (click)=\"lastSelectedItemID = null; changeColumnVisibilityModal.hide();\">{{'Close' | localize : lc}}</button>\r\n                <button type=\"button\" [disabled]=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"btn btn-primary\" (click)=\"columnMetadata_H.confirmColumnVisibilitySelection() && changeColumnVisibilityModal.hide()\">{{'Confirm' | localize : lc}}</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".est-loading-box{height:200px;text-align:center;position:relative;background:#ccc}.est-loading-content{margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:35px}.est-scrollable{max-height:600px;overflow:auto}.est-head-resizer{top:0;right:0;bottom:0;width:7px;position:absolute;cursor:col-resize}.est-head-resizer-internal{top:0;right:0px;left:6px;bottom:0;width:1px;position:absolute;background-color:#ccc;height:100%}.est-pointer{cursor:pointer}.est-high-density th,.est-high-density td{padding:0;padding-left:.2rem;padding-right:.2rem}.est-no-selection{-webkit-user-select:none;-moz-user-select:none;-khtml-user-select:none;-ms-user-select:none}.est-edit-hidden{visibility:hidden;height:1px!important}.est-hidden-view{visibility:hidden}.est-no-border{border:none!important}.est-nowrap{white-space:nowrap}.est-mt-min-5{margin-top:-5px}.est-white-selected{background-color:#ddd!important}.est-line-through{text-decoration:line-through}.est-no-side-padding{padding-left:0;padding-right:0}.est-no-left-padding,.est-no-right-padding{padding-left:0}.est-col-min{width:1px}.est-margin-bottom-0{margin-bottom:0!important}.est-margin-right-10{margin-right:10px!important}.est-right-9{right:9px!important}.est-table-dotted-menu{padding:0 0 2px!important;color:#999}.est-fs-18{font-size:18px}.est-fs-14,.est-fs-13{font-size:14px}.est-fw-bold{font-weight:700}.est-padding-3{padding:3px!important}.est-page-container{position:relative}.est-bring-to-front-strong{z-index:99999999!important}.est-switch{position:relative;display:inline-block;width:30px;height:17px;margin-bottom:0;margin-right:5px;margin-left:5px}.est-switch input{display:none}.est-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}.est-slider:before{position:absolute;content:\"\";height:13px;width:13px;left:3px;bottom:2px;background-color:#fff;transition:.4s}input:checked+.est-slider{background-color:#2196f3}input:focus+.est-slider{box-shadow:0 0 1px #2196f3}input:checked+.est-slider:before{transform:translate(11px)}.est-slider.round{border-radius:10px}.est-slider.round:before{border-radius:50%}.est-custom-input{width:30px;display:inline;padding:1px;height:20px}.est-row-lvl-1 td:first-child{padding-left:5px}.est-row-lvl-2 td:first-child{padding-left:20px}.est-row-lvl-3 td:first-child{padding-left:35px}.est-row-lvl-4 td:first-child{padding-left:50px}.est-row-lvl-5 td:first-child{padding-left:65px}.est-row-lvl-6 td:first-child{padding-left:80px}.est-row-lvl-7 td:first-child{padding-left:95px}.est-row-lvl-8 td:first-child{padding-left:110px}.est-row-lvl-9 td:first-child{padding-left:125px}.est-row-lvl-10 td:first-child{padding-left:140px}.est-row-lvl-11 td:first-child{padding-left:155px}.est-row-lvl-12 td:first-child{padding-left:170px}.est-row-lvl-13 td:first-child{padding-left:185px}.est-row-lvl-14 td:first-child{padding-left:200px}.est-row-lvl-15 td:first-child{padding-left:215px}.est-row-lvl-16 td:first-child{padding-left:230px}.est-row-lvl-17 td:first-child{padding-left:245px}.est-row-lvl-18 td:first-child{padding-left:260px}.est-row-lvl-19 td:first-child{padding-left:275px}.est-row-lvl-20 td:first-child{padding-left:290px}.est-row-lvl-21 td:first-child{padding-left:305px}.est-row-lvl-22 td:first-child{padding-left:320px}.est-row-lvl-23 td:first-child{padding-left:335px}.est-row-lvl-24 td:first-child{padding-left:350px}.est-row-lvl-25 td:first-child{padding-left:365px}.est-row-lvl-26 td:first-child{padding-left:380px}.est-row-lvl-27 td:first-child{padding-left:395px}.est-row-lvl-28 td:first-child{padding-left:410px}.est-row-lvl-29 td:first-child{padding-left:425px}.est-row-lvl-30 td:first-child{padding-left:440px}.est-row-lvl-31 td:first-child{padding-left:455px}.est-row-lvl-32 td:first-child{padding-left:470px}.est-row-lvl-33 td:first-child{padding-left:485px}.est-row-lvl-34 td:first-child{padding-left:500px}.est-row-lvl-35 td:first-child{padding-left:515px}.est-row-lvl-36 td:first-child{padding-left:530px}.est-row-lvl-37 td:first-child{padding-left:545px}.est-row-lvl-38 td:first-child{padding-left:560px}.est-row-lvl-39 td:first-child{padding-left:575px}.est-row-lvl-40 td:first-child{padding-left:590px}.est-row-lvl-41 td:first-child{padding-left:605px}.est-row-lvl-42 td:first-child{padding-left:620px}.est-row-lvl-43 td:first-child{padding-left:635px}.est-row-lvl-44 td:first-child{padding-left:650px}.est-row-lvl-45 td:first-child{padding-left:665px}.est-row-lvl-46 td:first-child{padding-left:680px}.est-row-lvl-47 td:first-child{padding-left:695px}.est-row-lvl-48 td:first-child{padding-left:710px}.est-row-lvl-49 td:first-child{padding-left:725px}.est-row-lvl-50 td:first-child{padding-left:740px}.est-row-lvl-51 td:first-child{padding-left:755px}.est-row-lvl-52 td:first-child{padding-left:770px}.est-row-lvl-53 td:first-child{padding-left:785px}.est-row-lvl-54 td:first-child{padding-left:800px}.est-row-lvl-55 td:first-child{padding-left:815px}.est-row-lvl-56 td:first-child{padding-left:830px}.est-row-lvl-57 td:first-child{padding-left:845px}.est-row-lvl-58 td:first-child{padding-left:860px}.est-row-lvl-59 td:first-child{padding-left:875px}.est-row-lvl-60 td:first-child{padding-left:890px}.est-row-lvl-61 td:first-child{padding-left:905px}.est-row-lvl-62 td:first-child{padding-left:920px}.est-row-lvl-63 td:first-child{padding-left:935px}.est-row-lvl-64 td:first-child{padding-left:950px}.est-row-lvl-65 td:first-child{padding-left:965px}.est-row-lvl-66 td:first-child{padding-left:980px}.est-row-lvl-67 td:first-child{padding-left:995px}.est-row-lvl-68 td:first-child{padding-left:1010px}.est-row-lvl-69 td:first-child{padding-left:1025px}.est-row-lvl-70 td:first-child{padding-left:1040px}.est-row-lvl-71 td:first-child{padding-left:1055px}.est-row-lvl-72 td:first-child{padding-left:1070px}.est-row-lvl-73 td:first-child{padding-left:1085px}.est-row-lvl-74 td:first-child{padding-left:1100px}.est-row-lvl-75 td:first-child{padding-left:1115px}.est-row-lvl-76 td:first-child{padding-left:1130px}.est-row-lvl-77 td:first-child{padding-left:1145px}.est-row-lvl-78 td:first-child{padding-left:1160px}.est-row-lvl-79 td:first-child{padding-left:1175px}.est-row-lvl-80 td:first-child{padding-left:1190px}.est-row-lvl-81 td:first-child{padding-left:1205px}.est-row-lvl-82 td:first-child{padding-left:1220px}.est-row-lvl-83 td:first-child{padding-left:1235px}.est-row-lvl-84 td:first-child{padding-left:1250px}.est-row-lvl-85 td:first-child{padding-left:1265px}.est-row-lvl-86 td:first-child{padding-left:1280px}.est-row-lvl-87 td:first-child{padding-left:1295px}.est-row-lvl-88 td:first-child{padding-left:1310px}.est-row-lvl-89 td:first-child{padding-left:1325px}.est-row-lvl-90 td:first-child{padding-left:1340px}.est-row-lvl-91 td:first-child{padding-left:1355px}.est-row-lvl-92 td:first-child{padding-left:1370px}.est-row-lvl-93 td:first-child{padding-left:1385px}.est-row-lvl-94 td:first-child{padding-left:1400px}.est-row-lvl-95 td:first-child{padding-left:1415px}.est-row-lvl-96 td:first-child{padding-left:1430px}.est-row-lvl-97 td:first-child{padding-left:1445px}.est-row-lvl-98 td:first-child{padding-left:1460px}.est-row-lvl-99 td:first-child{padding-left:1475px}.est-relative{position:relative}.est-top-pager{position:absolute;right:0;top:5px}.est-top-allselect{position:absolute;left:0;top:5px;font-weight:700}.est-padding-10{padding:10px!important}.est-margin-right-50{margin-right:50px}.est-margin-left-50{margin-left:50px}.est-quick-unpin{color:#000;margin-left:8px;font-size:14px;transform:rotate(45deg)}.est-page-sel{color:#000;margin-left:3px;margin-right:3px;padding:0 5px;font-size:inherit;border:none;border-radius:15px}.est-page-prev,.est-page-next{color:#000;padding:2px 0 0;font-size:inherit}.est-pinned-header{background-color:#fff;left:0;top:0;position:sticky;z-index:1;border-bottom:1px solid #dee2e6!important;padding:0!important}.est-simple-border-bottom{border-bottom:1px solid #dee2e6}.est-pinned-internal-header{border-top:0;border-bottom:0px solid #dee2e6}.est-pinned-border{border-right:2px solid #dee2e6!important}.est-cell-padding{padding:.3rem}.est-pinned-body{background-color:#fff;left:0;position:sticky;z-index:1;border-top:1px solid #dee2e6!important;padding:0!important}.est-inline{display:inline!important}.est-inline-block{display:inline-block!important}.est-link{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block}.est-link:hover{color:#23527c!important;cursor:pointer;text-decoration:underline!important}.est-sticky-last-column{right:-1px;position:sticky;z-index:0;background-color:#fff}.est-sticky-last-column-alt{right:-1px;position:sticky;z-index:0;background-color:#f2f2f2}.est-ltab-border{border-left:2px solid #bbb}.est-rtab-border{border-right:2px solid #bbb}.est-cell-group-padding{padding:calc(.3rem + 1px);position:absolute;top:0;left:0;height:100%;width:100%}.est-margin-bottom-10{margin-bottom:10px}.est-text-center{text-align:center}.est-flex{display:flex}.est-rg-sep-flex-right{display:flex;flex-direction:row-reverse;width:100%;margin:-5px}.est-rg-sep-flex-left{display:flex;flex-direction:row;width:100%;margin:-5px}.est-rg-hdr{font-weight:700}.est-rg-agg{font-style:italic}.est-rg{background-color:#7777!important}.est-rg-sep{font-size:12px;padding-right:20px!important;background-color:#bbbb!important}.est-rg-ipp{text-align:left;display:inline-flex;margin-right:25px}.est-rg-page{text-align:right;display:inline-flex;font-size:inherit;padding-top:5px}.est-droplist.cdk-drag-placeholder{opacity:0}.est-droplist.cdk-drag-preview{z-index:999999999!important;opacity:1;box-sizing:border-box;border-radius:4px;background-color:#fff;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.est-droplist.cdk-drag-preview td:not(.drag-visible){visibility:hidden}.est-droplist.cdk-drag-preview td.drag-visible{padding-top:3px}.est-droplist.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.est-droplist.cdk-drop-list-dragging .est-dropbox:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.est-pre{white-space:pre}.est .mat-form-field-flex{height:29px!important;padding:0!important}.est .mat-form-field-flex .mat-form-field-outline{color:#00f}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-start{border-left:none;border-top:none;border-radius:0}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-end{border-top:none;border-radius:0;border-right:none}.est .mat-form-field-wrapper{height:20px;min-height:20px!important;margin-top:0!important}.est .mat-form-field-infix{width:100%!important;min-width:50px!important}.est input{height:20px;padding-top:0!important}\n"] }]
         }], ctorParameters: function () {
         return [{ type: i1.NgControl, decorators: [{
                         type: Self
@@ -4237,6 +4446,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
             }], secondaryHeaderGroupRef: [{
                 type: ContentChild,
                 args: ['secondaryHeaderGroup', { static: false }]
+            }], inputField: [{
+                type: ViewChild,
+                args: ['input', { static: false }]
             }], CornerMenuOptions: [{
                 type: Input
             }], ColumnsResizable: [{
@@ -4341,6 +4553,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                 type: Input
             }], ShowItemGroupsColumns: [{
                 type: Input
+            }], UserEdits: [{
+                type: Input
             }], onOrderChanged: [{
                 type: Output
             }], onSearchRequest: [{
@@ -4392,7 +4606,8 @@ EsTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
         ContextMenuModule,
         MatSelectModule,
         MatInputModule,
-        DragDropModule], exports: [EsTableComponent, EsTdDirective, EsThDirective, TablePagerComponent] });
+        DragDropModule,
+        FormsAndValidationsModule], exports: [EsTableComponent, EsTdDirective, EsThDirective, TablePagerComponent] });
 EsTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsTableModule, providers: [UtilityService, ExportService, HashingService, MessageService], imports: [[
             CommonModule,
             FormsModule,
@@ -4404,7 +4619,8 @@ EsTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
             ContextMenuModule,
             MatSelectModule,
             MatInputModule,
-            DragDropModule
+            DragDropModule,
+            FormsAndValidationsModule
         ]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: EsTableModule, decorators: [{
             type: NgModule,
@@ -4420,7 +4636,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
                         ContextMenuModule,
                         MatSelectModule,
                         MatInputModule,
-                        DragDropModule
+                        DragDropModule,
+                        FormsAndValidationsModule
                     ],
                     declarations: [EsTh, EsTd, EsTableComponent, EsTdDirective, EsThDirective, TablePagerComponent],
                     providers: [UtilityService, ExportService, HashingService, MessageService],
@@ -4465,6 +4682,31 @@ class GenericItem {
     }
 }
 
+/** Classe che definisce un multi-elemento, cioè una proprietà particolare di un oggetto da visualizzare in es-table che genera dinamicamente gruppi di Header e valori sottostanti */
+class EsTableMultiValue {
+    /**
+     * Costruttore
+     *
+     * @param {string} value Valore di questo elemento
+     * @param {string} header Nome di questo header
+     * @param {string} header_group Gruppo dell'header, in caso di multipli gruppi innestati usare la sintassi "G1 > G2 > G3" ecc...
+     * @param {boolean} exports Indica se questo header con questo valore dev'essere esportato
+     * @param {string} export_format Qualora **export** fosse **true** indica il formato per l'esportazione
+     */
+    constructor(value, header, header_group, exports = false, export_format = "") {
+        this.value = value;
+        this.header = header;
+        this.header_group = header_group;
+        /** Indica se questo header con questo valore dev'essere esportato */
+        this.exports = false;
+        /** Qualora **export** fosse **true** indica il formato per l'esportazione */
+        this.export_format = "";
+        this.exports = exports;
+        this.export_format = export_format;
+        this._headersHierarchy = header_group ? header_group.split(">").map(t => t.trim()) : [];
+    }
+}
+
 /** Classe che rappresenta una colonna di un report */
 class ReportColumn {
 }
@@ -4485,5 +4727,5 @@ class ReportRow {
  * Generated bundle index. Do not edit.
  */
 
-export { AppOrdering, AppSearch, CornerMenuOption, EsTableColumnsDefinition, EsTableComponent, EsTableDefaultable, EsTableModule, EsTableModuleConfig, EsTableOperationDefinition, EsTdDirective, EsThDirective, GenericItem, Group, GroupAggregation, GroupFilter, GroupOrAggregation, ItemsSelection, ReportColumn, ReportDefinition, ReportOrder, ReportParam, ReportResult, ReportRow, TablePagerComponent };
+export { AppOrdering, AppSearch, CornerMenuOption, EsTableColumnsDefinition, EsTableComponent, EsTableDefaultable, EsTableModule, EsTableModuleConfig, EsTableMultiValue, EsTableOperationDefinition, EsTdDirective, EsThDirective, GenericItem, Group, GroupAggregation, GroupFilter, GroupOrAggregation, ItemsSelection, ReportColumn, ReportDefinition, ReportOrder, ReportParam, ReportResult, ReportRow, TablePagerComponent };
 //# sourceMappingURL=esfaenza-es-table.mjs.map