@recursyve/nice-data-filter-kit 15.0.0 → 15.1.0
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/esm2020/lib/components/nice-filter-view/components/export-buttons/export-buttons.component.mjs +45 -17
- package/esm2020/lib/components/nice-filter-view/nice-base-filter-view.component.mjs +10 -2
- package/esm2020/lib/components/nice-filter-view/store/nice-filter-view.service.mjs +39 -4
- package/esm2020/lib/components/nice-filter-view/store/nice-filter-view.store.mjs +95 -4
- package/esm2020/lib/directive/selectable-list/model/selectable-list-options.model.mjs +1 -1
- package/esm2020/lib/directive/selectable-list/selectable-list.directive.mjs +5 -2
- package/esm2020/lib/directive/selectable-list/store/selectable-list-state.service.mjs +10 -5
- package/esm2020/lib/directive/selectable-list/store/selectable-list.state.mjs +1 -1
- package/esm2020/lib/models/filter.model.mjs +1 -1
- package/esm2020/lib/utils/filter.utils.mjs +3 -2
- package/fesm2015/recursyve-nice-data-filter-kit.mjs +1129 -975
- package/fesm2015/recursyve-nice-data-filter-kit.mjs.map +1 -1
- package/fesm2020/recursyve-nice-data-filter-kit.mjs +1124 -960
- package/fesm2020/recursyve-nice-data-filter-kit.mjs.map +1 -1
- package/lib/components/nice-filter-view/components/export-buttons/export-buttons.component.d.ts +8 -4
- package/lib/components/nice-filter-view/nice-base-filter-view.component.d.ts +2 -0
- package/lib/components/nice-filter-view/store/nice-filter-view.service.d.ts +5 -2
- package/lib/components/nice-filter-view/store/nice-filter-view.store.d.ts +4 -0
- package/lib/directive/selectable-list/model/selectable-list-options.model.d.ts +1 -0
- package/lib/directive/selectable-list/store/selectable-list-state.service.d.ts +1 -0
- package/lib/directive/selectable-list/store/selectable-list.state.d.ts +1 -0
- package/lib/models/filter.model.d.ts +2 -0
- package/package.json +1 -1
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { plainToInstance } from 'class-transformer';
|
|
2
2
|
import { map, takeUntil, debounceTime, switchMap, distinctUntilChanged, withLatestFrom } from 'rxjs/operators';
|
|
3
3
|
import { HttpParams } from '@angular/common/http';
|
|
4
|
-
import * as i5 from '@recursyve/nice-ui-kit.v2';
|
|
4
|
+
import * as i5$1 from '@recursyve/nice-ui-kit.v2';
|
|
5
5
|
import { isNullOrUndefined, ObjectUtils, FileUtils, ArrayUtils, ExportBottomSheetComponent, NiceLoadingSpinnerModule, NiceTypeaheadModule, NiceExportBottomSheetModule, NiceAsyncTypeaheadProvider, NICE_ASYNC_TYPEAHEAD_PROVIDER, NiceAsyncTypeaheadModule } from '@recursyve/nice-ui-kit.v2';
|
|
6
6
|
import * as i0 from '@angular/core';
|
|
7
|
-
import { Directive, Input, NgModule, Injectable, Inject, InjectionToken, Optional, Pipe, EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Output, HostListener, forwardRef, TemplateRef, ContentChild, ContentChildren,
|
|
8
|
-
import { Store, StoreConfig, Query, arrayAdd, arrayUpsert, arrayRemove, EntityStore, QueryEntity, EntityActions } from '@datorama/akita';
|
|
7
|
+
import { Directive, Input, NgModule, Injectable, Inject, InjectionToken, Optional, Pipe, EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Output, HostListener, forwardRef, TemplateRef, ContentChild, ContentChildren, QueryList, ViewChild } from '@angular/core';
|
|
8
|
+
import { Store, StoreConfig, Query, arrayAdd, arrayUpsert, arrayRemove, EntityStore, transaction, QueryEntity, EntityActions } from '@datorama/akita';
|
|
9
9
|
import { combineLatest, Subject, firstValueFrom, of, lastValueFrom, startWith, tap, distinct, take } from 'rxjs';
|
|
10
10
|
import { __decorate, __metadata } from 'tslib';
|
|
11
11
|
import * as i2 from '@angular/router';
|
|
12
12
|
import { RouterModule } from '@angular/router';
|
|
13
|
-
import * as
|
|
13
|
+
import * as i4$1 from '@angular/material/bottom-sheet';
|
|
14
14
|
import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
|
|
15
15
|
import * as i2$1 from '@angular/common';
|
|
16
16
|
import { CommonModule, AsyncPipe, NgIf, NgTemplateOutlet } from '@angular/common';
|
|
@@ -18,7 +18,7 @@ import * as i1$1 from '@angular/forms';
|
|
|
18
18
|
import { NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
|
|
19
19
|
import * as i8 from '@angular/material/button';
|
|
20
20
|
import { MatButtonModule } from '@angular/material/button';
|
|
21
|
-
import * as
|
|
21
|
+
import * as i5 from '@angular/material/icon';
|
|
22
22
|
import { MatIconModule } from '@angular/material/icon';
|
|
23
23
|
import * as i10 from '@angular/material/tooltip';
|
|
24
24
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
@@ -46,11 +46,11 @@ import * as i6 from '@angular/material/select';
|
|
|
46
46
|
import { MatSelectModule } from '@angular/material/select';
|
|
47
47
|
import * as i3$2 from '@angular/material/input';
|
|
48
48
|
import { MatInputModule } from '@angular/material/input';
|
|
49
|
-
import * as i4
|
|
49
|
+
import * as i4 from 'ngx-mask';
|
|
50
50
|
import { NgxMaskDirective } from 'ngx-mask';
|
|
51
51
|
import * as i3$3 from '@angular/material/radio';
|
|
52
52
|
import { MatRadioModule } from '@angular/material/radio';
|
|
53
|
-
import * as i5$
|
|
53
|
+
import * as i5$2 from '@angular/material/datepicker';
|
|
54
54
|
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
55
55
|
import * as i1$2 from '@ngx-translate/core';
|
|
56
56
|
import { TranslateModule } from '@ngx-translate/core';
|
|
@@ -571,7 +571,8 @@ class FilterUtils {
|
|
|
571
571
|
rules: filterParameters.rules ?? []
|
|
572
572
|
},
|
|
573
573
|
order: OrderUtils.combineOrders(filterParameters.order, filterParameters.fallbackOrder),
|
|
574
|
-
data: filterParameters.data
|
|
574
|
+
data: filterParameters.data,
|
|
575
|
+
groupBy: filterParameters.groupBy
|
|
575
576
|
};
|
|
576
577
|
}
|
|
577
578
|
static filterChangeNeedsRefresh(currentFilters, newFilters) {
|
|
@@ -1448,7 +1449,7 @@ class FilterSelectionComponent {
|
|
|
1448
1449
|
}
|
|
1449
1450
|
}
|
|
1450
1451
|
FilterSelectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilterSelectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1451
|
-
FilterSelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FilterSelectionComponent, selector: "nice-filter-selection", inputs: { filterConfigs: "filterConfigs", loading: "loading" }, outputs: { filterSelected: "filterSelected" }, ngImport: i0, template: "<mat-card class=\"flex flex-row flex-wrap filter-selection-container\" [niceLoadingOverlay]=\"loading\">\n <mat-list class=\"flex flex-col flex-full\" [class.double-groups]=\"filterGroups.length > 1\" *ngFor=\"let group of filterGroups\">\n <mat-list-item *ngIf=\"group[0].key | filterGroupIcon as icon\">\n <i mat-list-icon class=\"text-accent fal\" [ngClass]=\"icon.class\" *ngIf=\"icon.class\"></i>\n <mat-icon mat-list-icon class=\"text-accent\" [svgIcon]=\"icon.svgIcon\" *ngIf=\"icon.svgIcon\"></mat-icon>\n <mat-icon mat-list-icon class=\"text-accent\" *ngIf=\"icon.matIcon\">{{ icon.matIcon }}</mat-icon>\n <strong mat-line>{{ group[0].name }}</strong>\n </mat-list-item>\n <mat-list-item (click)=\"selectFilter(filter)\" mat-ripple class=\"filter\" *ngFor=\"let filter of group[1]\">\n {{ filter?.name }}\n </mat-list-item>\n </mat-list>\n</mat-card>\n", dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i11.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i3.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i3.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i15.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type:
|
|
1452
|
+
FilterSelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FilterSelectionComponent, selector: "nice-filter-selection", inputs: { filterConfigs: "filterConfigs", loading: "loading" }, outputs: { filterSelected: "filterSelected" }, ngImport: i0, template: "<mat-card class=\"flex flex-row flex-wrap filter-selection-container\" [niceLoadingOverlay]=\"loading\">\n <mat-list class=\"flex flex-col flex-full\" [class.double-groups]=\"filterGroups.length > 1\" *ngFor=\"let group of filterGroups\">\n <mat-list-item *ngIf=\"group[0].key | filterGroupIcon as icon\">\n <i mat-list-icon class=\"text-accent fal\" [ngClass]=\"icon.class\" *ngIf=\"icon.class\"></i>\n <mat-icon mat-list-icon class=\"text-accent\" [svgIcon]=\"icon.svgIcon\" *ngIf=\"icon.svgIcon\"></mat-icon>\n <mat-icon mat-list-icon class=\"text-accent\" *ngIf=\"icon.matIcon\">{{ icon.matIcon }}</mat-icon>\n <strong mat-line>{{ group[0].name }}</strong>\n </mat-list-item>\n <mat-list-item (click)=\"selectFilter(filter)\" mat-ripple class=\"filter\" *ngFor=\"let filter of group[1]\">\n {{ filter?.name }}\n </mat-list-item>\n </mat-list>\n</mat-card>\n", dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i11.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i3.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i3.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i15.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i5$1.NiceLoadingDirective, selector: "[niceLoadingOverlay]", inputs: ["niceLoadingOverlay"] }, { kind: "pipe", type: FilterGroupIconPipe, name: "filterGroupIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1452
1453
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FilterSelectionComponent, decorators: [{
|
|
1453
1454
|
type: Component,
|
|
1454
1455
|
args: [{ selector: "nice-filter-selection", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-card class=\"flex flex-row flex-wrap filter-selection-container\" [niceLoadingOverlay]=\"loading\">\n <mat-list class=\"flex flex-col flex-full\" [class.double-groups]=\"filterGroups.length > 1\" *ngFor=\"let group of filterGroups\">\n <mat-list-item *ngIf=\"group[0].key | filterGroupIcon as icon\">\n <i mat-list-icon class=\"text-accent fal\" [ngClass]=\"icon.class\" *ngIf=\"icon.class\"></i>\n <mat-icon mat-list-icon class=\"text-accent\" [svgIcon]=\"icon.svgIcon\" *ngIf=\"icon.svgIcon\"></mat-icon>\n <mat-icon mat-list-icon class=\"text-accent\" *ngIf=\"icon.matIcon\">{{ icon.matIcon }}</mat-icon>\n <strong mat-line>{{ group[0].name }}</strong>\n </mat-list-item>\n <mat-list-item (click)=\"selectFilter(filter)\" mat-ripple class=\"filter\" *ngFor=\"let filter of group[1]\">\n {{ filter?.name }}\n </mat-list-item>\n </mat-list>\n</mat-card>\n" }]
|
|
@@ -1617,7 +1618,7 @@ SelectFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
|
1617
1618
|
useExisting: forwardRef(() => SelectFilterComponent),
|
|
1618
1619
|
multi: true
|
|
1619
1620
|
}
|
|
1620
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<mat-form-field class=\"flex-auto\">\n <nice-typeahead *ngIf=\"!filterConfig.lazyLoading\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onValueChange($event)\"\n [items]=\"values\"\n bindValue=\"id\"\n bindLabel=\"name\"\n ></nice-typeahead>\n\n <nice-typeahead *ngIf=\"filterConfig.lazyLoading\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onValueChange($event)\"\n [items]=\"values\"\n [typeahead]=\"search$\"\n bindValue=\"id\"\n bindLabel=\"name\"\n ></nice-typeahead>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i5.NiceTypeaheadComponent, selector: "nice-typeahead", inputs: ["items", "labelFormatFn", "required", "disabled", "placeholder", "emptyPlaceholder", "allowNotFoundItems", "panelClass", "bindValue", "bindLabel", "typeahead", "page$", "loading", "loadingPage", "searchFn", "optionTemplate"], outputs: ["change"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1621
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<mat-form-field class=\"flex-auto\">\n <nice-typeahead *ngIf=\"!filterConfig.lazyLoading\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onValueChange($event)\"\n [items]=\"values\"\n bindValue=\"id\"\n bindLabel=\"name\"\n ></nice-typeahead>\n\n <nice-typeahead *ngIf=\"filterConfig.lazyLoading\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onValueChange($event)\"\n [items]=\"values\"\n [typeahead]=\"search$\"\n bindValue=\"id\"\n bindLabel=\"name\"\n ></nice-typeahead>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i5$1.NiceTypeaheadComponent, selector: "nice-typeahead", inputs: ["items", "labelFormatFn", "required", "disabled", "placeholder", "emptyPlaceholder", "allowNotFoundItems", "panelClass", "bindValue", "bindLabel", "typeahead", "page$", "loading", "loadingPage", "searchFn", "optionTemplate"], outputs: ["change"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1621
1622
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectFilterComponent, decorators: [{
|
|
1622
1623
|
type: Component,
|
|
1623
1624
|
args: [{ selector: "nice-select-filter", encapsulation: ViewEncapsulation.None, providers: [
|
|
@@ -1642,7 +1643,7 @@ TextFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
1642
1643
|
useExisting: forwardRef(() => TextFilterComponent),
|
|
1643
1644
|
multi: true
|
|
1644
1645
|
}
|
|
1645
|
-
], usesInheritance: true, ngImport: i0, template: "<mat-form-field class=\"flex-auto\">\n <input matInput [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\" [mask]=\"(filterConfig?.mask) || ''\" [validation]=\"false\" type=\"text\" />\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$2.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: "directive", type: i4
|
|
1646
|
+
], usesInheritance: true, ngImport: i0, template: "<mat-form-field class=\"flex-auto\">\n <input matInput [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\" [mask]=\"(filterConfig?.mask) || ''\" [validation]=\"false\" type=\"text\" />\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$2.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: "directive", type: i4.NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "triggerOnMaskChange"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1646
1647
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TextFilterComponent, decorators: [{
|
|
1647
1648
|
type: Component,
|
|
1648
1649
|
args: [{ selector: "nice-text-filter", encapsulation: ViewEncapsulation.None, providers: [
|
|
@@ -1713,7 +1714,7 @@ DateFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
1713
1714
|
useExisting: forwardRef(() => DateFilterComponent),
|
|
1714
1715
|
multi: true
|
|
1715
1716
|
}
|
|
1716
|
-
], usesInheritance: true, ngImport: i0, template: "<mat-form-field class=\"flex-auto\">\n <input matInput [matDatepicker]=\"picker\" [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\" />\n <mat-datepicker-toggle matSuffix [for]=\"picker\">\n <mat-icon matDatepickerToggleIcon [svgIcon]=\"icons.datePicker.svgIcon\">{{ icons.datePicker.matIcon }}</mat-icon>\n </mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type:
|
|
1717
|
+
], usesInheritance: true, ngImport: i0, template: "<mat-form-field class=\"flex-auto\">\n <input matInput [matDatepicker]=\"picker\" [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\" />\n <mat-datepicker-toggle matSuffix [for]=\"picker\">\n <mat-icon matDatepickerToggleIcon [svgIcon]=\"icons.datePicker.svgIcon\">{{ icons.datePicker.matIcon }}</mat-icon>\n </mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.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: "component", type: i5$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5$2.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }], encapsulation: i0.ViewEncapsulation.None });
|
|
1717
1718
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DateFilterComponent, decorators: [{
|
|
1718
1719
|
type: Component,
|
|
1719
1720
|
args: [{ selector: "nice-date-filter", encapsulation: ViewEncapsulation.None, providers: [
|
|
@@ -1781,7 +1782,7 @@ class RuleComponent {
|
|
|
1781
1782
|
}
|
|
1782
1783
|
}
|
|
1783
1784
|
RuleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RuleComponent, deps: [{ token: QUERY_BUILDER_ICONS, optional: true }, { token: i1$1.FormGroupName }], target: i0.ɵɵFactoryTarget.Component });
|
|
1784
|
-
RuleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: RuleComponent, selector: "nice-rule", inputs: { filterConfigs: "filterConfigs" }, outputs: { remove: "remove" }, ngImport: i0, template: "<div class=\"flex flex-row justify-start items-center gap-2.5\">\n <button\n class=\"select-filter\"\n mat-raised-button\n color=\"accent\"\n niceQueryBuilderTrigger\n [queryBuilderFilters]=\"filterConfigs\"\n (queryBuilderFilterSelected)=\"onUpdateFilterConfig($event)\"\n >\n <div class=\"flex flex-row justify-between items-center\">\n <div class=\"config-name\">{{ filterConfig?.name }}</div>\n <mat-icon [svgIcon]=\"icons.arrowDown.svgIcon\">{{ icons.arrowDown.matIcon }}</mat-icon>\n </div>\n </button>\n <div class=\"flex flex-col md:flex-row flex-auto justify-start items-center gap-2.5\">\n <mat-form-field class=\"rule-form-field\">\n <mat-select\n class=\"rule-operator\"\n [ngModel]=\"filterOperator\"\n (ngModelChange)=\"onUpdateFilterOperator($event)\"\n >\n <mat-option *ngFor=\"let operator of filterConfig?.operators\" [value]=\"operator.id\">\n {{ operator?.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <div class=\"flex flex-col flex-grow flex-shrink md:flex-row flex-wrap\" [formGroup]=\"formGroup\">\n <ng-container formArrayName=\"rules\">\n <div\n class=\"rule-container flex flex-col md:flex-row flex-full justify-start items-center gap-2.5\"\n [class.is-double-input]=\"!!isDoubleInput\"\n [class.is-single-input]=\"!isDoubleInput\"\n [formGroupName]=\"i\"\n *ngFor=\"let rule of rules.controls; let i = index\"\n >\n <ng-container *ngIf=\"isSingleInput\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-text-filter *ngSwitchCase=\"'text'\" class=\"flex flex-auto\" formControlName=\"value\" [filterConfig]=\"filterConfig\"></nice-text-filter>\n <nice-number-filter *ngSwitchCase=\"'number'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-number-filter>\n <nice-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-radio-filter>\n <nice-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-select-filter>\n <nice-date-filter *ngSwitchCase=\"'date'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-date-filter>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"isDoubleInput\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-text-filter>\n <nice-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-number-filter>\n <nice-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-radio-filter>\n <nice-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-select-filter>\n <nice-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-date-filter>\n </ng-container>\n <h3 class=\"aligned-text\">\n {{ \"components.query_builder.rule.conditions.and\" | translate }}\n </h3>\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-text-filter>\n <nice-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-number-filter>\n <nice-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-radio-filter>\n <nice-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-select-filter>\n <nice-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-date-filter>\n </ng-container>\n </ng-container>\n <div class=\"rule-buttons flex flex-row gap-2\">\n <button mat-mini-fab class=\"or-button aligned-button\" (click)=\"onClickOr()\">\n {{ \"components.query_builder.rule.conditions.or\" | translate }}\n </button>\n <button class=\"aligned-button\" mat-icon-button color=\"warn\" (click)=\"onClickDelete(i)\">\n <mat-icon [svgIcon]=\"icons.delete.svgIcon\">{{ icons.delete.matIcon }}</mat-icon>\n </button>\n </div>\n </div>\n </ng-container>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i8.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i6.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i15.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: QueryBuilderTriggerDirective, selector: "[niceQueryBuilderTrigger]", inputs: ["queryBuilderFilters", "queryBuilderFiltersLoading"], outputs: ["queryBuilderFilterSelected"] }, { kind: "component", type: SelectFilterComponent, selector: "nice-select-filter", inputs: ["filterConfig"] }, { kind: "component", type: TextFilterComponent, selector: "nice-text-filter", inputs: ["filterConfig"] }, { kind: "component", type: NumberFilterComponent, selector: "nice-number-filter" }, { kind: "component", type: RadioFilterComponent, selector: "nice-radio-filter", inputs: ["filterConfig"] }, { kind: "component", type: DateFilterComponent, selector: "nice-date-filter" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
|
|
1785
|
+
RuleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: RuleComponent, selector: "nice-rule", inputs: { filterConfigs: "filterConfigs" }, outputs: { remove: "remove" }, ngImport: i0, template: "<div class=\"flex flex-row justify-start items-center gap-2.5\">\n <button\n class=\"select-filter\"\n mat-raised-button\n color=\"accent\"\n niceQueryBuilderTrigger\n [queryBuilderFilters]=\"filterConfigs\"\n (queryBuilderFilterSelected)=\"onUpdateFilterConfig($event)\"\n >\n <div class=\"flex flex-row justify-between items-center\">\n <div class=\"config-name\">{{ filterConfig?.name }}</div>\n <mat-icon [svgIcon]=\"icons.arrowDown.svgIcon\">{{ icons.arrowDown.matIcon }}</mat-icon>\n </div>\n </button>\n <div class=\"flex flex-col md:flex-row flex-auto justify-start items-center gap-2.5\">\n <mat-form-field class=\"rule-form-field\">\n <mat-select\n class=\"rule-operator\"\n [ngModel]=\"filterOperator\"\n (ngModelChange)=\"onUpdateFilterOperator($event)\"\n >\n <mat-option *ngFor=\"let operator of filterConfig?.operators\" [value]=\"operator.id\">\n {{ operator?.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <div class=\"flex flex-col flex-grow flex-shrink md:flex-row flex-wrap\" [formGroup]=\"formGroup\">\n <ng-container formArrayName=\"rules\">\n <div\n class=\"rule-container flex flex-col md:flex-row flex-full justify-start items-center gap-2.5\"\n [class.is-double-input]=\"!!isDoubleInput\"\n [class.is-single-input]=\"!isDoubleInput\"\n [formGroupName]=\"i\"\n *ngFor=\"let rule of rules.controls; let i = index\"\n >\n <ng-container *ngIf=\"isSingleInput\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-text-filter *ngSwitchCase=\"'text'\" class=\"flex flex-auto\" formControlName=\"value\" [filterConfig]=\"filterConfig\"></nice-text-filter>\n <nice-number-filter *ngSwitchCase=\"'number'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-number-filter>\n <nice-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-radio-filter>\n <nice-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-select-filter>\n <nice-date-filter *ngSwitchCase=\"'date'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-date-filter>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"isDoubleInput\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-text-filter>\n <nice-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-number-filter>\n <nice-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-radio-filter>\n <nice-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-select-filter>\n <nice-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-date-filter>\n </ng-container>\n <h3 class=\"aligned-text\">\n {{ \"components.query_builder.rule.conditions.and\" | translate }}\n </h3>\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-text-filter>\n <nice-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-number-filter>\n <nice-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-radio-filter>\n <nice-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-select-filter>\n <nice-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-date-filter>\n </ng-container>\n </ng-container>\n <div class=\"rule-buttons flex flex-row gap-2\">\n <button mat-mini-fab class=\"or-button aligned-button\" (click)=\"onClickOr()\">\n {{ \"components.query_builder.rule.conditions.or\" | translate }}\n </button>\n <button class=\"aligned-button\" mat-icon-button color=\"warn\" (click)=\"onClickDelete(i)\">\n <mat-icon [svgIcon]=\"icons.delete.svgIcon\">{{ icons.delete.matIcon }}</mat-icon>\n </button>\n </div>\n </div>\n </ng-container>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i8.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i6.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i15.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: QueryBuilderTriggerDirective, selector: "[niceQueryBuilderTrigger]", inputs: ["queryBuilderFilters", "queryBuilderFiltersLoading"], outputs: ["queryBuilderFilterSelected"] }, { kind: "component", type: SelectFilterComponent, selector: "nice-select-filter", inputs: ["filterConfig"] }, { kind: "component", type: TextFilterComponent, selector: "nice-text-filter", inputs: ["filterConfig"] }, { kind: "component", type: NumberFilterComponent, selector: "nice-number-filter" }, { kind: "component", type: RadioFilterComponent, selector: "nice-radio-filter", inputs: ["filterConfig"] }, { kind: "component", type: DateFilterComponent, selector: "nice-date-filter" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
|
|
1785
1786
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RuleComponent, decorators: [{
|
|
1786
1787
|
type: Component,
|
|
1787
1788
|
args: [{ selector: "nice-rule", encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-row justify-start items-center gap-2.5\">\n <button\n class=\"select-filter\"\n mat-raised-button\n color=\"accent\"\n niceQueryBuilderTrigger\n [queryBuilderFilters]=\"filterConfigs\"\n (queryBuilderFilterSelected)=\"onUpdateFilterConfig($event)\"\n >\n <div class=\"flex flex-row justify-between items-center\">\n <div class=\"config-name\">{{ filterConfig?.name }}</div>\n <mat-icon [svgIcon]=\"icons.arrowDown.svgIcon\">{{ icons.arrowDown.matIcon }}</mat-icon>\n </div>\n </button>\n <div class=\"flex flex-col md:flex-row flex-auto justify-start items-center gap-2.5\">\n <mat-form-field class=\"rule-form-field\">\n <mat-select\n class=\"rule-operator\"\n [ngModel]=\"filterOperator\"\n (ngModelChange)=\"onUpdateFilterOperator($event)\"\n >\n <mat-option *ngFor=\"let operator of filterConfig?.operators\" [value]=\"operator.id\">\n {{ operator?.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <div class=\"flex flex-col flex-grow flex-shrink md:flex-row flex-wrap\" [formGroup]=\"formGroup\">\n <ng-container formArrayName=\"rules\">\n <div\n class=\"rule-container flex flex-col md:flex-row flex-full justify-start items-center gap-2.5\"\n [class.is-double-input]=\"!!isDoubleInput\"\n [class.is-single-input]=\"!isDoubleInput\"\n [formGroupName]=\"i\"\n *ngFor=\"let rule of rules.controls; let i = index\"\n >\n <ng-container *ngIf=\"isSingleInput\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-text-filter *ngSwitchCase=\"'text'\" class=\"flex flex-auto\" formControlName=\"value\" [filterConfig]=\"filterConfig\"></nice-text-filter>\n <nice-number-filter *ngSwitchCase=\"'number'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-number-filter>\n <nice-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-radio-filter>\n <nice-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-select-filter>\n <nice-date-filter *ngSwitchCase=\"'date'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-date-filter>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"isDoubleInput\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-text-filter>\n <nice-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-number-filter>\n <nice-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-radio-filter>\n <nice-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-select-filter>\n <nice-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-date-filter>\n </ng-container>\n <h3 class=\"aligned-text\">\n {{ \"components.query_builder.rule.conditions.and\" | translate }}\n </h3>\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-text-filter>\n <nice-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-number-filter>\n <nice-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-radio-filter>\n <nice-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-select-filter>\n <nice-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-date-filter>\n </ng-container>\n </ng-container>\n <div class=\"rule-buttons flex flex-row gap-2\">\n <button mat-mini-fab class=\"or-button aligned-button\" (click)=\"onClickOr()\">\n {{ \"components.query_builder.rule.conditions.or\" | translate }}\n </button>\n <button class=\"aligned-button\" mat-icon-button color=\"warn\" (click)=\"onClickDelete(i)\">\n <mat-icon [svgIcon]=\"icons.delete.svgIcon\">{{ icons.delete.matIcon }}</mat-icon>\n </button>\n </div>\n </div>\n </ng-container>\n </div>\n </div>\n</div>\n" }]
|
|
@@ -1848,7 +1849,7 @@ NiceQueryBuilderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.
|
|
|
1848
1849
|
provide: GeneratedFormGroup,
|
|
1849
1850
|
useFactory: ngxFormGeneratorFactory(QueryBuilderForm)
|
|
1850
1851
|
}
|
|
1851
|
-
], ngImport: i0, template: "<div class=\"rules-container flex flex-col\" *ngIf=\"!loading\" [formGroup]=\"formGroup\">\n <ng-container formArrayName=\"rules\">\n <nice-rule\n *ngFor=\"let rule of rules.controls; let i = index\"\n (remove)=\"onClickDeleteRule(i)\"\n [filterConfigs]=\"filterConfigs\"\n [formGroupName]=\"i\"\n ></nice-rule>\n </ng-container>\n <div class=\"flex justify-between\">\n <button\n class=\"add-button add-rule-button\"\n mat-mini-fab\n niceQueryBuilderTrigger\n [queryBuilderFilters]=\"filterConfigs\"\n (queryBuilderFilterSelected)=\"onClickAddRule($event)\"\n >\n <mat-icon [svgIcon]=\"icons.add.svgIcon\">{{ icons.add.matIcon }}</mat-icon>\n </button>\n <div class=\"flex flex-col md:flex-row gap-4\">\n <!-- TODO: Support saved reports -->\n <!--<button mat-button color=\"primary\" (click)=\"onClickSaveReport()\" *ngIf=\"canSave\">\n <mat-icon class=\"mr-8\" fxHide.lt-md>save</mat-icon>\n {{ \"components.query_builder.save_report\" | translate }}\n </button>\n <button mat-button color=\"primary\" (click)=\"onClickUpdateReport()\" *ngIf=\"!canSave\">\n <mat-icon class=\"mr-8\" fxHide.lt-md>save</mat-icon>\n {{ \"components.query_builder.update_report\" | translate }}\n </button>-->\n <button mat-stroked-button color=\"accent\" (click)=\"onClickApply()\">\n {{ \"components.query_builder.update\" | translate }}\n <mat-icon [svgIcon]=\"icons.refresh.svgIcon\">{{ icons.refresh.matIcon }}</mat-icon>\n </button>\n </div>\n </div>\n</div>\n", styles: ["nice-query-builder .rules-container{position:relative}nice-query-builder .rules-container:before{content:\"\";position:absolute;top:32px;bottom:32px;left:46px;width:4px;background:rgba(0,0,0,.12)}nice-query-builder .save-report-button{height:36px}nice-query-builder .add-rule-button{margin-left:28px;margin-right:28px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i8.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type:
|
|
1852
|
+
], ngImport: i0, template: "<div class=\"rules-container flex flex-col\" *ngIf=\"!loading\" [formGroup]=\"formGroup\">\n <ng-container formArrayName=\"rules\">\n <nice-rule\n *ngFor=\"let rule of rules.controls; let i = index\"\n (remove)=\"onClickDeleteRule(i)\"\n [filterConfigs]=\"filterConfigs\"\n [formGroupName]=\"i\"\n ></nice-rule>\n </ng-container>\n <div class=\"flex justify-between\">\n <button\n class=\"add-button add-rule-button\"\n mat-mini-fab\n niceQueryBuilderTrigger\n [queryBuilderFilters]=\"filterConfigs\"\n (queryBuilderFilterSelected)=\"onClickAddRule($event)\"\n >\n <mat-icon [svgIcon]=\"icons.add.svgIcon\">{{ icons.add.matIcon }}</mat-icon>\n </button>\n <div class=\"flex flex-col md:flex-row gap-4\">\n <!-- TODO: Support saved reports -->\n <!--<button mat-button color=\"primary\" (click)=\"onClickSaveReport()\" *ngIf=\"canSave\">\n <mat-icon class=\"mr-8\" fxHide.lt-md>save</mat-icon>\n {{ \"components.query_builder.save_report\" | translate }}\n </button>\n <button mat-button color=\"primary\" (click)=\"onClickUpdateReport()\" *ngIf=\"!canSave\">\n <mat-icon class=\"mr-8\" fxHide.lt-md>save</mat-icon>\n {{ \"components.query_builder.update_report\" | translate }}\n </button>-->\n <button mat-stroked-button color=\"accent\" (click)=\"onClickApply()\">\n {{ \"components.query_builder.update\" | translate }}\n <mat-icon [svgIcon]=\"icons.refresh.svgIcon\">{{ icons.refresh.matIcon }}</mat-icon>\n </button>\n </div>\n </div>\n</div>\n", styles: ["nice-query-builder .rules-container{position:relative}nice-query-builder .rules-container:before{content:\"\";position:absolute;top:32px;bottom:32px;left:46px;width:4px;background:rgba(0,0,0,.12)}nice-query-builder .save-report-button{height:36px}nice-query-builder .add-rule-button{margin-left:28px;margin-right:28px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i8.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: QueryBuilderTriggerDirective, selector: "[niceQueryBuilderTrigger]", inputs: ["queryBuilderFilters", "queryBuilderFiltersLoading"], outputs: ["queryBuilderFilterSelected"] }, { kind: "component", type: RuleComponent, selector: "nice-rule", inputs: ["filterConfigs"], outputs: ["remove"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
|
|
1852
1853
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceQueryBuilderComponent, decorators: [{
|
|
1853
1854
|
type: Component,
|
|
1854
1855
|
args: [{ selector: "nice-query-builder", encapsulation: ViewEncapsulation.None, providers: [
|
|
@@ -2094,12 +2095,12 @@ class NiceBaseListComponent {
|
|
|
2094
2095
|
}
|
|
2095
2096
|
}
|
|
2096
2097
|
}
|
|
2097
|
-
NiceBaseListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceBaseListComponent, deps: [{ token: ENABLE_QUERY_BUILDER, optional: true }, { token: BASE_LIST_ICONS }, { token: BASE_LIST_LAYOUT }, { token: TABLE_COLUMNS }, { token: EXPORTS_SETTINGS$1 }, { token: NiceBaseListQuery }, { token: NiceBaseListService }, { token: i2.ActivatedRoute }, { token:
|
|
2098
|
+
NiceBaseListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceBaseListComponent, deps: [{ token: ENABLE_QUERY_BUILDER, optional: true }, { token: BASE_LIST_ICONS }, { token: BASE_LIST_LAYOUT }, { token: TABLE_COLUMNS }, { token: EXPORTS_SETTINGS$1 }, { token: NiceBaseListQuery }, { token: NiceBaseListService }, { token: i2.ActivatedRoute }, { token: i4$1.MatBottomSheet }, { token: i2.Router }, { token: i5$1.NiceMediaWatcherService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2098
2099
|
NiceBaseListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceBaseListComponent, selector: "nice-base-list", inputs: { mode: "mode", layout: "layout", layoutContent: "layoutContent", autoChangeLayout: "autoChangeLayout", baseRoute: "baseRoute", routeFn: "routeFn", navigateFn: "navigateFn", autoLoad: "autoLoad", pageTitle: "pageTitle", canExport: "canExport", disableRouting: "disableRouting", customExport: "customExport", queryParams: "queryParams", configQueryParams: "configQueryParams" }, outputs: { newPage: "newPage" }, providers: [
|
|
2099
2100
|
NiceBaseListQuery,
|
|
2100
2101
|
NiceBaseListService,
|
|
2101
2102
|
NiceBaseListStore
|
|
2102
|
-
], queries: [{ propertyName: "title", first: true, predicate: NiceBaseListTitleDirective, descendants: true, read: TemplateRef }, { propertyName: "table", first: true, predicate: NiceBaseListTableDirective, descendants: true }, { propertyName: "cards", first: true, predicate: NiceBaseListCardsDirective, descendants: true, read: TemplateRef }, { propertyName: "customContent", first: true, predicate: NiceBaseListCustomContentDirective, descendants: true, read: TemplateRef }, { propertyName: "filters", first: true, predicate: NiceBaseListFiltersDirective, descendants: true, read: TemplateRef }, { propertyName: "emptyState", first: true, predicate: NiceBaseListEmptyStateDirective, descendants: true, read: TemplateRef }, { propertyName: "emptySearchResultState", first: true, predicate: NiceBaseListEmptySearchResultStateDirective, descendants: true, read: TemplateRef }, { propertyName: "buttons", predicate: NiceBaseListButtonsDirective }], usesOnChanges: true, ngImport: i0, template: "<div class=\"list page-layout carded fullwidth inner-scroll\" *ngIf=\"layout === 'page'; else content\">\n <div class=\"center\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n</div>\n\n<ng-template #content>\n <ng-container *ngIf=\"listLayout.xl\">\n <div class=\"hidden xl:block\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.xl, active: xlActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.lg\">\n <div class=\"hidden lg:block xl:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.lg, active: lgActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.md\">\n <div class=\"hidden md:block lg:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.md, active: mdActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.sm\">\n <div class=\"hidden sm:block md:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.sm, active: smActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.xs\">\n <div class=\"block sm:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.xs, active: xsActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <div\n [class.hidden]=\"!!listLayout.xs\"\n [class.block]=\"!listLayout.xs\"\n [class.sm:hidden]=\"!!listLayout.sm\"\n [class.sm:block]=\"!listLayout.sm\"\n [class.md:hidden]=\"!!listLayout.md\"\n [class.md:block]=\"!listLayout.md\"\n [class.lg:hidden]=\"!!listLayout.lg\"\n [class.lg:block]=\"!listLayout.lg\"\n [class.xl:hidden]=\"!!listLayout.xl\"\n [class.xl:block]=\"!listLayout.xl\"\n >\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.default, active: defaultActive$ | async }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #pageLayout let-layout=\"layout\" let-active=\"active\">\n <ng-container *ngIf=\"layout?.length; else isObject\">\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: { classes: ['flex flex-col'], items: layout }, active }\"></ng-container>\n </ng-container>\n\n <ng-template #isObject>\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: layout, active }\"></ng-container>\n </ng-template>\n</ng-template>\n\n<ng-template #contentLayout let-layout=\"layout\" let-active=\"active\">\n <div [ngClass]=\"layout.classes\">\n <ng-container *ngFor=\"let item of layout.items\">\n <ng-container *ngIf=\"item.name; else childIsLayout\">\n <ng-container *ngTemplateOutlet=\"layoutItem; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-template #childIsLayout>\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: item, active }\"></ng-container>\n </ng-template>\n </ng-container>\n </div>\n</ng-template>\n\n<ng-template #layoutItem let-item=\"item\" let-active=\"active\">\n <ng-container *ngIf=\"item.name === 'title' && title\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"title\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'search'\">\n <div [ngClass]=\"item.classes\">\n <div class=\"search-wrapper mx-md-0\">\n <div class=\"search flex flex-auto justify-start items-center\">\n <mat-icon [svgIcon]=\"icons.search.svgIcon\">{{ icons.search.matIcon }}</mat-icon>\n <input [ngModel]=\"searchQuery$ | async\" (ngModelChange)=\"onUpdateSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n\n <ng-container *ngIf=\"searchButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"searchButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"enableQueryBuilder\">\n <button\n *ngIf=\"!(showQueryBuilder$ | async) && !(rulesCount$ | async) && (filterConfig$ | async).length > 0\"\n mat-icon-button\n niceQueryBuilderTrigger\n [queryBuilderFilters]=\"filterConfig$ | async\"\n [queryBuilderFiltersLoading]=\"(filterConfigLoading$ | async) || false\"\n (queryBuilderFilterSelected)=\"onQueryBuilderFilterSelected($event)\"\n [matTooltip]=\"'general.query_builder.show_advanced_search' | translate\"\n >\n <mat-icon\n [svgIcon]=\"icons.queryBuilder.svgIcon\"\n [matBadge]=\"rulesCount$ | async\"\n [matBadgeHidden]=\"!(rulesCount$ | async)\"\n matBadgeColor=\"accent\"\n >\n {{ icons.queryBuilder.matIcon }}\n </mat-icon>\n </button>\n <button\n mat-icon-button\n *ngIf=\"!(showQueryBuilder$ | async) && (rulesCount$ | async)\"\n [disabled]=\"filterConfigLoading$ | async\"\n (click)=\"clickToggleShowQueryBuilder()\"\n [matTooltip]=\"'general.query_builder.show_advanced_search' | translate\"\n >\n <mat-icon\n [svgIcon]=\"icons.queryBuilder.svgIcon\"\n [matBadge]=\"rulesCount$ | async\"\n [matBadgeHidden]=\"!(rulesCount$ | async)\"\n matBadgeColor=\"accent\"\n >\n {{ icons.queryBuilder.matIcon }}\n </mat-icon>\n </button>\n <button\n mat-icon-button\n *ngIf=\"showQueryBuilder$ | async\"\n (click)=\"clickToggleShowQueryBuilder()\"\n [matTooltip]=\"'general.query_builder.close_advanced_search' | translate\"\n >\n <mat-icon [svgIcon]=\"icons.close.svgIcon\">{{ icons.close.matIcon }}</mat-icon>\n </button>\n </ng-container>\n </div>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'prefixButtons' && prefixButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"prefixButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'suffixButtons' && suffixButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"suffixButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'exportButtons' && canExport\">\n <div [ngClass]=\"item.classes\" [class.mr-2]=\"!!suffixButtons\" [class.ml-2]=\"!!prefixButtons\">\n <button\n (click)=\"clickPrint()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.print' | translate\"\n class=\"list-button mr-2\"\n mat-mini-fab\n >\n <mat-icon [svgIcon]=\"icons.print.svgIcon\">{{ icons.print.matIcon }}</mat-icon>\n </button>\n\n <button\n (click)=\"clickExport()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.export' | translate\"\n class=\"list-button mr-2\"\n mat-mini-fab\n >\n <mat-icon [svgIcon]=\"icons.download.svgIcon\">{{ icons.download.matIcon }}</mat-icon>\n </button>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'content'\">\n <ng-container *ngIf=\"((isEmpty$ | async) && emptyState) || ((isSearchResultEmpty$ | async) && emptySearchResultState); else showData\">\n\n <ng-container *ngIf=\"(isSearchResultEmpty$ | async)\">\n <ng-container *ngTemplateOutlet=\"emptySearchResultState\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"isEmpty$ | async\">\n <ng-container *ngTemplateOutlet=\"emptyState\"></ng-container>\n </ng-container>\n\n </ng-container>\n <ng-template #showData>\n <ng-container *ngIf=\"layoutContent === 'table' && table\">\n <ng-container *ngTemplateOutlet=\"tableLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"layoutContent === 'cards' && cards\">\n <ng-container *ngTemplateOutlet=\"cardsLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"layoutContent === 'custom' && customContent\">\n <ng-container *ngTemplateOutlet=\"customLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'pagination' && layoutContent !== 'custom'\">\n <div [ngClass]=\"item.classes\">\n <mat-paginator\n (page)=\"onUpdatePage($event)\"\n [length]=\"recordsFiltered$ | async\"\n [pageIndex]=\"index$ | async\"\n [pageSizeOptions]=\"defaultPageSizeOptions\"\n [pageSize]=\"length$ | async\"\n [showFirstLastButtons]=\"true\"\n >\n </mat-paginator>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'queryBuilder' && enableQueryBuilder\">\n <div class=\"flex flex-col\" *ngIf=\"showQueryBuilder$ | async\">\n <mat-card class=\"my-4\" [niceLoadingOverlay]=\"filterConfigLoading$ | async\">\n <mat-card-content class=\"flex flex-col\">\n <div class=\"flex-auto\">\n <nice-query-builder\n [filterConfigs]=\"filterConfig$ | async\"\n [ngModel]=\"rules$ | async\"\n (ngModelChange)=\"onUpdateRules($event)\"\n (close)=\"clickToggleShowQueryBuilder()\"\n ></nice-query-builder>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'filters' && filters\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"filters\"></ng-container>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #tableLayout let-item=\"item\">\n <div [ngClass]=\"item.classes\">\n <div\n [niceLoadingOverlay]=\"loading$ | async\"\n class=\"content-card base-list flex flex-col justify-between\"\n >\n <mat-table\n (matSortChange)=\"onUpdateSort($event)\"\n [dataSource]=\"data$\"\n [matSortActive]=\"(sortColumn$ | async) || ''\"\n [matSortDirection]=\"(sortDirection$ | async) || ''\"\n class=\"flex flex-col flex-auto\"\n matSort\n >\n <mat-header-row *matHeaderRowDef=\"columnNames; sticky: table.stickyHeader\"></mat-header-row>\n\n <ng-container *ngFor=\"let column of columns\" [matColumnDef]=\"column.id\">\n <ng-container *ngIf=\"column.sortable\">\n <mat-header-cell *matHeaderCellDef mat-sort-header>\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, header: true }\"\n ></ng-container>\n </mat-header-cell>\n </ng-container>\n <ng-container *ngIf=\"!column.sortable\">\n <mat-header-cell *matHeaderCellDef>\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, header: true }\"\n ></ng-container>\n </mat-header-cell>\n </ng-container>\n\n <mat-cell *matCellDef=\"let item\">\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, data: true, item: item }\"\n ></ng-container>\n </mat-cell>\n </ng-container>\n\n <ng-container *ngIf=\"disableRouting; else withRouting\">\n <mat-row *matRowDef=\"let item; columns: columnNames;\" class=\"item\"></mat-row>\n </ng-container>\n\n <ng-template #withRouting>\n <mat-row\n *matRowDef=\"let item; columns: columnNames;\"\n (click)=\"navigate(item)\"\n class=\"item clickable\"\n matRipple\n >\n </mat-row>\n </ng-template>\n </mat-table>\n </div>\n </div>\n</ng-template>\n\n<ng-template #cardsLayout let-item=\"item\" let-active=\"active\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngFor=\"let data of data$ | async\">\n <ng-container *ngTemplateOutlet=\"cards; context: { item: data, active }\"></ng-container>\n </ng-container>\n </div>\n</ng-template>\n\n<ng-template #customLayout let-item=\"item\" let-active=\"active\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"customContent; context: { $implicit: data$ | async, data: data$ | async, total: recordsFiltered$ | async, active }\"></ng-container>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i11.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i11.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i12.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i5.NiceLoadingDirective, selector: "[niceLoadingOverlay]", inputs: ["niceLoadingOverlay"] }, { kind: "component", type: i13.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i13.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i13.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i13.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i13.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i13.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i13.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i13.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i13.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i13.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i14.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i14.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: i15.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: NiceQueryBuilderComponent, selector: "nice-query-builder", inputs: ["filterConfigs", "currentSavedReport", "loading"], outputs: ["close", "createReport", "updateReport"] }, { kind: "directive", type: QueryBuilderTriggerDirective, selector: "[niceQueryBuilderTrigger]", inputs: ["queryBuilderFilters", "queryBuilderFiltersLoading"], outputs: ["queryBuilderFilterSelected"] }, { kind: "directive", type: i18.MatBadge, selector: "[matBadge]", inputs: ["matBadgeDisabled", "matBadgeColor", "matBadgeOverlap", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
|
|
2103
|
+
], queries: [{ propertyName: "title", first: true, predicate: NiceBaseListTitleDirective, descendants: true, read: TemplateRef }, { propertyName: "table", first: true, predicate: NiceBaseListTableDirective, descendants: true }, { propertyName: "cards", first: true, predicate: NiceBaseListCardsDirective, descendants: true, read: TemplateRef }, { propertyName: "customContent", first: true, predicate: NiceBaseListCustomContentDirective, descendants: true, read: TemplateRef }, { propertyName: "filters", first: true, predicate: NiceBaseListFiltersDirective, descendants: true, read: TemplateRef }, { propertyName: "emptyState", first: true, predicate: NiceBaseListEmptyStateDirective, descendants: true, read: TemplateRef }, { propertyName: "emptySearchResultState", first: true, predicate: NiceBaseListEmptySearchResultStateDirective, descendants: true, read: TemplateRef }, { propertyName: "buttons", predicate: NiceBaseListButtonsDirective }], usesOnChanges: true, ngImport: i0, template: "<div class=\"list page-layout carded fullwidth inner-scroll\" *ngIf=\"layout === 'page'; else content\">\n <div class=\"center\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n</div>\n\n<ng-template #content>\n <ng-container *ngIf=\"listLayout.xl\">\n <div class=\"hidden xl:block\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.xl, active: xlActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.lg\">\n <div class=\"hidden lg:block xl:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.lg, active: lgActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.md\">\n <div class=\"hidden md:block lg:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.md, active: mdActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.sm\">\n <div class=\"hidden sm:block md:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.sm, active: smActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.xs\">\n <div class=\"block sm:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.xs, active: xsActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <div\n [class.hidden]=\"!!listLayout.xs\"\n [class.block]=\"!listLayout.xs\"\n [class.sm:hidden]=\"!!listLayout.sm\"\n [class.sm:block]=\"!listLayout.sm\"\n [class.md:hidden]=\"!!listLayout.md\"\n [class.md:block]=\"!listLayout.md\"\n [class.lg:hidden]=\"!!listLayout.lg\"\n [class.lg:block]=\"!listLayout.lg\"\n [class.xl:hidden]=\"!!listLayout.xl\"\n [class.xl:block]=\"!listLayout.xl\"\n >\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.default, active: defaultActive$ | async }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #pageLayout let-layout=\"layout\" let-active=\"active\">\n <ng-container *ngIf=\"layout?.length; else isObject\">\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: { classes: ['flex flex-col'], items: layout }, active }\"></ng-container>\n </ng-container>\n\n <ng-template #isObject>\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: layout, active }\"></ng-container>\n </ng-template>\n</ng-template>\n\n<ng-template #contentLayout let-layout=\"layout\" let-active=\"active\">\n <div [ngClass]=\"layout.classes\">\n <ng-container *ngFor=\"let item of layout.items\">\n <ng-container *ngIf=\"item.name; else childIsLayout\">\n <ng-container *ngTemplateOutlet=\"layoutItem; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-template #childIsLayout>\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: item, active }\"></ng-container>\n </ng-template>\n </ng-container>\n </div>\n</ng-template>\n\n<ng-template #layoutItem let-item=\"item\" let-active=\"active\">\n <ng-container *ngIf=\"item.name === 'title' && title\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"title\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'search'\">\n <div [ngClass]=\"item.classes\">\n <div class=\"search-wrapper mx-md-0\">\n <div class=\"search flex flex-auto justify-start items-center\">\n <mat-icon [svgIcon]=\"icons.search.svgIcon\">{{ icons.search.matIcon }}</mat-icon>\n <input [ngModel]=\"searchQuery$ | async\" (ngModelChange)=\"onUpdateSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n\n <ng-container *ngIf=\"searchButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"searchButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"enableQueryBuilder\">\n <button\n *ngIf=\"!(showQueryBuilder$ | async) && !(rulesCount$ | async) && (filterConfig$ | async).length > 0\"\n mat-icon-button\n niceQueryBuilderTrigger\n [queryBuilderFilters]=\"filterConfig$ | async\"\n [queryBuilderFiltersLoading]=\"(filterConfigLoading$ | async) || false\"\n (queryBuilderFilterSelected)=\"onQueryBuilderFilterSelected($event)\"\n [matTooltip]=\"'general.query_builder.show_advanced_search' | translate\"\n >\n <mat-icon\n [svgIcon]=\"icons.queryBuilder.svgIcon\"\n [matBadge]=\"rulesCount$ | async\"\n [matBadgeHidden]=\"!(rulesCount$ | async)\"\n matBadgeColor=\"accent\"\n >\n {{ icons.queryBuilder.matIcon }}\n </mat-icon>\n </button>\n <button\n mat-icon-button\n *ngIf=\"!(showQueryBuilder$ | async) && (rulesCount$ | async)\"\n [disabled]=\"filterConfigLoading$ | async\"\n (click)=\"clickToggleShowQueryBuilder()\"\n [matTooltip]=\"'general.query_builder.show_advanced_search' | translate\"\n >\n <mat-icon\n [svgIcon]=\"icons.queryBuilder.svgIcon\"\n [matBadge]=\"rulesCount$ | async\"\n [matBadgeHidden]=\"!(rulesCount$ | async)\"\n matBadgeColor=\"accent\"\n >\n {{ icons.queryBuilder.matIcon }}\n </mat-icon>\n </button>\n <button\n mat-icon-button\n *ngIf=\"showQueryBuilder$ | async\"\n (click)=\"clickToggleShowQueryBuilder()\"\n [matTooltip]=\"'general.query_builder.close_advanced_search' | translate\"\n >\n <mat-icon [svgIcon]=\"icons.close.svgIcon\">{{ icons.close.matIcon }}</mat-icon>\n </button>\n </ng-container>\n </div>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'prefixButtons' && prefixButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"prefixButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'suffixButtons' && suffixButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"suffixButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'exportButtons' && canExport\">\n <div [ngClass]=\"item.classes\" [class.mr-2]=\"!!suffixButtons\" [class.ml-2]=\"!!prefixButtons\">\n <button\n (click)=\"clickPrint()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.print' | translate\"\n class=\"list-button mr-2\"\n mat-mini-fab\n >\n <mat-icon [svgIcon]=\"icons.print.svgIcon\">{{ icons.print.matIcon }}</mat-icon>\n </button>\n\n <button\n (click)=\"clickExport()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.export' | translate\"\n class=\"list-button mr-2\"\n mat-mini-fab\n >\n <mat-icon [svgIcon]=\"icons.download.svgIcon\">{{ icons.download.matIcon }}</mat-icon>\n </button>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'content'\">\n <ng-container *ngIf=\"((isEmpty$ | async) && emptyState) || ((isSearchResultEmpty$ | async) && emptySearchResultState); else showData\">\n\n <ng-container *ngIf=\"(isSearchResultEmpty$ | async)\">\n <ng-container *ngTemplateOutlet=\"emptySearchResultState\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"isEmpty$ | async\">\n <ng-container *ngTemplateOutlet=\"emptyState\"></ng-container>\n </ng-container>\n\n </ng-container>\n <ng-template #showData>\n <ng-container *ngIf=\"layoutContent === 'table' && table\">\n <ng-container *ngTemplateOutlet=\"tableLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"layoutContent === 'cards' && cards\">\n <ng-container *ngTemplateOutlet=\"cardsLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"layoutContent === 'custom' && customContent\">\n <ng-container *ngTemplateOutlet=\"customLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'pagination' && layoutContent !== 'custom'\">\n <div [ngClass]=\"item.classes\">\n <mat-paginator\n (page)=\"onUpdatePage($event)\"\n [length]=\"recordsFiltered$ | async\"\n [pageIndex]=\"index$ | async\"\n [pageSizeOptions]=\"defaultPageSizeOptions\"\n [pageSize]=\"length$ | async\"\n [showFirstLastButtons]=\"true\"\n >\n </mat-paginator>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'queryBuilder' && enableQueryBuilder\">\n <div class=\"flex flex-col\" *ngIf=\"showQueryBuilder$ | async\">\n <mat-card class=\"my-4\" [niceLoadingOverlay]=\"filterConfigLoading$ | async\">\n <mat-card-content class=\"flex flex-col\">\n <div class=\"flex-auto\">\n <nice-query-builder\n [filterConfigs]=\"filterConfig$ | async\"\n [ngModel]=\"rules$ | async\"\n (ngModelChange)=\"onUpdateRules($event)\"\n (close)=\"clickToggleShowQueryBuilder()\"\n ></nice-query-builder>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'filters' && filters\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"filters\"></ng-container>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #tableLayout let-item=\"item\">\n <div [ngClass]=\"item.classes\">\n <div\n [niceLoadingOverlay]=\"loading$ | async\"\n class=\"content-card base-list flex flex-col justify-between\"\n >\n <mat-table\n (matSortChange)=\"onUpdateSort($event)\"\n [dataSource]=\"data$\"\n [matSortActive]=\"(sortColumn$ | async) || ''\"\n [matSortDirection]=\"(sortDirection$ | async) || ''\"\n class=\"flex flex-col flex-auto\"\n matSort\n >\n <mat-header-row *matHeaderRowDef=\"columnNames; sticky: table.stickyHeader\"></mat-header-row>\n\n <ng-container *ngFor=\"let column of columns\" [matColumnDef]=\"column.id\">\n <ng-container *ngIf=\"column.sortable\">\n <mat-header-cell *matHeaderCellDef mat-sort-header>\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, header: true }\"\n ></ng-container>\n </mat-header-cell>\n </ng-container>\n <ng-container *ngIf=\"!column.sortable\">\n <mat-header-cell *matHeaderCellDef>\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, header: true }\"\n ></ng-container>\n </mat-header-cell>\n </ng-container>\n\n <mat-cell *matCellDef=\"let item\">\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, data: true, item: item }\"\n ></ng-container>\n </mat-cell>\n </ng-container>\n\n <ng-container *ngIf=\"disableRouting; else withRouting\">\n <mat-row *matRowDef=\"let item; columns: columnNames;\" class=\"item\"></mat-row>\n </ng-container>\n\n <ng-template #withRouting>\n <mat-row\n *matRowDef=\"let item; columns: columnNames;\"\n (click)=\"navigate(item)\"\n class=\"item clickable\"\n matRipple\n >\n </mat-row>\n </ng-template>\n </mat-table>\n </div>\n </div>\n</ng-template>\n\n<ng-template #cardsLayout let-item=\"item\" let-active=\"active\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngFor=\"let data of data$ | async\">\n <ng-container *ngTemplateOutlet=\"cards; context: { item: data, active }\"></ng-container>\n </ng-container>\n </div>\n</ng-template>\n\n<ng-template #customLayout let-item=\"item\" let-active=\"active\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"customContent; context: { $implicit: data$ | async, data: data$ | async, total: recordsFiltered$ | async, active }\"></ng-container>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i11.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i11.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i12.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i5$1.NiceLoadingDirective, selector: "[niceLoadingOverlay]", inputs: ["niceLoadingOverlay"] }, { kind: "component", type: i13.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i13.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i13.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i13.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i13.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i13.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i13.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i13.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i13.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i13.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i14.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i14.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: i15.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: NiceQueryBuilderComponent, selector: "nice-query-builder", inputs: ["filterConfigs", "currentSavedReport", "loading"], outputs: ["close", "createReport", "updateReport"] }, { kind: "directive", type: QueryBuilderTriggerDirective, selector: "[niceQueryBuilderTrigger]", inputs: ["queryBuilderFilters", "queryBuilderFiltersLoading"], outputs: ["queryBuilderFilterSelected"] }, { kind: "directive", type: i18.MatBadge, selector: "[matBadge]", inputs: ["matBadgeDisabled", "matBadgeColor", "matBadgeOverlap", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
|
|
2103
2104
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceBaseListComponent, decorators: [{
|
|
2104
2105
|
type: Component,
|
|
2105
2106
|
args: [{ selector: "nice-base-list", providers: [
|
|
@@ -2124,7 +2125,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
2124
2125
|
}] }, { type: undefined, decorators: [{
|
|
2125
2126
|
type: Inject,
|
|
2126
2127
|
args: [EXPORTS_SETTINGS$1]
|
|
2127
|
-
}] }, { type: NiceBaseListQuery }, { type: NiceBaseListService }, { type: i2.ActivatedRoute }, { type:
|
|
2128
|
+
}] }, { type: NiceBaseListQuery }, { type: NiceBaseListService }, { type: i2.ActivatedRoute }, { type: i4$1.MatBottomSheet }, { type: i2.Router }, { type: i5$1.NiceMediaWatcherService }]; }, propDecorators: { title: [{
|
|
2128
2129
|
type: ContentChild,
|
|
2129
2130
|
args: [NiceBaseListTitleDirective, { read: TemplateRef }]
|
|
2130
2131
|
}], buttons: [{
|
|
@@ -2599,12 +2600,12 @@ class NiceMultiStateListComponent extends NiceBaseListComponent {
|
|
|
2599
2600
|
this.setColumns(columns);
|
|
2600
2601
|
}
|
|
2601
2602
|
}
|
|
2602
|
-
NiceMultiStateListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceMultiStateListComponent, deps: [{ token: ENABLE_QUERY_BUILDER, optional: true }, { token: BASE_LIST_ICONS }, { token: BASE_LIST_LAYOUT }, { token: EXPORTS_SETTINGS$1 }, { token: NiceMultiStateListQuery }, { token: i2.ActivatedRoute }, { token:
|
|
2603
|
+
NiceMultiStateListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceMultiStateListComponent, deps: [{ token: ENABLE_QUERY_BUILDER, optional: true }, { token: BASE_LIST_ICONS }, { token: BASE_LIST_LAYOUT }, { token: EXPORTS_SETTINGS$1 }, { token: NiceMultiStateListQuery }, { token: i2.ActivatedRoute }, { token: i4$1.MatBottomSheet }, { token: i2.Router }, { token: i5$1.NiceMediaWatcherService }, { token: NiceMultiStateListService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2603
2604
|
NiceMultiStateListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceMultiStateListComponent, selector: "nice-multi-state-list", inputs: { state: "state" }, providers: [
|
|
2604
2605
|
NiceMultiStateListQuery,
|
|
2605
2606
|
NiceMultiStateListService,
|
|
2606
2607
|
NiceMultiStateListStore
|
|
2607
|
-
], usesInheritance: true, ngImport: i0, template: "<div class=\"list page-layout carded fullwidth inner-scroll\" *ngIf=\"layout === 'page'; else content\">\n <div class=\"center\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n</div>\n\n<ng-template #content>\n <ng-container *ngIf=\"listLayout.xl\">\n <div class=\"hidden xl:block\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.xl, active: xlActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.lg\">\n <div class=\"hidden lg:block xl:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.lg, active: lgActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.md\">\n <div class=\"hidden md:block lg:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.md, active: mdActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.sm\">\n <div class=\"hidden sm:block md:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.sm, active: smActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.xs\">\n <div class=\"block sm:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.xs, active: xsActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <div\n [class.hidden]=\"!!listLayout.xs\"\n [class.block]=\"!listLayout.xs\"\n [class.sm:hidden]=\"!!listLayout.sm\"\n [class.sm:block]=\"!listLayout.sm\"\n [class.md:hidden]=\"!!listLayout.md\"\n [class.md:block]=\"!listLayout.md\"\n [class.lg:hidden]=\"!!listLayout.lg\"\n [class.lg:block]=\"!listLayout.lg\"\n [class.xl:hidden]=\"!!listLayout.xl\"\n [class.xl:block]=\"!listLayout.xl\"\n >\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.default, active: defaultActive$ | async }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #pageLayout let-layout=\"layout\" let-active=\"active\">\n <ng-container *ngIf=\"layout?.length; else isObject\">\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: { classes: ['flex flex-col'], items: layout }, active }\"></ng-container>\n </ng-container>\n\n <ng-template #isObject>\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: layout, active }\"></ng-container>\n </ng-template>\n</ng-template>\n\n<ng-template #contentLayout let-layout=\"layout\" let-active=\"active\">\n <div [ngClass]=\"layout.classes\">\n <ng-container *ngFor=\"let item of layout.items\">\n <ng-container *ngIf=\"item.name; else childIsLayout\">\n <ng-container *ngTemplateOutlet=\"layoutItem; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-template #childIsLayout>\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: item, active }\"></ng-container>\n </ng-template>\n </ng-container>\n </div>\n</ng-template>\n\n<ng-template #layoutItem let-item=\"item\" let-active=\"active\">\n <ng-container *ngIf=\"item.name === 'title' && title\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"title\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'search'\">\n <div [ngClass]=\"item.classes\">\n <div class=\"search-wrapper mx-md-0\">\n <div class=\"search flex flex-auto justify-start items-center\">\n <mat-icon [svgIcon]=\"icons.search.svgIcon\">{{ icons.search.matIcon }}</mat-icon>\n <input [ngModel]=\"searchQuery$ | async\" (ngModelChange)=\"onUpdateSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n\n <ng-container *ngIf=\"searchButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"searchButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"enableQueryBuilder\">\n <button\n *ngIf=\"!(showQueryBuilder$ | async) && !(rulesCount$ | async) && (filterConfig$ | async).length > 0\"\n mat-icon-button\n niceQueryBuilderTrigger\n [queryBuilderFilters]=\"filterConfig$ | async\"\n [queryBuilderFiltersLoading]=\"(filterConfigLoading$ | async) || false\"\n (queryBuilderFilterSelected)=\"onQueryBuilderFilterSelected($event)\"\n [matTooltip]=\"'general.query_builder.show_advanced_search' | translate\"\n >\n <mat-icon\n [svgIcon]=\"icons.queryBuilder.svgIcon\"\n [matBadge]=\"rulesCount$ | async\"\n [matBadgeHidden]=\"!(rulesCount$ | async)\"\n matBadgeColor=\"accent\"\n >\n {{ icons.queryBuilder.matIcon }}\n </mat-icon>\n </button>\n <button\n mat-icon-button\n *ngIf=\"!(showQueryBuilder$ | async) && (rulesCount$ | async)\"\n [disabled]=\"filterConfigLoading$ | async\"\n (click)=\"clickToggleShowQueryBuilder()\"\n [matTooltip]=\"'general.query_builder.show_advanced_search' | translate\"\n >\n <mat-icon\n [svgIcon]=\"icons.queryBuilder.svgIcon\"\n [matBadge]=\"rulesCount$ | async\"\n [matBadgeHidden]=\"!(rulesCount$ | async)\"\n matBadgeColor=\"accent\"\n >\n {{ icons.queryBuilder.matIcon }}\n </mat-icon>\n </button>\n <button\n mat-icon-button\n *ngIf=\"showQueryBuilder$ | async\"\n (click)=\"clickToggleShowQueryBuilder()\"\n [matTooltip]=\"'general.query_builder.close_advanced_search' | translate\"\n >\n <mat-icon [svgIcon]=\"icons.close.svgIcon\">{{ icons.close.matIcon }}</mat-icon>\n </button>\n </ng-container>\n </div>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'prefixButtons' && prefixButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"prefixButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'suffixButtons' && suffixButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"suffixButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'exportButtons' && canExport\">\n <div [ngClass]=\"item.classes\" [class.mr-2]=\"!!suffixButtons\" [class.ml-2]=\"!!prefixButtons\">\n <button\n (click)=\"clickPrint()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.print' | translate\"\n class=\"list-button mr-2\"\n mat-mini-fab\n >\n <mat-icon [svgIcon]=\"icons.print.svgIcon\">{{ icons.print.matIcon }}</mat-icon>\n </button>\n\n <button\n (click)=\"clickExport()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.export' | translate\"\n class=\"list-button mr-2\"\n mat-mini-fab\n >\n <mat-icon [svgIcon]=\"icons.download.svgIcon\">{{ icons.download.matIcon }}</mat-icon>\n </button>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'content'\">\n <ng-container *ngIf=\"((isEmpty$ | async) && emptyState) || ((isSearchResultEmpty$ | async) && emptySearchResultState); else showData\">\n\n <ng-container *ngIf=\"(isSearchResultEmpty$ | async)\">\n <ng-container *ngTemplateOutlet=\"emptySearchResultState\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"isEmpty$ | async\">\n <ng-container *ngTemplateOutlet=\"emptyState\"></ng-container>\n </ng-container>\n\n </ng-container>\n <ng-template #showData>\n <ng-container *ngIf=\"layoutContent === 'table' && table\">\n <ng-container *ngTemplateOutlet=\"tableLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"layoutContent === 'cards' && cards\">\n <ng-container *ngTemplateOutlet=\"cardsLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"layoutContent === 'custom' && customContent\">\n <ng-container *ngTemplateOutlet=\"customLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'pagination' && layoutContent !== 'custom'\">\n <div [ngClass]=\"item.classes\">\n <mat-paginator\n (page)=\"onUpdatePage($event)\"\n [length]=\"recordsFiltered$ | async\"\n [pageIndex]=\"index$ | async\"\n [pageSizeOptions]=\"defaultPageSizeOptions\"\n [pageSize]=\"length$ | async\"\n [showFirstLastButtons]=\"true\"\n >\n </mat-paginator>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'queryBuilder' && enableQueryBuilder\">\n <div class=\"flex flex-col\" *ngIf=\"showQueryBuilder$ | async\">\n <mat-card class=\"my-4\" [niceLoadingOverlay]=\"filterConfigLoading$ | async\">\n <mat-card-content class=\"flex flex-col\">\n <div class=\"flex-auto\">\n <nice-query-builder\n [filterConfigs]=\"filterConfig$ | async\"\n [ngModel]=\"rules$ | async\"\n (ngModelChange)=\"onUpdateRules($event)\"\n (close)=\"clickToggleShowQueryBuilder()\"\n ></nice-query-builder>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'filters' && filters\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"filters\"></ng-container>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #tableLayout let-item=\"item\">\n <div [ngClass]=\"item.classes\">\n <div\n [niceLoadingOverlay]=\"loading$ | async\"\n class=\"content-card base-list flex flex-col justify-between\"\n >\n <mat-table\n (matSortChange)=\"onUpdateSort($event)\"\n [dataSource]=\"data$\"\n [matSortActive]=\"(sortColumn$ | async) || ''\"\n [matSortDirection]=\"(sortDirection$ | async) || ''\"\n class=\"flex flex-col flex-auto\"\n matSort\n >\n <mat-header-row *matHeaderRowDef=\"columnNames; sticky: table.stickyHeader\"></mat-header-row>\n\n <ng-container *ngFor=\"let column of columns\" [matColumnDef]=\"column.id\">\n <ng-container *ngIf=\"column.sortable\">\n <mat-header-cell *matHeaderCellDef mat-sort-header>\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, header: true }\"\n ></ng-container>\n </mat-header-cell>\n </ng-container>\n <ng-container *ngIf=\"!column.sortable\">\n <mat-header-cell *matHeaderCellDef>\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, header: true }\"\n ></ng-container>\n </mat-header-cell>\n </ng-container>\n\n <mat-cell *matCellDef=\"let item\">\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, data: true, item: item }\"\n ></ng-container>\n </mat-cell>\n </ng-container>\n\n <ng-container *ngIf=\"disableRouting; else withRouting\">\n <mat-row *matRowDef=\"let item; columns: columnNames;\" class=\"item\"></mat-row>\n </ng-container>\n\n <ng-template #withRouting>\n <mat-row\n *matRowDef=\"let item; columns: columnNames;\"\n (click)=\"navigate(item)\"\n class=\"item clickable\"\n matRipple\n >\n </mat-row>\n </ng-template>\n </mat-table>\n </div>\n </div>\n</ng-template>\n\n<ng-template #cardsLayout let-item=\"item\" let-active=\"active\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngFor=\"let data of data$ | async\">\n <ng-container *ngTemplateOutlet=\"cards; context: { item: data, active }\"></ng-container>\n </ng-container>\n </div>\n</ng-template>\n\n<ng-template #customLayout let-item=\"item\" let-active=\"active\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"customContent; context: { $implicit: data$ | async, data: data$ | async, total: recordsFiltered$ | async, active }\"></ng-container>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i11.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i11.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i12.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i5.NiceLoadingDirective, selector: "[niceLoadingOverlay]", inputs: ["niceLoadingOverlay"] }, { kind: "component", type: i13.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i13.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i13.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i13.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i13.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i13.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i13.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i13.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i13.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i13.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i14.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i14.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: i15.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: NiceQueryBuilderComponent, selector: "nice-query-builder", inputs: ["filterConfigs", "currentSavedReport", "loading"], outputs: ["close", "createReport", "updateReport"] }, { kind: "directive", type: QueryBuilderTriggerDirective, selector: "[niceQueryBuilderTrigger]", inputs: ["queryBuilderFilters", "queryBuilderFiltersLoading"], outputs: ["queryBuilderFilterSelected"] }, { kind: "directive", type: i18.MatBadge, selector: "[matBadge]", inputs: ["matBadgeDisabled", "matBadgeColor", "matBadgeOverlap", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
|
|
2608
|
+
], usesInheritance: true, ngImport: i0, template: "<div class=\"list page-layout carded fullwidth inner-scroll\" *ngIf=\"layout === 'page'; else content\">\n <div class=\"center\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n</div>\n\n<ng-template #content>\n <ng-container *ngIf=\"listLayout.xl\">\n <div class=\"hidden xl:block\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.xl, active: xlActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.lg\">\n <div class=\"hidden lg:block xl:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.lg, active: lgActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.md\">\n <div class=\"hidden md:block lg:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.md, active: mdActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.sm\">\n <div class=\"hidden sm:block md:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.sm, active: smActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"listLayout.xs\">\n <div class=\"block sm:hidden\">\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.xs, active: xsActive$ | async }\"></ng-container>\n </div>\n </ng-container>\n\n <div\n [class.hidden]=\"!!listLayout.xs\"\n [class.block]=\"!listLayout.xs\"\n [class.sm:hidden]=\"!!listLayout.sm\"\n [class.sm:block]=\"!listLayout.sm\"\n [class.md:hidden]=\"!!listLayout.md\"\n [class.md:block]=\"!listLayout.md\"\n [class.lg:hidden]=\"!!listLayout.lg\"\n [class.lg:block]=\"!listLayout.lg\"\n [class.xl:hidden]=\"!!listLayout.xl\"\n [class.xl:block]=\"!listLayout.xl\"\n >\n <ng-container *ngTemplateOutlet=\"pageLayout; context: { layout: listLayout.default, active: defaultActive$ | async }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #pageLayout let-layout=\"layout\" let-active=\"active\">\n <ng-container *ngIf=\"layout?.length; else isObject\">\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: { classes: ['flex flex-col'], items: layout }, active }\"></ng-container>\n </ng-container>\n\n <ng-template #isObject>\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: layout, active }\"></ng-container>\n </ng-template>\n</ng-template>\n\n<ng-template #contentLayout let-layout=\"layout\" let-active=\"active\">\n <div [ngClass]=\"layout.classes\">\n <ng-container *ngFor=\"let item of layout.items\">\n <ng-container *ngIf=\"item.name; else childIsLayout\">\n <ng-container *ngTemplateOutlet=\"layoutItem; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-template #childIsLayout>\n <ng-container *ngTemplateOutlet=\"contentLayout; context: { layout: item, active }\"></ng-container>\n </ng-template>\n </ng-container>\n </div>\n</ng-template>\n\n<ng-template #layoutItem let-item=\"item\" let-active=\"active\">\n <ng-container *ngIf=\"item.name === 'title' && title\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"title\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'search'\">\n <div [ngClass]=\"item.classes\">\n <div class=\"search-wrapper mx-md-0\">\n <div class=\"search flex flex-auto justify-start items-center\">\n <mat-icon [svgIcon]=\"icons.search.svgIcon\">{{ icons.search.matIcon }}</mat-icon>\n <input [ngModel]=\"searchQuery$ | async\" (ngModelChange)=\"onUpdateSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n\n <ng-container *ngIf=\"searchButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"searchButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"enableQueryBuilder\">\n <button\n *ngIf=\"!(showQueryBuilder$ | async) && !(rulesCount$ | async) && (filterConfig$ | async).length > 0\"\n mat-icon-button\n niceQueryBuilderTrigger\n [queryBuilderFilters]=\"filterConfig$ | async\"\n [queryBuilderFiltersLoading]=\"(filterConfigLoading$ | async) || false\"\n (queryBuilderFilterSelected)=\"onQueryBuilderFilterSelected($event)\"\n [matTooltip]=\"'general.query_builder.show_advanced_search' | translate\"\n >\n <mat-icon\n [svgIcon]=\"icons.queryBuilder.svgIcon\"\n [matBadge]=\"rulesCount$ | async\"\n [matBadgeHidden]=\"!(rulesCount$ | async)\"\n matBadgeColor=\"accent\"\n >\n {{ icons.queryBuilder.matIcon }}\n </mat-icon>\n </button>\n <button\n mat-icon-button\n *ngIf=\"!(showQueryBuilder$ | async) && (rulesCount$ | async)\"\n [disabled]=\"filterConfigLoading$ | async\"\n (click)=\"clickToggleShowQueryBuilder()\"\n [matTooltip]=\"'general.query_builder.show_advanced_search' | translate\"\n >\n <mat-icon\n [svgIcon]=\"icons.queryBuilder.svgIcon\"\n [matBadge]=\"rulesCount$ | async\"\n [matBadgeHidden]=\"!(rulesCount$ | async)\"\n matBadgeColor=\"accent\"\n >\n {{ icons.queryBuilder.matIcon }}\n </mat-icon>\n </button>\n <button\n mat-icon-button\n *ngIf=\"showQueryBuilder$ | async\"\n (click)=\"clickToggleShowQueryBuilder()\"\n [matTooltip]=\"'general.query_builder.close_advanced_search' | translate\"\n >\n <mat-icon [svgIcon]=\"icons.close.svgIcon\">{{ icons.close.matIcon }}</mat-icon>\n </button>\n </ng-container>\n </div>\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'prefixButtons' && prefixButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"prefixButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'suffixButtons' && suffixButtons\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"suffixButtons\"></ng-container>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'exportButtons' && canExport\">\n <div [ngClass]=\"item.classes\" [class.mr-2]=\"!!suffixButtons\" [class.ml-2]=\"!!prefixButtons\">\n <button\n (click)=\"clickPrint()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.print' | translate\"\n class=\"list-button mr-2\"\n mat-mini-fab\n >\n <mat-icon [svgIcon]=\"icons.print.svgIcon\">{{ icons.print.matIcon }}</mat-icon>\n </button>\n\n <button\n (click)=\"clickExport()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.export' | translate\"\n class=\"list-button mr-2\"\n mat-mini-fab\n >\n <mat-icon [svgIcon]=\"icons.download.svgIcon\">{{ icons.download.matIcon }}</mat-icon>\n </button>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'content'\">\n <ng-container *ngIf=\"((isEmpty$ | async) && emptyState) || ((isSearchResultEmpty$ | async) && emptySearchResultState); else showData\">\n\n <ng-container *ngIf=\"(isSearchResultEmpty$ | async)\">\n <ng-container *ngTemplateOutlet=\"emptySearchResultState\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"isEmpty$ | async\">\n <ng-container *ngTemplateOutlet=\"emptyState\"></ng-container>\n </ng-container>\n\n </ng-container>\n <ng-template #showData>\n <ng-container *ngIf=\"layoutContent === 'table' && table\">\n <ng-container *ngTemplateOutlet=\"tableLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"layoutContent === 'cards' && cards\">\n <ng-container *ngTemplateOutlet=\"cardsLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"layoutContent === 'custom' && customContent\">\n <ng-container *ngTemplateOutlet=\"customLayout; context: { item: item, active }\"></ng-container>\n </ng-container>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'pagination' && layoutContent !== 'custom'\">\n <div [ngClass]=\"item.classes\">\n <mat-paginator\n (page)=\"onUpdatePage($event)\"\n [length]=\"recordsFiltered$ | async\"\n [pageIndex]=\"index$ | async\"\n [pageSizeOptions]=\"defaultPageSizeOptions\"\n [pageSize]=\"length$ | async\"\n [showFirstLastButtons]=\"true\"\n >\n </mat-paginator>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'queryBuilder' && enableQueryBuilder\">\n <div class=\"flex flex-col\" *ngIf=\"showQueryBuilder$ | async\">\n <mat-card class=\"my-4\" [niceLoadingOverlay]=\"filterConfigLoading$ | async\">\n <mat-card-content class=\"flex flex-col\">\n <div class=\"flex-auto\">\n <nice-query-builder\n [filterConfigs]=\"filterConfig$ | async\"\n [ngModel]=\"rules$ | async\"\n (ngModelChange)=\"onUpdateRules($event)\"\n (close)=\"clickToggleShowQueryBuilder()\"\n ></nice-query-builder>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"item.name === 'filters' && filters\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"filters\"></ng-container>\n </div>\n </ng-container>\n</ng-template>\n\n<ng-template #tableLayout let-item=\"item\">\n <div [ngClass]=\"item.classes\">\n <div\n [niceLoadingOverlay]=\"loading$ | async\"\n class=\"content-card base-list flex flex-col justify-between\"\n >\n <mat-table\n (matSortChange)=\"onUpdateSort($event)\"\n [dataSource]=\"data$\"\n [matSortActive]=\"(sortColumn$ | async) || ''\"\n [matSortDirection]=\"(sortDirection$ | async) || ''\"\n class=\"flex flex-col flex-auto\"\n matSort\n >\n <mat-header-row *matHeaderRowDef=\"columnNames; sticky: table.stickyHeader\"></mat-header-row>\n\n <ng-container *ngFor=\"let column of columns\" [matColumnDef]=\"column.id\">\n <ng-container *ngIf=\"column.sortable\">\n <mat-header-cell *matHeaderCellDef mat-sort-header>\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, header: true }\"\n ></ng-container>\n </mat-header-cell>\n </ng-container>\n <ng-container *ngIf=\"!column.sortable\">\n <mat-header-cell *matHeaderCellDef>\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, header: true }\"\n ></ng-container>\n </mat-header-cell>\n </ng-container>\n\n <mat-cell *matCellDef=\"let item\">\n <ng-container\n *ngTemplateOutlet=\"table.template; context: { column: column.id, data: true, item: item }\"\n ></ng-container>\n </mat-cell>\n </ng-container>\n\n <ng-container *ngIf=\"disableRouting; else withRouting\">\n <mat-row *matRowDef=\"let item; columns: columnNames;\" class=\"item\"></mat-row>\n </ng-container>\n\n <ng-template #withRouting>\n <mat-row\n *matRowDef=\"let item; columns: columnNames;\"\n (click)=\"navigate(item)\"\n class=\"item clickable\"\n matRipple\n >\n </mat-row>\n </ng-template>\n </mat-table>\n </div>\n </div>\n</ng-template>\n\n<ng-template #cardsLayout let-item=\"item\" let-active=\"active\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngFor=\"let data of data$ | async\">\n <ng-container *ngTemplateOutlet=\"cards; context: { item: data, active }\"></ng-container>\n </ng-container>\n </div>\n</ng-template>\n\n<ng-template #customLayout let-item=\"item\" let-active=\"active\">\n <div [ngClass]=\"item.classes\">\n <ng-container *ngTemplateOutlet=\"customContent; context: { $implicit: data$ | async, data: data$ | async, total: recordsFiltered$ | async, active }\"></ng-container>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i11.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i11.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i12.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i5$1.NiceLoadingDirective, selector: "[niceLoadingOverlay]", inputs: ["niceLoadingOverlay"] }, { kind: "component", type: i13.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i13.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i13.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i13.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i13.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i13.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i13.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i13.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i13.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i13.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i14.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i14.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: i15.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: NiceQueryBuilderComponent, selector: "nice-query-builder", inputs: ["filterConfigs", "currentSavedReport", "loading"], outputs: ["close", "createReport", "updateReport"] }, { kind: "directive", type: QueryBuilderTriggerDirective, selector: "[niceQueryBuilderTrigger]", inputs: ["queryBuilderFilters", "queryBuilderFiltersLoading"], outputs: ["queryBuilderFilterSelected"] }, { kind: "directive", type: i18.MatBadge, selector: "[matBadge]", inputs: ["matBadgeDisabled", "matBadgeColor", "matBadgeOverlap", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
|
|
2608
2609
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceMultiStateListComponent, decorators: [{
|
|
2609
2610
|
type: Component,
|
|
2610
2611
|
args: [{ selector: "nice-multi-state-list", providers: [
|
|
@@ -2626,7 +2627,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
2626
2627
|
}] }, { type: undefined, decorators: [{
|
|
2627
2628
|
type: Inject,
|
|
2628
2629
|
args: [EXPORTS_SETTINGS$1]
|
|
2629
|
-
}] }, { type: NiceMultiStateListQuery }, { type: i2.ActivatedRoute }, { type:
|
|
2630
|
+
}] }, { type: NiceMultiStateListQuery }, { type: i2.ActivatedRoute }, { type: i4$1.MatBottomSheet }, { type: i2.Router }, { type: i5$1.NiceMediaWatcherService }, { type: NiceMultiStateListService }]; }, propDecorators: { state: [{
|
|
2630
2631
|
type: Input
|
|
2631
2632
|
}] } });
|
|
2632
2633
|
|
|
@@ -2755,6 +2756,7 @@ const initialValue = {
|
|
|
2755
2756
|
mode: "paginated",
|
|
2756
2757
|
autoLoad: true,
|
|
2757
2758
|
disabled: false,
|
|
2759
|
+
initialLoadCompleted: false,
|
|
2758
2760
|
filterConfigLoading: false,
|
|
2759
2761
|
filterConfig: [],
|
|
2760
2762
|
filterResult: null,
|
|
@@ -2788,7 +2790,7 @@ class NiceFilterViewStore extends EntityStore {
|
|
|
2788
2790
|
this.update({ filterParameters });
|
|
2789
2791
|
}
|
|
2790
2792
|
setResult(filterResult) {
|
|
2791
|
-
const { mode, resetResult } = this.getValue();
|
|
2793
|
+
const { mode, resetResult, initialLoadCompleted } = this.getValue();
|
|
2792
2794
|
if (mode === "accumulated") {
|
|
2793
2795
|
this.update((state) => ({
|
|
2794
2796
|
filterResult: {
|
|
@@ -2813,6 +2815,9 @@ class NiceFilterViewStore extends EntityStore {
|
|
|
2813
2815
|
else {
|
|
2814
2816
|
this.set([...filterResult.values]);
|
|
2815
2817
|
}
|
|
2818
|
+
if (!initialLoadCompleted) {
|
|
2819
|
+
this.update({ initialLoadCompleted: true });
|
|
2820
|
+
}
|
|
2816
2821
|
}
|
|
2817
2822
|
addValue(value, opts) {
|
|
2818
2823
|
const { filterResult } = this.getValue();
|
|
@@ -2827,6 +2832,19 @@ class NiceFilterViewStore extends EntityStore {
|
|
|
2827
2832
|
});
|
|
2828
2833
|
this.add(value, opts);
|
|
2829
2834
|
}
|
|
2835
|
+
addValues(values, opts) {
|
|
2836
|
+
const { filterResult } = this.getValue();
|
|
2837
|
+
if (!filterResult) {
|
|
2838
|
+
return;
|
|
2839
|
+
}
|
|
2840
|
+
this.update({
|
|
2841
|
+
filterResult: {
|
|
2842
|
+
...filterResult,
|
|
2843
|
+
values: arrayAdd(filterResult.values, values, opts)
|
|
2844
|
+
}
|
|
2845
|
+
});
|
|
2846
|
+
this.add(values, opts);
|
|
2847
|
+
}
|
|
2830
2848
|
upsertValue(value, key) {
|
|
2831
2849
|
const { filterResult } = this.getValue();
|
|
2832
2850
|
if (!filterResult) {
|
|
@@ -2841,6 +2859,22 @@ class NiceFilterViewStore extends EntityStore {
|
|
|
2841
2859
|
});
|
|
2842
2860
|
this.upsert(value[idKey], value);
|
|
2843
2861
|
}
|
|
2862
|
+
upsertValues(values, key) {
|
|
2863
|
+
const { filterResult } = this.getValue();
|
|
2864
|
+
if (!filterResult) {
|
|
2865
|
+
return;
|
|
2866
|
+
}
|
|
2867
|
+
const idKey = key ?? this.idKey;
|
|
2868
|
+
for (const value of values) {
|
|
2869
|
+
this.update({
|
|
2870
|
+
filterResult: {
|
|
2871
|
+
...filterResult,
|
|
2872
|
+
values: arrayUpsert(filterResult.values, value[idKey], value, key)
|
|
2873
|
+
}
|
|
2874
|
+
});
|
|
2875
|
+
this.upsert(value[idKey], value);
|
|
2876
|
+
}
|
|
2877
|
+
}
|
|
2844
2878
|
removeValue(value, key) {
|
|
2845
2879
|
const { filterResult } = this.getValue();
|
|
2846
2880
|
if (!filterResult) {
|
|
@@ -2855,6 +2889,21 @@ class NiceFilterViewStore extends EntityStore {
|
|
|
2855
2889
|
});
|
|
2856
2890
|
this.remove(value[idKey]);
|
|
2857
2891
|
}
|
|
2892
|
+
removeValues(values, key) {
|
|
2893
|
+
const { filterResult } = this.getValue();
|
|
2894
|
+
if (!filterResult) {
|
|
2895
|
+
return;
|
|
2896
|
+
}
|
|
2897
|
+
const idKey = key ?? this.idKey;
|
|
2898
|
+
const ids = values.map(value => value[idKey]);
|
|
2899
|
+
this.update({
|
|
2900
|
+
filterResult: {
|
|
2901
|
+
...filterResult,
|
|
2902
|
+
values: arrayRemove(filterResult.values, ids)
|
|
2903
|
+
}
|
|
2904
|
+
});
|
|
2905
|
+
this.remove(ids);
|
|
2906
|
+
}
|
|
2858
2907
|
getParameters(filterParameters) {
|
|
2859
2908
|
const { baseRules } = this.getValue();
|
|
2860
2909
|
const parameters = {
|
|
@@ -2876,6 +2925,48 @@ class NiceFilterViewStore extends EntityStore {
|
|
|
2876
2925
|
}
|
|
2877
2926
|
NiceFilterViewStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewStore, deps: [{ token: FILTER_VIEW_STATE }, { token: FILTER_VIEW_STORE }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
2878
2927
|
NiceFilterViewStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewStore });
|
|
2928
|
+
__decorate([
|
|
2929
|
+
transaction(),
|
|
2930
|
+
__metadata("design:type", Function),
|
|
2931
|
+
__metadata("design:paramtypes", [Object]),
|
|
2932
|
+
__metadata("design:returntype", void 0)
|
|
2933
|
+
], NiceFilterViewStore.prototype, "setResult", null);
|
|
2934
|
+
__decorate([
|
|
2935
|
+
transaction(),
|
|
2936
|
+
__metadata("design:type", Function),
|
|
2937
|
+
__metadata("design:paramtypes", [Object, Object]),
|
|
2938
|
+
__metadata("design:returntype", void 0)
|
|
2939
|
+
], NiceFilterViewStore.prototype, "addValue", null);
|
|
2940
|
+
__decorate([
|
|
2941
|
+
transaction(),
|
|
2942
|
+
__metadata("design:type", Function),
|
|
2943
|
+
__metadata("design:paramtypes", [Array, Object]),
|
|
2944
|
+
__metadata("design:returntype", void 0)
|
|
2945
|
+
], NiceFilterViewStore.prototype, "addValues", null);
|
|
2946
|
+
__decorate([
|
|
2947
|
+
transaction(),
|
|
2948
|
+
__metadata("design:type", Function),
|
|
2949
|
+
__metadata("design:paramtypes", [Object, String]),
|
|
2950
|
+
__metadata("design:returntype", void 0)
|
|
2951
|
+
], NiceFilterViewStore.prototype, "upsertValue", null);
|
|
2952
|
+
__decorate([
|
|
2953
|
+
transaction(),
|
|
2954
|
+
__metadata("design:type", Function),
|
|
2955
|
+
__metadata("design:paramtypes", [Array, String]),
|
|
2956
|
+
__metadata("design:returntype", void 0)
|
|
2957
|
+
], NiceFilterViewStore.prototype, "upsertValues", null);
|
|
2958
|
+
__decorate([
|
|
2959
|
+
transaction(),
|
|
2960
|
+
__metadata("design:type", Function),
|
|
2961
|
+
__metadata("design:paramtypes", [Object, String]),
|
|
2962
|
+
__metadata("design:returntype", void 0)
|
|
2963
|
+
], NiceFilterViewStore.prototype, "removeValue", null);
|
|
2964
|
+
__decorate([
|
|
2965
|
+
transaction(),
|
|
2966
|
+
__metadata("design:type", Function),
|
|
2967
|
+
__metadata("design:paramtypes", [Array, String]),
|
|
2968
|
+
__metadata("design:returntype", void 0)
|
|
2969
|
+
], NiceFilterViewStore.prototype, "removeValues", null);
|
|
2879
2970
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewStore, decorators: [{
|
|
2880
2971
|
type: Injectable
|
|
2881
2972
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
@@ -2884,7 +2975,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
2884
2975
|
}] }, { type: undefined, decorators: [{
|
|
2885
2976
|
type: Inject,
|
|
2886
2977
|
args: [FILTER_VIEW_STORE]
|
|
2887
|
-
}] }]; } });
|
|
2978
|
+
}] }]; }, propDecorators: { setResult: [], addValue: [], addValues: [], upsertValue: [], upsertValues: [], removeValue: [], removeValues: [] } });
|
|
2888
2979
|
|
|
2889
2980
|
class NiceFilterViewQuery extends QueryEntity {
|
|
2890
2981
|
constructor(store) {
|
|
@@ -2986,14 +3077,30 @@ class NiceFilterViewService {
|
|
|
2986
3077
|
this.store.setLoading(false);
|
|
2987
3078
|
}
|
|
2988
3079
|
}
|
|
2989
|
-
async downloadData(type, downloadFileName) {
|
|
3080
|
+
async downloadData(type, downloadFileName, ids) {
|
|
2990
3081
|
const { filterParameters, disabled } = this.store.getValue();
|
|
2991
3082
|
if (disabled) {
|
|
2992
3083
|
return;
|
|
2993
3084
|
}
|
|
3085
|
+
const parameters = {
|
|
3086
|
+
...filterParameters,
|
|
3087
|
+
rules: filterParameters?.rules ? [...filterParameters.rules] : []
|
|
3088
|
+
};
|
|
3089
|
+
if (ids?.length) {
|
|
3090
|
+
parameters.rules.push({
|
|
3091
|
+
condition: "and",
|
|
3092
|
+
rules: [
|
|
3093
|
+
{
|
|
3094
|
+
id: "id",
|
|
3095
|
+
operation: FilterOperatorTypes.In,
|
|
3096
|
+
value: ids
|
|
3097
|
+
}
|
|
3098
|
+
]
|
|
3099
|
+
});
|
|
3100
|
+
}
|
|
2994
3101
|
try {
|
|
2995
3102
|
this.store.setLoading(true);
|
|
2996
|
-
const result = await firstValueFrom(this.filterService.getFile(type, this.store.getParameters(
|
|
3103
|
+
const result = await firstValueFrom(this.filterService.getFile(type, this.store.getParameters(parameters)));
|
|
2997
3104
|
FileUtils.downloadFile(`${downloadFileName}.${type}`, result);
|
|
2998
3105
|
}
|
|
2999
3106
|
catch (e) {
|
|
@@ -3111,17 +3218,27 @@ class NiceFilterViewService {
|
|
|
3111
3218
|
addValue(value, opts) {
|
|
3112
3219
|
this.store.addValue(value, opts);
|
|
3113
3220
|
}
|
|
3221
|
+
addValues(value, opts) {
|
|
3222
|
+
this.store.addValues(value, opts);
|
|
3223
|
+
}
|
|
3114
3224
|
upsertValue(value, key) {
|
|
3115
3225
|
this.store.upsertValue(value, key);
|
|
3116
3226
|
}
|
|
3227
|
+
upsertValues(values, key) {
|
|
3228
|
+
this.store.upsertValues(values, key);
|
|
3229
|
+
}
|
|
3117
3230
|
removeValue(value, key) {
|
|
3118
3231
|
this.store.removeValue(value, key);
|
|
3119
3232
|
}
|
|
3233
|
+
removeValues(values, key) {
|
|
3234
|
+
this.store.removeValues(values, key);
|
|
3235
|
+
}
|
|
3120
3236
|
resetResult(waitForNextFilter) {
|
|
3121
3237
|
if (!waitForNextFilter) {
|
|
3122
3238
|
this.store.update({
|
|
3123
3239
|
filterResult: null
|
|
3124
3240
|
});
|
|
3241
|
+
this.store.set([]);
|
|
3125
3242
|
}
|
|
3126
3243
|
else {
|
|
3127
3244
|
this.store.update({
|
|
@@ -3132,12 +3249,18 @@ class NiceFilterViewService {
|
|
|
3132
3249
|
}
|
|
3133
3250
|
NiceFilterViewService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewService, deps: [{ token: NiceFilterViewStore }, { token: NiceFilterService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
3134
3251
|
NiceFilterViewService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewService });
|
|
3252
|
+
__decorate([
|
|
3253
|
+
transaction(),
|
|
3254
|
+
__metadata("design:type", Function),
|
|
3255
|
+
__metadata("design:paramtypes", [Boolean]),
|
|
3256
|
+
__metadata("design:returntype", void 0)
|
|
3257
|
+
], NiceFilterViewService.prototype, "resetResult", null);
|
|
3135
3258
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewService, decorators: [{
|
|
3136
3259
|
type: Injectable
|
|
3137
3260
|
}], ctorParameters: function () { return [{ type: NiceFilterViewStore }, { type: undefined, decorators: [{
|
|
3138
3261
|
type: Inject,
|
|
3139
3262
|
args: [NiceFilterService]
|
|
3140
|
-
}] }]; } });
|
|
3263
|
+
}] }]; }, propDecorators: { resetResult: [] } });
|
|
3141
3264
|
|
|
3142
3265
|
class AdvancedFiltersUtils {
|
|
3143
3266
|
static isSingleInput(filterOperator) {
|
|
@@ -3274,7 +3397,7 @@ class NiceAdvancedFilterSelectionComponent {
|
|
|
3274
3397
|
}
|
|
3275
3398
|
}
|
|
3276
3399
|
NiceAdvancedFilterSelectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAdvancedFilterSelectionComponent, deps: [{ token: NiceFilterViewQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
3277
|
-
NiceAdvancedFilterSelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceAdvancedFilterSelectionComponent, selector: "nice-advanced-filter-selection", outputs: { filterSelected: "filterSelected" }, ngImport: i0, template: "<mat-card class=\"flex flex-row flex-wrap filter-selection-container\" [niceLoadingOverlay]=\"loading$ | async\">\n <div [class.md:grid-cols-2]=\"filterGroups.length >= 2\" class=\"grid grid-cols-1 gap-4\" *ngIf=\"filterGroups$ | async as filterGroups\">\n <div class=\"flex flex-col\" *ngFor=\"let group of filterGroups; trackBy: trackGroups\">\n <div class=\"filter-group flex items-center gap-4 pb-4\">\n <ng-container *ngIf=\"group[0].key | niceFilterGroupIcon as icon\">\n <i matListItemIcon class=\"group-icon fal\" [ngClass]=\"icon.class\" *ngIf=\"icon.class\"></i>\n <mat-icon matListItemIcon class=\"group-icon\" [svgIcon]=\"icon.svgIcon\" *ngIf=\"icon.svgIcon\"></mat-icon>\n <mat-icon matListItemIcon class=\"group-icon\" *ngIf=\"icon.matIcon\">{{ icon.matIcon }}</mat-icon>\n </ng-container>\n\n <strong class=\"group-name\">{{ group[0].name }}</strong>\n </div>\n\n <div class=\"filter-item\" matRipple *ngFor=\"let filter of group[1]; trackBy: trackFilter\" (click)=\"selectFilter(filter)\">\n {{ filter?.name }}\n </div>\n </div>\n </div>\n</mat-card>\n", dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i11.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "directive", type: i5.NiceLoadingDirective, selector: "[niceLoadingOverlay]", inputs: ["niceLoadingOverlay"] }, { kind: "component", type:
|
|
3400
|
+
NiceAdvancedFilterSelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceAdvancedFilterSelectionComponent, selector: "nice-advanced-filter-selection", outputs: { filterSelected: "filterSelected" }, ngImport: i0, template: "<mat-card class=\"flex flex-row flex-wrap filter-selection-container\" [niceLoadingOverlay]=\"loading$ | async\">\n <div [class.md:grid-cols-2]=\"filterGroups.length >= 2\" class=\"grid grid-cols-1 gap-4\" *ngIf=\"filterGroups$ | async as filterGroups\">\n <div class=\"flex flex-col\" *ngFor=\"let group of filterGroups; trackBy: trackGroups\">\n <div class=\"filter-group flex items-center gap-4 pb-4\">\n <ng-container *ngIf=\"group[0].key | niceFilterGroupIcon as icon\">\n <i matListItemIcon class=\"group-icon fal\" [ngClass]=\"icon.class\" *ngIf=\"icon.class\"></i>\n <mat-icon matListItemIcon class=\"group-icon\" [svgIcon]=\"icon.svgIcon\" *ngIf=\"icon.svgIcon\"></mat-icon>\n <mat-icon matListItemIcon class=\"group-icon\" *ngIf=\"icon.matIcon\">{{ icon.matIcon }}</mat-icon>\n </ng-container>\n\n <strong class=\"group-name\">{{ group[0].name }}</strong>\n </div>\n\n <div class=\"filter-item\" matRipple *ngFor=\"let filter of group[1]; trackBy: trackFilter\" (click)=\"selectFilter(filter)\">\n {{ filter?.name }}\n </div>\n </div>\n </div>\n</mat-card>\n", dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i11.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "directive", type: i5$1.NiceLoadingDirective, selector: "[niceLoadingOverlay]", inputs: ["niceLoadingOverlay"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i15.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: NiceFilterGroupIconPipe, name: "niceFilterGroupIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3278
3401
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAdvancedFilterSelectionComponent, decorators: [{
|
|
3279
3402
|
type: Component,
|
|
3280
3403
|
args: [{ selector: "nice-advanced-filter-selection", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-card class=\"flex flex-row flex-wrap filter-selection-container\" [niceLoadingOverlay]=\"loading$ | async\">\n <div [class.md:grid-cols-2]=\"filterGroups.length >= 2\" class=\"grid grid-cols-1 gap-4\" *ngIf=\"filterGroups$ | async as filterGroups\">\n <div class=\"flex flex-col\" *ngFor=\"let group of filterGroups; trackBy: trackGroups\">\n <div class=\"filter-group flex items-center gap-4 pb-4\">\n <ng-container *ngIf=\"group[0].key | niceFilterGroupIcon as icon\">\n <i matListItemIcon class=\"group-icon fal\" [ngClass]=\"icon.class\" *ngIf=\"icon.class\"></i>\n <mat-icon matListItemIcon class=\"group-icon\" [svgIcon]=\"icon.svgIcon\" *ngIf=\"icon.svgIcon\"></mat-icon>\n <mat-icon matListItemIcon class=\"group-icon\" *ngIf=\"icon.matIcon\">{{ icon.matIcon }}</mat-icon>\n </ng-container>\n\n <strong class=\"group-name\">{{ group[0].name }}</strong>\n </div>\n\n <div class=\"filter-item\" matRipple *ngFor=\"let filter of group[1]; trackBy: trackFilter\" (click)=\"selectFilter(filter)\">\n {{ filter?.name }}\n </div>\n </div>\n </div>\n</mat-card>\n" }]
|
|
@@ -3374,7 +3497,7 @@ class NiceAdvancedFiltersButtonComponent {
|
|
|
3374
3497
|
}
|
|
3375
3498
|
}
|
|
3376
3499
|
NiceAdvancedFiltersButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAdvancedFiltersButtonComponent, deps: [{ token: ADVANCED_FILTER_ICONS, optional: true }, { token: NiceFilterViewQuery }, { token: NiceFilterViewService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3377
|
-
NiceAdvancedFiltersButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceAdvancedFiltersButtonComponent, selector: "nice-advanced-filters-button", ngImport: i0, template: "<div class=\"relative\">\n <ng-container *ngIf=\"(hasParameters$ | async) && (shouldShowAdvancedFilters$ | async) !== true\">\n <div class=\"absolute top-2 right-2 w-1 h-1 rounded bg-accent\"></div>\n\n <button mat-icon-button (click)=\"clickToggleShowAdvancedFilters()\">\n <mat-icon [svgIcon]=\"icons.queryBuilder.svgIcon\">{{ icons.queryBuilder.matIcon }}</mat-icon>\n </button>\n </ng-container>\n\n <ng-container *ngIf=\"shouldShowAdvancedFilters$ | async\">\n <button mat-icon-button (click)=\"clickToggleShowAdvancedFilters()\">\n <mat-icon [svgIcon]=\"icons.close.svgIcon\">{{ icons.close.matIcon }}</mat-icon>\n </button>\n </ng-container>\n\n <ng-container *ngIf=\"(hasParameters$ | async) !== true && (shouldShowAdvancedFilters$ | async) !== true\">\n <button mat-icon-button niceAdvancedFiltersTrigger (advancedFilterSelected)=\"onSelectedFilter($event)\">\n <mat-icon [svgIcon]=\"icons.queryBuilder.svgIcon\">{{ icons.queryBuilder.matIcon }}</mat-icon>\n </button>\n </ng-container>\n</div>\n", styles: ["nice-advanced-filters-button{width:40px;height:40px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type:
|
|
3500
|
+
NiceAdvancedFiltersButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceAdvancedFiltersButtonComponent, selector: "nice-advanced-filters-button", ngImport: i0, template: "<div class=\"relative\">\n <ng-container *ngIf=\"(hasParameters$ | async) && (shouldShowAdvancedFilters$ | async) !== true\">\n <div class=\"absolute top-2 right-2 w-1 h-1 rounded bg-accent\"></div>\n\n <button mat-icon-button (click)=\"clickToggleShowAdvancedFilters()\">\n <mat-icon [svgIcon]=\"icons.queryBuilder.svgIcon\">{{ icons.queryBuilder.matIcon }}</mat-icon>\n </button>\n </ng-container>\n\n <ng-container *ngIf=\"shouldShowAdvancedFilters$ | async\">\n <button mat-icon-button (click)=\"clickToggleShowAdvancedFilters()\">\n <mat-icon [svgIcon]=\"icons.close.svgIcon\">{{ icons.close.matIcon }}</mat-icon>\n </button>\n </ng-container>\n\n <ng-container *ngIf=\"(hasParameters$ | async) !== true && (shouldShowAdvancedFilters$ | async) !== true\">\n <button mat-icon-button niceAdvancedFiltersTrigger (advancedFilterSelected)=\"onSelectedFilter($event)\">\n <mat-icon [svgIcon]=\"icons.queryBuilder.svgIcon\">{{ icons.queryBuilder.matIcon }}</mat-icon>\n </button>\n </ng-container>\n</div>\n", styles: ["nice-advanced-filters-button{width:40px;height:40px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: AdvancedFiltersTriggerDirective, selector: "[niceAdvancedFiltersTrigger]", inputs: ["position"], outputs: ["advancedFilterSelected"], exportAs: ["niceAdvancedFiltersTrigger"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3378
3501
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAdvancedFiltersButtonComponent, decorators: [{
|
|
3379
3502
|
type: Component,
|
|
3380
3503
|
args: [{ selector: "nice-advanced-filters-button", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"relative\">\n <ng-container *ngIf=\"(hasParameters$ | async) && (shouldShowAdvancedFilters$ | async) !== true\">\n <div class=\"absolute top-2 right-2 w-1 h-1 rounded bg-accent\"></div>\n\n <button mat-icon-button (click)=\"clickToggleShowAdvancedFilters()\">\n <mat-icon [svgIcon]=\"icons.queryBuilder.svgIcon\">{{ icons.queryBuilder.matIcon }}</mat-icon>\n </button>\n </ng-container>\n\n <ng-container *ngIf=\"shouldShowAdvancedFilters$ | async\">\n <button mat-icon-button (click)=\"clickToggleShowAdvancedFilters()\">\n <mat-icon [svgIcon]=\"icons.close.svgIcon\">{{ icons.close.matIcon }}</mat-icon>\n </button>\n </ng-container>\n\n <ng-container *ngIf=\"(hasParameters$ | async) !== true && (shouldShowAdvancedFilters$ | async) !== true\">\n <button mat-icon-button niceAdvancedFiltersTrigger (advancedFilterSelected)=\"onSelectedFilter($event)\">\n <mat-icon [svgIcon]=\"icons.queryBuilder.svgIcon\">{{ icons.queryBuilder.matIcon }}</mat-icon>\n </button>\n </ng-container>\n</div>\n", styles: ["nice-advanced-filters-button{width:40px;height:40px}\n"] }]
|
|
@@ -3568,7 +3691,7 @@ NiceAdvancedDateFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
|
|
|
3568
3691
|
useExisting: forwardRef(() => NiceAdvancedDateFilterComponent),
|
|
3569
3692
|
multi: true
|
|
3570
3693
|
}
|
|
3571
|
-
], usesInheritance: true, ngImport: i0, template: "<mat-form-field appearance=\"outline\" class=\"flex-auto\">\n <input matInput [matDatepicker]=\"picker\" [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\" />\n <mat-datepicker-toggle matSuffix [for]=\"picker\">\n <mat-icon matDatepickerToggleIcon [svgIcon]=\"icons.datePicker.svgIcon\">{{ icons.datePicker.matIcon }}</mat-icon>\n </mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type:
|
|
3694
|
+
], usesInheritance: true, ngImport: i0, template: "<mat-form-field appearance=\"outline\" class=\"flex-auto\">\n <input matInput [matDatepicker]=\"picker\" [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\" />\n <mat-datepicker-toggle matSuffix [for]=\"picker\">\n <mat-icon matDatepickerToggleIcon [svgIcon]=\"icons.datePicker.svgIcon\">{{ icons.datePicker.matIcon }}</mat-icon>\n </mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$2.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: "component", type: i5$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5$2.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }], encapsulation: i0.ViewEncapsulation.None });
|
|
3572
3695
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAdvancedDateFilterComponent, decorators: [{
|
|
3573
3696
|
type: Component,
|
|
3574
3697
|
args: [{ selector: "nice-advanced-date-filter", encapsulation: ViewEncapsulation.None, providers: [
|
|
@@ -3663,7 +3786,7 @@ NiceAdvancedSelectFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion
|
|
|
3663
3786
|
useExisting: forwardRef(() => NiceAdvancedSelectFilterComponent),
|
|
3664
3787
|
multi: true
|
|
3665
3788
|
}
|
|
3666
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<mat-form-field appearance=\"outline\" class=\"flex-auto\">\n <nice-typeahead\n *ngIf=\"!filterConfig.lazyLoading\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onValueChange($event)\"\n [items]=\"values\"\n bindValue=\"id\"\n bindLabel=\"name\"\n ></nice-typeahead>\n\n <nice-async-typeahead\n *ngIf=\"filterConfig.lazyLoading\"\n resource=\"advancedFilter\"\n [searchOptions]=\"{ filterConfig }\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onValueChange($event)\"\n ></nice-async-typeahead>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.NiceTypeaheadComponent, selector: "nice-typeahead", inputs: ["items", "labelFormatFn", "required", "disabled", "placeholder", "emptyPlaceholder", "allowNotFoundItems", "panelClass", "bindValue", "bindLabel", "typeahead", "page$", "loading", "loadingPage", "searchFn", "optionTemplate"], outputs: ["change"] }, { kind: "component", type: i5.NiceAsyncTypeaheadComponent, selector: "nice-async-typeahead", inputs: ["resource", "searchOptions", "autoReload", "preloadResource", "allowNotFoundItems", "panelClass", "bindValue", "bindLabel", "placeholder", "emptyPlaceholder", "optionTemplate", "filterFn", "labelFormatFn", "disabled", "value", "required"], outputs: ["entityRemoved", "selected"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
3789
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<mat-form-field appearance=\"outline\" class=\"flex-auto\">\n <nice-typeahead\n *ngIf=\"!filterConfig.lazyLoading\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onValueChange($event)\"\n [items]=\"values\"\n bindValue=\"id\"\n bindLabel=\"name\"\n ></nice-typeahead>\n\n <nice-async-typeahead\n *ngIf=\"filterConfig.lazyLoading\"\n resource=\"advancedFilter\"\n [searchOptions]=\"{ filterConfig }\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onValueChange($event)\"\n ></nice-async-typeahead>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.NiceTypeaheadComponent, selector: "nice-typeahead", inputs: ["items", "labelFormatFn", "required", "disabled", "placeholder", "emptyPlaceholder", "allowNotFoundItems", "panelClass", "bindValue", "bindLabel", "typeahead", "page$", "loading", "loadingPage", "searchFn", "optionTemplate"], outputs: ["change"] }, { kind: "component", type: i5$1.NiceAsyncTypeaheadComponent, selector: "nice-async-typeahead", inputs: ["resource", "searchOptions", "autoReload", "preloadResource", "allowNotFoundItems", "panelClass", "bindValue", "bindLabel", "placeholder", "emptyPlaceholder", "optionTemplate", "filterFn", "labelFormatFn", "disabled", "value", "required"], outputs: ["entityRemoved", "selected"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
3667
3790
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAdvancedSelectFilterComponent, decorators: [{
|
|
3668
3791
|
type: Component,
|
|
3669
3792
|
args: [{ selector: "nice-advanced-select-filter", encapsulation: ViewEncapsulation.None, providers: [
|
|
@@ -3686,7 +3809,7 @@ NiceAdvancedTextFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
|
|
|
3686
3809
|
useExisting: forwardRef(() => NiceAdvancedTextFilterComponent),
|
|
3687
3810
|
multi: true
|
|
3688
3811
|
}
|
|
3689
|
-
], usesInheritance: true, ngImport: i0, template: "<mat-form-field appearance=\"outline\" class=\"flex-auto\">\n <input matInput [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\" [mask]=\"(filterConfig?.mask) || ''\" [validation]=\"false\" type=\"text\" />\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$2.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: "directive", type: i4
|
|
3812
|
+
], usesInheritance: true, ngImport: i0, template: "<mat-form-field appearance=\"outline\" class=\"flex-auto\">\n <input matInput [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\" [mask]=\"(filterConfig?.mask) || ''\" [validation]=\"false\" type=\"text\" />\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$2.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: "directive", type: i4.NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "triggerOnMaskChange"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
3690
3813
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAdvancedTextFilterComponent, decorators: [{
|
|
3691
3814
|
type: Component,
|
|
3692
3815
|
args: [{ selector: "nice-advanced-text-filter", encapsulation: ViewEncapsulation.None, providers: [
|
|
@@ -3733,7 +3856,7 @@ class NiceAdvancedRuleComponent {
|
|
|
3733
3856
|
}
|
|
3734
3857
|
}
|
|
3735
3858
|
NiceAdvancedRuleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAdvancedRuleComponent, deps: [{ token: ADVANCED_FILTER_ICONS, optional: true }, { token: i1$1.FormGroupName }], target: i0.ɵɵFactoryTarget.Component });
|
|
3736
|
-
NiceAdvancedRuleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceAdvancedRuleComponent, selector: "nice-advanced-rule", inputs: { filterConfigs: "filterConfigs" }, outputs: { remove: "remove" }, ngImport: i0, template: "<div class=\"flex flex-row gap-4\" [formGroup]=\"formGroup\">\n <div class=\"basis-80\">\n <button\n class=\"select-filter w-full\"\n mat-stroked-button\n niceAdvancedFiltersTrigger\n originX=\"start\"\n (advancedFilterSelected)=\"onUpdateFilterConfig($event)\"\n >\n <div class=\"flex flex-row justify-between items-center w-full\">\n <div class=\"config-name\">{{ filterConfig?.name }}</div>\n <mat-icon [svgIcon]=\"icons.arrowDown.svgIcon\">{{ icons.arrowDown.matIcon }}</mat-icon>\n </div>\n </button>\n </div>\n\n <div class=\"flex flex-col basis-44 gap-4\">\n <mat-form-field appearance=\"outline\" class=\"rule-form-field\">\n <mat-select class=\"rule-operator\" formControlName=\"operation\">\n <mat-option *ngFor=\"let operator of filterConfig?.operators\" [value]=\"operator.id\">\n {{ operator?.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n\n <ng-container *ngIf=\"valuesFormArray.controls.length > 1\">\n <mat-button-toggle-group class=\"condition-toggle\" formControlName=\"condition\">\n <mat-button-toggle value=\"and\">{{ \"components.nice_advanced_filters.rule.conditions.and\" | translate }}</mat-button-toggle>\n <mat-button-toggle value=\"or\">{{ \"components.nice_advanced_filters.rule.conditions.or\" | translate }}</mat-button-toggle>\n </mat-button-toggle-group>\n </ng-container>\n </div>\n\n <div class=\"flex flex-col flex-auto gap-4\" formArrayName=\"values\">\n <div class=\"flex items-center gap-4\" [formGroupName]=\"i\" *ngFor=\"let _ of valuesFormArray.controls; let i = index\">\n <div class=\"rule-container flex flex-col md:flex-row flex-auto justify-start items-center gap-2.5\">\n <ng-container *ngIf=\"isSingleInput$ | async\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-advanced-text-filter *ngSwitchCase=\"'text'\" class=\"flex flex-auto\" formControlName=\"value\" [filterConfig]=\"filterConfig\"></nice-advanced-text-filter>\n <nice-advanced-number-filter *ngSwitchCase=\"'number'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-advanced-number-filter>\n <nice-advanced-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-radio-filter>\n <nice-advanced-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-select-filter>\n <nice-advanced-date-filter *ngSwitchCase=\"'date'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-advanced-date-filter>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"isDoubleInput$ | async\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-advanced-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-advanced-text-filter>\n <nice-advanced-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-advanced-number-filter>\n <nice-advanced-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-radio-filter>\n <nice-advanced-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-select-filter>\n <nice-advanced-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-advanced-date-filter>\n </ng-container>\n <h3 class=\"aligned-text\">\n {{ \"components.nice_advanced_filters.rule.conditions.and\" | translate }}\n </h3>\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-advanced-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-advanced-text-filter>\n <nice-advanced-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-advanced-number-filter>\n <nice-advanced-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-radio-filter>\n <nice-advanced-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-select-filter>\n <nice-advanced-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-advanced-date-filter>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"basis-12\">\n <button class=\"add-button\" mat-icon-button (click)=\"addValue(i + 1)\">\n <mat-icon [svgIcon]=\"icons.add.svgIcon\">{{ icons.add.matIcon }}</mat-icon>\n </button>\n </div>\n\n <div class=\"basis-12\">\n <button class=\"remove-button\" mat-icon-button (click)=\"removeValue(i)\">\n <mat-icon [svgIcon]=\"icons.delete.svgIcon\">{{ icons.delete.matIcon }}</mat-icon>\n </button>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i15.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: i8$1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i8$1.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "component", type: NiceAdvancedDateFilterComponent, selector: "nice-advanced-date-filter" }, { kind: "component", type: NiceAdvancedNumberFilterComponent, selector: "nice-advanced-number-filter" }, { kind: "component", type: NiceAdvancedRadioFilterComponent, selector: "nice-advanced-radio-filter", inputs: ["filterConfig"] }, { kind: "component", type: NiceAdvancedSelectFilterComponent, selector: "nice-advanced-select-filter", inputs: ["filterConfig"] }, { kind: "component", type: NiceAdvancedTextFilterComponent, selector: "nice-advanced-text-filter", inputs: ["filterConfig"] }, { kind: "directive", type: AdvancedFiltersTriggerDirective, selector: "[niceAdvancedFiltersTrigger]", inputs: ["position"], outputs: ["advancedFilterSelected"], exportAs: ["niceAdvancedFiltersTrigger"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
|
|
3859
|
+
NiceAdvancedRuleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceAdvancedRuleComponent, selector: "nice-advanced-rule", inputs: { filterConfigs: "filterConfigs" }, outputs: { remove: "remove" }, ngImport: i0, template: "<div class=\"flex flex-row gap-4\" [formGroup]=\"formGroup\">\n <div class=\"basis-80\">\n <button\n class=\"select-filter w-full\"\n mat-stroked-button\n niceAdvancedFiltersTrigger\n originX=\"start\"\n (advancedFilterSelected)=\"onUpdateFilterConfig($event)\"\n >\n <div class=\"flex flex-row justify-between items-center w-full\">\n <div class=\"config-name\">{{ filterConfig?.name }}</div>\n <mat-icon [svgIcon]=\"icons.arrowDown.svgIcon\">{{ icons.arrowDown.matIcon }}</mat-icon>\n </div>\n </button>\n </div>\n\n <div class=\"flex flex-col basis-44 gap-4\">\n <mat-form-field appearance=\"outline\" class=\"rule-form-field\">\n <mat-select class=\"rule-operator\" formControlName=\"operation\">\n <mat-option *ngFor=\"let operator of filterConfig?.operators\" [value]=\"operator.id\">\n {{ operator?.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n\n <ng-container *ngIf=\"valuesFormArray.controls.length > 1\">\n <mat-button-toggle-group class=\"condition-toggle\" formControlName=\"condition\">\n <mat-button-toggle value=\"and\">{{ \"components.nice_advanced_filters.rule.conditions.and\" | translate }}</mat-button-toggle>\n <mat-button-toggle value=\"or\">{{ \"components.nice_advanced_filters.rule.conditions.or\" | translate }}</mat-button-toggle>\n </mat-button-toggle-group>\n </ng-container>\n </div>\n\n <div class=\"flex flex-col flex-auto gap-4\" formArrayName=\"values\">\n <div class=\"flex items-center gap-4\" [formGroupName]=\"i\" *ngFor=\"let _ of valuesFormArray.controls; let i = index\">\n <div class=\"rule-container flex flex-col md:flex-row flex-auto justify-start items-center gap-2.5\">\n <ng-container *ngIf=\"isSingleInput$ | async\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-advanced-text-filter *ngSwitchCase=\"'text'\" class=\"flex flex-auto\" formControlName=\"value\" [filterConfig]=\"filterConfig\"></nice-advanced-text-filter>\n <nice-advanced-number-filter *ngSwitchCase=\"'number'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-advanced-number-filter>\n <nice-advanced-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-radio-filter>\n <nice-advanced-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-select-filter>\n <nice-advanced-date-filter *ngSwitchCase=\"'date'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-advanced-date-filter>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"isDoubleInput$ | async\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-advanced-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-advanced-text-filter>\n <nice-advanced-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-advanced-number-filter>\n <nice-advanced-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-radio-filter>\n <nice-advanced-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-select-filter>\n <nice-advanced-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-advanced-date-filter>\n </ng-container>\n <h3 class=\"aligned-text\">\n {{ \"components.nice_advanced_filters.rule.conditions.and\" | translate }}\n </h3>\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-advanced-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-advanced-text-filter>\n <nice-advanced-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-advanced-number-filter>\n <nice-advanced-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-radio-filter>\n <nice-advanced-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-select-filter>\n <nice-advanced-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-advanced-date-filter>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"basis-12\">\n <button class=\"add-button\" mat-icon-button (click)=\"addValue(i + 1)\">\n <mat-icon [svgIcon]=\"icons.add.svgIcon\">{{ icons.add.matIcon }}</mat-icon>\n </button>\n </div>\n\n <div class=\"basis-12\">\n <button class=\"remove-button\" mat-icon-button (click)=\"removeValue(i)\">\n <mat-icon [svgIcon]=\"icons.delete.svgIcon\">{{ icons.delete.matIcon }}</mat-icon>\n </button>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i15.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: i8$1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i8$1.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "component", type: NiceAdvancedDateFilterComponent, selector: "nice-advanced-date-filter" }, { kind: "component", type: NiceAdvancedNumberFilterComponent, selector: "nice-advanced-number-filter" }, { kind: "component", type: NiceAdvancedRadioFilterComponent, selector: "nice-advanced-radio-filter", inputs: ["filterConfig"] }, { kind: "component", type: NiceAdvancedSelectFilterComponent, selector: "nice-advanced-select-filter", inputs: ["filterConfig"] }, { kind: "component", type: NiceAdvancedTextFilterComponent, selector: "nice-advanced-text-filter", inputs: ["filterConfig"] }, { kind: "directive", type: AdvancedFiltersTriggerDirective, selector: "[niceAdvancedFiltersTrigger]", inputs: ["position"], outputs: ["advancedFilterSelected"], exportAs: ["niceAdvancedFiltersTrigger"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None });
|
|
3737
3860
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAdvancedRuleComponent, decorators: [{
|
|
3738
3861
|
type: Component,
|
|
3739
3862
|
args: [{ selector: "nice-advanced-rule", encapsulation: ViewEncapsulation.None, template: "<div class=\"flex flex-row gap-4\" [formGroup]=\"formGroup\">\n <div class=\"basis-80\">\n <button\n class=\"select-filter w-full\"\n mat-stroked-button\n niceAdvancedFiltersTrigger\n originX=\"start\"\n (advancedFilterSelected)=\"onUpdateFilterConfig($event)\"\n >\n <div class=\"flex flex-row justify-between items-center w-full\">\n <div class=\"config-name\">{{ filterConfig?.name }}</div>\n <mat-icon [svgIcon]=\"icons.arrowDown.svgIcon\">{{ icons.arrowDown.matIcon }}</mat-icon>\n </div>\n </button>\n </div>\n\n <div class=\"flex flex-col basis-44 gap-4\">\n <mat-form-field appearance=\"outline\" class=\"rule-form-field\">\n <mat-select class=\"rule-operator\" formControlName=\"operation\">\n <mat-option *ngFor=\"let operator of filterConfig?.operators\" [value]=\"operator.id\">\n {{ operator?.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n\n <ng-container *ngIf=\"valuesFormArray.controls.length > 1\">\n <mat-button-toggle-group class=\"condition-toggle\" formControlName=\"condition\">\n <mat-button-toggle value=\"and\">{{ \"components.nice_advanced_filters.rule.conditions.and\" | translate }}</mat-button-toggle>\n <mat-button-toggle value=\"or\">{{ \"components.nice_advanced_filters.rule.conditions.or\" | translate }}</mat-button-toggle>\n </mat-button-toggle-group>\n </ng-container>\n </div>\n\n <div class=\"flex flex-col flex-auto gap-4\" formArrayName=\"values\">\n <div class=\"flex items-center gap-4\" [formGroupName]=\"i\" *ngFor=\"let _ of valuesFormArray.controls; let i = index\">\n <div class=\"rule-container flex flex-col md:flex-row flex-auto justify-start items-center gap-2.5\">\n <ng-container *ngIf=\"isSingleInput$ | async\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-advanced-text-filter *ngSwitchCase=\"'text'\" class=\"flex flex-auto\" formControlName=\"value\" [filterConfig]=\"filterConfig\"></nice-advanced-text-filter>\n <nice-advanced-number-filter *ngSwitchCase=\"'number'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-advanced-number-filter>\n <nice-advanced-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-radio-filter>\n <nice-advanced-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-select-filter>\n <nice-advanced-date-filter *ngSwitchCase=\"'date'\" class=\"flex flex-auto\" formControlName=\"value\"></nice-advanced-date-filter>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"isDoubleInput$ | async\">\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-advanced-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-advanced-text-filter>\n <nice-advanced-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-advanced-number-filter>\n <nice-advanced-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-radio-filter>\n <nice-advanced-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-select-filter>\n <nice-advanced-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n ></nice-advanced-date-filter>\n </ng-container>\n <h3 class=\"aligned-text\">\n {{ \"components.nice_advanced_filters.rule.conditions.and\" | translate }}\n </h3>\n <ng-container [ngSwitch]=\"filterConfig?.type\">\n <nice-advanced-text-filter\n *ngSwitchCase=\"'text'\"\n [filterConfig]=\"filterConfig\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-advanced-text-filter>\n <nice-advanced-number-filter\n *ngSwitchCase=\"'number'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-advanced-number-filter>\n <nice-advanced-radio-filter\n *ngSwitchCase=\"'radio'\"\n class=\"flex flex-auto mb-4\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-radio-filter>\n <nice-advanced-select-filter\n *ngSwitchCase=\"'select'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-select-filter>\n <nice-advanced-date-filter\n *ngSwitchCase=\"'date'\"\n class=\"flex flex-auto\"\n formControlName=\"secondValue\"\n ></nice-advanced-date-filter>\n </ng-container>\n </ng-container>\n </div>\n\n <div class=\"basis-12\">\n <button class=\"add-button\" mat-icon-button (click)=\"addValue(i + 1)\">\n <mat-icon [svgIcon]=\"icons.add.svgIcon\">{{ icons.add.matIcon }}</mat-icon>\n </button>\n </div>\n\n <div class=\"basis-12\">\n <button class=\"remove-button\" mat-icon-button (click)=\"removeValue(i)\">\n <mat-icon [svgIcon]=\"icons.delete.svgIcon\">{{ icons.delete.matIcon }}</mat-icon>\n </button>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
@@ -3794,7 +3917,7 @@ NiceAdvancedFiltersComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14
|
|
|
3794
3917
|
useClass: AdvancedFiltersAsyncTypeaheadProvider,
|
|
3795
3918
|
multi: true
|
|
3796
3919
|
}
|
|
3797
|
-
], ngImport: i0, template: "<div class=\"flex flex-col gap-4\" [formGroup]=\"formGroup\">\n <div class=\"advanced-filter-title\">{{ \"components.nice_advanced_filters.title\" | translate }}</div>\n\n <div class=\"flex flex-row gap-12\">\n <div class=\"advanced-filter-condition\">{{ \"components.nice_advanced_filters.conditions.should_match\" | translate }}</div>\n\n <mat-radio-group formControlName=\"condition\">\n <mat-radio-button value=\"and\"><span class=\"ml-4 mr-8\">{{ \"components.nice_advanced_filters.conditions.every\" | translate }}</span></mat-radio-button>\n <mat-radio-button value=\"or\"><span class=\"ml-4 mr-8\">{{ \"components.nice_advanced_filters.conditions.some\" | translate }}</span></mat-radio-button>\n </mat-radio-group>\n </div>\n\n <div class=\"flex flex-col gap-4\" formArrayName=\"rules\" *ngFor=\"let _ of rulesFormArray.controls; let i = index\">\n <nice-advanced-rule [filterConfigs]=\"config$ | async\" [formGroupName]=\"i\" (remove)=\"onClickDeleteRule(i)\"></nice-advanced-rule>\n </div>\n\n <div>\n <button class=\"add-condition\" mat-stroked-button color=\"accent\" niceAdvancedFiltersTrigger position=\"topRight\" (advancedFilterSelected)=\"onClickAddRule($event)\">\n <div class=\"flex items-center gap-4\">\n <mat-icon [svgIcon]=\"icons.add.svgIcon\">{{ icons.add.matIcon }}</mat-icon>\n\n <div>{{ \"components.nice_advanced_filters.add_condition\" | translate }}</div>\n </div>\n </button>\n </div>\n\n <div class=\"flex gap-6 justify-end pt-4\">\n <button class=\"close-button\" mat-button color=\"accent\" (click)=\"onClose()\">\n <div class=\"flex items-center gap-4\">\n <mat-icon [svgIcon]=\"icons.close.svgIcon\">{{ icons.close.matIcon }}</mat-icon>\n\n <div>{{ \"components.nice_advanced_filters.close\" | translate }}</div>\n </div>\n </button>\n\n <button class=\"refresh-button\" mat-flat-button color=\"accent\" (click)=\"onRefresh()\">\n <div class=\"flex items-center gap-4\">\n <mat-icon [svgIcon]=\"icons.refresh.svgIcon\">{{ icons.refresh.matIcon }}</mat-icon>\n\n <div>{{ \"components.nice_advanced_filters.refresh\" | translate }}</div>\n </div>\n </button>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i3$3.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$3.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "component", type:
|
|
3920
|
+
], ngImport: i0, template: "<div class=\"flex flex-col gap-4\" [formGroup]=\"formGroup\">\n <div class=\"advanced-filter-title\">{{ \"components.nice_advanced_filters.title\" | translate }}</div>\n\n <div class=\"flex flex-row gap-12\">\n <div class=\"advanced-filter-condition\">{{ \"components.nice_advanced_filters.conditions.should_match\" | translate }}</div>\n\n <mat-radio-group formControlName=\"condition\">\n <mat-radio-button value=\"and\"><span class=\"ml-4 mr-8\">{{ \"components.nice_advanced_filters.conditions.every\" | translate }}</span></mat-radio-button>\n <mat-radio-button value=\"or\"><span class=\"ml-4 mr-8\">{{ \"components.nice_advanced_filters.conditions.some\" | translate }}</span></mat-radio-button>\n </mat-radio-group>\n </div>\n\n <div class=\"flex flex-col gap-4\" formArrayName=\"rules\" *ngFor=\"let _ of rulesFormArray.controls; let i = index\">\n <nice-advanced-rule [filterConfigs]=\"config$ | async\" [formGroupName]=\"i\" (remove)=\"onClickDeleteRule(i)\"></nice-advanced-rule>\n </div>\n\n <div>\n <button class=\"add-condition\" mat-stroked-button color=\"accent\" niceAdvancedFiltersTrigger position=\"topRight\" (advancedFilterSelected)=\"onClickAddRule($event)\">\n <div class=\"flex items-center gap-4\">\n <mat-icon [svgIcon]=\"icons.add.svgIcon\">{{ icons.add.matIcon }}</mat-icon>\n\n <div>{{ \"components.nice_advanced_filters.add_condition\" | translate }}</div>\n </div>\n </button>\n </div>\n\n <div class=\"flex gap-6 justify-end pt-4\">\n <button class=\"close-button\" mat-button color=\"accent\" (click)=\"onClose()\">\n <div class=\"flex items-center gap-4\">\n <mat-icon [svgIcon]=\"icons.close.svgIcon\">{{ icons.close.matIcon }}</mat-icon>\n\n <div>{{ \"components.nice_advanced_filters.close\" | translate }}</div>\n </div>\n </button>\n\n <button class=\"refresh-button\" mat-flat-button color=\"accent\" (click)=\"onRefresh()\">\n <div class=\"flex items-center gap-4\">\n <mat-icon [svgIcon]=\"icons.refresh.svgIcon\">{{ icons.refresh.matIcon }}</mat-icon>\n\n <div>{{ \"components.nice_advanced_filters.refresh\" | translate }}</div>\n </div>\n </button>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i3$3.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$3.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: NiceAdvancedRuleComponent, selector: "nice-advanced-rule", inputs: ["filterConfigs"], outputs: ["remove"] }, { kind: "directive", type: AdvancedFiltersTriggerDirective, selector: "[niceAdvancedFiltersTrigger]", inputs: ["position"], outputs: ["advancedFilterSelected"], exportAs: ["niceAdvancedFiltersTrigger"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3798
3921
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAdvancedFiltersComponent, decorators: [{
|
|
3799
3922
|
type: Component,
|
|
3800
3923
|
args: [{ selector: "nice-advanced-filters", encapsulation: ViewEncapsulation.None, providers: [
|
|
@@ -3977,929 +4100,706 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
3977
4100
|
args: [NiceFilterDataDirective, { read: TemplateRef }]
|
|
3978
4101
|
}] } });
|
|
3979
4102
|
|
|
3980
|
-
|
|
3981
|
-
|
|
3982
|
-
|
|
3983
|
-
|
|
3984
|
-
|
|
3985
|
-
this.service = service;
|
|
3986
|
-
this.bottomSheet = bottomSheet;
|
|
3987
|
-
this.customExport = [];
|
|
3988
|
-
this.downloadFileName = "data";
|
|
3989
|
-
this.canPrint = true;
|
|
3990
|
-
this.loading$ = this.query.selectLoading();
|
|
4103
|
+
const NICE_PRELOAD_SELECTED_ENTITIES_PROVIDER = new InjectionToken("nice_preload_selected_entities_provider");
|
|
4104
|
+
|
|
4105
|
+
class NiceSelectableListStateQuery extends QueryEntity {
|
|
4106
|
+
constructor(store) {
|
|
4107
|
+
super(store);
|
|
3991
4108
|
}
|
|
3992
|
-
|
|
3993
|
-
|
|
3994
|
-
|
|
3995
|
-
|
|
3996
|
-
|
|
3997
|
-
|
|
3998
|
-
|
|
3999
|
-
}
|
|
4000
|
-
|
|
4001
|
-
|
|
4002
|
-
type: "csv",
|
|
4003
|
-
onClickExport: () => this.clickCsv()
|
|
4004
|
-
});
|
|
4005
|
-
}
|
|
4006
|
-
if (this.exportsSettings.pdf) {
|
|
4007
|
-
exports.push({
|
|
4008
|
-
type: "pdf",
|
|
4009
|
-
onClickExport: () => this.clickPdf()
|
|
4010
|
-
});
|
|
4011
|
-
}
|
|
4012
|
-
this.bottomSheet.open(ExportBottomSheetComponent, {
|
|
4013
|
-
data: {
|
|
4014
|
-
exportStrategies: [
|
|
4015
|
-
...exports,
|
|
4016
|
-
...this.customExport
|
|
4017
|
-
]
|
|
4109
|
+
selectActiveViewIndex() {
|
|
4110
|
+
return this.select(({ ids, active }) => {
|
|
4111
|
+
const index = ids.indexOf(active);
|
|
4112
|
+
return index + 1;
|
|
4113
|
+
});
|
|
4114
|
+
}
|
|
4115
|
+
selectFirstActive() {
|
|
4116
|
+
return this.select(({ ids, active }) => {
|
|
4117
|
+
if (!ids.length) {
|
|
4118
|
+
return true;
|
|
4018
4119
|
}
|
|
4120
|
+
return ids[0] === active;
|
|
4019
4121
|
});
|
|
4020
4122
|
}
|
|
4021
|
-
|
|
4022
|
-
this.
|
|
4123
|
+
selectLastActive() {
|
|
4124
|
+
return this.select(({ ids, active }) => {
|
|
4125
|
+
if (!ids.length) {
|
|
4126
|
+
return true;
|
|
4127
|
+
}
|
|
4128
|
+
return ids[ids.length - 1] === active;
|
|
4129
|
+
});
|
|
4023
4130
|
}
|
|
4024
|
-
|
|
4025
|
-
|
|
4131
|
+
}
|
|
4132
|
+
|
|
4133
|
+
class NiceSelectableListStateService {
|
|
4134
|
+
get idKey() {
|
|
4135
|
+
return this.options?.idKey ?? "id";
|
|
4026
4136
|
}
|
|
4027
|
-
|
|
4028
|
-
this.
|
|
4137
|
+
get preloadedWindow() {
|
|
4138
|
+
return this.options?.preloadWindow ?? 2;
|
|
4029
4139
|
}
|
|
4030
|
-
|
|
4031
|
-
this.
|
|
4140
|
+
get queryParamsDisabled() {
|
|
4141
|
+
return this.options?.disableQueryParams ?? false;
|
|
4032
4142
|
}
|
|
4033
|
-
|
|
4034
|
-
|
|
4035
|
-
|
|
4036
|
-
|
|
4037
|
-
|
|
4038
|
-
|
|
4039
|
-
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
4040
|
-
type: Inject,
|
|
4041
|
-
args: [FILTER_VIEW_ICONS]
|
|
4042
|
-
}] }, { type: undefined, decorators: [{
|
|
4043
|
-
type: Inject,
|
|
4044
|
-
args: [EXPORTS_SETTINGS]
|
|
4045
|
-
}] }, { type: NiceFilterViewQuery }, { type: NiceFilterViewService }, { type: i3$4.MatBottomSheet }]; }, propDecorators: { customExport: [{
|
|
4046
|
-
type: Input
|
|
4047
|
-
}], downloadFileName: [{
|
|
4048
|
-
type: Input
|
|
4049
|
-
}], canPrint: [{
|
|
4050
|
-
type: Input
|
|
4051
|
-
}] } });
|
|
4052
|
-
|
|
4053
|
-
class NiceFilterExportDirective {
|
|
4054
|
-
constructor(service) {
|
|
4055
|
-
this.service = service;
|
|
4056
|
-
this.downloadFileName = "data";
|
|
4143
|
+
constructor(store, route, router, preloadService, options) {
|
|
4144
|
+
this.store = store;
|
|
4145
|
+
this.route = route;
|
|
4146
|
+
this.router = router;
|
|
4147
|
+
this.preloadService = preloadService;
|
|
4148
|
+
this.options = options;
|
|
4057
4149
|
}
|
|
4058
|
-
|
|
4059
|
-
this.
|
|
4150
|
+
setActive(entity) {
|
|
4151
|
+
this.store.setActive(entity[this.idKey]);
|
|
4060
4152
|
}
|
|
4061
|
-
|
|
4062
|
-
|
|
4063
|
-
|
|
4064
|
-
|
|
4065
|
-
type: Directive,
|
|
4066
|
-
args: [{ selector: "[niceFilterExport]" }]
|
|
4067
|
-
}], ctorParameters: function () { return [{ type: NiceFilterViewService }]; }, propDecorators: { type: [{
|
|
4068
|
-
type: Input
|
|
4069
|
-
}], downloadFileName: [{
|
|
4070
|
-
type: Input
|
|
4071
|
-
}], onClick: [{
|
|
4072
|
-
type: HostListener,
|
|
4073
|
-
args: ["click"]
|
|
4074
|
-
}] } });
|
|
4075
|
-
|
|
4076
|
-
class NiceFilterInfiniteScrollDataViewComponent {
|
|
4077
|
-
constructor(query, service) {
|
|
4078
|
-
this.query = query;
|
|
4079
|
-
this.service = service;
|
|
4080
|
-
this.data$ = this.query.selectAll();
|
|
4153
|
+
getIndex(identifier) {
|
|
4154
|
+
const { ids } = this.store.getValue();
|
|
4155
|
+
const index = ids.indexOf(identifier);
|
|
4156
|
+
return index + 1;
|
|
4081
4157
|
}
|
|
4082
|
-
async
|
|
4083
|
-
|
|
4084
|
-
|
|
4085
|
-
|
|
4086
|
-
|
|
4158
|
+
async selectAll(options) {
|
|
4159
|
+
if (!this.preloadService) {
|
|
4160
|
+
return this.store.update({
|
|
4161
|
+
allSelected: true
|
|
4162
|
+
});
|
|
4087
4163
|
}
|
|
4088
|
-
this.
|
|
4089
|
-
|
|
4090
|
-
|
|
4164
|
+
const ids = await this.preloadService.loadAllEntities(options);
|
|
4165
|
+
this.store.set(ids.map((id) => ({
|
|
4166
|
+
[this.idKey]: id,
|
|
4167
|
+
loaded: false
|
|
4168
|
+
})));
|
|
4169
|
+
return this.store.update({
|
|
4170
|
+
allSelected: true
|
|
4091
4171
|
});
|
|
4092
|
-
this.service.filter();
|
|
4093
|
-
}
|
|
4094
|
-
}
|
|
4095
|
-
NiceFilterInfiniteScrollDataViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterInfiniteScrollDataViewComponent, deps: [{ token: NiceFilterViewQuery }, { token: NiceFilterViewService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4096
|
-
NiceFilterInfiniteScrollDataViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterInfiniteScrollDataViewComponent, selector: "nice-filter-infinite-scroll-data-view, div[nice-filter-infinite-scroll-data-view]", queries: [{ propertyName: "content", first: true, predicate: NiceFilterDataDirective, descendants: true, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"content\">\n <ng-container *ngTemplateOutlet=\"content; context: { $implicit: data$ | async }\"></ng-container>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
|
|
4097
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterInfiniteScrollDataViewComponent, decorators: [{
|
|
4098
|
-
type: Component,
|
|
4099
|
-
args: [{ selector: "nice-filter-infinite-scroll-data-view, div[nice-filter-infinite-scroll-data-view]", encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"content\">\n <ng-container *ngTemplateOutlet=\"content; context: { $implicit: data$ | async }\"></ng-container>\n</ng-container>\n" }]
|
|
4100
|
-
}], ctorParameters: function () { return [{ type: NiceFilterViewQuery }, { type: NiceFilterViewService }]; }, propDecorators: { content: [{
|
|
4101
|
-
type: ContentChild,
|
|
4102
|
-
args: [NiceFilterDataDirective, { read: TemplateRef }]
|
|
4103
|
-
}] } });
|
|
4104
|
-
|
|
4105
|
-
class NiceFilterSearchComponent {
|
|
4106
|
-
constructor(icons, query, service) {
|
|
4107
|
-
this.icons = icons;
|
|
4108
|
-
this.query = query;
|
|
4109
|
-
this.service = service;
|
|
4110
|
-
this.appearance = "default";
|
|
4111
|
-
this.searchQuery$ = this.query.selectFilterParameters().pipe(map(f => f.search));
|
|
4112
|
-
this.unsubscribeAll$ = new Subject();
|
|
4113
|
-
this.searchText$ = new Subject();
|
|
4114
4172
|
}
|
|
4115
|
-
|
|
4116
|
-
this.
|
|
4117
|
-
|
|
4118
|
-
|
|
4119
|
-
|
|
4120
|
-
|
|
4121
|
-
|
|
4122
|
-
|
|
4123
|
-
|
|
4124
|
-
|
|
4125
|
-
|
|
4173
|
+
async select(id) {
|
|
4174
|
+
this.store.update((state) => ({
|
|
4175
|
+
unselectedEntity: arrayRemove(state.unselectedEntity, id)
|
|
4176
|
+
}));
|
|
4177
|
+
this.store.add({
|
|
4178
|
+
[this.idKey]: id,
|
|
4179
|
+
loaded: false
|
|
4180
|
+
});
|
|
4181
|
+
if (this.preloadService) {
|
|
4182
|
+
const entity = await this.preloadService.loadEntityById(id);
|
|
4183
|
+
this.store.upsert(id, {
|
|
4184
|
+
...entity,
|
|
4185
|
+
loaded: true
|
|
4126
4186
|
});
|
|
4127
|
-
|
|
4128
|
-
}))
|
|
4129
|
-
.subscribe();
|
|
4187
|
+
}
|
|
4130
4188
|
}
|
|
4131
|
-
|
|
4132
|
-
this.
|
|
4133
|
-
|
|
4189
|
+
async selectMany(ids, active) {
|
|
4190
|
+
this.store.add(ids.map((id) => ({
|
|
4191
|
+
[this.idKey]: id,
|
|
4192
|
+
loaded: false
|
|
4193
|
+
})));
|
|
4194
|
+
if (active) {
|
|
4195
|
+
this.store.setActive(active);
|
|
4196
|
+
await this.loadEntities(true);
|
|
4197
|
+
}
|
|
4134
4198
|
}
|
|
4135
|
-
|
|
4136
|
-
this.
|
|
4199
|
+
async selectEntity(entity) {
|
|
4200
|
+
this.store.update((state) => ({
|
|
4201
|
+
unselectedEntity: arrayRemove(state.unselectedEntity, entity[this.idKey])
|
|
4202
|
+
}));
|
|
4203
|
+
this.store.upsert(entity[this.idKey], { ...entity, loaded: true });
|
|
4204
|
+
if (this.preloadService) {
|
|
4205
|
+
const preloadedEntity = await this.preloadService.reloadEntity(entity);
|
|
4206
|
+
this.store.upsert(preloadedEntity[this.idKey], { ...preloadedEntity, loaded: true });
|
|
4207
|
+
}
|
|
4137
4208
|
}
|
|
4138
|
-
|
|
4139
|
-
|
|
4140
|
-
|
|
4141
|
-
|
|
4142
|
-
|
|
4143
|
-
|
|
4144
|
-
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
4145
|
-
type: Inject,
|
|
4146
|
-
args: [FILTER_VIEW_ICONS]
|
|
4147
|
-
}] }, { type: NiceFilterViewQuery }, { type: NiceFilterViewService }]; }, propDecorators: { appearance: [{
|
|
4148
|
-
type: Input
|
|
4149
|
-
}] } });
|
|
4150
|
-
|
|
4151
|
-
class NiceFilterMatPaginatorPaginationDirective {
|
|
4152
|
-
constructor(query, service, paginator) {
|
|
4153
|
-
this.query = query;
|
|
4154
|
-
this.service = service;
|
|
4155
|
-
this.paginator = paginator;
|
|
4156
|
-
this.unsubscribeAll$ = new Subject();
|
|
4209
|
+
async selectManyEntities(entities) {
|
|
4210
|
+
if (!this.preloadService) {
|
|
4211
|
+
return this.store.upsertMany(entities.map((entity) => ({ ...entity, loaded: true })));
|
|
4212
|
+
}
|
|
4213
|
+
const preloadedEntities = await this.preloadService.reloadEntities(entities);
|
|
4214
|
+
this.store.upsertMany(preloadedEntities.map((preloadedEntity) => ({ ...preloadedEntity, loaded: true })));
|
|
4157
4215
|
}
|
|
4158
|
-
|
|
4159
|
-
this.
|
|
4160
|
-
|
|
4161
|
-
|
|
4162
|
-
|
|
4163
|
-
const { page, total } = res;
|
|
4164
|
-
this.paginator.pageIndex = page.number;
|
|
4165
|
-
this.paginator.pageSize = page.size;
|
|
4166
|
-
this.paginator.length = total;
|
|
4167
|
-
});
|
|
4168
|
-
this.paginator.page.pipe(takeUntil(this.unsubscribeAll$)).subscribe((page) => {
|
|
4169
|
-
const { filterParameters } = this.query.getValue();
|
|
4170
|
-
this.service.setParameters({
|
|
4171
|
-
...filterParameters,
|
|
4172
|
-
start: page.pageIndex * page.pageSize,
|
|
4173
|
-
length: page.pageSize
|
|
4174
|
-
});
|
|
4175
|
-
this.service.filter();
|
|
4216
|
+
unselectAll() {
|
|
4217
|
+
this.store.set([]);
|
|
4218
|
+
return this.store.update({
|
|
4219
|
+
allSelected: false,
|
|
4220
|
+
unselectedEntity: []
|
|
4176
4221
|
});
|
|
4177
4222
|
}
|
|
4178
|
-
|
|
4179
|
-
this.
|
|
4180
|
-
|
|
4223
|
+
unselect(id) {
|
|
4224
|
+
this.store.update((state) => ({
|
|
4225
|
+
unselectedEntity: arrayAdd(state.unselectedEntity, id)
|
|
4226
|
+
}));
|
|
4227
|
+
this.store.remove(id);
|
|
4181
4228
|
}
|
|
4182
|
-
|
|
4183
|
-
|
|
4184
|
-
|
|
4185
|
-
|
|
4186
|
-
|
|
4187
|
-
args: [{ selector: "mat-paginator[niceFilterPagination]" }]
|
|
4188
|
-
}], ctorParameters: function () { return [{ type: NiceFilterViewQuery }, { type: NiceFilterViewService }, { type: i12.MatPaginator }]; } });
|
|
4189
|
-
|
|
4190
|
-
class NiceFilterMatSortSortingDirective {
|
|
4191
|
-
constructor(query, service, sort) {
|
|
4192
|
-
this.query = query;
|
|
4193
|
-
this.service = service;
|
|
4194
|
-
this.sort = sort;
|
|
4195
|
-
this.unsubscribeAll$ = new Subject();
|
|
4229
|
+
unselectEntity(entity) {
|
|
4230
|
+
this.store.update((state) => ({
|
|
4231
|
+
unselectedEntity: arrayAdd(state.unselectedEntity, entity[this.idKey])
|
|
4232
|
+
}));
|
|
4233
|
+
this.store.remove(entity[this.idKey]);
|
|
4196
4234
|
}
|
|
4197
|
-
|
|
4198
|
-
this.
|
|
4199
|
-
if (!res) {
|
|
4200
|
-
return;
|
|
4201
|
-
}
|
|
4202
|
-
const { order } = res;
|
|
4203
|
-
if (!order) {
|
|
4204
|
-
return;
|
|
4205
|
-
}
|
|
4206
|
-
this.sort.direction = order.direction;
|
|
4207
|
-
this.sort.active = order.column;
|
|
4208
|
-
});
|
|
4209
|
-
this.sort.sortChange.pipe(takeUntil(this.unsubscribeAll$)).subscribe((sort) => {
|
|
4210
|
-
const { filterParameters } = this.query.getValue();
|
|
4211
|
-
if (!sort.direction) {
|
|
4212
|
-
const { order, ...values } = filterParameters;
|
|
4213
|
-
this.service.setParameters({
|
|
4214
|
-
...values,
|
|
4215
|
-
order: {}
|
|
4216
|
-
});
|
|
4217
|
-
}
|
|
4218
|
-
else {
|
|
4219
|
-
this.service.setParameters({
|
|
4220
|
-
...filterParameters,
|
|
4221
|
-
order: {
|
|
4222
|
-
column: sort.active,
|
|
4223
|
-
direction: sort.direction
|
|
4224
|
-
}
|
|
4225
|
-
});
|
|
4226
|
-
}
|
|
4227
|
-
this.service.filter();
|
|
4228
|
-
});
|
|
4235
|
+
unselectManyEntities(entities) {
|
|
4236
|
+
this.store.remove(entities.map((entity) => entity[this.idKey]));
|
|
4229
4237
|
}
|
|
4230
|
-
|
|
4231
|
-
this.
|
|
4232
|
-
this.unsubscribeAll$.complete();
|
|
4238
|
+
updateEntity(entity) {
|
|
4239
|
+
this.store.update(entity[this.idKey], entity);
|
|
4233
4240
|
}
|
|
4234
|
-
|
|
4235
|
-
|
|
4236
|
-
|
|
4237
|
-
|
|
4238
|
-
|
|
4239
|
-
|
|
4240
|
-
|
|
4241
|
-
|
|
4242
|
-
|
|
4243
|
-
|
|
4244
|
-
|
|
4245
|
-
|
|
4241
|
+
async setEntities(ids, activeId) {
|
|
4242
|
+
this.store.update({
|
|
4243
|
+
unselectedEntity: [],
|
|
4244
|
+
allSelected: false
|
|
4245
|
+
});
|
|
4246
|
+
this.store.set(ids.map((id) => ({
|
|
4247
|
+
[this.idKey]: id,
|
|
4248
|
+
loaded: false
|
|
4249
|
+
})));
|
|
4250
|
+
if (activeId) {
|
|
4251
|
+
this.store.setActive(activeId);
|
|
4252
|
+
}
|
|
4253
|
+
await this.loadEntities(true);
|
|
4246
4254
|
}
|
|
4247
|
-
|
|
4248
|
-
|
|
4255
|
+
async next() {
|
|
4256
|
+
const { ids, active } = this.store.getValue();
|
|
4257
|
+
const index = ids.indexOf(active);
|
|
4258
|
+
await this.loadActiveEntity(ids[index + 1], 1);
|
|
4249
4259
|
}
|
|
4250
|
-
|
|
4251
|
-
|
|
4252
|
-
|
|
4253
|
-
|
|
4254
|
-
type: Directive,
|
|
4255
|
-
args: [{ selector: "mat-table[niceFilterDataView]" }]
|
|
4256
|
-
}], ctorParameters: function () { return [{ type: NiceFilterViewQuery }, { type: i13.MatTable }]; } });
|
|
4257
|
-
|
|
4258
|
-
class NiceFilterQueryParamsDirective {
|
|
4259
|
-
get initialized() {
|
|
4260
|
-
return this._initialized;
|
|
4260
|
+
async previous() {
|
|
4261
|
+
const { ids, active } = this.store.getValue();
|
|
4262
|
+
const index = ids.indexOf(active);
|
|
4263
|
+
await this.loadActiveEntity(ids[index - 1], -1);
|
|
4261
4264
|
}
|
|
4262
|
-
|
|
4263
|
-
|
|
4264
|
-
this.
|
|
4265
|
-
this.route = route;
|
|
4266
|
-
this.router = router;
|
|
4267
|
-
this.init = new EventEmitter();
|
|
4268
|
-
this.unsubscribeAll$ = new Subject();
|
|
4269
|
-
this._initialized = false;
|
|
4265
|
+
async first() {
|
|
4266
|
+
const { ids } = this.store.getValue();
|
|
4267
|
+
await this.loadActiveEntity(ids[0], 1);
|
|
4270
4268
|
}
|
|
4271
|
-
|
|
4272
|
-
this.
|
|
4273
|
-
|
|
4274
|
-
});
|
|
4275
|
-
this.loadQueryParams();
|
|
4269
|
+
async last() {
|
|
4270
|
+
const { ids } = this.store.getValue();
|
|
4271
|
+
await this.loadActiveEntity(ids[ids.length - 1], -1);
|
|
4276
4272
|
}
|
|
4277
|
-
|
|
4278
|
-
this.
|
|
4279
|
-
|
|
4273
|
+
async removeActive() {
|
|
4274
|
+
const { active, ids } = this.store.getValue();
|
|
4275
|
+
const index = ids.indexOf(active);
|
|
4276
|
+
this.store.remove(active);
|
|
4277
|
+
if (index === (ids.length - 1)) {
|
|
4278
|
+
await this.loadActiveEntity(ids[index - 1], -1);
|
|
4279
|
+
}
|
|
4280
|
+
else {
|
|
4281
|
+
await this.loadActiveEntity(ids[index + 1], 1);
|
|
4282
|
+
}
|
|
4280
4283
|
}
|
|
4281
|
-
|
|
4282
|
-
|
|
4284
|
+
async loadActiveEntity(id, direction) {
|
|
4285
|
+
try {
|
|
4286
|
+
this.store.setActive(id);
|
|
4287
|
+
const { entities } = this.store.getValue();
|
|
4288
|
+
if (!entities[+id + direction * this.preloadedWindow]?.loaded) {
|
|
4289
|
+
await this.loadEntities(false);
|
|
4290
|
+
}
|
|
4291
|
+
}
|
|
4292
|
+
catch (e) {
|
|
4293
|
+
this.store.setError(e);
|
|
4294
|
+
}
|
|
4295
|
+
}
|
|
4296
|
+
async loadEntities(loadExtremity) {
|
|
4297
|
+
if (!this.preloadService) {
|
|
4283
4298
|
return;
|
|
4284
4299
|
}
|
|
4285
|
-
const
|
|
4286
|
-
|
|
4287
|
-
|
|
4288
|
-
delete params.start;
|
|
4289
|
-
delete params.length;
|
|
4300
|
+
const toLoad = this.getListIdToLoad(loadExtremity);
|
|
4301
|
+
if (!toLoad.length) {
|
|
4302
|
+
return;
|
|
4290
4303
|
}
|
|
4291
|
-
this.
|
|
4292
|
-
|
|
4293
|
-
queryParams: QueryParamsUtils.filterParametersToParamsMap(params),
|
|
4294
|
-
queryParamsHandling: "merge"
|
|
4295
|
-
});
|
|
4304
|
+
const entities = await this.preloadService.loadEntitiesById(toLoad);
|
|
4305
|
+
this.store.upsertMany(entities.map((entity) => ({ ...entity, loaded: true })));
|
|
4296
4306
|
}
|
|
4297
|
-
|
|
4298
|
-
|
|
4299
|
-
|
|
4300
|
-
|
|
4301
|
-
|
|
4302
|
-
|
|
4303
|
-
|
|
4304
|
-
|
|
4305
|
-
|
|
4306
|
-
|
|
4307
|
-
params: QueryParamsUtils.extractFilterParameters(params)
|
|
4308
|
-
};
|
|
4309
|
-
})).subscribe(({ params }) => {
|
|
4310
|
-
if (!QueryParamsUtils.hasFilterParameters(params) || Object.keys(params).length === 0) {
|
|
4311
|
-
params = { ...this.query.getValue().filterParameters };
|
|
4312
|
-
}
|
|
4313
|
-
const { filterParameters, filterResult } = this.query.getValue();
|
|
4314
|
-
if (FilterUtils.filterChangeNeedsRefresh(filterParameters, params) ||
|
|
4315
|
-
!filterResult) {
|
|
4316
|
-
this.service.setParameters({
|
|
4317
|
-
...params,
|
|
4318
|
-
fallbackOrder: filterParameters.fallbackOrder
|
|
4319
|
-
});
|
|
4320
|
-
}
|
|
4321
|
-
if (!this._initialized) {
|
|
4322
|
-
this._initialized = true;
|
|
4323
|
-
this.init.emit();
|
|
4307
|
+
getListIdToLoad(loadExtremity) {
|
|
4308
|
+
const { active, ids, entities } = this.store.getValue();
|
|
4309
|
+
const from = ids.indexOf(active) - this.preloadedWindow > 0 ? ids.indexOf(active) - this.preloadedWindow : 0;
|
|
4310
|
+
const to = ids.indexOf(active) + this.preloadedWindow < ids.length - 1
|
|
4311
|
+
? ids.indexOf(active) + this.preloadedWindow
|
|
4312
|
+
: ids.length - 1;
|
|
4313
|
+
const toLoad = [];
|
|
4314
|
+
if (loadExtremity) {
|
|
4315
|
+
if (ids.length <= 2) {
|
|
4316
|
+
return ids;
|
|
4324
4317
|
}
|
|
4325
|
-
|
|
4326
|
-
}
|
|
4327
|
-
}
|
|
4328
|
-
NiceFilterQueryParamsDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterQueryParamsDirective, deps: [{ token: NiceFilterViewQuery }, { token: NiceFilterViewService }, { token: i2.ActivatedRoute }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Directive });
|
|
4329
|
-
NiceFilterQueryParamsDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterQueryParamsDirective, selector: "nice-filter-view[niceFilterQueryParams]", outputs: { init: "init" }, ngImport: i0 });
|
|
4330
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterQueryParamsDirective, decorators: [{
|
|
4331
|
-
type: Directive,
|
|
4332
|
-
args: [{ selector: "nice-filter-view[niceFilterQueryParams]" }]
|
|
4333
|
-
}], ctorParameters: function () { return [{ type: NiceFilterViewQuery }, { type: NiceFilterViewService }, { type: i2.ActivatedRoute }, { type: i2.Router }]; }, propDecorators: { init: [{
|
|
4334
|
-
type: Output
|
|
4335
|
-
}] } });
|
|
4336
|
-
|
|
4337
|
-
class NiceFilterViewComponent {
|
|
4338
|
-
constructor(service) {
|
|
4339
|
-
this.service = service;
|
|
4340
|
-
this.queryParams = {};
|
|
4341
|
-
}
|
|
4342
|
-
ngOnChanges(changes) {
|
|
4343
|
-
if ("queryParams" in changes) {
|
|
4344
|
-
this.service.setQueryParams(this.queryParams);
|
|
4345
|
-
}
|
|
4346
|
-
}
|
|
4347
|
-
}
|
|
4348
|
-
NiceFilterViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewComponent, deps: [{ token: NiceFilterViewService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4349
|
-
NiceFilterViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterViewComponent, selector: "nice-filter-view", inputs: { queryParams: "queryParams" }, providers: [
|
|
4350
|
-
NiceFilterViewQuery,
|
|
4351
|
-
NiceFilterViewService,
|
|
4352
|
-
NiceFilterViewStore
|
|
4353
|
-
], usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], encapsulation: i0.ViewEncapsulation.None });
|
|
4354
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewComponent, decorators: [{
|
|
4355
|
-
type: Component,
|
|
4356
|
-
args: [{ selector: "nice-filter-view", encapsulation: ViewEncapsulation.None, providers: [
|
|
4357
|
-
NiceFilterViewQuery,
|
|
4358
|
-
NiceFilterViewService,
|
|
4359
|
-
NiceFilterViewStore
|
|
4360
|
-
], template: "<ng-content></ng-content>\n" }]
|
|
4361
|
-
}], ctorParameters: function () { return [{ type: NiceFilterViewService }]; }, propDecorators: { queryParams: [{
|
|
4362
|
-
type: Input
|
|
4363
|
-
}] } });
|
|
4364
|
-
|
|
4365
|
-
class NiceBaseFilterViewComponent {
|
|
4366
|
-
ngOnInit(autoLoad = true, { mode, loadConfig, configQueryParams } = {}) {
|
|
4367
|
-
if (mode) {
|
|
4368
|
-
this.filterViewService.setMode(mode);
|
|
4369
|
-
}
|
|
4370
|
-
this.autoLoad(autoLoad);
|
|
4371
|
-
this.loadConfig(loadConfig, configQueryParams);
|
|
4372
|
-
this.filterViewLoading$ = this.filterViewQuery.selectLoading();
|
|
4373
|
-
}
|
|
4374
|
-
/**
|
|
4375
|
-
* Call the filter endpoint with the current filter parameters.
|
|
4376
|
-
*/
|
|
4377
|
-
loadData() {
|
|
4378
|
-
this.filterViewService.filter();
|
|
4379
|
-
}
|
|
4380
|
-
/**
|
|
4381
|
-
* Disable the filter view. This will stop calling any api routes.
|
|
4382
|
-
*/
|
|
4383
|
-
disable() {
|
|
4384
|
-
this.filterViewService.disable();
|
|
4385
|
-
}
|
|
4386
|
-
/**
|
|
4387
|
-
* Enable the filter view. This will resume calling any api routes.
|
|
4388
|
-
*/
|
|
4389
|
-
enable() {
|
|
4390
|
-
this.filterViewService.enable();
|
|
4391
|
-
}
|
|
4392
|
-
/**
|
|
4393
|
-
* Update the loading state
|
|
4394
|
-
*/
|
|
4395
|
-
setLoading(loading) {
|
|
4396
|
-
this.filterViewService.setLoading(loading);
|
|
4397
|
-
}
|
|
4398
|
-
/**
|
|
4399
|
-
* Set a set of rules that won't be saved in the current filterParameters config.
|
|
4400
|
-
* NOTE: These rules will be injected in each filter request.
|
|
4401
|
-
*/
|
|
4402
|
-
setBaseRules(rule, reload = true) {
|
|
4403
|
-
this.filterViewService.setBaseRules(rule, reload);
|
|
4404
|
-
}
|
|
4405
|
-
/**
|
|
4406
|
-
* Reset all rules with a new set of rules.
|
|
4407
|
-
*/
|
|
4408
|
-
setRules(rules, reload = true) {
|
|
4409
|
-
this.filterViewService.setRules(rules);
|
|
4410
|
-
if (reload) {
|
|
4411
|
-
this.filterViewService.filter();
|
|
4412
|
-
}
|
|
4413
|
-
}
|
|
4414
|
-
/**
|
|
4415
|
-
* Add or update a rule.
|
|
4416
|
-
* NOTE: This will only check for rules in the first element of the rules array in the current filterParameters.
|
|
4417
|
-
*/
|
|
4418
|
-
upsertRule(id, newRule, reload = true) {
|
|
4419
|
-
this.filterViewService.upsertRule(id, newRule);
|
|
4420
|
-
if (reload) {
|
|
4421
|
-
this.filterViewService.filter();
|
|
4422
|
-
}
|
|
4423
|
-
}
|
|
4424
|
-
/**
|
|
4425
|
-
* Remove a rule.
|
|
4426
|
-
* NOTE: This will only check for rules in the first element of the rules array in the current filterParameters.
|
|
4427
|
-
*/
|
|
4428
|
-
removeRule(id, reload = true) {
|
|
4429
|
-
this.filterViewService.removeRule(id);
|
|
4430
|
-
if (reload) {
|
|
4431
|
-
this.filterViewService.filter();
|
|
4318
|
+
toLoad.push(ids[0], ids[ids.length - 1]);
|
|
4432
4319
|
}
|
|
4433
|
-
|
|
4434
|
-
|
|
4435
|
-
|
|
4436
|
-
if (!this.queryParams) {
|
|
4437
|
-
if (autoLoad && defaultAutoLoad) {
|
|
4438
|
-
this.filterViewService.filter();
|
|
4320
|
+
for (let i = from; i <= to; i++) {
|
|
4321
|
+
if (ids[i] === null || ids[0] === undefined) {
|
|
4322
|
+
continue;
|
|
4439
4323
|
}
|
|
4440
|
-
|
|
4441
|
-
|
|
4324
|
+
if (!toLoad.includes(ids[i]) && !entities[ids[i]]?.loaded) {
|
|
4325
|
+
toLoad.push(ids[i]);
|
|
4442
4326
|
}
|
|
4443
|
-
return;
|
|
4444
|
-
}
|
|
4445
|
-
if (!autoLoad && defaultAutoLoad) {
|
|
4446
|
-
this.filterViewService.setAutoLoad(autoLoad);
|
|
4447
|
-
return;
|
|
4448
|
-
}
|
|
4449
|
-
this.queryParams.init.pipe(take(1)).subscribe(() => this.loadData());
|
|
4450
|
-
}
|
|
4451
|
-
loadConfig(loadConfig, configQueryParams) {
|
|
4452
|
-
if (loadConfig === true) {
|
|
4453
|
-
this.filterViewService.loadConfig(configQueryParams);
|
|
4454
|
-
return;
|
|
4455
|
-
}
|
|
4456
|
-
if (loadConfig === false) {
|
|
4457
|
-
return;
|
|
4458
|
-
}
|
|
4459
|
-
if (this.advancedFiltersButton || this.advancedFilters) {
|
|
4460
|
-
this.filterViewService.loadConfig(configQueryParams);
|
|
4461
4327
|
}
|
|
4328
|
+
return toLoad;
|
|
4462
4329
|
}
|
|
4463
|
-
|
|
4464
|
-
|
|
4465
|
-
NiceBaseFilterViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceBaseFilterViewComponent, selector: "ng-component", viewQueries: [{ propertyName: "filterViewService", first: true, predicate: NiceFilterViewComponent, descendants: true, read: NiceFilterViewService, static: true }, { propertyName: "filterViewQuery", first: true, predicate: NiceFilterViewComponent, descendants: true, read: NiceFilterViewQuery, static: true }, { propertyName: "queryParams", first: true, predicate: NiceFilterQueryParamsDirective, descendants: true, static: true }, { propertyName: "advancedFiltersButton", first: true, predicate: NiceAdvancedFiltersButtonComponent, descendants: true, static: true }, { propertyName: "advancedFilters", first: true, predicate: NiceAdvancedFiltersComponent, descendants: true, static: true }], ngImport: i0, template: ``, isInline: true });
|
|
4466
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceBaseFilterViewComponent, decorators: [{
|
|
4467
|
-
type: Component,
|
|
4468
|
-
args: [{
|
|
4469
|
-
template: ``
|
|
4470
|
-
}]
|
|
4471
|
-
}], propDecorators: { filterViewService: [{
|
|
4472
|
-
type: ViewChild,
|
|
4473
|
-
args: [NiceFilterViewComponent, { read: NiceFilterViewService, static: true }]
|
|
4474
|
-
}], filterViewQuery: [{
|
|
4475
|
-
type: ViewChild,
|
|
4476
|
-
args: [NiceFilterViewComponent, { read: NiceFilterViewQuery, static: true }]
|
|
4477
|
-
}], queryParams: [{
|
|
4478
|
-
type: ViewChild,
|
|
4479
|
-
args: [NiceFilterQueryParamsDirective, { static: true }]
|
|
4480
|
-
}], advancedFiltersButton: [{
|
|
4481
|
-
type: ViewChild,
|
|
4482
|
-
args: [NiceAdvancedFiltersButtonComponent, { static: true }]
|
|
4483
|
-
}], advancedFilters: [{
|
|
4484
|
-
type: ViewChild,
|
|
4485
|
-
args: [NiceAdvancedFiltersComponent, { static: true }]
|
|
4486
|
-
}] } });
|
|
4487
|
-
|
|
4488
|
-
class NiceFilterViewModule {
|
|
4489
|
-
static forRoot(options) {
|
|
4330
|
+
generateQueryParams() {
|
|
4331
|
+
const { ids, active } = this.store.getValue();
|
|
4490
4332
|
return {
|
|
4491
|
-
|
|
4492
|
-
|
|
4493
|
-
{
|
|
4494
|
-
provide: FILTER_VIEW_ICONS,
|
|
4495
|
-
useValue: {
|
|
4496
|
-
...defaultIcons$1,
|
|
4497
|
-
...(options?.icons ?? {})
|
|
4498
|
-
}
|
|
4499
|
-
}
|
|
4500
|
-
].filter(x => !!x)
|
|
4333
|
+
selection: ids.length ? ids : null,
|
|
4334
|
+
selected: active ?? null
|
|
4501
4335
|
};
|
|
4502
4336
|
}
|
|
4503
|
-
|
|
4504
|
-
|
|
4505
|
-
{
|
|
4506
|
-
|
|
4507
|
-
|
|
4508
|
-
}
|
|
4509
|
-
|
|
4510
|
-
provide: EXPORTS_SETTINGS,
|
|
4511
|
-
useValue: options.exports ?? {
|
|
4512
|
-
pdf: true,
|
|
4513
|
-
xlsx: true,
|
|
4514
|
-
csv: true
|
|
4515
|
-
}
|
|
4516
|
-
},
|
|
4517
|
-
{
|
|
4518
|
-
provide: FILTER_VIEW_STATE,
|
|
4519
|
-
useValue: options.state ?? {}
|
|
4520
|
-
},
|
|
4521
|
-
{
|
|
4522
|
-
provide: FILTER_VIEW_STORE,
|
|
4523
|
-
useValue: options.store ?? { name: "nice-filter-view", resettable: true }
|
|
4524
|
-
}
|
|
4525
|
-
].filter(x => !!x);
|
|
4337
|
+
setQueryParams() {
|
|
4338
|
+
if (!this.queryParamsDisabled) {
|
|
4339
|
+
this.router.navigate([], {
|
|
4340
|
+
queryParams: this.generateQueryParams(),
|
|
4341
|
+
queryParamsHandling: "merge"
|
|
4342
|
+
});
|
|
4343
|
+
}
|
|
4526
4344
|
}
|
|
4527
4345
|
}
|
|
4528
|
-
NiceFilterViewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
4529
|
-
NiceFilterViewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewModule, declarations: [NiceFilterViewComponent,
|
|
4530
|
-
NiceFilterCustomDataViewComponent,
|
|
4531
|
-
NiceFilterExportButtonsComponent,
|
|
4532
|
-
NiceFilterInfiniteScrollDataViewComponent,
|
|
4533
|
-
NiceFilterSearchComponent,
|
|
4534
|
-
NiceFilterDataDirective,
|
|
4535
|
-
NiceFilterExportDirective,
|
|
4536
|
-
NiceFilterMatTableViewDirective,
|
|
4537
|
-
NiceFilterMatSortSortingDirective,
|
|
4538
|
-
NiceFilterMatPaginatorPaginationDirective,
|
|
4539
|
-
NiceFilterQueryParamsDirective], imports: [TranslateModule,
|
|
4540
|
-
MatIconModule,
|
|
4541
|
-
FormsModule,
|
|
4542
|
-
AsyncPipe,
|
|
4543
|
-
NgIf,
|
|
4544
|
-
NgTemplateOutlet,
|
|
4545
|
-
MatTooltipModule,
|
|
4546
|
-
MatButtonModule,
|
|
4547
|
-
MatBottomSheetModule,
|
|
4548
|
-
NiceExportBottomSheetModule], exports: [NiceFilterViewComponent,
|
|
4549
|
-
NiceFilterCustomDataViewComponent,
|
|
4550
|
-
NiceFilterExportButtonsComponent,
|
|
4551
|
-
NiceFilterInfiniteScrollDataViewComponent,
|
|
4552
|
-
NiceFilterSearchComponent,
|
|
4553
|
-
NiceFilterDataDirective,
|
|
4554
|
-
NiceFilterExportDirective,
|
|
4555
|
-
NiceFilterMatTableViewDirective,
|
|
4556
|
-
NiceFilterMatSortSortingDirective,
|
|
4557
|
-
NiceFilterMatPaginatorPaginationDirective,
|
|
4558
|
-
NiceFilterQueryParamsDirective] });
|
|
4559
|
-
NiceFilterViewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewModule, imports: [TranslateModule,
|
|
4560
|
-
MatIconModule,
|
|
4561
|
-
FormsModule,
|
|
4562
|
-
MatTooltipModule,
|
|
4563
|
-
MatButtonModule,
|
|
4564
|
-
MatBottomSheetModule,
|
|
4565
|
-
NiceExportBottomSheetModule] });
|
|
4566
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewModule, decorators: [{
|
|
4567
|
-
type: NgModule,
|
|
4568
|
-
args: [{
|
|
4569
|
-
imports: [
|
|
4570
|
-
TranslateModule,
|
|
4571
|
-
MatIconModule,
|
|
4572
|
-
FormsModule,
|
|
4573
|
-
AsyncPipe,
|
|
4574
|
-
NgIf,
|
|
4575
|
-
NgTemplateOutlet,
|
|
4576
|
-
MatTooltipModule,
|
|
4577
|
-
MatButtonModule,
|
|
4578
|
-
MatBottomSheetModule,
|
|
4579
|
-
NiceExportBottomSheetModule
|
|
4580
|
-
],
|
|
4581
|
-
declarations: [
|
|
4582
|
-
NiceFilterViewComponent,
|
|
4583
|
-
NiceFilterCustomDataViewComponent,
|
|
4584
|
-
NiceFilterExportButtonsComponent,
|
|
4585
|
-
NiceFilterInfiniteScrollDataViewComponent,
|
|
4586
|
-
NiceFilterSearchComponent,
|
|
4587
|
-
NiceFilterDataDirective,
|
|
4588
|
-
NiceFilterExportDirective,
|
|
4589
|
-
NiceFilterMatTableViewDirective,
|
|
4590
|
-
NiceFilterMatSortSortingDirective,
|
|
4591
|
-
NiceFilterMatPaginatorPaginationDirective,
|
|
4592
|
-
NiceFilterQueryParamsDirective
|
|
4593
|
-
],
|
|
4594
|
-
providers: [],
|
|
4595
|
-
exports: [
|
|
4596
|
-
NiceFilterViewComponent,
|
|
4597
|
-
NiceFilterCustomDataViewComponent,
|
|
4598
|
-
NiceFilterExportButtonsComponent,
|
|
4599
|
-
NiceFilterInfiniteScrollDataViewComponent,
|
|
4600
|
-
NiceFilterSearchComponent,
|
|
4601
|
-
NiceFilterDataDirective,
|
|
4602
|
-
NiceFilterExportDirective,
|
|
4603
|
-
NiceFilterMatTableViewDirective,
|
|
4604
|
-
NiceFilterMatSortSortingDirective,
|
|
4605
|
-
NiceFilterMatPaginatorPaginationDirective,
|
|
4606
|
-
NiceFilterQueryParamsDirective
|
|
4607
|
-
],
|
|
4608
|
-
}]
|
|
4609
|
-
}] });
|
|
4610
4346
|
|
|
4611
|
-
class
|
|
4612
|
-
|
|
4613
|
-
|
|
4614
|
-
|
|
4615
|
-
|
|
4616
|
-
|
|
4617
|
-
}] });
|
|
4618
|
-
|
|
4619
|
-
const NICE_PRELOAD_SELECTED_ENTITIES_PROVIDER = new InjectionToken("nice_preload_selected_entities_provider");
|
|
4620
|
-
|
|
4621
|
-
class NiceSelectableListStateQuery extends QueryEntity {
|
|
4622
|
-
constructor(store) {
|
|
4623
|
-
super(store);
|
|
4624
|
-
}
|
|
4625
|
-
selectActiveViewIndex() {
|
|
4626
|
-
return this.select(({ ids, active }) => {
|
|
4627
|
-
const index = ids.indexOf(active);
|
|
4628
|
-
return index + 1;
|
|
4629
|
-
});
|
|
4630
|
-
}
|
|
4631
|
-
selectFirstActive() {
|
|
4632
|
-
return this.select(({ ids, active }) => {
|
|
4633
|
-
if (!ids.length) {
|
|
4634
|
-
return true;
|
|
4635
|
-
}
|
|
4636
|
-
return ids[0] === active;
|
|
4637
|
-
});
|
|
4638
|
-
}
|
|
4639
|
-
selectLastActive() {
|
|
4640
|
-
return this.select(({ ids, active }) => {
|
|
4641
|
-
if (!ids.length) {
|
|
4642
|
-
return true;
|
|
4643
|
-
}
|
|
4644
|
-
return ids[ids.length - 1] === active;
|
|
4645
|
-
});
|
|
4347
|
+
class NiceSelectableListService {
|
|
4348
|
+
constructor(providers, route, router) {
|
|
4349
|
+
this.providers = providers;
|
|
4350
|
+
this.route = route;
|
|
4351
|
+
this.router = router;
|
|
4352
|
+
this.stores = new Map();
|
|
4646
4353
|
}
|
|
4647
|
-
|
|
4648
|
-
|
|
4649
|
-
|
|
4650
|
-
|
|
4651
|
-
|
|
4354
|
+
createState(name, options) {
|
|
4355
|
+
const store = new EntityStore({ allSelected: false, unselectedEntity: [] }, { name, idKey: options?.idKey });
|
|
4356
|
+
const query = new NiceSelectableListStateQuery(store);
|
|
4357
|
+
const state = { store, query };
|
|
4358
|
+
this.stores.set(name, state);
|
|
4359
|
+
return state;
|
|
4652
4360
|
}
|
|
4653
|
-
|
|
4654
|
-
return this.
|
|
4361
|
+
getState(name) {
|
|
4362
|
+
return this.stores.get(name);
|
|
4655
4363
|
}
|
|
4656
|
-
|
|
4657
|
-
this.
|
|
4658
|
-
|
|
4659
|
-
|
|
4660
|
-
|
|
4661
|
-
|
|
4364
|
+
withState(stateName, options) {
|
|
4365
|
+
const provider = this.providers?.find((p) => p.state === stateName);
|
|
4366
|
+
const state = this.getState(stateName);
|
|
4367
|
+
if (state) {
|
|
4368
|
+
return new NiceSelectableListStateService(state.store, this.route, this.router, provider, options);
|
|
4369
|
+
}
|
|
4370
|
+
const newState = this.createState(stateName, options);
|
|
4371
|
+
return new NiceSelectableListStateService(newState.store, this.route, this.router, provider, options);
|
|
4662
4372
|
}
|
|
4663
|
-
|
|
4664
|
-
this.
|
|
4373
|
+
query(stateName) {
|
|
4374
|
+
const state = this.getState(stateName);
|
|
4375
|
+
if (!state) {
|
|
4376
|
+
throw new Error("No state found");
|
|
4377
|
+
}
|
|
4378
|
+
return state.query;
|
|
4665
4379
|
}
|
|
4666
|
-
|
|
4667
|
-
|
|
4668
|
-
|
|
4669
|
-
|
|
4380
|
+
}
|
|
4381
|
+
NiceSelectableListService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceSelectableListService, deps: [{ token: NICE_PRELOAD_SELECTED_ENTITIES_PROVIDER, optional: true }, { token: i2.ActivatedRoute }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
4382
|
+
NiceSelectableListService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceSelectableListService, providedIn: "root" });
|
|
4383
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceSelectableListService, decorators: [{
|
|
4384
|
+
type: Injectable,
|
|
4385
|
+
args: [{ providedIn: "root" }]
|
|
4386
|
+
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
4387
|
+
type: Optional
|
|
4388
|
+
}, {
|
|
4389
|
+
type: Inject,
|
|
4390
|
+
args: [NICE_PRELOAD_SELECTED_ENTITIES_PROVIDER]
|
|
4391
|
+
}] }, { type: i2.ActivatedRoute }, { type: i2.Router }]; } });
|
|
4392
|
+
|
|
4393
|
+
class NiceFilterExportButtonsComponent {
|
|
4394
|
+
constructor(icons, exportsSettings, niceFilterViewQuery, niceFilterViewService, selectableListService, query, service, bottomSheet) {
|
|
4395
|
+
this.icons = icons;
|
|
4396
|
+
this.exportsSettings = exportsSettings;
|
|
4397
|
+
this.niceFilterViewQuery = niceFilterViewQuery;
|
|
4398
|
+
this.niceFilterViewService = niceFilterViewService;
|
|
4399
|
+
this.selectableListService = selectableListService;
|
|
4400
|
+
this.query = query;
|
|
4401
|
+
this.service = service;
|
|
4402
|
+
this.bottomSheet = bottomSheet;
|
|
4403
|
+
this.customExport = [];
|
|
4404
|
+
this.downloadFileName = "data";
|
|
4405
|
+
this.canPrint = true;
|
|
4406
|
+
this.loading$ = this.query.selectLoading();
|
|
4670
4407
|
}
|
|
4671
|
-
|
|
4672
|
-
|
|
4673
|
-
|
|
4674
|
-
|
|
4408
|
+
clickExport() {
|
|
4409
|
+
const exports = [];
|
|
4410
|
+
const subState = this.niceFilterViewQuery.getSubState("selectable");
|
|
4411
|
+
let selected = [];
|
|
4412
|
+
if (subState?.stateName) {
|
|
4413
|
+
selected = this.selectableListService.query(subState.stateName).getAll().map((entity) => entity.id);
|
|
4414
|
+
}
|
|
4415
|
+
if (this.exportsSettings.xlsx) {
|
|
4416
|
+
exports.push({
|
|
4417
|
+
type: "xlsx",
|
|
4418
|
+
onClickExport: () => this.clickXlsx()
|
|
4675
4419
|
});
|
|
4420
|
+
if (selected.length) {
|
|
4421
|
+
exports.push({
|
|
4422
|
+
type: "selected_xlsx",
|
|
4423
|
+
onClickExport: () => this.clickXlsx(selected)
|
|
4424
|
+
});
|
|
4425
|
+
}
|
|
4676
4426
|
}
|
|
4677
|
-
|
|
4678
|
-
|
|
4679
|
-
|
|
4680
|
-
|
|
4681
|
-
})));
|
|
4682
|
-
return this.store.update({
|
|
4683
|
-
allSelected: true
|
|
4684
|
-
});
|
|
4685
|
-
}
|
|
4686
|
-
async select(id) {
|
|
4687
|
-
this.store.update((state) => ({
|
|
4688
|
-
unselectedEntity: arrayRemove(state.unselectedEntity, id)
|
|
4689
|
-
}));
|
|
4690
|
-
this.store.add({
|
|
4691
|
-
[this.idKey]: id,
|
|
4692
|
-
loaded: false
|
|
4693
|
-
});
|
|
4694
|
-
if (this.preloadService) {
|
|
4695
|
-
const entity = await this.preloadService.loadEntityById(id);
|
|
4696
|
-
this.store.upsert(id, {
|
|
4697
|
-
...entity,
|
|
4698
|
-
loaded: true
|
|
4427
|
+
if (this.exportsSettings.csv) {
|
|
4428
|
+
exports.push({
|
|
4429
|
+
type: "csv",
|
|
4430
|
+
onClickExport: () => this.clickCsv()
|
|
4699
4431
|
});
|
|
4432
|
+
if (selected.length) {
|
|
4433
|
+
exports.push({
|
|
4434
|
+
type: "selected_csv",
|
|
4435
|
+
onClickExport: () => this.clickCsv(selected)
|
|
4436
|
+
});
|
|
4437
|
+
}
|
|
4700
4438
|
}
|
|
4701
|
-
|
|
4702
|
-
|
|
4703
|
-
|
|
4704
|
-
|
|
4705
|
-
|
|
4706
|
-
|
|
4707
|
-
|
|
4708
|
-
|
|
4709
|
-
|
|
4439
|
+
if (this.exportsSettings.pdf) {
|
|
4440
|
+
exports.push({
|
|
4441
|
+
type: "pdf",
|
|
4442
|
+
onClickExport: () => this.clickPdf()
|
|
4443
|
+
});
|
|
4444
|
+
if (selected.length) {
|
|
4445
|
+
exports.push({
|
|
4446
|
+
type: "selected_pdf",
|
|
4447
|
+
onClickExport: () => this.clickPdf(selected)
|
|
4448
|
+
});
|
|
4449
|
+
}
|
|
4710
4450
|
}
|
|
4451
|
+
this.bottomSheet.open(ExportBottomSheetComponent, {
|
|
4452
|
+
data: {
|
|
4453
|
+
exportStrategies: [
|
|
4454
|
+
...exports,
|
|
4455
|
+
...this.customExport
|
|
4456
|
+
]
|
|
4457
|
+
}
|
|
4458
|
+
});
|
|
4711
4459
|
}
|
|
4712
|
-
|
|
4713
|
-
this.
|
|
4714
|
-
unselectedEntity: arrayRemove(state.unselectedEntity, entity[this.idKey])
|
|
4715
|
-
}));
|
|
4716
|
-
this.store.upsert(entity[this.idKey], { ...entity, loaded: true });
|
|
4717
|
-
if (this.preloadService) {
|
|
4718
|
-
const preloadedEntity = await this.preloadService.reloadEntity(entity);
|
|
4719
|
-
this.store.upsert(preloadedEntity[this.idKey], { ...preloadedEntity, loaded: true });
|
|
4720
|
-
}
|
|
4460
|
+
clickXlsx(ids) {
|
|
4461
|
+
this.service.downloadData("xlsx", this.downloadFileName, ids);
|
|
4721
4462
|
}
|
|
4722
|
-
|
|
4723
|
-
|
|
4724
|
-
return this.store.upsertMany(entities.map((entity) => ({ ...entity, loaded: true })));
|
|
4725
|
-
}
|
|
4726
|
-
const preloadedEntities = await this.preloadService.reloadEntities(entities);
|
|
4727
|
-
this.store.upsertMany(preloadedEntities.map((preloadedEntity) => ({ ...preloadedEntity, loaded: true })));
|
|
4463
|
+
clickCsv(ids) {
|
|
4464
|
+
this.service.downloadData("csv", this.downloadFileName, ids);
|
|
4728
4465
|
}
|
|
4729
|
-
|
|
4730
|
-
this.
|
|
4731
|
-
return this.store.update({
|
|
4732
|
-
allSelected: false,
|
|
4733
|
-
unselectedEntity: []
|
|
4734
|
-
});
|
|
4466
|
+
clickPrint() {
|
|
4467
|
+
this.service.printData();
|
|
4735
4468
|
}
|
|
4736
|
-
|
|
4737
|
-
this.
|
|
4738
|
-
unselectedEntity: arrayAdd(state.unselectedEntity, id)
|
|
4739
|
-
}));
|
|
4740
|
-
this.store.remove(id);
|
|
4469
|
+
clickPdf(ids) {
|
|
4470
|
+
this.service.downloadData("pdf", this.downloadFileName, ids);
|
|
4741
4471
|
}
|
|
4742
|
-
|
|
4743
|
-
|
|
4744
|
-
|
|
4745
|
-
|
|
4746
|
-
|
|
4472
|
+
}
|
|
4473
|
+
NiceFilterExportButtonsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterExportButtonsComponent, deps: [{ token: FILTER_VIEW_ICONS }, { token: EXPORTS_SETTINGS }, { token: NiceFilterViewQuery }, { token: NiceFilterViewService }, { token: NiceSelectableListService }, { token: NiceFilterViewQuery }, { token: NiceFilterViewService }, { token: i4$1.MatBottomSheet }], target: i0.ɵɵFactoryTarget.Component });
|
|
4474
|
+
NiceFilterExportButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterExportButtonsComponent, selector: "nice-filter-export-buttons, div[nice-filter-export-buttons]", inputs: { customExport: "customExport", downloadFileName: "downloadFileName", canPrint: "canPrint" }, ngImport: i0, template: "<button\n *ngIf=\"canPrint\"\n (click)=\"clickPrint()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.print' | translate\"\n class=\"export-button\"\n mat-mini-fab\n>\n <mat-icon [svgIcon]=\"icons.print.svgIcon\">{{ icons.print.matIcon }}</mat-icon>\n</button>\n\n<button\n (click)=\"clickExport()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.export' | translate\"\n class=\"export-button\"\n mat-mini-fab\n>\n <mat-icon [svgIcon]=\"icons.download.svgIcon\">{{ icons.download.matIcon }}</mat-icon>\n</button>\n", styles: [""], dependencies: [{ kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i8.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
|
|
4475
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterExportButtonsComponent, decorators: [{
|
|
4476
|
+
type: Component,
|
|
4477
|
+
args: [{ selector: "nice-filter-export-buttons, div[nice-filter-export-buttons]", encapsulation: ViewEncapsulation.None, template: "<button\n *ngIf=\"canPrint\"\n (click)=\"clickPrint()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.print' | translate\"\n class=\"export-button\"\n mat-mini-fab\n>\n <mat-icon [svgIcon]=\"icons.print.svgIcon\">{{ icons.print.matIcon }}</mat-icon>\n</button>\n\n<button\n (click)=\"clickExport()\"\n [disabled]=\"loading$ | async\"\n [matTooltip]=\"'general.export' | translate\"\n class=\"export-button\"\n mat-mini-fab\n>\n <mat-icon [svgIcon]=\"icons.download.svgIcon\">{{ icons.download.matIcon }}</mat-icon>\n</button>\n" }]
|
|
4478
|
+
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
4479
|
+
type: Inject,
|
|
4480
|
+
args: [FILTER_VIEW_ICONS]
|
|
4481
|
+
}] }, { type: undefined, decorators: [{
|
|
4482
|
+
type: Inject,
|
|
4483
|
+
args: [EXPORTS_SETTINGS]
|
|
4484
|
+
}] }, { type: NiceFilterViewQuery }, { type: NiceFilterViewService }, { type: NiceSelectableListService }, { type: NiceFilterViewQuery }, { type: NiceFilterViewService }, { type: i4$1.MatBottomSheet }]; }, propDecorators: { customExport: [{
|
|
4485
|
+
type: Input
|
|
4486
|
+
}], downloadFileName: [{
|
|
4487
|
+
type: Input
|
|
4488
|
+
}], canPrint: [{
|
|
4489
|
+
type: Input
|
|
4490
|
+
}] } });
|
|
4491
|
+
|
|
4492
|
+
class NiceFilterExportDirective {
|
|
4493
|
+
constructor(service) {
|
|
4494
|
+
this.service = service;
|
|
4495
|
+
this.downloadFileName = "data";
|
|
4747
4496
|
}
|
|
4748
|
-
|
|
4749
|
-
this.
|
|
4497
|
+
onClick() {
|
|
4498
|
+
this.service.downloadData(this.type, this.downloadFileName);
|
|
4750
4499
|
}
|
|
4751
|
-
|
|
4752
|
-
|
|
4500
|
+
}
|
|
4501
|
+
NiceFilterExportDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterExportDirective, deps: [{ token: NiceFilterViewService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
4502
|
+
NiceFilterExportDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterExportDirective, selector: "[niceFilterExport]", inputs: { type: "type", downloadFileName: "downloadFileName" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
|
|
4503
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterExportDirective, decorators: [{
|
|
4504
|
+
type: Directive,
|
|
4505
|
+
args: [{ selector: "[niceFilterExport]" }]
|
|
4506
|
+
}], ctorParameters: function () { return [{ type: NiceFilterViewService }]; }, propDecorators: { type: [{
|
|
4507
|
+
type: Input
|
|
4508
|
+
}], downloadFileName: [{
|
|
4509
|
+
type: Input
|
|
4510
|
+
}], onClick: [{
|
|
4511
|
+
type: HostListener,
|
|
4512
|
+
args: ["click"]
|
|
4513
|
+
}] } });
|
|
4514
|
+
|
|
4515
|
+
class NiceFilterInfiniteScrollDataViewComponent {
|
|
4516
|
+
constructor(query, service) {
|
|
4517
|
+
this.query = query;
|
|
4518
|
+
this.service = service;
|
|
4519
|
+
this.data$ = this.query.selectAll();
|
|
4753
4520
|
}
|
|
4754
|
-
async
|
|
4755
|
-
this.
|
|
4756
|
-
|
|
4757
|
-
|
|
4758
|
-
|
|
4759
|
-
this.store.set(ids.map((id) => ({
|
|
4760
|
-
[this.idKey]: id,
|
|
4761
|
-
loaded: false
|
|
4762
|
-
})));
|
|
4763
|
-
if (activeId) {
|
|
4764
|
-
this.store.setActive(activeId);
|
|
4521
|
+
async loadNextPage() {
|
|
4522
|
+
const { filterParameters, filterResult } = this.query.getValue();
|
|
4523
|
+
this.service.setMode("accumulated");
|
|
4524
|
+
if (filterResult && filterResult.values.length >= filterResult.total) {
|
|
4525
|
+
return;
|
|
4765
4526
|
}
|
|
4766
|
-
|
|
4527
|
+
this.service.setParameters({
|
|
4528
|
+
...filterParameters,
|
|
4529
|
+
start: filterParameters.start + filterParameters.length
|
|
4530
|
+
});
|
|
4531
|
+
this.service.filter();
|
|
4767
4532
|
}
|
|
4768
|
-
|
|
4769
|
-
|
|
4770
|
-
|
|
4771
|
-
|
|
4533
|
+
}
|
|
4534
|
+
NiceFilterInfiniteScrollDataViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterInfiniteScrollDataViewComponent, deps: [{ token: NiceFilterViewQuery }, { token: NiceFilterViewService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4535
|
+
NiceFilterInfiniteScrollDataViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterInfiniteScrollDataViewComponent, selector: "nice-filter-infinite-scroll-data-view, div[nice-filter-infinite-scroll-data-view]", queries: [{ propertyName: "content", first: true, predicate: NiceFilterDataDirective, descendants: true, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"content\">\n <ng-container *ngTemplateOutlet=\"content; context: { $implicit: data$ | async }\"></ng-container>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
|
|
4536
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterInfiniteScrollDataViewComponent, decorators: [{
|
|
4537
|
+
type: Component,
|
|
4538
|
+
args: [{ selector: "nice-filter-infinite-scroll-data-view, div[nice-filter-infinite-scroll-data-view]", encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"content\">\n <ng-container *ngTemplateOutlet=\"content; context: { $implicit: data$ | async }\"></ng-container>\n</ng-container>\n" }]
|
|
4539
|
+
}], ctorParameters: function () { return [{ type: NiceFilterViewQuery }, { type: NiceFilterViewService }]; }, propDecorators: { content: [{
|
|
4540
|
+
type: ContentChild,
|
|
4541
|
+
args: [NiceFilterDataDirective, { read: TemplateRef }]
|
|
4542
|
+
}] } });
|
|
4543
|
+
|
|
4544
|
+
class NiceFilterSearchComponent {
|
|
4545
|
+
constructor(icons, query, service) {
|
|
4546
|
+
this.icons = icons;
|
|
4547
|
+
this.query = query;
|
|
4548
|
+
this.service = service;
|
|
4549
|
+
this.appearance = "default";
|
|
4550
|
+
this.searchQuery$ = this.query.selectFilterParameters().pipe(map(f => f.search));
|
|
4551
|
+
this.unsubscribeAll$ = new Subject();
|
|
4552
|
+
this.searchText$ = new Subject();
|
|
4772
4553
|
}
|
|
4773
|
-
|
|
4774
|
-
|
|
4775
|
-
|
|
4776
|
-
|
|
4554
|
+
ngOnInit() {
|
|
4555
|
+
this.searchText$
|
|
4556
|
+
.pipe(takeUntil(this.unsubscribeAll$), debounceTime(300), distinctUntilChanged(), tap((search) => {
|
|
4557
|
+
const { mode } = this.query.getValue();
|
|
4558
|
+
if (mode === "accumulated") {
|
|
4559
|
+
this.service.resetPaging();
|
|
4560
|
+
}
|
|
4561
|
+
const { filterParameters } = this.query.getValue();
|
|
4562
|
+
this.service.setParameters({
|
|
4563
|
+
...filterParameters,
|
|
4564
|
+
search
|
|
4565
|
+
});
|
|
4566
|
+
this.service.filter();
|
|
4567
|
+
}))
|
|
4568
|
+
.subscribe();
|
|
4777
4569
|
}
|
|
4778
|
-
|
|
4779
|
-
|
|
4780
|
-
|
|
4570
|
+
ngOnDestroy() {
|
|
4571
|
+
this.unsubscribeAll$.next();
|
|
4572
|
+
this.unsubscribeAll$.complete();
|
|
4781
4573
|
}
|
|
4782
|
-
|
|
4783
|
-
|
|
4784
|
-
await this.loadActiveEntity(ids[ids.length - 1], -1);
|
|
4574
|
+
onUpdateSearch(search) {
|
|
4575
|
+
this.searchText$.next(search);
|
|
4785
4576
|
}
|
|
4786
|
-
|
|
4787
|
-
|
|
4788
|
-
|
|
4789
|
-
|
|
4790
|
-
|
|
4791
|
-
|
|
4792
|
-
}
|
|
4793
|
-
|
|
4794
|
-
|
|
4795
|
-
|
|
4577
|
+
}
|
|
4578
|
+
NiceFilterSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterSearchComponent, deps: [{ token: FILTER_VIEW_ICONS }, { token: NiceFilterViewQuery }, { token: NiceFilterViewService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4579
|
+
NiceFilterSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterSearchComponent, selector: "nice-filter-search", inputs: { appearance: "appearance" }, ngImport: i0, template: "<div\n class=\"search-wrapper mx-md-0\"\n [class.nice-search-default]=\"appearance === 'default'\"\n [class.nice-search-outlined]=\"appearance === 'outlined'\"\n [class.nice-search-legacy]=\"appearance === 'legacy'\"\n [class.nice-search-custom]=\"appearance === 'custom'\"\n>\n <div class=\"search flex flex-auto justify-start items-center\">\n <mat-icon [svgIcon]=\"icons.search.svgIcon\">{{ icons.search.matIcon }}</mat-icon>\n <input [ngModel]=\"searchQuery$ | async\" (ngModelChange)=\"onUpdateSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n\n <ng-content select=\"[niceFilterSearchButtons]\"></ng-content>\n </div>\n</div>\n", styles: ["nice-filter-search .search-wrapper{width:100%;max-width:480px;overflow:hidden}nice-filter-search .search-wrapper.nice-search-default{box-shadow:0 4px 12px #0000001f;border-radius:5px}nice-filter-search .search-wrapper.nice-search-outlined{border-radius:5px}nice-filter-search .search-wrapper.nice-search-legacy{box-shadow:0 3px 3px -2px #0000004d,0 3px 4px #0000004d,0 1px 8px #0000004d;border-radius:28px}nice-filter-search .search-wrapper .search{width:100%;height:48px;line-height:48px;padding:0 18px}nice-filter-search .search-wrapper .search input{width:100%;height:48px;min-height:48px;max-height:48px;padding:0 16px;border:none;outline:none}\n"], dependencies: [{ kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
|
|
4580
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterSearchComponent, decorators: [{
|
|
4581
|
+
type: Component,
|
|
4582
|
+
args: [{ selector: "nice-filter-search", encapsulation: ViewEncapsulation.None, template: "<div\n class=\"search-wrapper mx-md-0\"\n [class.nice-search-default]=\"appearance === 'default'\"\n [class.nice-search-outlined]=\"appearance === 'outlined'\"\n [class.nice-search-legacy]=\"appearance === 'legacy'\"\n [class.nice-search-custom]=\"appearance === 'custom'\"\n>\n <div class=\"search flex flex-auto justify-start items-center\">\n <mat-icon [svgIcon]=\"icons.search.svgIcon\">{{ icons.search.matIcon }}</mat-icon>\n <input [ngModel]=\"searchQuery$ | async\" (ngModelChange)=\"onUpdateSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n\n <ng-content select=\"[niceFilterSearchButtons]\"></ng-content>\n </div>\n</div>\n", styles: ["nice-filter-search .search-wrapper{width:100%;max-width:480px;overflow:hidden}nice-filter-search .search-wrapper.nice-search-default{box-shadow:0 4px 12px #0000001f;border-radius:5px}nice-filter-search .search-wrapper.nice-search-outlined{border-radius:5px}nice-filter-search .search-wrapper.nice-search-legacy{box-shadow:0 3px 3px -2px #0000004d,0 3px 4px #0000004d,0 1px 8px #0000004d;border-radius:28px}nice-filter-search .search-wrapper .search{width:100%;height:48px;line-height:48px;padding:0 18px}nice-filter-search .search-wrapper .search input{width:100%;height:48px;min-height:48px;max-height:48px;padding:0 16px;border:none;outline:none}\n"] }]
|
|
4583
|
+
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
4584
|
+
type: Inject,
|
|
4585
|
+
args: [FILTER_VIEW_ICONS]
|
|
4586
|
+
}] }, { type: NiceFilterViewQuery }, { type: NiceFilterViewService }]; }, propDecorators: { appearance: [{
|
|
4587
|
+
type: Input
|
|
4588
|
+
}] } });
|
|
4589
|
+
|
|
4590
|
+
class NiceFilterMatPaginatorPaginationDirective {
|
|
4591
|
+
constructor(query, service, paginator) {
|
|
4592
|
+
this.query = query;
|
|
4593
|
+
this.service = service;
|
|
4594
|
+
this.paginator = paginator;
|
|
4595
|
+
this.unsubscribeAll$ = new Subject();
|
|
4796
4596
|
}
|
|
4797
|
-
|
|
4798
|
-
|
|
4799
|
-
|
|
4800
|
-
|
|
4801
|
-
if (!entities[+id + direction * this.preloadedWindow]?.loaded) {
|
|
4802
|
-
await this.loadEntities(false);
|
|
4597
|
+
ngOnInit() {
|
|
4598
|
+
this.query.selectFilterResult().pipe(takeUntil(this.unsubscribeAll$)).subscribe((res) => {
|
|
4599
|
+
if (!res) {
|
|
4600
|
+
return;
|
|
4803
4601
|
}
|
|
4804
|
-
|
|
4805
|
-
|
|
4806
|
-
this.
|
|
4807
|
-
|
|
4602
|
+
const { page, total } = res;
|
|
4603
|
+
this.paginator.pageIndex = page.number;
|
|
4604
|
+
this.paginator.pageSize = page.size;
|
|
4605
|
+
this.paginator.length = total;
|
|
4606
|
+
});
|
|
4607
|
+
this.paginator.page.pipe(takeUntil(this.unsubscribeAll$)).subscribe((page) => {
|
|
4608
|
+
const { filterParameters } = this.query.getValue();
|
|
4609
|
+
this.service.setParameters({
|
|
4610
|
+
...filterParameters,
|
|
4611
|
+
start: page.pageIndex * page.pageSize,
|
|
4612
|
+
length: page.pageSize
|
|
4613
|
+
});
|
|
4614
|
+
this.service.filter();
|
|
4615
|
+
});
|
|
4808
4616
|
}
|
|
4809
|
-
|
|
4810
|
-
|
|
4811
|
-
|
|
4812
|
-
}
|
|
4813
|
-
const toLoad = this.getListIdToLoad(loadExtremity);
|
|
4814
|
-
if (!toLoad.length) {
|
|
4815
|
-
return;
|
|
4816
|
-
}
|
|
4817
|
-
const entities = await this.preloadService.loadEntitiesById(toLoad);
|
|
4818
|
-
this.store.upsertMany(entities.map((entity) => ({ ...entity, loaded: true })));
|
|
4617
|
+
ngOnDestroy() {
|
|
4618
|
+
this.unsubscribeAll$.next();
|
|
4619
|
+
this.unsubscribeAll$.complete();
|
|
4819
4620
|
}
|
|
4820
|
-
|
|
4821
|
-
|
|
4822
|
-
|
|
4823
|
-
|
|
4824
|
-
|
|
4825
|
-
:
|
|
4826
|
-
|
|
4827
|
-
|
|
4828
|
-
|
|
4829
|
-
|
|
4621
|
+
}
|
|
4622
|
+
NiceFilterMatPaginatorPaginationDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterMatPaginatorPaginationDirective, deps: [{ token: NiceFilterViewQuery }, { token: NiceFilterViewService }, { token: i12.MatPaginator }], target: i0.ɵɵFactoryTarget.Directive });
|
|
4623
|
+
NiceFilterMatPaginatorPaginationDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterMatPaginatorPaginationDirective, selector: "mat-paginator[niceFilterPagination]", ngImport: i0 });
|
|
4624
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterMatPaginatorPaginationDirective, decorators: [{
|
|
4625
|
+
type: Directive,
|
|
4626
|
+
args: [{ selector: "mat-paginator[niceFilterPagination]" }]
|
|
4627
|
+
}], ctorParameters: function () { return [{ type: NiceFilterViewQuery }, { type: NiceFilterViewService }, { type: i12.MatPaginator }]; } });
|
|
4628
|
+
|
|
4629
|
+
class NiceFilterMatSortSortingDirective {
|
|
4630
|
+
constructor(query, service, sort) {
|
|
4631
|
+
this.query = query;
|
|
4632
|
+
this.service = service;
|
|
4633
|
+
this.sort = sort;
|
|
4634
|
+
this.unsubscribeAll$ = new Subject();
|
|
4635
|
+
}
|
|
4636
|
+
ngOnInit() {
|
|
4637
|
+
this.query.selectFilterParameters().pipe(takeUntil(this.unsubscribeAll$)).subscribe((res) => {
|
|
4638
|
+
if (!res) {
|
|
4639
|
+
return;
|
|
4830
4640
|
}
|
|
4831
|
-
|
|
4832
|
-
|
|
4833
|
-
|
|
4834
|
-
if (ids[i] === null || ids[0] === undefined) {
|
|
4835
|
-
continue;
|
|
4641
|
+
const { order } = res;
|
|
4642
|
+
if (!order) {
|
|
4643
|
+
return;
|
|
4836
4644
|
}
|
|
4837
|
-
|
|
4838
|
-
|
|
4645
|
+
this.sort.direction = order.direction;
|
|
4646
|
+
this.sort.active = order.column;
|
|
4647
|
+
});
|
|
4648
|
+
this.sort.sortChange.pipe(takeUntil(this.unsubscribeAll$)).subscribe((sort) => {
|
|
4649
|
+
const { filterParameters } = this.query.getValue();
|
|
4650
|
+
if (!sort.direction) {
|
|
4651
|
+
const { order, ...values } = filterParameters;
|
|
4652
|
+
this.service.setParameters({
|
|
4653
|
+
...values,
|
|
4654
|
+
order: {}
|
|
4655
|
+
});
|
|
4839
4656
|
}
|
|
4840
|
-
|
|
4841
|
-
|
|
4657
|
+
else {
|
|
4658
|
+
this.service.setParameters({
|
|
4659
|
+
...filterParameters,
|
|
4660
|
+
order: {
|
|
4661
|
+
column: sort.active,
|
|
4662
|
+
direction: sort.direction
|
|
4663
|
+
}
|
|
4664
|
+
});
|
|
4665
|
+
}
|
|
4666
|
+
this.service.filter();
|
|
4667
|
+
});
|
|
4842
4668
|
}
|
|
4843
|
-
|
|
4844
|
-
|
|
4845
|
-
|
|
4846
|
-
selection: ids.length ? ids : null,
|
|
4847
|
-
selected: active ?? null
|
|
4848
|
-
};
|
|
4669
|
+
ngOnDestroy() {
|
|
4670
|
+
this.unsubscribeAll$.next();
|
|
4671
|
+
this.unsubscribeAll$.complete();
|
|
4849
4672
|
}
|
|
4850
|
-
|
|
4851
|
-
|
|
4852
|
-
|
|
4853
|
-
|
|
4854
|
-
|
|
4673
|
+
}
|
|
4674
|
+
NiceFilterMatSortSortingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterMatSortSortingDirective, deps: [{ token: NiceFilterViewQuery }, { token: NiceFilterViewService }, { token: i14.MatSort }], target: i0.ɵɵFactoryTarget.Directive });
|
|
4675
|
+
NiceFilterMatSortSortingDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterMatSortSortingDirective, selector: "mat-table[matSort][niceFilterSorting]", ngImport: i0 });
|
|
4676
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterMatSortSortingDirective, decorators: [{
|
|
4677
|
+
type: Directive,
|
|
4678
|
+
args: [{ selector: "mat-table[matSort][niceFilterSorting]" }]
|
|
4679
|
+
}], ctorParameters: function () { return [{ type: NiceFilterViewQuery }, { type: NiceFilterViewService }, { type: i14.MatSort }]; } });
|
|
4680
|
+
|
|
4681
|
+
class NiceFilterMatTableViewDirective {
|
|
4682
|
+
constructor(query, table) {
|
|
4683
|
+
this.query = query;
|
|
4684
|
+
this.table = table;
|
|
4685
|
+
}
|
|
4686
|
+
ngOnInit() {
|
|
4687
|
+
this.table.dataSource = this.query.selectAll();
|
|
4855
4688
|
}
|
|
4856
4689
|
}
|
|
4690
|
+
NiceFilterMatTableViewDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterMatTableViewDirective, deps: [{ token: NiceFilterViewQuery }, { token: i13.MatTable }], target: i0.ɵɵFactoryTarget.Directive });
|
|
4691
|
+
NiceFilterMatTableViewDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterMatTableViewDirective, selector: "mat-table[niceFilterDataView]", ngImport: i0 });
|
|
4692
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterMatTableViewDirective, decorators: [{
|
|
4693
|
+
type: Directive,
|
|
4694
|
+
args: [{ selector: "mat-table[niceFilterDataView]" }]
|
|
4695
|
+
}], ctorParameters: function () { return [{ type: NiceFilterViewQuery }, { type: i13.MatTable }]; } });
|
|
4857
4696
|
|
|
4858
|
-
class
|
|
4859
|
-
|
|
4860
|
-
this.
|
|
4697
|
+
class NiceFilterQueryParamsDirective {
|
|
4698
|
+
get initialized() {
|
|
4699
|
+
return this._initialized;
|
|
4700
|
+
}
|
|
4701
|
+
constructor(query, service, route, router) {
|
|
4702
|
+
this.query = query;
|
|
4703
|
+
this.service = service;
|
|
4861
4704
|
this.route = route;
|
|
4862
4705
|
this.router = router;
|
|
4863
|
-
this.
|
|
4706
|
+
this.init = new EventEmitter();
|
|
4707
|
+
this.unsubscribeAll$ = new Subject();
|
|
4708
|
+
this._initialized = false;
|
|
4864
4709
|
}
|
|
4865
|
-
|
|
4866
|
-
|
|
4867
|
-
|
|
4868
|
-
|
|
4869
|
-
this.
|
|
4870
|
-
return state;
|
|
4710
|
+
ngOnInit() {
|
|
4711
|
+
this.query.selectFilterParameters().pipe(takeUntil(this.unsubscribeAll$)).subscribe((parameters) => {
|
|
4712
|
+
this.updateQueryParams(parameters);
|
|
4713
|
+
});
|
|
4714
|
+
this.loadQueryParams();
|
|
4871
4715
|
}
|
|
4872
|
-
|
|
4873
|
-
|
|
4716
|
+
ngOnDestroy() {
|
|
4717
|
+
this.unsubscribeAll$.next();
|
|
4718
|
+
this.unsubscribeAll$.complete();
|
|
4719
|
+
}
|
|
4720
|
+
updateQueryParams(parameters) {
|
|
4721
|
+
if (!this.route) {
|
|
4722
|
+
return;
|
|
4723
|
+
}
|
|
4724
|
+
const params = { ...parameters };
|
|
4725
|
+
const { mode } = this.query.getValue();
|
|
4726
|
+
if (mode === "accumulated") {
|
|
4727
|
+
delete params.start;
|
|
4728
|
+
delete params.length;
|
|
4729
|
+
}
|
|
4730
|
+
this.router.navigate([], {
|
|
4731
|
+
relativeTo: this.route,
|
|
4732
|
+
queryParams: QueryParamsUtils.filterParametersToParamsMap(params),
|
|
4733
|
+
queryParamsHandling: "merge"
|
|
4734
|
+
});
|
|
4735
|
+
}
|
|
4736
|
+
loadQueryParams() {
|
|
4737
|
+
combineLatest([
|
|
4738
|
+
this.route.queryParams.pipe(map((params) => params.start), distinct()),
|
|
4739
|
+
this.route.queryParams.pipe(map((params) => params.length), distinct()),
|
|
4740
|
+
this.route.queryParams.pipe(map((params) => params.order), distinct()),
|
|
4741
|
+
this.route.queryParams.pipe(map((params) => params.search), distinct()),
|
|
4742
|
+
this.route.queryParams.pipe(map((params) => params.rules), distinct()),
|
|
4743
|
+
]).pipe(takeUntil(this.unsubscribeAll$), map(() => {
|
|
4744
|
+
const params = this.route.snapshot.queryParams;
|
|
4745
|
+
return {
|
|
4746
|
+
params: QueryParamsUtils.extractFilterParameters(params)
|
|
4747
|
+
};
|
|
4748
|
+
})).subscribe(({ params }) => {
|
|
4749
|
+
if (!QueryParamsUtils.hasFilterParameters(params) || Object.keys(params).length === 0) {
|
|
4750
|
+
params = { ...this.query.getValue().filterParameters };
|
|
4751
|
+
}
|
|
4752
|
+
const { filterParameters, filterResult } = this.query.getValue();
|
|
4753
|
+
if (FilterUtils.filterChangeNeedsRefresh(filterParameters, params) ||
|
|
4754
|
+
!filterResult) {
|
|
4755
|
+
this.service.setParameters({
|
|
4756
|
+
...params,
|
|
4757
|
+
fallbackOrder: filterParameters.fallbackOrder
|
|
4758
|
+
});
|
|
4759
|
+
}
|
|
4760
|
+
if (!this._initialized) {
|
|
4761
|
+
this._initialized = true;
|
|
4762
|
+
this.init.emit();
|
|
4763
|
+
}
|
|
4764
|
+
});
|
|
4874
4765
|
}
|
|
4875
|
-
|
|
4876
|
-
|
|
4877
|
-
|
|
4878
|
-
|
|
4879
|
-
|
|
4880
|
-
|
|
4881
|
-
|
|
4882
|
-
|
|
4766
|
+
}
|
|
4767
|
+
NiceFilterQueryParamsDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterQueryParamsDirective, deps: [{ token: NiceFilterViewQuery }, { token: NiceFilterViewService }, { token: i2.ActivatedRoute }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Directive });
|
|
4768
|
+
NiceFilterQueryParamsDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterQueryParamsDirective, selector: "nice-filter-view[niceFilterQueryParams]", outputs: { init: "init" }, ngImport: i0 });
|
|
4769
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterQueryParamsDirective, decorators: [{
|
|
4770
|
+
type: Directive,
|
|
4771
|
+
args: [{ selector: "nice-filter-view[niceFilterQueryParams]" }]
|
|
4772
|
+
}], ctorParameters: function () { return [{ type: NiceFilterViewQuery }, { type: NiceFilterViewService }, { type: i2.ActivatedRoute }, { type: i2.Router }]; }, propDecorators: { init: [{
|
|
4773
|
+
type: Output
|
|
4774
|
+
}] } });
|
|
4775
|
+
|
|
4776
|
+
class NiceFilterViewComponent {
|
|
4777
|
+
constructor(service) {
|
|
4778
|
+
this.service = service;
|
|
4779
|
+
this.queryParams = {};
|
|
4883
4780
|
}
|
|
4884
|
-
|
|
4885
|
-
|
|
4886
|
-
|
|
4887
|
-
throw new Error("No state found");
|
|
4781
|
+
ngOnChanges(changes) {
|
|
4782
|
+
if ("queryParams" in changes) {
|
|
4783
|
+
this.service.setQueryParams(this.queryParams);
|
|
4888
4784
|
}
|
|
4889
|
-
return state.query;
|
|
4890
4785
|
}
|
|
4891
4786
|
}
|
|
4892
|
-
|
|
4893
|
-
|
|
4894
|
-
|
|
4895
|
-
|
|
4896
|
-
|
|
4897
|
-
|
|
4898
|
-
|
|
4899
|
-
|
|
4900
|
-
|
|
4901
|
-
|
|
4902
|
-
|
|
4787
|
+
NiceFilterViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewComponent, deps: [{ token: NiceFilterViewService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4788
|
+
NiceFilterViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceFilterViewComponent, selector: "nice-filter-view", inputs: { queryParams: "queryParams" }, providers: [
|
|
4789
|
+
NiceFilterViewQuery,
|
|
4790
|
+
NiceFilterViewService,
|
|
4791
|
+
NiceFilterViewStore
|
|
4792
|
+
], usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], encapsulation: i0.ViewEncapsulation.None });
|
|
4793
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewComponent, decorators: [{
|
|
4794
|
+
type: Component,
|
|
4795
|
+
args: [{ selector: "nice-filter-view", encapsulation: ViewEncapsulation.None, providers: [
|
|
4796
|
+
NiceFilterViewQuery,
|
|
4797
|
+
NiceFilterViewService,
|
|
4798
|
+
NiceFilterViewStore
|
|
4799
|
+
], template: "<ng-content></ng-content>\n" }]
|
|
4800
|
+
}], ctorParameters: function () { return [{ type: NiceFilterViewService }]; }, propDecorators: { queryParams: [{
|
|
4801
|
+
type: Input
|
|
4802
|
+
}] } });
|
|
4903
4803
|
|
|
4904
4804
|
class SelectableListContentService {
|
|
4905
4805
|
constructor() {
|
|
@@ -5030,36 +4930,379 @@ class NiceSelectableListCheckboxDirective {
|
|
|
5030
4930
|
this.checkbox.checked = false;
|
|
5031
4931
|
return;
|
|
5032
4932
|
}
|
|
5033
|
-
this.initialized = true;
|
|
5034
|
-
if (!count) {
|
|
5035
|
-
this.checkbox.indeterminate = false;
|
|
5036
|
-
this.checkbox.checked = false;
|
|
4933
|
+
this.initialized = true;
|
|
4934
|
+
if (!count) {
|
|
4935
|
+
this.checkbox.indeterminate = false;
|
|
4936
|
+
this.checkbox.checked = false;
|
|
4937
|
+
return;
|
|
4938
|
+
}
|
|
4939
|
+
if (count !== checkboxes.length) {
|
|
4940
|
+
this.checkbox.indeterminate = true;
|
|
4941
|
+
this.checkbox.checked = false;
|
|
4942
|
+
return;
|
|
4943
|
+
}
|
|
4944
|
+
if (count === checkboxes.length) {
|
|
4945
|
+
this.checkbox.checked = true;
|
|
4946
|
+
this.checkbox.indeterminate = false;
|
|
4947
|
+
}
|
|
4948
|
+
}
|
|
4949
|
+
}
|
|
4950
|
+
NiceSelectableListCheckboxDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceSelectableListCheckboxDirective, deps: [{ token: i1$4.MatCheckbox }, { token: SelectableListContentService }, { token: NiceSelectableListService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
4951
|
+
NiceSelectableListCheckboxDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: NiceSelectableListCheckboxDirective, selector: "mat-checkbox[niceSelectableListCheckbox]", inputs: { selectableEntity: "selectableEntity", selectPage: "selectPage" }, ngImport: i0 });
|
|
4952
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceSelectableListCheckboxDirective, decorators: [{
|
|
4953
|
+
type: Directive,
|
|
4954
|
+
args: [{
|
|
4955
|
+
selector: "mat-checkbox[niceSelectableListCheckbox]"
|
|
4956
|
+
}]
|
|
4957
|
+
}], ctorParameters: function () { return [{ type: i1$4.MatCheckbox }, { type: SelectableListContentService }, { type: NiceSelectableListService }]; }, propDecorators: { selectableEntity: [{
|
|
4958
|
+
type: Input
|
|
4959
|
+
}], selectPage: [{
|
|
4960
|
+
type: Input
|
|
4961
|
+
}] } });
|
|
4962
|
+
|
|
4963
|
+
// tslint:disable-next-line:directive-class-suffix
|
|
4964
|
+
class NiceSelectableListDirective {
|
|
4965
|
+
constructor(service, selectableListService, route) {
|
|
4966
|
+
this.service = service;
|
|
4967
|
+
this.selectableListService = selectableListService;
|
|
4968
|
+
this.route = route;
|
|
4969
|
+
this.unsubscribeAll$ = new Subject();
|
|
4970
|
+
this.unsubscribeQuerySub$ = new Subject();
|
|
4971
|
+
}
|
|
4972
|
+
ngOnInit() {
|
|
4973
|
+
if (this.options?.disableQueryParams) {
|
|
4974
|
+
return;
|
|
4975
|
+
}
|
|
4976
|
+
combineLatest([
|
|
4977
|
+
this.route.queryParams.pipe(map((params) => params.selection), distinct()),
|
|
4978
|
+
this.route.queryParams.pipe(map((params) => params.selected), distinct())
|
|
4979
|
+
]).pipe(takeUntil(this.unsubscribeAll$)).subscribe(([selection, selected]) => {
|
|
4980
|
+
if (!selection) {
|
|
4981
|
+
this.stateService.setQueryParams();
|
|
4982
|
+
return;
|
|
4983
|
+
}
|
|
4984
|
+
const newSelection = typeof selection === "string" ? [+selection] : selection.map((s) => +s);
|
|
4985
|
+
const newSelected = selected ? +selected : null;
|
|
4986
|
+
const { ids, active } = this.stateQuery.getValue();
|
|
4987
|
+
if (!ids.length || !ids.every((id) => newSelection.includes(id))) {
|
|
4988
|
+
this.stateService.setEntities(newSelection, newSelected);
|
|
4989
|
+
return;
|
|
4990
|
+
}
|
|
4991
|
+
if (newSelected && active !== newSelected) {
|
|
4992
|
+
this.stateService.setActive(newSelected);
|
|
4993
|
+
}
|
|
4994
|
+
});
|
|
4995
|
+
}
|
|
4996
|
+
ngOnDestroy() {
|
|
4997
|
+
this.unsubscribeAll$.next();
|
|
4998
|
+
this.unsubscribeAll$.complete();
|
|
4999
|
+
this.unsubscribeQuerySub$.next();
|
|
5000
|
+
this.unsubscribeQuerySub$.complete();
|
|
5001
|
+
}
|
|
5002
|
+
ngOnChanges(changes) {
|
|
5003
|
+
if ("options" in changes) {
|
|
5004
|
+
this.service.setOptions(this.options);
|
|
5005
|
+
}
|
|
5006
|
+
if ("state" in changes) {
|
|
5007
|
+
this.service.setState(this.state);
|
|
5008
|
+
this.stateService = this.selectableListService.withState(this.state, this.options);
|
|
5009
|
+
this.stateQuery = this.selectableListService.query(this.state);
|
|
5010
|
+
this.listenOnStateChanges();
|
|
5011
|
+
}
|
|
5012
|
+
}
|
|
5013
|
+
ngAfterContentInit() {
|
|
5014
|
+
this.service.setCheckboxes(this.checkboxes);
|
|
5015
|
+
}
|
|
5016
|
+
listenOnStateChanges() {
|
|
5017
|
+
this.unsubscribeQuerySub$.next();
|
|
5018
|
+
this.stateQuery.selectEntityAction([
|
|
5019
|
+
EntityActions.Add,
|
|
5020
|
+
EntityActions.Remove,
|
|
5021
|
+
EntityActions.Set
|
|
5022
|
+
]).pipe(takeUntil(this.unsubscribeQuerySub$)).subscribe(() => {
|
|
5023
|
+
this.stateService.setQueryParams();
|
|
5024
|
+
});
|
|
5025
|
+
this.stateQuery.selectActiveId().pipe(takeUntil(this.unsubscribeQuerySub$)).subscribe(() => this.stateService.setQueryParams());
|
|
5026
|
+
}
|
|
5027
|
+
}
|
|
5028
|
+
NiceSelectableListDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceSelectableListDirective, deps: [{ token: SelectableListContentService }, { token: NiceSelectableListService }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Directive });
|
|
5029
|
+
NiceSelectableListDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: NiceSelectableListDirective, selector: "[niceSelectableList]", inputs: { state: "state", options: "options" }, providers: [SelectableListContentService], queries: [{ propertyName: "checkboxes", predicate: NiceSelectableListCheckboxDirective, descendants: true }], usesOnChanges: true, ngImport: i0 });
|
|
5030
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceSelectableListDirective, decorators: [{
|
|
5031
|
+
type: Directive,
|
|
5032
|
+
args: [{
|
|
5033
|
+
selector: "[niceSelectableList]",
|
|
5034
|
+
providers: [SelectableListContentService]
|
|
5035
|
+
}]
|
|
5036
|
+
}], ctorParameters: function () { return [{ type: SelectableListContentService }, { type: NiceSelectableListService }, { type: i2.ActivatedRoute }]; }, propDecorators: { state: [{
|
|
5037
|
+
type: Input
|
|
5038
|
+
}], options: [{
|
|
5039
|
+
type: Input
|
|
5040
|
+
}], checkboxes: [{
|
|
5041
|
+
type: ContentChildren,
|
|
5042
|
+
args: [NiceSelectableListCheckboxDirective, { descendants: true }]
|
|
5043
|
+
}] } });
|
|
5044
|
+
|
|
5045
|
+
class NiceBaseFilterViewComponent {
|
|
5046
|
+
ngOnInit(autoLoad = true, { mode, loadConfig, configQueryParams } = {}) {
|
|
5047
|
+
if (mode) {
|
|
5048
|
+
this.filterViewService.setMode(mode);
|
|
5049
|
+
}
|
|
5050
|
+
this.autoLoad(autoLoad);
|
|
5051
|
+
this.loadConfig(loadConfig, configQueryParams);
|
|
5052
|
+
this.filterViewLoading$ = this.filterViewQuery.selectLoading();
|
|
5053
|
+
this.filterViewCount$ = this.filterViewQuery.selectCount();
|
|
5054
|
+
if (this.selectableListDirective) {
|
|
5055
|
+
this.filterViewService.updateSubState("selectable", { stateName: this.selectableListDirective.state });
|
|
5056
|
+
}
|
|
5057
|
+
}
|
|
5058
|
+
/**
|
|
5059
|
+
* Call the filter endpoint with the current filter parameters.
|
|
5060
|
+
*/
|
|
5061
|
+
loadData() {
|
|
5062
|
+
this.filterViewService.filter();
|
|
5063
|
+
}
|
|
5064
|
+
/**
|
|
5065
|
+
* Disable the filter view. This will stop calling any api routes.
|
|
5066
|
+
*/
|
|
5067
|
+
disable() {
|
|
5068
|
+
this.filterViewService.disable();
|
|
5069
|
+
}
|
|
5070
|
+
/**
|
|
5071
|
+
* Enable the filter view. This will resume calling any api routes.
|
|
5072
|
+
*/
|
|
5073
|
+
enable() {
|
|
5074
|
+
this.filterViewService.enable();
|
|
5075
|
+
}
|
|
5076
|
+
/**
|
|
5077
|
+
* Update the loading state
|
|
5078
|
+
*/
|
|
5079
|
+
setLoading(loading) {
|
|
5080
|
+
this.filterViewService.setLoading(loading);
|
|
5081
|
+
}
|
|
5082
|
+
/**
|
|
5083
|
+
* Set a set of rules that won't be saved in the current filterParameters config.
|
|
5084
|
+
* NOTE: These rules will be injected in each filter request.
|
|
5085
|
+
*/
|
|
5086
|
+
setBaseRules(rule, reload = true) {
|
|
5087
|
+
this.filterViewService.setBaseRules(rule, reload);
|
|
5088
|
+
}
|
|
5089
|
+
/**
|
|
5090
|
+
* Reset all rules with a new set of rules.
|
|
5091
|
+
*/
|
|
5092
|
+
setRules(rules, reload = true) {
|
|
5093
|
+
this.filterViewService.setRules(rules);
|
|
5094
|
+
if (reload) {
|
|
5095
|
+
this.filterViewService.filter();
|
|
5096
|
+
}
|
|
5097
|
+
}
|
|
5098
|
+
/**
|
|
5099
|
+
* Add or update a rule.
|
|
5100
|
+
* NOTE: This will only check for rules in the first element of the rules array in the current filterParameters.
|
|
5101
|
+
*/
|
|
5102
|
+
upsertRule(id, newRule, reload = true) {
|
|
5103
|
+
this.filterViewService.upsertRule(id, newRule);
|
|
5104
|
+
if (reload) {
|
|
5105
|
+
this.filterViewService.filter();
|
|
5106
|
+
}
|
|
5107
|
+
}
|
|
5108
|
+
/**
|
|
5109
|
+
* Remove a rule.
|
|
5110
|
+
* NOTE: This will only check for rules in the first element of the rules array in the current filterParameters.
|
|
5111
|
+
*/
|
|
5112
|
+
removeRule(id, reload = true) {
|
|
5113
|
+
this.filterViewService.removeRule(id);
|
|
5114
|
+
if (reload) {
|
|
5115
|
+
this.filterViewService.filter();
|
|
5116
|
+
}
|
|
5117
|
+
}
|
|
5118
|
+
autoLoad(autoLoad) {
|
|
5119
|
+
const { autoLoad: defaultAutoLoad } = this.filterViewQuery.getValue();
|
|
5120
|
+
if (!this.queryParams) {
|
|
5121
|
+
if (autoLoad && defaultAutoLoad) {
|
|
5122
|
+
this.filterViewService.filter();
|
|
5123
|
+
}
|
|
5124
|
+
else {
|
|
5125
|
+
this.filterViewService.setAutoLoad(autoLoad);
|
|
5126
|
+
}
|
|
5127
|
+
return;
|
|
5128
|
+
}
|
|
5129
|
+
if (!autoLoad && defaultAutoLoad) {
|
|
5130
|
+
this.filterViewService.setAutoLoad(autoLoad);
|
|
5131
|
+
return;
|
|
5132
|
+
}
|
|
5133
|
+
this.queryParams.init.pipe(take(1)).subscribe(() => this.loadData());
|
|
5134
|
+
}
|
|
5135
|
+
loadConfig(loadConfig, configQueryParams) {
|
|
5136
|
+
if (loadConfig === true) {
|
|
5137
|
+
this.filterViewService.loadConfig(configQueryParams);
|
|
5037
5138
|
return;
|
|
5038
5139
|
}
|
|
5039
|
-
if (
|
|
5040
|
-
this.checkbox.indeterminate = true;
|
|
5041
|
-
this.checkbox.checked = false;
|
|
5140
|
+
if (loadConfig === false) {
|
|
5042
5141
|
return;
|
|
5043
5142
|
}
|
|
5044
|
-
if (
|
|
5045
|
-
this.
|
|
5046
|
-
this.checkbox.indeterminate = false;
|
|
5143
|
+
if (this.advancedFiltersButton || this.advancedFilters) {
|
|
5144
|
+
this.filterViewService.loadConfig(configQueryParams);
|
|
5047
5145
|
}
|
|
5048
5146
|
}
|
|
5049
5147
|
}
|
|
5050
|
-
|
|
5051
|
-
|
|
5052
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type:
|
|
5053
|
-
type:
|
|
5148
|
+
NiceBaseFilterViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceBaseFilterViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5149
|
+
NiceBaseFilterViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceBaseFilterViewComponent, selector: "ng-component", viewQueries: [{ propertyName: "filterViewService", first: true, predicate: NiceFilterViewComponent, descendants: true, read: NiceFilterViewService, static: true }, { propertyName: "filterViewQuery", first: true, predicate: NiceFilterViewComponent, descendants: true, read: NiceFilterViewQuery, static: true }, { propertyName: "queryParams", first: true, predicate: NiceFilterQueryParamsDirective, descendants: true, static: true }, { propertyName: "advancedFiltersButton", first: true, predicate: NiceAdvancedFiltersButtonComponent, descendants: true, static: true }, { propertyName: "advancedFilters", first: true, predicate: NiceAdvancedFiltersComponent, descendants: true, static: true }, { propertyName: "selectableListDirective", first: true, predicate: NiceSelectableListDirective, descendants: true, static: true }], ngImport: i0, template: ``, isInline: true });
|
|
5150
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceBaseFilterViewComponent, decorators: [{
|
|
5151
|
+
type: Component,
|
|
5054
5152
|
args: [{
|
|
5055
|
-
|
|
5153
|
+
template: ``
|
|
5056
5154
|
}]
|
|
5057
|
-
}],
|
|
5058
|
-
type:
|
|
5059
|
-
|
|
5060
|
-
|
|
5155
|
+
}], propDecorators: { filterViewService: [{
|
|
5156
|
+
type: ViewChild,
|
|
5157
|
+
args: [NiceFilterViewComponent, { read: NiceFilterViewService, static: true }]
|
|
5158
|
+
}], filterViewQuery: [{
|
|
5159
|
+
type: ViewChild,
|
|
5160
|
+
args: [NiceFilterViewComponent, { read: NiceFilterViewQuery, static: true }]
|
|
5161
|
+
}], queryParams: [{
|
|
5162
|
+
type: ViewChild,
|
|
5163
|
+
args: [NiceFilterQueryParamsDirective, { static: true }]
|
|
5164
|
+
}], advancedFiltersButton: [{
|
|
5165
|
+
type: ViewChild,
|
|
5166
|
+
args: [NiceAdvancedFiltersButtonComponent, { static: true }]
|
|
5167
|
+
}], advancedFilters: [{
|
|
5168
|
+
type: ViewChild,
|
|
5169
|
+
args: [NiceAdvancedFiltersComponent, { static: true }]
|
|
5170
|
+
}], selectableListDirective: [{
|
|
5171
|
+
type: ViewChild,
|
|
5172
|
+
args: [NiceSelectableListDirective, { static: true }]
|
|
5061
5173
|
}] } });
|
|
5062
5174
|
|
|
5175
|
+
class NiceFilterViewModule {
|
|
5176
|
+
static forRoot(options) {
|
|
5177
|
+
return {
|
|
5178
|
+
ngModule: NiceFilterViewModule,
|
|
5179
|
+
providers: [
|
|
5180
|
+
{
|
|
5181
|
+
provide: FILTER_VIEW_ICONS,
|
|
5182
|
+
useValue: {
|
|
5183
|
+
...defaultIcons$1,
|
|
5184
|
+
...(options?.icons ?? {})
|
|
5185
|
+
}
|
|
5186
|
+
}
|
|
5187
|
+
].filter(x => !!x)
|
|
5188
|
+
};
|
|
5189
|
+
}
|
|
5190
|
+
static providerFactory(options) {
|
|
5191
|
+
return [
|
|
5192
|
+
{
|
|
5193
|
+
provide: NiceFilterService,
|
|
5194
|
+
useClass: options.filterService
|
|
5195
|
+
},
|
|
5196
|
+
{
|
|
5197
|
+
provide: EXPORTS_SETTINGS,
|
|
5198
|
+
useValue: options.exports ?? {
|
|
5199
|
+
pdf: true,
|
|
5200
|
+
xlsx: true,
|
|
5201
|
+
csv: true
|
|
5202
|
+
}
|
|
5203
|
+
},
|
|
5204
|
+
{
|
|
5205
|
+
provide: FILTER_VIEW_STATE,
|
|
5206
|
+
useValue: options.state ?? {}
|
|
5207
|
+
},
|
|
5208
|
+
{
|
|
5209
|
+
provide: FILTER_VIEW_STORE,
|
|
5210
|
+
useValue: options.store ?? { name: "nice-filter-view", resettable: true }
|
|
5211
|
+
}
|
|
5212
|
+
].filter(x => !!x);
|
|
5213
|
+
}
|
|
5214
|
+
}
|
|
5215
|
+
NiceFilterViewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
5216
|
+
NiceFilterViewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewModule, declarations: [NiceFilterViewComponent,
|
|
5217
|
+
NiceFilterCustomDataViewComponent,
|
|
5218
|
+
NiceFilterExportButtonsComponent,
|
|
5219
|
+
NiceFilterInfiniteScrollDataViewComponent,
|
|
5220
|
+
NiceFilterSearchComponent,
|
|
5221
|
+
NiceFilterDataDirective,
|
|
5222
|
+
NiceFilterExportDirective,
|
|
5223
|
+
NiceFilterMatTableViewDirective,
|
|
5224
|
+
NiceFilterMatSortSortingDirective,
|
|
5225
|
+
NiceFilterMatPaginatorPaginationDirective,
|
|
5226
|
+
NiceFilterQueryParamsDirective], imports: [TranslateModule,
|
|
5227
|
+
MatIconModule,
|
|
5228
|
+
FormsModule,
|
|
5229
|
+
AsyncPipe,
|
|
5230
|
+
NgIf,
|
|
5231
|
+
NgTemplateOutlet,
|
|
5232
|
+
MatTooltipModule,
|
|
5233
|
+
MatButtonModule,
|
|
5234
|
+
MatBottomSheetModule,
|
|
5235
|
+
NiceExportBottomSheetModule], exports: [NiceFilterViewComponent,
|
|
5236
|
+
NiceFilterCustomDataViewComponent,
|
|
5237
|
+
NiceFilterExportButtonsComponent,
|
|
5238
|
+
NiceFilterInfiniteScrollDataViewComponent,
|
|
5239
|
+
NiceFilterSearchComponent,
|
|
5240
|
+
NiceFilterDataDirective,
|
|
5241
|
+
NiceFilterExportDirective,
|
|
5242
|
+
NiceFilterMatTableViewDirective,
|
|
5243
|
+
NiceFilterMatSortSortingDirective,
|
|
5244
|
+
NiceFilterMatPaginatorPaginationDirective,
|
|
5245
|
+
NiceFilterQueryParamsDirective] });
|
|
5246
|
+
NiceFilterViewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewModule, imports: [TranslateModule,
|
|
5247
|
+
MatIconModule,
|
|
5248
|
+
FormsModule,
|
|
5249
|
+
MatTooltipModule,
|
|
5250
|
+
MatButtonModule,
|
|
5251
|
+
MatBottomSheetModule,
|
|
5252
|
+
NiceExportBottomSheetModule] });
|
|
5253
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceFilterViewModule, decorators: [{
|
|
5254
|
+
type: NgModule,
|
|
5255
|
+
args: [{
|
|
5256
|
+
imports: [
|
|
5257
|
+
TranslateModule,
|
|
5258
|
+
MatIconModule,
|
|
5259
|
+
FormsModule,
|
|
5260
|
+
AsyncPipe,
|
|
5261
|
+
NgIf,
|
|
5262
|
+
NgTemplateOutlet,
|
|
5263
|
+
MatTooltipModule,
|
|
5264
|
+
MatButtonModule,
|
|
5265
|
+
MatBottomSheetModule,
|
|
5266
|
+
NiceExportBottomSheetModule
|
|
5267
|
+
],
|
|
5268
|
+
declarations: [
|
|
5269
|
+
NiceFilterViewComponent,
|
|
5270
|
+
NiceFilterCustomDataViewComponent,
|
|
5271
|
+
NiceFilterExportButtonsComponent,
|
|
5272
|
+
NiceFilterInfiniteScrollDataViewComponent,
|
|
5273
|
+
NiceFilterSearchComponent,
|
|
5274
|
+
NiceFilterDataDirective,
|
|
5275
|
+
NiceFilterExportDirective,
|
|
5276
|
+
NiceFilterMatTableViewDirective,
|
|
5277
|
+
NiceFilterMatSortSortingDirective,
|
|
5278
|
+
NiceFilterMatPaginatorPaginationDirective,
|
|
5279
|
+
NiceFilterQueryParamsDirective
|
|
5280
|
+
],
|
|
5281
|
+
providers: [],
|
|
5282
|
+
exports: [
|
|
5283
|
+
NiceFilterViewComponent,
|
|
5284
|
+
NiceFilterCustomDataViewComponent,
|
|
5285
|
+
NiceFilterExportButtonsComponent,
|
|
5286
|
+
NiceFilterInfiniteScrollDataViewComponent,
|
|
5287
|
+
NiceFilterSearchComponent,
|
|
5288
|
+
NiceFilterDataDirective,
|
|
5289
|
+
NiceFilterExportDirective,
|
|
5290
|
+
NiceFilterMatTableViewDirective,
|
|
5291
|
+
NiceFilterMatSortSortingDirective,
|
|
5292
|
+
NiceFilterMatPaginatorPaginationDirective,
|
|
5293
|
+
NiceFilterQueryParamsDirective
|
|
5294
|
+
],
|
|
5295
|
+
}]
|
|
5296
|
+
}] });
|
|
5297
|
+
|
|
5298
|
+
class NicePreloadSelectedEntitiesProvider {
|
|
5299
|
+
}
|
|
5300
|
+
NicePreloadSelectedEntitiesProvider.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NicePreloadSelectedEntitiesProvider, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
5301
|
+
NicePreloadSelectedEntitiesProvider.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NicePreloadSelectedEntitiesProvider });
|
|
5302
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NicePreloadSelectedEntitiesProvider, decorators: [{
|
|
5303
|
+
type: Injectable
|
|
5304
|
+
}] });
|
|
5305
|
+
|
|
5063
5306
|
// tslint:disable-next-line:directive-class-suffix
|
|
5064
5307
|
class NiceSelectableListSelectAllDirective {
|
|
5065
5308
|
constructor(niceFilterViewQuery, service, selectableListService) {
|
|
@@ -5099,85 +5342,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
5099
5342
|
args: ["click"]
|
|
5100
5343
|
}] } });
|
|
5101
5344
|
|
|
5102
|
-
// tslint:disable-next-line:directive-class-suffix
|
|
5103
|
-
class NiceSelectableListDirective {
|
|
5104
|
-
constructor(service, selectableListService, route) {
|
|
5105
|
-
this.service = service;
|
|
5106
|
-
this.selectableListService = selectableListService;
|
|
5107
|
-
this.route = route;
|
|
5108
|
-
this.unsubscribeAll$ = new Subject();
|
|
5109
|
-
this.unsubscribeQuerySub$ = new Subject();
|
|
5110
|
-
}
|
|
5111
|
-
ngOnInit() {
|
|
5112
|
-
combineLatest([
|
|
5113
|
-
this.route.queryParams.pipe(map((params) => params.selection), distinct()),
|
|
5114
|
-
this.route.queryParams.pipe(map((params) => params.selected), distinct())
|
|
5115
|
-
]).pipe(takeUntil(this.unsubscribeAll$)).subscribe(([selection, selected]) => {
|
|
5116
|
-
if (!selection) {
|
|
5117
|
-
this.stateService.setQueryParams();
|
|
5118
|
-
return;
|
|
5119
|
-
}
|
|
5120
|
-
const newSelection = typeof selection === "string" ? [+selection] : selection.map((s) => +s);
|
|
5121
|
-
const newSelected = selected ? +selected : null;
|
|
5122
|
-
const { ids, active } = this.stateQuery.getValue();
|
|
5123
|
-
if (!ids.length || !ids.every((id) => newSelection.includes(id))) {
|
|
5124
|
-
this.stateService.setEntities(newSelection, newSelected);
|
|
5125
|
-
return;
|
|
5126
|
-
}
|
|
5127
|
-
if (newSelected && active !== newSelected) {
|
|
5128
|
-
this.stateService.setActive(newSelected);
|
|
5129
|
-
}
|
|
5130
|
-
});
|
|
5131
|
-
}
|
|
5132
|
-
ngOnDestroy() {
|
|
5133
|
-
this.unsubscribeAll$.next();
|
|
5134
|
-
this.unsubscribeAll$.complete();
|
|
5135
|
-
this.unsubscribeQuerySub$.next();
|
|
5136
|
-
this.unsubscribeQuerySub$.complete();
|
|
5137
|
-
}
|
|
5138
|
-
ngOnChanges(changes) {
|
|
5139
|
-
if ("options" in changes) {
|
|
5140
|
-
this.service.setOptions(this.options);
|
|
5141
|
-
}
|
|
5142
|
-
if ("state" in changes) {
|
|
5143
|
-
this.service.setState(this.state);
|
|
5144
|
-
this.stateService = this.selectableListService.withState(this.state);
|
|
5145
|
-
this.stateQuery = this.selectableListService.query(this.state);
|
|
5146
|
-
this.listenOnStateChanges();
|
|
5147
|
-
}
|
|
5148
|
-
}
|
|
5149
|
-
ngAfterContentInit() {
|
|
5150
|
-
this.service.setCheckboxes(this.checkboxes);
|
|
5151
|
-
}
|
|
5152
|
-
listenOnStateChanges() {
|
|
5153
|
-
this.unsubscribeQuerySub$.next();
|
|
5154
|
-
this.stateQuery.selectEntityAction([
|
|
5155
|
-
EntityActions.Add,
|
|
5156
|
-
EntityActions.Remove,
|
|
5157
|
-
EntityActions.Set
|
|
5158
|
-
]).pipe(takeUntil(this.unsubscribeQuerySub$)).subscribe(() => {
|
|
5159
|
-
this.stateService.setQueryParams();
|
|
5160
|
-
});
|
|
5161
|
-
this.stateQuery.selectActiveId().pipe(takeUntil(this.unsubscribeQuerySub$)).subscribe(() => this.stateService.setQueryParams());
|
|
5162
|
-
}
|
|
5163
|
-
}
|
|
5164
|
-
NiceSelectableListDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceSelectableListDirective, deps: [{ token: SelectableListContentService }, { token: NiceSelectableListService }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Directive });
|
|
5165
|
-
NiceSelectableListDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: NiceSelectableListDirective, selector: "[niceSelectableList]", inputs: { state: "state", options: "options" }, providers: [SelectableListContentService], queries: [{ propertyName: "checkboxes", predicate: NiceSelectableListCheckboxDirective, descendants: true }], usesOnChanges: true, ngImport: i0 });
|
|
5166
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceSelectableListDirective, decorators: [{
|
|
5167
|
-
type: Directive,
|
|
5168
|
-
args: [{
|
|
5169
|
-
selector: "[niceSelectableList]",
|
|
5170
|
-
providers: [SelectableListContentService]
|
|
5171
|
-
}]
|
|
5172
|
-
}], ctorParameters: function () { return [{ type: SelectableListContentService }, { type: NiceSelectableListService }, { type: i2.ActivatedRoute }]; }, propDecorators: { state: [{
|
|
5173
|
-
type: Input
|
|
5174
|
-
}], options: [{
|
|
5175
|
-
type: Input
|
|
5176
|
-
}], checkboxes: [{
|
|
5177
|
-
type: ContentChildren,
|
|
5178
|
-
args: [NiceSelectableListCheckboxDirective, { descendants: true }]
|
|
5179
|
-
}] } });
|
|
5180
|
-
|
|
5181
5345
|
class NiceSelectableListModule {
|
|
5182
5346
|
static register(...providers) {
|
|
5183
5347
|
return {
|