@esfaenza/es-table 11.2.34 → 11.2.37-beta2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (29) hide show
  1. package/bundles/esfaenza-es-table.umd.js +333 -586
  2. package/bundles/esfaenza-es-table.umd.js.map +1 -1
  3. package/bundles/esfaenza-es-table.umd.min.js +1 -1
  4. package/bundles/esfaenza-es-table.umd.min.js.map +1 -1
  5. package/esfaenza-es-table.d.ts +2 -2
  6. package/esfaenza-es-table.metadata.json +1 -1
  7. package/esm2015/esfaenza-es-table.js +3 -3
  8. package/esm2015/lib/components/es-table/es_table.component.js +37 -170
  9. package/esm2015/lib/components/es-td/es_td.component.js +1 -35
  10. package/esm2015/lib/core/handlers/classes/ColumnMetadataHandler.js +44 -96
  11. package/esm2015/lib/core/handlers/classes/ItemsHandler.js +1 -19
  12. package/esm2015/lib/core/handlers/classes/RowGroupingHandler.js +2 -4
  13. package/esm2015/lib/core/handlers/classes/UtilitiesHandler.js +1 -15
  14. package/esm2015/lib/domain/internals/classes/TdElement.js +2 -0
  15. package/esm2015/lib/domain/internals/index.js +2 -1
  16. package/esm2015/lib/es-table.module.js +2 -2
  17. package/esm2015/public-api.js +3 -3
  18. package/fesm2015/esfaenza-es-table.js +315 -566
  19. package/fesm2015/esfaenza-es-table.js.map +1 -1
  20. package/lib/components/es-table/es_table.component.d.ts +8 -64
  21. package/lib/components/es-td/es_td.component.d.ts +0 -2
  22. package/lib/core/handlers/classes/ColumnMetadataHandler.d.ts +15 -16
  23. package/lib/core/handlers/classes/ItemsHandler.d.ts +0 -6
  24. package/lib/core/handlers/classes/RowGroupingHandler.d.ts +2 -3
  25. package/lib/core/handlers/classes/UtilitiesHandler.d.ts +0 -16
  26. package/lib/domain/internals/classes/TdElement.d.ts +19 -0
  27. package/lib/domain/internals/index.d.ts +1 -0
  28. package/package.json +2 -2
  29. package/public-api.d.ts +2 -2
@@ -1,17 +1,17 @@
1
1
  import { __awaiter } from 'tslib';
2
2
  import * as i0 from '@angular/core';
3
- import { Component, ChangeDetectionStrategy, ElementRef, Renderer2, ViewContainerRef, Input, EventEmitter, Output, ViewChild, HostListener, Directive, TemplateRef, InjectionToken, Injectable, Optional, Inject, ViewEncapsulation, Self, ChangeDetectorRef, ContentChildren, forwardRef, ContentChild, NgModule } from '@angular/core';
3
+ import { Directive, TemplateRef, Input, InjectionToken, Injectable, Optional, Inject, EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, Self, ChangeDetectorRef, ContentChildren, ContentChild, Output, ViewChild, ElementRef, Renderer2, HostListener, ViewContainerRef, NgModule } from '@angular/core';
4
4
  import { NgControl, FormsModule } from '@angular/forms';
5
5
  import * as i1 from '@esfaenza/extensions';
6
6
  import { HashingService, UtilityService, ExportService, DateService, MessageService } from '@esfaenza/extensions';
7
7
  import { LocalizationService, LocalizationModule } from '@esfaenza/localizations';
8
8
  import { PreferencesService } from '@esfaenza/preferences';
9
- import { DomSanitizer } from '@angular/platform-browser';
10
9
  import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
11
10
  import { CommonModule } from '@angular/common';
12
11
  import { RouterModule } from '@angular/router';
13
12
  import { MatSelectModule } from '@angular/material/select';
14
13
  import { MatInputModule } from '@angular/material/input';
14
+ import { DomSanitizer } from '@angular/platform-browser';
15
15
  import { ModalModule } from 'ngx-bootstrap/modal';
16
16
  import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
17
17
  import { CsvModule } from '@ctrl/ngx-csv';
@@ -342,269 +342,6 @@ class ThAggregation {
342
342
  }
343
343
  }
344
344
 
