intelica-library-ui 0.1.181 → 0.1.183
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.
|
@@ -3527,6 +3527,12 @@ class MultiSelectComponent {
|
|
|
3527
3527
|
selectedOptions = [];
|
|
3528
3528
|
onChangeFn = () => { };
|
|
3529
3529
|
onTouchedFn = () => { };
|
|
3530
|
+
/**
|
|
3531
|
+
* @description Define custom class
|
|
3532
|
+
* @default ""
|
|
3533
|
+
* @type {boolean}
|
|
3534
|
+
*/
|
|
3535
|
+
customClass = "";
|
|
3530
3536
|
ngAfterViewInit() {
|
|
3531
3537
|
if (this.options.some((option) => typeof option !== "object")) {
|
|
3532
3538
|
this.optionValue = undefined;
|
|
@@ -3584,13 +3590,13 @@ class MultiSelectComponent {
|
|
|
3584
3590
|
this.onPanelHideEvent.emit(event);
|
|
3585
3591
|
}
|
|
3586
3592
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: MultiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3587
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: MultiSelectComponent, isStandalone: true, selector: "intelica-multi-select", inputs: { id: "id", options: "options", optionLabel: "optionLabel", optionValue: "optionValue", placeholder: "placeholder", showFilter: "showFilter", showAll: "showAll", allText: "allText", maxSelectedLabels: "maxSelectedLabels", appendTo: "appendTo", panelStyleClass: "panelStyleClass", virtualScroll: "virtualScroll", disabled: "disabled", selectedItemsLabel: "selectedItemsLabel", textColorClass: "textColorClass", group: "group", resetFilterOnHide: "resetFilterOnHide" }, outputs: { onChangeEvent: "onChange", onPanelShowEvent: "onPanelShow", onPanelHideEvent: "onPanelHide" }, providers: [
|
|
3593
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: MultiSelectComponent, isStandalone: true, selector: "intelica-multi-select", inputs: { id: "id", options: "options", optionLabel: "optionLabel", optionValue: "optionValue", placeholder: "placeholder", showFilter: "showFilter", showAll: "showAll", allText: "allText", maxSelectedLabels: "maxSelectedLabels", appendTo: "appendTo", panelStyleClass: "panelStyleClass", virtualScroll: "virtualScroll", disabled: "disabled", selectedItemsLabel: "selectedItemsLabel", textColorClass: "textColorClass", group: "group", resetFilterOnHide: "resetFilterOnHide", customClass: "customClass" }, outputs: { onChangeEvent: "onChange", onPanelShowEvent: "onPanelShow", onPanelHideEvent: "onPanelHide" }, providers: [
|
|
3588
3594
|
{
|
|
3589
3595
|
provide: NG_VALUE_ACCESSOR,
|
|
3590
3596
|
useExisting: forwardRef(() => MultiSelectComponent),
|
|
3591
3597
|
multi: true,
|
|
3592
3598
|
},
|
|
3593
|
-
], ngImport: i0, template: "<p-multiSelect\r\n [class]=\"textColorClass + ' prMultiselect'\"\r\n [disabled]=\"disabled\"\r\n [options]=\"options\"\r\n [(ngModel)]=\"selectedOptions\"\r\n [optionLabel]=\"optionLabel\"\r\n [optionValue]=\"optionValue\"\r\n [placeholder]=\"placeholder\"\r\n [maxSelectedLabels]=\"maxSelectedLabels\"\r\n [filter]=\"showFilter\"\r\n [showToggleAll]=\"false\"\r\n (onChange)=\"onChangeSelect($event)\"\r\n (onPanelHide)=\"onPanelHide($event)\"\r\n (onPanelShow)=\"onPanelShow($event)\"\r\n [appendTo]=\"appendTo\"\r\n [panelStyleClass]=\"panelStyleClass\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollOptions]=\"{ itemSize: 25, scrollHeight: '200px' }\"\r\n selectedItemsLabel=\"{0} {{\r\n selectedItemsLabel | term : GlobalTermService.languageCode\r\n }}\"\r\n [group]=\"group\"\r\n [resetFilterOnHide]=\"resetFilterOnHide\"\r\n>\r\n @if(showAll){\r\n <ng-template #header>\r\n <div class=\"prMultiselect__all\">\r\n <label [for]=\"id + '-all'\">\r\n <p-checkbox\r\n [inputId]=\"id + '-all'\"\r\n [binary]=\"true\"\r\n [(ngModel)]=\"checked\"\r\n (onChange)=\"toggleAllSelection($event)\"\r\n ></p-checkbox>\r\n {{ allText | term : GlobalTermService.languageCode }}\r\n </label>\r\n </div>\r\n </ng-template>\r\n }\r\n <ng-template let-group #group *ngIf=\"group\">\r\n <div class=\"flex items-center\">\r\n <span>{{ group.label }}</span>\r\n </div>\r\n </ng-template>\r\n</p-multiSelect>\r\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { 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: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i2$2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i5.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "pipe", type: TermPipe, name: "term" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
3599
|
+
], ngImport: i0, template: "<p-multiSelect\r\n [class]=\"textColorClass + ' prMultiselect'\"\r\n [disabled]=\"disabled\"\r\n [options]=\"options\"\r\n [(ngModel)]=\"selectedOptions\"\r\n [optionLabel]=\"optionLabel\"\r\n [optionValue]=\"optionValue\"\r\n [placeholder]=\"placeholder\"\r\n [maxSelectedLabels]=\"maxSelectedLabels\"\r\n [filter]=\"showFilter\"\r\n [showToggleAll]=\"false\"\r\n (onChange)=\"onChangeSelect($event)\"\r\n (onPanelHide)=\"onPanelHide($event)\"\r\n (onPanelShow)=\"onPanelShow($event)\"\r\n [appendTo]=\"appendTo\"\r\n [panelStyleClass]=\"panelStyleClass\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollOptions]=\"{ itemSize: 25, scrollHeight: '200px' }\"\r\n selectedItemsLabel=\"{0} {{\r\n selectedItemsLabel | term : GlobalTermService.languageCode\r\n }}\"\r\n [group]=\"group\"\r\n [resetFilterOnHide]=\"resetFilterOnHide\"\r\n [ngClass]=\"customClass\"\r\n>\r\n @if(showAll){\r\n <ng-template #header>\r\n <div class=\"prMultiselect__all\">\r\n <label [for]=\"id + '-all'\">\r\n <p-checkbox\r\n [inputId]=\"id + '-all'\"\r\n [binary]=\"true\"\r\n [(ngModel)]=\"checked\"\r\n (onChange)=\"toggleAllSelection($event)\"\r\n ></p-checkbox>\r\n {{ allText | term : GlobalTermService.languageCode }}\r\n </label>\r\n </div>\r\n </ng-template>\r\n }\r\n <ng-template let-group #group *ngIf=\"group\">\r\n <div class=\"flex items-center\">\r\n <span>{{ group.label }}</span>\r\n </div>\r\n </ng-template>\r\n</p-multiSelect>\r\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { 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: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i2$2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i5.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "pipe", type: TermPipe, name: "term" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
3594
3600
|
}
|
|
3595
3601
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: MultiSelectComponent, decorators: [{
|
|
3596
3602
|
type: Component,
|
|
@@ -3606,7 +3612,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
3606
3612
|
useExisting: forwardRef(() => MultiSelectComponent),
|
|
3607
3613
|
multi: true,
|
|
3608
3614
|
},
|
|
3609
|
-
], template: "<p-multiSelect\r\n [class]=\"textColorClass + ' prMultiselect'\"\r\n [disabled]=\"disabled\"\r\n [options]=\"options\"\r\n [(ngModel)]=\"selectedOptions\"\r\n [optionLabel]=\"optionLabel\"\r\n [optionValue]=\"optionValue\"\r\n [placeholder]=\"placeholder\"\r\n [maxSelectedLabels]=\"maxSelectedLabels\"\r\n [filter]=\"showFilter\"\r\n [showToggleAll]=\"false\"\r\n (onChange)=\"onChangeSelect($event)\"\r\n (onPanelHide)=\"onPanelHide($event)\"\r\n (onPanelShow)=\"onPanelShow($event)\"\r\n [appendTo]=\"appendTo\"\r\n [panelStyleClass]=\"panelStyleClass\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollOptions]=\"{ itemSize: 25, scrollHeight: '200px' }\"\r\n selectedItemsLabel=\"{0} {{\r\n selectedItemsLabel | term : GlobalTermService.languageCode\r\n }}\"\r\n [group]=\"group\"\r\n [resetFilterOnHide]=\"resetFilterOnHide\"\r\n>\r\n @if(showAll){\r\n <ng-template #header>\r\n <div class=\"prMultiselect__all\">\r\n <label [for]=\"id + '-all'\">\r\n <p-checkbox\r\n [inputId]=\"id + '-all'\"\r\n [binary]=\"true\"\r\n [(ngModel)]=\"checked\"\r\n (onChange)=\"toggleAllSelection($event)\"\r\n ></p-checkbox>\r\n {{ allText | term : GlobalTermService.languageCode }}\r\n </label>\r\n </div>\r\n </ng-template>\r\n }\r\n <ng-template let-group #group *ngIf=\"group\">\r\n <div class=\"flex items-center\">\r\n <span>{{ group.label }}</span>\r\n </div>\r\n </ng-template>\r\n</p-multiSelect>\r\n" }]
|
|
3615
|
+
], template: "<p-multiSelect\r\n [class]=\"textColorClass + ' prMultiselect'\"\r\n [disabled]=\"disabled\"\r\n [options]=\"options\"\r\n [(ngModel)]=\"selectedOptions\"\r\n [optionLabel]=\"optionLabel\"\r\n [optionValue]=\"optionValue\"\r\n [placeholder]=\"placeholder\"\r\n [maxSelectedLabels]=\"maxSelectedLabels\"\r\n [filter]=\"showFilter\"\r\n [showToggleAll]=\"false\"\r\n (onChange)=\"onChangeSelect($event)\"\r\n (onPanelHide)=\"onPanelHide($event)\"\r\n (onPanelShow)=\"onPanelShow($event)\"\r\n [appendTo]=\"appendTo\"\r\n [panelStyleClass]=\"panelStyleClass\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollOptions]=\"{ itemSize: 25, scrollHeight: '200px' }\"\r\n selectedItemsLabel=\"{0} {{\r\n selectedItemsLabel | term : GlobalTermService.languageCode\r\n }}\"\r\n [group]=\"group\"\r\n [resetFilterOnHide]=\"resetFilterOnHide\"\r\n [ngClass]=\"customClass\"\r\n>\r\n @if(showAll){\r\n <ng-template #header>\r\n <div class=\"prMultiselect__all\">\r\n <label [for]=\"id + '-all'\">\r\n <p-checkbox\r\n [inputId]=\"id + '-all'\"\r\n [binary]=\"true\"\r\n [(ngModel)]=\"checked\"\r\n (onChange)=\"toggleAllSelection($event)\"\r\n ></p-checkbox>\r\n {{ allText | term : GlobalTermService.languageCode }}\r\n </label>\r\n </div>\r\n </ng-template>\r\n }\r\n <ng-template let-group #group *ngIf=\"group\">\r\n <div class=\"flex items-center\">\r\n <span>{{ group.label }}</span>\r\n </div>\r\n </ng-template>\r\n</p-multiSelect>\r\n" }]
|
|
3610
3616
|
}], propDecorators: { id: [{
|
|
3611
3617
|
type: Input
|
|
3612
3618
|
}], options: [{
|
|
@@ -3650,6 +3656,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
3650
3656
|
}], onPanelHideEvent: [{
|
|
3651
3657
|
type: Output,
|
|
3652
3658
|
args: ["onPanelHide"]
|
|
3659
|
+
}], customClass: [{
|
|
3660
|
+
type: Input
|
|
3653
3661
|
}] } });
|
|
3654
3662
|
|
|
3655
3663
|
class FiltersComponent {
|
|
@@ -3706,6 +3714,7 @@ class FiltersComponent {
|
|
|
3706
3714
|
language = "en";
|
|
3707
3715
|
//Cantidad limite para mostrar buscador en select-filter
|
|
3708
3716
|
filterThreshold = 10;
|
|
3717
|
+
hasNoActiveClass = false;
|
|
3709
3718
|
constructor(cd) {
|
|
3710
3719
|
this.cd = cd;
|
|
3711
3720
|
}
|
|
@@ -3787,6 +3796,38 @@ class FiltersComponent {
|
|
|
3787
3796
|
filter.change.emit({ current: filter, all: this.filterDirectives });
|
|
3788
3797
|
}
|
|
3789
3798
|
}
|
|
3799
|
+
isUnselected(item) {
|
|
3800
|
+
const v = item.value;
|
|
3801
|
+
const d = item.defaultValue;
|
|
3802
|
+
if (v === null || v === undefined)
|
|
3803
|
+
return true;
|
|
3804
|
+
if (item.type === this.filterTypeEnum.Select) {
|
|
3805
|
+
if (Array.isArray(v)) {
|
|
3806
|
+
const defArr = Array.isArray(d) ? d : [];
|
|
3807
|
+
return v.length === 0 || this.arraysAreEqual(v, defArr);
|
|
3808
|
+
}
|
|
3809
|
+
return v === d;
|
|
3810
|
+
}
|
|
3811
|
+
if (item.type === this.filterTypeEnum.Text ||
|
|
3812
|
+
item.type === this.filterTypeEnum.TextArea) {
|
|
3813
|
+
return typeof v === "string" ? v.trim() === "" : v === d;
|
|
3814
|
+
}
|
|
3815
|
+
if (item.type === this.filterTypeEnum.Date) {
|
|
3816
|
+
if (Array.isArray(v)) {
|
|
3817
|
+
const defArr = Array.isArray(d) ? d : [];
|
|
3818
|
+
const sameLen = v.length === defArr.length;
|
|
3819
|
+
const sameDates = sameLen &&
|
|
3820
|
+
v.every((vx, i) => vx instanceof Date &&
|
|
3821
|
+
defArr[i] instanceof Date &&
|
|
3822
|
+
vx.getTime() === defArr[i].getTime());
|
|
3823
|
+
return v.every((x) => !x) || sameDates;
|
|
3824
|
+
}
|
|
3825
|
+
if (v instanceof Date && d instanceof Date)
|
|
3826
|
+
return v.getTime() === d.getTime();
|
|
3827
|
+
return !v;
|
|
3828
|
+
}
|
|
3829
|
+
return v === d || !v;
|
|
3830
|
+
}
|
|
3790
3831
|
toggleChildrenVisibility(filter) {
|
|
3791
3832
|
if (!filter.visibilityRules?.length)
|
|
3792
3833
|
return;
|
|
@@ -4252,7 +4293,7 @@ class FiltersComponent {
|
|
|
4252
4293
|
return response;
|
|
4253
4294
|
}
|
|
4254
4295
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FiltersComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4255
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: FiltersComponent, isStandalone: true, selector: "intelica-filters", inputs: { showButtons: "showButtons", customClass: "customClass", columns: "columns" }, outputs: { EmitApply: "EmitApply", EmitCancel: "EmitCancel" }, queries: [{ propertyName: "filterActionsButtonTemplate", first: true, predicate: ["filterActionsButton"], descendants: true, static: true }, { propertyName: "filterDirectives", predicate: FilterDirective }], usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"container overflow-hidden\"\r\n [ngStyle]=\"{ 'min-width': 313 * columns + 'px' }\"\r\n>\r\n <div class=\"row gy-3 filtersAnalytics\">\r\n @for (colIndex of columnsLengthArray; track colIndex) {\r\n <div class=\"inputRowGap\" [ngClass]=\"setColumnSize()\">\r\n @for (filter of filterDirectives; track filter) { @if (filter.visible &&\r\n !filter.parent && filter.index == colIndex) {\r\n <div class=\"mb-3\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template;\r\n context: { item: filter, index: getIndex(filter) }\r\n \"\r\n ></ng-container>\r\n </div>\r\n\r\n @for (child of filterDirectives; track child) { @if (child.visible &&\r\n child.parent === filter.name && child.index == colIndex) {\r\n <div class=\"mb-3\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template;\r\n context: { item: child, index: getIndex(child, filter) }\r\n \"\r\n ></ng-container>\r\n </div>\r\n } } } }\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n\r\n@if (showButtons) {\r\n<div class=\"btnBox btnBox--center mt-4\">\r\n <button\r\n pRipple\r\n class=\"grButton grButton--primary applyAnalytics\"\r\n (click)=\"clickApply()\"\r\n >\r\n <span>{{ \"Apply\" | term : GlobalTermService.languageCode }}</span>\r\n </button>\r\n <button\r\n pRipple\r\n class=\"grButton grButton--secondary cleanAnalytics\"\r\n (click)=\"clickCancel()\"\r\n >\r\n <span>{{ \"Clear\" | term : GlobalTermService.languageCode }}</span>\r\n </button>\r\n</div>\r\n}\r\n\r\n<!-- Template general -->\r\n<ng-template #template let-item=\"item\" let-index=\"index\">\r\n @if (item.visible) {\r\n <div\r\n class=\"formRowInput {{ item.filterClass }}\"\r\n [ngClass]=\"{ required: item.required }\"\r\n >\r\n @if (item.label && item.label.length > 0) {\r\n <div class=\"formRowInputLeft\">\r\n <div class=\"formRowInputNumber\">\r\n <span>{{ index }}</span>\r\n </div>\r\n <label [for]=\"item.name\">\r\n <span>{{ item.label }}</span>\r\n </label>\r\n </div>\r\n }\r\n <div class=\"formRowInputWrap align-items-center\">\r\n @if (item.type === filterTypeEnum.Select) {\r\n <ng-container\r\n *ngTemplateOutlet=\"select; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Text) {\r\n <ng-container\r\n *ngTemplateOutlet=\"text; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Checkbox) {\r\n <ng-container\r\n *ngTemplateOutlet=\"checkbox; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Date) {\r\n <ng-container\r\n *ngTemplateOutlet=\"date; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Template) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template_filter;\r\n context: { item: item, index: index }\r\n \"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.TextArea) {\r\n <ng-container\r\n *ngTemplateOutlet=\"text_area; context: { item: item, index: index }\"\r\n ></ng-container>\r\n } @if (filterActionsButtonTemplate && item.hasFilterActionsButton) {\r\n <ng-container\r\n *ngTemplateOutlet=\"filterActionsButtonTemplate\"\r\n ></ng-container>\r\n }\r\n </div>\r\n @if (item.showClean && hasValue(item)) {\r\n <button class=\"desactive formRowInputClear\" (click)=\"cleanValue(item)\">\r\n <i class=\"icon-times\"></i>\r\n </button>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<!-- Tipos de filtros -->\r\n<ng-template #select let-item=\"item\" let-index=\"index\">\r\n @if (item.multiple) {\r\n <intelica-multi-select\r\n [placeholder]=\"item.placeholder\"\r\n [options]=\"item.options\"\r\n [showFilter]=\"getOptionCount(item) > filterThreshold\"\r\n [resetFilterOnHide]=\"item.resetFilterOnHide\"\r\n [showAll]=\"item.showAll\"\r\n [optionLabel]=\"item.optionLabel\"\r\n [optionValue]=\"item.optionValue\"\r\n [disabled]=\"!item.enabled\"\r\n [(ngModel)]=\"item.value\"\r\n (onChange)=\"onChangeMultiple($event, item)\"\r\n [appendTo]=\"item.appendTo\"\r\n [panelStyleClass]=\"item.panelStyleClass\"\r\n [allText]=\"item.allText\"\r\n [maxSelectedLabels]=\"item.maxSelectedLabels\"\r\n [virtualScroll]=\"item.virtualScroll\"\r\n [selectedItemsLabel]=\"item.selectedItemsLabel\"\r\n [group]=\"item.group\"\r\n class=\"fullWidth\"\r\n ></intelica-multi-select>\r\n } @else {\r\n <p-select\r\n [options]=\"item.options\"\r\n [(ngModel)]=\"item.value\"\r\n [optionLabel]=\"item.optionLabel\"\r\n [optionValue]=\"item.optionValue\"\r\n [placeholder]=\"item.placeholder\"\r\n [disabled]=\"!item.enabled\"\r\n (onChange)=\"onChange($event, item)\"\r\n [filter]=\"getOptionCount(item) > filterThreshold\"\r\n [resetFilterOnHide]=\"item.resetFilterOnHide\"\r\n [appendTo]=\"item.appendTo\"\r\n [panelStyleClass]=\"item.panelStyleClass\"\r\n [virtualScroll]=\"item.virtualScroll\"\r\n [virtualScrollItemSize]=\"25\"\r\n [group]=\"item.group\"\r\n class=\"prSelect\"\r\n appendTo=\"body\"\r\n >\r\n <ng-template let-group #group *ngIf=\"item.group\">\r\n <div class=\"flex items-center\">\r\n <span>{{ group.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-select>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #text let-item=\"item\" let-index=\"index\">\r\n <input\r\n pInputText\r\n class=\"prInputText\"\r\n type=\"text\"\r\n [disabled]=\"!item.enabled\"\r\n [(ngModel)]=\"item.value\"\r\n [placeholder]=\"item.placeholder\"\r\n (keyup)=\"onKeyUp($event, item)\"\r\n [maxlength]=\"item.maxlength\"\r\n />\r\n</ng-template>\r\n\r\n<ng-template #checkbox let-item=\"item\" let-index=\"index\">\r\n <p-checkbox\r\n class=\"prCheckbox\"\r\n [(ngModel)]=\"item.value\"\r\n [binary]=\"true\"\r\n [disabled]=\"!item.enabled\"\r\n (onChange)=\"onChangeCheck($event, item)\"\r\n ></p-checkbox>\r\n</ng-template>\r\n\r\n<ng-template #date let-item=\"item\" let-index=\"index\">\r\n <p-datepicker\r\n [(ngModel)]=\"item.value\"\r\n [selectionMode]=\"item.range ? 'range' : 'single'\"\r\n [disabled]=\"!item.enabled\"\r\n [iconDisplay]=\"'input'\"\r\n [showIcon]=\"true\"\r\n (ngModelChange)=\"onChange($event, item)\"\r\n [view]=\"getDateView(item.dateMode)\"\r\n [dateFormat]=\"getDateFormat(item.dateMode)\"\r\n class=\"prDatePicker\"\r\n appendTo=\"body\"\r\n panelStyleClass=\"prDatePicker\"\r\n [placeholder]=\"getDateFormatPlaceholder(item.dateMode)\"\r\n [readonlyInput]=\"item.isReadOnly\"\r\n [minDate]=\"item.min\"\r\n [maxDate]=\"item.max\"\r\n ></p-datepicker>\r\n</ng-template>\r\n\r\n<ng-template #template_filter let-item=\"item\" let-index=\"index\">\r\n <ng-container *ngTemplateOutlet=\"item.content\"></ng-container>\r\n</ng-template>\r\n\r\n<ng-template #text_area let-item=\"item\" let-index=\"index\">\r\n <textarea\r\n pTextarea\r\n class=\"prInputText\"\r\n [disabled]=\"!item.enabled\"\r\n [(ngModel)]=\"item.value\"\r\n [placeholder]=\"item.placeholder\"\r\n (keyup)=\"onKeyUp($event, item)\"\r\n ></textarea>\r\n</ng-template>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$3.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "size", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: FormsModule }, { 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.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TermPipe, name: "term" }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i5.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i6.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i7.Textarea, selector: "[pTextarea]", inputs: ["autoResize", "variant", "fluid", "pSize"], outputs: ["onResize"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$2.Ripple, selector: "[pRipple]" }, { kind: "component", type: MultiSelectComponent, selector: "intelica-multi-select", inputs: ["id", "options", "optionLabel", "optionValue", "placeholder", "showFilter", "showAll", "allText", "maxSelectedLabels", "appendTo", "panelStyleClass", "virtualScroll", "disabled", "selectedItemsLabel", "textColorClass", "group", "resetFilterOnHide"], outputs: ["onChange", "onPanelShow", "onPanelHide"] }] });
|
|
4296
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: FiltersComponent, isStandalone: true, selector: "intelica-filters", inputs: { showButtons: "showButtons", customClass: "customClass", columns: "columns" }, outputs: { EmitApply: "EmitApply", EmitCancel: "EmitCancel" }, queries: [{ propertyName: "filterActionsButtonTemplate", first: true, predicate: ["filterActionsButton"], descendants: true, static: true }, { propertyName: "filterDirectives", predicate: FilterDirective }], usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"container overflow-hidden\"\r\n [ngStyle]=\"{ 'min-width': 313 * columns + 'px' }\"\r\n>\r\n <div class=\"row gy-3 filtersAnalytics\">\r\n @for (colIndex of columnsLengthArray; track colIndex) {\r\n <div class=\"inputRowGap\" [ngClass]=\"setColumnSize()\">\r\n @for (filter of filterDirectives; track filter) { @if (filter.visible &&\r\n !filter.parent && filter.index == colIndex) {\r\n <div class=\"mb-3\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template;\r\n context: { item: filter, index: getIndex(filter) }\r\n \"\r\n ></ng-container>\r\n </div>\r\n\r\n @for (child of filterDirectives; track child) { @if (child.visible &&\r\n child.parent === filter.name && child.index == colIndex) {\r\n <div class=\"mb-3\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template;\r\n context: { item: child, index: getIndex(child, filter) }\r\n \"\r\n ></ng-container>\r\n </div>\r\n } } } }\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n\r\n@if (showButtons) {\r\n<div class=\"btnBox btnBox--center mt-4\">\r\n <button\r\n pRipple\r\n class=\"grButton grButton--primary applyAnalytics\"\r\n (click)=\"clickApply()\"\r\n >\r\n <span>{{ \"Apply\" | term : GlobalTermService.languageCode }}</span>\r\n </button>\r\n <button\r\n pRipple\r\n class=\"grButton grButton--secondary cleanAnalytics\"\r\n (click)=\"clickCancel()\"\r\n >\r\n <span>{{ \"Clear\" | term : GlobalTermService.languageCode }}</span>\r\n </button>\r\n</div>\r\n}\r\n\r\n<!-- Template general -->\r\n<ng-template #template let-item=\"item\" let-index=\"index\">\r\n @if (item.visible) {\r\n <div\r\n class=\"formRowInput {{ item.filterClass }}\"\r\n [ngClass]=\"{ required: item.required }\"\r\n >\r\n @if (item.label && item.label.length > 0) {\r\n <div class=\"formRowInputLeft\">\r\n <div class=\"formRowInputNumber\">\r\n <span>{{ index }}</span>\r\n </div>\r\n <label [for]=\"item.name\">\r\n <span>{{ item.label }}</span>\r\n </label>\r\n </div>\r\n }\r\n <div class=\"formRowInputWrap align-items-center\">\r\n @if (item.type === filterTypeEnum.Select) {\r\n <ng-container\r\n *ngTemplateOutlet=\"select; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Text) {\r\n <ng-container\r\n *ngTemplateOutlet=\"text; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Checkbox) {\r\n <ng-container\r\n *ngTemplateOutlet=\"checkbox; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Date) {\r\n <ng-container\r\n *ngTemplateOutlet=\"date; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Template) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template_filter;\r\n context: { item: item, index: index }\r\n \"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.TextArea) {\r\n <ng-container\r\n *ngTemplateOutlet=\"text_area; context: { item: item, index: index }\"\r\n ></ng-container>\r\n } @if (filterActionsButtonTemplate && item.hasFilterActionsButton) {\r\n <ng-container\r\n *ngTemplateOutlet=\"filterActionsButtonTemplate\"\r\n ></ng-container>\r\n }\r\n </div>\r\n @if (item.showClean && hasValue(item)) {\r\n <button class=\"desactive formRowInputClear\" (click)=\"cleanValue(item)\">\r\n <i class=\"icon-times\"></i>\r\n </button>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<!-- Tipos de filtros -->\r\n<ng-template #select let-item=\"item\" let-index=\"index\">\r\n @if (item.multiple) {\r\n <intelica-multi-select\r\n [placeholder]=\"item.placeholder\"\r\n [options]=\"item.options\"\r\n [showFilter]=\"getOptionCount(item) > filterThreshold\"\r\n [resetFilterOnHide]=\"item.resetFilterOnHide\"\r\n [showAll]=\"item.showAll\"\r\n [optionLabel]=\"item.optionLabel\"\r\n [optionValue]=\"item.optionValue\"\r\n [disabled]=\"!item.enabled\"\r\n [(ngModel)]=\"item.value\"\r\n (onChange)=\"onChangeMultiple($event, item)\"\r\n [appendTo]=\"item.appendTo\"\r\n [panelStyleClass]=\"item.panelStyleClass\"\r\n [allText]=\"item.allText\"\r\n [maxSelectedLabels]=\"item.maxSelectedLabels\"\r\n [virtualScroll]=\"item.virtualScroll\"\r\n [selectedItemsLabel]=\"item.selectedItemsLabel\"\r\n [group]=\"item.group\"\r\n [customClass]=\"isUnselected(item) ? ' is-unselected' : ''\"\r\n [class]=\"'fullWidth'\"\r\n ></intelica-multi-select>\r\n } @else {\r\n <p-select\r\n [options]=\"item.options\"\r\n [(ngModel)]=\"item.value\"\r\n [optionLabel]=\"item.optionLabel\"\r\n [optionValue]=\"item.optionValue\"\r\n [placeholder]=\"item.placeholder\"\r\n [disabled]=\"!item.enabled\"\r\n (onChange)=\"onChange($event, item)\"\r\n [filter]=\"getOptionCount(item) > filterThreshold\"\r\n [resetFilterOnHide]=\"item.resetFilterOnHide\"\r\n [appendTo]=\"item.appendTo\"\r\n [panelStyleClass]=\"item.panelStyleClass\"\r\n [virtualScroll]=\"item.virtualScroll\"\r\n [virtualScrollItemSize]=\"25\"\r\n [group]=\"item.group\"\r\n [ngClass]=\"{ prSelect: true, 'is-unselected': isUnselected(item) }\"\r\n appendTo=\"body\"\r\n >\r\n <ng-template let-group #group *ngIf=\"item.group\">\r\n <div class=\"flex items-center\">\r\n <span>{{ group.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-select>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #text let-item=\"item\" let-index=\"index\">\r\n <input\r\n pInputText\r\n class=\"prInputText\"\r\n type=\"text\"\r\n [disabled]=\"!item.enabled\"\r\n [(ngModel)]=\"item.value\"\r\n [placeholder]=\"item.placeholder\"\r\n (keyup)=\"onKeyUp($event, item)\"\r\n [maxlength]=\"item.maxlength\"\r\n />\r\n</ng-template>\r\n\r\n<ng-template #checkbox let-item=\"item\" let-index=\"index\">\r\n <p-checkbox\r\n class=\"prCheckbox\"\r\n [(ngModel)]=\"item.value\"\r\n [binary]=\"true\"\r\n [disabled]=\"!item.enabled\"\r\n (onChange)=\"onChangeCheck($event, item)\"\r\n ></p-checkbox>\r\n</ng-template>\r\n\r\n<ng-template #date let-item=\"item\" let-index=\"index\">\r\n <p-datepicker\r\n [(ngModel)]=\"item.value\"\r\n [selectionMode]=\"item.range ? 'range' : 'single'\"\r\n [disabled]=\"!item.enabled\"\r\n [iconDisplay]=\"'input'\"\r\n [showIcon]=\"true\"\r\n (ngModelChange)=\"onChange($event, item)\"\r\n [view]=\"getDateView(item.dateMode)\"\r\n [dateFormat]=\"getDateFormat(item.dateMode)\"\r\n class=\"prDatePicker\"\r\n appendTo=\"body\"\r\n panelStyleClass=\"prDatePicker\"\r\n [placeholder]=\"getDateFormatPlaceholder(item.dateMode)\"\r\n [readonlyInput]=\"item.isReadOnly\"\r\n [minDate]=\"item.min\"\r\n [maxDate]=\"item.max\"\r\n ></p-datepicker>\r\n</ng-template>\r\n\r\n<ng-template #template_filter let-item=\"item\" let-index=\"index\">\r\n <ng-container *ngTemplateOutlet=\"item.content\"></ng-container>\r\n</ng-template>\r\n\r\n<ng-template #text_area let-item=\"item\" let-index=\"index\">\r\n <textarea\r\n pTextarea\r\n class=\"prInputText\"\r\n [disabled]=\"!item.enabled\"\r\n [(ngModel)]=\"item.value\"\r\n [placeholder]=\"item.placeholder\"\r\n (keyup)=\"onKeyUp($event, item)\"\r\n ></textarea>\r\n</ng-template>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$3.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "size", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: FormsModule }, { 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.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TermPipe, name: "term" }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i5.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i6.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i7.Textarea, selector: "[pTextarea]", inputs: ["autoResize", "variant", "fluid", "pSize"], outputs: ["onResize"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$2.Ripple, selector: "[pRipple]" }, { kind: "component", type: MultiSelectComponent, selector: "intelica-multi-select", inputs: ["id", "options", "optionLabel", "optionValue", "placeholder", "showFilter", "showAll", "allText", "maxSelectedLabels", "appendTo", "panelStyleClass", "virtualScroll", "disabled", "selectedItemsLabel", "textColorClass", "group", "resetFilterOnHide", "customClass"], outputs: ["onChange", "onPanelShow", "onPanelHide"] }] });
|
|
4256
4297
|
}
|
|
4257
4298
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FiltersComponent, decorators: [{
|
|
4258
4299
|
type: Component,
|
|
@@ -4269,7 +4310,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
4269
4310
|
TextareaModule,
|
|
4270
4311
|
RippleModule,
|
|
4271
4312
|
MultiSelectComponent,
|
|
4272
|
-
], template: "<div\r\n class=\"container overflow-hidden\"\r\n [ngStyle]=\"{ 'min-width': 313 * columns + 'px' }\"\r\n>\r\n <div class=\"row gy-3 filtersAnalytics\">\r\n @for (colIndex of columnsLengthArray; track colIndex) {\r\n <div class=\"inputRowGap\" [ngClass]=\"setColumnSize()\">\r\n @for (filter of filterDirectives; track filter) { @if (filter.visible &&\r\n !filter.parent && filter.index == colIndex) {\r\n <div class=\"mb-3\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template;\r\n context: { item: filter, index: getIndex(filter) }\r\n \"\r\n ></ng-container>\r\n </div>\r\n\r\n @for (child of filterDirectives; track child) { @if (child.visible &&\r\n child.parent === filter.name && child.index == colIndex) {\r\n <div class=\"mb-3\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template;\r\n context: { item: child, index: getIndex(child, filter) }\r\n \"\r\n ></ng-container>\r\n </div>\r\n } } } }\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n\r\n@if (showButtons) {\r\n<div class=\"btnBox btnBox--center mt-4\">\r\n <button\r\n pRipple\r\n class=\"grButton grButton--primary applyAnalytics\"\r\n (click)=\"clickApply()\"\r\n >\r\n <span>{{ \"Apply\" | term : GlobalTermService.languageCode }}</span>\r\n </button>\r\n <button\r\n pRipple\r\n class=\"grButton grButton--secondary cleanAnalytics\"\r\n (click)=\"clickCancel()\"\r\n >\r\n <span>{{ \"Clear\" | term : GlobalTermService.languageCode }}</span>\r\n </button>\r\n</div>\r\n}\r\n\r\n<!-- Template general -->\r\n<ng-template #template let-item=\"item\" let-index=\"index\">\r\n @if (item.visible) {\r\n <div\r\n class=\"formRowInput {{ item.filterClass }}\"\r\n [ngClass]=\"{ required: item.required }\"\r\n >\r\n @if (item.label && item.label.length > 0) {\r\n <div class=\"formRowInputLeft\">\r\n <div class=\"formRowInputNumber\">\r\n <span>{{ index }}</span>\r\n </div>\r\n <label [for]=\"item.name\">\r\n <span>{{ item.label }}</span>\r\n </label>\r\n </div>\r\n }\r\n <div class=\"formRowInputWrap align-items-center\">\r\n @if (item.type === filterTypeEnum.Select) {\r\n <ng-container\r\n *ngTemplateOutlet=\"select; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Text) {\r\n <ng-container\r\n *ngTemplateOutlet=\"text; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Checkbox) {\r\n <ng-container\r\n *ngTemplateOutlet=\"checkbox; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Date) {\r\n <ng-container\r\n *ngTemplateOutlet=\"date; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Template) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template_filter;\r\n context: { item: item, index: index }\r\n \"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.TextArea) {\r\n <ng-container\r\n *ngTemplateOutlet=\"text_area; context: { item: item, index: index }\"\r\n ></ng-container>\r\n } @if (filterActionsButtonTemplate && item.hasFilterActionsButton) {\r\n <ng-container\r\n *ngTemplateOutlet=\"filterActionsButtonTemplate\"\r\n ></ng-container>\r\n }\r\n </div>\r\n @if (item.showClean && hasValue(item)) {\r\n <button class=\"desactive formRowInputClear\" (click)=\"cleanValue(item)\">\r\n <i class=\"icon-times\"></i>\r\n </button>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<!-- Tipos de filtros -->\r\n<ng-template #select let-item=\"item\" let-index=\"index\">\r\n @if (item.multiple) {\r\n <intelica-multi-select\r\n [placeholder]=\"item.placeholder\"\r\n [options]=\"item.options\"\r\n [showFilter]=\"getOptionCount(item) > filterThreshold\"\r\n [resetFilterOnHide]=\"item.resetFilterOnHide\"\r\n [showAll]=\"item.showAll\"\r\n [optionLabel]=\"item.optionLabel\"\r\n [optionValue]=\"item.optionValue\"\r\n [disabled]=\"!item.enabled\"\r\n [(ngModel)]=\"item.value\"\r\n (onChange)=\"onChangeMultiple($event, item)\"\r\n [appendTo]=\"item.appendTo\"\r\n [panelStyleClass]=\"item.panelStyleClass\"\r\n [allText]=\"item.allText\"\r\n [maxSelectedLabels]=\"item.maxSelectedLabels\"\r\n [virtualScroll]=\"item.virtualScroll\"\r\n [selectedItemsLabel]=\"item.selectedItemsLabel\"\r\n [group]=\"item.group\"\r\n class=\"fullWidth\"\r\n ></intelica-multi-select>\r\n } @else {\r\n <p-select\r\n [options]=\"item.options\"\r\n [(ngModel)]=\"item.value\"\r\n [optionLabel]=\"item.optionLabel\"\r\n [optionValue]=\"item.optionValue\"\r\n [placeholder]=\"item.placeholder\"\r\n [disabled]=\"!item.enabled\"\r\n (onChange)=\"onChange($event, item)\"\r\n [filter]=\"getOptionCount(item) > filterThreshold\"\r\n [resetFilterOnHide]=\"item.resetFilterOnHide\"\r\n [appendTo]=\"item.appendTo\"\r\n [panelStyleClass]=\"item.panelStyleClass\"\r\n [virtualScroll]=\"item.virtualScroll\"\r\n [virtualScrollItemSize]=\"25\"\r\n [group]=\"item.group\"\r\n
|
|
4313
|
+
], template: "<div\r\n class=\"container overflow-hidden\"\r\n [ngStyle]=\"{ 'min-width': 313 * columns + 'px' }\"\r\n>\r\n <div class=\"row gy-3 filtersAnalytics\">\r\n @for (colIndex of columnsLengthArray; track colIndex) {\r\n <div class=\"inputRowGap\" [ngClass]=\"setColumnSize()\">\r\n @for (filter of filterDirectives; track filter) { @if (filter.visible &&\r\n !filter.parent && filter.index == colIndex) {\r\n <div class=\"mb-3\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template;\r\n context: { item: filter, index: getIndex(filter) }\r\n \"\r\n ></ng-container>\r\n </div>\r\n\r\n @for (child of filterDirectives; track child) { @if (child.visible &&\r\n child.parent === filter.name && child.index == colIndex) {\r\n <div class=\"mb-3\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template;\r\n context: { item: child, index: getIndex(child, filter) }\r\n \"\r\n ></ng-container>\r\n </div>\r\n } } } }\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n\r\n@if (showButtons) {\r\n<div class=\"btnBox btnBox--center mt-4\">\r\n <button\r\n pRipple\r\n class=\"grButton grButton--primary applyAnalytics\"\r\n (click)=\"clickApply()\"\r\n >\r\n <span>{{ \"Apply\" | term : GlobalTermService.languageCode }}</span>\r\n </button>\r\n <button\r\n pRipple\r\n class=\"grButton grButton--secondary cleanAnalytics\"\r\n (click)=\"clickCancel()\"\r\n >\r\n <span>{{ \"Clear\" | term : GlobalTermService.languageCode }}</span>\r\n </button>\r\n</div>\r\n}\r\n\r\n<!-- Template general -->\r\n<ng-template #template let-item=\"item\" let-index=\"index\">\r\n @if (item.visible) {\r\n <div\r\n class=\"formRowInput {{ item.filterClass }}\"\r\n [ngClass]=\"{ required: item.required }\"\r\n >\r\n @if (item.label && item.label.length > 0) {\r\n <div class=\"formRowInputLeft\">\r\n <div class=\"formRowInputNumber\">\r\n <span>{{ index }}</span>\r\n </div>\r\n <label [for]=\"item.name\">\r\n <span>{{ item.label }}</span>\r\n </label>\r\n </div>\r\n }\r\n <div class=\"formRowInputWrap align-items-center\">\r\n @if (item.type === filterTypeEnum.Select) {\r\n <ng-container\r\n *ngTemplateOutlet=\"select; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Text) {\r\n <ng-container\r\n *ngTemplateOutlet=\"text; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Checkbox) {\r\n <ng-container\r\n *ngTemplateOutlet=\"checkbox; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Date) {\r\n <ng-container\r\n *ngTemplateOutlet=\"date; context: { item: item, index: index }\"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.Template) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n template_filter;\r\n context: { item: item, index: index }\r\n \"\r\n ></ng-container>\r\n }\r\n <!---->\r\n @if (item.type === filterTypeEnum.TextArea) {\r\n <ng-container\r\n *ngTemplateOutlet=\"text_area; context: { item: item, index: index }\"\r\n ></ng-container>\r\n } @if (filterActionsButtonTemplate && item.hasFilterActionsButton) {\r\n <ng-container\r\n *ngTemplateOutlet=\"filterActionsButtonTemplate\"\r\n ></ng-container>\r\n }\r\n </div>\r\n @if (item.showClean && hasValue(item)) {\r\n <button class=\"desactive formRowInputClear\" (click)=\"cleanValue(item)\">\r\n <i class=\"icon-times\"></i>\r\n </button>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<!-- Tipos de filtros -->\r\n<ng-template #select let-item=\"item\" let-index=\"index\">\r\n @if (item.multiple) {\r\n <intelica-multi-select\r\n [placeholder]=\"item.placeholder\"\r\n [options]=\"item.options\"\r\n [showFilter]=\"getOptionCount(item) > filterThreshold\"\r\n [resetFilterOnHide]=\"item.resetFilterOnHide\"\r\n [showAll]=\"item.showAll\"\r\n [optionLabel]=\"item.optionLabel\"\r\n [optionValue]=\"item.optionValue\"\r\n [disabled]=\"!item.enabled\"\r\n [(ngModel)]=\"item.value\"\r\n (onChange)=\"onChangeMultiple($event, item)\"\r\n [appendTo]=\"item.appendTo\"\r\n [panelStyleClass]=\"item.panelStyleClass\"\r\n [allText]=\"item.allText\"\r\n [maxSelectedLabels]=\"item.maxSelectedLabels\"\r\n [virtualScroll]=\"item.virtualScroll\"\r\n [selectedItemsLabel]=\"item.selectedItemsLabel\"\r\n [group]=\"item.group\"\r\n [customClass]=\"isUnselected(item) ? ' is-unselected' : ''\"\r\n [class]=\"'fullWidth'\"\r\n ></intelica-multi-select>\r\n } @else {\r\n <p-select\r\n [options]=\"item.options\"\r\n [(ngModel)]=\"item.value\"\r\n [optionLabel]=\"item.optionLabel\"\r\n [optionValue]=\"item.optionValue\"\r\n [placeholder]=\"item.placeholder\"\r\n [disabled]=\"!item.enabled\"\r\n (onChange)=\"onChange($event, item)\"\r\n [filter]=\"getOptionCount(item) > filterThreshold\"\r\n [resetFilterOnHide]=\"item.resetFilterOnHide\"\r\n [appendTo]=\"item.appendTo\"\r\n [panelStyleClass]=\"item.panelStyleClass\"\r\n [virtualScroll]=\"item.virtualScroll\"\r\n [virtualScrollItemSize]=\"25\"\r\n [group]=\"item.group\"\r\n [ngClass]=\"{ prSelect: true, 'is-unselected': isUnselected(item) }\"\r\n appendTo=\"body\"\r\n >\r\n <ng-template let-group #group *ngIf=\"item.group\">\r\n <div class=\"flex items-center\">\r\n <span>{{ group.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-select>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #text let-item=\"item\" let-index=\"index\">\r\n <input\r\n pInputText\r\n class=\"prInputText\"\r\n type=\"text\"\r\n [disabled]=\"!item.enabled\"\r\n [(ngModel)]=\"item.value\"\r\n [placeholder]=\"item.placeholder\"\r\n (keyup)=\"onKeyUp($event, item)\"\r\n [maxlength]=\"item.maxlength\"\r\n />\r\n</ng-template>\r\n\r\n<ng-template #checkbox let-item=\"item\" let-index=\"index\">\r\n <p-checkbox\r\n class=\"prCheckbox\"\r\n [(ngModel)]=\"item.value\"\r\n [binary]=\"true\"\r\n [disabled]=\"!item.enabled\"\r\n (onChange)=\"onChangeCheck($event, item)\"\r\n ></p-checkbox>\r\n</ng-template>\r\n\r\n<ng-template #date let-item=\"item\" let-index=\"index\">\r\n <p-datepicker\r\n [(ngModel)]=\"item.value\"\r\n [selectionMode]=\"item.range ? 'range' : 'single'\"\r\n [disabled]=\"!item.enabled\"\r\n [iconDisplay]=\"'input'\"\r\n [showIcon]=\"true\"\r\n (ngModelChange)=\"onChange($event, item)\"\r\n [view]=\"getDateView(item.dateMode)\"\r\n [dateFormat]=\"getDateFormat(item.dateMode)\"\r\n class=\"prDatePicker\"\r\n appendTo=\"body\"\r\n panelStyleClass=\"prDatePicker\"\r\n [placeholder]=\"getDateFormatPlaceholder(item.dateMode)\"\r\n [readonlyInput]=\"item.isReadOnly\"\r\n [minDate]=\"item.min\"\r\n [maxDate]=\"item.max\"\r\n ></p-datepicker>\r\n</ng-template>\r\n\r\n<ng-template #template_filter let-item=\"item\" let-index=\"index\">\r\n <ng-container *ngTemplateOutlet=\"item.content\"></ng-container>\r\n</ng-template>\r\n\r\n<ng-template #text_area let-item=\"item\" let-index=\"index\">\r\n <textarea\r\n pTextarea\r\n class=\"prInputText\"\r\n [disabled]=\"!item.enabled\"\r\n [(ngModel)]=\"item.value\"\r\n [placeholder]=\"item.placeholder\"\r\n (keyup)=\"onKeyUp($event, item)\"\r\n ></textarea>\r\n</ng-template>\r\n" }]
|
|
4273
4314
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { showButtons: [{
|
|
4274
4315
|
type: Input
|
|
4275
4316
|
}], customClass: [{
|
|
@@ -6480,26 +6521,33 @@ class EchartService {
|
|
|
6480
6521
|
const y = barBase.yAxis;
|
|
6481
6522
|
const gr = barBase.grid;
|
|
6482
6523
|
const defaultCategoryFormatter = (value, index) => {
|
|
6524
|
+
const sangriaBase = '\u2008\u2008\u2008\u2008\u2008\u2008\u2009';
|
|
6483
6525
|
const lineLength = 35;
|
|
6526
|
+
const text = String(value ?? '');
|
|
6484
6527
|
const prefix = `${index + 1} - `;
|
|
6485
|
-
const
|
|
6486
|
-
let
|
|
6487
|
-
|
|
6488
|
-
|
|
6489
|
-
|
|
6490
|
-
|
|
6491
|
-
|
|
6492
|
-
|
|
6528
|
+
const digitCount = String(index + 1).length;
|
|
6529
|
+
let extraRepeat = 0;
|
|
6530
|
+
if (digitCount === 2)
|
|
6531
|
+
extraRepeat = 2;
|
|
6532
|
+
else if (digitCount === 3)
|
|
6533
|
+
extraRepeat = 5;
|
|
6534
|
+
const sangria = sangriaBase + '\u2008'.repeat(extraRepeat);
|
|
6535
|
+
const words = text.split(' ');
|
|
6536
|
+
const lines = [];
|
|
6537
|
+
let current = '';
|
|
6538
|
+
for (const w of words) {
|
|
6539
|
+
const test = current ? `${current} ${w}` : w;
|
|
6540
|
+
if (test.length <= lineLength)
|
|
6541
|
+
current = test;
|
|
6493
6542
|
else {
|
|
6494
|
-
|
|
6495
|
-
|
|
6543
|
+
if (current)
|
|
6544
|
+
lines.push(current);
|
|
6545
|
+
current = w;
|
|
6496
6546
|
}
|
|
6497
6547
|
}
|
|
6498
|
-
if (
|
|
6499
|
-
lines.push(
|
|
6500
|
-
return prefix + lines
|
|
6501
|
-
.map((line, i) => (i === 0 ? line : `\u2008\u2008\u2008\u2008\u2008\u2008\u2009${line}`))
|
|
6502
|
-
.join('\n');
|
|
6548
|
+
if (current)
|
|
6549
|
+
lines.push(current);
|
|
6550
|
+
return prefix + lines.map((ln, i) => (i === 0 ? ln : `${sangria}${ln}`)).join('\n');
|
|
6503
6551
|
};
|
|
6504
6552
|
y.inverse = true;
|
|
6505
6553
|
y.axisLabel = {
|