@arsedizioni/ars-utils 18.1.51 → 18.1.53
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.
- package/esm2022/ui.application/ui/dialogs/select/select-dialog.component.mjs +101 -110
- package/fesm2022/arsedizioni-ars-utils-ui.application.mjs +91 -99
- package/fesm2022/arsedizioni-ars-utils-ui.application.mjs.map +1 -1
- package/package.json +18 -18
- package/ui.application/ui/components/file-input/file-input.component.d.ts +1 -1
- package/ui.application/ui/components/filter-bar/filter-bar.component.d.ts +1 -1
- package/ui.application/ui/dialogs/select/select-dialog.component.d.ts +24 -26
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Directive, Input, EventEmitter, Component, Inject, Output, Injectable, inject, ChangeDetectionStrategy, ViewChild, NgModule, Renderer2, input, Optional, Self, HostBinding,
|
|
3
|
-
import * as
|
|
2
|
+
import { Directive, Input, EventEmitter, Component, Inject, Output, Injectable, inject, ChangeDetectionStrategy, ViewChild, signal, NgModule, Renderer2, input, Optional, Self, HostBinding, ChangeDetectorRef } from '@angular/core';
|
|
3
|
+
import * as i14 from '@angular/material/paginator';
|
|
4
4
|
import { MatPaginatorModule, MatPaginatorIntl } from '@angular/material/paginator';
|
|
5
5
|
import { DialogService, PaginatorIntl, UIService } from '@arsedizioni/ars-utils/ui';
|
|
6
6
|
import * as i1$1 from '@angular/material/dialog';
|
|
7
|
-
import { MAT_DIALOG_DATA, MatDialogTitle, MatDialogContent, MatDialogActions, MatDialogClose } from '@angular/material/dialog';
|
|
7
|
+
import { MAT_DIALOG_DATA, MatDialogTitle, MatDialogContent, MatDialogActions, MatDialogClose, MatDialogRef } from '@angular/material/dialog';
|
|
8
8
|
import { SystemUtils, EmailsValidatorDirective, SafeHtmlPipe, SearchFilterPipe, DateInterval, DateIntervalChangeDirective, TimeValidatorDirective, FileInfo, FileSizeValidatorDirective, SafeUrlPipe } from '@arsedizioni/ars-utils/core';
|
|
9
9
|
import * as i4$1 from '@angular/material/checkbox';
|
|
10
10
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
@@ -37,11 +37,11 @@ import * as i9$1 from '@angular/material/core';
|
|
|
37
37
|
import { MatOptionModule } from '@angular/material/core';
|
|
38
38
|
import * as i8$1 from '@angular/material/select';
|
|
39
39
|
import { MatSelectModule } from '@angular/material/select';
|
|
40
|
-
import * as
|
|
40
|
+
import * as i11 from '@angular/material/divider';
|
|
41
41
|
import { MatDividerModule } from '@angular/material/divider';
|
|
42
|
-
import * as
|
|
42
|
+
import * as i13 from '@angular/material/list';
|
|
43
43
|
import { MatListModule } from '@angular/material/list';
|
|
44
|
-
import * as
|
|
44
|
+
import * as i10 from '@angular/material/menu';
|
|
45
45
|
import { MatMenuModule } from '@angular/material/menu';
|
|
46
46
|
import { ExtendedModule as ExtendedModule$1 } from '@ngbracket/ngx-layout';
|
|
47
47
|
import * as i2$2 from '@angular/cdk/overlay';
|
|
@@ -647,10 +647,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
|
|
|
647
647
|
}] } });
|
|
648
648
|
|
|
649
649
|
class SelectDialogComponent {
|
|
650
|
-
constructor(
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
this.dialogRef = dialogRef;
|
|
650
|
+
constructor() {
|
|
651
|
+
this.dialogRef = inject((MatDialogRef));
|
|
652
|
+
this.dialogData = inject(MAT_DIALOG_DATA) ?? { appearance: 'outline', title: 'Seleziona' };
|
|
654
653
|
this.done = new EventEmitter();
|
|
655
654
|
this.edit = new EventEmitter();
|
|
656
655
|
this.view = new EventEmitter();
|
|
@@ -659,13 +658,13 @@ class SelectDialogComponent {
|
|
|
659
658
|
this.lookup = new EventEmitter();
|
|
660
659
|
this.lookupOptions = new EventEmitter();
|
|
661
660
|
this.filter = new EventEmitter();
|
|
662
|
-
this.canEdit = false;
|
|
663
|
-
this.canView = false;
|
|
664
|
-
this.canAppend = false;
|
|
665
|
-
this.canDelete = false;
|
|
666
|
-
this.canPaginate = false;
|
|
661
|
+
this.canEdit = signal(false);
|
|
662
|
+
this.canView = signal(false);
|
|
663
|
+
this.canAppend = signal(false);
|
|
664
|
+
this.canDelete = signal(false);
|
|
665
|
+
this.canPaginate = signal(false);
|
|
667
666
|
// Handle submit button activity
|
|
668
|
-
this.okDisabled = true;
|
|
667
|
+
this.okDisabled = signal(true);
|
|
669
668
|
// Used for array filtering
|
|
670
669
|
this.filterText = "";
|
|
671
670
|
this.filterOptions = [];
|
|
@@ -674,42 +673,42 @@ class SelectDialogComponent {
|
|
|
674
673
|
this.lookupField = "";
|
|
675
674
|
// Used to display selected elements
|
|
676
675
|
this.selectionInfo = "";
|
|
677
|
-
this.selectionMasterIndeterminate = false;
|
|
678
|
-
this.selectionMasterChecked = false;
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
if (
|
|
685
|
-
this.
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
this.
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
676
|
+
this.selectionMasterIndeterminate = signal(false);
|
|
677
|
+
this.selectionMasterChecked = signal(false);
|
|
678
|
+
}
|
|
679
|
+
ngOnInit() {
|
|
680
|
+
if (!this.dialogData.appearance) {
|
|
681
|
+
this.dialogData.appearance = 'outline';
|
|
682
|
+
}
|
|
683
|
+
if (!this.dialogData.title) {
|
|
684
|
+
this.dialogData.title = 'Seleziona';
|
|
685
|
+
}
|
|
686
|
+
if (this.dialogData.multi && !this.dialogData.items) {
|
|
687
|
+
this.dialogData.multi = true;
|
|
688
|
+
}
|
|
689
|
+
if (!this.dialogData.okCaption) {
|
|
690
|
+
this.dialogData.okCaption = "Ok";
|
|
691
|
+
}
|
|
692
|
+
this.canAppend.set(this.dialogData.canAppend);
|
|
693
|
+
if (this.dialogData.canLookup) {
|
|
694
|
+
this.dialogData.items = [];
|
|
695
|
+
if (this.dialogData.lookupFields && this.dialogData.lookupFields.length > 0) {
|
|
696
|
+
this.lookupField = this.dialogData.lookupFields[0].value;
|
|
696
697
|
}
|
|
697
|
-
if (this.
|
|
698
|
-
this.filterOptions = this.
|
|
698
|
+
if (this.dialogData.canFilter) {
|
|
699
|
+
this.filterOptions = this.dialogData.filters;
|
|
699
700
|
}
|
|
700
|
-
if (this.
|
|
701
|
-
this.canPaginate
|
|
702
|
-
if (!this.
|
|
703
|
-
this.
|
|
701
|
+
if (this.dialogData.canPaginate) {
|
|
702
|
+
this.canPaginate.set(this.dialogData.canPaginate);
|
|
703
|
+
if (!this.dialogData.pageSize) {
|
|
704
|
+
this.dialogData.pageSize = 100;
|
|
704
705
|
}
|
|
705
706
|
}
|
|
706
707
|
}
|
|
707
|
-
this.okDisabled
|
|
708
|
-
}
|
|
709
|
-
ngOnInit() {
|
|
708
|
+
this.okDisabled.set(this.dialogData.mustSelect);
|
|
710
709
|
// Apply filter if exists
|
|
711
|
-
if (this.
|
|
712
|
-
this.doFilter(this.
|
|
710
|
+
if (this.dialogData.filter || this.dialogData.lookupOnInit) {
|
|
711
|
+
this.doFilter(this.dialogData.filter);
|
|
713
712
|
}
|
|
714
713
|
}
|
|
715
714
|
/**
|
|
@@ -719,7 +718,7 @@ class SelectDialogComponent {
|
|
|
719
718
|
return (this.selection &&
|
|
720
719
|
this.selection.selectedOptions &&
|
|
721
720
|
this.selection.selectedOptions.selected &&
|
|
722
|
-
this.selection.selectedOptions.selected.length === this.
|
|
721
|
+
this.selection.selectedOptions.selected.length === this.dialogData.items.length);
|
|
723
722
|
}
|
|
724
723
|
/**
|
|
725
724
|
* Checks if exists a selection
|
|
@@ -739,46 +738,40 @@ class SelectDialogComponent {
|
|
|
739
738
|
this.selection.selectAll();
|
|
740
739
|
else
|
|
741
740
|
this.selection.deselectAll();
|
|
742
|
-
this.selectionMasterIndeterminate
|
|
741
|
+
this.selectionMasterIndeterminate.set(false);
|
|
743
742
|
this.selectionMasterChecked = args.checked;
|
|
744
|
-
this.okDisabled
|
|
745
|
-
this.
|
|
746
|
-
(!this.selection || this.selection.selectedOptions.selected.length === 0);
|
|
743
|
+
this.okDisabled.set(this.dialogData.mustSelect &&
|
|
744
|
+
(!this.selection || this.selection.selectedOptions.selected.length === 0));
|
|
747
745
|
this.updateSelectionInfo();
|
|
748
746
|
}
|
|
749
747
|
/**
|
|
750
748
|
* Handle selection/deselection of an item
|
|
751
749
|
*/
|
|
752
750
|
select(e) {
|
|
753
|
-
if (!this.
|
|
751
|
+
if (!this.dialogData.multi) {
|
|
754
752
|
this.selection.deselectAll();
|
|
755
753
|
if (e.options?.length > 0)
|
|
756
754
|
e.options[0].selected = true;
|
|
757
|
-
this.okDisabled
|
|
755
|
+
this.okDisabled.set(false);
|
|
758
756
|
}
|
|
759
757
|
else {
|
|
760
|
-
this.okDisabled
|
|
761
|
-
this.
|
|
762
|
-
|
|
763
|
-
this.selection.selectedOptions.selected.length === 0);
|
|
758
|
+
this.okDisabled.set(this.dialogData.mustSelect &&
|
|
759
|
+
(!this.selection ||
|
|
760
|
+
this.selection.selectedOptions.selected.length === 0));
|
|
764
761
|
}
|
|
765
762
|
// Update editors
|
|
766
|
-
this.canAppend
|
|
767
|
-
this.canEdit
|
|
768
|
-
this.
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
this.
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
this.selection.selectedOptions.selected.length > 0;
|
|
779
|
-
this.selectionMasterIndeterminate =
|
|
780
|
-
!this.isAllSelected() && this.hasSelection();
|
|
781
|
-
this.selectionMasterChecked = this.hasSelection();
|
|
763
|
+
this.canAppend.set(this.dialogData.canAppend);
|
|
764
|
+
this.canEdit.set(this.dialogData.canEdit &&
|
|
765
|
+
this.selection &&
|
|
766
|
+
this.selection.selectedOptions.selected.length === 1);
|
|
767
|
+
this.canView.set(this.dialogData.canView &&
|
|
768
|
+
this.selection &&
|
|
769
|
+
this.selection.selectedOptions.selected.length === 1);
|
|
770
|
+
this.canDelete.set(this.dialogData.canDelete &&
|
|
771
|
+
this.selection &&
|
|
772
|
+
this.selection.selectedOptions.selected.length > 0);
|
|
773
|
+
this.selectionMasterIndeterminate.set(!this.isAllSelected() && this.hasSelection());
|
|
774
|
+
this.selectionMasterChecked.set(this.hasSelection());
|
|
782
775
|
this.updateSelectionInfo();
|
|
783
776
|
}
|
|
784
777
|
/**
|
|
@@ -786,7 +779,7 @@ class SelectDialogComponent {
|
|
|
786
779
|
*/
|
|
787
780
|
updateSelectionInfo() {
|
|
788
781
|
// Update selection info
|
|
789
|
-
if (this.selection && this.
|
|
782
|
+
if (this.selection && this.dialogData.multi) {
|
|
790
783
|
this.selectionInfo =
|
|
791
784
|
this.selection.selectedOptions.selected.length +
|
|
792
785
|
" / " +
|
|
@@ -800,8 +793,8 @@ class SelectDialogComponent {
|
|
|
800
793
|
* Clear current selection
|
|
801
794
|
*/
|
|
802
795
|
clearSelection() {
|
|
803
|
-
this.selectionMasterIndeterminate
|
|
804
|
-
this.selectionMasterChecked
|
|
796
|
+
this.selectionMasterIndeterminate.set(false);
|
|
797
|
+
this.selectionMasterChecked.set(false);
|
|
805
798
|
this.selection.deselectAll();
|
|
806
799
|
this.selectionInfo = "";
|
|
807
800
|
}
|
|
@@ -843,9 +836,9 @@ class SelectDialogComponent {
|
|
|
843
836
|
if (text) {
|
|
844
837
|
this.filterText = text;
|
|
845
838
|
}
|
|
846
|
-
if (this.
|
|
839
|
+
if (this.dialogData.canLookup) {
|
|
847
840
|
if (!e || e.keyCode === 13) {
|
|
848
|
-
this.lookup.emit({ items: this.
|
|
841
|
+
this.lookup.emit({ items: this.dialogData.items, filter: this.filterText });
|
|
849
842
|
}
|
|
850
843
|
}
|
|
851
844
|
}
|
|
@@ -854,9 +847,9 @@ class SelectDialogComponent {
|
|
|
854
847
|
* @param filterOPtion : the current filter
|
|
855
848
|
*/
|
|
856
849
|
doFilterByOptions(filterOption) {
|
|
857
|
-
if (this.
|
|
850
|
+
if (this.dialogData.canLookup && this.dialogData.canFilter) {
|
|
858
851
|
this.filter.emit({
|
|
859
|
-
items: this.
|
|
852
|
+
items: this.dialogData.items,
|
|
860
853
|
filter: this.filterText,
|
|
861
854
|
filterOption: filterOption,
|
|
862
855
|
owner: this,
|
|
@@ -868,10 +861,10 @@ class SelectDialogComponent {
|
|
|
868
861
|
* @param params : the object with current parameters
|
|
869
862
|
*/
|
|
870
863
|
doLookup(params) {
|
|
871
|
-
if (this.
|
|
864
|
+
if (this.dialogData.canLookup) {
|
|
872
865
|
this.lookupParams = params;
|
|
873
866
|
this.lookupParams.first = 0;
|
|
874
|
-
this.lookup.emit({ items: this.
|
|
867
|
+
this.lookup.emit({ items: this.dialogData.items, params: this.lookupParams, owner: this });
|
|
875
868
|
}
|
|
876
869
|
}
|
|
877
870
|
/**
|
|
@@ -891,31 +884,33 @@ class SelectDialogComponent {
|
|
|
891
884
|
* @param e : the MatPaginator PageEvent data
|
|
892
885
|
*/
|
|
893
886
|
doLookupPage(e) {
|
|
894
|
-
if (this.
|
|
887
|
+
if (this.dialogData.canLookup && this.dialogData.canPaginate) {
|
|
895
888
|
this.clearSelection();
|
|
896
|
-
this.lookupParams.first = e.pageIndex * (this.
|
|
897
|
-
this.lookup.emit({ items: this.
|
|
889
|
+
this.lookupParams.first = e.pageIndex * (this.dialogData.pageSize ?? 0);
|
|
890
|
+
this.lookup.emit({ items: this.dialogData.items, params: this.lookupParams, owner: this });
|
|
898
891
|
}
|
|
899
892
|
}
|
|
900
893
|
/**
|
|
901
894
|
* Append
|
|
902
895
|
*/
|
|
903
896
|
doAppend() {
|
|
904
|
-
this.append.emit({ items: this.
|
|
897
|
+
this.append.emit({ items: this.dialogData.items });
|
|
905
898
|
}
|
|
906
899
|
/**
|
|
907
900
|
* Edit
|
|
908
901
|
*/
|
|
909
902
|
doEdit() {
|
|
910
|
-
if (this.selection.selectedOptions.selected)
|
|
903
|
+
if (this.selection.selectedOptions.selected) {
|
|
911
904
|
this.edit.emit(this.selection.selectedOptions.selected[0].value);
|
|
905
|
+
}
|
|
912
906
|
}
|
|
913
907
|
/**
|
|
914
908
|
* View
|
|
915
909
|
*/
|
|
916
910
|
doView() {
|
|
917
|
-
if (this.selection.selectedOptions.selected)
|
|
911
|
+
if (this.selection.selectedOptions.selected) {
|
|
918
912
|
this.view.emit(this.selection.selectedOptions.selected[0].value);
|
|
913
|
+
}
|
|
919
914
|
}
|
|
920
915
|
/**
|
|
921
916
|
* Delete
|
|
@@ -926,17 +921,17 @@ class SelectDialogComponent {
|
|
|
926
921
|
selectedItems.push(element.value);
|
|
927
922
|
});
|
|
928
923
|
this.delete.emit({
|
|
929
|
-
items: this.
|
|
924
|
+
items: this.dialogData.items,
|
|
930
925
|
selectedItems: selectedItems,
|
|
931
926
|
});
|
|
932
|
-
this.canDelete
|
|
927
|
+
this.canDelete.set(false);
|
|
933
928
|
}
|
|
934
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: SelectDialogComponent, deps: [
|
|
935
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: SelectDialogComponent, isStandalone: true, selector: "ng-component", outputs: { done: "done", edit: "edit", view: "view", append: "append", delete: "delete", lookup: "lookup", lookupOptions: "lookupOptions", filter: "filter" }, host: { attributes: { "Bind": SystemUtils.generateUUID() } }, viewQueries: [{ propertyName: "paginator", first: true, predicate: ["paginator"], descendants: true }, { propertyName: "selection", first: true, predicate: ["selection"], descendants: true }], ngImport: i0, template: "<h2 mat-dialog-title>{{data.title}}</h2>\r\n<div style=\"padding: 0 24px\">\r\n @if (data.description) {\r\n <div style=\"padding-bottom:10px\" [innerHtml]=\"data.description | safeHtml\"></div>\r\n }\r\n <div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"20px\" fxFill>\r\n @if (!data.canLookupWithOptions) {\r\n <div fxFlex=\"100\">\r\n <mat-form-field style='width:100%' [appearance]=\"data.appearance\" subscriptSizing=\"dynamic\">\r\n <mat-label>Cerca...</mat-label>\r\n <input type=\"text\" cdkFocusInitial (keyup.Enter)=\"doFilter()\" matInput\r\n title=\"{{data.canLookup ? 'Digita il testo e premi invio' : 'Digita il testo'}}\" [(ngModel)]=\"filterText\">\r\n @if (filterText) {\r\n <button type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearFilter()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n </div>\r\n }\r\n @if (!data.canLookupWithOptions && data.canLookup && data.lookupFields) {\r\n <div fxFlex=\"100\">\r\n <mat-form-field style='width:100%' [appearance]=\"data.appearance\" subscriptSizing=\"dynamic\">\r\n <mat-label>Come...</mat-label>\r\n <mat-select [(value)]=\"lookupField\">\r\n @for (field of data.lookupFields; track field) {\r\n <mat-option [value]=\"field.value\">\r\n {{field.name}}\r\n </mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n }\r\n @if (data.canLookupWithOptions) {\r\n <div fxFlex=\"*\" fxFlexAlign=\"center\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button aria-label=\"Ricerca\" (click)=\"showFilterOptions()\">\r\n <mat-icon>search</mat-icon>Ricerca\r\n </button>\r\n </div>\r\n }\r\n @if (data.canLookup && data.canFilter) {\r\n <div fxFlex=\"*\" fxFlexAlign=\"center\" style=\"white-space:nowrap\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button matTooltip=\"Filtra\" [attr.aria-label]=\"'Filtra'\"\r\n [matMenuTriggerFor]=\"menuFilter\" color=\"primary\">\r\n <mat-icon>filter_alt</mat-icon> {{filterOptionsInfo}} <mat-icon class=\"icon-menu-drop-down\">\r\n arrow_drop_down</mat-icon>\r\n </button>\r\n <mat-menu #menuFilter=\"matMenu\" class=\"mat-menu-300\">\r\n @for (f of filterOptions; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n @if (f.groupName) {\r\n <span style='font-size:small; padding: 2px 4px;'><i><b>{{f.groupName}}</b></i></span>\r\n }\r\n @if (!f.groupName && !f.divider) {\r\n <button mat-menu-item (click)=\"doFilterByOptions(f)\" [attr.aria-label]=\"f.description\">\r\n @if (f.radio && f.value) {\r\n <span style=\"padding-left:40px\"></span>\r\n }\r\n <mat-icon>{{f.icon}}</mat-icon> {{f.title}}\r\n </button>\r\n }\r\n\r\n }\r\n </mat-menu>\r\n </div>\r\n }\r\n @if (canEdit || canAppend || canView || canDelete) {\r\n <div fxFlex=\"*\" fxLayoutAlign=\"end\" style=\"white-space:nowrap\">\r\n @if (data.canAppend) {\r\n <button fxFlexAlign=\"center\" type=\"button\" [disabled]=\"!canAppend\" mat-icon-button color=\"primary\"\r\n (click)=\"doAppend()\">\r\n <mat-icon aria-label=\"Aggiungi\" matTooltip=\"Aggiungi\">add</mat-icon>\r\n </button>\r\n }\r\n @if (data.canEdit) {\r\n <button fxFlexAlign=\"center\" type=\"button\" [disabled]=\"!canEdit\" mat-icon-button color=\"primary\"\r\n (click)=\"doEdit()\">\r\n <mat-icon aria-label=\"Modifica\" matTooltip=\"Modifica\">edit</mat-icon>\r\n </button>\r\n }\r\n @if (data.canView) {\r\n <button fxFlexAlign=\"center\" type=\"button\" [disabled]=\"!canView\" mat-icon-button color=\"primary\"\r\n (click)=\"doView()\">\r\n <mat-icon aria-label=\"Mostra\" matTooltip=\"Mostra\">visibility</mat-icon>\r\n </button>\r\n }\r\n @if (data.canDelete) {\r\n <button fxFlexAlign=\"center\" type=\"button\" [disabled]=\"!canDelete\" mat-icon-button color=\"primary\"\r\n (click)=\"doDelete()\">\r\n <mat-icon aria-label=\"Elimina\" matTooltip=\"Elimina\">delete</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n @if ((data.multi || data.header) && data.items?.length > 0) {\r\n <div>\r\n <div fxLayout=\"row\" fxFalyoutGap=\"10px\" fxFill style=\"padding-top: 10px;\">\r\n <div fxFlex=\"72px\" fxFlexAlign=\"center\" style=\"padding-left: 8px;\">\r\n @if (data.multi) {\r\n <mat-checkbox color=\"primary\" (change)=\"$event ? masterSelectionToggle($event) : null\"\r\n [indeterminate]=\"selectionMasterIndeterminate\" [checked]=\"selectionMasterChecked\"\r\n [attr.aria-label]=\"'Seleziona/deseleziona tutto'\" matTooltip=\"Seleziona/deseleziona tutto\">\r\n </mat-checkbox>\r\n }\r\n </div>\r\n <div fxFlex=\"100\" fxFlexAlign=\"center\">\r\n @if (data.header) {\r\n <div [innerHtml]=\"data.header | safeHtml\"></div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n<div mat-dialog-content>\r\n <div fxLayout=\"column\" fxFill>\r\n @if (data.canLookup && (!data.items || data.items.length == 0)) {\r\n <div style=\"padding:24px; text-align: center\"><i>\r\n @if (!data.emptyMessage) {\r\n <span class=\"item-greyed-1\">Nessun elemento da visualizzare.<br>Esegui una nuova ricerca o modifica quella\r\n esistente.\r\n @if (data.maxItems > 0) {\r\n <span>Saranno mostrati al massimo {{data.maxItems}} elementi.</span>\r\n }\r\n </span>\r\n } @else {\r\n <span class=\"item-greyed-1\" [innerHtml]=\"data.emptyMessage | safeHtml\"></span>\r\n }\r\n </i>\r\n </div>\r\n }\r\n <mat-selection-list #selection (selectionChange)=\"select($event)\" dense hideSingleSelectionIndicator=\"true\">\r\n @for (item of (data.items | search: (!data.canLookup ? filterText : '')); track item) {\r\n <mat-list-option [value]=\"item\" [selected]=\"item.selected\" checkboxPosition=\"before\" color=\"primary\">\r\n <div [innerHtml]=\"item.template | safeHtml\"></div>\r\n </mat-list-option>\r\n }\r\n </mat-selection-list>\r\n </div>\r\n</div>\r\n<div mat-dialog-actions>\r\n <div fxLayout=\"column\" fxFill>\r\n <div fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"10px\" fxFill>\r\n <div style=\"padding-left:20px\">\r\n @if (selectionInfo) {\r\n <span class=\"small\">selezione: </span><span class=\"bold\">{{selectionInfo}}</span>\r\n }\r\n </div>\r\n <div fxFlexAlign=\"center\">\r\n @if (canPaginate) {\r\n <div [hidden]=\"!data.items || data.items.length === 0\">\r\n <mat-paginator #paginator [hidePageSize]=\"true\" [pageSize]=\"data.pageSize\" [showFirstLastButtons]=\"true\"\r\n (page)=\"doLookupPage($event)\"></mat-paginator>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutAlign=\"end\" fxFill>\r\n <button mat-flat-button color=\"primary\" (click)=\"ok()\" [disabled]=\"okDisabled\">\r\n <span>{{data.mustSelect ? data.okCaption : 'CHIUDI'}}</span>\r\n </button>\r\n @if (data.mustSelect) {\r\n <button mat-button mat-dialog-close cdkFocusInitial color=\"primary\">\r\n <span>ANNULLA</span>\r\n </button>\r\n }\r\n </div>\r\n </div>\r\n</div>", styles: [":root{--ars-dialog-info-ok: #388E3C;--ars-filterbox-filtered-background-color: #f9fbe7}.dialog-info{font-size:x-small;font-weight:700;text-align:right;padding:10px}.dialog-info-green,.dialog-info-ok{color:var(--ars-dialog-info-ok, #388E3C)}.dialog-info-red,.dialog-info-error{color:var(--mat-form-field-error-text-color, #a80710)}.dialog-title{padding:0 24px}.section-title{font-size:large;font-weight:600;padding-top:10px;padding-bottom:8px}b{font-weight:700}.large{font-size:large!important}.small{font-size:small!important}.small-icon-button{width:1.5rem!important;height:1.5rem!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center}.small-icon-button .mat-mdc-button-touch-target{width:1.5rem!important;height:1.5rem!important}.x-small{font-size:x-small!important}.uppercase{text-transform:uppercase!important}.lowercase{text-transform:lowercase!important}.truncated{min-width:0}.truncated span,.truncated div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (prefers-color-scheme: dark){:root{--ars-dialog-info-ok: #4CAF50;--ars-filterbox-filtered-background-color: #c6c7b8}.dialog-info-green,.dialog-info-ok{color:var(--ars-dialog-info-ok, #4CAF50)}.dialog-info-red,.dialog-info-error{color:var(--mat-form-field-error-text-color, #ff5449)}b{font-weight:600}}\n"], dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "ngmodule", type: FlexModule }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "directive", type: i2.DefaultFlexAlignDirective, selector: " [fxFlexAlign], [fxFlexAlign.xs], [fxFlexAlign.sm], [fxFlexAlign.md], [fxFlexAlign.lg], [fxFlexAlign.xl], [fxFlexAlign.lt-sm], [fxFlexAlign.lt-md], [fxFlexAlign.lt-lg], [fxFlexAlign.lt-xl], [fxFlexAlign.gt-xs], [fxFlexAlign.gt-sm], [fxFlexAlign.gt-md], [fxFlexAlign.gt-lg]", inputs: ["fxFlexAlign", "fxFlexAlign.xs", "fxFlexAlign.sm", "fxFlexAlign.md", "fxFlexAlign.lg", "fxFlexAlign.xl", "fxFlexAlign.lt-sm", "fxFlexAlign.lt-md", "fxFlexAlign.lt-lg", "fxFlexAlign.lt-xl", "fxFlexAlign.gt-xs", "fxFlexAlign.gt-sm", "fxFlexAlign.gt-md", "fxFlexAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "ngmodule", type: ExtendedModule$1 }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { 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: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i8$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i9$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i11.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i11.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i11.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i12.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i14.MatSelectionList, selector: "mat-selection-list", inputs: ["color", "compareWith", "multiple", "hideSingleSelectionIndicator", "disabled"], outputs: ["selectionChange"], exportAs: ["matSelectionList"] }, { kind: "component", type: i14.MatListOption, selector: "mat-list-option", inputs: ["togglePosition", "checkboxPosition", "color", "value", "selected"], outputs: ["selectedChange"], exportAs: ["matListOption"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i15.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "pipe", type: SearchFilterPipe, name: "search" }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }] }); }
|
|
929
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: SelectDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
930
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: SelectDialogComponent, isStandalone: true, selector: "ng-component", outputs: { done: "done", edit: "edit", view: "view", append: "append", delete: "delete", lookup: "lookup", lookupOptions: "lookupOptions", filter: "filter" }, host: { attributes: { "Bind": SystemUtils.generateUUID() } }, viewQueries: [{ propertyName: "paginator", first: true, predicate: ["paginator"], descendants: true }, { propertyName: "selection", first: true, predicate: ["selection"], descendants: true }], ngImport: i0, template: "<h2 mat-dialog-title>{{dialogData.title}}</h2>\r\n<div style=\"padding: 0 24px\">\r\n @if (dialogData.description) {\r\n <div style=\"padding-bottom:10px\" [innerHtml]=\"dialogData.description | safeHtml\"></div>\r\n }\r\n <div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"20px\" fxFill>\r\n @if (!dialogData.canLookupWithOptions) {\r\n <div fxFlex=\"100\">\r\n <mat-form-field style='width:100%' [appearance]=\"dialogData.appearance\" subscriptSizing=\"dynamic\">\r\n <mat-label>Cerca...</mat-label>\r\n <input type=\"text\" cdkFocusInitial (keyup.Enter)=\"doFilter()\" matInput\r\n title=\"{{dialogData.canLookup ? 'Digita il testo e premi invio' : 'Digita il testo'}}\" [(ngModel)]=\"filterText\">\r\n @if (filterText) {\r\n <button type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearFilter()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n </div>\r\n }\r\n @if (!dialogData.canLookupWithOptions && dialogData.canLookup && dialogData.lookupFields) {\r\n <div fxFlex=\"100\">\r\n <mat-form-field style='width:100%' [appearance]=\"dialogData.appearance\" subscriptSizing=\"dynamic\">\r\n <mat-label>Come...</mat-label>\r\n <mat-select [(value)]=\"lookupField\">\r\n @for (field of dialogData.lookupFields; track field) {\r\n <mat-option [value]=\"field.value\">\r\n {{field.name}}\r\n </mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n }\r\n @if (dialogData.canLookupWithOptions) {\r\n <div fxFlex=\"*\" fxFlexAlign=\"center\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button aria-label=\"Ricerca\" (click)=\"showFilterOptions()\">\r\n <mat-icon>search</mat-icon>Ricerca\r\n </button>\r\n </div>\r\n }\r\n @if (dialogData.canLookup && dialogData.canFilter) {\r\n <div fxFlex=\"*\" fxFlexAlign=\"center\" style=\"white-space:nowrap\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button matTooltip=\"Filtra\" [attr.aria-label]=\"'Filtra'\"\r\n [matMenuTriggerFor]=\"menuFilter\" color=\"primary\">\r\n <mat-icon>filter_alt</mat-icon> {{filterOptionsInfo}} <mat-icon class=\"icon-menu-drop-down\">\r\n arrow_drop_down</mat-icon>\r\n </button>\r\n <mat-menu #menuFilter=\"matMenu\" class=\"mat-menu-300\">\r\n @for (f of filterOptions; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n @if (f.groupName) {\r\n <span style='font-size:small; padding: 2px 4px;'><i><b>{{f.groupName}}</b></i></span>\r\n }\r\n @if (!f.groupName && !f.divider) {\r\n <button mat-menu-item (click)=\"doFilterByOptions(f)\" [attr.aria-label]=\"f.description\">\r\n @if (f.radio && f.value) {\r\n <span style=\"padding-left:40px\"></span>\r\n }\r\n <mat-icon>{{f.icon}}</mat-icon> {{f.title}}\r\n </button>\r\n }\r\n\r\n }\r\n </mat-menu>\r\n </div>\r\n }\r\n @if (canEdit() || canAppend() || canView() || canDelete()) {\r\n <div fxFlex=\"*\" fxLayoutAlign=\"end\" style=\"white-space:nowrap\">\r\n @if (canAppend()) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\"\r\n (click)=\"doAppend()\">\r\n <mat-icon aria-label=\"Aggiungi\" matTooltip=\"Aggiungi\">add</mat-icon>\r\n </button>\r\n }\r\n @if (canEdit()) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\"\r\n (click)=\"doEdit()\">\r\n <mat-icon aria-label=\"Modifica\" matTooltip=\"Modifica\">edit</mat-icon>\r\n </button>\r\n }\r\n @if (canView()) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\"\r\n (click)=\"doView()\">\r\n <mat-icon aria-label=\"Mostra\" matTooltip=\"Mostra\">visibility</mat-icon>\r\n </button>\r\n }\r\n @if (canDelete()) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\"\r\n (click)=\"doDelete()\">\r\n <mat-icon aria-label=\"Elimina\" matTooltip=\"Elimina\">delete</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n @if ((dialogData.multi || dialogData.header) && dialogData.items?.length > 0) {\r\n <div>\r\n <div fxLayout=\"row\" fxFalyoutGap=\"10px\" fxFill style=\"padding-top: 10px;\">\r\n <div fxFlex=\"72px\" fxFlexAlign=\"center\" style=\"padding-left: 8px;\">\r\n @if (dialogData.multi) {\r\n <mat-checkbox color=\"primary\" (change)=\"$event ? masterSelectionToggle($event) : null\"\r\n [indeterminate]=\"selectionMasterIndeterminate()\" [checked]=\"selectionMasterChecked()\"\r\n [attr.aria-label]=\"'Seleziona/deseleziona tutto'\" matTooltip=\"Seleziona/deseleziona tutto\">\r\n </mat-checkbox>\r\n }\r\n </div>\r\n <div fxFlex=\"100\" fxFlexAlign=\"center\">\r\n @if (dialogData.header) {\r\n <div [innerHtml]=\"dialogData.header | safeHtml\"></div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n<div mat-dialog-content>\r\n <div fxLayout=\"column\" fxFill>\r\n @if (dialogData.canLookup && (!dialogData.items || dialogData.items.length == 0)) {\r\n <div style=\"padding:24px; text-align: center\"><i>\r\n @if (!dialogData.emptyMessage) {\r\n <span class=\"item-greyed-1\">Nessun elemento da visualizzare.<br>Esegui una nuova ricerca o modifica quella\r\n esistente.\r\n @if (dialogData.maxItems > 0) {\r\n <span>Saranno mostrati al massimo {{dialogData.maxItems}} elementi.</span>\r\n }\r\n </span>\r\n } @else {\r\n <span class=\"item-greyed-1\" [innerHtml]=\"dialogData.emptyMessage | safeHtml\"></span>\r\n }\r\n </i>\r\n </div>\r\n }\r\n <mat-selection-list #selection (selectionChange)=\"select($event)\" dense hideSingleSelectionIndicator=\"true\">\r\n @for (item of (dialogData.items | search: (!dialogData.canLookup ? filterText : '')); track item) {\r\n <mat-list-option [value]=\"item\" [selected]=\"item.selected\" checkboxPosition=\"before\" color=\"primary\">\r\n <div [innerHtml]=\"item.template | safeHtml\"></div>\r\n </mat-list-option>\r\n }\r\n </mat-selection-list>\r\n </div>\r\n</div>\r\n<div mat-dialog-actions>\r\n <div fxLayout=\"column\" fxFill>\r\n <div fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"10px\" fxFill>\r\n <div style=\"padding-left:20px\">\r\n @if (selectionInfo) {\r\n <span class=\"small\">selezione: </span><span class=\"bold\">{{selectionInfo}}</span>\r\n }\r\n </div>\r\n <div fxFlexAlign=\"center\">\r\n @if (canPaginate) {\r\n <div [hidden]=\"!dialogData.items || dialogData.items.length === 0\">\r\n <mat-paginator #paginator [hidePageSize]=\"true\" [pageSize]=\"dialogData.pageSize\" [showFirstLastButtons]=\"true\"\r\n (page)=\"doLookupPage($event)\"></mat-paginator>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutAlign=\"end\" fxFill>\r\n <button mat-flat-button color=\"primary\" (click)=\"ok()\" [disabled]=\"okDisabled\">\r\n <span>{{dialogData.mustSelect ? dialogData.okCaption : 'CHIUDI'}}</span>\r\n </button>\r\n @if (dialogData.mustSelect) {\r\n <button mat-button mat-dialog-close cdkFocusInitial color=\"primary\">\r\n <span>ANNULLA</span>\r\n </button>\r\n }\r\n </div>\r\n </div>\r\n</div>", styles: [":root{--ars-dialog-info-ok: #388E3C;--ars-filterbox-filtered-background-color: #f9fbe7}.dialog-info{font-size:x-small;font-weight:700;text-align:right;padding:10px}.dialog-info-green,.dialog-info-ok{color:var(--ars-dialog-info-ok, #388E3C)}.dialog-info-red,.dialog-info-error{color:var(--mat-form-field-error-text-color, #a80710)}.dialog-title{padding:0 24px}.section-title{font-size:large;font-weight:600;padding-top:10px;padding-bottom:8px}b{font-weight:700}.large{font-size:large!important}.small{font-size:small!important}.small-icon-button{width:1.5rem!important;height:1.5rem!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center}.small-icon-button .mat-mdc-button-touch-target{width:1.5rem!important;height:1.5rem!important}.x-small{font-size:x-small!important}.uppercase{text-transform:uppercase!important}.lowercase{text-transform:lowercase!important}.truncated{min-width:0}.truncated span,.truncated div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (prefers-color-scheme: dark){:root{--ars-dialog-info-ok: #4CAF50;--ars-filterbox-filtered-background-color: #c6c7b8}.dialog-info-green,.dialog-info-ok{color:var(--ars-dialog-info-ok, #4CAF50)}.dialog-info-red,.dialog-info-error{color:var(--mat-form-field-error-text-color, #ff5449)}b{font-weight:600}}\n"], dependencies: [{ kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "ngmodule", type: FlexModule }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "directive", type: i2.DefaultFlexAlignDirective, selector: " [fxFlexAlign], [fxFlexAlign.xs], [fxFlexAlign.sm], [fxFlexAlign.md], [fxFlexAlign.lg], [fxFlexAlign.xl], [fxFlexAlign.lt-sm], [fxFlexAlign.lt-md], [fxFlexAlign.lt-lg], [fxFlexAlign.lt-xl], [fxFlexAlign.gt-xs], [fxFlexAlign.gt-sm], [fxFlexAlign.gt-md], [fxFlexAlign.gt-lg]", inputs: ["fxFlexAlign", "fxFlexAlign.xs", "fxFlexAlign.sm", "fxFlexAlign.md", "fxFlexAlign.lg", "fxFlexAlign.xl", "fxFlexAlign.lt-sm", "fxFlexAlign.lt-md", "fxFlexAlign.lt-lg", "fxFlexAlign.lt-xl", "fxFlexAlign.gt-xs", "fxFlexAlign.gt-sm", "fxFlexAlign.gt-md", "fxFlexAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "ngmodule", type: ExtendedModule$1 }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { 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: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i8$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i9$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i11.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i13.MatSelectionList, selector: "mat-selection-list", inputs: ["color", "compareWith", "multiple", "hideSingleSelectionIndicator", "disabled"], outputs: ["selectionChange"], exportAs: ["matSelectionList"] }, { kind: "component", type: i13.MatListOption, selector: "mat-list-option", inputs: ["togglePosition", "checkboxPosition", "color", "value", "selected"], outputs: ["selectedChange"], exportAs: ["matListOption"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i14.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "pipe", type: SearchFilterPipe, name: "search" }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
936
931
|
}
|
|
937
932
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: SelectDialogComponent, decorators: [{
|
|
938
933
|
type: Component,
|
|
939
|
-
args: [{ host: { 'Bind': SystemUtils.generateUUID() }, standalone: true, imports: [
|
|
934
|
+
args: [{ host: { 'Bind': SystemUtils.generateUUID() }, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
|
|
940
935
|
MatDialogTitle,
|
|
941
936
|
FlexModule,
|
|
942
937
|
ExtendedModule$1,
|
|
@@ -958,11 +953,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImpor
|
|
|
958
953
|
MatPaginatorModule,
|
|
959
954
|
SearchFilterPipe,
|
|
960
955
|
SafeHtmlPipe
|
|
961
|
-
], template: "<h2 mat-dialog-title>{{
|
|
962
|
-
}],
|
|
963
|
-
type: Inject,
|
|
964
|
-
args: [MAT_DIALOG_DATA]
|
|
965
|
-
}] }], propDecorators: { paginator: [{
|
|
956
|
+
], template: "<h2 mat-dialog-title>{{dialogData.title}}</h2>\r\n<div style=\"padding: 0 24px\">\r\n @if (dialogData.description) {\r\n <div style=\"padding-bottom:10px\" [innerHtml]=\"dialogData.description | safeHtml\"></div>\r\n }\r\n <div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"20px\" fxFill>\r\n @if (!dialogData.canLookupWithOptions) {\r\n <div fxFlex=\"100\">\r\n <mat-form-field style='width:100%' [appearance]=\"dialogData.appearance\" subscriptSizing=\"dynamic\">\r\n <mat-label>Cerca...</mat-label>\r\n <input type=\"text\" cdkFocusInitial (keyup.Enter)=\"doFilter()\" matInput\r\n title=\"{{dialogData.canLookup ? 'Digita il testo e premi invio' : 'Digita il testo'}}\" [(ngModel)]=\"filterText\">\r\n @if (filterText) {\r\n <button type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearFilter()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n </div>\r\n }\r\n @if (!dialogData.canLookupWithOptions && dialogData.canLookup && dialogData.lookupFields) {\r\n <div fxFlex=\"100\">\r\n <mat-form-field style='width:100%' [appearance]=\"dialogData.appearance\" subscriptSizing=\"dynamic\">\r\n <mat-label>Come...</mat-label>\r\n <mat-select [(value)]=\"lookupField\">\r\n @for (field of dialogData.lookupFields; track field) {\r\n <mat-option [value]=\"field.value\">\r\n {{field.name}}\r\n </mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n }\r\n @if (dialogData.canLookupWithOptions) {\r\n <div fxFlex=\"*\" fxFlexAlign=\"center\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button aria-label=\"Ricerca\" (click)=\"showFilterOptions()\">\r\n <mat-icon>search</mat-icon>Ricerca\r\n </button>\r\n </div>\r\n }\r\n @if (dialogData.canLookup && dialogData.canFilter) {\r\n <div fxFlex=\"*\" fxFlexAlign=\"center\" style=\"white-space:nowrap\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button matTooltip=\"Filtra\" [attr.aria-label]=\"'Filtra'\"\r\n [matMenuTriggerFor]=\"menuFilter\" color=\"primary\">\r\n <mat-icon>filter_alt</mat-icon> {{filterOptionsInfo}} <mat-icon class=\"icon-menu-drop-down\">\r\n arrow_drop_down</mat-icon>\r\n </button>\r\n <mat-menu #menuFilter=\"matMenu\" class=\"mat-menu-300\">\r\n @for (f of filterOptions; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n @if (f.groupName) {\r\n <span style='font-size:small; padding: 2px 4px;'><i><b>{{f.groupName}}</b></i></span>\r\n }\r\n @if (!f.groupName && !f.divider) {\r\n <button mat-menu-item (click)=\"doFilterByOptions(f)\" [attr.aria-label]=\"f.description\">\r\n @if (f.radio && f.value) {\r\n <span style=\"padding-left:40px\"></span>\r\n }\r\n <mat-icon>{{f.icon}}</mat-icon> {{f.title}}\r\n </button>\r\n }\r\n\r\n }\r\n </mat-menu>\r\n </div>\r\n }\r\n @if (canEdit() || canAppend() || canView() || canDelete()) {\r\n <div fxFlex=\"*\" fxLayoutAlign=\"end\" style=\"white-space:nowrap\">\r\n @if (canAppend()) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\"\r\n (click)=\"doAppend()\">\r\n <mat-icon aria-label=\"Aggiungi\" matTooltip=\"Aggiungi\">add</mat-icon>\r\n </button>\r\n }\r\n @if (canEdit()) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\"\r\n (click)=\"doEdit()\">\r\n <mat-icon aria-label=\"Modifica\" matTooltip=\"Modifica\">edit</mat-icon>\r\n </button>\r\n }\r\n @if (canView()) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\"\r\n (click)=\"doView()\">\r\n <mat-icon aria-label=\"Mostra\" matTooltip=\"Mostra\">visibility</mat-icon>\r\n </button>\r\n }\r\n @if (canDelete()) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\"\r\n (click)=\"doDelete()\">\r\n <mat-icon aria-label=\"Elimina\" matTooltip=\"Elimina\">delete</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n @if ((dialogData.multi || dialogData.header) && dialogData.items?.length > 0) {\r\n <div>\r\n <div fxLayout=\"row\" fxFalyoutGap=\"10px\" fxFill style=\"padding-top: 10px;\">\r\n <div fxFlex=\"72px\" fxFlexAlign=\"center\" style=\"padding-left: 8px;\">\r\n @if (dialogData.multi) {\r\n <mat-checkbox color=\"primary\" (change)=\"$event ? masterSelectionToggle($event) : null\"\r\n [indeterminate]=\"selectionMasterIndeterminate()\" [checked]=\"selectionMasterChecked()\"\r\n [attr.aria-label]=\"'Seleziona/deseleziona tutto'\" matTooltip=\"Seleziona/deseleziona tutto\">\r\n </mat-checkbox>\r\n }\r\n </div>\r\n <div fxFlex=\"100\" fxFlexAlign=\"center\">\r\n @if (dialogData.header) {\r\n <div [innerHtml]=\"dialogData.header | safeHtml\"></div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n<div mat-dialog-content>\r\n <div fxLayout=\"column\" fxFill>\r\n @if (dialogData.canLookup && (!dialogData.items || dialogData.items.length == 0)) {\r\n <div style=\"padding:24px; text-align: center\"><i>\r\n @if (!dialogData.emptyMessage) {\r\n <span class=\"item-greyed-1\">Nessun elemento da visualizzare.<br>Esegui una nuova ricerca o modifica quella\r\n esistente.\r\n @if (dialogData.maxItems > 0) {\r\n <span>Saranno mostrati al massimo {{dialogData.maxItems}} elementi.</span>\r\n }\r\n </span>\r\n } @else {\r\n <span class=\"item-greyed-1\" [innerHtml]=\"dialogData.emptyMessage | safeHtml\"></span>\r\n }\r\n </i>\r\n </div>\r\n }\r\n <mat-selection-list #selection (selectionChange)=\"select($event)\" dense hideSingleSelectionIndicator=\"true\">\r\n @for (item of (dialogData.items | search: (!dialogData.canLookup ? filterText : '')); track item) {\r\n <mat-list-option [value]=\"item\" [selected]=\"item.selected\" checkboxPosition=\"before\" color=\"primary\">\r\n <div [innerHtml]=\"item.template | safeHtml\"></div>\r\n </mat-list-option>\r\n }\r\n </mat-selection-list>\r\n </div>\r\n</div>\r\n<div mat-dialog-actions>\r\n <div fxLayout=\"column\" fxFill>\r\n <div fxLayout=\"row\" fxLayoutAlign=\"space-between center\" fxLayoutGap=\"10px\" fxFill>\r\n <div style=\"padding-left:20px\">\r\n @if (selectionInfo) {\r\n <span class=\"small\">selezione: </span><span class=\"bold\">{{selectionInfo}}</span>\r\n }\r\n </div>\r\n <div fxFlexAlign=\"center\">\r\n @if (canPaginate) {\r\n <div [hidden]=\"!dialogData.items || dialogData.items.length === 0\">\r\n <mat-paginator #paginator [hidePageSize]=\"true\" [pageSize]=\"dialogData.pageSize\" [showFirstLastButtons]=\"true\"\r\n (page)=\"doLookupPage($event)\"></mat-paginator>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutAlign=\"end\" fxFill>\r\n <button mat-flat-button color=\"primary\" (click)=\"ok()\" [disabled]=\"okDisabled\">\r\n <span>{{dialogData.mustSelect ? dialogData.okCaption : 'CHIUDI'}}</span>\r\n </button>\r\n @if (dialogData.mustSelect) {\r\n <button mat-button mat-dialog-close cdkFocusInitial color=\"primary\">\r\n <span>ANNULLA</span>\r\n </button>\r\n }\r\n </div>\r\n </div>\r\n</div>", styles: [":root{--ars-dialog-info-ok: #388E3C;--ars-filterbox-filtered-background-color: #f9fbe7}.dialog-info{font-size:x-small;font-weight:700;text-align:right;padding:10px}.dialog-info-green,.dialog-info-ok{color:var(--ars-dialog-info-ok, #388E3C)}.dialog-info-red,.dialog-info-error{color:var(--mat-form-field-error-text-color, #a80710)}.dialog-title{padding:0 24px}.section-title{font-size:large;font-weight:600;padding-top:10px;padding-bottom:8px}b{font-weight:700}.large{font-size:large!important}.small{font-size:small!important}.small-icon-button{width:1.5rem!important;height:1.5rem!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center}.small-icon-button .mat-mdc-button-touch-target{width:1.5rem!important;height:1.5rem!important}.x-small{font-size:x-small!important}.uppercase{text-transform:uppercase!important}.lowercase{text-transform:lowercase!important}.truncated{min-width:0}.truncated span,.truncated div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (prefers-color-scheme: dark){:root{--ars-dialog-info-ok: #4CAF50;--ars-filterbox-filtered-background-color: #c6c7b8}.dialog-info-green,.dialog-info-ok{color:var(--ars-dialog-info-ok, #4CAF50)}.dialog-info-red,.dialog-info-error{color:var(--mat-form-field-error-text-color, #ff5449)}b{font-weight:600}}\n"] }]
|
|
957
|
+
}], propDecorators: { paginator: [{
|
|
966
958
|
type: ViewChild,
|
|
967
959
|
args: ['paginator']
|
|
968
960
|
}], selection: [{
|
|
@@ -1942,7 +1934,7 @@ class FilterBarComponent {
|
|
|
1942
1934
|
this.text3 = this.currentFilter.text3;
|
|
1943
1935
|
}
|
|
1944
1936
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: FilterBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1945
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: FilterBarComponent, isStandalone: true, selector: "filter-bar", inputs: { filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null }, canFilterByText: { classPropertyName: "canFilterByText", publicName: "canFilterByText", isSignal: true, isRequired: false, transformFunction: null }, canFilterByText2: { classPropertyName: "canFilterByText2", publicName: "canFilterByText2", isSignal: true, isRequired: false, transformFunction: null }, canFilterByText3: { classPropertyName: "canFilterByText3", publicName: "canFilterByText3", isSignal: true, isRequired: false, transformFunction: null }, textName: { classPropertyName: "textName", publicName: "textName", isSignal: true, isRequired: false, transformFunction: null }, text2Name: { classPropertyName: "text2Name", publicName: "text2Name", isSignal: true, isRequired: false, transformFunction: null }, text3Name: { classPropertyName: "text3Name", publicName: "text3Name", isSignal: true, isRequired: false, transformFunction: null }, textLength: { classPropertyName: "textLength", publicName: "textLength", isSignal: true, isRequired: false, transformFunction: null }, text2Length: { classPropertyName: "text2Length", publicName: "text2Length", isSignal: true, isRequired: false, transformFunction: null }, text3Length: { classPropertyName: "text3Length", publicName: "text3Length", isSignal: true, isRequired: false, transformFunction: null }, showTextSearchButton: { classPropertyName: "showTextSearchButton", publicName: "showTextSearchButton", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: false, isRequired: false, transformFunction: null }, text2: { classPropertyName: "text2", publicName: "text2", isSignal: false, isRequired: false, transformFunction: null }, text3: { classPropertyName: "text3", publicName: "text3", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { changed: "changed" }, ngImport: i0, template: "<div fxLayout=\"row\" fxLayoutAlign=\"start center\" class=\"filterbox\"\r\n[ngClass]=\"{'filterbox-filtered': currentFilter.filtered()}\">\r\n <div fxFlex=\"100\" fxLayout=\"row wrap\" fxLayoutAlign=\"space-between\">\r\n @if (canFilterByText() || canFilterByText2() || canFilterByText3()) {\r\n <div fxFlex.lt-sm=\"100\" fxFlexAlign=\"center\">\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill style=\"padding:4px;\">\r\n @if (canFilterByText()) {\r\n <mat-form-field [ngStyle]=\"{'width': textLength() ?? '100%'}\" [appearance]=\"appearance()\" subscriptSizing=\"dynamic\">\r\n <mat-label>Cerca per {{textName()}}...</mat-label>\r\n <input matInput name=\"_text\" [(ngModel)]=\"text\" maxlength=\"100\" #_text=\"ngModel\"\r\n (keyup.Enter)=\"applyTextFilter()\" matTooltip=\"Premi INVIO per avviare la ricerca\">\r\n @if (text) {\r\n <button type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button aria-label=\"Pulisci\"\r\n (click)=\"text = ''; applyTextFilter();\" matTooltip=\"Azzera\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n @if (showTextSearchButton()) {\r\n <button type=\"button\" matSuffix mat-icon-button aria-label=\"Trova\" (click)=\"applyTextFilter();\"\r\n matTooltip=\"Trova\">\r\n <mat-icon>search</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n }\r\n @if (canFilterByText2()) {\r\n <mat-form-field [ngStyle]=\"{'width': text2Length() ?? '100%'}\" [appearance]=\"appearance()\" subscriptSizing=\"dynamic\">\r\n <mat-label>Cerca per {{text2Name()}}...</mat-label>\r\n <input matInput name=\"_text2\" [(ngModel)]=\"text2\" maxlength=\"100\" #_text2=\"ngModel\"\r\n (keyup.Enter)=\"applyTextFilter()\" matTooltip=\"Premi INVIO per avviare la ricerca\">\r\n @if (text2) {\r\n <button type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button aria-label=\"Pulisci\"\r\n (click)=\"text2 = ''; applyTextFilter();\" matTooltip=\"Azzera\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n }\r\n @if (canFilterByText3()) {\r\n <mat-form-field [ngStyle]=\"{'width': text3Length() ?? '100%'}\" [appearance]=\"appearance()\" subscriptSizing=\"dynamic\">\r\n <mat-label>Cerca per {{text3Name()}}...</mat-label>\r\n <input matInput name=\"_text3\" [(ngModel)]=\"text3\" maxlength=\"100\" #_text3=\"ngModel\"\r\n (keyup.Enter)=\"applyTextFilter()\" matTooltip=\"Premi INVIO per avviare la ricerca\">\r\n @if (text3) {\r\n <button type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button aria-label=\"Pulisci\"\r\n (click)=\"text3 = ''; applyTextFilter();\" matTooltip=\"Azzera\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n }\r\n </div>\r\n </div>\r\n }\r\n <div fxFlex.lt-sm=\"100\">\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill >\r\n @if (canFilterByFlt1() && flt1 && flt1.action) {\r\n <div fxLayout=\"row\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button\r\n [matTooltip]=\"flt1.tooltip || 'Filtra per ' + flt1.title\"\r\n [attr.aria-label]=\"flt1.tooltip || 'Filtra per ' + flt1.title\" color=\"primary\"\r\n (click)=\"applyFilterAction(1, false)\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt1) {\r\n <span style=\"font-weight: 200 !important\">{{flt1.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt1Name | safeHtml\"></span>\r\n }\r\n </button>\r\n @if (currentFilter.flt1) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\" matTooltip=\"Azzera\"\r\n aria-label=\"'Azzera'\" (click)=\"applyFilterAction(1, true);\" class=\"small-icon-button\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n } @else if (canFilterByFlt1() && flt1 && flt1.items) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button [matTooltip]=\"flt1.tooltip || 'Filtra per ' + flt1.title\"\r\n [attr.aria-label]=\"flt1.tooltip || 'Filtra per ' + flt1.title\" [matMenuTriggerFor]=\"menuApplyFilterFlt1\"\r\n color=\"primary\" style=\"height:56px;\" >\r\n \r\n @if (!currentFilter.flt1) {\r\n <span style=\"font-weight: 200 !important\">{{flt1.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt1Name | safeHtml\"></span>\r\n } \r\n <mat-icon class=\"icon-menu-drop-down\">expand_more</mat-icon>\r\n <mat-menu #menuApplyFilterFlt1=\"matMenu\">\r\n @for (f of flt1.items; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n <button mat-menu-item (click)=\"applyFilter(f)\" [attr.aria-label]=\"f.description\" style=\"min-width: 200px\">\r\n <span [innerHTML]=\"f.title | safeHtml\"></span>\r\n </button>\r\n\r\n }\r\n <mat-divider></mat-divider>\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxLayoutAlign=\"end\" style=\"width: 100%; min-width: 200px; padding: 4px 4px 0 4px;\">\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"clearFilter(flt1.items[0].group)\"\r\n attr.aria-label=\"Azzera\">\r\n <mat-icon style=\"font-size:18px; height: 18px; width:18px;\">clear</mat-icon> Azzera\r\n </button>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n </button>\r\n }\r\n\r\n @if (canFilterByFlt2() && flt2 && flt2.action) {\r\n <div fxLayout=\"row\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button\r\n [matTooltip]=\"flt2.tooltip || 'Filtra per ' + flt2.title\"\r\n [attr.aria-label]=\"flt2.tooltip || 'Filtra per ' + flt2.title\" color=\"primary\"\r\n (click)=\"applyFilterAction(2, false)\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt2) {\r\n <span style=\"font-weight: 200 !important\">{{flt2.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt2Name | safeHtml\"></span>\r\n }\r\n </button>\r\n @if (currentFilter.flt2) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\" matTooltip=\"Azzera\"\r\n aria-label=\"'Azzera'\" (click)=\"applyFilterAction(2, true);\" class=\"small-icon-button\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n @if (canFilterByFlt2() && flt2 && flt2.items) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button [matTooltip]=\"flt2.tooltip || 'Filtra per ' + flt2.title\"\r\n [attr.aria-label]=\"flt2.tooltip || 'Filtra per ' + flt2.title\" [matMenuTriggerFor]=\"menuApplyFilterFlt2\"\r\n color=\"primary\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt2) {\r\n <span style=\"font-weight: 200 !important\">{{flt2.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt2Name | safeHtml\"></span>\r\n }\r\n <mat-icon class=\"icon-menu-drop-down\">expand_more</mat-icon>\r\n <mat-menu #menuApplyFilterFlt2=\"matMenu\">\r\n @for (f of flt2.items; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n <button mat-menu-item (click)=\"applyFilter(f)\" [attr.aria-label]=\"f.description\" style=\"min-width: 200px\">\r\n <span [innerHTML]=\"f.title | safeHtml\"></span>\r\n </button>\r\n\r\n }\r\n <mat-divider></mat-divider>\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxLayoutAlign=\"end\" style=\"width: 100%; min-width: 200px; padding: 4px 4px 0 4px;\">\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"clearFilter(flt2.items[0].group)\"\r\n attr.aria-label=\"Azzera\">\r\n <mat-icon style=\"font-size:18px; height: 18px; width:18px;\">clear</mat-icon> Azzera\r\n </button>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n </button>\r\n }\r\n\r\n @if (canFilterByFlt3() && flt3 && flt3.action) {\r\n <div fxLayout=\"row\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button\r\n [matTooltip]=\"flt3.tooltip || 'Filtra per ' + flt3.title\"\r\n [attr.aria-label]=\"flt3.tooltip || 'Filtra per ' + flt3.title\" color=\"primary\"\r\n (click)=\"applyFilterAction(3, false)\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt3) {\r\n <span style=\"font-weight: 200 !important\">{{flt3.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt3Name | safeHtml\"></span>\r\n }\r\n </button>\r\n @if (currentFilter.flt3) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\" matTooltip=\"Azzera\"\r\n aria-label=\"'Azzera'\" (click)=\"applyFilterAction(3, true);\" class=\"small-icon-button\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n @if (canFilterByFlt3() && flt3 && flt3.items) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button [matTooltip]=\"flt3.tooltip || 'Filtra per ' + flt3.title\"\r\n [attr.aria-label]=\"flt3.tooltip || 'Filtra per ' + flt3.title\" [matMenuTriggerFor]=\"menuApplyFilterFlt3\"\r\n color=\"primary\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt3) {\r\n <span style=\"font-weight: 200 !important\">{{flt3.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt3Name | safeHtml\"></span>\r\n }\r\n <mat-icon class=\"icon-menu-drop-down\">expand_more</mat-icon>\r\n <mat-menu #menuApplyFilterFlt3=\"matMenu\">\r\n @for (f of flt3.items; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n <button mat-menu-item (click)=\"applyFilter(f)\" [attr.aria-label]=\"f.description\" style=\"min-width: 200px\">\r\n <span [innerHTML]=\"f.title | safeHtml\"></span>\r\n </button>\r\n\r\n }\r\n <mat-divider></mat-divider>\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxLayoutAlign=\"end\" style=\"width: 100%; min-width: 200px; padding: 4px 4px 0 4px;\">\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"clearFilter(flt3.items[0].group)\"\r\n attr.aria-label=\"Azzera\">\r\n <mat-icon style=\"font-size:18px; height: 18px; width:18px;\">clear</mat-icon> Azzera\r\n </button>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n </button>\r\n }\r\n\r\n @if (canFilterByFlt4() && flt4 && flt4.action) {\r\n <div fxLayout=\"row\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button\r\n [matTooltip]=\"flt4.tooltip || 'Filtra per ' + flt4.title\"\r\n [attr.aria-label]=\"flt4.tooltip || 'Filtra per ' + flt4.title\" color=\"primary\"\r\n (click)=\"applyFilterAction(4, false)\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt4) {\r\n <span style=\"font-weight: 200 !important\">{{flt4.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt4Name | safeHtml\"></span>\r\n }\r\n </button>\r\n @if (currentFilter.flt4) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\" matTooltip=\"Azzera\"\r\n aria-label=\"'Azzera'\" (click)=\"applyFilterAction(4, true);\" class=\"small-icon-button\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n @if (canFilterByFlt4() && flt4 && flt4.items) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button [matTooltip]=\"flt4.tooltip || 'Filtra per ' + flt4.title\"\r\n [attr.aria-label]=\"flt4.tooltip || 'Filtra per ' + flt4.title\" [matMenuTriggerFor]=\"menuApplyFilterFlt4\"\r\n color=\"primary\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt4) {\r\n <span style=\"font-weight: 200 !important\">{{flt4.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt4Name | safeHtml\"></span>\r\n }\r\n <mat-icon class=\"icon-menu-drop-down\">expand_more</mat-icon>\r\n <mat-menu #menuApplyFilterFlt4=\"matMenu\">\r\n @for (f of flt4.items; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n <button mat-menu-item (click)=\"applyFilter(f)\" [attr.aria-label]=\"f.description\" style=\"min-width: 200px\">\r\n <span [innerHTML]=\"f.title | safeHtml\"></span>\r\n </button>\r\n\r\n }\r\n <mat-divider></mat-divider>\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxLayoutAlign=\"end\" style=\"width: 100%; min-width: 200px; padding: 4px 4px 0 4px;\">\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"clearFilter(flt4.items[0].group)\"\r\n attr.aria-label=\"Azzera\">\r\n <mat-icon style=\"font-size:18px; height: 18px; width:18px;\">clear</mat-icon> Azzera\r\n </button>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n </button>\r\n }\r\n\r\n @if (canFilterByFlt5() && flt5 && flt5.action) {\r\n <div fxLayout=\"row\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button\r\n [matTooltip]=\"flt5.tooltip || 'Filtra per ' + flt5.title\"\r\n [attr.aria-label]=\"flt5.tooltip || 'Filtra per ' + flt5.title\" color=\"primary\"\r\n (click)=\"applyFilterAction(5, false)\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt5) {\r\n <span style=\"font-weight: 200 !important\">{{flt5.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt5Name | safeHtml\"></span>\r\n }\r\n </button>\r\n @if (currentFilter.flt5) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\" matTooltip=\"Azzera\"\r\n aria-label=\"'Azzera'\" (click)=\"applyFilterAction(5, true);\" class=\"small-icon-button\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n @if (canFilterByFlt5() && flt5 && flt5.items) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button [matTooltip]=\"flt5.tooltip || 'Filtra per ' + flt5.title\"\r\n [attr.aria-label]=\"flt5.tooltip || 'Filtra per ' + flt5.title\" [matMenuTriggerFor]=\"menuApplyFilterFlt5\"\r\n color=\"primary\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt5) {\r\n <span style=\"font-weight: 200 !important\">{{flt5.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt5Name | safeHtml\"></span>\r\n }\r\n <mat-icon class=\"icon-menu-drop-down\">expand_more</mat-icon>\r\n <mat-menu #menuApplyFilterFlt5=\"matMenu\">\r\n @for (f of flt5.items; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n <button mat-menu-item (click)=\"applyFilter(f)\" [attr.aria-label]=\"f.description\" style=\"min-width: 200px\">\r\n <span [innerHTML]=\"f.title | safeHtml\"></span>\r\n </button>\r\n\r\n }\r\n <mat-divider></mat-divider>\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxLayoutAlign=\"end\" style=\"width: 100%; min-width: 200px; padding: 4px 4px 0 4px;\">\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"clearFilter(flt5.items[0].group)\"\r\n attr.aria-label=\"Azzera\">\r\n <mat-icon style=\"font-size:18px; height: 18px; width:18px;\">clear</mat-icon> Azzera\r\n </button>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n </button>\r\n }\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <div>\r\n @if (currentFilter.filtered() && canClearAllFilters()) {\r\n <button type=\"button\" mat-icon-button matTooltip=\"Azzera tutti i filtri\" attr.aria-label=\"Azzera tutti i filtri\"\r\n color=\"primary\" (click)=\"clearAllFilters()\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n</div>", styles: [":root{--ars-dialog-info-ok: #388E3C;--ars-filterbox-filtered-background-color: #f9fbe7}.dialog-info{font-size:x-small;font-weight:700;text-align:right;padding:10px}.dialog-info-green,.dialog-info-ok{color:var(--ars-dialog-info-ok, #388E3C)}.dialog-info-red,.dialog-info-error{color:var(--mat-form-field-error-text-color, #a80710)}.dialog-title{padding:0 24px}.section-title{font-size:large;font-weight:600;padding-top:10px;padding-bottom:8px}b{font-weight:700}.large{font-size:large!important}.small{font-size:small!important}.small-icon-button{width:1.5rem!important;height:1.5rem!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center}.small-icon-button .mat-mdc-button-touch-target{width:1.5rem!important;height:1.5rem!important}.x-small{font-size:x-small!important}.uppercase{text-transform:uppercase!important}.lowercase{text-transform:lowercase!important}.truncated{min-width:0}.truncated span,.truncated div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (prefers-color-scheme: dark){:root{--ars-dialog-info-ok: #4CAF50;--ars-filterbox-filtered-background-color: #c6c7b8}.dialog-info-green,.dialog-info-ok{color:var(--ars-dialog-info-ok, #4CAF50)}.dialog-info-red,.dialog-info-error{color:var(--mat-form-field-error-text-color, #ff5449)}b{font-weight:600}}.filterbox{border-radius:auto;background-color:transparent;padding:4px}.filterbox-filtered{border-radius:12px;background-color:var(--ars-filterbox-filtered-background-color, #f9fbe7)}@media (prefers-color-scheme: dark){.filterbox-filtered{background-color:var(--ars-filterbox-filtered-background-color, #f9fbe7)}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FlexModule }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "directive", type: i2.DefaultFlexAlignDirective, selector: " [fxFlexAlign], [fxFlexAlign.xs], [fxFlexAlign.sm], [fxFlexAlign.md], [fxFlexAlign.lg], [fxFlexAlign.xl], [fxFlexAlign.lt-sm], [fxFlexAlign.lt-md], [fxFlexAlign.lt-lg], [fxFlexAlign.lt-xl], [fxFlexAlign.gt-xs], [fxFlexAlign.gt-sm], [fxFlexAlign.gt-md], [fxFlexAlign.gt-lg]", inputs: ["fxFlexAlign", "fxFlexAlign.xs", "fxFlexAlign.sm", "fxFlexAlign.md", "fxFlexAlign.lg", "fxFlexAlign.xl", "fxFlexAlign.lt-sm", "fxFlexAlign.lt-md", "fxFlexAlign.lt-lg", "fxFlexAlign.lt-xl", "fxFlexAlign.gt-xs", "fxFlexAlign.gt-sm", "fxFlexAlign.gt-md", "fxFlexAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "ngmodule", type: ExtendedModule }, { kind: "directive", type: i2$1.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i2$1.DefaultStyleDirective, selector: " [ngStyle], [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl], [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl], [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]", inputs: ["ngStyle", "ngStyle.xs", "ngStyle.sm", "ngStyle.md", "ngStyle.lg", "ngStyle.xl", "ngStyle.lt-sm", "ngStyle.lt-md", "ngStyle.lt-lg", "ngStyle.lt-xl", "ngStyle.gt-xs", "ngStyle.gt-sm", "ngStyle.gt-md", "ngStyle.gt-lg"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i11.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i11.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i11.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i12.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1937
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.3", type: FilterBarComponent, isStandalone: true, selector: "filter-bar", inputs: { filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null }, canFilterByText: { classPropertyName: "canFilterByText", publicName: "canFilterByText", isSignal: true, isRequired: false, transformFunction: null }, canFilterByText2: { classPropertyName: "canFilterByText2", publicName: "canFilterByText2", isSignal: true, isRequired: false, transformFunction: null }, canFilterByText3: { classPropertyName: "canFilterByText3", publicName: "canFilterByText3", isSignal: true, isRequired: false, transformFunction: null }, textName: { classPropertyName: "textName", publicName: "textName", isSignal: true, isRequired: false, transformFunction: null }, text2Name: { classPropertyName: "text2Name", publicName: "text2Name", isSignal: true, isRequired: false, transformFunction: null }, text3Name: { classPropertyName: "text3Name", publicName: "text3Name", isSignal: true, isRequired: false, transformFunction: null }, textLength: { classPropertyName: "textLength", publicName: "textLength", isSignal: true, isRequired: false, transformFunction: null }, text2Length: { classPropertyName: "text2Length", publicName: "text2Length", isSignal: true, isRequired: false, transformFunction: null }, text3Length: { classPropertyName: "text3Length", publicName: "text3Length", isSignal: true, isRequired: false, transformFunction: null }, showTextSearchButton: { classPropertyName: "showTextSearchButton", publicName: "showTextSearchButton", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: false, isRequired: false, transformFunction: null }, text2: { classPropertyName: "text2", publicName: "text2", isSignal: false, isRequired: false, transformFunction: null }, text3: { classPropertyName: "text3", publicName: "text3", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { changed: "changed" }, ngImport: i0, template: "<div fxLayout=\"row\" fxLayoutAlign=\"start center\" class=\"filterbox\"\r\n[ngClass]=\"{'filterbox-filtered': currentFilter.filtered()}\">\r\n <div fxFlex=\"100\" fxLayout=\"row wrap\" fxLayoutAlign=\"space-between\">\r\n @if (canFilterByText() || canFilterByText2() || canFilterByText3()) {\r\n <div fxFlex.lt-sm=\"100\" fxFlexAlign=\"center\">\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill style=\"padding:4px;\">\r\n @if (canFilterByText()) {\r\n <mat-form-field [ngStyle]=\"{'width': textLength() ?? '100%'}\" [appearance]=\"appearance()\" subscriptSizing=\"dynamic\">\r\n <mat-label>Cerca per {{textName()}}...</mat-label>\r\n <input matInput name=\"_text\" [(ngModel)]=\"text\" maxlength=\"100\" #_text=\"ngModel\"\r\n (keyup.Enter)=\"applyTextFilter()\" matTooltip=\"Premi INVIO per avviare la ricerca\">\r\n @if (text) {\r\n <button type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button aria-label=\"Pulisci\"\r\n (click)=\"text = ''; applyTextFilter();\" matTooltip=\"Azzera\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n @if (showTextSearchButton()) {\r\n <button type=\"button\" matSuffix mat-icon-button aria-label=\"Trova\" (click)=\"applyTextFilter();\"\r\n matTooltip=\"Trova\">\r\n <mat-icon>search</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n }\r\n @if (canFilterByText2()) {\r\n <mat-form-field [ngStyle]=\"{'width': text2Length() ?? '100%'}\" [appearance]=\"appearance()\" subscriptSizing=\"dynamic\">\r\n <mat-label>Cerca per {{text2Name()}}...</mat-label>\r\n <input matInput name=\"_text2\" [(ngModel)]=\"text2\" maxlength=\"100\" #_text2=\"ngModel\"\r\n (keyup.Enter)=\"applyTextFilter()\" matTooltip=\"Premi INVIO per avviare la ricerca\">\r\n @if (text2) {\r\n <button type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button aria-label=\"Pulisci\"\r\n (click)=\"text2 = ''; applyTextFilter();\" matTooltip=\"Azzera\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n }\r\n @if (canFilterByText3()) {\r\n <mat-form-field [ngStyle]=\"{'width': text3Length() ?? '100%'}\" [appearance]=\"appearance()\" subscriptSizing=\"dynamic\">\r\n <mat-label>Cerca per {{text3Name()}}...</mat-label>\r\n <input matInput name=\"_text3\" [(ngModel)]=\"text3\" maxlength=\"100\" #_text3=\"ngModel\"\r\n (keyup.Enter)=\"applyTextFilter()\" matTooltip=\"Premi INVIO per avviare la ricerca\">\r\n @if (text3) {\r\n <button type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button aria-label=\"Pulisci\"\r\n (click)=\"text3 = ''; applyTextFilter();\" matTooltip=\"Azzera\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n }\r\n </div>\r\n </div>\r\n }\r\n <div fxFlex.lt-sm=\"100\">\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill >\r\n @if (canFilterByFlt1() && flt1 && flt1.action) {\r\n <div fxLayout=\"row\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button\r\n [matTooltip]=\"flt1.tooltip || 'Filtra per ' + flt1.title\"\r\n [attr.aria-label]=\"flt1.tooltip || 'Filtra per ' + flt1.title\" color=\"primary\"\r\n (click)=\"applyFilterAction(1, false)\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt1) {\r\n <span style=\"font-weight: 200 !important\">{{flt1.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt1Name | safeHtml\"></span>\r\n }\r\n </button>\r\n @if (currentFilter.flt1) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\" matTooltip=\"Azzera\"\r\n aria-label=\"'Azzera'\" (click)=\"applyFilterAction(1, true);\" class=\"small-icon-button\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n } @else if (canFilterByFlt1() && flt1 && flt1.items) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button [matTooltip]=\"flt1.tooltip || 'Filtra per ' + flt1.title\"\r\n [attr.aria-label]=\"flt1.tooltip || 'Filtra per ' + flt1.title\" [matMenuTriggerFor]=\"menuApplyFilterFlt1\"\r\n color=\"primary\" style=\"height:56px;\" >\r\n \r\n @if (!currentFilter.flt1) {\r\n <span style=\"font-weight: 200 !important\">{{flt1.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt1Name | safeHtml\"></span>\r\n } \r\n <mat-icon class=\"icon-menu-drop-down\">expand_more</mat-icon>\r\n <mat-menu #menuApplyFilterFlt1=\"matMenu\">\r\n @for (f of flt1.items; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n <button mat-menu-item (click)=\"applyFilter(f)\" [attr.aria-label]=\"f.description\" style=\"min-width: 200px\">\r\n <span [innerHTML]=\"f.title | safeHtml\"></span>\r\n </button>\r\n\r\n }\r\n <mat-divider></mat-divider>\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxLayoutAlign=\"end\" style=\"width: 100%; min-width: 200px; padding: 4px 4px 0 4px;\">\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"clearFilter(flt1.items[0].group)\"\r\n attr.aria-label=\"Azzera\">\r\n <mat-icon style=\"font-size:18px; height: 18px; width:18px;\">clear</mat-icon> Azzera\r\n </button>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n </button>\r\n }\r\n\r\n @if (canFilterByFlt2() && flt2 && flt2.action) {\r\n <div fxLayout=\"row\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button\r\n [matTooltip]=\"flt2.tooltip || 'Filtra per ' + flt2.title\"\r\n [attr.aria-label]=\"flt2.tooltip || 'Filtra per ' + flt2.title\" color=\"primary\"\r\n (click)=\"applyFilterAction(2, false)\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt2) {\r\n <span style=\"font-weight: 200 !important\">{{flt2.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt2Name | safeHtml\"></span>\r\n }\r\n </button>\r\n @if (currentFilter.flt2) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\" matTooltip=\"Azzera\"\r\n aria-label=\"'Azzera'\" (click)=\"applyFilterAction(2, true);\" class=\"small-icon-button\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n @if (canFilterByFlt2() && flt2 && flt2.items) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button [matTooltip]=\"flt2.tooltip || 'Filtra per ' + flt2.title\"\r\n [attr.aria-label]=\"flt2.tooltip || 'Filtra per ' + flt2.title\" [matMenuTriggerFor]=\"menuApplyFilterFlt2\"\r\n color=\"primary\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt2) {\r\n <span style=\"font-weight: 200 !important\">{{flt2.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt2Name | safeHtml\"></span>\r\n }\r\n <mat-icon class=\"icon-menu-drop-down\">expand_more</mat-icon>\r\n <mat-menu #menuApplyFilterFlt2=\"matMenu\">\r\n @for (f of flt2.items; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n <button mat-menu-item (click)=\"applyFilter(f)\" [attr.aria-label]=\"f.description\" style=\"min-width: 200px\">\r\n <span [innerHTML]=\"f.title | safeHtml\"></span>\r\n </button>\r\n\r\n }\r\n <mat-divider></mat-divider>\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxLayoutAlign=\"end\" style=\"width: 100%; min-width: 200px; padding: 4px 4px 0 4px;\">\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"clearFilter(flt2.items[0].group)\"\r\n attr.aria-label=\"Azzera\">\r\n <mat-icon style=\"font-size:18px; height: 18px; width:18px;\">clear</mat-icon> Azzera\r\n </button>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n </button>\r\n }\r\n\r\n @if (canFilterByFlt3() && flt3 && flt3.action) {\r\n <div fxLayout=\"row\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button\r\n [matTooltip]=\"flt3.tooltip || 'Filtra per ' + flt3.title\"\r\n [attr.aria-label]=\"flt3.tooltip || 'Filtra per ' + flt3.title\" color=\"primary\"\r\n (click)=\"applyFilterAction(3, false)\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt3) {\r\n <span style=\"font-weight: 200 !important\">{{flt3.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt3Name | safeHtml\"></span>\r\n }\r\n </button>\r\n @if (currentFilter.flt3) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\" matTooltip=\"Azzera\"\r\n aria-label=\"'Azzera'\" (click)=\"applyFilterAction(3, true);\" class=\"small-icon-button\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n @if (canFilterByFlt3() && flt3 && flt3.items) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button [matTooltip]=\"flt3.tooltip || 'Filtra per ' + flt3.title\"\r\n [attr.aria-label]=\"flt3.tooltip || 'Filtra per ' + flt3.title\" [matMenuTriggerFor]=\"menuApplyFilterFlt3\"\r\n color=\"primary\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt3) {\r\n <span style=\"font-weight: 200 !important\">{{flt3.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt3Name | safeHtml\"></span>\r\n }\r\n <mat-icon class=\"icon-menu-drop-down\">expand_more</mat-icon>\r\n <mat-menu #menuApplyFilterFlt3=\"matMenu\">\r\n @for (f of flt3.items; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n <button mat-menu-item (click)=\"applyFilter(f)\" [attr.aria-label]=\"f.description\" style=\"min-width: 200px\">\r\n <span [innerHTML]=\"f.title | safeHtml\"></span>\r\n </button>\r\n\r\n }\r\n <mat-divider></mat-divider>\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxLayoutAlign=\"end\" style=\"width: 100%; min-width: 200px; padding: 4px 4px 0 4px;\">\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"clearFilter(flt3.items[0].group)\"\r\n attr.aria-label=\"Azzera\">\r\n <mat-icon style=\"font-size:18px; height: 18px; width:18px;\">clear</mat-icon> Azzera\r\n </button>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n </button>\r\n }\r\n\r\n @if (canFilterByFlt4() && flt4 && flt4.action) {\r\n <div fxLayout=\"row\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button\r\n [matTooltip]=\"flt4.tooltip || 'Filtra per ' + flt4.title\"\r\n [attr.aria-label]=\"flt4.tooltip || 'Filtra per ' + flt4.title\" color=\"primary\"\r\n (click)=\"applyFilterAction(4, false)\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt4) {\r\n <span style=\"font-weight: 200 !important\">{{flt4.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt4Name | safeHtml\"></span>\r\n }\r\n </button>\r\n @if (currentFilter.flt4) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\" matTooltip=\"Azzera\"\r\n aria-label=\"'Azzera'\" (click)=\"applyFilterAction(4, true);\" class=\"small-icon-button\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n @if (canFilterByFlt4() && flt4 && flt4.items) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button [matTooltip]=\"flt4.tooltip || 'Filtra per ' + flt4.title\"\r\n [attr.aria-label]=\"flt4.tooltip || 'Filtra per ' + flt4.title\" [matMenuTriggerFor]=\"menuApplyFilterFlt4\"\r\n color=\"primary\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt4) {\r\n <span style=\"font-weight: 200 !important\">{{flt4.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt4Name | safeHtml\"></span>\r\n }\r\n <mat-icon class=\"icon-menu-drop-down\">expand_more</mat-icon>\r\n <mat-menu #menuApplyFilterFlt4=\"matMenu\">\r\n @for (f of flt4.items; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n <button mat-menu-item (click)=\"applyFilter(f)\" [attr.aria-label]=\"f.description\" style=\"min-width: 200px\">\r\n <span [innerHTML]=\"f.title | safeHtml\"></span>\r\n </button>\r\n\r\n }\r\n <mat-divider></mat-divider>\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxLayoutAlign=\"end\" style=\"width: 100%; min-width: 200px; padding: 4px 4px 0 4px;\">\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"clearFilter(flt4.items[0].group)\"\r\n attr.aria-label=\"Azzera\">\r\n <mat-icon style=\"font-size:18px; height: 18px; width:18px;\">clear</mat-icon> Azzera\r\n </button>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n </button>\r\n }\r\n\r\n @if (canFilterByFlt5() && flt5 && flt5.action) {\r\n <div fxLayout=\"row\">\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button\r\n [matTooltip]=\"flt5.tooltip || 'Filtra per ' + flt5.title\"\r\n [attr.aria-label]=\"flt5.tooltip || 'Filtra per ' + flt5.title\" color=\"primary\"\r\n (click)=\"applyFilterAction(5, false)\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt5) {\r\n <span style=\"font-weight: 200 !important\">{{flt5.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt5Name | safeHtml\"></span>\r\n }\r\n </button>\r\n @if (currentFilter.flt5) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-icon-button color=\"primary\" matTooltip=\"Azzera\"\r\n aria-label=\"'Azzera'\" (click)=\"applyFilterAction(5, true);\" class=\"small-icon-button\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n }\r\n @if (canFilterByFlt5() && flt5 && flt5.items) {\r\n <button fxFlexAlign=\"center\" type=\"button\" mat-button [matTooltip]=\"flt5.tooltip || 'Filtra per ' + flt5.title\"\r\n [attr.aria-label]=\"flt5.tooltip || 'Filtra per ' + flt5.title\" [matMenuTriggerFor]=\"menuApplyFilterFlt5\"\r\n color=\"primary\" style=\"height:56px;\">\r\n \r\n @if (!currentFilter.flt5) {\r\n <span style=\"font-weight: 200 !important\">{{flt5.title}}</span>\r\n } @else {\r\n <span [innerHtml]=\"currentFilter.flt5Name | safeHtml\"></span>\r\n }\r\n <mat-icon class=\"icon-menu-drop-down\">expand_more</mat-icon>\r\n <mat-menu #menuApplyFilterFlt5=\"matMenu\">\r\n @for (f of flt5.items; track f) {\r\n\r\n @if (f.divider) {\r\n <mat-divider></mat-divider>\r\n }\r\n <button mat-menu-item (click)=\"applyFilter(f)\" [attr.aria-label]=\"f.description\" style=\"min-width: 200px\">\r\n <span [innerHTML]=\"f.title | safeHtml\"></span>\r\n </button>\r\n\r\n }\r\n <mat-divider></mat-divider>\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxLayoutAlign=\"end\" style=\"width: 100%; min-width: 200px; padding: 4px 4px 0 4px;\">\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"clearFilter(flt5.items[0].group)\"\r\n attr.aria-label=\"Azzera\">\r\n <mat-icon style=\"font-size:18px; height: 18px; width:18px;\">clear</mat-icon> Azzera\r\n </button>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n </button>\r\n }\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <div>\r\n @if (currentFilter.filtered() && canClearAllFilters()) {\r\n <button type=\"button\" mat-icon-button matTooltip=\"Azzera tutti i filtri\" attr.aria-label=\"Azzera tutti i filtri\"\r\n color=\"primary\" (click)=\"clearAllFilters()\">\r\n <mat-icon>clear</mat-icon>\r\n </button>\r\n }\r\n </div>\r\n</div>", styles: [":root{--ars-dialog-info-ok: #388E3C;--ars-filterbox-filtered-background-color: #f9fbe7}.dialog-info{font-size:x-small;font-weight:700;text-align:right;padding:10px}.dialog-info-green,.dialog-info-ok{color:var(--ars-dialog-info-ok, #388E3C)}.dialog-info-red,.dialog-info-error{color:var(--mat-form-field-error-text-color, #a80710)}.dialog-title{padding:0 24px}.section-title{font-size:large;font-weight:600;padding-top:10px;padding-bottom:8px}b{font-weight:700}.large{font-size:large!important}.small{font-size:small!important}.small-icon-button{width:1.5rem!important;height:1.5rem!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center}.small-icon-button .mat-mdc-button-touch-target{width:1.5rem!important;height:1.5rem!important}.x-small{font-size:x-small!important}.uppercase{text-transform:uppercase!important}.lowercase{text-transform:lowercase!important}.truncated{min-width:0}.truncated span,.truncated div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (prefers-color-scheme: dark){:root{--ars-dialog-info-ok: #4CAF50;--ars-filterbox-filtered-background-color: #c6c7b8}.dialog-info-green,.dialog-info-ok{color:var(--ars-dialog-info-ok, #4CAF50)}.dialog-info-red,.dialog-info-error{color:var(--mat-form-field-error-text-color, #ff5449)}b{font-weight:600}}.filterbox{border-radius:auto;background-color:transparent;padding:4px}.filterbox-filtered{border-radius:12px;background-color:var(--ars-filterbox-filtered-background-color, #f9fbe7)}@media (prefers-color-scheme: dark){.filterbox-filtered{background-color:var(--ars-filterbox-filtered-background-color, #f9fbe7)}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FlexModule }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "directive", type: i2.DefaultFlexAlignDirective, selector: " [fxFlexAlign], [fxFlexAlign.xs], [fxFlexAlign.sm], [fxFlexAlign.md], [fxFlexAlign.lg], [fxFlexAlign.xl], [fxFlexAlign.lt-sm], [fxFlexAlign.lt-md], [fxFlexAlign.lt-lg], [fxFlexAlign.lt-xl], [fxFlexAlign.gt-xs], [fxFlexAlign.gt-sm], [fxFlexAlign.gt-md], [fxFlexAlign.gt-lg]", inputs: ["fxFlexAlign", "fxFlexAlign.xs", "fxFlexAlign.sm", "fxFlexAlign.md", "fxFlexAlign.lg", "fxFlexAlign.xl", "fxFlexAlign.lt-sm", "fxFlexAlign.lt-md", "fxFlexAlign.lt-lg", "fxFlexAlign.lt-xl", "fxFlexAlign.gt-xs", "fxFlexAlign.gt-sm", "fxFlexAlign.gt-md", "fxFlexAlign.gt-lg"] }, { kind: "directive", type: i2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "ngmodule", type: ExtendedModule }, { kind: "directive", type: i2$1.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i2$1.DefaultStyleDirective, selector: " [ngStyle], [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl], [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl], [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]", inputs: ["ngStyle", "ngStyle.xs", "ngStyle.sm", "ngStyle.md", "ngStyle.lg", "ngStyle.xl", "ngStyle.lt-sm", "ngStyle.lt-md", "ngStyle.lt-lg", "ngStyle.lt-xl", "ngStyle.gt-xs", "ngStyle.gt-sm", "ngStyle.gt-md", "ngStyle.gt-lg"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i11.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1946
1938
|
}
|
|
1947
1939
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.3", ngImport: i0, type: FilterBarComponent, decorators: [{
|
|
1948
1940
|
type: Component,
|