345
- //Angular
346
- /** Componente rappresentante una singola cella del body della tabella */
347
- class EsTd {
348
- /** @ignore */
349
- constructor(myself, renderer, _viewContainer, sanitizer) {
350
- this.myself = myself;
351
- this.renderer = renderer;
352
- this._viewContainer = _viewContainer;
353
- this.sanitizer = sanitizer;
354
- /** Id della cella, dev'essere lo stesso della colonna **EsTh** relativa */
355
- this.ID = "";
356
- /** Valore da mostrare all'interno della cella. Se omesso verrà proiettato il contenuto dal template in cui è stata usata */
357
- this.Display = null;
358
- /** Template Angular da istanziare per questo TD */
359
- this.Template = null;
360
- }
361
- /**
362
- * Imposta la visibilità o meno della cella, si traduce nell'applicazione o rimozione della classe **app-display-none**
363
- *
364
- * @param {boolean} expression Indicazione della visibilità
365
- */
366
- set Visible(expression) {
367
- this._Visible = expression;
368
- if (expression)
369
- this.renderer.removeClass(this.myself.nativeElement, "app-display-none");
370
- else
371
- this.renderer.addClass(this.myself.nativeElement, "app-display-none");
372
- }
373
- /**
374
- * Restituisce lo stato di Visibilità della cella in oggetto
375
- *
376
- * @returns {boolean} **true** se visibile, **false** altrimenti
377
- */
378
- get Visible() {
379
- if (this._Visible == undefined)
380
- this._Visible = true;
381
- return this._Visible;
382
- }
383
- /** @ignore */
384
- ngAfterViewInit() {
385
- // Se è Internal significa che è gestita internamente da ES-TABLE quindi evito di fare sti due passaggi di lettura del DOM
386
- if (this.Internal)
387
- return;
388
- // L'hash è calcolato dalla ES-table in fase di binding
389
- this.Context = this.Context || this.getTemplateContext()._hash;
390
- this.Content = this.Display === null || this.Display === "" ? this.sanitizer.bypassSecurityTrustHtml(this.myself.nativeElement.innerHTML) : this.sanitizer.bypassSecurityTrustHtml(this.Display);
391
- this.Class = this.myself.nativeElement.className.replace("app-display-none", "");
392
- }
393
- /** Ottiene il contesto della view su cui è istanziato il componente */
394
- getTemplateContext() {
395
- // NGBUG: (<any>this._viewContainer)._view non esiste più in IVY: https://stackoverflow.com/questions/60398827/getting-the-context-of-the-template-inside-of-which-my-component-has-been-render
396
- let vc = this._viewContainer;
397
- let context;
398
- // Primo giro di recupero del contesto, supponendo di non avere a che fare col compilatore IVY
399
- if (vc._view == null)
400
- context = null;
401
- else if (vc._view.parent && !vc._view.context.$implicit && vc._view.parent.context && vc._view.parent.context.$implicit)
402
- context = vc._view.parent.context.$implicit;
403
- else if (vc._view.context && vc._view.context.ngIf)
404
- context = vc._view.viewContainerParent.context.$implicit;
405
- else
406
- context = vc._view.context.$implicit;
407
- if (context)
408
- return context;
409
- // Se non ho ancora trovato il contesto probabilmente sono in IVY e devo fare dei lookup un po' incasinati per beccarlo
410
- var array = this._viewContainer._hostLView;
411
- for (let i = 0; i < array.length; i++) {
412
- let item = array[i];
413
- if (item && item.$implicit && !item.ngIf)
414
- return item.$implicit;
415
- // Second level search for the real context in case the first one we find is an ngIf
416
- if (item && item.length && item.length > 0) {
417
- for (let ii = 0; ii < item.length; ii++) {
418
- let iitem = item[ii];
419
- if (iitem && iitem.$implicit && !iitem.ngIf)
420
- return iitem.$implicit;
421
- }
422
- }
423
- }
424
- }
425
- }
426
- EsTd.decorators = [
427
- { type: Component, args: [{
428
- selector: "[es-td]",
429
- template: "<span>\r\n <ng-content></ng-content>\r\n</span>",
430
- changeDetection: ChangeDetectionStrategy.OnPush
431
- },] }
432
- ];
433
- EsTd.ctorParameters = () => [
434
- { type: ElementRef },
435
- { type: Renderer2 },
436
- { type: ViewContainerRef },
437
- { type: DomSanitizer }
438
- ];
439
- EsTd.propDecorators = {
440
- ID: [{ type: Input, args: ['es-td',] }],
441
- Internal: [{ type: Input }],
442
- RouterLink: [{ type: Input }],
443
- Display: [{ type: Input }],
444
- Template: [{ type: Input }],
445
- Context: [{ type: Input }],
446
- Visible: [{ type: Input }]
447
- };
448
-
449
- //Angular
450
- /** Componente rappresentante una Colonna della tabella */
451
- class EsTh {
452
- /** @ignore */
453
- constructor(myself, renderer) {
454
- this.myself = myself;
455
- this.renderer = renderer;
456
- /** Dizionario di mappatura con ordinamento attuale e ordinamento successivo per gestire i passaggi di stato */
457
- this.orderNext = { "NONE": "DESC", "DESC": "ASC", "ASC": null };
458
- /** Indica se si sta effettuando un'operazione di resize su questa colonna */
459
- this.resizingThis = false;
460
- /**
461
- * Storicizza l'offset di partenza del resize dell'elemento HTML per poter calcolare la nuova dimensione richiesta durente il resize
462
- *
463
- * nuova width = startOffset + posizione X del mouse
464
- */
465
- this.startOffset = null;
466
- /** Id della colonna, dev'essere lo stesso per tutti gli **EsTd** relativi */
467
- this.ID = "";
468
- /** Indica se questa colonna è ordinabile o meno */
469
- this.Orderable = true;
470
- /** Valore da mostrare all'interno della colonna. Se omesso verrà proiettato il contenuto dal template in cui è stata usata */
471
- this.Display = "";
472
- /** Indica se le dimnsioni di questa colonna sono modificabili o meno */
473
- this.Resizable = false;
474
- /** Indica se questo header è pinnato. In caso lo fosse presenta il tastino per effettuare lo spinning */
475
- this.Pinned = false;
476
- /**
477
- * Indica se sta venendo eseguita una operazione di ricerca o meno, serve per evitare l'esecuzione di eventuale codice che potrebbe dare fastidio
478
- * come ad esempio l'escuzione di un ordinamento durante il caricamento di dati nuovi
479
- */
480
- this.SearchInProgress = false;
481
- /** Indica se il testo presente in questo Header può andare a capo o meno, di default non può */
482
- this.Wrap = false;
483
- /** Indica se la colonna è fixed, cioè se non può né essere nascosta, né riposizionata. Solo le prime colonne possono essere Fixed */
484
- this.Fixed = false;
485
- /** Template Angular da istanziare per questo TH */
486
- this.Template = null;
487
- /** Evento emesso al cambio di ordinamento effettuato su questa colonna */
488
- this.onOrderChange = new EventEmitter();
489
- /** Evento emesso all'unpinning della colonna */
490
- this.onUnpinning = new EventEmitter();
491
- /** Impostato dall'**EsTable**, per controllare che ci sia almeno un TD che utilizzi quest'header */
492
- this._referenced = false;
493
- }
494
- /**
495
- * Imposta la visibilità o meno della colonna, si traduce nell'applicazione o rimozione della classe **app-display-none**
496
- *
497
- * @param {boolean} expression Indicazione della visibilità
498
- */
499
- set Visible(expression) {
500
- this._Visible = expression;
501
- if (expression)
502
- this.renderer.removeClass(this.myself.nativeElement, "app-display-none");
503
- else
504
- this.renderer.addClass(this.myself.nativeElement, "app-display-none");
505
- }
506
- /**
507
- * Restituisce lo stato di Visibilità della colonna in oggetto
508
- *
509
- * @returns {boolean} **true** se visibile, **false** altrimenti
510
- */
511
- get Visible() {
512
- if (this._Visible == undefined)
513
- this._Visible = true;
514
- return this._Visible;
515
- }
516
- /** @ignore */
517
- ngAfterViewInit() {
518
- //Assegnare direttamente il content è più veloce che passare dal native element per qualche motivo
519
- this.Description = this.Display === null || this.Display === "" ? this.content.nativeElement.innerText : this.Display;
520
- this.Class = this.myself.nativeElement.className.replace("app-display-none", "");
521
- //Resize
522
- if (this.Resizable)
523
- this.renderer.addClass(this.myself.nativeElement, "app-relative");
524
- }
525
- /** Emette l'evento di unpinning */
526
- unpin() {
527
- this.onUnpinning.emit(this.ID);
528
- }
529
- /** Gestisce la modifica dell'ordinamento qualora venisse cliccato su questa colonna */
530
- setupNextOrderAndNotify() {
531
- if (!this.ID) {
532
- console.log("Attempt to order a column without ID. Operation ignored");
533
- return;
534
- }
535
- if (this.SearchInProgress) {
536
- console.log("Attempt to order a column during a search. Operation ignored");
537
- return;
538
- }
539
- if (!this.OrderBy || !this.Orderable)
540
- return;
541
- var nextOrder = this.orderNext[this.Order || "NONE"];
542
- this.Order = nextOrder;
543
- this.onOrderChange.emit(this.Order);
544
- }
545
- /**
546
- * Evento di inizio resize della colonna
547
- *
548
- * @param {any} ev Evento MouseDown
549
- */
550
- onResizeStart(ev) {
551
- if (!this.Resizable)
552
- return;
553
- this.resizingThis = true;
554
- this.startOffset = this.myself.nativeElement.offsetWidth - ev.pageX;
555
- }
556
- /** Listener per la fine dell'operazione di resize */
557
- onMouseUp() {
558
- if (!this.Resizable)
559
- return;
560
- this.resizingThis = false;
561
- }
562
- /**
563
- * Listener per gestire il movimento del mouse qualora un'operazione di resize fosse in esecuzione
564
- *
565
- * @param {$event} ev Evento MouseMove
566
- */
567
- onMouseMove($event) {
568
- if (!this.Resizable || !this.resizingThis)
569
- return;
570
- //Uso jquery per non dover far partire un intero ciclo di change detection solo per fare un resize del cazzo
571
- //(anche perché viene lanciato ogni 0.1 secondo quindi not a good idea)
572
- this.myself.nativeElement.style.width = (this.startOffset + $event.pageX) + "px";
573
- //Fermo il bubbling per non fare cose strane
574
- $event.preventDefault();
575
- }
576
- }
577
- EsTh.decorators = [
578
- { type: Component, args: [{
579
- selector: "[es-th]",
580
- 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>",
581
- changeDetection: ChangeDetectionStrategy.OnPush
582
- },] }
583
- ];
584
- EsTh.ctorParameters = () => [
585
- { type: ElementRef },
586
- { type: Renderer2 }
587
- ];
588
- EsTh.propDecorators = {
589
- ID: [{ type: Input, args: ['es-th',] }],
590
- Order: [{ type: Input }],
591
- Orderable: [{ type: Input }],
592
- Display: [{ type: Input }],
593
- Resizable: [{ type: Input }],
594
- Pinned: [{ type: Input }],
595
- SearchInProgress: [{ type: Input }],
596
- OrderBy: [{ type: Input }],
597
- Wrap: [{ type: Input }],
598
- Fixed: [{ type: Input }],
599
- Template: [{ type: Input }],
600
- onOrderChange: [{ type: Output }],
601
- onUnpinning: [{ type: Output }],
602
- content: [{ type: ViewChild, args: ["content", { static: false },] }],
603
- Visible: [{ type: Input }],
604
- onMouseUp: [{ type: HostListener, args: ['window:mouseup.out-zone',] }],
605
- onMouseMove: [{ type: HostListener, args: ['window:mousemove.out-zone', ['$event'],] }]
606
- };
607
-
608
345
  /** Direttiva per la dichiarazione snella di un EsTd da emettere per ogni elemento, data una colonna */
