@esfaenza/es-table 19.2.4 → 19.2.6
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, EventEmitter,
|
|
2
|
+
import { Injectable, input, EventEmitter, signal, computed, effect, Output, ChangeDetectionStrategy, ViewEncapsulation, Component, Input, Self, Directive, Optional, ContentChildren, InjectionToken, Inject, HostListener, ViewChild, Pipe, ContentChild, NgModule } from '@angular/core';
|
|
3
3
|
import * as i2 from '@esfaenza/localizations';
|
|
4
4
|
import { LocalizationService, LocalizationModule } from '@esfaenza/localizations';
|
|
5
5
|
import * as i5 from '@esfaenza/extensions';
|
|
@@ -54,44 +54,48 @@ class TablePagerComponent {
|
|
|
54
54
|
this.msgExts = msgExts;
|
|
55
55
|
this.lc = lc;
|
|
56
56
|
this.cdr = cdr;
|
|
57
|
+
/** Dimensione di pagina attuale */
|
|
58
|
+
this.CurrentPageSize = input(null);
|
|
59
|
+
/** View gestita, che può essere un IAppSearch o una ReportView */
|
|
60
|
+
this.View = input();
|
|
57
61
|
/** Indica se deve mostrare un warning quando si cercano di solezionare come elementi da visualizzare "Tutti" */
|
|
58
|
-
this.WarnOnAll = true;
|
|
62
|
+
this.WarnOnAll = input(true);
|
|
59
63
|
/** Indica se dare la possibilità o meno di selezionare "Tutti" nelle opzioni di paginazione */
|
|
60
|
-
this.AllSearch = true;
|
|
64
|
+
this.AllSearch = input(true);
|
|
61
65
|
/** Placeholder che identifica il "Tutti" */
|
|
62
|
-
this.DefaultAll = 999999;
|
|
66
|
+
this.DefaultAll = input(999999);
|
|
63
67
|
/** Indica se attivare la modalità gruppo con stili più snelli per apparire sotto ai raggruppamenti */
|
|
64
|
-
this.GroupMode = false;
|
|
68
|
+
this.GroupMode = input(false);
|
|
65
69
|
/** Indica se utilizzare il conteggio dei gruppi o degli oggetti */
|
|
66
|
-
this.GroupCount = false;
|
|
70
|
+
this.GroupCount = input(false);
|
|
67
71
|
/** Indica il testo che va a sostituire "Oggetti Visualizzati" in caso si stia facendo qualcosa di custom, Ignorato in caso di gruppi */
|
|
68
|
-
this.CountLabel = null;
|
|
72
|
+
this.CountLabel = input(null);
|
|
69
73
|
/** Indica se visualizzare il numero totale di oggeti presenti */
|
|
70
|
-
this.ShowCount = true;
|
|
74
|
+
this.ShowCount = input(true);
|
|
71
75
|
/** Indica se visualizzare il numero totale di oggeti presenti */
|
|
72
|
-
this.ShowPaging = true;
|
|
76
|
+
this.ShowPaging = input(true);
|
|
77
|
+
/** Indica il numero totale di oggeti presenti */
|
|
78
|
+
this.PagerCount = input(undefined);
|
|
79
|
+
/** Indica se mostrare o meno il contenuto @deprecated usata solo da MatrixValuesComponent nella lib relativa */
|
|
80
|
+
this.Hidden = input(false);
|
|
73
81
|
/** Output invocato quando il numero di elementi per pagina viene modificato da un click utente */
|
|
74
82
|
this.pagingSelected = new EventEmitter();
|
|
83
|
+
/** Modello su cui la select effettua operazioni di selezione */
|
|
84
|
+
this.Model = signal(null);
|
|
75
85
|
/** Opzioni di paginazione */
|
|
76
|
-
this.
|
|
77
|
-
this.PagingOptionsForSelect =
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
86
|
+
this._pagingOptions = [10, 15, 30, 45, 100];
|
|
87
|
+
this.PagingOptionsForSelect = computed(() => {
|
|
88
|
+
let defAllValue = this.DefaultAll();
|
|
89
|
+
let availableOptions = this._pagingOptions.filter(pOpt => pOpt == defAllValue || this.PagerCount() >= pOpt || this.PagerCount() == -1);
|
|
90
|
+
if (this.AllSearch())
|
|
91
|
+
availableOptions.push(defAllValue);
|
|
92
|
+
return availableOptions.map(p => { return { description: p == defAllValue ? this.lc.loc("All") : p.toString(), id: p }; });
|
|
93
|
+
});
|
|
94
|
+
effect(() => {
|
|
95
|
+
let vv = this.View();
|
|
96
|
+
let newModel = vv ? (vv.itemsperpageoverride || 15) : this.CurrentPageSize();
|
|
97
|
+
this.Model.set(newModel);
|
|
87
98
|
});
|
|
88
|
-
}
|
|
89
|
-
/** @ignore */
|
|
90
|
-
ngOnChanges(changes) {
|
|
91
|
-
let newView = changes['View'];
|
|
92
|
-
let newCPS = changes['CurrentPageSize'];
|
|
93
|
-
if ((newView && !newView.firstChange) || (newCPS && !newCPS.firstChange))
|
|
94
|
-
this.Model = newView?.currentValue ? (newView.currentValue.itemsperpageoverride || 15) : newCPS?.currentValue ? newCPS.currentValue : null;
|
|
95
99
|
}
|
|
96
100
|
/**
|
|
97
101
|
* Funzione richiamata dal template quando un utente clicca su un numero di paginazione.
|
|
@@ -101,52 +105,24 @@ class TablePagerComponent {
|
|
|
101
105
|
* @param {number} pageSize Dimensione selezionata lato UI
|
|
102
106
|
*/
|
|
103
107
|
choice(pageSize) {
|
|
104
|
-
if (pageSize == this.DefaultAll && this.WarnOnAll) {
|
|
105
|
-
this.msgExts.simpleWarningWithChoice(this.lc.loc("Are you sure you want to retrieve all results?"), this.lc.loc("This might slow down the page and possibly crash the entire application"), () => {
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
this.Model = null;
|
|
109
|
-
this.cdr.detectChanges();
|
|
110
|
-
this.Model = prevModel;
|
|
111
|
-
this.cdr.detectChanges();
|
|
108
|
+
if (pageSize == this.DefaultAll() && this.WarnOnAll) {
|
|
109
|
+
this.msgExts.simpleWarningWithChoice(this.lc.loc("Are you sure you want to retrieve all results?"), this.lc.loc("This might slow down the page and possibly crash the entire application"), () => {
|
|
110
|
+
this.pagingSelected.emit(pageSize);
|
|
111
|
+
this.Model.set(pageSize);
|
|
112
112
|
});
|
|
113
113
|
}
|
|
114
114
|
else {
|
|
115
115
|
this.pagingSelected.emit(pageSize);
|
|
116
|
-
this.Model
|
|
116
|
+
this.Model.set(pageSize);
|
|
117
117
|
}
|
|
118
118
|
}
|
|
119
119
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TablePagerComponent, deps: [{ token: i5.MessageService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
120
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
120
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.14", type: TablePagerComponent, isStandalone: false, selector: "app-paging", inputs: { CurrentPageSize: { classPropertyName: "CurrentPageSize", publicName: "CurrentPageSize", isSignal: true, isRequired: false, transformFunction: null }, View: { classPropertyName: "View", publicName: "View", isSignal: true, isRequired: false, transformFunction: null }, WarnOnAll: { classPropertyName: "WarnOnAll", publicName: "WarnOnAll", isSignal: true, isRequired: false, transformFunction: null }, AllSearch: { classPropertyName: "AllSearch", publicName: "AllSearch", isSignal: true, isRequired: false, transformFunction: null }, DefaultAll: { classPropertyName: "DefaultAll", publicName: "DefaultAll", isSignal: true, isRequired: false, transformFunction: null }, GroupMode: { classPropertyName: "GroupMode", publicName: "GroupMode", isSignal: true, isRequired: false, transformFunction: null }, GroupCount: { classPropertyName: "GroupCount", publicName: "GroupCount", isSignal: true, isRequired: false, transformFunction: null }, CountLabel: { classPropertyName: "CountLabel", publicName: "CountLabel", isSignal: true, isRequired: false, transformFunction: null }, ShowCount: { classPropertyName: "ShowCount", publicName: "ShowCount", isSignal: true, isRequired: false, transformFunction: null }, ShowPaging: { classPropertyName: "ShowPaging", publicName: "ShowPaging", isSignal: true, isRequired: false, transformFunction: null }, PagerCount: { classPropertyName: "PagerCount", publicName: "PagerCount", isSignal: true, isRequired: false, transformFunction: null }, Hidden: { classPropertyName: "Hidden", publicName: "Hidden", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pagingSelected: "pagingSelected" }, ngImport: i0, template: "<div *ngIf=\"!Hidden()\" [class.est-mt-4]=\"ShowCount() && PagerCount() != -1 && !(ShowPaging() && (Model() == DefaultAll() || PagerCount() >= Model() || PagerCount() == -1))\">\r\n <span class=\"est-fs-14\"> {{CountLabel() && !GroupMode() ? CountLabel() : ((GroupMode() ? 'Shown Groups' : 'Shown Elements') | localize : lc)}}: </span>\r\n <ng-container *ngIf=\"ShowPaging() && (Model() == DefaultAll() || PagerCount() >= Model() || PagerCount() == -1)\">\r\n\r\n <p-select \r\n style=\"width: 95px\"\r\n size=\"small\"\r\n name=\"input\"\r\n appendTo=\"body\"\r\n [options]=\"PagingOptionsForSelect()\"\r\n optionLabel=\"description\"\r\n optionValue=\"id\"\r\n [ngModel]=\"Model()\"\r\n (ngModelChange)=\"choice($event)\"\r\n />\r\n\r\n <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount() && PagerCount() != -1\"> / </span>\r\n </ng-container>\r\n <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount() && PagerCount() != -1\">{{PagerCount() | number : '0.0-0' : lc.Locale}}</span>\r\n</div>", styles: [".est-rg-ipp-sel-all,.est-rg-ipp-sel,.est-ipp-sel-all,.est-ipp-sel{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block;display:inline}.est-ipp-bold{font-weight:700}.mat-paginator-page-size-select{margin:6px 4px 0;width:50px}.mat-paginator-page-size-select .mat-form-field-wrapper{height:52px!important;margin-top:-15px!important;padding:0!important}.mat-form-field-type-mat-native-select .mat-form-field-infix:after{margin-top:-5.5px!important}\n"], dependencies: [{ kind: "directive", type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "pipe", type: i8.DecimalPipe, name: "number" }, { kind: "pipe", type: i2.LocalizePipe, name: "localize" }], viewProviders: [{ provide: LocalizationService, useClass: TablePagerLoc }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
121
121
|
}
|
|
122
122
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TablePagerComponent, decorators: [{
|
|
123
123
|
type: Component,
|
|
124
|
-
args: [{ selector: "app-paging", viewProviders: [{ provide: LocalizationService, useClass: TablePagerLoc }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div *ngIf=\"!Hidden\" [class.est-mt-4]=\"ShowCount && PagerCount != -1 && !(ShowPaging && (Model == DefaultAll || PagerCount >= Model || PagerCount == -1))\">\r\n <span class=\"est-fs-14\"> {{CountLabel && !GroupMode ? CountLabel : ((GroupMode ? 'Shown Groups' : 'Shown Elements') | localize : lc)}}: </span>\r\n <ng-container *ngIf=\"ShowPaging && (Model == DefaultAll || PagerCount >= Model || PagerCount == -1)\">\r\n
|
|
125
|
-
}], ctorParameters: () => [{ type: i5.MessageService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }], propDecorators: {
|
|
126
|
-
type: Input
|
|
127
|
-
}], View: [{
|
|
128
|
-
type: Input
|
|
129
|
-
}], WarnOnAll: [{
|
|
130
|
-
type: Input
|
|
131
|
-
}], AllSearch: [{
|
|
132
|
-
type: Input
|
|
133
|
-
}], DefaultAll: [{
|
|
134
|
-
type: Input
|
|
135
|
-
}], GroupMode: [{
|
|
136
|
-
type: Input
|
|
137
|
-
}], GroupCount: [{
|
|
138
|
-
type: Input
|
|
139
|
-
}], CountLabel: [{
|
|
140
|
-
type: Input
|
|
141
|
-
}], ShowCount: [{
|
|
142
|
-
type: Input
|
|
143
|
-
}], ShowPaging: [{
|
|
144
|
-
type: Input
|
|
145
|
-
}], PagerCount: [{
|
|
146
|
-
type: Input
|
|
147
|
-
}], Hidden: [{
|
|
148
|
-
type: Input
|
|
149
|
-
}], pagingSelected: [{
|
|
124
|
+
args: [{ selector: "app-paging", viewProviders: [{ provide: LocalizationService, useClass: TablePagerLoc }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div *ngIf=\"!Hidden()\" [class.est-mt-4]=\"ShowCount() && PagerCount() != -1 && !(ShowPaging() && (Model() == DefaultAll() || PagerCount() >= Model() || PagerCount() == -1))\">\r\n <span class=\"est-fs-14\"> {{CountLabel() && !GroupMode() ? CountLabel() : ((GroupMode() ? 'Shown Groups' : 'Shown Elements') | localize : lc)}}: </span>\r\n <ng-container *ngIf=\"ShowPaging() && (Model() == DefaultAll() || PagerCount() >= Model() || PagerCount() == -1)\">\r\n\r\n <p-select \r\n style=\"width: 95px\"\r\n size=\"small\"\r\n name=\"input\"\r\n appendTo=\"body\"\r\n [options]=\"PagingOptionsForSelect()\"\r\n optionLabel=\"description\"\r\n optionValue=\"id\"\r\n [ngModel]=\"Model()\"\r\n (ngModelChange)=\"choice($event)\"\r\n />\r\n\r\n <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount() && PagerCount() != -1\"> / </span>\r\n </ng-container>\r\n <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount() && PagerCount() != -1\">{{PagerCount() | number : '0.0-0' : lc.Locale}}</span>\r\n</div>", styles: [".est-rg-ipp-sel-all,.est-rg-ipp-sel,.est-ipp-sel-all,.est-ipp-sel{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block;display:inline}.est-ipp-bold{font-weight:700}.mat-paginator-page-size-select{margin:6px 4px 0;width:50px}.mat-paginator-page-size-select .mat-form-field-wrapper{height:52px!important;margin-top:-15px!important;padding:0!important}.mat-form-field-type-mat-native-select .mat-form-field-infix:after{margin-top:-5.5px!important}\n"] }]
|
|
125
|
+
}], ctorParameters: () => [{ type: i5.MessageService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }], propDecorators: { pagingSelected: [{
|
|
150
126
|
type: Output
|
|
151
127
|
}] } });
|
|
152
128
|
|