@n-isi-platform/design-system 1.0.42 → 1.0.43
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.
|
@@ -1866,6 +1866,7 @@ class DropdownComponent {
|
|
|
1866
1866
|
virtualScroll = false;
|
|
1867
1867
|
ariaFilterLabel;
|
|
1868
1868
|
optionValue;
|
|
1869
|
+
minPanelWidth;
|
|
1869
1870
|
getValueEvent = new EventEmitter();
|
|
1870
1871
|
constructor(translateService) {
|
|
1871
1872
|
this.translateService = translateService;
|
|
@@ -1892,7 +1893,7 @@ class DropdownComponent {
|
|
|
1892
1893
|
return this.translateService.instant('components.dropdown.emptyFilterList');
|
|
1893
1894
|
}
|
|
1894
1895
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DropdownComponent, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1895
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: DropdownComponent, isStandalone: true, selector: "lib-dropdown[group][controlName][name]", inputs: { name: "name", isMultiselect: "isMultiselect", selectedItemLabel: "selectedItemLabel", group: "group", controlName: "controlName", label: "label", optionList: "optionList", optionLabel: "optionLabel", optionalValue: "optionalValue", placeholder: "placeholder", accessibilityText: "accessibilityText", filter: "filter", filterBy: "filterBy", showClear: "showClear", isRequired: "isRequired", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", formStatus: "formStatus", nestedGroup: "nestedGroup", isLoading: "isLoading", appendTo: "appendTo", isLabelVisible: "isLabelVisible", emptyMessage: "emptyMessage", virtualScroll: "virtualScroll", ariaFilterLabel: "ariaFilterLabel", optionValue: "optionValue" }, outputs: { getValueEvent: "getValueEvent" }, ngImport: i0, template: "<div class='flex flex-column gap-1' [formGroup]=\"group\">\r\n <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n <label [for]=\"name\" class=\"mr-2\">\r\n {{ label }}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <p-select *ngIf=\"!isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : undefined\"\r\n [formControlName]=\"controlName\"\r\n [placeholder]='placeholder'\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [showClear]=\"group.get(controlName)?.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [optionValue]=\"optionValue\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [ariaFilterLabel]=\"ariaFilterLabel!\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-select>\r\n <p-multiselect\r\n *ngIf=\"isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : ''\"\r\n [formControlName]=\"controlName\"\r\n [optionValue]=\"optionValue\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [selectedItemsLabel]=\"dynamicItemsLabel\"\r\n [placeholder]=\"placeholder\"\r\n [showClear]=\"group.get(controlName)!.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-multiselect>\r\n <lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isDirty]=\"group.get(controlName)!.pristine\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [isNestedFormSubmit]=\"formStatus!.isNestedFormSubmit!\"\r\n [errorId]=\"name+'Error'\"\r\n ></lib-error>\r\n</div>\r\n", styles: ["::ng-deep .p-select-filter{border:1.75px solid #3E7C94!important}::ng-deep .p-select-filter::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-select-filter:hover{border:1.75px solid #ffa142!important}::ng-deep .p-select-filter:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-select{width:100%;height:39px;border:1.75px solid #3E7C94!important}::ng-deep .p-select::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-select:hover{border:1.75px solid #ffa142!important}::ng-deep .p-select:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-select .p-select-item.p-ripple{white-space:normal}::ng-deep .p-select:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}::ng-deep .p-select:not(.p-disabled).p-focus span{outline:none}::ng-deep .p-select .p-select-header{background-color:#3e7c94}::ng-deep .p-select .p-select-label.p-placeholder{font-style:italic;color:#848484}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-highlight{background:#3e7c94}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-focus{background:#d3d3d3;color:#000}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item-group:hover{cursor:default}::ng-deep .p-select .p-select-panel .p-select-header .p-select-filter-icon{top:.75rem}::ng-deep .p-multiselect{width:100%;border:1.75px solid #3E7C94!important}::ng-deep .p-multiselect::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-multiselect:hover{border:1.75px solid #ffa142!important}::ng-deep .p-multiselect:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-multiselect:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}::ng-deep .p-multiselect .p-multiselect-item{white-space:normal}::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label-container,::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label{width:100%;box-sizing:border-box}::ng-deep .p-multiselect .p-multiselect-label.p-placeholder{font-style:italic;color:#848484}::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight{background:#3e7c94}::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item-group:hover{cursor:default}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i3$1.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i5$1.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", "highlightOnSelect"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: ErrorComponent, selector: "lib-error", inputs: ["hasError", "isTouched", "isSubmitTriggered", "isNestedFormSubmit", "isDirty", "isRequired", "hasGroupError", "errorId"] }] });
|
|
1896
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: DropdownComponent, isStandalone: true, selector: "lib-dropdown[group][controlName][name]", inputs: { name: "name", isMultiselect: "isMultiselect", selectedItemLabel: "selectedItemLabel", group: "group", controlName: "controlName", label: "label", optionList: "optionList", optionLabel: "optionLabel", optionalValue: "optionalValue", placeholder: "placeholder", accessibilityText: "accessibilityText", filter: "filter", filterBy: "filterBy", showClear: "showClear", isRequired: "isRequired", tooltipPosition: "tooltipPosition", tooltipText: "tooltipText", formStatus: "formStatus", nestedGroup: "nestedGroup", isLoading: "isLoading", appendTo: "appendTo", isLabelVisible: "isLabelVisible", emptyMessage: "emptyMessage", virtualScroll: "virtualScroll", ariaFilterLabel: "ariaFilterLabel", optionValue: "optionValue", minPanelWidth: "minPanelWidth" }, outputs: { getValueEvent: "getValueEvent" }, ngImport: i0, template: "<div class='flex flex-column gap-1' [formGroup]=\"group\">\r\n <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n <label [for]=\"name\" class=\"mr-2\">\r\n {{ label }}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <p-select *ngIf=\"!isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : undefined\"\r\n [formControlName]=\"controlName\"\r\n [placeholder]='placeholder'\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [showClear]=\"group.get(controlName)?.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [optionValue]=\"optionValue\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [ariaFilterLabel]=\"ariaFilterLabel!\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n [panelStyle]=\"minPanelWidth ? {\r\n width: 'max-content',\r\n 'min-width': minPanelWidth,\r\n 'max-width': '90vw'\r\n } : null\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-select>\r\n <p-multiselect\r\n *ngIf=\"isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : ''\"\r\n [formControlName]=\"controlName\"\r\n [optionValue]=\"optionValue\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [selectedItemsLabel]=\"dynamicItemsLabel\"\r\n [placeholder]=\"placeholder\"\r\n [showClear]=\"group.get(controlName)!.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [panelStyle]=\"minPanelWidth ? {\r\n width: 'max-content',\r\n 'min-width': minPanelWidth,\r\n 'max-width': '90vw'\r\n } : null\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-multiselect>\r\n <lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isDirty]=\"group.get(controlName)!.pristine\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [isNestedFormSubmit]=\"formStatus!.isNestedFormSubmit!\"\r\n [errorId]=\"name+'Error'\"\r\n ></lib-error>\r\n</div>\r\n", styles: ["::ng-deep .p-select-filter{border:1.75px solid #3E7C94!important}::ng-deep .p-select-filter::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-select-filter:hover{border:1.75px solid #ffa142!important}::ng-deep .p-select-filter:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-select{width:100%;height:39px;border:1.75px solid #3E7C94!important}::ng-deep .p-select::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-select:hover{border:1.75px solid #ffa142!important}::ng-deep .p-select:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-select .p-select-item.p-ripple{white-space:normal}::ng-deep .p-select:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}::ng-deep .p-select:not(.p-disabled).p-focus span{outline:none}::ng-deep .p-select .p-select-header{background-color:#3e7c94}::ng-deep .p-select .p-select-label.p-placeholder{font-style:italic;color:#848484}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-highlight{background:#3e7c94}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-focus{background:#d3d3d3;color:#000}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item-group:hover{cursor:default}::ng-deep .p-select .p-select-panel .p-select-header .p-select-filter-icon{top:.75rem}::ng-deep .p-multiselect{width:100%;border:1.75px solid #3E7C94!important}::ng-deep .p-multiselect::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-multiselect:hover{border:1.75px solid #ffa142!important}::ng-deep .p-multiselect:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-multiselect:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}::ng-deep .p-multiselect .p-multiselect-item{white-space:normal}::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label-container,::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label{width:100%;box-sizing:border-box}::ng-deep .p-multiselect .p-multiselect-label.p-placeholder{font-style:italic;color:#848484}::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight{background:#3e7c94}::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item-group:hover{cursor:default}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i3$1.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i5$1.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", "highlightOnSelect"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: ErrorComponent, selector: "lib-error", inputs: ["hasError", "isTouched", "isSubmitTriggered", "isNestedFormSubmit", "isDirty", "isRequired", "hasGroupError", "errorId"] }] });
|
|
1896
1897
|
}
|
|
1897
1898
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DropdownComponent, decorators: [{
|
|
1898
1899
|
type: Component,
|
|
@@ -1906,7 +1907,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
1906
1907
|
PrimeTemplate,
|
|
1907
1908
|
MultiSelectModule,
|
|
1908
1909
|
ErrorComponent,
|
|
1909
|
-
], template: "<div class='flex flex-column gap-1' [formGroup]=\"group\">\r\n <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n <label [for]=\"name\" class=\"mr-2\">\r\n {{ label }}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <p-select *ngIf=\"!isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : undefined\"\r\n [formControlName]=\"controlName\"\r\n [placeholder]='placeholder'\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [showClear]=\"group.get(controlName)?.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [optionValue]=\"optionValue\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [ariaFilterLabel]=\"ariaFilterLabel!\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-select>\r\n <p-multiselect\r\n *ngIf=\"isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : ''\"\r\n [formControlName]=\"controlName\"\r\n [optionValue]=\"optionValue\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [selectedItemsLabel]=\"dynamicItemsLabel\"\r\n [placeholder]=\"placeholder\"\r\n [showClear]=\"group.get(controlName)!.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-multiselect>\r\n <lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isDirty]=\"group.get(controlName)!.pristine\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [isNestedFormSubmit]=\"formStatus!.isNestedFormSubmit!\"\r\n [errorId]=\"name+'Error'\"\r\n ></lib-error>\r\n</div>\r\n", styles: ["::ng-deep .p-select-filter{border:1.75px solid #3E7C94!important}::ng-deep .p-select-filter::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-select-filter:hover{border:1.75px solid #ffa142!important}::ng-deep .p-select-filter:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-select{width:100%;height:39px;border:1.75px solid #3E7C94!important}::ng-deep .p-select::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-select:hover{border:1.75px solid #ffa142!important}::ng-deep .p-select:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-select .p-select-item.p-ripple{white-space:normal}::ng-deep .p-select:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}::ng-deep .p-select:not(.p-disabled).p-focus span{outline:none}::ng-deep .p-select .p-select-header{background-color:#3e7c94}::ng-deep .p-select .p-select-label.p-placeholder{font-style:italic;color:#848484}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-highlight{background:#3e7c94}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-focus{background:#d3d3d3;color:#000}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item-group:hover{cursor:default}::ng-deep .p-select .p-select-panel .p-select-header .p-select-filter-icon{top:.75rem}::ng-deep .p-multiselect{width:100%;border:1.75px solid #3E7C94!important}::ng-deep .p-multiselect::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-multiselect:hover{border:1.75px solid #ffa142!important}::ng-deep .p-multiselect:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-multiselect:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}::ng-deep .p-multiselect .p-multiselect-item{white-space:normal}::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label-container,::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label{width:100%;box-sizing:border-box}::ng-deep .p-multiselect .p-multiselect-label.p-placeholder{font-style:italic;color:#848484}::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight{background:#3e7c94}::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item-group:hover{cursor:default}\n"] }]
|
|
1910
|
+
], template: "<div class='flex flex-column gap-1' [formGroup]=\"group\">\r\n <div class=\"flex\" *ngIf=\"isLabelVisible\">\r\n <label [for]=\"name\" class=\"mr-2\">\r\n {{ label }}<span class=\"required\" aria-label=\"Is required filed\" *ngIf=\"isRequired\">*</span>\r\n </label>\r\n <lib-tooltip\r\n *ngIf=\"_isTooltipVisible\"\r\n [position]=\"tooltipPosition\"\r\n [text]=\"tooltipText!\"\r\n ></lib-tooltip>\r\n </div>\r\n <p-select *ngIf=\"!isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : undefined\"\r\n [formControlName]=\"controlName\"\r\n [placeholder]='placeholder'\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [showClear]=\"group.get(controlName)?.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [optionValue]=\"optionValue\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [ariaFilterLabel]=\"ariaFilterLabel!\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n [panelStyle]=\"minPanelWidth ? {\r\n width: 'max-content',\r\n 'min-width': minPanelWidth,\r\n 'max-width': '90vw'\r\n } : null\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-select>\r\n <p-multiselect\r\n *ngIf=\"isMultiselect\"\r\n [inputId]=\"name\"\r\n [appendTo]=\"appendTo\"\r\n (onChange)='getSelectedValue($event)'\r\n [options]=\"optionList\"\r\n [optionLabel]=\"!nestedGroup ? optionLabel : ''\"\r\n [formControlName]=\"controlName\"\r\n [optionValue]=\"optionValue\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [virtualScrollItemSize]=\"38\"\r\n [group]=\"nestedGroup\"\r\n [filter]='filter'\r\n [filterBy]='filterBy'\r\n [selectedItemsLabel]=\"dynamicItemsLabel\"\r\n [placeholder]=\"placeholder\"\r\n [showClear]=\"group.get(controlName)!.value && showClear\"\r\n [ngClass]=\"{ 'ng-dirty': (group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!) }\"\r\n [attr.aria-label]=\"accessibilityText\"\r\n (onClear)=\"onClear()\"\r\n [emptyMessage]=\"emptyDropdownMessage\"\r\n [emptyFilterMessage]=\"emptyFilterDropdownMessage\"\r\n [dropdownIcon]=\"isLoading ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\r\n [panelStyle]=\"minPanelWidth ? {\r\n width: 'max-content',\r\n 'min-width': minPanelWidth,\r\n 'max-width': '90vw'\r\n } : null\"\r\n [attr.aria-describedby]=\"name + 'Error'\"\r\n [attr.aria-invalid]=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched || formStatus!.isSubmitTriggered))\"\r\n [attr.aria-required]=\"isRequired\"\r\n >\r\n <ng-template *ngIf=\"nestedGroup\" let-nestedGroup pTemplate=\"nestedGroup\">\r\n <div class=\"flex align-items-center\">\r\n <span>{{ nestedGroup.label }}</span>\r\n </div>\r\n </ng-template>\r\n </p-multiselect>\r\n <lib-error\r\n *ngIf=\"(group.get(controlName)!.errors && (group.get(controlName)!.touched) || formStatus!.isSubmitTriggered || formStatus!.isNestedFormSubmit!)\"\r\n [hasError]=\"group.get(controlName)!.errors\"\r\n [isDirty]=\"group.get(controlName)!.pristine\"\r\n [isTouched]=\"group.get(controlName)!.touched\"\r\n [isSubmitTriggered]=\"formStatus!.isSubmitTriggered!\"\r\n [isNestedFormSubmit]=\"formStatus!.isNestedFormSubmit!\"\r\n [errorId]=\"name+'Error'\"\r\n ></lib-error>\r\n</div>\r\n", styles: ["::ng-deep .p-select-filter{border:1.75px solid #3E7C94!important}::ng-deep .p-select-filter::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-select-filter:hover{border:1.75px solid #ffa142!important}::ng-deep .p-select-filter:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-select{width:100%;height:39px;border:1.75px solid #3E7C94!important}::ng-deep .p-select::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-select:hover{border:1.75px solid #ffa142!important}::ng-deep .p-select:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-select .p-select-item.p-ripple{white-space:normal}::ng-deep .p-select:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}::ng-deep .p-select:not(.p-disabled).p-focus span{outline:none}::ng-deep .p-select .p-select-header{background-color:#3e7c94}::ng-deep .p-select .p-select-label.p-placeholder{font-style:italic;color:#848484}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-highlight{background:#3e7c94}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item.p-focus{background:#d3d3d3;color:#000}::ng-deep .p-select .p-select-panel .p-select-items .p-select-item-group:hover{cursor:default}::ng-deep .p-select .p-select-panel .p-select-header .p-select-filter-icon{top:.75rem}::ng-deep .p-multiselect{width:100%;border:1.75px solid #3E7C94!important}::ng-deep .p-multiselect::placeholder{font-style:italic!important;color:#848484!important}::ng-deep .p-multiselect:hover{border:1.75px solid #ffa142!important}::ng-deep .p-multiselect:focus{box-shadow:0 0 2px 3px #ffa142!important}::ng-deep .p-multiselect:not(.p-disabled).p-focus{border:1.75px solid #1B495A;box-shadow:0 0 2px 3px #ffa142}::ng-deep .p-multiselect .p-multiselect-item{white-space:normal}::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label-container,::ng-deep .p-multiselect .containerClass .p-multiselect .p-multiselect-label{width:100%;box-sizing:border-box}::ng-deep .p-multiselect .p-multiselect-label.p-placeholder{font-style:italic;color:#848484}::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight{background:#3e7c94}::ng-deep .p-multiselect .p-multiselect-panel .p-multiselect-items .p-multiselect-item-group:hover{cursor:default}\n"] }]
|
|
1910
1911
|
}], ctorParameters: () => [{ type: i1$2.TranslateService }], propDecorators: { name: [{
|
|
1911
1912
|
type: Input
|
|
1912
1913
|
}], isMultiselect: [{
|
|
@@ -1959,6 +1960,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
1959
1960
|
type: Input
|
|
1960
1961
|
}], optionValue: [{
|
|
1961
1962
|
type: Input
|
|
1963
|
+
}], minPanelWidth: [{
|
|
1964
|
+
type: Input
|
|
1962
1965
|
}], getValueEvent: [{
|
|
1963
1966
|
type: Output
|
|
1964
1967
|
}] } });
|
|
@@ -2274,7 +2277,7 @@ class CustomTableComponent {
|
|
|
2274
2277
|
}
|
|
2275
2278
|
}
|
|
2276
2279
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CustomTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2277
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: CustomTableComponent, isStandalone: true, selector: "lib-custom-table[tableData][tableColumns]", inputs: { tableData: "tableData", tableColumns: "tableColumns", isPaginatorVisible: "isPaginatorVisible", tableRowCount: "tableRowCount", scrollable: "scrollable", scrollHeight: "scrollHeight", selectedProducts: "selectedProducts", isEditingTable: "isEditingTable", isTableLoading: "isTableLoading", hideColumnsOnMobile: "hideColumnsOnMobile", tableMinWidth: "tableMinWidth", isVirtualScrollButtonVisible: "isVirtualScrollButtonVisible", isVirtualScroll: "isVirtualScroll", virtualScrollRowSize: "virtualScrollRowSize", tableCaption: "tableCaption", captionColorClass: "captionColorClass", isCaptionButtonVisible: "isCaptionButtonVisible", captionButtonLabel: "captionButtonLabel", captionButtonColor: "captionButtonColor", isTableHeaderVisible: "isTableHeaderVisible", emptyColumnWidth: "emptyColumnWidth", toggleTableHeaderName: "toggleTableHeaderName", toggleWidth: "toggleWidth", toggleTwoTableHeaderName: "toggleTwoTableHeaderName", toggleTwoWidth: "toggleTwoWidth", toggleThreeTableHeaderName: "toggleThreeTableHeaderName", toggleThreeWidth: "toggleThreeWidth", toggleFourTableHeaderName: "toggleFourTableHeaderName", toggleFourWidth: "toggleFourWidth", rowColor: "rowColor", formGroup: "formGroup", type: "type", formStatus: "formStatus", tagColor: "tagColor", isWarningTextVisible: "isWarningTextVisible", isButtonOneVisible: "isButtonOneVisible", buttonLabel: "buttonLabel", buttonOneLabel: "buttonOneLabel", buttonOneHasIcon: "buttonOneHasIcon", buttonOneEditIcon: "buttonOneEditIcon", buttonOneSaveIcon: "buttonOneSaveIcon", buttonOneColor: "buttonOneColor", buttonOneIcon: "buttonOneIcon", isPlainTableIconButtonOne: "isPlainTableIconButtonOne", isPlainTableButtonOneLink: "isPlainTableButtonOneLink", isButtonTwoVisible: "isButtonTwoVisible", buttonTwoLabel: "buttonTwoLabel", buttonTwoHasIcon: "buttonTwoHasIcon", buttonTwoDeleteIcon: "buttonTwoDeleteIcon", buttonTwoCancelIcon: "buttonTwoCancelIcon", buttonTwoColor: "buttonTwoColor", buttonTwoIcon: "buttonTwoIcon", isPlainTableIconButtonTwo: "isPlainTableIconButtonTwo", isDeactivateToggle: "isDeactivateToggle", isDeactivateToggleTwo: "isDeactivateToggleTwo", isDeactivateToggleThree: "isDeactivateToggleThree", isDeactivateToggleFour: "isDeactivateToggleFour", showEllipsisFullText: "showEllipsisFullText" }, outputs: { captionButtonClicked: "captionButtonClicked", buttonEditClick: "buttonEditClick", buttonSaveClick: "buttonSaveClick", buttonOneClick: "buttonOneClick", buttonDeleteClick: "buttonDeleteClick", buttonTwoClick: "buttonTwoClick", toggleSwitch: "toggleSwitch", toggleTwoSwitch: "toggleTwoSwitch", toggleThreeSwitch: "toggleThreeSwitch", toggleFourSwitch: "toggleFourSwitch", checkboxOne: "checkboxOne" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["dt"], descendants: true }], ngImport: i0, template: "<p-table\r\n #dt\r\n [value]=\"tableData\"\r\n [paginator]=\"isPaginatorVisible\"\r\n [rows]=\"tableRowCount\"\r\n [showCurrentPageReport]=\"false\"\r\n [scrollable]=\"scrollable\"\r\n [scrollHeight]=\"scrollHeight\"\r\n dataKey=\"id\"\r\n editMode=\"row\"\r\n [ngClass]=\"captionColorClass\"\r\n [loading]=\"isTableLoading\"\r\n [tableStyle]=\"{'min-width': tableMinWidth}\"\r\n [virtualScroll]=\"isVirtualScroll\"\r\n [virtualScrollItemSize]=\"virtualScrollRowSize\"\r\n aria-live=\"polite\"\r\n>\r\n <ng-template pTemplate=\"caption\" *ngIf=\"!!tableCaption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n {{ tableCaption }}\r\n <span *ngIf=\"isVirtualScrollButtonVisible\"\r\n (click)=\"isVirtualScroll = !isVirtualScroll\"\r\n [ngStyle]=\"{'color': isVirtualScroll ? '' : 'lightgray'}\"\r\n class=\"pi pi-sort cursor-pointer\">\r\n </span>\r\n <lib-button\r\n *ngIf=\"isCaptionButtonVisible\"\r\n [label]=\"captionButtonLabel\"\r\n [color]=\"captionButtonColor\"\r\n (clickEvent)=\"clickCaptionButton($event)\"\r\n ></lib-button>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" *ngIf=\"isTableHeaderVisible\">\r\n <tr>\r\n <ng-container *ngFor=\"let column of tableColumns\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <th scope=\"col\" [style.width]=\"column.width\">\r\n {{ column.header | translate }}\r\n </th>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <th *ngFor=\"let _ of emptyHeaderColumnList\" [style.width]=\"emptyColumnWidth\" aria-hidden=\"true\"></th>\r\n <th *ngIf=\"!!toggleTableHeaderName\" scope=\"col\" [style.width]=\"toggleWidth\" class=\"vertical-align-middle\">\r\n {{ toggleTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleTwoTableHeaderName\" scope=\"col\" [style.width]=\"toggleTwoWidth\" class=\"vertical-align-middle\">\r\n {{ toggleTwoTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleThreeTableHeaderName\" scope=\"col\" [style.width]=\"toggleThreeWidth\" class=\"vertical-align-middle\">\r\n {{ toggleThreeTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleFourTableHeaderName\" scope=\"col\" [style.width]=\"toggleFourWidth\" class=\"vertical-align-middle\">\r\n {{ toggleFourTableHeaderName }}\r\n </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-editing=\"editing\" let-ri=\"rowIndex\">\r\n <!--\r\n Mare; 2024-09-19: dodajanje logike barvanja rowColor za /cms/notifications, delat mora pa tudi v /vsi-termini\r\n -->\r\n <tr [pEditableRow]=\"rowData\" #htmlTableRowElement\r\n [ngClass]=\"\r\n rowData?.cmsStatus ?\r\n (rowData?.cmsStatus === 'expired' ? 'disabled_row_color' :\r\n rowData?.cmsStatus === 'planned' ? '' :\r\n rowData?.cmsStatus === 'active' ? 'success_row_color' : '') :\r\n (!rowData?.registered ? rowColor : '')\r\n \">\r\n <ng-container *ngFor=\"let column of tableColumns; let colIndex = index\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <td [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Text input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'input'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-input\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [type]=\"column.inputType ? column.inputType : type\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n ></lib-input>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <ng-container *ngIf=\"column.isLink; else notLink\">\r\n <a href=\"{{ rowData[column.field] }}\" target=\"_blank\">\r\n {{ rowData[column.field] }}\r\n </a>\r\n </ng-container>\r\n <ng-template #notLink>\r\n {{ rowData[column.field] }} {{ column?.suffix }}\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Date input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'date'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-date-input\r\n appendTo=\"body\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [setMinAndMax]=\"false\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! | translate }}\"\r\n ></lib-date-input>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ rowData[column.field] | date: 'dd.MM.yyyy' }} {{ column?.suffix }}\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Date+Time output-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'dateTime'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ rowData[column.field] | date: 'dd.MM.yyyy, HH:mm' }} {{ column?.suffix }}\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- TextArea input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'textarea'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-textarea *ngIf=\"column.maxLength === -1\"\r\n [customMaxLength]=\"null\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n ></lib-textarea>\r\n <lib-textarea *ngIf=\"column.maxLength !== -1\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n ></lib-textarea>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <lib-tooltip\r\n [htmlParser]=\"true\"\r\n [text]=\"rowData[column.field]\"\r\n ></lib-tooltip>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Dropdown input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'dropdown'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-dropdown\r\n label=\"Moje naloge\"\r\n placeholder=\"Izberite\"\r\n optionLabel=\"name\"\r\n [showClear]=\"true\"\r\n [formStatus]=\"formStatus\"\r\n\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n\r\n filterBy=\"name\"\r\n [isLoading]=\"false\"\r\n [optionList]=\"overviewList\"\r\n [filter]=\"true\"\r\n [isRequired]=\"false\"\r\n ></lib-dropdown>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <lib-tooltip\r\n [htmlParser]=\"true\"\r\n [text]=\"rowData[column.field]\"\r\n ></lib-tooltip>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Switch input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'switch'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-toggle-switch\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [checked]=\"rowData[column.field]\"\r\n ></lib-toggle-switch>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ 'components.customTable.yes' | translate }}\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n {{ 'components.customTable.no' | translate }}\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Mare; dodal custom checkbox za izbiro vrstice -->\r\n <!-- [controlName] je oblike rowChecked_2024-04-11T11:35:00_c3cff776-dc06-40ec-bab5-7cab26e2014a -->\r\n <!-- column.field = rowChecked -->\r\n <!-- rowData[column?.control!] = 2024-04-11T11:35:00 (startDate) -->\r\n <!-- rowData[column?.control2!] = c3cff776-dc06-40ec-bab5-7cab26e2014a (uuid) -->\r\n <ng-container *ngIf=\"column.editable && column.component === 'checkbox'\">\r\n <lib-checkbox class=\"\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field + '_' + rowData[column?.control!] + '_' + rowData[column?.control2!]\"\r\n (clickCheckboxEvent)=\"clickCheckboxOne($event, rowData[column?.control!] + '_' + rowData[column?.control2!])\"\r\n label=\"\">\r\n </lib-checkbox>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-container *ngIf=\"!column.editable\">\r\n <ng-container *ngIf=\"column.tooltip || column.tag || column.status || column.ellipsis; else valueCell\">\r\n <!-- Tooltip -->\r\n <ng-container *ngIf=\"column.tooltip\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <lib-tooltip [htmlParser]=\"true\" [text]=\"getNestedValue(rowData, column.field)\"></lib-tooltip>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n /\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Ellipsis -->\r\n <ng-container *ngIf=\"column.ellipsis\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <span>\r\n {{ getNestedValue(rowData, column.field) }}\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n /\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Tag -->\r\n <ng-container *ngIf=\"column.tag && getNestedValue(rowData, column.field)\">\r\n <lib-tag [tagText]=\"getNestedValue(rowData, column.field)\" [tagColor]=\"rowData.tagColor\" [rounded]=\"true\"></lib-tag>\r\n </ng-container>\r\n\r\n <!-- Status -->\r\n <ng-container *ngIf=\"column.status\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <div style=\"background-color: #66952E; height: 25px; width: 75px;\"></div>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n <div style=\"background-color: #f44336; height: 25px; width: 75px;\"></div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #valueCell>\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field); else emptyCell\">\r\n <!-- Mare; dodal izjemo za 'cmsStatus' -->\r\n <ng-container *ngIf=\"column.field === 'cmsStatus'; else defaultContent\">\r\n {{ 'pages.cms.cmsStatus.' + getNestedValue(rowData, column.field) | translate }}\r\n </ng-container>\r\n <!-- Privzeta vsebina za vse ostale stolpce -->\r\n <ng-template #defaultContent>\r\n {{ column.suffix ? getNestedValue(rowData, column.field) + ' ' + column.suffix : getNestedValue(rowData, column.field) }}\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <p class=\"text-red-500 custom-small-text\" *ngIf=\"colIndex === 0 && rowData?.administrativeProcedure?.localJurisdiction && isWarningTextVisible\">\r\n <br/> {{ 'components.customTable.notification' | translate }}\r\n </p>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Button column one -->\r\n <td *ngIf=\"isButtonOneVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Editing table-->\r\n <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n <lib-icon-button\r\n *ngIf=\"!editing\"\r\n pInitEditableRow\r\n [color]=\"buttonOneColor\"\r\n [icon]=\"buttonOneEditIcon\"\r\n (click)='onRowEdit(rowData)'\r\n ></lib-icon-button>\r\n <lib-icon-button\r\n *ngIf=\"editing\"\r\n [color]=\"buttonOneColor!\"\r\n [icon]=\"buttonOneSaveIcon\"\r\n (click)='onRowSave(rowData, htmlTableRowElement)'\r\n ></lib-icon-button>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-template #plainTable>\r\n <ng-container\r\n *ngIf=\"(rowData?.administrativeProcedure === undefined || rowData?.administrativeProcedure?.detailsUrl !== null) && !isPlainTableIconButtonOne\"\r\n >\r\n <lib-button\r\n *ngIf=\"!isPlainTableButtonOneLink\"\r\n [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n [hasIcon]=\"buttonOneHasIcon!\"\r\n [color]=\"rowData?.buttonColor ? rowData.buttonColor : buttonOneColor!\"\r\n [icon]=\"buttonOneIcon!\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-button>\r\n <lib-button-link\r\n *ngIf=\"isPlainTableButtonOneLink\"\r\n [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n [isPrimary]=\"true\"\r\n [hasIcon]=\"buttonOneHasIcon!\"\r\n [icon]=\"buttonOneIcon! + ' md:ml-2'\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-button-link>\r\n </ng-container>\r\n <lib-icon-button\r\n *ngIf=\"isPlainTableIconButtonOne\"\r\n [color]=\"buttonOneColor!\"\r\n [icon]=\"buttonOneSaveIcon\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-icon-button>\r\n </ng-template>\r\n </td>\r\n\r\n <!-- Button column two -->\r\n <td *ngIf=\"isButtonTwoVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Editing table-->\r\n <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n <lib-icon-button\r\n *ngIf=\"!editing\"\r\n [color]=\"buttonTwoColor\"\r\n [icon]=\"buttonTwoDeleteIcon\"\r\n (click)='onRowDelete(rowData)'\r\n ></lib-icon-button>\r\n <lib-icon-button\r\n *ngIf=\"editing\"\r\n [color]=\"buttonTwoColor\"\r\n [icon]=\"buttonTwoCancelIcon\"\r\n (click)=\"onRowCancel(rowData)\"\r\n ></lib-icon-button>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-template #plainTable>\r\n <lib-button\r\n *ngIf=\"!isPlainTableIconButtonTwo\"\r\n [label]=\"buttonTwoLabel!\"\r\n [hasIcon]=\"buttonTwoHasIcon!\"\r\n [color]=\"buttonTwoColor!\"\r\n [icon]=\"buttonTwoIcon!\"\r\n (click)='clickButtonTwo(rowData)'\r\n ></lib-button>\r\n <lib-icon-button\r\n *ngIf=\"isPlainTableIconButtonTwo\"\r\n [color]=\"buttonTwoColor!\"\r\n [icon]=\"buttonTwoDeleteIcon\"\r\n (click)='clickButtonTwo(rowData)'\r\n ></lib-icon-button>\r\n </ng-template>\r\n </td>\r\n\r\n <!-- Deactivate toggle -->\r\n <td *ngIf=\"isDeactivateToggle\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isEnabled\"\r\n (getValueEvent)=\"toggleEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle two -->\r\n <td *ngIf=\"isDeactivateToggleTwo\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isAppointmentEnabled\"\r\n (getValueEvent)=\"toggleTwoEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle three -->\r\n <td *ngIf=\"isDeactivateToggleThree\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isNotificationEnabled\"\r\n (getValueEvent)=\"toggleThreeEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle four -->\r\n <td *ngIf=\"isDeactivateToggleFour\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isVrstomatEnabled\"\r\n (getValueEvent)=\"toggleFourEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n", styles: [":host ::ng-deep .future .p-datatable-header{background:#b2414d}:host ::ng-deep .past .p-datatable-header{background:#6d7375}:host ::ng-deep .p-datatable{border:1px solid #3E7C94;border-radius:8px;overflow:hidden;padding:0}:host ::ng-deep .p-datatable .p-datatable-header{border:none;color:#fff;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td{background:#d9d9d9;border:none;color:#1b495a;font-weight:unset;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:first-child,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:first-child{width:400px}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:nth-child(2),:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:nth-child(2){width:150px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:transparent;height:50px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.success_row_color{background:#66952eb3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.disabled_row_color{background:#b4b4b4b3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{border-color:#3e7c94;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr:first-child>td{border-color:transparent}:host ::ng-deep .p-datatable .table-icon-button{width:50px}:host ::ng-deep .p-paginator{background:transparent}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:#3e7c94;border-color:#3e7c94}@media(max-width:600px){:host ::ng-deep .p-datatable .p-datatable-header{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:.5rem}}.disabled-row{opacity:.5;pointer-events:none}.custom-small-text{font-size:.8rem;line-height:.9}.ellipsis-text{cursor:n-resize}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$8.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i1$8.CellEditor, selector: "p-cellEditor" }, { kind: "directive", type: i1$8.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "directive", type: i1$8.InitEditableRow, selector: "[pInitEditableRow]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: InputComponent, selector: "lib-input[group][controlName][name]", inputs: ["name", "type", "label", "placeholder", "accessibilityText", "group", "controlName", "isRequired", "isLabelVisible", "tooltipPosition", "tooltipText", "formStatus", "groupError", "hasGap", "hasTitle", "maxLength"] }, { kind: "component", type: DateInputComponent, selector: "lib-date-input[group][controlName][name]", inputs: ["isLabelVisible", "name", "label", "placeholder", "accessibilityText", "isRequired", "tooltipPosition", "tooltipText", "dateFormat", "group", "controlName", "showIcon", "selectionMode", "touchUI", "formStatus", "showClear", "isPublicDate", "minDate", "maxDate", "minDateToday", "maxDateSixMonths", "maxDateThreeMonths", "maxDateRangeOneYear", "setMinAndMax", "hasGap", "disabledDates", "appendTo", "groupError", "showTime", "availableDates", "disabledDays", "disabledWeekends"], outputs: ["onSelect"] }, { kind: "component", type: TextareaComponent, selector: "lib-textarea[group][controlName][name]", inputs: ["name", "resize", "label", "placeholder", "accessibilityText", "rows", "cols", "tooltipPosition", "tooltipText", "group", "controlName", "isRequired", "formStatus", "hasGap", "customMaxLength"], outputs: ["onBlurEvent"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "component", type: DropdownComponent, selector: "lib-dropdown[group][controlName][name]", inputs: ["name", "isMultiselect", "selectedItemLabel", "group", "controlName", "label", "optionList", "optionLabel", "optionalValue", "placeholder", "accessibilityText", "filter", "filterBy", "showClear", "isRequired", "tooltipPosition", "tooltipText", "formStatus", "nestedGroup", "isLoading", "appendTo", "isLabelVisible", "emptyMessage", "virtualScroll", "ariaFilterLabel", "optionValue"], outputs: ["getValueEvent"] }, { kind: "component", type: ToggleSwitchComponent, selector: "lib-toggle-switch", inputs: ["group", "controlName", "isFormElement", "checked", "disabled"], outputs: ["getValueEvent", "checkedChanged"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox[group][controlName][label]", inputs: ["label", "group", "controlName", "value", "formStatus", "ariaLabel"], outputs: ["clickCheckboxEvent"] }, { kind: "component", type: TagComponent, selector: "lib-tag", inputs: ["tagText", "tagColor", "rounded"] }, { kind: "component", type: IconButtonComponent, selector: "lib-icon-button", inputs: ["icon", "disabled", "color", "styleClass", "size"], outputs: ["clickEvent"] }, { kind: "component", type: ButtonLinkComponent, selector: "lib-button-link", inputs: ["hasIcon", "label", "isDanger", "isPrimary", "icon", "target", "accessibilityText"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "date" }] });
|
|
2280
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: CustomTableComponent, isStandalone: true, selector: "lib-custom-table[tableData][tableColumns]", inputs: { tableData: "tableData", tableColumns: "tableColumns", isPaginatorVisible: "isPaginatorVisible", tableRowCount: "tableRowCount", scrollable: "scrollable", scrollHeight: "scrollHeight", selectedProducts: "selectedProducts", isEditingTable: "isEditingTable", isTableLoading: "isTableLoading", hideColumnsOnMobile: "hideColumnsOnMobile", tableMinWidth: "tableMinWidth", isVirtualScrollButtonVisible: "isVirtualScrollButtonVisible", isVirtualScroll: "isVirtualScroll", virtualScrollRowSize: "virtualScrollRowSize", tableCaption: "tableCaption", captionColorClass: "captionColorClass", isCaptionButtonVisible: "isCaptionButtonVisible", captionButtonLabel: "captionButtonLabel", captionButtonColor: "captionButtonColor", isTableHeaderVisible: "isTableHeaderVisible", emptyColumnWidth: "emptyColumnWidth", toggleTableHeaderName: "toggleTableHeaderName", toggleWidth: "toggleWidth", toggleTwoTableHeaderName: "toggleTwoTableHeaderName", toggleTwoWidth: "toggleTwoWidth", toggleThreeTableHeaderName: "toggleThreeTableHeaderName", toggleThreeWidth: "toggleThreeWidth", toggleFourTableHeaderName: "toggleFourTableHeaderName", toggleFourWidth: "toggleFourWidth", rowColor: "rowColor", formGroup: "formGroup", type: "type", formStatus: "formStatus", tagColor: "tagColor", isWarningTextVisible: "isWarningTextVisible", isButtonOneVisible: "isButtonOneVisible", buttonLabel: "buttonLabel", buttonOneLabel: "buttonOneLabel", buttonOneHasIcon: "buttonOneHasIcon", buttonOneEditIcon: "buttonOneEditIcon", buttonOneSaveIcon: "buttonOneSaveIcon", buttonOneColor: "buttonOneColor", buttonOneIcon: "buttonOneIcon", isPlainTableIconButtonOne: "isPlainTableIconButtonOne", isPlainTableButtonOneLink: "isPlainTableButtonOneLink", isButtonTwoVisible: "isButtonTwoVisible", buttonTwoLabel: "buttonTwoLabel", buttonTwoHasIcon: "buttonTwoHasIcon", buttonTwoDeleteIcon: "buttonTwoDeleteIcon", buttonTwoCancelIcon: "buttonTwoCancelIcon", buttonTwoColor: "buttonTwoColor", buttonTwoIcon: "buttonTwoIcon", isPlainTableIconButtonTwo: "isPlainTableIconButtonTwo", isDeactivateToggle: "isDeactivateToggle", isDeactivateToggleTwo: "isDeactivateToggleTwo", isDeactivateToggleThree: "isDeactivateToggleThree", isDeactivateToggleFour: "isDeactivateToggleFour", showEllipsisFullText: "showEllipsisFullText" }, outputs: { captionButtonClicked: "captionButtonClicked", buttonEditClick: "buttonEditClick", buttonSaveClick: "buttonSaveClick", buttonOneClick: "buttonOneClick", buttonDeleteClick: "buttonDeleteClick", buttonTwoClick: "buttonTwoClick", toggleSwitch: "toggleSwitch", toggleTwoSwitch: "toggleTwoSwitch", toggleThreeSwitch: "toggleThreeSwitch", toggleFourSwitch: "toggleFourSwitch", checkboxOne: "checkboxOne" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["dt"], descendants: true }], ngImport: i0, template: "<p-table\r\n #dt\r\n [value]=\"tableData\"\r\n [paginator]=\"isPaginatorVisible\"\r\n [rows]=\"tableRowCount\"\r\n [showCurrentPageReport]=\"false\"\r\n [scrollable]=\"scrollable\"\r\n [scrollHeight]=\"scrollHeight\"\r\n dataKey=\"id\"\r\n editMode=\"row\"\r\n [ngClass]=\"captionColorClass\"\r\n [loading]=\"isTableLoading\"\r\n [tableStyle]=\"{'min-width': tableMinWidth}\"\r\n [virtualScroll]=\"isVirtualScroll\"\r\n [virtualScrollItemSize]=\"virtualScrollRowSize\"\r\n aria-live=\"polite\"\r\n>\r\n <ng-template pTemplate=\"caption\" *ngIf=\"!!tableCaption\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n {{ tableCaption }}\r\n <span *ngIf=\"isVirtualScrollButtonVisible\"\r\n (click)=\"isVirtualScroll = !isVirtualScroll\"\r\n [ngStyle]=\"{'color': isVirtualScroll ? '' : 'lightgray'}\"\r\n class=\"pi pi-sort cursor-pointer\">\r\n </span>\r\n <lib-button\r\n *ngIf=\"isCaptionButtonVisible\"\r\n [label]=\"captionButtonLabel\"\r\n [color]=\"captionButtonColor\"\r\n (clickEvent)=\"clickCaptionButton($event)\"\r\n ></lib-button>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"header\" *ngIf=\"isTableHeaderVisible\">\r\n <tr>\r\n <ng-container *ngFor=\"let column of tableColumns\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <th scope=\"col\" [style.width]=\"column.width\">\r\n {{ column.header | translate }}\r\n </th>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <th *ngFor=\"let _ of emptyHeaderColumnList\" [style.width]=\"emptyColumnWidth\" aria-hidden=\"true\"></th>\r\n <th *ngIf=\"!!toggleTableHeaderName\" scope=\"col\" [style.width]=\"toggleWidth\" class=\"vertical-align-middle\">\r\n {{ toggleTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleTwoTableHeaderName\" scope=\"col\" [style.width]=\"toggleTwoWidth\" class=\"vertical-align-middle\">\r\n {{ toggleTwoTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleThreeTableHeaderName\" scope=\"col\" [style.width]=\"toggleThreeWidth\" class=\"vertical-align-middle\">\r\n {{ toggleThreeTableHeaderName }}\r\n </th>\r\n <th *ngIf=\"!!toggleFourTableHeaderName\" scope=\"col\" [style.width]=\"toggleFourWidth\" class=\"vertical-align-middle\">\r\n {{ toggleFourTableHeaderName }}\r\n </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\" let-rowData let-editing=\"editing\" let-ri=\"rowIndex\">\r\n <!--\r\n Mare; 2024-09-19: dodajanje logike barvanja rowColor za /cms/notifications, delat mora pa tudi v /vsi-termini\r\n -->\r\n <tr [pEditableRow]=\"rowData\" #htmlTableRowElement\r\n [ngClass]=\"\r\n rowData?.cmsStatus ?\r\n (rowData?.cmsStatus === 'expired' ? 'disabled_row_color' :\r\n rowData?.cmsStatus === 'planned' ? '' :\r\n rowData?.cmsStatus === 'active' ? 'success_row_color' : '') :\r\n (!rowData?.registered ? rowColor : '')\r\n \">\r\n <ng-container *ngFor=\"let column of tableColumns; let colIndex = index\">\r\n <ng-container *ngIf=\"!(column.hideOnMobile && isMobile() && hideColumnsOnMobile)\">\r\n <td [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Text input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'input'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-input\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [type]=\"column.inputType ? column.inputType : type\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n ></lib-input>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <ng-container *ngIf=\"column.isLink; else notLink\">\r\n <a href=\"{{ rowData[column.field] }}\" target=\"_blank\">\r\n {{ rowData[column.field] }}\r\n </a>\r\n </ng-container>\r\n <ng-template #notLink>\r\n {{ rowData[column.field] }} {{ column?.suffix }}\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Date input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'date'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-date-input\r\n appendTo=\"body\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [setMinAndMax]=\"false\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! | translate }}\"\r\n ></lib-date-input>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ rowData[column.field] | date: 'dd.MM.yyyy' }} {{ column?.suffix }}\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Date+Time output-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'dateTime'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ rowData[column.field] | date: 'dd.MM.yyyy, HH:mm' }} {{ column?.suffix }}\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- TextArea input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'textarea'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-textarea *ngIf=\"column.maxLength === -1\"\r\n [customMaxLength]=\"null\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n ></lib-textarea>\r\n <lib-textarea *ngIf=\"column.maxLength !== -1\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n [isRequired]=\"false\"\r\n [formStatus]=\"formStatus\"\r\n [hasGap]=\"false\"\r\n placeholder=\"{{ column.placeholder! |translate }}\"\r\n ></lib-textarea>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <lib-tooltip\r\n [htmlParser]=\"true\"\r\n [text]=\"rowData[column.field]\"\r\n ></lib-tooltip>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Dropdown input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'dropdown'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-dropdown\r\n label=\"Moje naloge\"\r\n placeholder=\"Izberite\"\r\n optionLabel=\"name\"\r\n [showClear]=\"true\"\r\n [formStatus]=\"formStatus\"\r\n\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [name]=\"column.field\"\r\n\r\n filterBy=\"name\"\r\n [isLoading]=\"false\"\r\n [optionList]=\"overviewList\"\r\n [filter]=\"true\"\r\n [isRequired]=\"false\"\r\n ></lib-dropdown>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n <lib-tooltip\r\n [htmlParser]=\"true\"\r\n [text]=\"rowData[column.field]\"\r\n ></lib-tooltip>\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Switch input-->\r\n <ng-container *ngIf=\"column.editable && column.component === 'switch'\">\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <lib-toggle-switch\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field\"\r\n [checked]=\"rowData[column.field]\"\r\n ></lib-toggle-switch>\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n <ng-container *ngIf=\"rowData[column.field]; else emptyCell\">\r\n {{ 'components.customTable.yes' | translate }}\r\n </ng-container>\r\n\r\n <ng-template #emptyCell>\r\n {{ 'components.customTable.no' | translate }}\r\n </ng-template>\r\n </ng-template>\r\n </p-cellEditor>\r\n </ng-container>\r\n\r\n <!-- Mare; dodal custom checkbox za izbiro vrstice -->\r\n <!-- [controlName] je oblike rowChecked_2024-04-11T11:35:00_c3cff776-dc06-40ec-bab5-7cab26e2014a -->\r\n <!-- column.field = rowChecked -->\r\n <!-- rowData[column?.control!] = 2024-04-11T11:35:00 (startDate) -->\r\n <!-- rowData[column?.control2!] = c3cff776-dc06-40ec-bab5-7cab26e2014a (uuid) -->\r\n <ng-container *ngIf=\"column.editable && column.component === 'checkbox'\">\r\n <lib-checkbox class=\"\"\r\n [group]=\"formGroup\"\r\n [controlName]=\"column.field + '_' + rowData[column?.control!] + '_' + rowData[column?.control2!]\"\r\n (clickCheckboxEvent)=\"clickCheckboxOne($event, rowData[column?.control!] + '_' + rowData[column?.control2!])\"\r\n label=\"\">\r\n </lib-checkbox>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-container *ngIf=\"!column.editable\">\r\n <ng-container *ngIf=\"column.tooltip || column.tag || column.status || column.ellipsis; else valueCell\">\r\n <!-- Tooltip -->\r\n <ng-container *ngIf=\"column.tooltip\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <lib-tooltip [htmlParser]=\"true\" [text]=\"getNestedValue(rowData, column.field)\"></lib-tooltip>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n /\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Ellipsis -->\r\n <ng-container *ngIf=\"column.ellipsis\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <span>\r\n {{ getNestedValue(rowData, column.field) }}\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n /\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Tag -->\r\n <ng-container *ngIf=\"column.tag && getNestedValue(rowData, column.field)\">\r\n <lib-tag [tagText]=\"getNestedValue(rowData, column.field)\" [tagColor]=\"rowData.tagColor\" [rounded]=\"true\"></lib-tag>\r\n </ng-container>\r\n\r\n <!-- Status -->\r\n <ng-container *ngIf=\"column.status\">\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field)\">\r\n <div style=\"background-color: #66952E; height: 25px; width: 75px;\"></div>\r\n </ng-container>\r\n <ng-container *ngIf=\"!getNestedValue(rowData, column.field)\">\r\n <div style=\"background-color: #f44336; height: 25px; width: 75px;\"></div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #valueCell>\r\n <ng-container *ngIf=\"getNestedValue(rowData, column.field); else emptyCell\">\r\n <!-- Mare; dodal izjemo za 'cmsStatus' -->\r\n <ng-container *ngIf=\"column.field === 'cmsStatus'; else defaultContent\">\r\n {{ 'pages.cms.cmsStatus.' + getNestedValue(rowData, column.field) | translate }}\r\n </ng-container>\r\n <!-- Privzeta vsebina za vse ostale stolpce -->\r\n <ng-template #defaultContent>\r\n {{ column.suffix ? getNestedValue(rowData, column.field) + ' ' + column.suffix : getNestedValue(rowData, column.field) }}\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #emptyCell>\r\n /\r\n </ng-template>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <p class=\"text-red-500 custom-small-text\" *ngIf=\"colIndex === 0 && rowData?.administrativeProcedure?.localJurisdiction && isWarningTextVisible\">\r\n <br/> {{ 'components.customTable.notification' | translate }}\r\n </p>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- Button column one -->\r\n <td *ngIf=\"isButtonOneVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Editing table-->\r\n <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n <lib-icon-button\r\n *ngIf=\"!editing\"\r\n pInitEditableRow\r\n [color]=\"buttonOneColor\"\r\n [icon]=\"buttonOneEditIcon\"\r\n (click)='onRowEdit(rowData)'\r\n ></lib-icon-button>\r\n <lib-icon-button\r\n *ngIf=\"editing\"\r\n [color]=\"buttonOneColor!\"\r\n [icon]=\"buttonOneSaveIcon\"\r\n (click)='onRowSave(rowData, htmlTableRowElement)'\r\n ></lib-icon-button>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-template #plainTable>\r\n <ng-container\r\n *ngIf=\"(rowData?.administrativeProcedure === undefined || rowData?.administrativeProcedure?.detailsUrl !== null) && !isPlainTableIconButtonOne\"\r\n >\r\n <lib-button\r\n *ngIf=\"!isPlainTableButtonOneLink\"\r\n [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n [hasIcon]=\"buttonOneHasIcon!\"\r\n [color]=\"rowData?.buttonColor ? rowData.buttonColor : buttonOneColor!\"\r\n [icon]=\"buttonOneIcon!\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-button>\r\n <lib-button-link\r\n *ngIf=\"isPlainTableButtonOneLink\"\r\n [label]=\"rowData?.buttonText ? rowData.buttonText : buttonOneLabel!\"\r\n [isPrimary]=\"true\"\r\n [hasIcon]=\"buttonOneHasIcon!\"\r\n [icon]=\"buttonOneIcon! + ' md:ml-2'\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-button-link>\r\n </ng-container>\r\n <lib-icon-button\r\n *ngIf=\"isPlainTableIconButtonOne\"\r\n [color]=\"buttonOneColor!\"\r\n [icon]=\"buttonOneSaveIcon\"\r\n (click)='clickButtonOne(rowData)'\r\n ></lib-icon-button>\r\n </ng-template>\r\n </td>\r\n\r\n <!-- Button column two -->\r\n <td *ngIf=\"isButtonTwoVisible\" [class.disabled-row]=\"rowData?.isEnabled === false || rowData?.isEnabled === null\">\r\n <!-- Editing table-->\r\n <ng-container *ngIf=\"isEditingTable; else plainTable\">\r\n <lib-icon-button\r\n *ngIf=\"!editing\"\r\n [color]=\"buttonTwoColor\"\r\n [icon]=\"buttonTwoDeleteIcon\"\r\n (click)='onRowDelete(rowData)'\r\n ></lib-icon-button>\r\n <lib-icon-button\r\n *ngIf=\"editing\"\r\n [color]=\"buttonTwoColor\"\r\n [icon]=\"buttonTwoCancelIcon\"\r\n (click)=\"onRowCancel(rowData)\"\r\n ></lib-icon-button>\r\n </ng-container>\r\n\r\n <!-- Plain table-->\r\n <ng-template #plainTable>\r\n <lib-button\r\n *ngIf=\"!isPlainTableIconButtonTwo\"\r\n [label]=\"buttonTwoLabel!\"\r\n [hasIcon]=\"buttonTwoHasIcon!\"\r\n [color]=\"buttonTwoColor!\"\r\n [icon]=\"buttonTwoIcon!\"\r\n (click)='clickButtonTwo(rowData)'\r\n ></lib-button>\r\n <lib-icon-button\r\n *ngIf=\"isPlainTableIconButtonTwo\"\r\n [color]=\"buttonTwoColor!\"\r\n [icon]=\"buttonTwoDeleteIcon\"\r\n (click)='clickButtonTwo(rowData)'\r\n ></lib-icon-button>\r\n </ng-template>\r\n </td>\r\n\r\n <!-- Deactivate toggle -->\r\n <td *ngIf=\"isDeactivateToggle\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isEnabled\"\r\n (getValueEvent)=\"toggleEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle two -->\r\n <td *ngIf=\"isDeactivateToggleTwo\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isAppointmentEnabled\"\r\n (getValueEvent)=\"toggleTwoEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle three -->\r\n <td *ngIf=\"isDeactivateToggleThree\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isNotificationEnabled\"\r\n (getValueEvent)=\"toggleThreeEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n\r\n <!-- Deactivate toggle four -->\r\n <td *ngIf=\"isDeactivateToggleFour\" [ngStyle]=\"{ 'pointer-events': 'auto' }\">\r\n <lib-toggle-switch\r\n [disabled]=\"!rowData.isEnabled\"\r\n [isFormElement]=\"false\"\r\n [checked]=\"rowData.isVrstomatEnabled\"\r\n (getValueEvent)=\"toggleFourEnable({ rowData, $event })\"\r\n ></lib-toggle-switch>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n", styles: [":host ::ng-deep .future .p-datatable-header{background:#b2414d}:host ::ng-deep .past .p-datatable-header{background:#6d7375}:host ::ng-deep .p-datatable{border:1px solid #3E7C94;border-radius:8px;overflow:hidden;padding:0}:host ::ng-deep .p-datatable .p-datatable-header{border:none;color:#fff;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td{background:#d9d9d9;border:none;color:#1b495a;font-weight:unset;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:first-child,:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:first-child{width:400px}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th.public-table:nth-child(2),:host ::ng-deep .p-datatable .p-datatable-thead>tr>td.public-table:nth-child(2){width:150px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:transparent;height:50px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.success_row_color{background:#66952eb3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.disabled_row_color{background:#b4b4b4b3}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{border-color:#3e7c94;padding:.5rem 1rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr:first-child>td{border-color:transparent}:host ::ng-deep .p-datatable .table-icon-button{width:50px}:host ::ng-deep .p-paginator{background:transparent}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight{background:#3e7c94;border-color:#3e7c94}@media(max-width:600px){:host ::ng-deep .p-datatable .p-datatable-header{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:.5rem}}.disabled-row{opacity:.5;pointer-events:none}.custom-small-text{font-size:.8rem;line-height:.9}.ellipsis-text{cursor:n-resize}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$8.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i1$8.CellEditor, selector: "p-cellEditor" }, { kind: "directive", type: i1$8.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "directive", type: i1$8.InitEditableRow, selector: "[pInitEditableRow]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["hasIcon", "label", "color", "icon", "iconPos", "disabled", "isLoading", "styleClass", "size", "accessibilityText", "buttonType", "isAccessible", "isSelected", "ariaControlsId", "isExpanded", "link", "isTextareaClear"], outputs: ["clickEvent"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: InputComponent, selector: "lib-input[group][controlName][name]", inputs: ["name", "type", "label", "placeholder", "accessibilityText", "group", "controlName", "isRequired", "isLabelVisible", "tooltipPosition", "tooltipText", "formStatus", "groupError", "hasGap", "hasTitle", "maxLength"] }, { kind: "component", type: DateInputComponent, selector: "lib-date-input[group][controlName][name]", inputs: ["isLabelVisible", "name", "label", "placeholder", "accessibilityText", "isRequired", "tooltipPosition", "tooltipText", "dateFormat", "group", "controlName", "showIcon", "selectionMode", "touchUI", "formStatus", "showClear", "isPublicDate", "minDate", "maxDate", "minDateToday", "maxDateSixMonths", "maxDateThreeMonths", "maxDateRangeOneYear", "setMinAndMax", "hasGap", "disabledDates", "appendTo", "groupError", "showTime", "availableDates", "disabledDays", "disabledWeekends"], outputs: ["onSelect"] }, { kind: "component", type: TextareaComponent, selector: "lib-textarea[group][controlName][name]", inputs: ["name", "resize", "label", "placeholder", "accessibilityText", "rows", "cols", "tooltipPosition", "tooltipText", "group", "controlName", "isRequired", "formStatus", "hasGap", "customMaxLength"], outputs: ["onBlurEvent"] }, { kind: "component", type: TooltipComponent, selector: " lib-tooltip", inputs: ["icon", "htmlParser", "text", "position", "tooltipEvent", "autoHide", "htmlParse"] }, { kind: "component", type: DropdownComponent, selector: "lib-dropdown[group][controlName][name]", inputs: ["name", "isMultiselect", "selectedItemLabel", "group", "controlName", "label", "optionList", "optionLabel", "optionalValue", "placeholder", "accessibilityText", "filter", "filterBy", "showClear", "isRequired", "tooltipPosition", "tooltipText", "formStatus", "nestedGroup", "isLoading", "appendTo", "isLabelVisible", "emptyMessage", "virtualScroll", "ariaFilterLabel", "optionValue", "minPanelWidth"], outputs: ["getValueEvent"] }, { kind: "component", type: ToggleSwitchComponent, selector: "lib-toggle-switch", inputs: ["group", "controlName", "isFormElement", "checked", "disabled"], outputs: ["getValueEvent", "checkedChanged"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox[group][controlName][label]", inputs: ["label", "group", "controlName", "value", "formStatus", "ariaLabel"], outputs: ["clickCheckboxEvent"] }, { kind: "component", type: TagComponent, selector: "lib-tag", inputs: ["tagText", "tagColor", "rounded"] }, { kind: "component", type: IconButtonComponent, selector: "lib-icon-button", inputs: ["icon", "disabled", "color", "styleClass", "size"], outputs: ["clickEvent"] }, { kind: "component", type: ButtonLinkComponent, selector: "lib-button-link", inputs: ["hasIcon", "label", "isDanger", "isPrimary", "icon", "target", "accessibilityText"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "date" }] });
|
|
2278
2281
|
}
|
|
2279
2282
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CustomTableComponent, decorators: [{
|
|
2280
2283
|
type: Component,
|