609
346
  class EsTdDirective {
610
347
  /**
@@ -810,7 +547,7 @@ class ColumnMetadataHandler {
810
547
  *
811
548
  * Costo: 1 scan EsThs
812
549
  *
813
- * @param {EsTh[] | EsThDirective[]} ths Colonne della tabella
550
+ * @param {EsThDirective[]} ths Colonne della tabella
814
551
  */
815
552
  reviewColumnsList(ths) {
816
553
  this.est.TMPColumnsList = [];
@@ -819,30 +556,18 @@ class ColumnMetadataHandler {
819
556
  // Appena il contentChildren è valorizzato scorro tutti gli header
820
557
  for (let i = 0; i < ths.length; i++) {
821
558
  let th = ths[i];
822
- if (this.utilities.isEsTh(th)) {
823
- // Se non ho un id il th è considerato inerte
824
- if (!th.ID)
825
- continue;
826
- th.OrderBy = this.est.OrderByColumn;
827
- // Salvo le informazioni dell'header per far parte della lista da cui scegliere quali colonne visualizzare/nascondere
828
- // Di default la visibilità è quella impostata nel componente
829
- if (this.est.HiddenColumns || th.Visible)
830
- this.est.TMPColumnsList.push(new EsTableColumn(th.ID, th.Description, th.Visible, th.Fixed));
831
- }
832
- else {
833
- let column = th.th;
834
- // Se non ho un id il th è considerato inerte
835
- if (!column)
836
- continue;
837
- // Salvo le informazioni dell'header per far parte della lista da cui scegliere quali colonne visualizzare/nascondere
838
- // Di default la visibilità è quella impostata nel componente
839
- if ((this.est.HiddenColumns || th.thVisible) && th.thIf) {
840
- let previouslyPinned = !this.est.ColumnsList || this.est.ColumnsList.length == 0 ? null : this.est.ColumnsList.find(t => t.id == column) || null;
841
- let toAdd = new EsTableColumn(column, null, th.thVisible, (th.thFixed || th.thGroup), previouslyPinned == null ? th.thPinned : previouslyPinned.pinned, th.thPinnedWidth, th.Template, th._thParents);
842
- if (previouslyPinned)
843
- toAdd.prev_index = previouslyPinned.prev_index;
844
- this.est.TMPColumnsList.push(toAdd);
845
- }
559
+ let column = th.th;
560
+ // Se non ho un id il th è considerato inerte
561
+ if (!column)
562
+ continue;
563
+ // Salvo le informazioni dell'header per far parte della lista da cui scegliere quali colonne visualizzare/nascondere
564
+ // Di default la visibilità è quella impostata nel componente
565
+ if ((this.est.HiddenColumns || th.thVisible) && th.thIf) {
566
+ let previouslyPinned = !this.est.ColumnsList || this.est.ColumnsList.length == 0 ? null : this.est.ColumnsList.find(t => t.id == column) || null;
567
+ let toAdd = new EsTableColumn(column, null, th.thVisible, (th.thFixed || th.thGroup), previouslyPinned == null ? th.thPinned : previouslyPinned.pinned, th.thPinnedWidth, th.Template, th._thParents);
568
+ if (previouslyPinned)
569
+ toAdd.prev_index = previouslyPinned.prev_index;
570
+ this.est.TMPColumnsList.push(toAdd);
846
571
  }
847
572
  }
848
573
  this.est.ColumnsList = [];
@@ -877,33 +602,21 @@ class ColumnMetadataHandler {
877
602
  // Sposto tutti gli header fixed o pinned all'inizio
878
603
  for (let i = 0; i < ths.length; i++) {
879
604
  let th = ths[i];
880
- if (this.utilities.isEsTh(th)) {
881
- thsCache[th.ID] = th;
882
- if (th.Fixed) {
883
- if (i != pinneds + fixeds)
884
- this.utilities.arrayMove(ths, i, pinneds + fixeds);
885
- fixeds++;
886
- }
605
+ thsCache[th.th] = th;
606
+ // Riassegno sempre per ripulire valori di partenza o per aggiornarli in caso di modifiche utente
607
+ th.thPinned = (!columnsCache[th.th] && th.thPinned) || (columnsCache[th.th] && columnsCache[th.th].pinned);
608
+ if (th.thPinned) {
609
+ if (i != pinneds)
610
+ this.utilities.arrayMove(ths, i, pinneds);
611
+ pinneds++;
887
612
  }
888
- else {
889
- thsCache[th.th] = th;
890
- // Riassegno sempre per ripulire valori di partenza o per aggiornarli in caso di modifiche utente
891
- th.thPinned = (!columnsCache[th.th] && th.thPinned) || (columnsCache[th.th] && columnsCache[th.th].pinned);
892
- if (th.thPinned) {
893
- if (i != pinneds)
894
- this.utilities.arrayMove(ths, i, pinneds);
895
- pinneds++;
896
- }
897
- //In questo caso sono informazioni statiche invece, non modificabili dall'utente, quindi non mi dò preoccupazioni
898
- if ((th.thFixed || th.thGroup) && !th.thPinned) {
899
- if (i != pinneds + fixeds)
900
- this.utilities.arrayMove(ths, i, pinneds + fixeds);
901
- fixeds++;
902
- }
613
+ //In questo caso sono informazioni statiche invece, non modificabili dall'utente, quindi non mi dò preoccupazioni
614
+ if ((th.thFixed || th.thGroup) && !th.thPinned) {
615
+ if (i != pinneds + fixeds)
616
+ this.utilities.arrayMove(ths, i, pinneds + fixeds);
617
+ fixeds++;
903
618
  }
904
619
  }
905
- if (this.utilities.isEsTh(ths[0]) || this.utilities.isEsTd(tds[0]))
906
- return;
907
620
  // Cache degli indici per riposizionare i td come i th
908
621
  for (let i = 0; i < ths.length; i++)
909
622
  columnsIndexCache[ths[i].th] = i;
@@ -989,8 +702,8 @@ class ColumnMetadataHandler {
989
702
  *
990
703
  * Costo: 1 scan ColumnsList, 1 scan EsThs, 1 scan EsTds
991
704
  *
992
- * @param {EsTh[] | EsThDirective[]} ths Header della tabella
993
- * @param {EsTd[] | EsTdDirective[]} tds Celle della tabella
705
+ * @param {EsThDirective[]} ths Header della tabella
706
+ * @param {EsTdDirective[]} tds Celle della tabella
994
707
  * @param {AppSearch<any>} view AppSearch da utilizzare per questa operazione
995
708
  */
996
709
  refreshColumnsVisibility(ths, tds, view) {
@@ -1012,26 +725,16 @@ class ColumnMetadataHandler {
1012
725
  // Definisco se la colonna è visibile in base alla sua rappresentazione locale in ColumnsList
1013
726
  for (let i = 0; i < ths.length; i++) {
1014
727
  let th = ths[i];
1015
- if (this.utilities.isEsTh(th)) {
1016
- th.Visible = th.Fixed || (columnsCache[th.ID] ? columnsCache[th.ID].visible : th.Visible);
1017
- if (th.Fixed)
1018
- fixedThs[th.ID] = true;
1019
- }
1020
- else {
1021
- th.thVisible = th.thFixed || (columnsCache[th.th] ? columnsCache[th.th].visible : th.thVisible);
1022
- if (th.thFixed || th.thGroup)
1023
- fixedThs[th.th] = true;
1024
- }
728
+ th.thVisible = th.thFixed || (columnsCache[th.th] ? columnsCache[th.th].visible : th.thVisible);
729
+ if (th.thFixed || th.thGroup)
730
+ fixedThs[th.th] = true;
1025
731
  }
1026
732
  }
1027
733
  if (tds) {
1028
734
  // Definisco se la cella è visibile in base alla sua rappresentazione locale in ColumnsList
1029
735
  for (let i = 0; i < tds.length; i++) {
1030
736
  let td = tds[i];
1031
- if (this.utilities.isEsTd(td))
1032
- td.Visible = fixedThs[td.ID] || (columnsCache[td.ID] ? columnsCache[td.ID].visible : td.Visible);
1033
- else
1034
- td.tdVisible = fixedThs[td.td] || (columnsCache[td.td] ? columnsCache[td.td].visible : td.tdVisible);
737
+ td.tdVisible = fixedThs[td.td] || (columnsCache[td.td] ? columnsCache[td.td].visible : td.tdVisible);
1035
738
  }
1036
739
  }
1037
740
  this.est.changed();
@@ -1040,38 +743,26 @@ class ColumnMetadataHandler {
1040
743
  * Allinea gli ordinamenti dati fra le **EsThs** e le informazioni all'interno della View bindata
1041
744
  *
1042
745
  * @param {AppSearch<any>} view AppSearch da utilizzare per questa operazione
1043
- * @param {EsTh[] | EsThDirective[]} ths Colonne della tabella
746
+ * @param {EsThDirective[]} ths Colonne della tabella
1044
747
  */
1045
748
  alignHeadersOrdering(ths, view) {
1046
749
  let orders = view ? view.orders : this.est.arrayOrders;
1047
750
  for (let i = 0; i < ths.length; i++) {
1048
751
  let th = ths[i];
1049
- if (this.utilities.isEsTh(th)) {
1050
- th.Order = null;
1051
- // Assegno tutti gli ordinamenti che mi vengono da AppSearch. Sono i più importanti. Non faccio cache o cose strano perché tanto questa
1052
- // variabile sarà sempre massimo 3 elementi
1053
- for (let i = 0; i < orders.length; i++) {
1054
- let or = orders[i];
1055
- if (or.id == th.ID)
1056
- th.Order = or.order;
1057
- }
1058
- }
1059
- else {
1060
- th.thOrder = null;
1061
- for (let i = 0; i < orders.length; i++) {
1062
- let or = orders[i];
1063
- if (or.id == th.th)
1064
- th.thOrder = or.order;
1065
- }
752
+ th.thOrder = null;
753
+ for (let i = 0; i < orders.length; i++) {
754
+ let or = orders[i];
755
+ if (or.id == th.th)
756
+ th.thOrder = or.order;
1066
757
  }
1067
758
  }
1068
759
  }
1069
760
  /**
1070
761
  * Genera tutte le informazioni che servono per gestire il raggruppamento degli header
1071
762
  *
1072
- * @param {EsTh[] | EsThDirective[]} ths Colonne della tabella
763
+ * @param {EsThDirective[]} ths Colonne della tabella
1073
764
  *
1074
- * @returns {{ leafs: EsTh[] | EsThDirective[], groupingLevel: number, parentsCache: any, thsCache: any }} Oggetto contenente la lista delle foglie (header base), il livello
765
+ * @returns {{ leafs: EsThDirective[], groupingLevel: number, parentsCache: any, thsCache: any }} Oggetto contenente la lista delle foglie (header base), il livello
1075
766
  * massimo di raggruppamento raggiunto, una cache in cui vengono indicati tutti i gruppi che sono "parent" (quindi che raggruppano almeno 1 header) e la cache degli header
1076
767
  */
1077
768
  evaluateHeadersGroupingInfos(ths) {
@@ -1080,8 +771,6 @@ class ColumnMetadataHandler {
1080
771
  let thsCache = {};
1081
772
  for (let i = 0; i < ths.length; i++) {
1082
773
  let th = ths[i];
1083
- if (this.utilities.isEsTh(th))
1084
- continue;
1085
774
  thsCache[th.th] = th;
1086
775
  if (th.thParent && !parentsCache[th.thParent])
1087
776
  parentsCache[th.thParent] = true;
@@ -1091,10 +780,6 @@ class ColumnMetadataHandler {
1091
780
  let leafs = [];
1092
781
  for (let i = 0; i < ths.length; i++) {
1093
782
  let th = ths[i];
1094
- if (this.utilities.isEsTh(th)) {
1095
- leafs.push(th);
1096
- continue;
1097
- }
1098
783
  // Se sono una foglia vedo quanti livelli ci sono sopra
1099
784
  if (!parentsCache[th.th]) {
1100
785
  leafs.push(th);
@@ -1107,7 +792,7 @@ class ColumnMetadataHandler {
1107
792
  /**
1108
793
  * Genera gli header groups da una lista di info sui th all'interno della variabile **TMPRowThGroups**
1109
794
  *
1110
- * @param {{ leafs: EsTh[] | EsThDirective[], groupingLevel: number, parentsCache: any, thsCache: any }} infos Informazioni di raggruppamento valutate precedentemente
795
+ * @param {{ leafs: EsThDirective[], groupingLevel: number, parentsCache: any, thsCache: any }} infos Informazioni di raggruppamento valutate precedentemente
1111
796
  */
1112
797
  evaluateHeaderGroups(infos) {
1113
798
  if (infos.groupingLevel == 0)
@@ -1214,7 +899,7 @@ class ColumnMetadataHandler {
1214
899
  if (!orderings || orderings.length == 0) {
1215
900
  for (let i = 0; i < ths.length; i++) {
1216
901
  let th = ths[i];
1217
- let order = this.utilities.isEsTh(th) ? th.ID : th.th;
902
+ let order = th.th;
1218
903
  this.est.OrderDirectives.push(order);
1219
904
  }
1220
905
  }
@@ -1222,7 +907,7 @@ class ColumnMetadataHandler {
1222
907
  this.est.OrderDirectives = orderings;
1223
908
  for (let i = 0; i < ths.length; i++) {
1224
909
  let th = ths[i];
1225
- let thId = this.utilities.isEsTh(th) ? th.ID : th.th;
910
+ let thId = th.th;
1226
911
  if (!this.est.OrderDirectives.find(o => o == thId))
1227
912
  this.est.OrderDirectives.push(thId);
1228
913
  }
@@ -1419,7 +1104,7 @@ class ColumnMetadataHandler {
1419
1104
  let columns = this.est.arrayMode ? this.est.arrayColumns : castedView.columns;
1420
1105
  let columnsOrderings = this.est.arrayMode ? this.est.arrayColumnOrdering : castedView.column_ordering;
1421
1106
  var toStore = { columns: JSON.parse(JSON.stringify(columns)), column_ordering: JSON.parse(JSON.stringify(columnsOrderings)) };
1422
- this.prefService.store(this.est.ngControl.name, toStore).subscribe();
1107
+ this.prefService.setItem(this.est.ngControl.name, toStore, 'preference').subscribe();
1423
1108
  }
1424
1109
  // Rieseguo l'ultima ricerca bindata alla tabella
1425
1110
  // Mi assicuro di farlo dopo l'espansione del changed o rischio che la ricerca mi ridia colonne che in realtà non esistono
@@ -1870,24 +1555,6 @@ class ItemsHandler {
1870
1555
  }
1871
1556
  return tmpItems;
1872
1557
  }
1873
- /**
1874
- * Metodo che prende tutti gli oggetti di cui dispone divisi in bucket da 100 elementi
1875
- *
1876
- * @returns {any[][]} Matrice di array Nx100
1877
- */
1878
- getItemSlices() {
1879
- // Se sono qui di sicuro non ho rowgrouping
1880
- let items = this.getItemsByMode();
1881
- if (!items)
1882
- return [];
1883
- let arrayBy100 = [];
1884
- let slices = Math.ceil(items.length / this.est.SliceSize);
1885
- for (let i = 0; i < slices; i++) {
1886
- let arraySlice = items.slice(i * this.est.SliceSize, i * this.est.SliceSize + this.est.SliceSize);
1887
- arrayBy100.push(arraySlice);
1888
- }
1889
- return arrayBy100;
1890
- }
1891
1558
  /** Se in modalità array applica gli ordinamenti ASC-DESC delle colonne */
1892
1559
  arrayModeReviewOrderings() {
1893
1560
  if (this.est.arrayOrders.length > 0)
@@ -2126,13 +1793,11 @@ class RowGroupingHandler {
2126
1793
  /**
2127
1794
  * Se in modalità array applica i raggruppamenti definiti lato row-grouping
2128
1795
  *
2129
- * @param {ths: EsTh[] | EsThDirective[]} ths Header
1796
+ * @param {ths: EsThDirective[]} ths Header
2130
1797
  */
2131
1798
  arrayModeReviewGroupings(ths) {
2132
1799
  if (ths.length == 0)
2133
1800
  return;
2134
- if (this.utilities.isEsTh(ths[0]))
2135
- return;
2136
1801
  let headerGroups = [];
2137
1802
  let headerAggregations = [];
2138
1803
  for (let i = 0; i < ths.length; i++) {
@@ -3014,20 +2679,6 @@ class UtilitiesHandler {
3014
2679
  throw "Gli indici passati non fanno riferimento a una posizione dell'array. Length: " + array.length + " Old:" + oldI + " New: " + newI;
3015
2680
  array.splice(newI, 0, array.splice(oldI, 1)[0]);
3016
2681
  }
3017
- /**
3018
- * Helper che identifica se il td attuale è di tipo **EsTd**. In caso contrario è da considerarsi **EsTdDirective**
3019
- *
3020
- * @param {any} td Cella da valutare
3021
- * @returns {boolean} Restituisce **true** se il **td** è di tipo **EsTd**, **false** se è di tipo **EsTdDirective**
3022
- */
3023
- isEsTd(td) { return !td._directive; }
3024
- /**
3025
- * Helper che identifica se il th attuale è di tipo **EsTh**. In caso contrario è da considerarsi **EsThDirective**
3026
- *
3027
- * @param {any} td Header da valutare
3028
- * @returns {boolean} Restituisce **true** se il **th** è di tipo **EsTh**, **false** se è di tipo **EsThDirective**
3029
- */
3030
- isEsTh(th) { return !th._directive; }
3031
2682
  /**
3032
2683
  * Date le informazioni di paginazione ottiene l'array dei pulsanti
3033
2684
  *
@@ -3223,26 +2874,6 @@ class EsTableComponent {
3223
2874
  this.ColumnsResizable = null;
3224
2875
  /** Indica se dev'essere disponibile il sistema di aggiornamento automatico */
3225
2876
  this.AutoUpdate = null;
3226
- /** Indica se la tabella (configurata con **UseCustomCells**) deve mettersi in ascolto per i click sulle celle desiderate
3227
- *
3228
- * @deprecated Utilizzare l'Input **Template** delle es-td e assegnare un template con tutti i binding che si vuole ai click
3229
- */
3230
- this.UseCustomCellActions = null;
3231
- /**
3232
- * Indica le celle desiderate su cui intercettare i click. Attiva solo quando **UseCustomCellActions** è true.
3233
- * Ogni cella dev'essere separata dalla successiva dal carattere del Simoleon:
3234
- *
3235
- * Es, "MiaCella1§MiaCella2"
3236
- *
3237
- * @deprecated Utilizzare l'Input **Template** delle es-td e assegnare un template con tutti i binding che si vuole ai click
3238
- */
3239
- this.CustomCellActionsOn = '';
3240
- /**
3241
- * Serve per decidere di lanciare o meno il **event.stopPropagation()** al termine della gestione dell'evento
3242
- *
3243
- * @deprecated Utilizzare l'Input **Template** delle es-td e assegnare un template con tutti i binding che si vuole ai click
3244
- */
3245
- this.CellActionPropagates = true;
3246
2877
  /**
3247
2878
  * Decide se utilizzare o meno le CustomCells. Impostandolo a **true** l'es-table diventa in grado di gestire nativamente:
3248
2879
  *
@@ -3301,12 +2932,6 @@ class EsTableComponent {
3301
2932
  this.HasHeaderGroup = null;
3302
2933
  /** Indica la presenza di raggruppamenti a livello del raggruppamento precedentemente esistente, chiaramente è insensata senza **HasHeaderGroup** */
3303
2934
  this.HasSecondaryHeaderGroup = null;
3304
- /** Utilizzato per dividere la sorgente in modalità EndlessScroll */
3305
- this.SliceSize = 100;
3306
- /** Decide se utilizzare la modalità di EndlessScroll */
3307
- this.EndlessScroll = null;
3308
- /** Qualora **EndlessScroll** fosse true, indica se utilizzare questa modalità solo quando si cerca per "Tutti" o in generale */
3309
- this.EndlessScrollOnlyForAll = true;
3310
2935
  /** Indica se nascondere gli Header della tabella */
3311
2936
  this.HeaderHidden = null;
3312
2937
  /** Indica se nascondere il Body della tabella */
@@ -3389,11 +3014,6 @@ class EsTableComponent {
3389
3014
  this.onRemoval = new EventEmitter();
3390
3015
  /** Evento richiamato all'annullamento di un'eliminazione */
3391
3016
  this.onAbortRemoval = new EventEmitter();
3392
- /** Evento richiamato al click su una cella quando **UseCustomCellActions** è attivo
3393
- *
3394
- * @deprecated Utilizzare l'Input **Template** delle es-td e assegnare un template con tutti i binding che si vuole ai click
3395
- */
3396
- this.onCellClick = new EventEmitter();
3397
3017
  /** Evento richiamato quando si clicca su un opzione definita nelle **CornerMenuOptions** */
3398
3018
  this.onCornerAction = new EventEmitter();
3399
3019
  /** Evento richiamato quando si clicca su un opzione definita nelle **DynamicOperations** */
@@ -3480,10 +3100,6 @@ class EsTableComponent {
3480
3100
  }
3481
3101
  /** @ignore */
3482
3102
  ngOnInit() {
3483
- //Per poter cambiare il layout in base al livello gerarchico il componente deva avere il pieno controllo di ogni cella,
3484
- //che con solo la proiezione (senza celle cusotm) non è disponibile
3485
- if (this.Hierarchy && !this.UseCustomCells)
3486
- throw "Es-table error: Per poter utilizzare l'es-table con [Hierarchy]=\"true\" è richiesto anche [UseCustomCells]=\"true\"";
3487
3103
  // click destro su una riga con selezione attiva: Tiro fuori il context menu e selezione l'elemento corrente
3488
3104
  this.ctxMenuSubscription = (this.ContextMenu || this.tableEmptyMenu).open.subscribe(t => {
3489
3105
  // Gruppi va bene, oggetti pure, ma separatori fra gruppi proprio no...
@@ -3516,6 +3132,10 @@ class EsTableComponent {
3516
3132
  this.ShiftClick = true;
3517
3133
  this.DirectivesBased = true;
3518
3134
  }
3135
+ //Per poter cambiare il layout in base al livello gerarchico il componente deva avere il pieno controllo di ogni cella,
3136
+ //che con solo la proiezione (senza celle cusotm) non è disponibile
3137
+ if (this.Hierarchy && !this.UseCustomCells)
3138
+ throw "Es-table error: Per poter utilizzare l'es-table con [Hierarchy]=\"true\" è richiesto anche [UseCustomCells]=\"true\"";
3519
3139
  }
3520
3140
  /** @ignore */
3521
3141
  ngOnDestroy() {
@@ -3585,7 +3205,7 @@ class EsTableComponent {
3585
3205
  else if (!this.prefService)
3586
3206
  console.error("Non posso utilizzare le preference senza che il pacchetto @esfaenza/preferences sia installato");
3587
3207
  else {
3588
- var prefs = yield this.prefService.retrieve(this.ngControl.name).toPromise();
3208
+ var prefs = yield this.prefService.getItem(this.ngControl.name).toPromise();
3589
3209
  this.View.columns = (prefs === null || prefs === void 0 ? void 0 : prefs.columns) || [];
3590
3210
  this.View.column_ordering = (prefs === null || prefs === void 0 ? void 0 : prefs.column_ordering) || [];
3591
3211
  }
@@ -3608,7 +3228,7 @@ class EsTableComponent {
3608
3228
  else if (!this.prefService)
3609
3229
  console.error("Non posso utilizzare le preference senza che il pacchetto @esfaenza/preferences sia installato");
3610
3230
  else {
3611
- var prefs = yield this.prefService.retrieve(this.ngControl.name).toPromise();
3231
+ var prefs = yield this.prefService.getItem(this.ngControl.name).toPromise();
3612
3232
  this.arrayColumns = (prefs === null || prefs === void 0 ? void 0 : prefs.columns) || [];
3613
3233
  this.arrayColumnOrdering = (prefs === null || prefs === void 0 ? void 0 : prefs.column_ordering) || [];
3614
3234
  }
@@ -3627,30 +3247,12 @@ class EsTableComponent {
3627
3247
  */
3628
3248
  finalizeContext() {
3629
3249
  let viewCasted = this.View;
3630
- /*
3631
- *Uso la tecnica di EndlessScroll se la variabile relativa è attiva e se
3632
- * 1) Ho un Array, oppure
3633
- * 2) Ho un AppSearch che sta cercando con paginazione "Tutto", oppure
3634
- * 3) Ho un AppSearch che sta cercando con paginazione diversa da "Tutto" ma con la variabile EndlessScrollOnlyForAll a false
3635
- */
3636
- let isAppSearchWithIppMax = this.viewMode && viewCasted.itemsperpageoverride == this.defaultAllPageOverride;
3637
- let isAppSearchNoMaxIpp = this.viewMode && viewCasted.itemsperpageoverride != this.defaultAllPageOverride;
3638
- this.UseEndlessscroll = this.EndlessScroll && (this.arrayMode || isAppSearchWithIppMax || (isAppSearchNoMaxIpp && !this.EndlessScrollOnlyForAll));
3639
3250
  let hasRowGroups = (viewCasted.groupings && viewCasted.groupings.filter(t => !t.aggregation).length > 0) || (this.arrayMode && this.EsThsDirective.some(t => t.thGroup));
3640
3251
  // Se ho dei gruppi in modalità array devo sistemare un po' di variabili che diventano insensate
3641
3252
  if (this.arrayMode && hasRowGroups)
3642
3253
  this.UseArrayModePaging = false;
3643
3254
  // Riempimento della TMPBoundSource con gli oggetti che verranno poi mostrati ad interfaccia
3644
- if (this.UseEndlessscroll && !hasRowGroups) {
3645
- this.addedSlices = [];
3646
- this.boundSubSources = this.items_H.getItemSlices();
3647
- let firstSub = this.boundSubSources[0];
3648
- this.TMPBoundSource = firstSub ? firstSub : [];
3649
- if (firstSub)
3650
- this.addedSlices.push(0);
3651
- }
3652
- else
3653
- this.TMPBoundSource = this.items_H.getItemsByMode(false, !this.internalWriteCall);
3255
+ this.TMPBoundSource = this.items_H.getItemsByMode(false, !this.internalWriteCall);
3654
3256
  // Se ho una gerarchia, assegno i livelli gerarchici alla TMPBoundSource
3655
3257
  if (this.Hierarchy && !hasRowGroups)
3656
3258
  this.hierarchyMode_H.assignHierarchyLevels(this.TMPBoundSource);
@@ -3705,31 +3307,9 @@ class EsTableComponent {
3705
3307
  let rvc = this.ReportValues.count;
3706
3308
  this.PagerOptions.View = this.View;
3707
3309
  this.PagerOptions.PagerCount = rvc && rvc == -1 ? this.ReportValues.rows.length : rvc && rvc > 0 ? this.ReportValues.count : 0;
3708
- this.PagerOptions.ShowCount = this.PagerOptions.ShowCount || (this.View && this.View.result.count != -1);
3709
- this.PagerOptions.ShowButtons = this.PagerOptions.ShowButtons && (this.View.pagingavailable || this.PagerOptions.ShowCount);
3710
- this.PagerOptions.ShowPagingOptions = this.PagerOptions.ShowButtons;
3711
- }
3712
- }
3713
- /**
3714
- * Metodo che gestisce l'endless scroll e in base a quanto la tabella è stata scrollata aggiunge degli elementi extra a **TMPBoundSource**
3715
- *
3716
- * @param {any} e Evento di scroll del browser
3717
- */
3718
- onScroll(e) {
3719
- let tableViewHeight = e.target.offsetHeight;
3720
- let tableScrollHeight = e.target.scrollHeight;
3721
- let scrollLocation = e.target.scrollTop;
3722
- let buffer = 200;
3723
- let limit = tableScrollHeight - tableViewHeight - buffer;
3724
- if (scrollLocation > limit) {
3725
- let indexToAdd = Math.floor(this.TMPBoundSource.length / 100);
3726
- if (this.boundSubSources[indexToAdd] && this.addedSlices.indexOf(indexToAdd) == -1) {
3727
- // Devo ricordarmi di fare l'hash del nuovo pezzo
3728
- this.utilities_H.calculateHash(this.boundSubSources[indexToAdd]);
3729
- this.TMPBoundSource = this.TMPBoundSource.concat(this.boundSubSources[indexToAdd]);
3730
- this.addedSlices.push(indexToAdd);
3731
- setTimeout(() => { this.postBoundSourceCalculation(); });
3732
- }
3310
+ this.PagerOptions.ShowCount = this.PagerOptions.ShowCount || (this.View && this.View.result.count != -1);
3311
+ this.PagerOptions.ShowButtons = this.PagerOptions.ShowButtons && (this.View.pagingavailable || this.PagerOptions.ShowCount);
3312
+ this.PagerOptions.ShowPagingOptions = this.PagerOptions.ShowButtons;
3733
3313
  }
3734
3314
  }
3735
3315
  /**
@@ -3741,18 +3321,13 @@ class EsTableComponent {
3741
3321
  this.RowContexts = [];
3742
3322
  this.OrderDirectives = [];
3743
3323
  this.lastSelectedItemID = null;
3744
- if (this.EsThsDirective && this.EsThsDirective.length > 0 && this.EsTdsDirective && this.EsTdsDirective.length > 0)
3745
- this.internalPostBoundSource();
3746
- else {
3747
- this.cdr.detectChanges();
3748
- setTimeout(() => { this.internalPostBoundSource(); });
3749
- }
3324
+ this.internalPostBoundSource();
3750
3325
  }
3751
3326
  /** Per poter distinguere le chiamate a questo metodo: Dopo il setTimeout se uso gli EsTd/EsTh vecchi, senza il setTimeout se uso le nuove direttive */
3752
3327
  internalPostBoundSource() {
3753
3328
  let View = this.View;
3754
- let ths = this.EsThs && this.EsThs.length > 0 ? this.EsThs.toArray() : this.EsThsDirective && this.EsThsDirective.length > 0 ? this.EsThsDirective.toArray() : [];
3755
- let tds = this.EsTds && this.EsTds.length > 0 ? this.EsTds.toArray() : this.EsTdsDirective && this.EsTdsDirective.length > 0 ? this.EsTdsDirective.toArray() : [];
3329
+ let ths = this.EsThsDirective && this.EsThsDirective.length > 0 ? this.EsThsDirective.toArray() : [];
3330
+ let tds = this.EsTdsDirective && this.EsTdsDirective.length > 0 ? this.EsTdsDirective.toArray() : [];
3756
3331
  // Se non ho colonne dinamiche ma sono in modalità dinamica (lo capisco perché c'è una view piena di genericitem) metto il default delle colonne
3757
3332
  this.dynamicMode_H.eventuallyReviewDynamicColumns();
3758
3333
  this.bindDisplayToLoadedItemsOrGroups(View);
@@ -3887,8 +3462,8 @@ class EsTableComponent {
3887
3462
  *
3888
3463
  * Costo: 2 scan EsThs, 1 scan EsTds
3889
3464
  *
3890
- * @param {EsTh[] | EsThDirective[]} ths Colonne della tabella
3891
- * @param {EsTd[] | EsTdDirective[]} tds Celle della tabella
3465
+ * @param {EsThDirective[]} ths Colonne della tabella
3466
+ * @param {EsTdDirective[]} tds Celle della tabella
3892
3467
  */
3893
3468
  evaluateRowTds(ths, tds) {
3894
3469
  if (tds.length == 0)
@@ -3901,58 +3476,35 @@ class EsTableComponent {
3901
3476
  }
3902
3477
  for (let i = 0; i < ths.length; i++) {
3903
3478
  let th = ths[i];
3904
- thsCache[this.utilities_H.isEsTh(th) ? th.ID : th.th] = th;
3479
+ thsCache[th.th] = th;
3905
3480
  }
3906
3481
  this.TMPRowTDs = {};
3907
3482
  // Variabile d'appoggio per permettermi di inserire tutte le colonne "Fixed" davanti
3908
3483
  let contextFixeds = {};
3909
3484
  for (let i = 0; i < tds.length; i++) {
3910
3485
  let td = tds[i];
3911
- if (this.utilities_H.isEsTd(td)) {
3912
- let th = thsCache[td.ID];
3486
+ for (let i = 0; i < this.boundSource.length; i++) {
3487
+ let item = this.boundSource[i];
3488
+ let ctx = item._hash;
3489
+ let key = td.td;
3490
+ let th = thsCache[td.td];
3913
3491
  if (!!th)
3914
3492
  th._referenced = true;
3915
3493
  else
3916
- throw "ID dell'oggeto EsTd non compatibile con gli ID dicharati negli EsTh: " + td.ID;
3917
- let isFixed = (this.utilities_H.isEsTh(th) && th.Fixed) || (!this.utilities_H.isEsTh(th) && (th.thFixed || th.thGroup));
3918
- let itemToAdd = { GroupAggregation: false, GroupHeader: false, Wraps: true, ID: td.ID, Visible: td.Visible, Class: td.Class, Content: td.Content, RouterLink: td.RouterLink, Template: td.Template };
3919
- let ctx = td.Context;
3920
- if (this.TMPRowTDs[ctx]) {
3921
- if (isFixed)
3922
- this.TMPRowTDs[ctx].splice(0 + (contextFixeds[ctx]++), 0, itemToAdd);
3923
- else
3494
+ throw "ID dell'oggeto EsTd non compatibile con gli ID dicharati negli EsTh: " + td.td;
3495
+ if (td.tdIf || th.thGroup) {
3496
+ let thCasted = th;
3497
+ let isFixed = th.thFixed || th.thGroup || th.thPinned;
3498
+ let itemToAdd = item._item ?
3499
+ { 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 } :
3500
+ { 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) };
3501
+ if (this.TMPRowTDs[ctx]) {
3924
3502
  this.TMPRowTDs[ctx].push(itemToAdd);
3925
- }
3926
- else {
3927
- this.RowContexts.push(ctx);
3928
- this.TMPRowTDs[ctx] = [itemToAdd];
3929
- contextFixeds[ctx] = isFixed ? 1 : 0;
3930
- }
3931
- }
3932
- else {
3933
- for (let i = 0; i < this.boundSource.length; i++) {
3934
- let item = this.boundSource[i];
3935
- let ctx = item._hash;
3936
- let key = td.td;
3937
- let th = thsCache[td.td];
3938
- if (!!th)
3939
- th._referenced = true;
3940
- else
3941
- throw "ID dell'oggeto EsTd non compatibile con gli ID dicharati negli EsTh: " + td.td;
3942
- if (td.tdIf || (!this.utilities_H.isEsTh(th) && th.thGroup)) {
3943
- let thCasted = th;
3944
- let isFixed = (this.utilities_H.isEsTh(th) && th.Fixed) || (!this.utilities_H.isEsTh(th) && (th.thFixed || th.thGroup || th.thPinned));
3945
- let itemToAdd = item._item ?
3946
- { 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 } :
3947
- { 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) };
3948
- if (this.TMPRowTDs[ctx]) {
3949
- this.TMPRowTDs[ctx].push(itemToAdd);
3950
- }
3951
- else {
3952
- this.RowContexts.push(ctx);
3953
- this.TMPRowTDs[ctx] = [itemToAdd];
3954
- contextFixeds[ctx] = isFixed ? 1 : 0;
3955
- }
3503
+ }
3504
+ else {
3505
+ this.RowContexts.push(ctx);
3506
+ this.TMPRowTDs[ctx] = [itemToAdd];
3507
+ contextFixeds[ctx] = isFixed ? 1 : 0;
3956
3508
  }
3957
3509
  }
3958
3510
  }
@@ -3964,7 +3516,7 @@ class EsTableComponent {
3964
3516
  for (let i = 0; i < ths.length; i++) {
3965
3517
  let th = ths[i];
3966
3518
  if (!th._referenced)
3967
- errs.push(this.utilities_H.isEsTh(th) ? th.ID : th.th);
3519
+ errs.push(th.th);
3968
3520
  }
3969
3521
  if (errs.length > 0) {
3970
3522
  var errIds = errs.join(', ');
@@ -3978,7 +3530,7 @@ class EsTableComponent {
3978
3530
  *
3979
3531
  * Costo: 1 scan EsThs
3980
3532
  *
3981
- * @param {EsTh[] | EsThDirective[]} ths Colonne della tabella
3533
+ * @param {EsThDirective[]} ths Colonne della tabella
3982
3534
  */
3983
3535
  evaluateRowThs(ths) {
3984
3536
  if (ths.length == 0)
@@ -3991,18 +3543,10 @@ class EsTableComponent {
3991
3543
  columnsListCache[itm.id] = itm;
3992
3544
  }
3993
3545
  this.TMPRowTHs = [];
3994
- let fixed = 0;
3995
3546
  for (let i = 0; i < ths.length; i++) {
3996
3547
  let th = ths[i];
3997
3548
  let toAdd;
3998
- if (this.utilities_H.isEsTh(th)) {
3999
- toAdd = { Pinned: false, ID: th.ID, Visible: th.Visible, Class: th.Class, Order: th.Order, Orderable: th.Orderable, Template: null, Content: th.Description, Wrap: th.Wrap };
4000
- if (th.Fixed)
4001
- this.TMPRowTHs.splice(0 + (fixed++), 0, toAdd);
4002
- else
4003
- this.TMPRowTHs.push(toAdd);
4004
- }
4005
- else if (th.thIf || th.thGroup) {
3549
+ if (th.thIf || th.thGroup) {
4006
3550
  let thClass = (th.thClass || '') + (th.thGroup ? " est-col-min" : "");
4007
3551
  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 };
4008
3552
  this.TMPRowTHs.push(toAdd);
@@ -4251,21 +3795,6 @@ class EsTableComponent {
4251
3795
  // Riforzo il writevalue in modo che il codice passi dalla gestione come se fosse fatta ripartire una ricerca
4252
3796
  this.internalWriteValue();
4253
3797
  }
4254
- /**
4255
- * Gestore dei click sulle celle per le quali era impostata una azione custom da **CustomCellActionsOn**
4256
- *
4257
- * @param {string} name Nome della cella su cui si è fatto click
4258
- * @param {any} model Modello relativo alla cella cliccata
4259
- *
4260
- * @returns {boolean} **true** se il click è stato fatto su una cella cliccabile, **false** altrimenti
4261
- */
4262
- cellClicked(name, model) {
4263
- if (this.UseCustomCellActions && this.CustomCellActionsOn.split('$').indexOf(name) != -1) {
4264
- this.onCellClick.emit({ column: name, model: model });
4265
- return true;
4266
- }
4267
- return false;
4268
- }
4269
3798
  /**
4270
3799
  * Gestione dei click sulle opzioni del menù contestuale in alto a destra generato dall'Input **CornerMenuOptions**
4271
3800
  *
@@ -4323,7 +3852,7 @@ EsTableComponent.decorators = [
4323
3852
  viewProviders: [{ provide: LocalizationService, useClass: EsTableLoc }],
4324
3853
  changeDetection: ChangeDetectionStrategy.OnPush,
4325
3854
  encapsulation: ViewEncapsulation.None,
4326
- 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<!--\r\nI TH sono contenuto statico, questo significa che senza condizione per RowTHs arriverebbero sia qui sia nell ng-container dell'header in fase non inizializzata, duplicando fisicamente le colonne.\r\nPer ovviare al problema, questo pezzo lo faccio apparire solo se ci sono gi\u00E0 dei RowTHs, quindi su valorizzazione della View succeder\u00E0:\r\n1) appaiono i th nell' ng-container dell'header, e NON qui\r\n2) i TH vengono presi, elaborati e trasformati in RowTHs\r\n3) l'ng-container dell'header sparisce (per la condizione !UseCustomCells || !RowTHs) e qui appaiono i nuovi TH (che poi sono gli stessi di prima che girano)\r\n4) Vengono presi i nuovi TH da qui e trasformati a loro volta in RowTHs\r\n-->\r\n<div hidden *ngIf=\"UseCustomCells && RowTHs\">\r\n <ng-container *ngIf=\"View\">\r\n <!--Qui invece ci sono tutti i TH-->\r\n <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\r\n </ng-container>\r\n</div>\r\n\r\n<!--\r\nQuesta parte \u00E8 un po' pi\u00F9 semplice del sopra. Infatti i TD vengono s\u00EC bindati in entrambi i punti (qui e nell'ng-container del body), ma avr\u00F2 le TD statiche prima di generare la TMPBoundSource.\r\nQuesto significa che il workflow di binding sar\u00E0:\r\n1) Appaiono i TD statici nel body e NON qui, perch\u00E9 i TMPBoundSource non sono ancora stati emessi\r\n2) Contemporaneamente all'emissione dei TMPBoundSource vengono anche emessi i RowTds\r\n3) Considerando il punto 2, al giro dopo appariranno i TD qui, perch\u00E9 \u00E8 stata generata la TMPBoundSource, e spariranno contemporaneamente dall'ng-container del body (per la condizione !UseCustomCells || !RowTDs)\r\n-->\r\n<div hidden *ngIf=\"UseCustomCells && bodyRef\">\r\n <ng-container *ngIf=\"View\">\r\n <!--Tutti i TD che dopo verranno presi ed elaborati internamente-->\r\n <ng-container *ngFor=\"let item of TMPBoundSource\">\r\n <ng-container *ngTemplateOutlet=\"bodyRef; context : {$implicit: item}\"></ng-container>\r\n </ng-container>\r\n </ng-container>\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}}\" [class.est-scrollable]=\"UseEndlessscroll\" (scroll)=\"UseEndlessscroll && onScroll($event)\" [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'}}\"\r\n [class.est-pointer]=\"UseCustomCellActions && CustomCellActionsOn.indexOf('$' + rowItem.propertyName + '$') != -1\"\r\n (click)=\"cellClicked(rowItem.propertyName, item) && !CellActionPropagates && $event.stopPropagation()\"\r\n [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-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\" [class.est-pointer]=\"UseCustomCellActions && CustomCellActionsOn.indexOf('$' + $any(rowItem).ID + '$') != -1\" (click)=\"cellClicked(rowItem.ID, item) && !CellActionPropagates && $event.stopPropagation()\" [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\" *ngIf=\"ColumnsOrdering\">\r\n <span class=\"fa fa-arrow-up\" [class.est-hidden-view]=\"item.fixed || item.pinned\" (click)=\"lastSelectedItemID = item.id; i != 0 && !item.fixed && columnMetadata_H.sendUp(item); $event.stopPropagation();\"></span>\r\n <span class=\"fa fa-arrow-down\" [class.est-hidden-view]=\"item.fixed || item.pinned\" (click)=\"lastSelectedItemID = item.id; !last && !item.fixed && columnMetadata_H.sendDown(item); $event.stopPropagation();\"></span>\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\"><span *ngIf=\"!item.fixed\" 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>",
3855
+ 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\" [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\" *ngIf=\"ColumnsOrdering\">\r\n <span class=\"fa fa-arrow-up\" [class.est-hidden-view]=\"item.fixed || item.pinned\" (click)=\"lastSelectedItemID = item.id; i != 0 && !item.fixed && columnMetadata_H.sendUp(item); $event.stopPropagation();\"></span>\r\n <span class=\"fa fa-arrow-down\" [class.est-hidden-view]=\"item.fixed || item.pinned\" (click)=\"lastSelectedItemID = item.id; !last && !item.fixed && columnMetadata_H.sendDown(item); $event.stopPropagation();\"></span>\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\"><span *ngIf=\"!item.fixed\" 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>",
4327
3856
  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:0;left:6px;bottom:0;width:1px;position:absolute;background-color:#ccc;height:100%}.est-pointer{cursor:pointer}.est-high-density td,.est-high-density th{padding:0 .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-13,.est-fs-14{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{cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc}.est-slider,.est-slider:before{position:absolute;transition:.4s}.est-slider:before{content:\"\";height:13px;width:13px;left:3px;bottom:2px;background-color:#fff}input:checked+.est-slider{background-color:#2196f3}input:focus+.est-slider{box-shadow:0 0 1px #2196f3}input:checked+.est-slider:before{transform:translateX(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-next,.est-page-prev{color:#000;font-size:inherit;padding:2px 0 0}.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:0 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:hsla(0,0%,46.7%,.4666666666666667)!important}.est-rg-sep{font-size:12px;padding-right:20px!important;background-color:hsla(0,0%,73.3%,.7333333333333333)!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 rgba(0,0,0,.2),0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12)}.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,.est-droplist.cdk-drop-list-dragging .est-dropbox:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}"]
4328
3857
  },] }
4329
3858
  ];
@@ -4343,8 +3872,6 @@ EsTableComponent.ctorParameters = () => [
4343
3872
  EsTableComponent.propDecorators = {
4344
3873
  EsTdsDirective: [{ type: ContentChildren, args: [EsTdDirective,] }],
4345
3874
  EsThsDirective: [{ type: ContentChildren, args: [EsThDirective,] }],
4346
- EsThs: [{ type: ContentChildren, args: [forwardRef(() => EsTh),] }],
4347
- EsTds: [{ type: ContentChildren, args: [forwardRef(() => EsTd),] }],
4348
3875
  bodyRef: [{ type: ContentChild, args: ['body', { static: false },] }],
4349
3876
  headerRef: [{ type: ContentChild, args: ['header', { static: false },] }],
4350
3877
  headerGroupRef: [{ type: ContentChild, args: ['headerGroup', { static: false },] }],
@@ -4352,9 +3879,6 @@ EsTableComponent.propDecorators = {
4352
3879
  CornerMenuOptions: [{ type: Input }],
4353
3880
  ColumnsResizable: [{ type: Input }],
4354
3881
  AutoUpdate: [{ type: Input }],
4355
- UseCustomCellActions: [{ type: Input }],
4356
- CustomCellActionsOn: [{ type: Input }],
4357
- CellActionPropagates: [{ type: Input }],
4358
3882
  UseCustomCells: [{ type: Input }],
4359
3883
  MaxHeight: [{ type: Input }],
4360
3884
  ContainerClass: [{ type: Input }],
@@ -4378,9 +3902,6 @@ EsTableComponent.propDecorators = {
4378
3902
  ExportFunction: [{ type: Input }],
4379
3903
  HasHeaderGroup: [{ type: Input }],
4380
3904
  HasSecondaryHeaderGroup: [{ type: Input }],
4381
- SliceSize: [{ type: Input }],
4382
- EndlessScroll: [{ type: Input }],
4383
- EndlessScrollOnlyForAll: [{ type: Input }],
4384
3905
  HeaderHidden: [{ type: Input }],
4385
3906
  BodyHidden: [{ type: Input }],
4386
3907
  SelectionDisabled: [{ type: Input }],
@@ -4411,7 +3932,6 @@ EsTableComponent.propDecorators = {
4411
3932
  onSelectionChanged: [{ type: Output }],
4412
3933
  onRemoval: [{ type: Output }],
4413
3934
  onAbortRemoval: [{ type: Output }],
4414
- onCellClick: [{ type: Output }],
4415
3935
  onCornerAction: [{ type: Output }],
4416
3936
  onDynamicOperation: [{ type: Output }],
4417
3937
  exportDownloader: [{ type: ViewChild, args: ['exportDownloader', { static: false },] }],
@@ -4541,6 +4061,235 @@ TablePagerComponent.propDecorators = {
4541
4061
  pagingSelected: [{ type: Output }]
4542
4062
  };
4543
4063
 
4064
+ //Angular
4065
+ /** Componente rappresentante una Colonna della tabella */
4066
+ class EsTh {
4067
+ /** @ignore */
4068
+ constructor(myself, renderer) {
4069
+ this.myself = myself;
4070
+ this.renderer = renderer;
4071
+ /** Dizionario di mappatura con ordinamento attuale e ordinamento successivo per gestire i passaggi di stato */
4072
+ this.orderNext = { "NONE": "DESC", "DESC": "ASC", "ASC": null };
4073
+ /** Indica se si sta effettuando un'operazione di resize su questa colonna */
4074
+ this.resizingThis = false;
4075
+ /**
4076
+ * Storicizza l'offset di partenza del resize dell'elemento HTML per poter calcolare la nuova dimensione richiesta durente il resize
4077
+ *
4078
+ * nuova width = startOffset + posizione X del mouse
4079
+ */
4080
+ this.startOffset = null;
4081
+ /** Id della colonna, dev'essere lo stesso per tutti gli **EsTd** relativi */
4082
+ this.ID = "";
4083
+ /** Indica se questa colonna è ordinabile o meno */
4084
+ this.Orderable = true;
4085
+ /** Valore da mostrare all'interno della colonna. Se omesso verrà proiettato il contenuto dal template in cui è stata usata */
4086
+ this.Display = "";
4087
+ /** Indica se le dimnsioni di questa colonna sono modificabili o meno */
4088
+ this.Resizable = false;
4089
+ /** Indica se questo header è pinnato. In caso lo fosse presenta il tastino per effettuare lo spinning */
4090
+ this.Pinned = false;
4091
+ /**
4092
+ * Indica se sta venendo eseguita una operazione di ricerca o meno, serve per evitare l'esecuzione di eventuale codice che potrebbe dare fastidio
4093
+ * come ad esempio l'escuzione di un ordinamento durante il caricamento di dati nuovi
4094
+ */
4095
+ this.SearchInProgress = false;
4096
+ /** Indica se il testo presente in questo Header può andare a capo o meno, di default non può */
4097
+ this.Wrap = false;
4098
+ /** Indica se la colonna è fixed, cioè se non può né essere nascosta, né riposizionata. Solo le prime colonne possono essere Fixed */
4099
+ this.Fixed = false;
4100
+ /** Template Angular da istanziare per questo TH */
4101
+ this.Template = null;
4102
+ /** Evento emesso al cambio di ordinamento effettuato su questa colonna */
4103
+ this.onOrderChange = new EventEmitter();
4104
+ /** Evento emesso all'unpinning della colonna */
4105
+ this.onUnpinning = new EventEmitter();
4106
+ /** Impostato dall'**EsTable**, per controllare che ci sia almeno un TD che utilizzi quest'header */
4107
+ this._referenced = false;
4108
+ }
4109
+ /**
4110
+ * Imposta la visibilità o meno della colonna, si traduce nell'applicazione o rimozione della classe **app-display-none**
4111
+ *
4112
+ * @param {boolean} expression Indicazione della visibilità
4113
+ */
4114
+ set Visible(expression) {
4115
+ this._Visible = expression;
4116
+ if (expression)
4117
+ this.renderer.removeClass(this.myself.nativeElement, "app-display-none");
4118
+ else
4119
+ this.renderer.addClass(this.myself.nativeElement, "app-display-none");
4120
+ }
4121
+ /**
4122
+ * Restituisce lo stato di Visibilità della colonna in oggetto
4123
+ *
4124
+ * @returns {boolean} **true** se visibile, **false** altrimenti
4125
+ */
4126
+ get Visible() {
4127
+ if (this._Visible == undefined)
4128
+ this._Visible = true;
4129
+ return this._Visible;
4130
+ }
4131
+ /** @ignore */
4132
+ ngAfterViewInit() {
4133
+ //Assegnare direttamente il content è più veloce che passare dal native element per qualche motivo
4134
+ this.Description = this.Display === null || this.Display === "" ? this.content.nativeElement.innerText : this.Display;
4135
+ this.Class = this.myself.nativeElement.className.replace("app-display-none", "");
4136
+ //Resize
4137
+ if (this.Resizable)
4138
+ this.renderer.addClass(this.myself.nativeElement, "app-relative");
4139
+ }
4140
+ /** Emette l'evento di unpinning */
4141
+ unpin() {
4142
+ this.onUnpinning.emit(this.ID);
4143
+ }
4144
+ /** Gestisce la modifica dell'ordinamento qualora venisse cliccato su questa colonna */
4145
+ setupNextOrderAndNotify() {
4146
+ if (!this.ID) {
4147
+ console.log("Attempt to order a column without ID. Operation ignored");
4148
+ return;
4149
+ }
4150
+ if (this.SearchInProgress) {
4151
+ console.log("Attempt to order a column during a search. Operation ignored");
4152
+ return;
4153
+ }
4154
+ if (!this.OrderBy || !this.Orderable)
4155
+ return;
4156
+ var nextOrder = this.orderNext[this.Order || "NONE"];
4157
+ this.Order = nextOrder;
4158
+ this.onOrderChange.emit(this.Order);
4159
+ }
4160
+ /**
4161
+ * Evento di inizio resize della colonna
4162
+ *
4163
+ * @param {any} ev Evento MouseDown
4164
+ */
4165
+ onResizeStart(ev) {
4166
+ if (!this.Resizable)
4167
+ return;
4168
+ this.resizingThis = true;
4169
+ this.startOffset = this.myself.nativeElement.offsetWidth - ev.pageX;
4170
+ }
4171
+ /** Listener per la fine dell'operazione di resize */
4172
+ onMouseUp() {
4173
+ if (!this.Resizable)
4174
+ return;
4175
+ this.resizingThis = false;
4176
+ }
4177
+ /**
4178
+ * Listener per gestire il movimento del mouse qualora un'operazione di resize fosse in esecuzione
4179
+ *
4180
+ * @param {$event} ev Evento MouseMove
4181
+ */
4182
+ onMouseMove($event) {
4183
+ if (!this.Resizable || !this.resizingThis)
4184
+ return;
4185
+ //Uso jquery per non dover far partire un intero ciclo di change detection solo per fare un resize del cazzo
4186
+ //(anche perché viene lanciato ogni 0.1 secondo quindi not a good idea)
4187
+ this.myself.nativeElement.style.width = (this.startOffset + $event.pageX) + "px";
4188
+ //Fermo il bubbling per non fare cose strane
4189
+ $event.preventDefault();
4190
+ }
4191
+ }
4192
+ EsTh.decorators = [
4193
+ { type: Component, args: [{
4194
+ selector: "[es-th]",
4195
+ 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>",
4196
+ changeDetection: ChangeDetectionStrategy.OnPush
4197
+ },] }
4198
+ ];
4199
+ EsTh.ctorParameters = () => [
4200
+ { type: ElementRef },
4201
+ { type: Renderer2 }
4202
+ ];
4203
+ EsTh.propDecorators = {
4204
+ ID: [{ type: Input, args: ['es-th',] }],
4205
+ Order: [{ type: Input }],
4206
+ Orderable: [{ type: Input }],
4207
+ Display: [{ type: Input }],
4208
+ Resizable: [{ type: Input }],
4209
+ Pinned: [{ type: Input }],
4210
+ SearchInProgress: [{ type: Input }],
4211
+ OrderBy: [{ type: Input }],
4212
+ Wrap: [{ type: Input }],
4213
+ Fixed: [{ type: Input }],
4214
+ Template: [{ type: Input }],
4215
+ onOrderChange: [{ type: Output }],
4216
+ onUnpinning: [{ type: Output }],
4217
+ content: [{ type: ViewChild, args: ["content", { static: false },] }],
4218
+ Visible: [{ type: Input }],
4219
+ onMouseUp: [{ type: HostListener, args: ['window:mouseup.out-zone',] }],
4220
+ onMouseMove: [{ type: HostListener, args: ['window:mousemove.out-zone', ['$event'],] }]
4221
+ };
4222
+
4223
+ //Angular
4224
+ /** Componente rappresentante una singola cella del body della tabella */
4225
+ class EsTd {
4226
+ /** @ignore */
4227
+ constructor(myself, renderer, _viewContainer, sanitizer) {
4228
+ this.myself = myself;
4229
+ this.renderer = renderer;
4230
+ this._viewContainer = _viewContainer;
4231
+ this.sanitizer = sanitizer;
4232
+ /** Id della cella, dev'essere lo stesso della colonna **EsTh** relativa */
4233
+ this.ID = "";
4234
+ /** Valore da mostrare all'interno della cella. Se omesso verrà proiettato il contenuto dal template in cui è stata usata */
4235
+ this.Display = null;
4236
+ /** Template Angular da istanziare per questo TD */
4237
+ this.Template = null;
4238
+ }
4239
+ /**
4240
+ * Imposta la visibilità o meno della cella, si traduce nell'applicazione o rimozione della classe **app-display-none**
4241
+ *
4242
+ * @param {boolean} expression Indicazione della visibilità
4243
+ */
4244
+ set Visible(expression) {
4245
+ this._Visible = expression;
4246
+ if (expression)
4247
+ this.renderer.removeClass(this.myself.nativeElement, "app-display-none");
4248
+ else
4249
+ this.renderer.addClass(this.myself.nativeElement, "app-display-none");
4250
+ }
4251
+ /**
4252
+ * Restituisce lo stato di Visibilità della cella in oggetto
4253
+ *
4254
+ * @returns {boolean} **true** se visibile, **false** altrimenti
4255
+ */
4256
+ get Visible() {
4257
+ if (this._Visible == undefined)
4258
+ this._Visible = true;
4259
+ return this._Visible;
4260
+ }
4261
+ /** @ignore */
4262
+ ngAfterViewInit() {
4263
+ // Se è Internal significa che è gestita internamente da ES-TABLE quindi evito di fare sti due passaggi di lettura del DOM
4264
+ if (this.Internal)
4265
+ return;
4266
+ this.Content = this.Display === null || this.Display === "" ? this.sanitizer.bypassSecurityTrustHtml(this.myself.nativeElement.innerHTML) : this.sanitizer.bypassSecurityTrustHtml(this.Display);
4267
+ this.Class = this.myself.nativeElement.className.replace("app-display-none", "");
4268
+ }
4269
+ }
4270
+ EsTd.decorators = [
4271
+ { type: Component, args: [{
4272
+ selector: "[es-td]",
4273
+ template: "<span>\r\n <ng-content></ng-content>\r\n</span>",
4274
+ changeDetection: ChangeDetectionStrategy.OnPush
4275
+ },] }
4276
+ ];
4277
+ EsTd.ctorParameters = () => [
4278
+ { type: ElementRef },
4279
+ { type: Renderer2 },
4280
+ { type: ViewContainerRef },
4281
+ { type: DomSanitizer }
4282
+ ];
4283
+ EsTd.propDecorators = {
4284
+ ID: [{ type: Input, args: ['es-td',] }],
4285
+ Internal: [{ type: Input }],
4286
+ RouterLink: [{ type: Input }],
4287
+ Display: [{ type: Input }],
4288
+ Template: [{ type: Input }],
4289
+ Context: [{ type: Input }],
4290
+ Visible: [{ type: Input }]
4291
+ };
4292
+
4544
4293
  class EsTableModule {
4545
4294
  static forRoot(config) {
4546
4295
  return {
@@ -4569,7 +4318,7 @@ EsTableModule.decorators = [
4569
4318
  ],
4570
4319
  declarations: [EsTh, EsTd, EsTableComponent, EsTdDirective, EsThDirective, TablePagerComponent],
4571
4320
  providers: [UtilityService, ExportService, HashingService, MessageService],
4572
- exports: [EsTh, EsTd, EsTableComponent, EsTdDirective, EsThDirective, TablePagerComponent]
4321
+ exports: [EsTableComponent, EsTdDirective, EsThDirective, TablePagerComponent]
4573
4322
  },] }
4574
4323
  ];
4575
4324
 
@@ -4581,5 +4330,5 @@ EsTableModule.decorators = [
4581
4330
  * Generated bundle index. Do not edit.
4582
4331
  */
4583
4332
 
4584
- export { AppOrdering, AppSearch, CornerMenuOption, EsTableColumnsDefinition, EsTableComponent, EsTableDefaultable, EsTableModule, EsTableModuleConfig, EsTableOperationDefinition, EsTd, EsTh, GenericItem, Group, GroupAggregation, GroupFilter, GroupOrAggregation, ItemsSelection, ReportColumn, ReportDefinition, ReportOrder, ReportParam, ReportResult, ReportRow, EsTableLoc as ɵa, EST_LOCALE as ɵb, EST_DEBUG as ɵc, EST_DEFAULTS as ɵd, UtilitiesHandler as ɵe, EsTdDirective as ɵf, EsThDirective as ɵg, TablePagerComponent as ɵh, TablePagerLoc as ɵi };
4333
+ export { AppOrdering, AppSearch, CornerMenuOption, EsTableColumnsDefinition, EsTableComponent, EsTableDefaultable, EsTableModule, EsTableModuleConfig, EsTableOperationDefinition, EsTdDirective, EsThDirective, GenericItem, Group, GroupAggregation, GroupFilter, GroupOrAggregation, ItemsSelection, ReportColumn, ReportDefinition, ReportOrder, ReportParam, ReportResult, ReportRow, EsTableLoc as ɵa, EST_LOCALE as ɵb, EST_DEBUG as ɵc, EST_DEFAULTS as ɵd, UtilitiesHandler as ɵe, EsTh as ɵf, EsTd as ɵg, TablePagerComponent as ɵh, TablePagerLoc as ɵi };
4585
4334
  //# sourceMappingURL=esfaenza-es-table.js.map