@recursyve/nice-data-filter-kit 16.0.0 → 16.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/esm2022/lib/components/nice-filter-view/components/advanced-filters/advanced-filters.module.mjs +4 -1
- package/esm2022/lib/components/nice-filter-view/components/advanced-filters/rule/components/options/options-filter.component.mjs +33 -0
- package/esm2022/lib/components/nice-filter-view/components/advanced-filters/rule/rule.component.mjs +9 -8
- package/esm2022/lib/components/nice-filter-view/components/advanced-filters/utils/advanced-filters.utils.mjs +2 -1
- package/esm2022/lib/components/query-builder/utils/qb-filter.utils.mjs +2 -1
- package/esm2022/lib/models/filter.model.mjs +2 -1
- package/fesm2022/recursyve-nice-data-filter-kit.mjs +30 -2
- package/fesm2022/recursyve-nice-data-filter-kit.mjs.map +1 -1
- package/lib/components/nice-filter-view/components/advanced-filters/advanced-filters.module.d.ts +23 -22
- package/lib/components/nice-filter-view/components/advanced-filters/rule/components/options/options-filter.component.d.ts +8 -0
- package/lib/models/filter.model.d.ts +4 -1
- package/package.json +1 -1
|
@@ -861,6 +861,7 @@ var FilterType;
|
|
|
861
861
|
FilterType["Date"] = "date";
|
|
862
862
|
FilterType["Select"] = "select";
|
|
863
863
|
FilterType["Radio"] = "radio";
|
|
864
|
+
FilterType["Options"] = "options";
|
|
864
865
|
})(FilterType || (FilterType = {}));
|
|
865
866
|
|
|
866
867
|
var FilterOperatorTypes;
|
|
@@ -954,6 +955,7 @@ class QBFilterUtils {
|
|
|
954
955
|
value: QBFilterUtils.isDoubleInput(operator) ? [new Date(), new Date()] : new Date()
|
|
955
956
|
};
|
|
956
957
|
case FilterType.Radio:
|
|
958
|
+
case FilterType.Options:
|
|
957
959
|
return {
|
|
958
960
|
...base,
|
|
959
961
|
value: QBFilterUtils.isDoubleInput(operator)
|
|
@@ -3689,6 +3691,7 @@ class AdvancedFiltersUtils {
|
|
|
3689
3691
|
value: AdvancedFiltersUtils.isDoubleInput(operator) ? [new Date(), new Date()] : new Date()
|
|
3690
3692
|
};
|
|
3691
3693
|
case FilterType.Radio:
|
|
3694
|
+
case FilterType.Options:
|
|
3692
3695
|
return {
|
|
3693
3696
|
...base,
|
|
3694
3697
|
value: AdvancedFiltersUtils.isDoubleInput(operator)
|
|
@@ -3777,6 +3780,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.5", ngImpor
|
|
|
3777
3780
|
], template: "<mat-form-field appearance=\"outline\" class=\"flex-auto\">\n <input matInput [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\" type=\"number\" />\n</mat-form-field>\n" }]
|
|
3778
3781
|
}] });
|
|
3779
3782
|
|
|
3783
|
+
class NiceAdvancedOptionsFilterComponent extends FilterComponent {
|
|
3784
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.5", ngImport: i0, type: NiceAdvancedOptionsFilterComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
3785
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.5", type: NiceAdvancedOptionsFilterComponent, selector: "nice-advanced-options-filter", inputs: { filterConfig: "filterConfig" }, providers: [
|
|
3786
|
+
{
|
|
3787
|
+
provide: NG_VALUE_ACCESSOR,
|
|
3788
|
+
useExisting: forwardRef(() => NiceAdvancedOptionsFilterComponent),
|
|
3789
|
+
multi: true
|
|
3790
|
+
}
|
|
3791
|
+
], usesInheritance: true, ngImport: i0, template: "<div class=\"mb-4\" *ngIf=\"filterConfig.selectionMode === 'radio'\">\n <mat-radio-group class=\"flex-auto\" [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\">\n <mat-radio-button class=\"mx-4\" *ngFor=\"let option of filterConfig.options\" [value]=\"option?.key\">\n {{ option?.name }}\n </mat-radio-button>\n </mat-radio-group>\n</div>\n\n<ng-container *ngIf=\"filterConfig.selectionMode === 'select'\">\n <mat-form-field appearance=\"outline\" class=\"flex-auto\">\n <mat-select [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\">\n <mat-option *ngFor=\"let option of filterConfig.options\" [value]=\"option.key\">\n {{ option?.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n</ng-container>", 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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { 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: 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: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
3792
|
+
}
|
|
3793
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.5", ngImport: i0, type: NiceAdvancedOptionsFilterComponent, decorators: [{
|
|
3794
|
+
type: Component,
|
|
3795
|
+
args: [{ selector: "nice-advanced-options-filter", encapsulation: ViewEncapsulation.None, providers: [
|
|
3796
|
+
{
|
|
3797
|
+
provide: NG_VALUE_ACCESSOR,
|
|
3798
|
+
useExisting: forwardRef(() => NiceAdvancedOptionsFilterComponent),
|
|
3799
|
+
multi: true
|
|
3800
|
+
}
|
|
3801
|
+
], template: "<div class=\"mb-4\" *ngIf=\"filterConfig.selectionMode === 'radio'\">\n <mat-radio-group class=\"flex-auto\" [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\">\n <mat-radio-button class=\"mx-4\" *ngFor=\"let option of filterConfig.options\" [value]=\"option?.key\">\n {{ option?.name }}\n </mat-radio-button>\n </mat-radio-group>\n</div>\n\n<ng-container *ngIf=\"filterConfig.selectionMode === 'select'\">\n <mat-form-field appearance=\"outline\" class=\"flex-auto\">\n <mat-select [ngModel]=\"value\" (ngModelChange)=\"onValueChange($event)\">\n <mat-option *ngFor=\"let option of filterConfig.options\" [value]=\"option.key\">\n {{ option?.name }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n</ng-container>" }]
|
|
3802
|
+
}], propDecorators: { filterConfig: [{
|
|
3803
|
+
type: Input
|
|
3804
|
+
}] } });
|
|
3805
|
+
|
|
3780
3806
|
class NiceAdvancedRadioFilterComponent extends FilterComponent {
|
|
3781
3807
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.5", ngImport: i0, type: NiceAdvancedRadioFilterComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
3782
3808
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.5", type: NiceAdvancedRadioFilterComponent, selector: "nice-advanced-radio-filter", inputs: { filterConfig: "filterConfig" }, providers: [
|
|
@@ -3905,11 +3931,11 @@ class NiceAdvancedRuleComponent {
|
|
|
3905
3931
|
}
|
|
3906
3932
|
}
|
|
3907
3933
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.5", ngImport: i0, type: NiceAdvancedRuleComponent, deps: [{ token: ADVANCED_FILTER_ICONS, optional: true }, { token: i1$1.FormGroupName }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3908
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.5", 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 }); }
|
|
3934
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.5", 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-options-filter\n *ngSwitchCase=\"'options'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-options-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-options-filter\n *ngSwitchCase=\"'options'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-options-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-options-filter\n *ngSwitchCase=\"'options'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-options-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: NiceAdvancedOptionsFilterComponent, selector: "nice-advanced-options-filter", inputs: ["filterConfig"] }, { 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 }); }
|
|
3909
3935
|
}
|
|
3910
3936
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.5", ngImport: i0, type: NiceAdvancedRuleComponent, decorators: [{
|
|
3911
3937
|
type: Component,
|
|
3912
|
-
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" }]
|
|
3938
|
+
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-options-filter\n *ngSwitchCase=\"'options'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-options-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-options-filter\n *ngSwitchCase=\"'options'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-options-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-options-filter\n *ngSwitchCase=\"'options'\"\n class=\"flex flex-auto\"\n formControlName=\"value\"\n [filterConfig]=\"filterConfig\"\n ></nice-advanced-options-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" }]
|
|
3913
3939
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
3914
3940
|
type: Optional
|
|
3915
3941
|
}, {
|
|
@@ -4068,6 +4094,7 @@ class NiceAdvancedFiltersModule {
|
|
|
4068
4094
|
NiceAdvancedRuleComponent,
|
|
4069
4095
|
NiceAdvancedDateFilterComponent,
|
|
4070
4096
|
NiceAdvancedNumberFilterComponent,
|
|
4097
|
+
NiceAdvancedOptionsFilterComponent,
|
|
4071
4098
|
NiceAdvancedRadioFilterComponent,
|
|
4072
4099
|
NiceAdvancedSelectFilterComponent,
|
|
4073
4100
|
NiceAdvancedTextFilterComponent,
|
|
@@ -4144,6 +4171,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.5", ngImpor
|
|
|
4144
4171
|
NiceAdvancedRuleComponent,
|
|
4145
4172
|
NiceAdvancedDateFilterComponent,
|
|
4146
4173
|
NiceAdvancedNumberFilterComponent,
|
|
4174
|
+
NiceAdvancedOptionsFilterComponent,
|
|
4147
4175
|
NiceAdvancedRadioFilterComponent,
|
|
4148
4176
|
NiceAdvancedSelectFilterComponent,
|
|
4149
4177
|
NiceAdvancedTextFilterComponent,
|