cat-qw-lib 2.6.13 → 2.6.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +63 -63
- package/fesm2022/cat-qw-lib.mjs +106 -106
- package/fesm2022/cat-qw-lib.mjs.map +1 -1
- package/package.json +1 -1
- package/src/assets/icons/confirm-icon.svg +4 -4
package/fesm2022/cat-qw-lib.mjs
CHANGED
|
@@ -513,7 +513,7 @@ const FIELD_DISPLAY_NAMES = {
|
|
|
513
513
|
securityAddress: 'Security',
|
|
514
514
|
valuationStatus: 'Val status',
|
|
515
515
|
sla: 'SLA',
|
|
516
|
-
referredDate: '
|
|
516
|
+
referredDate: 'Referred Days',
|
|
517
517
|
pending: 'Age',
|
|
518
518
|
lending: 'Type',
|
|
519
519
|
tasks: 'Tasks'
|
|
@@ -552,11 +552,11 @@ class SidebarComponent {
|
|
|
552
552
|
this.onClose.emit(false);
|
|
553
553
|
}
|
|
554
554
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SidebarComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
555
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: SidebarComponent, isStandalone: false, selector: "sidebar", inputs: { isSidebarVisible: "isSidebarVisible", title: "title" }, outputs: { onClose: "onClose" }, ngImport: i0, template: "<div *ngIf=\"isSidebarVisible\" class=\"backdrop-shadow\" (click)=\"handleSidebarClose()\"></div>\
|
|
555
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: SidebarComponent, isStandalone: false, selector: "sidebar", inputs: { isSidebarVisible: "isSidebarVisible", title: "title" }, outputs: { onClose: "onClose" }, ngImport: i0, template: "<div *ngIf=\"isSidebarVisible\" class=\"backdrop-shadow\" (click)=\"handleSidebarClose()\"></div>\n<div>\n<p-sidebar class=\"sidebar-panel-wrapper\" [(visible)]=\"isSidebarVisible\" (onShow)=\"onSidebarShow()\" (onHide)=\"handleSidebarClose()\" [position]=\"'right'\">\n <ng-template pTemplate=\"header\">\n <div class=\"flex align-items-center\">\n <h2 class=\"sidebar-title-wrapper text-color mb-0\">\n {{title}}\n </h2>\n </div>\n </ng-template>\n <p-divider class=\"sidebar-devider\"></p-divider>\n <ng-content></ng-content>\n</p-sidebar>", styles: ["::ng-deep .custom-sidebar-overlay{z-index:0!important}::ng-deep .sidebar-panel-wrapper .p-sidebar-header{padding:1.4rem 1rem}::ng-deep .sidebar-panel-wrapper .p-sidebar-content{padding:0}::ng-deep .sidebar-panel-wrapper .p-sidebar-right{width:35%!important}::ng-deep .sidebar-devider .p-divider{margin:0}.sidebar-title-wrapper{font-size:24px;font-weight:700}.backdrop-shadow{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:999}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i3.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "component", type: i4$1.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }] });
|
|
556
556
|
}
|
|
557
557
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SidebarComponent, decorators: [{
|
|
558
558
|
type: Component,
|
|
559
|
-
args: [{ selector: 'sidebar', standalone: false, template: "<div *ngIf=\"isSidebarVisible\" class=\"backdrop-shadow\" (click)=\"handleSidebarClose()\"></div>\
|
|
559
|
+
args: [{ selector: 'sidebar', standalone: false, template: "<div *ngIf=\"isSidebarVisible\" class=\"backdrop-shadow\" (click)=\"handleSidebarClose()\"></div>\n<div>\n<p-sidebar class=\"sidebar-panel-wrapper\" [(visible)]=\"isSidebarVisible\" (onShow)=\"onSidebarShow()\" (onHide)=\"handleSidebarClose()\" [position]=\"'right'\">\n <ng-template pTemplate=\"header\">\n <div class=\"flex align-items-center\">\n <h2 class=\"sidebar-title-wrapper text-color mb-0\">\n {{title}}\n </h2>\n </div>\n </ng-template>\n <p-divider class=\"sidebar-devider\"></p-divider>\n <ng-content></ng-content>\n</p-sidebar>", styles: ["::ng-deep .custom-sidebar-overlay{z-index:0!important}::ng-deep .sidebar-panel-wrapper .p-sidebar-header{padding:1.4rem 1rem}::ng-deep .sidebar-panel-wrapper .p-sidebar-content{padding:0}::ng-deep .sidebar-panel-wrapper .p-sidebar-right{width:35%!important}::ng-deep .sidebar-devider .p-divider{margin:0}.sidebar-title-wrapper{font-size:24px;font-weight:700}.backdrop-shadow{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:999}\n"] }]
|
|
560
560
|
}], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { isSidebarVisible: [{
|
|
561
561
|
type: Input
|
|
562
562
|
}], title: [{
|
|
@@ -781,11 +781,11 @@ class BaseControlComponent {
|
|
|
781
781
|
this.destroy$.complete();
|
|
782
782
|
}
|
|
783
783
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BaseControlComponent, deps: [{ token: BaseStore }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
784
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: BaseControlComponent, isStandalone: true, selector: "app-base-control", inputs: { store: "store", record: "record", attributeModel: "attributeModel", error: "error" }, outputs: { onInput: "onInput", onEnterKeydown: "onEnterKeydown", onBtnClick: "onBtnClick" }, providers: [BaseStore], viewQueries: [{ propertyName: "textboxField", first: true, predicate: ["textboxField"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "textArea", first: true, predicate: ["textArea"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<p>base-control works!</p>\
|
|
784
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: BaseControlComponent, isStandalone: true, selector: "app-base-control", inputs: { store: "store", record: "record", attributeModel: "attributeModel", error: "error" }, outputs: { onInput: "onInput", onEnterKeydown: "onEnterKeydown", onBtnClick: "onBtnClick" }, providers: [BaseStore], viewQueries: [{ propertyName: "textboxField", first: true, predicate: ["textboxField"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "textArea", first: true, predicate: ["textArea"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<p>base-control works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
|
|
785
785
|
}
|
|
786
786
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BaseControlComponent, decorators: [{
|
|
787
787
|
type: Component,
|
|
788
|
-
args: [{ selector: 'app-base-control', standalone: true, imports: [CommonModule], providers: [BaseStore], template: "<p>base-control works!</p>\
|
|
788
|
+
args: [{ selector: 'app-base-control', standalone: true, imports: [CommonModule], providers: [BaseStore], template: "<p>base-control works!</p>\n" }]
|
|
789
789
|
}], ctorParameters: () => [{ type: BaseStore }, { type: BaseQuery }], propDecorators: { store: [{
|
|
790
790
|
type: Input
|
|
791
791
|
}], record: [{
|
|
@@ -816,20 +816,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
|
|
|
816
816
|
*/
|
|
817
817
|
class CheckBoxComponent extends BaseControlComponent {
|
|
818
818
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CheckBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
819
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: CheckBoxComponent, isStandalone: true, selector: "check-box", usesInheritance: true, ngImport: i0, template: "<div class=\"checkBoxContainer\">\
|
|
819
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: CheckBoxComponent, isStandalone: true, selector: "check-box", usesInheritance: true, ngImport: i0, template: "<div class=\"checkBoxContainer\">\n \n <div class=\"checkBox\">\n <p-checkbox\n [disabled]=\"attributeModel.readonly ?? false\"\n [binary]=\"true\"\n inputId=\"binary\"\n [label]=\"attributeModel.displayText ?? ''\"\n class=\"dynamic-checkbox\"\n #checkBox=\"ngModel\"\n [ngModel]=\"this.record[this.attributeModel.name]\"\n [style]=\"{\n '--checkbox-size': attributeModel.customColumnWidth || '20px',\n '--checkbox-height': attributeModel.customHeight || '20px'\n }\"\n [required]=\"attributeModel.isRequired ?? false\" \n (ngModelChange)=\"handleModelChange($event, checkBox.valid)\"\n >\n </p-checkbox>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n</div>", styles: [".asterisk{color:red}.checkBoxContainer{max-height:100%;display:flex;align-items:center;font-family:var(--font-family);position:relative}.checkBox{position:relative;max-width:100%;max-height:100%;word-wrap:break-word}::ng-deep .dynamic-checkbox .p-checkbox{width:var(--checkbox-size)!important;height:var(--checkbox-height)!important}::ng-deep .dynamic-checkbox .p-checkbox .p-checkbox-box{width:var(--checkbox-size)!important;height:var(--checkbox-height)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i3$2.Checkbox, selector: "p-checkbox", inputs: ["value", "name", "disabled", "binary", "label", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "styleClass", "labelStyleClass", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }] });
|
|
820
820
|
}
|
|
821
821
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CheckBoxComponent, decorators: [{
|
|
822
822
|
type: Component,
|
|
823
|
-
args: [{ selector: 'check-box', standalone: true, imports: [CommonModule, FormsModule, CheckboxModule], template: "<div class=\"checkBoxContainer\">\
|
|
823
|
+
args: [{ selector: 'check-box', standalone: true, imports: [CommonModule, FormsModule, CheckboxModule], template: "<div class=\"checkBoxContainer\">\n \n <div class=\"checkBox\">\n <p-checkbox\n [disabled]=\"attributeModel.readonly ?? false\"\n [binary]=\"true\"\n inputId=\"binary\"\n [label]=\"attributeModel.displayText ?? ''\"\n class=\"dynamic-checkbox\"\n #checkBox=\"ngModel\"\n [ngModel]=\"this.record[this.attributeModel.name]\"\n [style]=\"{\n '--checkbox-size': attributeModel.customColumnWidth || '20px',\n '--checkbox-height': attributeModel.customHeight || '20px'\n }\"\n [required]=\"attributeModel.isRequired ?? false\" \n (ngModelChange)=\"handleModelChange($event, checkBox.valid)\"\n >\n </p-checkbox>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n</div>", styles: [".asterisk{color:red}.checkBoxContainer{max-height:100%;display:flex;align-items:center;font-family:var(--font-family);position:relative}.checkBox{position:relative;max-width:100%;max-height:100%;word-wrap:break-word}::ng-deep .dynamic-checkbox .p-checkbox{width:var(--checkbox-size)!important;height:var(--checkbox-height)!important}::ng-deep .dynamic-checkbox .p-checkbox .p-checkbox-box{width:var(--checkbox-size)!important;height:var(--checkbox-height)!important}\n"] }]
|
|
824
824
|
}] });
|
|
825
825
|
|
|
826
826
|
class ButtonComponent extends BaseControlComponent {
|
|
827
827
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
828
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: ButtonComponent, isStandalone: true, selector: "lib-button", usesInheritance: true, ngImport: i0, template: "<ng-container>\
|
|
828
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: ButtonComponent, isStandalone: true, selector: "lib-button", usesInheritance: true, ngImport: i0, template: "<ng-container>\n <div class=\"btn-control\">\n <p-button\n type=\"button\"\n [label]=\"attributeModel.buttonLabel ?? 'Click Me'\"\n [disabled]=\"attributeModel.isDisabled ?? false\"\n [style]=\"{\n width: attributeModel.customButtonWidth\n ? attributeModel.customButtonWidth\n : 'auto',\n padding: attributeModel.customPadding\n ? attributeModel.customPadding\n : '0.5rem' \n }\"\n [icon]=\"attributeModel.icon ? attributeModel.icon : ''\"\n [iconPos]=\"attributeModel.iconPosition ?? 'left'\" \n [ngClass]=\"{\n 'p-button-primary': attributeModel.isPrimary ?? true,\n 'p-button-secondary': !attributeModel.isPrimary\n }\"\n (onClick)=\"handleButtonClick($event)\"\n></p-button>\n\n </div>\n </ng-container>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3$3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }] });
|
|
829
829
|
}
|
|
830
830
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
831
831
|
type: Component,
|
|
832
|
-
args: [{ selector: 'lib-button', standalone: true, imports: [CommonModule, InputTextModule, FormsModule, ButtonModule], template: "<ng-container>\
|
|
832
|
+
args: [{ selector: 'lib-button', standalone: true, imports: [CommonModule, InputTextModule, FormsModule, ButtonModule], template: "<ng-container>\n <div class=\"btn-control\">\n <p-button\n type=\"button\"\n [label]=\"attributeModel.buttonLabel ?? 'Click Me'\"\n [disabled]=\"attributeModel.isDisabled ?? false\"\n [style]=\"{\n width: attributeModel.customButtonWidth\n ? attributeModel.customButtonWidth\n : 'auto',\n padding: attributeModel.customPadding\n ? attributeModel.customPadding\n : '0.5rem' \n }\"\n [icon]=\"attributeModel.icon ? attributeModel.icon : ''\"\n [iconPos]=\"attributeModel.iconPosition ?? 'left'\" \n [ngClass]=\"{\n 'p-button-primary': attributeModel.isPrimary ?? true,\n 'p-button-secondary': !attributeModel.isPrimary\n }\"\n (onClick)=\"handleButtonClick($event)\"\n></p-button>\n\n </div>\n </ng-container>" }]
|
|
833
833
|
}] });
|
|
834
834
|
|
|
835
835
|
class TextBoxComponent extends BaseControlComponent {
|
|
@@ -845,11 +845,11 @@ class TextBoxComponent extends BaseControlComponent {
|
|
|
845
845
|
}
|
|
846
846
|
}
|
|
847
847
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TextBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
848
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: TextBoxComponent, isStandalone: true, selector: "text-box", usesInheritance: true, ngImport: i0, template: "<ng-container >\
|
|
848
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: TextBoxComponent, isStandalone: true, selector: "text-box", usesInheritance: true, ngImport: i0, template: "<ng-container >\n <div class=\"\">\n\n <div *ngIf=\"attributeModel.displayText\" class=\"mb-2\">\n <label>{{ attributeModel.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n <div class=\"inputTextBox\">\n\n <input\n pInputText\n type=\"text\"\n autocomplete=\"off\"\n [placeholder]=\"attributeModel.placeholder ?? ''\"\n class=\"block p-inputtext w-full\"\n [pTooltip]=\"attributeModel.tooltip ?? ''\"\n [tooltipPosition]=\"attributeModel.toolTipPosition ?? '' \"\n [ngModel]=\"record?.[attributeModel.name] ?? ''\"\n [disabled]=\"attributeModel.disable ?? false\" \n [readonly]=\"attributeModel.readonly ?? false\"\n [name]=\"attributeModel.name ?? 'textBox'\"\n [id]=\"attributeModel.name ?? 'textBox'\"\n [required]=\"attributeModel.isRequired ?? false\" \n [ngStyle]=\"{\n width: attributeModel.customColumnWidth\n ? attributeModel.customColumnWidth\n : '',\n padding: attributeModel.customPadding ? attributeModel.customPadding : ''\n }\"\n #textboxField=\"ngModel\"\n (ngModelChange)=\"handleModelChange($event, textboxField.valid)\"\n [ngClass]=\"{'ng-dirty ng-invalid': (!textboxField.valid && textboxField.dirty)}\"\n />\n <div *ngIf=\"textboxField.errors?.['required'] && (textboxField.dirty || textboxField.touched)\" class=\"error-message\">\n <small class=\"p-error\"><span class=\"capitalize\">{{attributeModel.name}}</span> is required</small>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [".asterisk{color:red}.inputTextBox{position:relative}.textCount{position:absolute;bottom:23%;right:1%;color:#bcbcbc}.markRed{color:red}.text-value-wrapper{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;width:100%}\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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }] });
|
|
849
849
|
}
|
|
850
850
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TextBoxComponent, decorators: [{
|
|
851
851
|
type: Component,
|
|
852
|
-
args: [{ selector: 'text-box', standalone: true, imports: [CommonModule, InputTextModule, FormsModule, TooltipModule], template: "<ng-container >\
|
|
852
|
+
args: [{ selector: 'text-box', standalone: true, imports: [CommonModule, InputTextModule, FormsModule, TooltipModule], template: "<ng-container >\n <div class=\"\">\n\n <div *ngIf=\"attributeModel.displayText\" class=\"mb-2\">\n <label>{{ attributeModel.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n <div class=\"inputTextBox\">\n\n <input\n pInputText\n type=\"text\"\n autocomplete=\"off\"\n [placeholder]=\"attributeModel.placeholder ?? ''\"\n class=\"block p-inputtext w-full\"\n [pTooltip]=\"attributeModel.tooltip ?? ''\"\n [tooltipPosition]=\"attributeModel.toolTipPosition ?? '' \"\n [ngModel]=\"record?.[attributeModel.name] ?? ''\"\n [disabled]=\"attributeModel.disable ?? false\" \n [readonly]=\"attributeModel.readonly ?? false\"\n [name]=\"attributeModel.name ?? 'textBox'\"\n [id]=\"attributeModel.name ?? 'textBox'\"\n [required]=\"attributeModel.isRequired ?? false\" \n [ngStyle]=\"{\n width: attributeModel.customColumnWidth\n ? attributeModel.customColumnWidth\n : '',\n padding: attributeModel.customPadding ? attributeModel.customPadding : ''\n }\"\n #textboxField=\"ngModel\"\n (ngModelChange)=\"handleModelChange($event, textboxField.valid)\"\n [ngClass]=\"{'ng-dirty ng-invalid': (!textboxField.valid && textboxField.dirty)}\"\n />\n <div *ngIf=\"textboxField.errors?.['required'] && (textboxField.dirty || textboxField.touched)\" class=\"error-message\">\n <small class=\"p-error\"><span class=\"capitalize\">{{attributeModel.name}}</span> is required</small>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [".asterisk{color:red}.inputTextBox{position:relative}.textCount{position:absolute;bottom:23%;right:1%;color:#bcbcbc}.markRed{color:red}.text-value-wrapper{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;width:100%}\n"] }]
|
|
853
853
|
}] });
|
|
854
854
|
|
|
855
855
|
class ERROR {
|
|
@@ -912,7 +912,7 @@ class FormContainerComponent {
|
|
|
912
912
|
this.destroy$.complete();
|
|
913
913
|
}
|
|
914
914
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: FormContainerComponent, deps: [{ token: BaseQuery }, { token: BaseStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
915
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: FormContainerComponent, isStandalone: true, selector: "form-container", inputs: { messages: "messages", record: "record", headerText: "headerText", showSave: "showSave", disableSaveButton: "disableSaveButton" }, outputs: { onSave: "onSave", onCancel: "onCancel" }, providers: [MessageService, ConfirmationService], ngImport: i0, template: "<div class=\"form-container\">\
|
|
915
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: FormContainerComponent, isStandalone: true, selector: "form-container", inputs: { messages: "messages", record: "record", headerText: "headerText", showSave: "showSave", disableSaveButton: "disableSaveButton" }, outputs: { onSave: "onSave", onCancel: "onCancel" }, providers: [MessageService, ConfirmationService], ngImport: i0, template: "<div class=\"form-container\">\n <div class=\"text-900 font-bold text-xl form-header m-0 p-0\">\n <div class=\"form-header-container w-full mr-0\">\n <div class=\"form-header-title\"[innerHTML]=\"this.headerText\">\n </div>\n <div class=\"form-header-messege w-full\">\n <p-messages class=\"message-wrapper\" [(value)]=\"messages\" [enableService]=\"false\" />\n </div>\n </div>\n\n <div class=\"btn-wrapper\">\n <ng-content select=\"[headerButtons]\"></ng-content>\n @if(showSave){\n <button\n pButton\n pRipple\n label=\"Cancel\"\n (click)=\"handleCancelClick()\"\n class=\"p-button-outlined mr-2\"\n ></button>\n\n <button\n pButton\n class=\"p-button-success\"\n label=\"Save\"\n type=\"button\"\n tooltipPosition=\"bottom\"\n (click)=\"handleSaveClick()\"\n ></button>\n }\n <ng-content select=\"[headerButtons]\"></ng-content>\n </div>\n </div>\n \n \n <p-toast></p-toast>\n\n <div>\n <p-confirmDialog>\n <ng-template pTemplate=\"message\" let-message>\n <div class=\"flex flex-column align-items-center w-full gap-3 border-bottom-1 surface-border\">\n <i class=\"pi pi-exclamation-circle text-6xl text-primary-500\"></i>\n <p>{{ message.message }}</p>\n </div>\n </ng-template>\n </p-confirmDialog>\n </div> \n <div class=\"grid m-0 mt-3\">\n <div class=\"col-12 p-0\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n ", styles: [".form-container{display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}.form-container.card{padding:0}.form-container .p-button{padding:.5rem 1.25rem}.form-container .form-footer{background-color:var(--surface-100);padding:6px 0;height:46px;width:100%;margin-top:auto;position:sticky;bottom:0;z-index:4}.form-container .form-footer.card{margin-bottom:0!important}.form-container .form-header{padding:6px 0;height:46px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:4;width:100%}.form-container .form-top button{height:fit-content}.form-container .form-header-bg-light{background-color:#e1e2e8!important}.form-container .form-header-bg-dark{background-color:#3b3848!important}.form-container .left-wrapper{display:flex}.form-container .p-16{padding:4px 32px 16px}.form-container .m-16{margin:0 16px}.form-container .errors{position:sticky;top:3.4rem;z-index:1;background-color:var(--surface-900);padding:0 16px}.btn-wrapper{display:flex;justify-content:flex-end;align-items:center}.form-header-container{display:flex;flex-wrap:nowrap;align-items:center;margin-right:2rem}.form-header-container .form-header-title{text-wrap:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i5.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "ngmodule", type: ToastModule }, { kind: "component", type: i6.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "life", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "ngmodule", type: MessagesModule }, { kind: "component", type: i7.Messages, selector: "p-messages", inputs: ["value", "closable", "style", "styleClass", "enableService", "key", "escape", "severity", "showTransitionOptions", "hideTransitionOptions"], outputs: ["valueChange", "onClose"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
916
916
|
}
|
|
917
917
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: FormContainerComponent, decorators: [{
|
|
918
918
|
type: Component,
|
|
@@ -924,7 +924,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
|
|
|
924
924
|
MessagesModule,
|
|
925
925
|
ButtonComponent,
|
|
926
926
|
TextBoxComponent,
|
|
927
|
-
], providers: [MessageService, ConfirmationService], encapsulation: ViewEncapsulation.None, template: "<div class=\"form-container\">\
|
|
927
|
+
], providers: [MessageService, ConfirmationService], encapsulation: ViewEncapsulation.None, template: "<div class=\"form-container\">\n <div class=\"text-900 font-bold text-xl form-header m-0 p-0\">\n <div class=\"form-header-container w-full mr-0\">\n <div class=\"form-header-title\"[innerHTML]=\"this.headerText\">\n </div>\n <div class=\"form-header-messege w-full\">\n <p-messages class=\"message-wrapper\" [(value)]=\"messages\" [enableService]=\"false\" />\n </div>\n </div>\n\n <div class=\"btn-wrapper\">\n <ng-content select=\"[headerButtons]\"></ng-content>\n @if(showSave){\n <button\n pButton\n pRipple\n label=\"Cancel\"\n (click)=\"handleCancelClick()\"\n class=\"p-button-outlined mr-2\"\n ></button>\n\n <button\n pButton\n class=\"p-button-success\"\n label=\"Save\"\n type=\"button\"\n tooltipPosition=\"bottom\"\n (click)=\"handleSaveClick()\"\n ></button>\n }\n <ng-content select=\"[headerButtons]\"></ng-content>\n </div>\n </div>\n \n \n <p-toast></p-toast>\n\n <div>\n <p-confirmDialog>\n <ng-template pTemplate=\"message\" let-message>\n <div class=\"flex flex-column align-items-center w-full gap-3 border-bottom-1 surface-border\">\n <i class=\"pi pi-exclamation-circle text-6xl text-primary-500\"></i>\n <p>{{ message.message }}</p>\n </div>\n </ng-template>\n </p-confirmDialog>\n </div> \n <div class=\"grid m-0 mt-3\">\n <div class=\"col-12 p-0\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n ", styles: [".form-container{display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}.form-container.card{padding:0}.form-container .p-button{padding:.5rem 1.25rem}.form-container .form-footer{background-color:var(--surface-100);padding:6px 0;height:46px;width:100%;margin-top:auto;position:sticky;bottom:0;z-index:4}.form-container .form-footer.card{margin-bottom:0!important}.form-container .form-header{padding:6px 0;height:46px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:4;width:100%}.form-container .form-top button{height:fit-content}.form-container .form-header-bg-light{background-color:#e1e2e8!important}.form-container .form-header-bg-dark{background-color:#3b3848!important}.form-container .left-wrapper{display:flex}.form-container .p-16{padding:4px 32px 16px}.form-container .m-16{margin:0 16px}.form-container .errors{position:sticky;top:3.4rem;z-index:1;background-color:var(--surface-900);padding:0 16px}.btn-wrapper{display:flex;justify-content:flex-end;align-items:center}.form-header-container{display:flex;flex-wrap:nowrap;align-items:center;margin-right:2rem}.form-header-container .form-header-title{text-wrap:nowrap}\n"] }]
|
|
928
928
|
}], ctorParameters: () => [{ type: BaseQuery }, { type: BaseStore }], propDecorators: { messages: [{
|
|
929
929
|
type: Input
|
|
930
930
|
}], record: [{
|
|
@@ -1253,11 +1253,11 @@ class BaseListComponent {
|
|
|
1253
1253
|
this.init();
|
|
1254
1254
|
}
|
|
1255
1255
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BaseListComponent, deps: [{ token: BaseService }, { token: TableBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
1256
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: BaseListComponent, isStandalone: true, selector: "lib-base-list", inputs: { refreshTable: "refreshTable" }, usesOnChanges: true, ngImport: i0, template: "<p>base-list works!</p>\
|
|
1256
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: BaseListComponent, isStandalone: true, selector: "lib-base-list", inputs: { refreshTable: "refreshTable" }, usesOnChanges: true, ngImport: i0, template: "<p>base-list works!</p>\n", styles: [""] });
|
|
1257
1257
|
}
|
|
1258
1258
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BaseListComponent, decorators: [{
|
|
1259
1259
|
type: Component,
|
|
1260
|
-
args: [{ selector: 'lib-base-list', template: "<p>base-list works!</p>\
|
|
1260
|
+
args: [{ selector: 'lib-base-list', template: "<p>base-list works!</p>\n" }]
|
|
1261
1261
|
}], ctorParameters: () => [{ type: BaseService }, { type: TableBuilder }], propDecorators: { refreshTable: [{
|
|
1262
1262
|
type: Input
|
|
1263
1263
|
}] } });
|
|
@@ -1320,11 +1320,11 @@ class DropdownComponent extends BaseControlComponent {
|
|
|
1320
1320
|
super.handleModelChange(event, valid);
|
|
1321
1321
|
}
|
|
1322
1322
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DropdownComponent, deps: [{ token: BaseStore }, { token: ListService }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
1323
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DropdownComponent, isStandalone: true, selector: "dropdown", inputs: { isStaticDropdown: "isStaticDropdown" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container>\
|
|
1323
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DropdownComponent, isStandalone: true, selector: "dropdown", inputs: { isStaticDropdown: "isStaticDropdown" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container>\n <div class=\"mb-2\">\n <label>{{ attributeModel.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n <div class=\"dropdownbox\">\n\n <p-dropdown \n \n [options]=\"options\" \n [disabled]=\"attributeModel.readonly ?? false\"\n [showClear]=\"true\"\n [name]=\"attributeModel.name ?? 'testSingleSelect'\" \n [ngModel]=\"record[attributeModel.name]\" \n [placeholder]=\"attributeModel.placeholder ?? ''\" \n [required]=\"attributeModel.isRequired ?? false\"\n filterBy=\"label\" \n [filter]=\"attributeModel.filter ?? false\" \n class=\"dropdownFeild\"\n #dropdown=\"ngModel\"\n (ngModelChange)=\"handleModelChange($event, dropdown.valid)\" \n [ngClass]=\"{'ng-dirty ng-invalid': (!dropdown.valid && dropdown.dirty)}\"\n appendTo=\"body\" \n optionLabel=\"label\" \n optionValue=\"value\">\n</p-dropdown>\n<div *ngIf=\"dropdown.errors?.['required'] && (dropdown.dirty || dropdown.touched)\" class=\"error-message\">\n <small class=\"p-error\"><span class=\"capitalize\">{{attributeModel.name}}</span> is required</small>\n</div>\n</div>\n\n</ng-container>\n", styles: [".asterisk{color:red}.p-dropdown,.dropdownFeild{width:100%!important}.dropdownbox{position:relative}\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: "ngmodule", type: DropdownModule }, { kind: "component", type: i5$1.Dropdown, selector: "p-dropdown", 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", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
1324
1324
|
}
|
|
1325
1325
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DropdownComponent, decorators: [{
|
|
1326
1326
|
type: Component,
|
|
1327
|
-
args: [{ selector: 'dropdown', standalone: true, imports: [CommonModule, DropdownModule, FormsModule], encapsulation: ViewEncapsulation.None, template: "<ng-container>\
|
|
1327
|
+
args: [{ selector: 'dropdown', standalone: true, imports: [CommonModule, DropdownModule, FormsModule], encapsulation: ViewEncapsulation.None, template: "<ng-container>\n <div class=\"mb-2\">\n <label>{{ attributeModel.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n <div class=\"dropdownbox\">\n\n <p-dropdown \n \n [options]=\"options\" \n [disabled]=\"attributeModel.readonly ?? false\"\n [showClear]=\"true\"\n [name]=\"attributeModel.name ?? 'testSingleSelect'\" \n [ngModel]=\"record[attributeModel.name]\" \n [placeholder]=\"attributeModel.placeholder ?? ''\" \n [required]=\"attributeModel.isRequired ?? false\"\n filterBy=\"label\" \n [filter]=\"attributeModel.filter ?? false\" \n class=\"dropdownFeild\"\n #dropdown=\"ngModel\"\n (ngModelChange)=\"handleModelChange($event, dropdown.valid)\" \n [ngClass]=\"{'ng-dirty ng-invalid': (!dropdown.valid && dropdown.dirty)}\"\n appendTo=\"body\" \n optionLabel=\"label\" \n optionValue=\"value\">\n</p-dropdown>\n<div *ngIf=\"dropdown.errors?.['required'] && (dropdown.dirty || dropdown.touched)\" class=\"error-message\">\n <small class=\"p-error\"><span class=\"capitalize\">{{attributeModel.name}}</span> is required</small>\n</div>\n</div>\n\n</ng-container>\n", styles: [".asterisk{color:red}.p-dropdown,.dropdownFeild{width:100%!important}.dropdownbox{position:relative}\n"] }]
|
|
1328
1328
|
}], ctorParameters: () => [{ type: BaseStore }, { type: ListService }, { type: BaseQuery }], propDecorators: { isStaticDropdown: [{
|
|
1329
1329
|
type: Input
|
|
1330
1330
|
}] } });
|
|
@@ -1576,11 +1576,11 @@ class BaseFormComponent {
|
|
|
1576
1576
|
this.formStateService.setIsFormSaved(false);
|
|
1577
1577
|
}
|
|
1578
1578
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BaseFormComponent, deps: [{ token: BaseService }, { token: ValidatorService }, { token: i3$4.Router }, { token: i3$4.ActivatedRoute }, { token: BaseStore }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
1579
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: BaseFormComponent, isStandalone: true, selector: "base-form", outputs: { onSave: "onSave", onFormNavigate: "onFormNavigate", onCancel: "onCancel" }, host: { listeners: { "window:beforeunload": "handleBeforeUnload($event)" } }, providers: [ValidatorService], ngImport: i0, template: "<p>base-form works!</p>\
|
|
1579
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: BaseFormComponent, isStandalone: true, selector: "base-form", outputs: { onSave: "onSave", onFormNavigate: "onFormNavigate", onCancel: "onCancel" }, host: { listeners: { "window:beforeunload": "handleBeforeUnload($event)" } }, providers: [ValidatorService], ngImport: i0, template: "<p>base-form works!</p>\n", styles: [""] });
|
|
1580
1580
|
}
|
|
1581
1581
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BaseFormComponent, decorators: [{
|
|
1582
1582
|
type: Component,
|
|
1583
|
-
args: [{ selector: 'base-form', providers: [ValidatorService], template: "<p>base-form works!</p>\
|
|
1583
|
+
args: [{ selector: 'base-form', providers: [ValidatorService], template: "<p>base-form works!</p>\n" }]
|
|
1584
1584
|
}], ctorParameters: () => [{ type: BaseService }, { type: ValidatorService }, { type: i3$4.Router }, { type: i3$4.ActivatedRoute }, { type: BaseStore }, { type: BaseQuery }], propDecorators: { onSave: [{
|
|
1585
1585
|
type: Output
|
|
1586
1586
|
}], onFormNavigate: [{
|
|
@@ -1663,11 +1663,11 @@ class DateComponent extends BaseControlComponent {
|
|
|
1663
1663
|
return SHARED.EMPTY;
|
|
1664
1664
|
}
|
|
1665
1665
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DateComponent, deps: [{ token: BaseStore }, { token: DateParserService }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
1666
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DateComponent, isStandalone: true, selector: "date", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (attributeModel && record) {\
|
|
1666
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DateComponent, isStandalone: true, selector: "date", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (attributeModel && record) {\n<div class=\"\">\n <div class=\"mb-2\">\n <label>{{\n attributeModel?.displayText\n ? attributeModel?.displayText\n : attributeModel?.name\n }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n @if (attributeModel.readonly) {\n <div class=\"mb-2\" [ngStyle]=\"{ 'font-size': '14px', color: '#0F1729', 'font-weight':'600' }\">\n <label>{{ getValue() }}</label>\n </div>\n } @else {\n <div>\n <p-calendar\n [showIcon]=\"attributeModel.showCalenderIcon ?? true\"\n inputId=\"icon\"\n [disabled]=\"attributeModel?.readonly ?? false\"\n [required]=\"attributeModel?.isRequired ?? false\"\n [name]=\"attributeModel?.name ? attributeModel?.name : 'testDatePicker'\"\n [placeholder]=\"\n attributeModel.placeholder ? attributeModel.placeholder : ''\n \"\n [yearRange]=\"attributeModel.yearRange ?? '1950 : 2050'\"\n [title]=\"attributeModel.title ? attributeModel.title : ''\"\n [(ngModel)]=\"record[attributeModel?.name]\"\n #dateField=\"ngModel\"\n [dateFormat]=\"'dd/mm/yy'\"\n appendTo=\"body\"\n (ngModelChange)=\"handleModelChange($event, dateField.valid)\"\n [ngClass]=\"{\n 'ng-dirty ng-invalid': !dateField.valid && error == attributeModel?.name\n }\"\n [hourFormat]=\"attributeModel?.hourFormat ? '24' : ''\"\n >\n </p-calendar>\n </div>\n }\n</div>\n\n}\n", styles: [""], 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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: CalendarModule }, { kind: "component", type: i5$2.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "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", "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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
1667
1667
|
}
|
|
1668
1668
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DateComponent, decorators: [{
|
|
1669
1669
|
type: Component,
|
|
1670
|
-
args: [{ selector: 'date', standalone: true, imports: [CommonModule, CalendarModule, FormsModule], template: "@if (attributeModel && record) {\
|
|
1670
|
+
args: [{ selector: 'date', standalone: true, imports: [CommonModule, CalendarModule, FormsModule], template: "@if (attributeModel && record) {\n<div class=\"\">\n <div class=\"mb-2\">\n <label>{{\n attributeModel?.displayText\n ? attributeModel?.displayText\n : attributeModel?.name\n }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n @if (attributeModel.readonly) {\n <div class=\"mb-2\" [ngStyle]=\"{ 'font-size': '14px', color: '#0F1729', 'font-weight':'600' }\">\n <label>{{ getValue() }}</label>\n </div>\n } @else {\n <div>\n <p-calendar\n [showIcon]=\"attributeModel.showCalenderIcon ?? true\"\n inputId=\"icon\"\n [disabled]=\"attributeModel?.readonly ?? false\"\n [required]=\"attributeModel?.isRequired ?? false\"\n [name]=\"attributeModel?.name ? attributeModel?.name : 'testDatePicker'\"\n [placeholder]=\"\n attributeModel.placeholder ? attributeModel.placeholder : ''\n \"\n [yearRange]=\"attributeModel.yearRange ?? '1950 : 2050'\"\n [title]=\"attributeModel.title ? attributeModel.title : ''\"\n [(ngModel)]=\"record[attributeModel?.name]\"\n #dateField=\"ngModel\"\n [dateFormat]=\"'dd/mm/yy'\"\n appendTo=\"body\"\n (ngModelChange)=\"handleModelChange($event, dateField.valid)\"\n [ngClass]=\"{\n 'ng-dirty ng-invalid': !dateField.valid && error == attributeModel?.name\n }\"\n [hourFormat]=\"attributeModel?.hourFormat ? '24' : ''\"\n >\n </p-calendar>\n </div>\n }\n</div>\n\n}\n" }]
|
|
1671
1671
|
}], ctorParameters: () => [{ type: BaseStore }, { type: DateParserService }, { type: BaseQuery }] });
|
|
1672
1672
|
|
|
1673
1673
|
class FileUploadComponent extends BaseControlComponent {
|
|
@@ -1675,11 +1675,11 @@ class FileUploadComponent extends BaseControlComponent {
|
|
|
1675
1675
|
console.log(event);
|
|
1676
1676
|
}
|
|
1677
1677
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: FileUploadComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1678
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: FileUploadComponent, isStandalone: true, selector: "file-upload", usesInheritance: true, ngImport: i0, template: "<ng-container class=\"documentContainer\">\
|
|
1678
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: FileUploadComponent, isStandalone: true, selector: "file-upload", usesInheritance: true, ngImport: i0, template: "<ng-container class=\"documentContainer\">\n @if(!attributeModel.hideLabelOnForm){\n <div class=\"mb-2\">\n <label class=\"form-header-label\">{{ attributeModel?.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n }\n<div class=\"card flex justify-content-center\">\n <p-fileUpload \n mode=\"basic\" \n [chooseLabel]=\"record[attributeModel.name] ? attributeModel.displayText : 'No Files'\"\n chooseIcon=\"pi pi-plus\"\n [name]=\"attributeModel?.name\"\n accept=\"image/*,application/pdf\" \n [maxFileSize]=\"209715200\" class=\"fileUploader\"\n (onSelect)=\"handleSingleUpload($event)\" />\n</div>\n</ng-container>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i2$1.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }] });
|
|
1679
1679
|
}
|
|
1680
1680
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
1681
1681
|
type: Component,
|
|
1682
|
-
args: [{ selector: 'file-upload', standalone: true, imports: [CommonModule, FormsModule, FileUploadModule], template: "<ng-container class=\"documentContainer\">\
|
|
1682
|
+
args: [{ selector: 'file-upload', standalone: true, imports: [CommonModule, FormsModule, FileUploadModule], template: "<ng-container class=\"documentContainer\">\n @if(!attributeModel.hideLabelOnForm){\n <div class=\"mb-2\">\n <label class=\"form-header-label\">{{ attributeModel?.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n }\n<div class=\"card flex justify-content-center\">\n <p-fileUpload \n mode=\"basic\" \n [chooseLabel]=\"record[attributeModel.name] ? attributeModel.displayText : 'No Files'\"\n chooseIcon=\"pi pi-plus\"\n [name]=\"attributeModel?.name\"\n accept=\"image/*,application/pdf\" \n [maxFileSize]=\"209715200\" class=\"fileUploader\"\n (onSelect)=\"handleSingleUpload($event)\" />\n</div>\n</ng-container>" }]
|
|
1683
1683
|
}] });
|
|
1684
1684
|
|
|
1685
1685
|
class CapitalizeWordsPipe {
|
|
@@ -1716,11 +1716,11 @@ class TextAreaComponent extends BaseControlComponent {
|
|
|
1716
1716
|
}
|
|
1717
1717
|
}
|
|
1718
1718
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TextAreaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1719
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: TextAreaComponent, isStandalone: true, selector: "text-area", inputs: { rowspan: "rowspan" }, usesInheritance: true, ngImport: i0, template: "<ng-container class=\"textAreaContainer\">\
|
|
1719
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: TextAreaComponent, isStandalone: true, selector: "text-area", inputs: { rowspan: "rowspan" }, usesInheritance: true, ngImport: i0, template: "<ng-container class=\"textAreaContainer\">\n <div *ngIf=\"attributeModel.displayText\" class=\"mb-2\">\n <label>{{ attributeModel.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n @if (attributeModel.readonly) {\n <div class=\"mb-2\" [ngStyle]=\"{'font-size':'14px', 'color':'#0F1729', 'font-weight':'600' }\">\n <label class=\"text-value-wrapper\" [ngStyle]=\"{color: attributeModel.textColorOnReadonly}\">{{ getValue() }}</label>\n </div>\n } @else {\n <div class=\"textAreaControl\">\n <textarea\n pInputTextarea\n [rows]=\"rowspan ?? 3\"\n cols=\"30\"\n [disabled]=\"attributeModel?.readonly ?? false\"\n [ngModel]=\"record[attributeModel.name]\"\n [name]=\"attributeModel.name ?? 'textArea'\"\n [required]=\"attributeModel?.isRequired ?? false\"\n [ngStyle]=\"{\n width: attributeModel.customColumnWidth\n ? attributeModel.customColumnWidth\n : ''\n }\"\n #textArea=\"ngModel\"\n (ngModelChange)=\"handleModelChange($event, textArea.valid)\"\n [ngClass]=\"{\n 'ng-dirty ng-invalid':\n (!textArea.valid && error == attributeModel?.name)\n \n }\"\n ></textarea>\n <div *ngIf=\"textArea.errors?.['required'] && (textArea.dirty || textArea.touched)\" class=\"error-message\">\n <small class=\"p-error\"><span class=\"capitalize\">{{attributeModel.name}}</span> is required</small>\n </div>\n </div>\n }\n</ng-container>\n", styles: [".asterisk{color:red}.textAreaControl{position:relative}.textAreaControl textarea{width:100%;resize:vertical}.textCount{position:absolute;bottom:10%;right:2%;color:#bcbcbc}.markRed{color:red}\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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: InputTextareaModule }, { kind: "directive", type: i2$2.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize", "variant"], outputs: ["onResize"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
1720
1720
|
}
|
|
1721
1721
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TextAreaComponent, decorators: [{
|
|
1722
1722
|
type: Component,
|
|
1723
|
-
args: [{ selector: 'text-area', standalone: true, imports: [CommonModule, InputTextareaModule, FormsModule], template: "<ng-container class=\"textAreaContainer\">\
|
|
1723
|
+
args: [{ selector: 'text-area', standalone: true, imports: [CommonModule, InputTextareaModule, FormsModule], template: "<ng-container class=\"textAreaContainer\">\n <div *ngIf=\"attributeModel.displayText\" class=\"mb-2\">\n <label>{{ attributeModel.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n @if (attributeModel.readonly) {\n <div class=\"mb-2\" [ngStyle]=\"{'font-size':'14px', 'color':'#0F1729', 'font-weight':'600' }\">\n <label class=\"text-value-wrapper\" [ngStyle]=\"{color: attributeModel.textColorOnReadonly}\">{{ getValue() }}</label>\n </div>\n } @else {\n <div class=\"textAreaControl\">\n <textarea\n pInputTextarea\n [rows]=\"rowspan ?? 3\"\n cols=\"30\"\n [disabled]=\"attributeModel?.readonly ?? false\"\n [ngModel]=\"record[attributeModel.name]\"\n [name]=\"attributeModel.name ?? 'textArea'\"\n [required]=\"attributeModel?.isRequired ?? false\"\n [ngStyle]=\"{\n width: attributeModel.customColumnWidth\n ? attributeModel.customColumnWidth\n : ''\n }\"\n #textArea=\"ngModel\"\n (ngModelChange)=\"handleModelChange($event, textArea.valid)\"\n [ngClass]=\"{\n 'ng-dirty ng-invalid':\n (!textArea.valid && error == attributeModel?.name)\n \n }\"\n ></textarea>\n <div *ngIf=\"textArea.errors?.['required'] && (textArea.dirty || textArea.touched)\" class=\"error-message\">\n <small class=\"p-error\"><span class=\"capitalize\">{{attributeModel.name}}</span> is required</small>\n </div>\n </div>\n }\n</ng-container>\n", styles: [".asterisk{color:red}.textAreaControl{position:relative}.textAreaControl textarea{width:100%;resize:vertical}.textCount{position:absolute;bottom:10%;right:2%;color:#bcbcbc}.markRed{color:red}\n"] }]
|
|
1724
1724
|
}], propDecorators: { rowspan: [{
|
|
1725
1725
|
type: Input
|
|
1726
1726
|
}] } });
|
|
@@ -1738,11 +1738,11 @@ class QueueSearchCustomerComponent {
|
|
|
1738
1738
|
console.log(SHARED.SELECTED_QUEUE, this.selectedQueue);
|
|
1739
1739
|
}
|
|
1740
1740
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueSearchCustomerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1741
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueSearchCustomerComponent, isStandalone: false, selector: "queue-search-customer", ngImport: i0, template: "<div class=\"flex mt-5 xl:mt-0 xl:justify-content-between xl:align-items-center vh-100\">\
|
|
1741
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueSearchCustomerComponent, isStandalone: false, selector: "queue-search-customer", ngImport: i0, template: "<div class=\"flex mt-5 xl:mt-0 xl:justify-content-between xl:align-items-center vh-100\">\n <div class=\"p-field m-0 p-0 w-full bg-white border-round\">\n <div class=\"p-inputgroup border-round-left bg-white\">\n <span class=\"p-inputgroup-addon bg-white\">\n <i class=\"pi pi-search\"></i>\n </span>\n <input type=\"text\" class=\"border-none h-44 border-noround-right bg-white\" pInputText placeholder=\"Search with Applicaiton no., Name or Address\" />\n </div>\n </div>\n <div class=\"p-field m-0 p-0 py-2 border-round-right border-noround-left\">\n <p-dropdown \n [styleClass]=\"'bg-white font-bold'\"\n [options]=\"queues\" \n [(ngModel)]=\"selectedQueue\" \n placeholder=\"All queue\"\n optionLabel=\"name\"\n class=\"left-arrow-dropdown\"\n ></p-dropdown>\n </div>\n <div class=\"p-field p-0 m-0 ml-3\">\n <button class=\"py-3 border-none\" pButton type=\"button\" label=\"Search\" (click)=\"onSearch()\"></button>\n </div>\n </div>\n ", styles: [".p-inputgroup{width:100%}.bg-primary{background-color:#d9d9d9}::ng-deep .left-arrow-dropdown .p-dropdown{direction:rtl;width:100%;height:44px;border-top-left-radius:0;border-bottom-left-radius:0}::ng-deep .left-arrow-dropdown .p-dropdown-label{display:flex;align-items:center}.h-44{height:44px}@media screen and (min-width: 1200px){.vh-100{height:calc(100vh - 170px)}}.bg-while{background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i3$3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: i5$1.Dropdown, selector: "p-dropdown", 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", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }] });
|
|
1742
1742
|
}
|
|
1743
1743
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueSearchCustomerComponent, decorators: [{
|
|
1744
1744
|
type: Component,
|
|
1745
|
-
args: [{ selector: 'queue-search-customer', standalone: false, template: "<div class=\"flex mt-5 xl:mt-0 xl:justify-content-between xl:align-items-center vh-100\">\
|
|
1745
|
+
args: [{ selector: 'queue-search-customer', standalone: false, template: "<div class=\"flex mt-5 xl:mt-0 xl:justify-content-between xl:align-items-center vh-100\">\n <div class=\"p-field m-0 p-0 w-full bg-white border-round\">\n <div class=\"p-inputgroup border-round-left bg-white\">\n <span class=\"p-inputgroup-addon bg-white\">\n <i class=\"pi pi-search\"></i>\n </span>\n <input type=\"text\" class=\"border-none h-44 border-noround-right bg-white\" pInputText placeholder=\"Search with Applicaiton no., Name or Address\" />\n </div>\n </div>\n <div class=\"p-field m-0 p-0 py-2 border-round-right border-noround-left\">\n <p-dropdown \n [styleClass]=\"'bg-white font-bold'\"\n [options]=\"queues\" \n [(ngModel)]=\"selectedQueue\" \n placeholder=\"All queue\"\n optionLabel=\"name\"\n class=\"left-arrow-dropdown\"\n ></p-dropdown>\n </div>\n <div class=\"p-field p-0 m-0 ml-3\">\n <button class=\"py-3 border-none\" pButton type=\"button\" label=\"Search\" (click)=\"onSearch()\"></button>\n </div>\n </div>\n ", styles: [".p-inputgroup{width:100%}.bg-primary{background-color:#d9d9d9}::ng-deep .left-arrow-dropdown .p-dropdown{direction:rtl;width:100%;height:44px;border-top-left-radius:0;border-bottom-left-radius:0}::ng-deep .left-arrow-dropdown .p-dropdown-label{display:flex;align-items:center}.h-44{height:44px}@media screen and (min-width: 1200px){.vh-100{height:calc(100vh - 170px)}}.bg-while{background-color:#fff}\n"] }]
|
|
1746
1746
|
}], ctorParameters: () => [] });
|
|
1747
1747
|
|
|
1748
1748
|
class ROUTES {
|
|
@@ -1801,11 +1801,11 @@ class BlockListComponent {
|
|
|
1801
1801
|
}
|
|
1802
1802
|
}
|
|
1803
1803
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BlockListComponent, deps: [{ token: i3$4.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
1804
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: BlockListComponent, isStandalone: true, selector: "block-list", inputs: { queueData: "queueData", showQueueDataForm: "showQueueDataForm" }, outputs: { queueDataById: "queueDataById" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"card p-4 pr-3 mb-0\">\
|
|
1804
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: BlockListComponent, isStandalone: true, selector: "block-list", inputs: { queueData: "queueData", showQueueDataForm: "showQueueDataForm" }, outputs: { queueDataById: "queueDataById" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"card p-4 pr-3 mb-0\">\n <!-- <div class=\"px-4 w-full flex\">\n <button pButton pRipple label=\"Add New Queue\" routerLinkActive=\"router-link-active\" icon=\"pi pi-plus font-semibold\" class=\"py-3 justify-content-center font-semibold w-full border-round\" (click)=\"insertQueue()\"></button>\n </div> -->\n <div class=\"queues overflow-y-scroll scrollable\">\n\n @for(queue of queueData; let i = $index; track queue){\n <div class=\"flex flex-column gap-5 overflow-y-auto scrollable kanban-list\" [ngClass]=\"i !== 0 ? 'mt-2 pt-1' : ''\" #listEl style=\"min-height:2rem\" (click)=\"handleQueueClick(queue._id, false)\" >\n <div class=\"flex flex-column py-4 px-3 cursor-pointer queue-list-wrapper\" [ngClass]=\"{'active-queue-wrapper': queue._id === this.selectedQueueId}\">\n <div class=\"flex text-center justify-content-between flex align-items-center\">\n <!-- <button class=\"btn-edit\" type=\"button\" pButton pRipple icon=\"pi pi-pencil\" -->\n <!-- (click)=\"handleQueueClick(queue._id, true)\"></button> -->\n <span class=\"text-color queue-name font-semibold\"\n [ngClass]=\"{'active-title-wrapper': queue._id === this.selectedQueueId}\"\n >{{queue.name}}</span>\n <p-badge [value]=\"queue.itemCount\" severity=\"primary\" />\n </div>\n </div>\n </div>\n }\n <div class=\"flex flex-column gap-5 overflow-y-auto mt-2 pt-1 scrollable kanban-list\" #listEl style=\"min-height:2rem\" >\n <div class=\"flex flex-column py-4 px-3 p-3 cursor-pointer queue-list-wrapper\">\n <div class=\"flex text-center justify-content-between flex align-items-center\">\n <!-- <button class=\"btn-edit\" type=\"button\" pButton pRipple icon=\"pi pi-pencil\" -->\n <!-- (click)=\"handleQueueClick(queue._id, true)\"></button> -->\n <span class=\"text-color queue-name font-semibold\"\n >Total Loss</span>\n <p-badge [value]=\"11\" severity=\"primary\" />\n </div>\n </div>\n </div>\n <div class=\"flex flex-column gap-5 overflow-y-auto mt-2 pt-1 scrollable kanban-list\" #listEl style=\"min-height:2rem\" >\n <div class=\"flex flex-column py-4 px-3 p-3 cursor-pointer queue-list-wrapper\">\n <div class=\"flex text-center justify-content-between flex align-items-center\">\n <!-- <button class=\"btn-edit\" type=\"button\" pButton pRipple icon=\"pi pi-pencil\" -->\n <!-- (click)=\"handleQueueClick(queue._id, true)\"></button> -->\n <span class=\"text-color queue-name font-semibold\"\n >Repair</span>\n <p-badge [value]=\"7\" severity=\"primary\" />\n </div>\n </div>\n </div>\n </div>\n</div> ", styles: [".block-list-wrapper{height:calc(100vh - 260px);overflow-y:scroll}.card{height:86vh}.scrollable{scroll-behavior:smooth;max-height:75vh}.queue-list-wrapper{border-radius:10px;border:1px solid rgba(76,98,146,.18);background:var(--surface-0)}.active-queue-wrapper{border:1px solid #0F8BFD}.active-title-wrapper{color:#0f8bfd!important}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background-color:#868181;border-radius:20px}.queue-name{max-width:150px;word-wrap:break-word;white-space:normal}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: RippleModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: BadgeModule }, { kind: "component", type: i3$5.Badge, selector: "p-badge", inputs: ["styleClass", "style", "badgeSize", "severity", "value", "badgeDisabled", "size"] }] });
|
|
1805
1805
|
}
|
|
1806
1806
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BlockListComponent, decorators: [{
|
|
1807
1807
|
type: Component,
|
|
1808
|
-
args: [{ selector: 'block-list', standalone: true, imports: [CommonModule, RippleModule, ButtonModule, RouterModule, BadgeModule], template: "<div class=\"card p-4 pr-3 mb-0\">\
|
|
1808
|
+
args: [{ selector: 'block-list', standalone: true, imports: [CommonModule, RippleModule, ButtonModule, RouterModule, BadgeModule], template: "<div class=\"card p-4 pr-3 mb-0\">\n <!-- <div class=\"px-4 w-full flex\">\n <button pButton pRipple label=\"Add New Queue\" routerLinkActive=\"router-link-active\" icon=\"pi pi-plus font-semibold\" class=\"py-3 justify-content-center font-semibold w-full border-round\" (click)=\"insertQueue()\"></button>\n </div> -->\n <div class=\"queues overflow-y-scroll scrollable\">\n\n @for(queue of queueData; let i = $index; track queue){\n <div class=\"flex flex-column gap-5 overflow-y-auto scrollable kanban-list\" [ngClass]=\"i !== 0 ? 'mt-2 pt-1' : ''\" #listEl style=\"min-height:2rem\" (click)=\"handleQueueClick(queue._id, false)\" >\n <div class=\"flex flex-column py-4 px-3 cursor-pointer queue-list-wrapper\" [ngClass]=\"{'active-queue-wrapper': queue._id === this.selectedQueueId}\">\n <div class=\"flex text-center justify-content-between flex align-items-center\">\n <!-- <button class=\"btn-edit\" type=\"button\" pButton pRipple icon=\"pi pi-pencil\" -->\n <!-- (click)=\"handleQueueClick(queue._id, true)\"></button> -->\n <span class=\"text-color queue-name font-semibold\"\n [ngClass]=\"{'active-title-wrapper': queue._id === this.selectedQueueId}\"\n >{{queue.name}}</span>\n <p-badge [value]=\"queue.itemCount\" severity=\"primary\" />\n </div>\n </div>\n </div>\n }\n <div class=\"flex flex-column gap-5 overflow-y-auto mt-2 pt-1 scrollable kanban-list\" #listEl style=\"min-height:2rem\" >\n <div class=\"flex flex-column py-4 px-3 p-3 cursor-pointer queue-list-wrapper\">\n <div class=\"flex text-center justify-content-between flex align-items-center\">\n <!-- <button class=\"btn-edit\" type=\"button\" pButton pRipple icon=\"pi pi-pencil\" -->\n <!-- (click)=\"handleQueueClick(queue._id, true)\"></button> -->\n <span class=\"text-color queue-name font-semibold\"\n >Total Loss</span>\n <p-badge [value]=\"11\" severity=\"primary\" />\n </div>\n </div>\n </div>\n <div class=\"flex flex-column gap-5 overflow-y-auto mt-2 pt-1 scrollable kanban-list\" #listEl style=\"min-height:2rem\" >\n <div class=\"flex flex-column py-4 px-3 p-3 cursor-pointer queue-list-wrapper\">\n <div class=\"flex text-center justify-content-between flex align-items-center\">\n <!-- <button class=\"btn-edit\" type=\"button\" pButton pRipple icon=\"pi pi-pencil\" -->\n <!-- (click)=\"handleQueueClick(queue._id, true)\"></button> -->\n <span class=\"text-color queue-name font-semibold\"\n >Repair</span>\n <p-badge [value]=\"7\" severity=\"primary\" />\n </div>\n </div>\n </div>\n </div>\n</div> ", styles: [".block-list-wrapper{height:calc(100vh - 260px);overflow-y:scroll}.card{height:86vh}.scrollable{scroll-behavior:smooth;max-height:75vh}.queue-list-wrapper{border-radius:10px;border:1px solid rgba(76,98,146,.18);background:var(--surface-0)}.active-queue-wrapper{border:1px solid #0F8BFD}.active-title-wrapper{color:#0f8bfd!important}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background-color:#868181;border-radius:20px}.queue-name{max-width:150px;word-wrap:break-word;white-space:normal}\n"] }]
|
|
1809
1809
|
}], ctorParameters: () => [{ type: i3$4.Router }], propDecorators: { queueData: [{
|
|
1810
1810
|
type: Input
|
|
1811
1811
|
}], showQueueDataForm: [{
|
|
@@ -2000,11 +2000,11 @@ class HEADERS {
|
|
|
2000
2000
|
|
|
2001
2001
|
class UsernameComponent extends BaseControlComponent {
|
|
2002
2002
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: UsernameComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2003
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: UsernameComponent, isStandalone: true, selector: "username", usesInheritance: true, ngImport: i0, template: "<ng-container>\
|
|
2003
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: UsernameComponent, isStandalone: true, selector: "username", usesInheritance: true, ngImport: i0, template: "<ng-container>\n <div *ngIf=\"attributeModel.displayText\" class=\"mb-2\">\n <label>{{ attributeModel.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n <div class=\"username-control\">\n <span class=\"p-input-icon-left\">\n <i class=\"pi pi-envelope\"></i>\n <input pInputText type=\"text\"\n autocomplete=\"off\"\n [placeholder]=\"attributeModel.placeholder ?? ''\" \n [ngModel]=\"record[attributeModel.name]\"\n [required]=\"attributeModel.isRequired ?? false\" \n [disabled]=\"attributeModel.readonly ?? false\"\n #usernameField=\"ngModel\"\n (ngModelChange)=\"handleModelChange($event, usernameField.valid)\" \n />\n </span>\n </div>\n </ng-container>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
2004
2004
|
}
|
|
2005
2005
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: UsernameComponent, decorators: [{
|
|
2006
2006
|
type: Component,
|
|
2007
|
-
args: [{ selector: 'username', standalone: true, imports: [CommonModule, InputTextModule, FormsModule], template: "<ng-container>\
|
|
2007
|
+
args: [{ selector: 'username', standalone: true, imports: [CommonModule, InputTextModule, FormsModule], template: "<ng-container>\n <div *ngIf=\"attributeModel.displayText\" class=\"mb-2\">\n <label>{{ attributeModel.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n <div class=\"username-control\">\n <span class=\"p-input-icon-left\">\n <i class=\"pi pi-envelope\"></i>\n <input pInputText type=\"text\"\n autocomplete=\"off\"\n [placeholder]=\"attributeModel.placeholder ?? ''\" \n [ngModel]=\"record[attributeModel.name]\"\n [required]=\"attributeModel.isRequired ?? false\" \n [disabled]=\"attributeModel.readonly ?? false\"\n #usernameField=\"ngModel\"\n (ngModelChange)=\"handleModelChange($event, usernameField.valid)\" \n />\n </span>\n </div>\n </ng-container>" }]
|
|
2008
2008
|
}] });
|
|
2009
2009
|
|
|
2010
2010
|
class PasswordComponent extends BaseControlComponent {
|
|
@@ -2016,11 +2016,11 @@ class PasswordComponent extends BaseControlComponent {
|
|
|
2016
2016
|
this.invalidPasswordErrorMsg = "Invalid Password";
|
|
2017
2017
|
}
|
|
2018
2018
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: PasswordComponent, deps: [{ token: BaseStore }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
2019
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: PasswordComponent, isStandalone: true, selector: "password", usesInheritance: true, ngImport: i0, template: "<ng-container>\
|
|
2019
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: PasswordComponent, isStandalone: true, selector: "password", usesInheritance: true, ngImport: i0, template: "<ng-container>\n <div *ngIf=\"attributeModel.displayText\" class=\"mb-2\">\n <label>{{ attributeModel.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n <div class=\"password-control\">\n <span class=\"p-input-icon-left\">\n <i class=\"pi pi-key\"></i>\n <input type=\"password\" autocomplete=\"off\" pInputText [placeholder]=\"attributeModel.placeholder ?? ''\"\n [ngModel]=\"record[attributeModel.name]\" [required]=\"attributeModel.isRequired ?? false\" #passwordField=\"ngModel\"\n (ngModelChange)=\"handleModelChange($event, passwordField.valid)\" [ngClass]=\"{\n 'ng-dirty ng-invalid': !passwordField.valid && error == attributeModel.name\n }\" class=\"block p-inputtext\" />\n\n </span>\n </div>\n @if (!passwordField.valid && passwordField.dirty) {\n <div>\n <small id=\"password-help\" class=\"p-error\">{{\n invalidPasswordErrorMsg\n }}</small>\n </div>\n }\n\n</ng-container>", styles: [""], 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: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
2020
2020
|
}
|
|
2021
2021
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: PasswordComponent, decorators: [{
|
|
2022
2022
|
type: Component,
|
|
2023
|
-
args: [{ selector: 'password', standalone: true, imports: [CommonModule, FormsModule], template: "<ng-container>\
|
|
2023
|
+
args: [{ selector: 'password', standalone: true, imports: [CommonModule, FormsModule], template: "<ng-container>\n <div *ngIf=\"attributeModel.displayText\" class=\"mb-2\">\n <label>{{ attributeModel.displayText }}</label>\n <span class=\"asterisk ml-1\" *ngIf=\"attributeModel.isRequired\">*</span>\n </div>\n <div class=\"password-control\">\n <span class=\"p-input-icon-left\">\n <i class=\"pi pi-key\"></i>\n <input type=\"password\" autocomplete=\"off\" pInputText [placeholder]=\"attributeModel.placeholder ?? ''\"\n [ngModel]=\"record[attributeModel.name]\" [required]=\"attributeModel.isRequired ?? false\" #passwordField=\"ngModel\"\n (ngModelChange)=\"handleModelChange($event, passwordField.valid)\" [ngClass]=\"{\n 'ng-dirty ng-invalid': !passwordField.valid && error == attributeModel.name\n }\" class=\"block p-inputtext\" />\n\n </span>\n </div>\n @if (!passwordField.valid && passwordField.dirty) {\n <div>\n <small id=\"password-help\" class=\"p-error\">{{\n invalidPasswordErrorMsg\n }}</small>\n </div>\n }\n\n</ng-container>" }]
|
|
2024
2024
|
}], ctorParameters: () => [{ type: BaseStore }, { type: BaseQuery }] });
|
|
2025
2025
|
|
|
2026
2026
|
class CSS {
|
|
@@ -2113,11 +2113,11 @@ class BaseContainerComponent {
|
|
|
2113
2113
|
this.service.initList();
|
|
2114
2114
|
}
|
|
2115
2115
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BaseContainerComponent, deps: [{ token: BaseService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2116
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: BaseContainerComponent, isStandalone: true, selector: "lib-base-container", ngImport: i0, template: "<p>base-container works!</p>\
|
|
2116
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: BaseContainerComponent, isStandalone: true, selector: "lib-base-container", ngImport: i0, template: "<p>base-container works!</p>\n", styles: [""] });
|
|
2117
2117
|
}
|
|
2118
2118
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BaseContainerComponent, decorators: [{
|
|
2119
2119
|
type: Component,
|
|
2120
|
-
args: [{ selector: 'lib-base-container', template: "<p>base-container works!</p>\
|
|
2120
|
+
args: [{ selector: 'lib-base-container', template: "<p>base-container works!</p>\n" }]
|
|
2121
2121
|
}], ctorParameters: () => [{ type: BaseService }] });
|
|
2122
2122
|
|
|
2123
2123
|
class LOOKUPS {
|
|
@@ -2274,11 +2274,11 @@ class TablePrimaryComponent {
|
|
|
2274
2274
|
this.templateDestroy$.complete();
|
|
2275
2275
|
}
|
|
2276
2276
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TablePrimaryComponent, deps: [{ token: i3$4.Router }, { token: BaseService }, { token: TableBuilder }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
2277
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: TablePrimaryComponent, isStandalone: true, selector: "lib-table-primary", inputs: { table: "table", metaData: "metaData", title: "title", showStatus: "showStatus", showActions: "showActions", showSearchBar: "showSearchBar", showNewRecordButton: "showNewRecordButton", showRefreshButton: "showRefreshButton", pathName: "pathName" }, viewQueries: [{ propertyName: "dt2", first: true, predicate: ["dt2"], descendants: true }, { propertyName: "paginator", first: true, predicate: ["paginator"], descendants: true }], ngImport: i0, template: "<p-table #dt2 [lazy]=\"true\" \r\n [paginator]=\"false\"\r\n [rows]=\"metaData.itemsPerPage\"\r\n [totalRecords]=\"metaData.totalItems\"\r\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\r\n (onPage)=\"handleLoadRecords($event)\"\r\n [ngClass]=\"{'no-pagination': metaData.totalItems <= 10}\"\r\n [columns]=\"table.headers\" class=\"table-primary-container\" [value]=\"table.records\">\r\n <ng-template pTemplate=\"caption\">\r\n <div class=\"table-header-wrapper flex align-items-center justify-content-between\">\r\n <h3 class=\"text-color table-title-wrapper text-color m-0\">{{title}}</h3>\r\n <div class=\"flex align-items-center w-full\" *ngIf=\"showSearchBar\">\r\n <div class=\"grid m-0 flex align-items-center w-full\">\r\n <div class=\"col-8 pl-0\">\r\n <input pInputText type=\"text\" [(ngModel)]=\"globalFilter\" (ngModelChange)=\"onSearchChange($event)\"\r\n [placeholder]=\"'Search ...'\" class=\"search-input-wrapper w-full\" />\r\n </div>\r\n <div class=\"col-4 pr-0 flex align-items-center justify-content-end gap-2 filter-dropdown-wrapper\">\r\n <p-dropdown \r\n [options]=\"statusList\" \r\n [(ngModel)]=\"isDataActive\" \r\n optionLabel=\"name\" \r\n placeholder=\"Status\"\r\n (onChange)=\"onStatusChange($event)\"\r\n />\r\n <p-button icon=\"pi pi-cog\" class=\"setting-icon-wrapper ml-3\"></p-button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Header Template -->\r\n <ng-template pTemplate=\"header\" let-columns>\r\n <tr *ngIf=\"table.headers.length > 0\">\r\n <th *ngFor=\"let col of table.headers\" class=\"p-4\" [ngClass]=\"col.width ? col.width : 'w-full'\">\r\n <h4 class=\"flex align-items-center table-header-title capitalize text-color font-semibold m-0\" [pSortableColumn]=\"col.name\" (click)=\"handleSortColumn(col.name)\">\r\n <span class=\"table-title-wrapper text-overflow-wrapper p-0 mt-1\">{{ col.name }}</span>\r\n <p-sortIcon [field]=\"col.name\"></p-sortIcon>\r\n </h4>\r\n </th>\r\n <th *ngIf=\"showActions\" [permission]=\"this.table.editPermission ?? this.table.deletePermission\" class=\"table-action-title p-4\" [ngClass]=\"table.headers[0]?.width ? 'w-2' : 'w-full'\">\r\n <h4 class=\"text-color font-semibold table-title-wrapper text-overflow-wrapper capitalize m-0\">Actions</h4></th>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Table Body -->\r\n <ng-template pTemplate=\"body\" let-rowData>\r\n <tr *ngIf=\"table.headers.length > 0\" class=\"table-row-wrapper relative table-group-wrapper\">\r\n <td class=\"text-left p-4\" *ngFor=\"let col of table.headers\">\r\n <div class=\"table-text-wrapper text-overflow-wrapper p-0\" \r\n [ngClass]=\"{\r\n 'enable-badge-wrapper': col.name.toLowerCase() === 'status' && rowData[col.name] === 'Enable',\r\n 'disable-badge-wrapper': col.name.toLowerCase() === 'status' && rowData[col.name] === 'Disable',\r\n 'w-8': col.name.toLowerCase() === 'status',\r\n 'text-primary font-semibold': col.name.toLowerCase() === 'action' || col.name.toLowerCase() === 'name'\r\n }\"\r\n >\r\n <span *ngIf=\"col.name.toLowerCase() === 'body'; else normalText\" [innerHTML]=\"decodeHtml(rowData[col.name])\"></span>\r\n <ng-template #normalText>\r\n {{ rowData[col.name] }}\r\n </ng-template>\r\n <p *ngIf=\"col.name.toLowerCase() === 'action'\" class=\"text-color font-normal\">{{rowData['apiEndPoint']}}</p>\r\n </div>\r\n </td>\r\n\r\n <!-- Actions -->\r\n <td *ngIf=\"showActions\" class=\"action-data-wrapper text-left p-4\">\r\n <div class=\"flex align-items-center\">\r\n <p-button icon=\"pi pi-pencil\" [permission]=\"this.table.editPermission\" (click)=\"handleEditClick(rowData._id)\" class=\"edit-icon-wrapper mr-3\"></p-button>\r\n <p-button icon=\"pi pi-trash\" [permission]=\"this.table.deletePermission\" (click)=\"deleteRow(rowData)\" class=\"delete-icon-wrapper mr-3\"></p-button>\r\n </div>\r\n </td>\r\n <!-- <p-button icon=\"pi pi-eye\" (click)=\"viewRow(rowData)\" class=\"view-icon-wrapper icon-position-wrapper table-group-wrapper-hover:visible\"></p-button> -->\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template pTemplate=\"emptymessage\">\r\n <tr>\r\n <td [attr.colspan]=\"table.headers.length + (showActions ? 1 : 0)\" class=\"text-center text-color font-semibold p-4\">\r\n No records found\r\n </td>\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n\r\n<div *ngIf=\"metaData.totalItems > 10\" class=\"paginator-container flex align-items-center justify-content-center table-pagination-wrapper bg-white\">\r\n <div class=\"pagination-text text-color\">\r\n Showing {{ (metaData.currentPage - 1) * metaData.itemsPerPage + 1 }} to {{ recordNumber }} of {{ metaData?.totalItems || 0 }} entries\r\n </div>\r\n \r\n <p-paginator\r\n #paginator\r\n [rows]=\"metaData.itemsPerPage\"\r\n [totalRecords]=\"metaData.totalItems\"\r\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\r\n (onPageChange)=\"handleLoadRecords($event)\"\r\n ></p-paginator>\r\n </div>", styles: [".table-header-container{padding:20px 20px 20px 8px}.text-overflow-wrapper{display:block;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%;padding:.5rem;box-sizing:border-box}.table-title-wrapper{font-size:14px;-webkit-line-clamp:1}.table-text-wrapper{-webkit-line-clamp:2}.table-action-title{border-radius:0 10px 0 0;border-right:1px solid rgba(68,72,109,.1)!important}.action-data-wrapper{border-right:1px solid rgba(68,72,109,.1)!important}.enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}.disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}.search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.table-row-wrapper{position:relative;transition:all .3s ease-in-out}.icon-position-wrapper{position:absolute;top:50%;left:16%;transform:translate(-50%,-50%);opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}.table-row-wrapper:hover .icon-position-wrapper{opacity:1;visibility:visible}.table-group-wrapper:hover .icon-position-wrapper{visibility:visible;opacity:1}.radio-label-wrapper{color:#0f1729}.table-pagination-wrapper{border-radius:0 0 10px 10px;padding-bottom:10px}::ng-deep .no-pagination .p-datatable-table{border-radius:0 0 10px 10px;padding-bottom:24px!important}::ng-deep .filter-dropdown-wrapper .p-dropdown{padding:5px;background:#fff;border-radius:10px;border:1px solid rgba(76,98,146,.1)}::ng-deep .filter-dropdown-wrapper .p-dropdown .p-placeholder{color:var(--primary-color)}::ng-deep .filter-dropdown-wrapper .p-dropdown .p-dropdown-clear-icon{color:var(--primary-color)}::ng-deep .filter-dropdown-wrapper .p-dropdown .p-dropdown-trigger{color:var(--primary-color)}::ng-deep .edit-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .edit-icon-wrapper .p-button .pi-pencil{color:var(--primary-color)}::ng-deep .p-sortable-column.p-highlight,::ng-deep .p-sortable-column:not(.p-highlight):hover{background-color:inherit}::ng-deep .delete-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .delete-icon-wrapper .p-button .pi-trash{color:var(--red-500)}::ng-deep .setting-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:24px;height:50px}::ng-deep .setting-icon-wrapper .p-button .pi-cog{color:var(--primary-color)}::ng-deep .view-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.3);background:var(--surface-0);padding:20px;height:40px;box-shadow:none}::ng-deep .view-icon-wrapper .p-button .pi-eye{color:#44486d}::ng-deep .table-primary-container .p-datatable-table{min-width:50rem;padding:20px 20px 12px;background-color:#fff;table-layout:fixed}::ng-deep .table-primary-container .p-datatable-header{padding:20px 20px 0;border-radius:10px 10px 0 0!important;border:none!important}::ng-deep .table-primary-container .p-datatable-thead th{border:1px solid rgba(68,72,109,.1);border-left:none;border-right:none;background:#f9f9fa}::ng-deep .table-primary-container .p-datatable-thead th:first-child{border-radius:10px 0 0;border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-primary-container tr td{border-bottom:1px solid rgba(68,72,109,.1)}::ng-deep .table-primary-container tr td:first-child{border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-primary-container tr:last-child td:first-child{border-radius:0 0 0 10px}::ng-deep .table-primary-container tr:last-child td:last-child{border-radius:0 0 10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: HasPermissionDirective, selector: "[permission]", inputs: ["permission"] }, { kind: "directive", type: i3$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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i9.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", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: i9.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i9.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3$3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ToggleButtonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "ngmodule", type: PaginatorModule }, { kind: "component", type: i12.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "style", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "appendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first"], outputs: ["onPageChange"] }, { kind: "component", type: i5$1.Dropdown, selector: "p-dropdown", 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", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: DropdownModule }] });
|
|
2277
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: TablePrimaryComponent, isStandalone: true, selector: "lib-table-primary", inputs: { table: "table", metaData: "metaData", title: "title", showStatus: "showStatus", showActions: "showActions", showSearchBar: "showSearchBar", showNewRecordButton: "showNewRecordButton", showRefreshButton: "showRefreshButton", pathName: "pathName" }, viewQueries: [{ propertyName: "dt2", first: true, predicate: ["dt2"], descendants: true }, { propertyName: "paginator", first: true, predicate: ["paginator"], descendants: true }], ngImport: i0, template: "<p-table #dt2 [lazy]=\"true\" \n [paginator]=\"false\"\n [rows]=\"metaData.itemsPerPage\"\n [totalRecords]=\"metaData.totalItems\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n (onPage)=\"handleLoadRecords($event)\"\n [ngClass]=\"{'no-pagination': metaData.totalItems <= 10}\"\n [columns]=\"table.headers\" class=\"table-primary-container\" [value]=\"table.records\">\n <ng-template pTemplate=\"caption\">\n <div class=\"table-header-wrapper flex align-items-center justify-content-between\">\n <h3 class=\"text-color table-title-wrapper text-color m-0\">{{title}}</h3>\n <div class=\"flex align-items-center w-full\" *ngIf=\"showSearchBar\">\n <div class=\"grid m-0 flex align-items-center w-full\">\n <div class=\"col-8 pl-0\">\n <input pInputText type=\"text\" [(ngModel)]=\"globalFilter\" (ngModelChange)=\"onSearchChange($event)\"\n [placeholder]=\"'Search ...'\" class=\"search-input-wrapper w-full\" />\n </div>\n <div class=\"col-4 pr-0 flex align-items-center justify-content-end gap-2 filter-dropdown-wrapper\">\n <p-dropdown \n [options]=\"statusList\" \n [(ngModel)]=\"isDataActive\" \n optionLabel=\"name\" \n placeholder=\"Status\"\n (onChange)=\"onStatusChange($event)\"\n />\n <p-button icon=\"pi pi-cog\" class=\"setting-icon-wrapper ml-3\"></p-button>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n\n <!-- Header Template -->\n <ng-template pTemplate=\"header\" let-columns>\n <tr *ngIf=\"table.headers.length > 0\">\n <th *ngFor=\"let col of table.headers\" class=\"p-4\" [ngClass]=\"col.width ? col.width : 'w-full'\">\n <h4 class=\"flex align-items-center table-header-title capitalize text-color font-semibold m-0\" [pSortableColumn]=\"col.name\" (click)=\"handleSortColumn(col.name)\">\n <span class=\"table-title-wrapper text-overflow-wrapper p-0 mt-1\">{{ col.name }}</span>\n <p-sortIcon [field]=\"col.name\"></p-sortIcon>\n </h4>\n </th>\n <th *ngIf=\"showActions\" [permission]=\"this.table.editPermission ?? this.table.deletePermission\" class=\"table-action-title p-4\" [ngClass]=\"table.headers[0]?.width ? 'w-2' : 'w-full'\">\n <h4 class=\"text-color font-semibold table-title-wrapper text-overflow-wrapper capitalize m-0\">Actions</h4></th>\n </tr>\n </ng-template>\n\n <!-- Table Body -->\n <ng-template pTemplate=\"body\" let-rowData>\n <tr *ngIf=\"table.headers.length > 0\" class=\"table-row-wrapper relative table-group-wrapper\">\n <td class=\"text-left p-4\" *ngFor=\"let col of table.headers\">\n <div class=\"table-text-wrapper text-overflow-wrapper p-0\" \n [ngClass]=\"{\n 'enable-badge-wrapper': col.name.toLowerCase() === 'status' && rowData[col.name] === 'Enable',\n 'disable-badge-wrapper': col.name.toLowerCase() === 'status' && rowData[col.name] === 'Disable',\n 'w-8': col.name.toLowerCase() === 'status',\n 'text-primary font-semibold': col.name.toLowerCase() === 'action' || col.name.toLowerCase() === 'name'\n }\"\n >\n <span *ngIf=\"col.name.toLowerCase() === 'body'; else normalText\" [innerHTML]=\"decodeHtml(rowData[col.name])\"></span>\n <ng-template #normalText>\n {{ rowData[col.name] }}\n </ng-template>\n <p *ngIf=\"col.name.toLowerCase() === 'action'\" class=\"text-color font-normal\">{{rowData['apiEndPoint']}}</p>\n </div>\n </td>\n\n <!-- Actions -->\n <td *ngIf=\"showActions\" class=\"action-data-wrapper text-left p-4\">\n <div class=\"flex align-items-center\">\n <p-button icon=\"pi pi-pencil\" [permission]=\"this.table.editPermission\" (click)=\"handleEditClick(rowData._id)\" class=\"edit-icon-wrapper mr-3\"></p-button>\n <p-button icon=\"pi pi-trash\" [permission]=\"this.table.deletePermission\" (click)=\"deleteRow(rowData)\" class=\"delete-icon-wrapper mr-3\"></p-button>\n </div>\n </td>\n <!-- <p-button icon=\"pi pi-eye\" (click)=\"viewRow(rowData)\" class=\"view-icon-wrapper icon-position-wrapper table-group-wrapper-hover:visible\"></p-button> -->\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td [attr.colspan]=\"table.headers.length + (showActions ? 1 : 0)\" class=\"text-center text-color font-semibold p-4\">\n No records found\n </td>\n </tr>\n </ng-template>\n</p-table>\n\n<div *ngIf=\"metaData.totalItems > 10\" class=\"paginator-container flex align-items-center justify-content-center table-pagination-wrapper bg-white\">\n <div class=\"pagination-text text-color\">\n Showing {{ (metaData.currentPage - 1) * metaData.itemsPerPage + 1 }} to {{ recordNumber }} of {{ metaData?.totalItems || 0 }} entries\n </div>\n \n <p-paginator\n #paginator\n [rows]=\"metaData.itemsPerPage\"\n [totalRecords]=\"metaData.totalItems\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n (onPageChange)=\"handleLoadRecords($event)\"\n ></p-paginator>\n </div>", styles: [".table-header-container{padding:20px 20px 20px 8px}.text-overflow-wrapper{display:block;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%;padding:.5rem;box-sizing:border-box}.table-title-wrapper{font-size:14px;-webkit-line-clamp:1}.table-text-wrapper{-webkit-line-clamp:2}.table-action-title{border-radius:0 10px 0 0;border-right:1px solid rgba(68,72,109,.1)!important}.action-data-wrapper{border-right:1px solid rgba(68,72,109,.1)!important}.enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}.disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}.search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.table-row-wrapper{position:relative;transition:all .3s ease-in-out}.icon-position-wrapper{position:absolute;top:50%;left:16%;transform:translate(-50%,-50%);opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}.table-row-wrapper:hover .icon-position-wrapper{opacity:1;visibility:visible}.table-group-wrapper:hover .icon-position-wrapper{visibility:visible;opacity:1}.radio-label-wrapper{color:#0f1729}.table-pagination-wrapper{border-radius:0 0 10px 10px;padding-bottom:10px}::ng-deep .no-pagination .p-datatable-table{border-radius:0 0 10px 10px;padding-bottom:24px!important}::ng-deep .filter-dropdown-wrapper .p-dropdown{padding:5px;background:#fff;border-radius:10px;border:1px solid rgba(76,98,146,.1)}::ng-deep .filter-dropdown-wrapper .p-dropdown .p-placeholder{color:var(--primary-color)}::ng-deep .filter-dropdown-wrapper .p-dropdown .p-dropdown-clear-icon{color:var(--primary-color)}::ng-deep .filter-dropdown-wrapper .p-dropdown .p-dropdown-trigger{color:var(--primary-color)}::ng-deep .edit-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .edit-icon-wrapper .p-button .pi-pencil{color:var(--primary-color)}::ng-deep .p-sortable-column.p-highlight,::ng-deep .p-sortable-column:not(.p-highlight):hover{background-color:inherit}::ng-deep .delete-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .delete-icon-wrapper .p-button .pi-trash{color:var(--red-500)}::ng-deep .setting-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:24px;height:50px}::ng-deep .setting-icon-wrapper .p-button .pi-cog{color:var(--primary-color)}::ng-deep .view-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.3);background:var(--surface-0);padding:20px;height:40px;box-shadow:none}::ng-deep .view-icon-wrapper .p-button .pi-eye{color:#44486d}::ng-deep .table-primary-container .p-datatable-table{min-width:50rem;padding:20px 20px 12px;background-color:#fff;table-layout:fixed}::ng-deep .table-primary-container .p-datatable-header{padding:20px 20px 0;border-radius:10px 10px 0 0!important;border:none!important}::ng-deep .table-primary-container .p-datatable-thead th{border:1px solid rgba(68,72,109,.1);border-left:none;border-right:none;background:#f9f9fa}::ng-deep .table-primary-container .p-datatable-thead th:first-child{border-radius:10px 0 0;border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-primary-container tr td{border-bottom:1px solid rgba(68,72,109,.1)}::ng-deep .table-primary-container tr td:first-child{border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-primary-container tr:last-child td:first-child{border-radius:0 0 0 10px}::ng-deep .table-primary-container tr:last-child td:last-child{border-radius:0 0 10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: HasPermissionDirective, selector: "[permission]", inputs: ["permission"] }, { kind: "directive", type: i3$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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i9.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", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: i9.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i9.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3$3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ToggleButtonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "ngmodule", type: PaginatorModule }, { kind: "component", type: i12.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "style", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "appendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first"], outputs: ["onPageChange"] }, { kind: "component", type: i5$1.Dropdown, selector: "p-dropdown", 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", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: DropdownModule }] });
|
|
2278
2278
|
}
|
|
2279
2279
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TablePrimaryComponent, decorators: [{
|
|
2280
2280
|
type: Component,
|
|
2281
|
-
args: [{ selector: 'lib-table-primary', standalone: true, imports: [CommonModule, SharedModule, TableModule, ButtonModule, ToggleButtonModule, FormsModule, InputSwitchModule, InputTextModule, TooltipModule, RadioButtonModule, PaginatorModule, DropdownModule], template: "<p-table #dt2 [lazy]=\"true\" \
|
|
2281
|
+
args: [{ selector: 'lib-table-primary', standalone: true, imports: [CommonModule, SharedModule, TableModule, ButtonModule, ToggleButtonModule, FormsModule, InputSwitchModule, InputTextModule, TooltipModule, RadioButtonModule, PaginatorModule, DropdownModule], template: "<p-table #dt2 [lazy]=\"true\" \n [paginator]=\"false\"\n [rows]=\"metaData.itemsPerPage\"\n [totalRecords]=\"metaData.totalItems\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n (onPage)=\"handleLoadRecords($event)\"\n [ngClass]=\"{'no-pagination': metaData.totalItems <= 10}\"\n [columns]=\"table.headers\" class=\"table-primary-container\" [value]=\"table.records\">\n <ng-template pTemplate=\"caption\">\n <div class=\"table-header-wrapper flex align-items-center justify-content-between\">\n <h3 class=\"text-color table-title-wrapper text-color m-0\">{{title}}</h3>\n <div class=\"flex align-items-center w-full\" *ngIf=\"showSearchBar\">\n <div class=\"grid m-0 flex align-items-center w-full\">\n <div class=\"col-8 pl-0\">\n <input pInputText type=\"text\" [(ngModel)]=\"globalFilter\" (ngModelChange)=\"onSearchChange($event)\"\n [placeholder]=\"'Search ...'\" class=\"search-input-wrapper w-full\" />\n </div>\n <div class=\"col-4 pr-0 flex align-items-center justify-content-end gap-2 filter-dropdown-wrapper\">\n <p-dropdown \n [options]=\"statusList\" \n [(ngModel)]=\"isDataActive\" \n optionLabel=\"name\" \n placeholder=\"Status\"\n (onChange)=\"onStatusChange($event)\"\n />\n <p-button icon=\"pi pi-cog\" class=\"setting-icon-wrapper ml-3\"></p-button>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n\n <!-- Header Template -->\n <ng-template pTemplate=\"header\" let-columns>\n <tr *ngIf=\"table.headers.length > 0\">\n <th *ngFor=\"let col of table.headers\" class=\"p-4\" [ngClass]=\"col.width ? col.width : 'w-full'\">\n <h4 class=\"flex align-items-center table-header-title capitalize text-color font-semibold m-0\" [pSortableColumn]=\"col.name\" (click)=\"handleSortColumn(col.name)\">\n <span class=\"table-title-wrapper text-overflow-wrapper p-0 mt-1\">{{ col.name }}</span>\n <p-sortIcon [field]=\"col.name\"></p-sortIcon>\n </h4>\n </th>\n <th *ngIf=\"showActions\" [permission]=\"this.table.editPermission ?? this.table.deletePermission\" class=\"table-action-title p-4\" [ngClass]=\"table.headers[0]?.width ? 'w-2' : 'w-full'\">\n <h4 class=\"text-color font-semibold table-title-wrapper text-overflow-wrapper capitalize m-0\">Actions</h4></th>\n </tr>\n </ng-template>\n\n <!-- Table Body -->\n <ng-template pTemplate=\"body\" let-rowData>\n <tr *ngIf=\"table.headers.length > 0\" class=\"table-row-wrapper relative table-group-wrapper\">\n <td class=\"text-left p-4\" *ngFor=\"let col of table.headers\">\n <div class=\"table-text-wrapper text-overflow-wrapper p-0\" \n [ngClass]=\"{\n 'enable-badge-wrapper': col.name.toLowerCase() === 'status' && rowData[col.name] === 'Enable',\n 'disable-badge-wrapper': col.name.toLowerCase() === 'status' && rowData[col.name] === 'Disable',\n 'w-8': col.name.toLowerCase() === 'status',\n 'text-primary font-semibold': col.name.toLowerCase() === 'action' || col.name.toLowerCase() === 'name'\n }\"\n >\n <span *ngIf=\"col.name.toLowerCase() === 'body'; else normalText\" [innerHTML]=\"decodeHtml(rowData[col.name])\"></span>\n <ng-template #normalText>\n {{ rowData[col.name] }}\n </ng-template>\n <p *ngIf=\"col.name.toLowerCase() === 'action'\" class=\"text-color font-normal\">{{rowData['apiEndPoint']}}</p>\n </div>\n </td>\n\n <!-- Actions -->\n <td *ngIf=\"showActions\" class=\"action-data-wrapper text-left p-4\">\n <div class=\"flex align-items-center\">\n <p-button icon=\"pi pi-pencil\" [permission]=\"this.table.editPermission\" (click)=\"handleEditClick(rowData._id)\" class=\"edit-icon-wrapper mr-3\"></p-button>\n <p-button icon=\"pi pi-trash\" [permission]=\"this.table.deletePermission\" (click)=\"deleteRow(rowData)\" class=\"delete-icon-wrapper mr-3\"></p-button>\n </div>\n </td>\n <!-- <p-button icon=\"pi pi-eye\" (click)=\"viewRow(rowData)\" class=\"view-icon-wrapper icon-position-wrapper table-group-wrapper-hover:visible\"></p-button> -->\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td [attr.colspan]=\"table.headers.length + (showActions ? 1 : 0)\" class=\"text-center text-color font-semibold p-4\">\n No records found\n </td>\n </tr>\n </ng-template>\n</p-table>\n\n<div *ngIf=\"metaData.totalItems > 10\" class=\"paginator-container flex align-items-center justify-content-center table-pagination-wrapper bg-white\">\n <div class=\"pagination-text text-color\">\n Showing {{ (metaData.currentPage - 1) * metaData.itemsPerPage + 1 }} to {{ recordNumber }} of {{ metaData?.totalItems || 0 }} entries\n </div>\n \n <p-paginator\n #paginator\n [rows]=\"metaData.itemsPerPage\"\n [totalRecords]=\"metaData.totalItems\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n (onPageChange)=\"handleLoadRecords($event)\"\n ></p-paginator>\n </div>", styles: [".table-header-container{padding:20px 20px 20px 8px}.text-overflow-wrapper{display:block;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%;padding:.5rem;box-sizing:border-box}.table-title-wrapper{font-size:14px;-webkit-line-clamp:1}.table-text-wrapper{-webkit-line-clamp:2}.table-action-title{border-radius:0 10px 0 0;border-right:1px solid rgba(68,72,109,.1)!important}.action-data-wrapper{border-right:1px solid rgba(68,72,109,.1)!important}.enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}.disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}.search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.table-row-wrapper{position:relative;transition:all .3s ease-in-out}.icon-position-wrapper{position:absolute;top:50%;left:16%;transform:translate(-50%,-50%);opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}.table-row-wrapper:hover .icon-position-wrapper{opacity:1;visibility:visible}.table-group-wrapper:hover .icon-position-wrapper{visibility:visible;opacity:1}.radio-label-wrapper{color:#0f1729}.table-pagination-wrapper{border-radius:0 0 10px 10px;padding-bottom:10px}::ng-deep .no-pagination .p-datatable-table{border-radius:0 0 10px 10px;padding-bottom:24px!important}::ng-deep .filter-dropdown-wrapper .p-dropdown{padding:5px;background:#fff;border-radius:10px;border:1px solid rgba(76,98,146,.1)}::ng-deep .filter-dropdown-wrapper .p-dropdown .p-placeholder{color:var(--primary-color)}::ng-deep .filter-dropdown-wrapper .p-dropdown .p-dropdown-clear-icon{color:var(--primary-color)}::ng-deep .filter-dropdown-wrapper .p-dropdown .p-dropdown-trigger{color:var(--primary-color)}::ng-deep .edit-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .edit-icon-wrapper .p-button .pi-pencil{color:var(--primary-color)}::ng-deep .p-sortable-column.p-highlight,::ng-deep .p-sortable-column:not(.p-highlight):hover{background-color:inherit}::ng-deep .delete-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .delete-icon-wrapper .p-button .pi-trash{color:var(--red-500)}::ng-deep .setting-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:24px;height:50px}::ng-deep .setting-icon-wrapper .p-button .pi-cog{color:var(--primary-color)}::ng-deep .view-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.3);background:var(--surface-0);padding:20px;height:40px;box-shadow:none}::ng-deep .view-icon-wrapper .p-button .pi-eye{color:#44486d}::ng-deep .table-primary-container .p-datatable-table{min-width:50rem;padding:20px 20px 12px;background-color:#fff;table-layout:fixed}::ng-deep .table-primary-container .p-datatable-header{padding:20px 20px 0;border-radius:10px 10px 0 0!important;border:none!important}::ng-deep .table-primary-container .p-datatable-thead th{border:1px solid rgba(68,72,109,.1);border-left:none;border-right:none;background:#f9f9fa}::ng-deep .table-primary-container .p-datatable-thead th:first-child{border-radius:10px 0 0;border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-primary-container tr td{border-bottom:1px solid rgba(68,72,109,.1)}::ng-deep .table-primary-container tr td:first-child{border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-primary-container tr:last-child td:first-child{border-radius:0 0 0 10px}::ng-deep .table-primary-container tr:last-child td:last-child{border-radius:0 0 10px}\n"] }]
|
|
2282
2282
|
}], ctorParameters: () => [{ type: i3$4.Router }, { type: BaseService }, { type: TableBuilder }, { type: BaseQuery }], propDecorators: { table: [{
|
|
2283
2283
|
type: Input
|
|
2284
2284
|
}], metaData: [{
|
|
@@ -2389,11 +2389,11 @@ class SkeletonComponent {
|
|
|
2389
2389
|
this.products = Array.from({ length: this.count }).map((_, i) => `Item #${i}`);
|
|
2390
2390
|
}
|
|
2391
2391
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SkeletonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2392
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: SkeletonComponent, isStandalone: true, selector: "lib-skeleton", inputs: { count: "count", columns: "columns", width: "width", height: "height", isAllowCard: "isAllowCard" }, ngImport: i0, template: "<div [ngClass]=\"{'card': isAllowCard}\">\
|
|
2392
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: SkeletonComponent, isStandalone: true, selector: "lib-skeleton", inputs: { count: "count", columns: "columns", width: "width", height: "height", isAllowCard: "isAllowCard" }, ngImport: i0, template: "<div [ngClass]=\"{'card': isAllowCard}\">\n <div *ngFor=\"let col of products\" class=\"mb-5\">\n <p-skeleton [width]=\"width\" [height]=\"height\" />\n </div>\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2$3.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "ngmodule", type: TableModule }] });
|
|
2393
2393
|
}
|
|
2394
2394
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: SkeletonComponent, decorators: [{
|
|
2395
2395
|
type: Component,
|
|
2396
|
-
args: [{ selector: 'lib-skeleton', standalone: true, imports: [CommonModule, SkeletonModule, TableModule], template: "<div [ngClass]=\"{'card': isAllowCard}\">\
|
|
2396
|
+
args: [{ selector: 'lib-skeleton', standalone: true, imports: [CommonModule, SkeletonModule, TableModule], template: "<div [ngClass]=\"{'card': isAllowCard}\">\n <div *ngFor=\"let col of products\" class=\"mb-5\">\n <p-skeleton [width]=\"width\" [height]=\"height\" />\n </div>\n</div>" }]
|
|
2397
2397
|
}], propDecorators: { count: [{
|
|
2398
2398
|
type: Input
|
|
2399
2399
|
}], columns: [{
|
|
@@ -3315,11 +3315,11 @@ class TableSecondaryComponent {
|
|
|
3315
3315
|
return 'default';
|
|
3316
3316
|
}
|
|
3317
3317
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TableSecondaryComponent, deps: [{ token: i3$4.Router }, { token: BaseService }, { token: SessionService }, { token: BaseQuery }, { token: BaseStore }, { token: QueueBusinessService }, { token: QueueQuery$1 }], target: i0.ɵɵFactoryTarget.Component });
|
|
3318
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: TableSecondaryComponent, isStandalone: true, selector: "lib-table-secondary", inputs: { table: "table", metaData: "metaData", title: "title", builder: "builder", showStatus: "showStatus", showActions: "showActions", showSearchBar: "showSearchBar", showNewRecordButton: "showNewRecordButton", showRefreshButton: "showRefreshButton", isShowSkeleton: "isShowSkeleton", pathName: "pathName", selectionMode: "selectionMode", selection: "selection", usePagination: "usePagination", scrollHeight: "scrollHeight", rowSelection: "rowSelection", enableSelection: "enableSelection", noRecordsMessage: "noRecordsMessage", sortField: "sortField", sortOrder: "sortOrder", searchTerm: "searchTerm", filterQuery: "filterQuery" }, outputs: { selectionChange: "selectionChange", rowSelectionChange: "rowSelectionChange", sortChanged: "sortChanged", onDeleteRow: "onDeleteRow", onPage: "onPage" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: ["paginator"], descendants: true }], usesOnChanges: true, ngImport: i0, template: " <lib-skeleton *ngIf=\"isShowSkeleton\" [count]=\"5\" [width]=\"'100%'\" [height]=\"'4.5rem'\"></lib-skeleton>\n <p-table\n *ngIf=\"table && table.headers && !isShowSkeleton\"\n #dt2\n [lazy]=\"true\"\n (onSort)=\"onSort($event)\"\n [paginator]=\"false\"\n [rows]=\"metaData?.itemsPerPage ?? 10\"\n [totalRecords]=\"metaData?.totalItems ?? 0\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n [first]=\"((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10)\"\n [columns]=\"table.headers\"\n class=\"table-secondary-container\"\n [value]=\"table.records\"\n [sortField]=\"sortField\"\n [sortOrder]=\"sortOrder\"\n [dataKey]=\"table.dataKey\"\n [selectionMode]=\"selectionMode\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [ngClass]=\"tableNgClassExpression ? evaluateNgClass(tableNgClassExpression, {}) : ''\"\n >\n <!-- Header -->\n <ng-template pTemplate=\"header\" let-columns>\n <tr *ngIf=\"table.headers.length > 0\">\n <th\n *ngFor=\"let col of table.headers; let i = index\"\n class=\"table-header-wrapper bg-white\"\n [pSortableColumn]=\"col.name\"\n [pSortableColumnDisabled]=\"!(table.isSortingAllow && col.isShowSortIcon)\"\n [ngClass]=\"[col.width ? col.width : 'w-full', (!showActions && selectionMode !== 'multiple' && (i === table.headers.length - 1)) ? 'table-action-title' : '']\"\n style=\"min-width: 100px\"\n > \n <h4\n [ngClass]=\"[\n col.class || '', \n getColumnAlignment(col.name) === 'justify-content-start' ? 'justify-content-start text-left' : 'justify-content-center text-center'\n ]\"\n class=\"flex align-items-center table-header-title font-semibold m-0\">\n {{ col.displayName || col.name }}\n @if(table.isSortingAllow && col.isShowSortIcon){\n <p-sortIcon [field]=\"col.name\" />\n }\n </h4>\n </th>\n \n <th *ngIf=\"selectionMode === 'multiple' && (!isUwLogin || (isUwLogin && (selectedQueueName === 'Unassigned')))\" \n class=\"table-header-wrapper text-right table-action-title\" style=\"width: 6rem;\">\n <h4 class=\"flex align-items-center justify-content-end gap-2 table-header-title capitalize font-semibold m-0\">\n <span *ngIf=\"selection?.length && !isSelectAll\">\n ({{ selection.length }})\n </span>\n <p-checkbox\n [binary]=\"true\"\n [ngModel]=\"isAllCurrentPageSelected\"\n (ngModelChange)=\"handleSelectAllRowData($event)\"></p-checkbox>\n </h4>\n </th>\n \n <th\n *ngIf=\"showActions\"\n class=\"table-action-title table-header-wrapper\"\n [ngClass]=\"table.headers[0]?.width ? 'w-2' : 'w-2'\"\n >\n </th>\n \n </tr>\n </ng-template>\n \n <!-- Body -->\n<ng-template pTemplate=\"body\" let-rowData>\n <tr *ngIf=\"table.headers.length > 0\" class=\"table-row-wrapper relative table-group-wrapper\">\n <!-- one TD per column -->\n <td *ngFor=\"let col of table.headers; let j = index\" class=\"p-0 border-none bg-none table-body-row-wrapper\"\n (click)=\"handleRowClick(rowData)\"\n [ngClass]=\"[rowData._columnWidths ? rowData._columnWidths?.[col.name] : col.width]\">\n <div class=\"table-body-wrapper table-row-card-wrapper\"\n [ngClass]=\"[\n rowData.rowNgClassExpression ? evaluateNgClass(rowData.rowNgClassExpression, rowData) : '',\n isRowSelected(rowData) ? 'row-selected' : '',\n selection?.includes(rowData) ? 'green-highlight' : ''\n ]\">\n \n <div class=\"flex align-items-center h-full\" [ngClass]=\"getColumnAlignment(col.name)\">\n <!-- your existing inner column wrapper -->\n <div class=\"row-wrapprt flex align-items-center\" [ngClass]=\"getColumnAlignment(col.name)\">\n <ng-container [ngSwitch]=\"getSwitchCase(rowData, col)\">\n <!-- task items - check this first -->\n <ng-container *ngSwitchCase=\"'taskItems'\">\n <div class=\"col-tasks\">\n <ng-container *ngFor=\"let taskItem of rowData[col.name]\">\n <div class=\"task-item\" [ngClass]=\"taskItem.status === 'warning' ? 'task-warning' : (taskItem.status === 'default' ? 'task-default' : 'task-success')\">\n <span class=\"font-semibold\">{{ taskItem.type }}</span>\n <span *ngIf=\"taskItem.count !== null && taskItem.count !== undefined\" class=\"task-badge\">{{ taskItem.count }}</span>\n </div>\n </ng-container>\n </div>\n </ng-container>\n \n <!-- Finance amount with special styling -->\n <ng-container *ngSwitchCase=\"'finance'\">\n <p class=\"text-black font-semibold mb-0\">\n {{ rowData[col.name].amount }}\n </p>\n </ng-container>\n \n <!-- App ID with type and risk tags -->\n <ng-container *ngSwitchCase=\"'appId'\">\n <div class=\"w-full text-left\">\n <p class=\"font-semibold mb-0 text-black\">{{ rowData[col.name].appId }}</p>\n <div class=\"flex gap-2 justify-content-start app-id-tags\">\n <!-- Type chip using style config (lending) -->\n <div *ngIf=\"rowData[col.name].type\" [ngClass]=\"getTypeContainerClass(rowData[col.name].type)\">\n <p class=\"mb-0\" [ngClass]=\"getTypeTextClass(rowData[col.name].type)\">\n {{ rowData[col.name].type }}\n </p>\n </div>\n <!-- Risk chip using style config (riskRating) -->\n <div *ngIf=\"rowData[col.name].risk && rowData[col.name].risk.toLowerCase() !== 'unknown'\"\n [ngClass]=\"getRiskContainerClass(rowData[col.name].risk)\">\n <p class=\"mb-0\" [ngClass]=\"getRiskTextClass(rowData[col.name].risk)\">\n {{ rowData[col.name].risk }}\n </p>\n </div>\n </div>\n </div>\n </ng-container>\n \n <!-- Broker with name and company name -->\n <ng-container *ngSwitchCase=\"'broker'\">\n <div class=\"w-full text-left\">\n <div class=\"font-medium\">{{ rowData[col.name].brokerName }}</div>\n <div *ngIf=\"rowData[col.name].brokerCompanyName\" class=\"text-gray-700\">\n {{ rowData[col.name].brokerCompanyName }}\n </div>\n </div>\n </ng-container>\n <!--Render two lines with dynamic classes for any two-line column -->\n <ng-container *ngSwitchCase=\"'twoLine'\">\n <div class=\"w-full\" [ngClass]=\"[\n getColumnAlignment(col.name) === 'justify-content-start' ? 'text-left' : 'text-center',\n rowData[col.name]?.containerClass || (col.containerNgClassExpression ? evaluateNgClass(col.containerNgClassExpression, rowData) : '')\n ]\">\n <div class=\"row-multi-line-wrapper flex align-items-center justify-content-center\">\n <i\n *ngIf=\"rowData[col.name]?.iconClass && rowData[col.name]?.addressLine1\"\n class=\"pi\"\n [ngClass]=\"[rowData[col.name].addressLine1, rowData[col.name].iconClass]\"\n ></i>\n <span\n *ngIf=\"!rowData[col.name]?.iconClass\"\n [ngClass]=\"getLine1DisplayClasses(col, rowData)\"\n >\n {{ rowData[col.name]?.addressLine1 }}\n </span>\n </div>\n <p class=\"row-multi-line-wrapper\"\n [ngClass]=\"rowData[col.name]?.textClass || (col.line2NgClassExpression ? evaluateNgClass(col.line2NgClassExpression, rowData) : '')\">\n {{ rowData[col.name]?.postCode }}\n </p>\n </div>\n </ng-container>\n <!-- progress bar -->\n <ng-container *ngSwitchCase=\"'progress'\">\n <div class=\"progress-wrapper\">\n <round-progress [current]=\"rowData['taskCompletionPercent']\" [max]=\"100\"\n [color]=\"getProgressColor(rowData['taskCompletionPercent'])\"\n [background]=\"getProgressBackground(rowData['taskCompletionPercent'])\" [radius]=\"125\" [stroke]=\"20\"\n [semicircle]=\"false\" [rounded]=\"true\" [clockwise]=\"true\" [responsive]=\"false\" [duration]=\"800\"\n [animation]=\"'easeInOutQuart'\" [animationDelay]=\"0\">\n </round-progress>\n <div class=\"progress-title\" [ngStyle]=\"{color: getProgressColor(rowData['taskCompletionPercent'])}\">\n {{ rowData[col.name] }}\n </div>\n </div>\n \n </ng-container>\n <!-- Default cell rendering for other columns -->\n <ng-container *ngSwitchDefault>\n <!-- Don't render default content if we have task items -->\n <ng-container *ngIf=\"!isTaskItemsArray(rowData[col.name])\">\n <div\n class=\"table-text-wrapper text-center p-0 flex align-items-center\"\n [ngClass]=\"[\n getRowClass(col, rowData),\n j === 0 ? 'justify-content-start' : 'justify-content-center'\n ]\"\n [ngStyle]=\"{ 'font-weight': col.name === table.showDecriptionFor ? 'bold' : 'normal' }\"\n >\n <div *ngIf=\"!col.skipParentNgClass\" [ngClass]=\"rowData[col.name]?.containerClass || (col.containerNgClassExpression ? evaluateNgClass(col.containerNgClassExpression, rowData) : '')\">\n <ng-container *ngTemplateOutlet=\"bubbleOrFallback\"></ng-container>\n </div>\n <ng-container *ngIf=\"col.skipParentNgClass\">\n <div class=\"w-full text-left\">\n <ng-container *ngTemplateOutlet=\"bubbleOrFallback\"></ng-container>\n </div>\n </ng-container>\n <ng-template #bubbleOrFallback>\n <ng-container *ngIf=\"isArray(rowData[col.name]) && rowData[col.name].length && rowData[col.name][0]?.fullName\">\n <div class=\"flex flex-column gap-1\">\n <ng-container *ngFor=\"let bubble of rowData[col.name]; let i = index\">\n <div\n *ngIf=\"bubble.isCustomerVulnerable\"\n class=\"px-2 py-1 border-round-2xl inline-block bg-red-600 text-white\"\n >\n {{ bubble.fullName }}\n </div>\n <p\n *ngIf=\"!bubble.isCustomerVulnerable\"\n class=\"mb-0\"\n [ngClass]=\"col.textNgClassExpression ? evaluateNgClass(col.textNgClassExpression, rowData) : 'text-gray-700'\"\n >\n {{ bubble.fullName }}\n </p>\n </ng-container>\n </div>\n </ng-container>\n <ng-container *ngIf=\"shouldShowValue(col, rowData)\">\n <div class=\"flex align-items-center gap-2\">\n <i\n *ngIf=\"rowData[col.name]?.icon\"\n class=\"pi\"\n [ngClass]=\"[rowData[col.name].icon, rowData[col.name].iconClass]\"\n ></i>\n <p class=\"mb-0\" [ngClass]=\"rowData[col.name]?.textClass || (col.textNgClassExpression ? evaluateNgClass(col.textNgClassExpression, rowData) : '')\">\n {{ rowData[col.name]?.text || rowData[col.name] }}\n </p>\n </div>\n </ng-container>\n </ng-template>\n <div\n *ngIf=\"col.name === table.showDecriptionFor && rowData[table.descriptionColumnName]\"\n class=\"text-black-500 text-sm mt-1\"\n style=\"font-weight: 600;\"\n >\n {{ rowData[table.descriptionColumnName] }}\n </div>\n </div>\n </ng-container>\n </ng-container>\n </ng-container>\n </div>\n </div>\n </div>\n </td>\n <!-- Checkbox column -->\n <td *ngIf=\"selectionMode === 'multiple' && (!isUwLogin || (isUwLogin && (selectedQueueName === 'Unassigned')))\" class=\"text-right p-0 border-none bg-none table-body-row-wrapper\"\n style=\"width: 4rem\" (click)=\"$event.stopPropagation()\">\n <div class=\"table-body-wrapper table-select-row-wrapper flex align-items-center justify-content-end\"\n [ngClass]=\"[\n rowData.rowNgClassExpression ? evaluateNgClass(rowData.rowNgClassExpression, rowData) : '',\n isRowSelected(rowData) ? 'row-selected' : '',\n selection?.includes(rowData) ? 'green-highlight' : ''\n ]\">\n <p-tableCheckbox [value]=\"rowData\" [disabled]=\"!enableSelection\"></p-tableCheckbox>\n </div>\n </td>\n\n <!-- Actions column -->\n <td *ngIf=\"showActions\" class=\"action-data-wrapper text-left table-body-wrapper\">\n <div *ngIf=\"(rowData.isRowDelete !== null || rowData.canDelete !== undefined) ? (showActions && rowData.isRowDelete) : showActions\" class=\"flex align-items-center justify-content-center\">\n <p-button\n icon=\"pi pi-trash\"\n (click)=\"deleteRow($event, rowData)\"\n class=\"delete-icon-wrapper mr-3\"\n [disabled]=\"!enableSelection\"\n ></p-button>\n </div>\n </td>\n </tr>\n</ng-template>\n \n <!-- Empty Message -->\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td\n [attr.colspan]=\"table.headers.length + (showActions ? 1 : 0) + (selectionMode === 'multiple' ? 1 : 0)\"\n class=\"text-center text-color font-semibold p-4\"\n >\n {{ noRecordsMessage }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n\n<!-- Paginator -->\n <div class=\"paginator-container flex align-items-center justify-content-center table-pagination-wrapper\" *ngIf=\"usePagination\">\n <div class=\"pagination-text text-color\">\n Showing {{ (metaData?.totalItems ?? 0) > 0 ? (((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10) + 1) : 0 }} to {{ recordNumber }} of {{ metaData?.totalItems ?? 0 }} entries\n </div>\n\n <p-paginator\n #paginator\n [first]=\"((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10)\"\n [rows]=\"metaData?.itemsPerPage ?? 10\"\n [totalRecords]=\"metaData?.totalItems ?? 0\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n (onPageChange)=\"handleLoadRecords($event)\"\n ></p-paginator>\n</div> ", styles: [".table-header-container{padding:20px 20px 20px 8px}.table-header-title{font-size:12px;font-weight:600;color:var(--text-color-tertiary)!important}.table-header-wrapper{padding:12px 14px}.queue-chip{display:inline-flex;align-items:center;justify-content:center;padding:0 .75rem;min-height:1.5rem;border-radius:9999px;font-size:12px;font-weight:600;line-height:1.2;white-space:nowrap;gap:.25rem;background-color:#e5e7eb;color:#111827;border:1px solid transparent;width:fit-content;max-width:100%}.queue-chip--danger{background-color:var(--color-red-600, #dc2626);color:#fff}.queue-chip--warning{background-color:var(--color-amber-500, #f59e0b);color:#fff}.queue-chip--neutral{background-color:var(--color-gray-300, #d1d5db);color:#111827}.queue-chip--success{background-color:var(--color-green-500, #22c55e);color:#fff}.queue-chip--info{background-color:var(--color-blue-500, #3b82f6);color:#fff}.queue-chip--light-green-success{background-color:var(--color-green-50, #f0fdf4);color:var(--color-green-700, #15803d);border:1px solid var(--color-green-200, #bbf7d0)}.queue-chip--light-amber-warning{background-color:var(--color-amber-50, #fffbeb);color:var(--color-amber-700, #b45309);border:1px solid var(--color-amber-200, #fde68a)}.queue-chip--light-red-danger{background-color:var(--color-red-50, #fef2f2);color:var(--color-red-700, #b91c1c);border:1px solid var(--color-red-200, #fecaca)}.queue-chip--light-neutral{background-color:var(--color-blue-50, #eff6ff);color:var(--color-blue-700, #1e40af);border:1px solid var(--color-blue-200, #bfdbfe)}.table-body-wrapper{padding:12px 14px}.column-style-wrapper{height:80px;margin-bottom:16px}.column-style-wrapper-tall{height:110px}.bubble-seperator-wrapper{margin-left:-12px}.applicant-vulnerable-customer-wrapper{background-color:var(--color-red-600)}.applicant-red-badge-wrapper{background-color:var(--color-red-400)}.applicant-amber-badge-wrapper{background-color:var(--color-amber-500)}.applicant-success-badge-wrapper{background-color:var(--color-green-500)}.red-text-wrapper{color:var(--color-red-500)}.amber-text-wrapper{color:var(--color-amber-500)}.success-text-wrapper{color:var(--color-green-500)}.record_username{color:#0f8bfd}.table-title-wrapper{font-size:20px;font-weight:700}.table-action-title,.header-text-wrapper,.action-data-wrapper{border-right:1px solid rgba(68,72,109,.1)!important}.enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}.verified-status{background-color:var(--green-500)}.disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}.search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.Verified{background-color:var(--green-400);padding:.3rem!important;border-radius:5px;color:#fff}.DirectDebitDetails{background-color:#b2eaf2;padding:.3rem!important;border-radius:5px;color:#00bcd4}.Application{background-color:#4caf501a;padding:.3rem!important;border-radius:5px;color:#4caf50}.Property{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}.Applicant,.ApplicationNote{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}.OnBoarding,.PropertyDetails{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}.Alert{background-color:var(--red-500);padding:.3rem!important;border-radius:5px;color:#fff}.Pending{background-color:var(--orange-300);padding:.3rem!important;border-radius:5px;color:#fff}.table-row-wrapper{position:relative;transition:all .3s ease-in-out}.icon-position-wrapper{position:absolute;top:50%;left:16%;transform:translate(-50%,-50%);opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}.table-row-wrapper:hover .icon-position-wrapper{opacity:1;visibility:visible}.table-group-wrapper:hover .icon-position-wrapper{visibility:visible;opacity:1}.table-pagination-wrapper{border-radius:0 0 10px 10px}::ng-deep .edit-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .edit-icon-wrapper .p-button .pi-pencil{color:var(--primary-color)}::ng-deep .delete-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .delete-icon-wrapper .p-button .pi-trash{color:var(--red-500)}::ng-deep .record_username{color:var(--primary-color)}::ng-deep .table-title-wrapper{font-size:20px;font-weight:700}::ng-deep .table-action-title,::ng-deep .header-text-wrapper{border-right:1px solid var(--primary-border-color)!important}::ng-deep .table-action-title{border-radius:0 10px 0 0}::ng-deep .action-data-wrapper{border-right:1px solid var(--primary-border-color)!important}::ng-deep .enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}::ng-deep .verified-status{background-color:var(--green-500)}::ng-deep .disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}::ng-deep .search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}::ng-deep .Verified{background-color:var(--green-400);padding:.3rem!important;border-radius:5px;color:#fff}::ng-deep .DirectDebitDetails{background-color:#b2eaf2;padding:.3rem!important;border-radius:5px;color:#00bcd4}::ng-deep .Application{background-color:#4caf501a;padding:.3rem!important;border-radius:5px;color:#4caf50}::ng-deep .Property{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .Applicant{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}::ng-deep .ApplicationNote{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}::ng-deep .OnBoarding{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .PropertyDetails{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .Alert{background-color:var(--red-500);padding:.3rem!important;border-radius:5px;color:#fff}::ng-deep .setting-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:24px;height:50px}::ng-deep .setting-icon-wrapper .p-button .pi-cog{color:var(--primary-color)}::ng-deep .view-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.3);background:var(--surface-0);padding:20px;height:40px;box-shadow:none}::ng-deep .view-icon-wrapper .p-button .pi-eye{color:#44486d}::ng-deep .table-secondary-container .p-datatable-table{background-color:#fff;table-layout:fixed}::ng-deep .table-secondary-container .p-datatable-table .p-datatable-thead{background-color:var(--color-surface)}::ng-deep .table-secondary-container .p-datatable-header{padding:20px 20px 0;border-radius:10px 10px 0 0!important;border:none!important}::ng-deep .table-secondary-container .p-datatable-thead th{border:1px solid rgba(68,72,109,.1);border-left:none;border-right:none}::ng-deep .table-secondary-container .p-datatable-thead th:first-child{border-radius:10px 0 0;border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr td{border-bottom:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr td:first-child{border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr:last-child td:first-child{border-radius:0 0 0 10px}::ng-deep .table-secondary-container tr:last-child td:last-child{border-radius:0 0 10px}::ng-deep .table-body-row-wrapper:first-child .border-row-wrapper{border-style:solid;border-width:1px 0 1px 1px;border-radius:.75rem 0 0 .75rem!important}::ng-deep .table-body-row-wrapper:not(:first-child):not(:last-child) .border-row-wrapper{border-style:solid;border-width:1px 0;border-radius:0!important}::ng-deep .table-body-row-wrapper:last-child .border-row-wrapper{border-style:solid;border-width:1px 1px 1px 0;border-radius:0 .75rem .75rem 0!important}::ng-deep .table-select-row-wrapper .border-row-wrapper{border-style:solid;border-width:1px 1px 1px 0;border-radius:0 .75rem .75rem 0!important}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:first-child .border-row-wrapper{border-width:3px 0 3px 3px}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:not(:first-child):not(:last-child) .border-row-wrapper{border-width:3px 0}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:last-child .border-row-wrapper{border-width:3px 3px 3px 0}::ng-deep .table-row-wrapper:hover .table-select-row-wrapper .border-row-wrapper{border-width:3px 3px 3px 0}.pending-badge-wrapper{background-color:#e5e7eb}:host ::ng-deep .p-checkbox-box.p-highlight{background-color:var(--color-green-500)!important;border-color:var(--color-green-500)!important}.green-highlight{background-color:var(--color-green-10)!important}:host ::ng-deep .p-checkbox-box.p-highlight .p-checkbox-icon{color:var(--color-surface-light)}:host ::ng-deep .p-checkbox-box:hover{border:1px solid #8a8ea6}:host ::ng-deep .p-checkbox-box.p-highlight:hover{background-color:var(--color-green-500)!important;border-color:var(--color-green-500)!important}@media screen and (min-width: 1200px) and (max-width: 1500px){.table-header-wrapper{padding:12px 8px;background-color:#fff}.table-body-wrapper{padding:8px}}.table-secondary-container .p-datatable-table{border-collapse:separate!important;border-spacing:50px!important;border-radius:10px}.table-secondary-container tr th{border:none!important}.border-round-full{border-radius:50%!important}.col-tasks{display:flex;width:75px;padding-left:10px;flex-direction:column;justify-content:center;align-items:flex-start;gap:7px}.task-item{display:flex;align-items:center;justify-content:space-between;border-radius:9999px;padding:0 3px 0 12px;font-size:12px;font-weight:600;width:100%;max-width:60px}.task-warning{background-color:#fdecce;color:#f59e0b}.task-success{background-color:#c5f7d7;color:#16a34a}.task-default{background-color:transparent;color:#1f2937;border:1px solid #d1d5db}.task-badge{background-color:#fff;border-radius:9999px;padding:3px 8px;color:#1f2937}.task-warning .task-badge{border:1px solid #f59e0b}.task-success .task-badge{border:1px solid #16a34a}.app-id-tags{margin-top:7px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: SkeletonComponent, selector: "lib-skeleton", inputs: ["count", "columns", "width", "height", "isAllowCard"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i9.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", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i9.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i9.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i9.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3$3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ToggleButtonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: PaginatorModule }, { kind: "component", type: i12.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "style", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "appendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first"], outputs: ["onPageChange"] }, { kind: "ngmodule", type: RoundProgressModule }, { kind: "component", type: i14.RoundProgressComponent, selector: "round-progress", inputs: ["current", "max", "radius", "animation", "animationDelay", "duration", "stroke", "color", "background", "responsive", "clockwise", "semicircle", "rounded"], outputs: ["onRender"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i3$2.Checkbox, selector: "p-checkbox", inputs: ["value", "name", "disabled", "binary", "label", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "styleClass", "labelStyleClass", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3318
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: TableSecondaryComponent, isStandalone: true, selector: "lib-table-secondary", inputs: { table: "table", metaData: "metaData", title: "title", builder: "builder", showStatus: "showStatus", showActions: "showActions", showSearchBar: "showSearchBar", showNewRecordButton: "showNewRecordButton", showRefreshButton: "showRefreshButton", isShowSkeleton: "isShowSkeleton", pathName: "pathName", selectionMode: "selectionMode", selection: "selection", usePagination: "usePagination", scrollHeight: "scrollHeight", rowSelection: "rowSelection", enableSelection: "enableSelection", noRecordsMessage: "noRecordsMessage", sortField: "sortField", sortOrder: "sortOrder", searchTerm: "searchTerm", filterQuery: "filterQuery" }, outputs: { selectionChange: "selectionChange", rowSelectionChange: "rowSelectionChange", sortChanged: "sortChanged", onDeleteRow: "onDeleteRow", onPage: "onPage" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: ["paginator"], descendants: true }], usesOnChanges: true, ngImport: i0, template: " <lib-skeleton *ngIf=\"isShowSkeleton\" [count]=\"5\" [width]=\"'100%'\" [height]=\"'4.5rem'\"></lib-skeleton>\n <p-table\n *ngIf=\"table && table.headers && !isShowSkeleton\"\n #dt2\n [lazy]=\"true\"\n (onSort)=\"onSort($event)\"\n [paginator]=\"false\"\n [rows]=\"metaData?.itemsPerPage ?? 10\"\n [totalRecords]=\"metaData?.totalItems ?? 0\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n [first]=\"((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10)\"\n [columns]=\"table.headers\"\n class=\"table-secondary-container\"\n [value]=\"table.records\"\n [sortField]=\"sortField\"\n [sortOrder]=\"sortOrder\"\n [dataKey]=\"table.dataKey\"\n [selectionMode]=\"selectionMode\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [ngClass]=\"tableNgClassExpression ? evaluateNgClass(tableNgClassExpression, {}) : ''\"\n >\n <!-- Header -->\n <ng-template pTemplate=\"header\" let-columns>\n <tr *ngIf=\"table.headers.length > 0\">\n <th\n *ngFor=\"let col of table.headers; let i = index\"\n class=\"table-header-wrapper bg-white\"\n [pSortableColumn]=\"col.name\"\n [pSortableColumnDisabled]=\"!(table.isSortingAllow && col.isShowSortIcon)\"\n [ngClass]=\"[col.width ? col.width : 'w-full', (!showActions && selectionMode !== 'multiple' && (i === table.headers.length - 1)) ? 'table-action-title' : '']\"\n style=\"min-width: 100px\"\n > \n <h4\n [ngClass]=\"[\n col.class || '', \n getColumnAlignment(col.name) === 'justify-content-start' ? 'justify-content-start text-left' : 'justify-content-center text-center'\n ]\"\n class=\"flex align-items-center table-header-title font-semibold m-0\">\n {{ col.displayName || col.name }}\n @if(table.isSortingAllow && col.isShowSortIcon){\n <p-sortIcon [field]=\"col.name\" />\n }\n </h4>\n </th>\n \n <th *ngIf=\"selectionMode === 'multiple' && (!isUwLogin || (isUwLogin && (selectedQueueName === 'Unassigned')))\" \n class=\"table-header-wrapper text-right table-action-title\" style=\"width: 6rem;\">\n <h4 class=\"flex align-items-center justify-content-end gap-2 table-header-title capitalize font-semibold m-0\">\n <span *ngIf=\"selection?.length && !isSelectAll\">\n ({{ selection.length }})\n </span>\n <p-checkbox\n [binary]=\"true\"\n [ngModel]=\"isAllCurrentPageSelected\"\n (ngModelChange)=\"handleSelectAllRowData($event)\"></p-checkbox>\n </h4>\n </th>\n \n <th\n *ngIf=\"showActions\"\n class=\"table-action-title table-header-wrapper\"\n [ngClass]=\"table.headers[0]?.width ? 'w-2' : 'w-2'\"\n >\n </th>\n \n </tr>\n </ng-template>\n \n <!-- Body -->\n<ng-template pTemplate=\"body\" let-rowData>\n <tr *ngIf=\"table.headers.length > 0\" class=\"table-row-wrapper relative table-group-wrapper\">\n <!-- one TD per column -->\n <td *ngFor=\"let col of table.headers; let j = index\" class=\"p-0 border-none bg-none table-body-row-wrapper\"\n (click)=\"handleRowClick(rowData)\"\n [ngClass]=\"[rowData._columnWidths ? rowData._columnWidths?.[col.name] : col.width]\">\n <div class=\"table-body-wrapper table-row-card-wrapper\"\n [ngClass]=\"[\n rowData.rowNgClassExpression ? evaluateNgClass(rowData.rowNgClassExpression, rowData) : '',\n isRowSelected(rowData) ? 'row-selected' : '',\n selection?.includes(rowData) ? 'green-highlight' : ''\n ]\">\n \n <div class=\"flex align-items-center h-full\" [ngClass]=\"getColumnAlignment(col.name)\">\n <!-- your existing inner column wrapper -->\n <div class=\"row-wrapprt flex align-items-center\" [ngClass]=\"getColumnAlignment(col.name)\">\n <ng-container [ngSwitch]=\"getSwitchCase(rowData, col)\">\n <!-- task items - check this first -->\n <ng-container *ngSwitchCase=\"'taskItems'\">\n <div class=\"col-tasks\">\n <ng-container *ngFor=\"let taskItem of rowData[col.name]\">\n <div class=\"task-item\" [ngClass]=\"taskItem.status === 'warning' ? 'task-warning' : (taskItem.status === 'default' ? 'task-default' : 'task-success')\">\n <span class=\"font-semibold\">{{ taskItem.type }}</span>\n <span *ngIf=\"taskItem.count !== null && taskItem.count !== undefined\" class=\"task-badge\">{{ taskItem.count }}</span>\n </div>\n </ng-container>\n </div>\n </ng-container>\n \n <!-- Finance amount with special styling -->\n <ng-container *ngSwitchCase=\"'finance'\">\n <p class=\"text-black font-semibold mb-0\">\n {{ rowData[col.name].amount }}\n </p>\n </ng-container>\n \n <!-- App ID with type and risk tags -->\n <ng-container *ngSwitchCase=\"'appId'\">\n <div class=\"w-full text-left\">\n <p class=\"font-semibold mb-0 text-black\">{{ rowData[col.name].appId }}</p>\n <div class=\"flex gap-2 justify-content-start app-id-tags\">\n <!-- Type chip using style config (lending) -->\n <div *ngIf=\"rowData[col.name].type\" [ngClass]=\"getTypeContainerClass(rowData[col.name].type)\">\n <small class=\"mb-0\" [ngClass]=\"getTypeTextClass(rowData[col.name].type)\">\n {{ rowData[col.name].type }}\n </small>\n </div>\n <!-- Risk chip using style config (riskRating) -->\n <div *ngIf=\"rowData[col.name].risk && rowData[col.name].risk.toLowerCase() !== 'unknown'\"\n [ngClass]=\"getRiskContainerClass(rowData[col.name].risk)\">\n <small class=\"mb-0\" [ngClass]=\"getRiskTextClass(rowData[col.name].risk)\">\n {{ rowData[col.name].risk }}\n </small>\n </div>\n </div>\n </div>\n </ng-container>\n \n <!-- Broker with name and company name -->\n <ng-container *ngSwitchCase=\"'broker'\">\n <div class=\"w-full text-left\">\n <div class=\"font-medium\">{{ rowData[col.name].brokerName }}</div>\n <div *ngIf=\"rowData[col.name].brokerCompanyName\" class=\"text-gray-700\">\n {{ rowData[col.name].brokerCompanyName }}\n </div>\n </div>\n </ng-container>\n <!--Render two lines with dynamic classes for any two-line column -->\n <ng-container *ngSwitchCase=\"'twoLine'\">\n <div class=\"w-full\" [ngClass]=\"[\n getColumnAlignment(col.name) === 'justify-content-start' ? 'text-left' : 'text-center',\n rowData[col.name]?.containerClass || (col.containerNgClassExpression ? evaluateNgClass(col.containerNgClassExpression, rowData) : '')\n ]\">\n <div class=\"row-multi-line-wrapper flex align-items-center justify-content-center\">\n <i\n *ngIf=\"rowData[col.name]?.iconClass && rowData[col.name]?.addressLine1\"\n class=\"pi\"\n [ngClass]=\"[rowData[col.name].addressLine1, rowData[col.name].iconClass]\"\n ></i>\n <span\n *ngIf=\"!rowData[col.name]?.iconClass\"\n [ngClass]=\"getLine1DisplayClasses(col, rowData)\"\n >\n {{ rowData[col.name]?.addressLine1 }}\n </span>\n </div>\n <p class=\"row-multi-line-wrapper\"\n [ngClass]=\"rowData[col.name]?.textClass || (col.line2NgClassExpression ? evaluateNgClass(col.line2NgClassExpression, rowData) : '')\">\n {{ rowData[col.name]?.postCode }}\n </p>\n </div>\n </ng-container>\n <!-- progress bar -->\n <ng-container *ngSwitchCase=\"'progress'\">\n <div class=\"progress-wrapper\">\n <round-progress [current]=\"rowData['taskCompletionPercent']\" [max]=\"100\"\n [color]=\"getProgressColor(rowData['taskCompletionPercent'])\"\n [background]=\"getProgressBackground(rowData['taskCompletionPercent'])\" [radius]=\"125\" [stroke]=\"20\"\n [semicircle]=\"false\" [rounded]=\"true\" [clockwise]=\"true\" [responsive]=\"false\" [duration]=\"800\"\n [animation]=\"'easeInOutQuart'\" [animationDelay]=\"0\">\n </round-progress>\n <div class=\"progress-title\" [ngStyle]=\"{color: getProgressColor(rowData['taskCompletionPercent'])}\">\n {{ rowData[col.name] }}\n </div>\n </div>\n \n </ng-container>\n <!-- Default cell rendering for other columns -->\n <ng-container *ngSwitchDefault>\n <!-- Don't render default content if we have task items -->\n <ng-container *ngIf=\"!isTaskItemsArray(rowData[col.name])\">\n <div\n class=\"table-text-wrapper text-center p-0 flex align-items-center\"\n [ngClass]=\"[\n getRowClass(col, rowData),\n j === 0 ? 'justify-content-start' : 'justify-content-center'\n ]\"\n [ngStyle]=\"{ 'font-weight': col.name === table.showDecriptionFor ? 'bold' : 'normal' }\"\n >\n <div *ngIf=\"!col.skipParentNgClass\" [ngClass]=\"rowData[col.name]?.containerClass || (col.containerNgClassExpression ? evaluateNgClass(col.containerNgClassExpression, rowData) : '')\">\n <ng-container *ngTemplateOutlet=\"bubbleOrFallback\"></ng-container>\n </div>\n <ng-container *ngIf=\"col.skipParentNgClass\">\n <div class=\"w-full text-left\">\n <ng-container *ngTemplateOutlet=\"bubbleOrFallback\"></ng-container>\n </div>\n </ng-container>\n <ng-template #bubbleOrFallback>\n <ng-container *ngIf=\"isArray(rowData[col.name]) && rowData[col.name].length && rowData[col.name][0]?.fullName\">\n <div class=\"flex flex-column gap-1\">\n <ng-container *ngFor=\"let bubble of rowData[col.name]; let i = index\">\n <div\n *ngIf=\"bubble.isCustomerVulnerable\"\n class=\"px-2 py-1 border-round-2xl inline-block bg-red-600 text-white\"\n >\n {{ bubble.fullName }}\n </div>\n <p\n *ngIf=\"!bubble.isCustomerVulnerable\"\n class=\"mb-0\"\n [ngClass]=\"col.textNgClassExpression ? evaluateNgClass(col.textNgClassExpression, rowData) : 'text-gray-700'\"\n >\n {{ bubble.fullName }}\n </p>\n </ng-container>\n </div>\n </ng-container>\n <ng-container *ngIf=\"shouldShowValue(col, rowData)\">\n <div class=\"flex align-items-center gap-2\">\n <i\n *ngIf=\"rowData[col.name]?.icon\"\n class=\"pi\"\n [ngClass]=\"[rowData[col.name].icon, rowData[col.name].iconClass]\"\n ></i>\n <p class=\"mb-0\" [ngClass]=\"rowData[col.name]?.textClass || (col.textNgClassExpression ? evaluateNgClass(col.textNgClassExpression, rowData) : '')\">\n {{ rowData[col.name]?.text || rowData[col.name] }}\n </p>\n </div>\n </ng-container>\n </ng-template>\n <div\n *ngIf=\"col.name === table.showDecriptionFor && rowData[table.descriptionColumnName]\"\n class=\"text-black-500 text-sm mt-1\"\n style=\"font-weight: 600;\"\n >\n {{ rowData[table.descriptionColumnName] }}\n </div>\n </div>\n </ng-container>\n </ng-container>\n </ng-container>\n </div>\n </div>\n </div>\n </td>\n <!-- Checkbox column -->\n <td *ngIf=\"selectionMode === 'multiple' && (!isUwLogin || (isUwLogin && (selectedQueueName === 'Unassigned')))\" class=\"text-right p-0 border-none bg-none table-body-row-wrapper\"\n style=\"width: 4rem\" (click)=\"$event.stopPropagation()\">\n <div class=\"table-body-wrapper table-select-row-wrapper flex align-items-center justify-content-end\"\n [ngClass]=\"[\n rowData.rowNgClassExpression ? evaluateNgClass(rowData.rowNgClassExpression, rowData) : '',\n isRowSelected(rowData) ? 'row-selected' : '',\n selection?.includes(rowData) ? 'green-highlight' : ''\n ]\">\n <p-tableCheckbox [value]=\"rowData\" [disabled]=\"!enableSelection\"></p-tableCheckbox>\n </div>\n </td>\n\n <!-- Actions column -->\n <td *ngIf=\"showActions\" class=\"action-data-wrapper text-left table-body-wrapper\">\n <div *ngIf=\"(rowData.isRowDelete !== null || rowData.canDelete !== undefined) ? (showActions && rowData.isRowDelete) : showActions\" class=\"flex align-items-center justify-content-center\">\n <p-button\n icon=\"pi pi-trash\"\n (click)=\"deleteRow($event, rowData)\"\n class=\"delete-icon-wrapper mr-3\"\n [disabled]=\"!enableSelection\"\n ></p-button>\n </div>\n </td>\n </tr>\n</ng-template>\n \n <!-- Empty Message -->\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td\n [attr.colspan]=\"table.headers.length + (showActions ? 1 : 0) + (selectionMode === 'multiple' ? 1 : 0)\"\n class=\"text-center text-color font-semibold p-4\"\n >\n {{ noRecordsMessage }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n\n<!-- Paginator -->\n <div class=\"paginator-container flex align-items-center justify-content-center table-pagination-wrapper\" *ngIf=\"usePagination\">\n <div class=\"pagination-text text-color\">\n Showing {{ (metaData?.totalItems ?? 0) > 0 ? (((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10) + 1) : 0 }} to {{ recordNumber }} of {{ metaData?.totalItems ?? 0 }} entries\n </div>\n\n <p-paginator\n #paginator\n [first]=\"((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10)\"\n [rows]=\"metaData?.itemsPerPage ?? 10\"\n [totalRecords]=\"metaData?.totalItems ?? 0\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n (onPageChange)=\"handleLoadRecords($event)\"\n ></p-paginator>\n</div> ", styles: [".table-header-container{padding:20px 20px 20px 8px}.table-header-title{font-size:12px;font-weight:600;color:var(--text-color-tertiary)!important}.table-header-wrapper{padding:12px 14px}.queue-chip{display:inline-flex;align-items:center;justify-content:center;padding:0 .75rem;min-height:1.5rem;border-radius:9999px;font-size:12px;font-weight:600;line-height:1.2;white-space:nowrap;gap:.25rem;background-color:#e5e7eb;color:#111827;border:1px solid transparent;width:fit-content;max-width:100%}.queue-chip--danger{background-color:var(--color-red-600, #dc2626);color:#fff}.queue-chip--warning{background-color:var(--color-amber-500, #f59e0b);color:#fff}.queue-chip--neutral{background-color:var(--color-gray-300, #d1d5db);color:#111827}.queue-chip--success{background-color:var(--color-green-500, #22c55e);color:#fff}.queue-chip--info{background-color:var(--color-blue-500, #3b82f6);color:#fff}.queue-chip--light-green-success{background-color:var(--color-green-50, #f0fdf4);color:var(--color-green-700, #15803d);border:1px solid var(--color-green-200, #bbf7d0)}.queue-chip--light-amber-warning{background-color:var(--color-amber-50, #fffbeb);color:var(--color-amber-700, #b45309);border:1px solid var(--color-amber-200, #fde68a)}.queue-chip--light-red-danger{background-color:var(--color-red-50, #fef2f2);color:var(--color-red-700, #b91c1c);border:1px solid var(--color-red-200, #fecaca)}.queue-chip--light-neutral{background-color:var(--color-blue-50, #eff6ff);color:var(--color-blue-700, #1e40af);border:1px solid var(--color-blue-200, #bfdbfe)}.table-body-wrapper{padding:12px 14px}.column-style-wrapper{height:80px;margin-bottom:16px}.column-style-wrapper-tall{height:110px}.bubble-seperator-wrapper{margin-left:-12px}.applicant-vulnerable-customer-wrapper{background-color:var(--color-red-600)}.applicant-red-badge-wrapper{background-color:var(--color-red-400)}.applicant-amber-badge-wrapper{background-color:var(--color-amber-500)}.applicant-success-badge-wrapper{background-color:var(--color-green-500)}.red-text-wrapper{color:var(--color-red-500)}.amber-text-wrapper{color:var(--color-amber-500)}.success-text-wrapper{color:var(--color-green-500)}.record_username{color:#0f8bfd}.table-title-wrapper{font-size:20px;font-weight:700}.table-action-title,.header-text-wrapper,.action-data-wrapper{border-right:1px solid rgba(68,72,109,.1)!important}.enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}.verified-status{background-color:var(--green-500)}.disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}.search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.Verified{background-color:var(--green-400);padding:.3rem!important;border-radius:5px;color:#fff}.DirectDebitDetails{background-color:#b2eaf2;padding:.3rem!important;border-radius:5px;color:#00bcd4}.Application{background-color:#4caf501a;padding:.3rem!important;border-radius:5px;color:#4caf50}.Property{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}.Applicant,.ApplicationNote{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}.OnBoarding,.PropertyDetails{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}.Alert{background-color:var(--red-500);padding:.3rem!important;border-radius:5px;color:#fff}.Pending{background-color:var(--orange-300);padding:.3rem!important;border-radius:5px;color:#fff}.table-row-wrapper{position:relative;transition:all .3s ease-in-out}.icon-position-wrapper{position:absolute;top:50%;left:16%;transform:translate(-50%,-50%);opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}.table-row-wrapper:hover .icon-position-wrapper{opacity:1;visibility:visible}.table-group-wrapper:hover .icon-position-wrapper{visibility:visible;opacity:1}.table-pagination-wrapper{border-radius:0 0 10px 10px}::ng-deep .edit-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .edit-icon-wrapper .p-button .pi-pencil{color:var(--primary-color)}::ng-deep .delete-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .delete-icon-wrapper .p-button .pi-trash{color:var(--red-500)}::ng-deep .record_username{color:var(--primary-color)}::ng-deep .table-title-wrapper{font-size:20px;font-weight:700}::ng-deep .table-action-title,::ng-deep .header-text-wrapper{border-right:1px solid var(--primary-border-color)!important}::ng-deep .table-action-title{border-radius:0 10px 0 0}::ng-deep .action-data-wrapper{border-right:1px solid var(--primary-border-color)!important}::ng-deep .enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}::ng-deep .verified-status{background-color:var(--green-500)}::ng-deep .disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}::ng-deep .search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}::ng-deep .Verified{background-color:var(--green-400);padding:.3rem!important;border-radius:5px;color:#fff}::ng-deep .DirectDebitDetails{background-color:#b2eaf2;padding:.3rem!important;border-radius:5px;color:#00bcd4}::ng-deep .Application{background-color:#4caf501a;padding:.3rem!important;border-radius:5px;color:#4caf50}::ng-deep .Property{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .Applicant{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}::ng-deep .ApplicationNote{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}::ng-deep .OnBoarding{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .PropertyDetails{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .Alert{background-color:var(--red-500);padding:.3rem!important;border-radius:5px;color:#fff}::ng-deep .setting-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:24px;height:50px}::ng-deep .setting-icon-wrapper .p-button .pi-cog{color:var(--primary-color)}::ng-deep .view-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.3);background:var(--surface-0);padding:20px;height:40px;box-shadow:none}::ng-deep .view-icon-wrapper .p-button .pi-eye{color:#44486d}::ng-deep .table-secondary-container .p-datatable-table{background-color:#fff;table-layout:fixed}::ng-deep .table-secondary-container .p-datatable-table .p-datatable-thead{background-color:var(--color-surface)}::ng-deep .table-secondary-container .p-datatable-header{padding:20px 20px 0;border-radius:10px 10px 0 0!important;border:none!important}::ng-deep .table-secondary-container .p-datatable-thead th{border:1px solid rgba(68,72,109,.1);border-left:none;border-right:none}::ng-deep .table-secondary-container .p-datatable-thead th:first-child{border-radius:10px 0 0;border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr td{border-bottom:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr td:first-child{border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr:last-child td:first-child{border-radius:0 0 0 10px}::ng-deep .table-secondary-container tr:last-child td:last-child{border-radius:0 0 10px}::ng-deep .table-body-row-wrapper:first-child .border-row-wrapper{border-style:solid;border-width:1px 0 1px 1px;border-radius:.75rem 0 0 .75rem!important}::ng-deep .table-body-row-wrapper:not(:first-child):not(:last-child) .border-row-wrapper{border-style:solid;border-width:1px 0;border-radius:0!important}::ng-deep .table-body-row-wrapper:last-child .border-row-wrapper{border-style:solid;border-width:1px 1px 1px 0;border-radius:0 .75rem .75rem 0!important}::ng-deep .table-select-row-wrapper .border-row-wrapper{border-style:solid;border-width:1px 1px 1px 0;border-radius:0 .75rem .75rem 0!important}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:first-child .border-row-wrapper{border-width:3px 0 3px 3px}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:not(:first-child):not(:last-child) .border-row-wrapper{border-width:3px 0}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:last-child .border-row-wrapper{border-width:3px 3px 3px 0}::ng-deep .table-row-wrapper:hover .table-select-row-wrapper .border-row-wrapper{border-width:3px 3px 3px 0}.pending-badge-wrapper{background-color:#e5e7eb}:host ::ng-deep .p-checkbox-box.p-highlight{background-color:var(--color-green-500)!important;border-color:var(--color-green-500)!important}.green-highlight{background-color:var(--color-green-10)!important}:host ::ng-deep .p-checkbox-box.p-highlight .p-checkbox-icon{color:var(--color-surface-light)}:host ::ng-deep .p-checkbox-box:hover{border:1px solid #8a8ea6}:host ::ng-deep .p-checkbox-box.p-highlight:hover{background-color:var(--color-green-500)!important;border-color:var(--color-green-500)!important}@media screen and (min-width: 1200px) and (max-width: 1500px){.table-header-wrapper{padding:12px 8px;background-color:#fff}.table-body-wrapper{padding:8px}}.table-secondary-container .p-datatable-table{border-collapse:separate!important;border-spacing:50px!important;border-radius:10px}.table-secondary-container tr th{border:none!important}.border-round-full{border-radius:50%!important}.col-tasks{display:flex;width:75px;padding-left:10px;flex-direction:column;justify-content:center;align-items:flex-start;gap:7px}.task-item{display:flex;align-items:center;justify-content:space-between;border-radius:9999px;padding:0 3px 0 12px;font-size:12px;font-weight:600;width:100%;max-width:60px}.task-warning{background-color:#fdecce;color:#f59e0b}.task-success{background-color:#c5f7d7;color:#16a34a}.task-default{background-color:transparent;color:#1f2937;border:1px solid #d1d5db}.task-badge{background-color:#fff;border-radius:9999px;padding:3px 8px;color:#1f2937}.task-warning .task-badge{border:1px solid #f59e0b}.task-success .task-badge{border:1px solid #16a34a}.app-id-tags{margin-top:7px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: SkeletonComponent, selector: "lib-skeleton", inputs: ["count", "columns", "width", "height", "isAllowCard"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i9.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", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i9.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i9.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i9.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3$3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ToggleButtonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: PaginatorModule }, { kind: "component", type: i12.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "style", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "appendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first"], outputs: ["onPageChange"] }, { kind: "ngmodule", type: RoundProgressModule }, { kind: "component", type: i14.RoundProgressComponent, selector: "round-progress", inputs: ["current", "max", "radius", "animation", "animationDelay", "duration", "stroke", "color", "background", "responsive", "clockwise", "semicircle", "rounded"], outputs: ["onRender"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i3$2.Checkbox, selector: "p-checkbox", inputs: ["value", "name", "disabled", "binary", "label", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "styleClass", "labelStyleClass", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3319
3319
|
}
|
|
3320
3320
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TableSecondaryComponent, decorators: [{
|
|
3321
3321
|
type: Component,
|
|
3322
|
-
args: [{ selector: 'lib-table-secondary', standalone: true, imports: [CommonModule, SkeletonComponent, TableModule, ButtonModule, ToggleButtonModule, FormsModule, InputSwitchModule, InputTextModule, TooltipModule, PaginatorModule, RoundProgressModule, CheckboxModule], changeDetection: ChangeDetectionStrategy.OnPush, template: " <lib-skeleton *ngIf=\"isShowSkeleton\" [count]=\"5\" [width]=\"'100%'\" [height]=\"'4.5rem'\"></lib-skeleton>\n <p-table\n *ngIf=\"table && table.headers && !isShowSkeleton\"\n #dt2\n [lazy]=\"true\"\n (onSort)=\"onSort($event)\"\n [paginator]=\"false\"\n [rows]=\"metaData?.itemsPerPage ?? 10\"\n [totalRecords]=\"metaData?.totalItems ?? 0\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n [first]=\"((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10)\"\n [columns]=\"table.headers\"\n class=\"table-secondary-container\"\n [value]=\"table.records\"\n [sortField]=\"sortField\"\n [sortOrder]=\"sortOrder\"\n [dataKey]=\"table.dataKey\"\n [selectionMode]=\"selectionMode\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [ngClass]=\"tableNgClassExpression ? evaluateNgClass(tableNgClassExpression, {}) : ''\"\n >\n <!-- Header -->\n <ng-template pTemplate=\"header\" let-columns>\n <tr *ngIf=\"table.headers.length > 0\">\n <th\n *ngFor=\"let col of table.headers; let i = index\"\n class=\"table-header-wrapper bg-white\"\n [pSortableColumn]=\"col.name\"\n [pSortableColumnDisabled]=\"!(table.isSortingAllow && col.isShowSortIcon)\"\n [ngClass]=\"[col.width ? col.width : 'w-full', (!showActions && selectionMode !== 'multiple' && (i === table.headers.length - 1)) ? 'table-action-title' : '']\"\n style=\"min-width: 100px\"\n > \n <h4\n [ngClass]=\"[\n col.class || '', \n getColumnAlignment(col.name) === 'justify-content-start' ? 'justify-content-start text-left' : 'justify-content-center text-center'\n ]\"\n class=\"flex align-items-center table-header-title font-semibold m-0\">\n {{ col.displayName || col.name }}\n @if(table.isSortingAllow && col.isShowSortIcon){\n <p-sortIcon [field]=\"col.name\" />\n }\n </h4>\n </th>\n \n <th *ngIf=\"selectionMode === 'multiple' && (!isUwLogin || (isUwLogin && (selectedQueueName === 'Unassigned')))\" \n class=\"table-header-wrapper text-right table-action-title\" style=\"width: 6rem;\">\n <h4 class=\"flex align-items-center justify-content-end gap-2 table-header-title capitalize font-semibold m-0\">\n <span *ngIf=\"selection?.length && !isSelectAll\">\n ({{ selection.length }})\n </span>\n <p-checkbox\n [binary]=\"true\"\n [ngModel]=\"isAllCurrentPageSelected\"\n (ngModelChange)=\"handleSelectAllRowData($event)\"></p-checkbox>\n </h4>\n </th>\n \n <th\n *ngIf=\"showActions\"\n class=\"table-action-title table-header-wrapper\"\n [ngClass]=\"table.headers[0]?.width ? 'w-2' : 'w-2'\"\n >\n </th>\n \n </tr>\n </ng-template>\n \n <!-- Body -->\n<ng-template pTemplate=\"body\" let-rowData>\n <tr *ngIf=\"table.headers.length > 0\" class=\"table-row-wrapper relative table-group-wrapper\">\n <!-- one TD per column -->\n <td *ngFor=\"let col of table.headers; let j = index\" class=\"p-0 border-none bg-none table-body-row-wrapper\"\n (click)=\"handleRowClick(rowData)\"\n [ngClass]=\"[rowData._columnWidths ? rowData._columnWidths?.[col.name] : col.width]\">\n <div class=\"table-body-wrapper table-row-card-wrapper\"\n [ngClass]=\"[\n rowData.rowNgClassExpression ? evaluateNgClass(rowData.rowNgClassExpression, rowData) : '',\n isRowSelected(rowData) ? 'row-selected' : '',\n selection?.includes(rowData) ? 'green-highlight' : ''\n ]\">\n \n <div class=\"flex align-items-center h-full\" [ngClass]=\"getColumnAlignment(col.name)\">\n <!-- your existing inner column wrapper -->\n <div class=\"row-wrapprt flex align-items-center\" [ngClass]=\"getColumnAlignment(col.name)\">\n <ng-container [ngSwitch]=\"getSwitchCase(rowData, col)\">\n <!-- task items - check this first -->\n <ng-container *ngSwitchCase=\"'taskItems'\">\n <div class=\"col-tasks\">\n <ng-container *ngFor=\"let taskItem of rowData[col.name]\">\n <div class=\"task-item\" [ngClass]=\"taskItem.status === 'warning' ? 'task-warning' : (taskItem.status === 'default' ? 'task-default' : 'task-success')\">\n <span class=\"font-semibold\">{{ taskItem.type }}</span>\n <span *ngIf=\"taskItem.count !== null && taskItem.count !== undefined\" class=\"task-badge\">{{ taskItem.count }}</span>\n </div>\n </ng-container>\n </div>\n </ng-container>\n \n <!-- Finance amount with special styling -->\n <ng-container *ngSwitchCase=\"'finance'\">\n <p class=\"text-black font-semibold mb-0\">\n {{ rowData[col.name].amount }}\n </p>\n </ng-container>\n \n <!-- App ID with type and risk tags -->\n <ng-container *ngSwitchCase=\"'appId'\">\n <div class=\"w-full text-left\">\n <p class=\"font-semibold mb-0 text-black\">{{ rowData[col.name].appId }}</p>\n <div class=\"flex gap-2 justify-content-start app-id-tags\">\n <!-- Type chip using style config (lending) -->\n <div *ngIf=\"rowData[col.name].type\" [ngClass]=\"getTypeContainerClass(rowData[col.name].type)\">\n <p class=\"mb-0\" [ngClass]=\"getTypeTextClass(rowData[col.name].type)\">\n {{ rowData[col.name].type }}\n </p>\n </div>\n <!-- Risk chip using style config (riskRating) -->\n <div *ngIf=\"rowData[col.name].risk && rowData[col.name].risk.toLowerCase() !== 'unknown'\"\n [ngClass]=\"getRiskContainerClass(rowData[col.name].risk)\">\n <p class=\"mb-0\" [ngClass]=\"getRiskTextClass(rowData[col.name].risk)\">\n {{ rowData[col.name].risk }}\n </p>\n </div>\n </div>\n </div>\n </ng-container>\n \n <!-- Broker with name and company name -->\n <ng-container *ngSwitchCase=\"'broker'\">\n <div class=\"w-full text-left\">\n <div class=\"font-medium\">{{ rowData[col.name].brokerName }}</div>\n <div *ngIf=\"rowData[col.name].brokerCompanyName\" class=\"text-gray-700\">\n {{ rowData[col.name].brokerCompanyName }}\n </div>\n </div>\n </ng-container>\n <!--Render two lines with dynamic classes for any two-line column -->\n <ng-container *ngSwitchCase=\"'twoLine'\">\n <div class=\"w-full\" [ngClass]=\"[\n getColumnAlignment(col.name) === 'justify-content-start' ? 'text-left' : 'text-center',\n rowData[col.name]?.containerClass || (col.containerNgClassExpression ? evaluateNgClass(col.containerNgClassExpression, rowData) : '')\n ]\">\n <div class=\"row-multi-line-wrapper flex align-items-center justify-content-center\">\n <i\n *ngIf=\"rowData[col.name]?.iconClass && rowData[col.name]?.addressLine1\"\n class=\"pi\"\n [ngClass]=\"[rowData[col.name].addressLine1, rowData[col.name].iconClass]\"\n ></i>\n <span\n *ngIf=\"!rowData[col.name]?.iconClass\"\n [ngClass]=\"getLine1DisplayClasses(col, rowData)\"\n >\n {{ rowData[col.name]?.addressLine1 }}\n </span>\n </div>\n <p class=\"row-multi-line-wrapper\"\n [ngClass]=\"rowData[col.name]?.textClass || (col.line2NgClassExpression ? evaluateNgClass(col.line2NgClassExpression, rowData) : '')\">\n {{ rowData[col.name]?.postCode }}\n </p>\n </div>\n </ng-container>\n <!-- progress bar -->\n <ng-container *ngSwitchCase=\"'progress'\">\n <div class=\"progress-wrapper\">\n <round-progress [current]=\"rowData['taskCompletionPercent']\" [max]=\"100\"\n [color]=\"getProgressColor(rowData['taskCompletionPercent'])\"\n [background]=\"getProgressBackground(rowData['taskCompletionPercent'])\" [radius]=\"125\" [stroke]=\"20\"\n [semicircle]=\"false\" [rounded]=\"true\" [clockwise]=\"true\" [responsive]=\"false\" [duration]=\"800\"\n [animation]=\"'easeInOutQuart'\" [animationDelay]=\"0\">\n </round-progress>\n <div class=\"progress-title\" [ngStyle]=\"{color: getProgressColor(rowData['taskCompletionPercent'])}\">\n {{ rowData[col.name] }}\n </div>\n </div>\n \n </ng-container>\n <!-- Default cell rendering for other columns -->\n <ng-container *ngSwitchDefault>\n <!-- Don't render default content if we have task items -->\n <ng-container *ngIf=\"!isTaskItemsArray(rowData[col.name])\">\n <div\n class=\"table-text-wrapper text-center p-0 flex align-items-center\"\n [ngClass]=\"[\n getRowClass(col, rowData),\n j === 0 ? 'justify-content-start' : 'justify-content-center'\n ]\"\n [ngStyle]=\"{ 'font-weight': col.name === table.showDecriptionFor ? 'bold' : 'normal' }\"\n >\n <div *ngIf=\"!col.skipParentNgClass\" [ngClass]=\"rowData[col.name]?.containerClass || (col.containerNgClassExpression ? evaluateNgClass(col.containerNgClassExpression, rowData) : '')\">\n <ng-container *ngTemplateOutlet=\"bubbleOrFallback\"></ng-container>\n </div>\n <ng-container *ngIf=\"col.skipParentNgClass\">\n <div class=\"w-full text-left\">\n <ng-container *ngTemplateOutlet=\"bubbleOrFallback\"></ng-container>\n </div>\n </ng-container>\n <ng-template #bubbleOrFallback>\n <ng-container *ngIf=\"isArray(rowData[col.name]) && rowData[col.name].length && rowData[col.name][0]?.fullName\">\n <div class=\"flex flex-column gap-1\">\n <ng-container *ngFor=\"let bubble of rowData[col.name]; let i = index\">\n <div\n *ngIf=\"bubble.isCustomerVulnerable\"\n class=\"px-2 py-1 border-round-2xl inline-block bg-red-600 text-white\"\n >\n {{ bubble.fullName }}\n </div>\n <p\n *ngIf=\"!bubble.isCustomerVulnerable\"\n class=\"mb-0\"\n [ngClass]=\"col.textNgClassExpression ? evaluateNgClass(col.textNgClassExpression, rowData) : 'text-gray-700'\"\n >\n {{ bubble.fullName }}\n </p>\n </ng-container>\n </div>\n </ng-container>\n <ng-container *ngIf=\"shouldShowValue(col, rowData)\">\n <div class=\"flex align-items-center gap-2\">\n <i\n *ngIf=\"rowData[col.name]?.icon\"\n class=\"pi\"\n [ngClass]=\"[rowData[col.name].icon, rowData[col.name].iconClass]\"\n ></i>\n <p class=\"mb-0\" [ngClass]=\"rowData[col.name]?.textClass || (col.textNgClassExpression ? evaluateNgClass(col.textNgClassExpression, rowData) : '')\">\n {{ rowData[col.name]?.text || rowData[col.name] }}\n </p>\n </div>\n </ng-container>\n </ng-template>\n <div\n *ngIf=\"col.name === table.showDecriptionFor && rowData[table.descriptionColumnName]\"\n class=\"text-black-500 text-sm mt-1\"\n style=\"font-weight: 600;\"\n >\n {{ rowData[table.descriptionColumnName] }}\n </div>\n </div>\n </ng-container>\n </ng-container>\n </ng-container>\n </div>\n </div>\n </div>\n </td>\n <!-- Checkbox column -->\n <td *ngIf=\"selectionMode === 'multiple' && (!isUwLogin || (isUwLogin && (selectedQueueName === 'Unassigned')))\" class=\"text-right p-0 border-none bg-none table-body-row-wrapper\"\n style=\"width: 4rem\" (click)=\"$event.stopPropagation()\">\n <div class=\"table-body-wrapper table-select-row-wrapper flex align-items-center justify-content-end\"\n [ngClass]=\"[\n rowData.rowNgClassExpression ? evaluateNgClass(rowData.rowNgClassExpression, rowData) : '',\n isRowSelected(rowData) ? 'row-selected' : '',\n selection?.includes(rowData) ? 'green-highlight' : ''\n ]\">\n <p-tableCheckbox [value]=\"rowData\" [disabled]=\"!enableSelection\"></p-tableCheckbox>\n </div>\n </td>\n\n <!-- Actions column -->\n <td *ngIf=\"showActions\" class=\"action-data-wrapper text-left table-body-wrapper\">\n <div *ngIf=\"(rowData.isRowDelete !== null || rowData.canDelete !== undefined) ? (showActions && rowData.isRowDelete) : showActions\" class=\"flex align-items-center justify-content-center\">\n <p-button\n icon=\"pi pi-trash\"\n (click)=\"deleteRow($event, rowData)\"\n class=\"delete-icon-wrapper mr-3\"\n [disabled]=\"!enableSelection\"\n ></p-button>\n </div>\n </td>\n </tr>\n</ng-template>\n \n <!-- Empty Message -->\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td\n [attr.colspan]=\"table.headers.length + (showActions ? 1 : 0) + (selectionMode === 'multiple' ? 1 : 0)\"\n class=\"text-center text-color font-semibold p-4\"\n >\n {{ noRecordsMessage }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n\n<!-- Paginator -->\n <div class=\"paginator-container flex align-items-center justify-content-center table-pagination-wrapper\" *ngIf=\"usePagination\">\n <div class=\"pagination-text text-color\">\n Showing {{ (metaData?.totalItems ?? 0) > 0 ? (((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10) + 1) : 0 }} to {{ recordNumber }} of {{ metaData?.totalItems ?? 0 }} entries\n </div>\n\n <p-paginator\n #paginator\n [first]=\"((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10)\"\n [rows]=\"metaData?.itemsPerPage ?? 10\"\n [totalRecords]=\"metaData?.totalItems ?? 0\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n (onPageChange)=\"handleLoadRecords($event)\"\n ></p-paginator>\n</div> ", styles: [".table-header-container{padding:20px 20px 20px 8px}.table-header-title{font-size:12px;font-weight:600;color:var(--text-color-tertiary)!important}.table-header-wrapper{padding:12px 14px}.queue-chip{display:inline-flex;align-items:center;justify-content:center;padding:0 .75rem;min-height:1.5rem;border-radius:9999px;font-size:12px;font-weight:600;line-height:1.2;white-space:nowrap;gap:.25rem;background-color:#e5e7eb;color:#111827;border:1px solid transparent;width:fit-content;max-width:100%}.queue-chip--danger{background-color:var(--color-red-600, #dc2626);color:#fff}.queue-chip--warning{background-color:var(--color-amber-500, #f59e0b);color:#fff}.queue-chip--neutral{background-color:var(--color-gray-300, #d1d5db);color:#111827}.queue-chip--success{background-color:var(--color-green-500, #22c55e);color:#fff}.queue-chip--info{background-color:var(--color-blue-500, #3b82f6);color:#fff}.queue-chip--light-green-success{background-color:var(--color-green-50, #f0fdf4);color:var(--color-green-700, #15803d);border:1px solid var(--color-green-200, #bbf7d0)}.queue-chip--light-amber-warning{background-color:var(--color-amber-50, #fffbeb);color:var(--color-amber-700, #b45309);border:1px solid var(--color-amber-200, #fde68a)}.queue-chip--light-red-danger{background-color:var(--color-red-50, #fef2f2);color:var(--color-red-700, #b91c1c);border:1px solid var(--color-red-200, #fecaca)}.queue-chip--light-neutral{background-color:var(--color-blue-50, #eff6ff);color:var(--color-blue-700, #1e40af);border:1px solid var(--color-blue-200, #bfdbfe)}.table-body-wrapper{padding:12px 14px}.column-style-wrapper{height:80px;margin-bottom:16px}.column-style-wrapper-tall{height:110px}.bubble-seperator-wrapper{margin-left:-12px}.applicant-vulnerable-customer-wrapper{background-color:var(--color-red-600)}.applicant-red-badge-wrapper{background-color:var(--color-red-400)}.applicant-amber-badge-wrapper{background-color:var(--color-amber-500)}.applicant-success-badge-wrapper{background-color:var(--color-green-500)}.red-text-wrapper{color:var(--color-red-500)}.amber-text-wrapper{color:var(--color-amber-500)}.success-text-wrapper{color:var(--color-green-500)}.record_username{color:#0f8bfd}.table-title-wrapper{font-size:20px;font-weight:700}.table-action-title,.header-text-wrapper,.action-data-wrapper{border-right:1px solid rgba(68,72,109,.1)!important}.enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}.verified-status{background-color:var(--green-500)}.disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}.search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.Verified{background-color:var(--green-400);padding:.3rem!important;border-radius:5px;color:#fff}.DirectDebitDetails{background-color:#b2eaf2;padding:.3rem!important;border-radius:5px;color:#00bcd4}.Application{background-color:#4caf501a;padding:.3rem!important;border-radius:5px;color:#4caf50}.Property{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}.Applicant,.ApplicationNote{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}.OnBoarding,.PropertyDetails{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}.Alert{background-color:var(--red-500);padding:.3rem!important;border-radius:5px;color:#fff}.Pending{background-color:var(--orange-300);padding:.3rem!important;border-radius:5px;color:#fff}.table-row-wrapper{position:relative;transition:all .3s ease-in-out}.icon-position-wrapper{position:absolute;top:50%;left:16%;transform:translate(-50%,-50%);opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}.table-row-wrapper:hover .icon-position-wrapper{opacity:1;visibility:visible}.table-group-wrapper:hover .icon-position-wrapper{visibility:visible;opacity:1}.table-pagination-wrapper{border-radius:0 0 10px 10px}::ng-deep .edit-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .edit-icon-wrapper .p-button .pi-pencil{color:var(--primary-color)}::ng-deep .delete-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .delete-icon-wrapper .p-button .pi-trash{color:var(--red-500)}::ng-deep .record_username{color:var(--primary-color)}::ng-deep .table-title-wrapper{font-size:20px;font-weight:700}::ng-deep .table-action-title,::ng-deep .header-text-wrapper{border-right:1px solid var(--primary-border-color)!important}::ng-deep .table-action-title{border-radius:0 10px 0 0}::ng-deep .action-data-wrapper{border-right:1px solid var(--primary-border-color)!important}::ng-deep .enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}::ng-deep .verified-status{background-color:var(--green-500)}::ng-deep .disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}::ng-deep .search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}::ng-deep .Verified{background-color:var(--green-400);padding:.3rem!important;border-radius:5px;color:#fff}::ng-deep .DirectDebitDetails{background-color:#b2eaf2;padding:.3rem!important;border-radius:5px;color:#00bcd4}::ng-deep .Application{background-color:#4caf501a;padding:.3rem!important;border-radius:5px;color:#4caf50}::ng-deep .Property{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .Applicant{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}::ng-deep .ApplicationNote{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}::ng-deep .OnBoarding{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .PropertyDetails{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .Alert{background-color:var(--red-500);padding:.3rem!important;border-radius:5px;color:#fff}::ng-deep .setting-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:24px;height:50px}::ng-deep .setting-icon-wrapper .p-button .pi-cog{color:var(--primary-color)}::ng-deep .view-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.3);background:var(--surface-0);padding:20px;height:40px;box-shadow:none}::ng-deep .view-icon-wrapper .p-button .pi-eye{color:#44486d}::ng-deep .table-secondary-container .p-datatable-table{background-color:#fff;table-layout:fixed}::ng-deep .table-secondary-container .p-datatable-table .p-datatable-thead{background-color:var(--color-surface)}::ng-deep .table-secondary-container .p-datatable-header{padding:20px 20px 0;border-radius:10px 10px 0 0!important;border:none!important}::ng-deep .table-secondary-container .p-datatable-thead th{border:1px solid rgba(68,72,109,.1);border-left:none;border-right:none}::ng-deep .table-secondary-container .p-datatable-thead th:first-child{border-radius:10px 0 0;border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr td{border-bottom:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr td:first-child{border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr:last-child td:first-child{border-radius:0 0 0 10px}::ng-deep .table-secondary-container tr:last-child td:last-child{border-radius:0 0 10px}::ng-deep .table-body-row-wrapper:first-child .border-row-wrapper{border-style:solid;border-width:1px 0 1px 1px;border-radius:.75rem 0 0 .75rem!important}::ng-deep .table-body-row-wrapper:not(:first-child):not(:last-child) .border-row-wrapper{border-style:solid;border-width:1px 0;border-radius:0!important}::ng-deep .table-body-row-wrapper:last-child .border-row-wrapper{border-style:solid;border-width:1px 1px 1px 0;border-radius:0 .75rem .75rem 0!important}::ng-deep .table-select-row-wrapper .border-row-wrapper{border-style:solid;border-width:1px 1px 1px 0;border-radius:0 .75rem .75rem 0!important}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:first-child .border-row-wrapper{border-width:3px 0 3px 3px}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:not(:first-child):not(:last-child) .border-row-wrapper{border-width:3px 0}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:last-child .border-row-wrapper{border-width:3px 3px 3px 0}::ng-deep .table-row-wrapper:hover .table-select-row-wrapper .border-row-wrapper{border-width:3px 3px 3px 0}.pending-badge-wrapper{background-color:#e5e7eb}:host ::ng-deep .p-checkbox-box.p-highlight{background-color:var(--color-green-500)!important;border-color:var(--color-green-500)!important}.green-highlight{background-color:var(--color-green-10)!important}:host ::ng-deep .p-checkbox-box.p-highlight .p-checkbox-icon{color:var(--color-surface-light)}:host ::ng-deep .p-checkbox-box:hover{border:1px solid #8a8ea6}:host ::ng-deep .p-checkbox-box.p-highlight:hover{background-color:var(--color-green-500)!important;border-color:var(--color-green-500)!important}@media screen and (min-width: 1200px) and (max-width: 1500px){.table-header-wrapper{padding:12px 8px;background-color:#fff}.table-body-wrapper{padding:8px}}.table-secondary-container .p-datatable-table{border-collapse:separate!important;border-spacing:50px!important;border-radius:10px}.table-secondary-container tr th{border:none!important}.border-round-full{border-radius:50%!important}.col-tasks{display:flex;width:75px;padding-left:10px;flex-direction:column;justify-content:center;align-items:flex-start;gap:7px}.task-item{display:flex;align-items:center;justify-content:space-between;border-radius:9999px;padding:0 3px 0 12px;font-size:12px;font-weight:600;width:100%;max-width:60px}.task-warning{background-color:#fdecce;color:#f59e0b}.task-success{background-color:#c5f7d7;color:#16a34a}.task-default{background-color:transparent;color:#1f2937;border:1px solid #d1d5db}.task-badge{background-color:#fff;border-radius:9999px;padding:3px 8px;color:#1f2937}.task-warning .task-badge{border:1px solid #f59e0b}.task-success .task-badge{border:1px solid #16a34a}.app-id-tags{margin-top:7px}\n"] }]
|
|
3322
|
+
args: [{ selector: 'lib-table-secondary', standalone: true, imports: [CommonModule, SkeletonComponent, TableModule, ButtonModule, ToggleButtonModule, FormsModule, InputSwitchModule, InputTextModule, TooltipModule, PaginatorModule, RoundProgressModule, CheckboxModule], changeDetection: ChangeDetectionStrategy.OnPush, template: " <lib-skeleton *ngIf=\"isShowSkeleton\" [count]=\"5\" [width]=\"'100%'\" [height]=\"'4.5rem'\"></lib-skeleton>\n <p-table\n *ngIf=\"table && table.headers && !isShowSkeleton\"\n #dt2\n [lazy]=\"true\"\n (onSort)=\"onSort($event)\"\n [paginator]=\"false\"\n [rows]=\"metaData?.itemsPerPage ?? 10\"\n [totalRecords]=\"metaData?.totalItems ?? 0\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n [first]=\"((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10)\"\n [columns]=\"table.headers\"\n class=\"table-secondary-container\"\n [value]=\"table.records\"\n [sortField]=\"sortField\"\n [sortOrder]=\"sortOrder\"\n [dataKey]=\"table.dataKey\"\n [selectionMode]=\"selectionMode\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [ngClass]=\"tableNgClassExpression ? evaluateNgClass(tableNgClassExpression, {}) : ''\"\n >\n <!-- Header -->\n <ng-template pTemplate=\"header\" let-columns>\n <tr *ngIf=\"table.headers.length > 0\">\n <th\n *ngFor=\"let col of table.headers; let i = index\"\n class=\"table-header-wrapper bg-white\"\n [pSortableColumn]=\"col.name\"\n [pSortableColumnDisabled]=\"!(table.isSortingAllow && col.isShowSortIcon)\"\n [ngClass]=\"[col.width ? col.width : 'w-full', (!showActions && selectionMode !== 'multiple' && (i === table.headers.length - 1)) ? 'table-action-title' : '']\"\n style=\"min-width: 100px\"\n > \n <h4\n [ngClass]=\"[\n col.class || '', \n getColumnAlignment(col.name) === 'justify-content-start' ? 'justify-content-start text-left' : 'justify-content-center text-center'\n ]\"\n class=\"flex align-items-center table-header-title font-semibold m-0\">\n {{ col.displayName || col.name }}\n @if(table.isSortingAllow && col.isShowSortIcon){\n <p-sortIcon [field]=\"col.name\" />\n }\n </h4>\n </th>\n \n <th *ngIf=\"selectionMode === 'multiple' && (!isUwLogin || (isUwLogin && (selectedQueueName === 'Unassigned')))\" \n class=\"table-header-wrapper text-right table-action-title\" style=\"width: 6rem;\">\n <h4 class=\"flex align-items-center justify-content-end gap-2 table-header-title capitalize font-semibold m-0\">\n <span *ngIf=\"selection?.length && !isSelectAll\">\n ({{ selection.length }})\n </span>\n <p-checkbox\n [binary]=\"true\"\n [ngModel]=\"isAllCurrentPageSelected\"\n (ngModelChange)=\"handleSelectAllRowData($event)\"></p-checkbox>\n </h4>\n </th>\n \n <th\n *ngIf=\"showActions\"\n class=\"table-action-title table-header-wrapper\"\n [ngClass]=\"table.headers[0]?.width ? 'w-2' : 'w-2'\"\n >\n </th>\n \n </tr>\n </ng-template>\n \n <!-- Body -->\n<ng-template pTemplate=\"body\" let-rowData>\n <tr *ngIf=\"table.headers.length > 0\" class=\"table-row-wrapper relative table-group-wrapper\">\n <!-- one TD per column -->\n <td *ngFor=\"let col of table.headers; let j = index\" class=\"p-0 border-none bg-none table-body-row-wrapper\"\n (click)=\"handleRowClick(rowData)\"\n [ngClass]=\"[rowData._columnWidths ? rowData._columnWidths?.[col.name] : col.width]\">\n <div class=\"table-body-wrapper table-row-card-wrapper\"\n [ngClass]=\"[\n rowData.rowNgClassExpression ? evaluateNgClass(rowData.rowNgClassExpression, rowData) : '',\n isRowSelected(rowData) ? 'row-selected' : '',\n selection?.includes(rowData) ? 'green-highlight' : ''\n ]\">\n \n <div class=\"flex align-items-center h-full\" [ngClass]=\"getColumnAlignment(col.name)\">\n <!-- your existing inner column wrapper -->\n <div class=\"row-wrapprt flex align-items-center\" [ngClass]=\"getColumnAlignment(col.name)\">\n <ng-container [ngSwitch]=\"getSwitchCase(rowData, col)\">\n <!-- task items - check this first -->\n <ng-container *ngSwitchCase=\"'taskItems'\">\n <div class=\"col-tasks\">\n <ng-container *ngFor=\"let taskItem of rowData[col.name]\">\n <div class=\"task-item\" [ngClass]=\"taskItem.status === 'warning' ? 'task-warning' : (taskItem.status === 'default' ? 'task-default' : 'task-success')\">\n <span class=\"font-semibold\">{{ taskItem.type }}</span>\n <span *ngIf=\"taskItem.count !== null && taskItem.count !== undefined\" class=\"task-badge\">{{ taskItem.count }}</span>\n </div>\n </ng-container>\n </div>\n </ng-container>\n \n <!-- Finance amount with special styling -->\n <ng-container *ngSwitchCase=\"'finance'\">\n <p class=\"text-black font-semibold mb-0\">\n {{ rowData[col.name].amount }}\n </p>\n </ng-container>\n \n <!-- App ID with type and risk tags -->\n <ng-container *ngSwitchCase=\"'appId'\">\n <div class=\"w-full text-left\">\n <p class=\"font-semibold mb-0 text-black\">{{ rowData[col.name].appId }}</p>\n <div class=\"flex gap-2 justify-content-start app-id-tags\">\n <!-- Type chip using style config (lending) -->\n <div *ngIf=\"rowData[col.name].type\" [ngClass]=\"getTypeContainerClass(rowData[col.name].type)\">\n <small class=\"mb-0\" [ngClass]=\"getTypeTextClass(rowData[col.name].type)\">\n {{ rowData[col.name].type }}\n </small>\n </div>\n <!-- Risk chip using style config (riskRating) -->\n <div *ngIf=\"rowData[col.name].risk && rowData[col.name].risk.toLowerCase() !== 'unknown'\"\n [ngClass]=\"getRiskContainerClass(rowData[col.name].risk)\">\n <small class=\"mb-0\" [ngClass]=\"getRiskTextClass(rowData[col.name].risk)\">\n {{ rowData[col.name].risk }}\n </small>\n </div>\n </div>\n </div>\n </ng-container>\n \n <!-- Broker with name and company name -->\n <ng-container *ngSwitchCase=\"'broker'\">\n <div class=\"w-full text-left\">\n <div class=\"font-medium\">{{ rowData[col.name].brokerName }}</div>\n <div *ngIf=\"rowData[col.name].brokerCompanyName\" class=\"text-gray-700\">\n {{ rowData[col.name].brokerCompanyName }}\n </div>\n </div>\n </ng-container>\n <!--Render two lines with dynamic classes for any two-line column -->\n <ng-container *ngSwitchCase=\"'twoLine'\">\n <div class=\"w-full\" [ngClass]=\"[\n getColumnAlignment(col.name) === 'justify-content-start' ? 'text-left' : 'text-center',\n rowData[col.name]?.containerClass || (col.containerNgClassExpression ? evaluateNgClass(col.containerNgClassExpression, rowData) : '')\n ]\">\n <div class=\"row-multi-line-wrapper flex align-items-center justify-content-center\">\n <i\n *ngIf=\"rowData[col.name]?.iconClass && rowData[col.name]?.addressLine1\"\n class=\"pi\"\n [ngClass]=\"[rowData[col.name].addressLine1, rowData[col.name].iconClass]\"\n ></i>\n <span\n *ngIf=\"!rowData[col.name]?.iconClass\"\n [ngClass]=\"getLine1DisplayClasses(col, rowData)\"\n >\n {{ rowData[col.name]?.addressLine1 }}\n </span>\n </div>\n <p class=\"row-multi-line-wrapper\"\n [ngClass]=\"rowData[col.name]?.textClass || (col.line2NgClassExpression ? evaluateNgClass(col.line2NgClassExpression, rowData) : '')\">\n {{ rowData[col.name]?.postCode }}\n </p>\n </div>\n </ng-container>\n <!-- progress bar -->\n <ng-container *ngSwitchCase=\"'progress'\">\n <div class=\"progress-wrapper\">\n <round-progress [current]=\"rowData['taskCompletionPercent']\" [max]=\"100\"\n [color]=\"getProgressColor(rowData['taskCompletionPercent'])\"\n [background]=\"getProgressBackground(rowData['taskCompletionPercent'])\" [radius]=\"125\" [stroke]=\"20\"\n [semicircle]=\"false\" [rounded]=\"true\" [clockwise]=\"true\" [responsive]=\"false\" [duration]=\"800\"\n [animation]=\"'easeInOutQuart'\" [animationDelay]=\"0\">\n </round-progress>\n <div class=\"progress-title\" [ngStyle]=\"{color: getProgressColor(rowData['taskCompletionPercent'])}\">\n {{ rowData[col.name] }}\n </div>\n </div>\n \n </ng-container>\n <!-- Default cell rendering for other columns -->\n <ng-container *ngSwitchDefault>\n <!-- Don't render default content if we have task items -->\n <ng-container *ngIf=\"!isTaskItemsArray(rowData[col.name])\">\n <div\n class=\"table-text-wrapper text-center p-0 flex align-items-center\"\n [ngClass]=\"[\n getRowClass(col, rowData),\n j === 0 ? 'justify-content-start' : 'justify-content-center'\n ]\"\n [ngStyle]=\"{ 'font-weight': col.name === table.showDecriptionFor ? 'bold' : 'normal' }\"\n >\n <div *ngIf=\"!col.skipParentNgClass\" [ngClass]=\"rowData[col.name]?.containerClass || (col.containerNgClassExpression ? evaluateNgClass(col.containerNgClassExpression, rowData) : '')\">\n <ng-container *ngTemplateOutlet=\"bubbleOrFallback\"></ng-container>\n </div>\n <ng-container *ngIf=\"col.skipParentNgClass\">\n <div class=\"w-full text-left\">\n <ng-container *ngTemplateOutlet=\"bubbleOrFallback\"></ng-container>\n </div>\n </ng-container>\n <ng-template #bubbleOrFallback>\n <ng-container *ngIf=\"isArray(rowData[col.name]) && rowData[col.name].length && rowData[col.name][0]?.fullName\">\n <div class=\"flex flex-column gap-1\">\n <ng-container *ngFor=\"let bubble of rowData[col.name]; let i = index\">\n <div\n *ngIf=\"bubble.isCustomerVulnerable\"\n class=\"px-2 py-1 border-round-2xl inline-block bg-red-600 text-white\"\n >\n {{ bubble.fullName }}\n </div>\n <p\n *ngIf=\"!bubble.isCustomerVulnerable\"\n class=\"mb-0\"\n [ngClass]=\"col.textNgClassExpression ? evaluateNgClass(col.textNgClassExpression, rowData) : 'text-gray-700'\"\n >\n {{ bubble.fullName }}\n </p>\n </ng-container>\n </div>\n </ng-container>\n <ng-container *ngIf=\"shouldShowValue(col, rowData)\">\n <div class=\"flex align-items-center gap-2\">\n <i\n *ngIf=\"rowData[col.name]?.icon\"\n class=\"pi\"\n [ngClass]=\"[rowData[col.name].icon, rowData[col.name].iconClass]\"\n ></i>\n <p class=\"mb-0\" [ngClass]=\"rowData[col.name]?.textClass || (col.textNgClassExpression ? evaluateNgClass(col.textNgClassExpression, rowData) : '')\">\n {{ rowData[col.name]?.text || rowData[col.name] }}\n </p>\n </div>\n </ng-container>\n </ng-template>\n <div\n *ngIf=\"col.name === table.showDecriptionFor && rowData[table.descriptionColumnName]\"\n class=\"text-black-500 text-sm mt-1\"\n style=\"font-weight: 600;\"\n >\n {{ rowData[table.descriptionColumnName] }}\n </div>\n </div>\n </ng-container>\n </ng-container>\n </ng-container>\n </div>\n </div>\n </div>\n </td>\n <!-- Checkbox column -->\n <td *ngIf=\"selectionMode === 'multiple' && (!isUwLogin || (isUwLogin && (selectedQueueName === 'Unassigned')))\" class=\"text-right p-0 border-none bg-none table-body-row-wrapper\"\n style=\"width: 4rem\" (click)=\"$event.stopPropagation()\">\n <div class=\"table-body-wrapper table-select-row-wrapper flex align-items-center justify-content-end\"\n [ngClass]=\"[\n rowData.rowNgClassExpression ? evaluateNgClass(rowData.rowNgClassExpression, rowData) : '',\n isRowSelected(rowData) ? 'row-selected' : '',\n selection?.includes(rowData) ? 'green-highlight' : ''\n ]\">\n <p-tableCheckbox [value]=\"rowData\" [disabled]=\"!enableSelection\"></p-tableCheckbox>\n </div>\n </td>\n\n <!-- Actions column -->\n <td *ngIf=\"showActions\" class=\"action-data-wrapper text-left table-body-wrapper\">\n <div *ngIf=\"(rowData.isRowDelete !== null || rowData.canDelete !== undefined) ? (showActions && rowData.isRowDelete) : showActions\" class=\"flex align-items-center justify-content-center\">\n <p-button\n icon=\"pi pi-trash\"\n (click)=\"deleteRow($event, rowData)\"\n class=\"delete-icon-wrapper mr-3\"\n [disabled]=\"!enableSelection\"\n ></p-button>\n </div>\n </td>\n </tr>\n</ng-template>\n \n <!-- Empty Message -->\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td\n [attr.colspan]=\"table.headers.length + (showActions ? 1 : 0) + (selectionMode === 'multiple' ? 1 : 0)\"\n class=\"text-center text-color font-semibold p-4\"\n >\n {{ noRecordsMessage }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n\n<!-- Paginator -->\n <div class=\"paginator-container flex align-items-center justify-content-center table-pagination-wrapper\" *ngIf=\"usePagination\">\n <div class=\"pagination-text text-color\">\n Showing {{ (metaData?.totalItems ?? 0) > 0 ? (((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10) + 1) : 0 }} to {{ recordNumber }} of {{ metaData?.totalItems ?? 0 }} entries\n </div>\n\n <p-paginator\n #paginator\n [first]=\"((metaData?.currentPage ?? 1) - 1) * (metaData?.itemsPerPage ?? 10)\"\n [rows]=\"metaData?.itemsPerPage ?? 10\"\n [totalRecords]=\"metaData?.totalItems ?? 0\"\n [rowsPerPageOptions]=\"[10, 20, 30, 40, 50]\"\n (onPageChange)=\"handleLoadRecords($event)\"\n ></p-paginator>\n</div> ", styles: [".table-header-container{padding:20px 20px 20px 8px}.table-header-title{font-size:12px;font-weight:600;color:var(--text-color-tertiary)!important}.table-header-wrapper{padding:12px 14px}.queue-chip{display:inline-flex;align-items:center;justify-content:center;padding:0 .75rem;min-height:1.5rem;border-radius:9999px;font-size:12px;font-weight:600;line-height:1.2;white-space:nowrap;gap:.25rem;background-color:#e5e7eb;color:#111827;border:1px solid transparent;width:fit-content;max-width:100%}.queue-chip--danger{background-color:var(--color-red-600, #dc2626);color:#fff}.queue-chip--warning{background-color:var(--color-amber-500, #f59e0b);color:#fff}.queue-chip--neutral{background-color:var(--color-gray-300, #d1d5db);color:#111827}.queue-chip--success{background-color:var(--color-green-500, #22c55e);color:#fff}.queue-chip--info{background-color:var(--color-blue-500, #3b82f6);color:#fff}.queue-chip--light-green-success{background-color:var(--color-green-50, #f0fdf4);color:var(--color-green-700, #15803d);border:1px solid var(--color-green-200, #bbf7d0)}.queue-chip--light-amber-warning{background-color:var(--color-amber-50, #fffbeb);color:var(--color-amber-700, #b45309);border:1px solid var(--color-amber-200, #fde68a)}.queue-chip--light-red-danger{background-color:var(--color-red-50, #fef2f2);color:var(--color-red-700, #b91c1c);border:1px solid var(--color-red-200, #fecaca)}.queue-chip--light-neutral{background-color:var(--color-blue-50, #eff6ff);color:var(--color-blue-700, #1e40af);border:1px solid var(--color-blue-200, #bfdbfe)}.table-body-wrapper{padding:12px 14px}.column-style-wrapper{height:80px;margin-bottom:16px}.column-style-wrapper-tall{height:110px}.bubble-seperator-wrapper{margin-left:-12px}.applicant-vulnerable-customer-wrapper{background-color:var(--color-red-600)}.applicant-red-badge-wrapper{background-color:var(--color-red-400)}.applicant-amber-badge-wrapper{background-color:var(--color-amber-500)}.applicant-success-badge-wrapper{background-color:var(--color-green-500)}.red-text-wrapper{color:var(--color-red-500)}.amber-text-wrapper{color:var(--color-amber-500)}.success-text-wrapper{color:var(--color-green-500)}.record_username{color:#0f8bfd}.table-title-wrapper{font-size:20px;font-weight:700}.table-action-title,.header-text-wrapper,.action-data-wrapper{border-right:1px solid rgba(68,72,109,.1)!important}.enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}.verified-status{background-color:var(--green-500)}.disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}.search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.Verified{background-color:var(--green-400);padding:.3rem!important;border-radius:5px;color:#fff}.DirectDebitDetails{background-color:#b2eaf2;padding:.3rem!important;border-radius:5px;color:#00bcd4}.Application{background-color:#4caf501a;padding:.3rem!important;border-radius:5px;color:#4caf50}.Property{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}.Applicant,.ApplicationNote{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}.OnBoarding,.PropertyDetails{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}.Alert{background-color:var(--red-500);padding:.3rem!important;border-radius:5px;color:#fff}.Pending{background-color:var(--orange-300);padding:.3rem!important;border-radius:5px;color:#fff}.table-row-wrapper{position:relative;transition:all .3s ease-in-out}.icon-position-wrapper{position:absolute;top:50%;left:16%;transform:translate(-50%,-50%);opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s ease-in-out}.table-row-wrapper:hover .icon-position-wrapper{opacity:1;visibility:visible}.table-group-wrapper:hover .icon-position-wrapper{visibility:visible;opacity:1}.table-pagination-wrapper{border-radius:0 0 10px 10px}::ng-deep .edit-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .edit-icon-wrapper .p-button .pi-pencil{color:var(--primary-color)}::ng-deep .delete-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:12px 20px}::ng-deep .delete-icon-wrapper .p-button .pi-trash{color:var(--red-500)}::ng-deep .record_username{color:var(--primary-color)}::ng-deep .table-title-wrapper{font-size:20px;font-weight:700}::ng-deep .table-action-title,::ng-deep .header-text-wrapper{border-right:1px solid var(--primary-border-color)!important}::ng-deep .table-action-title{border-radius:0 10px 0 0}::ng-deep .action-data-wrapper{border-right:1px solid var(--primary-border-color)!important}::ng-deep .enable-badge-wrapper{border-radius:4px;background:var(--green-500);color:var(--surface-0);text-align:center;padding:5px!important}::ng-deep .verified-status{background-color:var(--green-500)}::ng-deep .disable-badge-wrapper{border-radius:4px;background:#44486d;color:var(--surface-0);text-align:center;padding:5px!important}::ng-deep .search-input-wrapper{height:50px;border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}::ng-deep .Verified{background-color:var(--green-400);padding:.3rem!important;border-radius:5px;color:#fff}::ng-deep .DirectDebitDetails{background-color:#b2eaf2;padding:.3rem!important;border-radius:5px;color:#00bcd4}::ng-deep .Application{background-color:#4caf501a;padding:.3rem!important;border-radius:5px;color:#4caf50}::ng-deep .Property{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .Applicant{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}::ng-deep .ApplicationNote{background-color:#f6a5c0;padding:.3rem!important;border-radius:5px;color:#e91e63}::ng-deep .OnBoarding{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .PropertyDetails{background-color:#d8dcf0;padding:.3rem!important;border-radius:5px;color:#3f51b5}::ng-deep .Alert{background-color:var(--red-500);padding:.3rem!important;border-radius:5px;color:#fff}::ng-deep .setting-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#eef0f5;padding:24px;height:50px}::ng-deep .setting-icon-wrapper .p-button .pi-cog{color:var(--primary-color)}::ng-deep .view-icon-wrapper .p-button{border-radius:10px;border:1px solid rgba(76,98,146,.3);background:var(--surface-0);padding:20px;height:40px;box-shadow:none}::ng-deep .view-icon-wrapper .p-button .pi-eye{color:#44486d}::ng-deep .table-secondary-container .p-datatable-table{background-color:#fff;table-layout:fixed}::ng-deep .table-secondary-container .p-datatable-table .p-datatable-thead{background-color:var(--color-surface)}::ng-deep .table-secondary-container .p-datatable-header{padding:20px 20px 0;border-radius:10px 10px 0 0!important;border:none!important}::ng-deep .table-secondary-container .p-datatable-thead th{border:1px solid rgba(68,72,109,.1);border-left:none;border-right:none}::ng-deep .table-secondary-container .p-datatable-thead th:first-child{border-radius:10px 0 0;border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr td{border-bottom:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr td:first-child{border-left:1px solid rgba(68,72,109,.1)}::ng-deep .table-secondary-container tr:last-child td:first-child{border-radius:0 0 0 10px}::ng-deep .table-secondary-container tr:last-child td:last-child{border-radius:0 0 10px}::ng-deep .table-body-row-wrapper:first-child .border-row-wrapper{border-style:solid;border-width:1px 0 1px 1px;border-radius:.75rem 0 0 .75rem!important}::ng-deep .table-body-row-wrapper:not(:first-child):not(:last-child) .border-row-wrapper{border-style:solid;border-width:1px 0;border-radius:0!important}::ng-deep .table-body-row-wrapper:last-child .border-row-wrapper{border-style:solid;border-width:1px 1px 1px 0;border-radius:0 .75rem .75rem 0!important}::ng-deep .table-select-row-wrapper .border-row-wrapper{border-style:solid;border-width:1px 1px 1px 0;border-radius:0 .75rem .75rem 0!important}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:first-child .border-row-wrapper{border-width:3px 0 3px 3px}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:not(:first-child):not(:last-child) .border-row-wrapper{border-width:3px 0}::ng-deep .table-row-wrapper:hover .table-body-row-wrapper:last-child .border-row-wrapper{border-width:3px 3px 3px 0}::ng-deep .table-row-wrapper:hover .table-select-row-wrapper .border-row-wrapper{border-width:3px 3px 3px 0}.pending-badge-wrapper{background-color:#e5e7eb}:host ::ng-deep .p-checkbox-box.p-highlight{background-color:var(--color-green-500)!important;border-color:var(--color-green-500)!important}.green-highlight{background-color:var(--color-green-10)!important}:host ::ng-deep .p-checkbox-box.p-highlight .p-checkbox-icon{color:var(--color-surface-light)}:host ::ng-deep .p-checkbox-box:hover{border:1px solid #8a8ea6}:host ::ng-deep .p-checkbox-box.p-highlight:hover{background-color:var(--color-green-500)!important;border-color:var(--color-green-500)!important}@media screen and (min-width: 1200px) and (max-width: 1500px){.table-header-wrapper{padding:12px 8px;background-color:#fff}.table-body-wrapper{padding:8px}}.table-secondary-container .p-datatable-table{border-collapse:separate!important;border-spacing:50px!important;border-radius:10px}.table-secondary-container tr th{border:none!important}.border-round-full{border-radius:50%!important}.col-tasks{display:flex;width:75px;padding-left:10px;flex-direction:column;justify-content:center;align-items:flex-start;gap:7px}.task-item{display:flex;align-items:center;justify-content:space-between;border-radius:9999px;padding:0 3px 0 12px;font-size:12px;font-weight:600;width:100%;max-width:60px}.task-warning{background-color:#fdecce;color:#f59e0b}.task-success{background-color:#c5f7d7;color:#16a34a}.task-default{background-color:transparent;color:#1f2937;border:1px solid #d1d5db}.task-badge{background-color:#fff;border-radius:9999px;padding:3px 8px;color:#1f2937}.task-warning .task-badge{border:1px solid #f59e0b}.task-success .task-badge{border:1px solid #16a34a}.app-id-tags{margin-top:7px}\n"] }]
|
|
3323
3323
|
}], ctorParameters: () => [{ type: i3$4.Router }, { type: BaseService }, { type: SessionService }, { type: BaseQuery }, { type: BaseStore }, { type: QueueBusinessService }, { type: QueueQuery$1 }], propDecorators: { table: [{
|
|
3324
3324
|
type: Input
|
|
3325
3325
|
}], metaData: [{
|
|
@@ -3586,11 +3586,11 @@ class ApiAdminFormComponent extends BaseFormComponent {
|
|
|
3586
3586
|
super.ngOnDestroy();
|
|
3587
3587
|
}
|
|
3588
3588
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ApiAdminFormComponent, deps: [{ token: ApiAdminService }, { token: ValidatorService }, { token: i3$4.Router }, { token: i3$4.ActivatedRoute }, { token: ApiAdminStore }, { token: BaseStore }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
3589
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: ApiAdminFormComponent, isStandalone: false, selector: "lib-api-admin-form", usesInheritance: true, ngImport: i0, template: "<form-container\
|
|
3589
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: ApiAdminFormComponent, isStandalone: false, selector: "lib-api-admin-form", usesInheritance: true, ngImport: i0, template: "<form-container\n [record]=\"record\"\n [headerText]=\"'Api Management Form'\"\n [messages]=\"messages\"\n (onSave)=\"handleSubmit()\"\n [showSave]=\"true\" \n (onCancel)=\"handleCancel()\"\n>\n <div class=\"card p-fluid p-formgrid grid m-0 mb-6\">\n <h4 class=\"font-bold col-12 md:col-12\">Api Management Form</h4>\n <div class=\"col-12 md:col-5\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'name',\n isRequired: true,\n displayText: 'Name',\n placeholder: 'Enter Name'\n }\"\n ></text-box>\n </div>\n <div class=\"col-12 md:col-5\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'path',\n isRequired: true,\n displayText: 'Path',\n placeholder: 'Enter Path'\n }\"\n ></text-box>\n </div>\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"apiAdminStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n <div class=\"col-12 md:col-6\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'getByIDPath',\n isRequired: false,\n displayText: 'Get By ID Path',\n placeholder: 'Enter getByID Path'\n }\"\n ></text-box>\n </div>\n <div class=\"col-12 md:col-6\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'idProperty',\n isRequired: true,\n displayText: 'Id Property',\n placeholder: 'Enter Id Property'\n }\"\n ></text-box>\n </div>\n\n <div class=\"w-full px-2 mt-2 flex justify-content-end\">\n <button\n pButton\n pRipple\n type=\"button\"\n label=\"Validate\"\n (click)=\"hanldeValidateApi()\"\n class=\"p-button-raised validate-btn-wrapper\"\n ></button>\n </div>\n </div>\n <div class=\"card p-fluid p-formgrid grid \">\n <h4 class=\"font-bold col-12 md:col-12\">Other Details</h4>\n <div class=\"col-12 md:col-12 p-0 m-0 flex align-items-center\">\n <div class=\"col-12 md:col-6\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'authHeaderName',\n isRequired: false,\n displayText: 'Auth Header',\n placeholder: 'Enter Auth Header'\n }\"\n ></text-box>\n </div>\n\n <div class=\"col-12 md:col-6\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'authToken',\n isRequired: false,\n displayText: 'Token',\n placeholder: 'Enter token'\n }\"\n ></text-box>\n </div>\n </div>\n <div class=\"col-12 md:col-6\">\n <dropdown\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n name: 'parentapiConfigId',\n dataSource: 'api-configurations',\n listLabelProperty: 'name',\n listValueProperty: '_id', \n displayText: 'Select Parent',\n placeholder: 'Select Parent API',\n childListName: 'parentKey',\n childListKey: 'name'\n }\"\n (onInput)=\"handleModelChange($event)\"\n ></dropdown>\n\n </div>\n <div class=\"col-12 md:col-6\">\n <dropdown\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n name:'parentKey',\n displayText : 'Property',\n placeholder: 'Select Property',\n options: apiPropertyList\n }\"></dropdown>\n </div>\n\n <div class=\"col-12 md:col-12\">\n <text-area\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'description',\n isRequired: false,\n displayText: 'Description',\n placeholder: 'Enter Description'\n }\"\n ></text-area>\n </div>\n </div>\n</form-container>", styles: [".p-message{margin-left:1rem;margin-right:1rem}.p-message .p-message-wrapper{padding:.143rem 1.357rem}.validate-btn-wrapper{width:15%;padding:.8rem 1rem!important}\n"], dependencies: [{ kind: "component", type: TextBoxComponent, selector: "text-box" }, { kind: "component", type: DropdownComponent, selector: "dropdown", inputs: ["isStaticDropdown"] }, { kind: "component", type: FormContainerComponent, selector: "form-container", inputs: ["messages", "record", "headerText", "showSave", "disableSaveButton"], outputs: ["onSave", "onCancel"] }, { kind: "directive", type: i3$3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: TextAreaComponent, selector: "text-area", inputs: ["rowspan"] }, { kind: "component", type: CheckBoxComponent, selector: "check-box" }], encapsulation: i0.ViewEncapsulation.None });
|
|
3590
3590
|
}
|
|
3591
3591
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ApiAdminFormComponent, decorators: [{
|
|
3592
3592
|
type: Component,
|
|
3593
|
-
args: [{ selector: 'lib-api-admin-form', standalone: false, encapsulation: ViewEncapsulation.None, template: "<form-container\
|
|
3593
|
+
args: [{ selector: 'lib-api-admin-form', standalone: false, encapsulation: ViewEncapsulation.None, template: "<form-container\n [record]=\"record\"\n [headerText]=\"'Api Management Form'\"\n [messages]=\"messages\"\n (onSave)=\"handleSubmit()\"\n [showSave]=\"true\" \n (onCancel)=\"handleCancel()\"\n>\n <div class=\"card p-fluid p-formgrid grid m-0 mb-6\">\n <h4 class=\"font-bold col-12 md:col-12\">Api Management Form</h4>\n <div class=\"col-12 md:col-5\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'name',\n isRequired: true,\n displayText: 'Name',\n placeholder: 'Enter Name'\n }\"\n ></text-box>\n </div>\n <div class=\"col-12 md:col-5\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'path',\n isRequired: true,\n displayText: 'Path',\n placeholder: 'Enter Path'\n }\"\n ></text-box>\n </div>\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"apiAdminStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n <div class=\"col-12 md:col-6\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'getByIDPath',\n isRequired: false,\n displayText: 'Get By ID Path',\n placeholder: 'Enter getByID Path'\n }\"\n ></text-box>\n </div>\n <div class=\"col-12 md:col-6\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'idProperty',\n isRequired: true,\n displayText: 'Id Property',\n placeholder: 'Enter Id Property'\n }\"\n ></text-box>\n </div>\n\n <div class=\"w-full px-2 mt-2 flex justify-content-end\">\n <button\n pButton\n pRipple\n type=\"button\"\n label=\"Validate\"\n (click)=\"hanldeValidateApi()\"\n class=\"p-button-raised validate-btn-wrapper\"\n ></button>\n </div>\n </div>\n <div class=\"card p-fluid p-formgrid grid \">\n <h4 class=\"font-bold col-12 md:col-12\">Other Details</h4>\n <div class=\"col-12 md:col-12 p-0 m-0 flex align-items-center\">\n <div class=\"col-12 md:col-6\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'authHeaderName',\n isRequired: false,\n displayText: 'Auth Header',\n placeholder: 'Enter Auth Header'\n }\"\n ></text-box>\n </div>\n\n <div class=\"col-12 md:col-6\">\n <text-box\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'authToken',\n isRequired: false,\n displayText: 'Token',\n placeholder: 'Enter token'\n }\"\n ></text-box>\n </div>\n </div>\n <div class=\"col-12 md:col-6\">\n <dropdown\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n name: 'parentapiConfigId',\n dataSource: 'api-configurations',\n listLabelProperty: 'name',\n listValueProperty: '_id', \n displayText: 'Select Parent',\n placeholder: 'Select Parent API',\n childListName: 'parentKey',\n childListKey: 'name'\n }\"\n (onInput)=\"handleModelChange($event)\"\n ></dropdown>\n\n </div>\n <div class=\"col-12 md:col-6\">\n <dropdown\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n name:'parentKey',\n displayText : 'Property',\n placeholder: 'Select Property',\n options: apiPropertyList\n }\"></dropdown>\n </div>\n\n <div class=\"col-12 md:col-12\">\n <text-area\n [store]=\"apiAdminStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'description',\n isRequired: false,\n displayText: 'Description',\n placeholder: 'Enter Description'\n }\"\n ></text-area>\n </div>\n </div>\n</form-container>", styles: [".p-message{margin-left:1rem;margin-right:1rem}.p-message .p-message-wrapper{padding:.143rem 1.357rem}.validate-btn-wrapper{width:15%;padding:.8rem 1rem!important}\n"] }]
|
|
3594
3594
|
}], ctorParameters: () => [{ type: ApiAdminService }, { type: ValidatorService }, { type: i3$4.Router }, { type: i3$4.ActivatedRoute }, { type: ApiAdminStore }, { type: BaseStore }, { type: BaseQuery }] });
|
|
3595
3595
|
|
|
3596
3596
|
class PERMISSION {
|
|
@@ -3627,11 +3627,11 @@ class ApiAdminListComponent extends BaseListComponent {
|
|
|
3627
3627
|
this.init();
|
|
3628
3628
|
}
|
|
3629
3629
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ApiAdminListComponent, deps: [{ token: ApiAdminService }, { token: TableBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
3630
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: ApiAdminListComponent, isStandalone: false, selector: "lib-api-admin-list", usesInheritance: true, ngImport: i0, template: "\
|
|
3630
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: ApiAdminListComponent, isStandalone: false, selector: "lib-api-admin-list", usesInheritance: true, ngImport: i0, template: "\n@if(table){\n <lib-table-primary [table]=\"table\" [pathName]=\"pathName\" [metaData]=\"metaData\">\n </lib-table-primary>\n}", styles: [""], dependencies: [{ kind: "component", type: TablePrimaryComponent, selector: "lib-table-primary", inputs: ["table", "metaData", "title", "showStatus", "showActions", "showSearchBar", "showNewRecordButton", "showRefreshButton", "pathName"] }] });
|
|
3631
3631
|
}
|
|
3632
3632
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ApiAdminListComponent, decorators: [{
|
|
3633
3633
|
type: Component,
|
|
3634
|
-
args: [{ selector: 'lib-api-admin-list', standalone: false, template: "\
|
|
3634
|
+
args: [{ selector: 'lib-api-admin-list', standalone: false, template: "\n@if(table){\n <lib-table-primary [table]=\"table\" [pathName]=\"pathName\" [metaData]=\"metaData\">\n </lib-table-primary>\n}" }]
|
|
3635
3635
|
}], ctorParameters: () => [{ type: ApiAdminService }, { type: TableBuilder }] });
|
|
3636
3636
|
|
|
3637
3637
|
class ApiAdminModule {
|
|
@@ -3792,11 +3792,11 @@ class WidgetAdminListComponent extends BaseListComponent {
|
|
|
3792
3792
|
this.init();
|
|
3793
3793
|
}
|
|
3794
3794
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetAdminListComponent, deps: [{ token: WidgetAdminService }, { token: TableBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
3795
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetAdminListComponent, isStandalone: false, selector: "lib-widget-admin-list", usesInheritance: true, ngImport: i0, template: "@if(table){\
|
|
3795
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetAdminListComponent, isStandalone: false, selector: "lib-widget-admin-list", usesInheritance: true, ngImport: i0, template: "@if(table){\n<lib-table-primary [table]=\"table\" [pathName]=\"pathName\" [metaData]=\"metaData\">\n\n</lib-table-primary>\n}", styles: [""], dependencies: [{ kind: "component", type: TablePrimaryComponent, selector: "lib-table-primary", inputs: ["table", "metaData", "title", "showStatus", "showActions", "showSearchBar", "showNewRecordButton", "showRefreshButton", "pathName"] }] });
|
|
3796
3796
|
}
|
|
3797
3797
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetAdminListComponent, decorators: [{
|
|
3798
3798
|
type: Component,
|
|
3799
|
-
args: [{ selector: 'lib-widget-admin-list', standalone: false, template: "@if(table){\
|
|
3799
|
+
args: [{ selector: 'lib-widget-admin-list', standalone: false, template: "@if(table){\n<lib-table-primary [table]=\"table\" [pathName]=\"pathName\" [metaData]=\"metaData\">\n\n</lib-table-primary>\n}" }]
|
|
3800
3800
|
}], ctorParameters: () => [{ type: WidgetAdminService }, { type: TableBuilder }] });
|
|
3801
3801
|
|
|
3802
3802
|
/**
|
|
@@ -4027,11 +4027,11 @@ class WidgetAdminFormComponent extends BaseFormComponent {
|
|
|
4027
4027
|
super.ngOnDestroy();
|
|
4028
4028
|
}
|
|
4029
4029
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetAdminFormComponent, deps: [{ token: WidgetAdminService }, { token: ValidatorService }, { token: WidgetAdminStore }, { token: WidgetAdminQuery }, { token: i3$4.Router }, { token: i3$4.ActivatedRoute }, { token: BaseStore }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
4030
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetAdminFormComponent, isStandalone: false, selector: "lib-widget-admin-form", usesInheritance: true, ngImport: i0, template: "<form-container [record]=\"record\" [showSave]=\"true\" [messages]=\"message\" (onSave)=\"handleSubmit()\"\r\n (onCancel)=\"handleCancel()\">\r\n <div class=\"card p-fluid p-formgrid\">\r\n <h4 class=\"font-bold col-12 md:col-12\">Widget Form</h4>\r\n <div class=\"col-12 md:col-12 mt-2 mb-2 flex\">\r\n <div class=\"col-3 md:col-3 mt-2 mb-2\">\r\n <text-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\r\n readonly: false,\r\n name: 'name',\r\n isRequired: true,\r\n displayText: 'Name',\r\n placeholder: 'Enter Widget Name'\r\n }\"></text-box>\r\n </div>\r\n\r\n <div class=\"col-3 md:col-3 mt-2 mb-2\">\r\n <dropdown [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\r\n name:'apiConfigId',\r\n displayText : 'Select API',\r\n isRequired:true,\r\n }\" (onInput)=\"handleAPIChange($event)\">\r\n </dropdown>\r\n </div>\r\n\r\n <div class=\"col-4 md:col-4 mt-2 mb-2\">\r\n <text-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\r\n readonly: false,\r\n name: 'style',\r\n isRequired: false,\r\n displayText: 'Style',\r\n placeholder: 'Enter Widget Style'\r\n }\"></text-box>\r\n </div>\r\n\r\n <div class=\"col-2 md:col-2 mt-5\">\r\n <check-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\r\n name:'isActive',\r\n displayText : 'Active',\r\n }\">\r\n </check-box>\r\n </div>\r\n </div>\r\n <div class=\"grid align-items-center m-0\">\r\n <div class=\"col-6 md:col-5 mt-2 mb-2 flex\">\r\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\r\n name:'headerDictionaryID',\r\n listLabelProperty:'name',\r\n listValueProperty:'_id',\r\n displayText : 'Select Dictionary',\r\n options: dictionaries\r\n }\" (onInput)=\"handleHeaderDictionarySelect($event)\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\r\n name:'headerDictionaryItemID',\r\n listLabelProperty:'itemName',\r\n listValueProperty:'_id',\r\n displayText : 'Select Header Item',\r\n options: headerDictionaryItems\r\n }\">\r\n </dropdown>\r\n </div>\r\n </div>\r\n <div class=\"col-6 md:col-5 mt-2 mb-2 flex\">\r\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\r\n name:'subHeaderDictionaryID',\r\n listLabelProperty:'name',\r\n listValueProperty:'_id',\r\n displayText : 'Select Dictionary',\r\n options: dictionaries\r\n }\" (onInput)=\"handleSubHeaderDictionarySelect($event)\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\r\n name:'subHeaderDictionaryItemID',\r\n listLabelProperty:'itemName',\r\n listValueProperty:'_id',\r\n displayText : 'Select SubHeader Item',\r\n options: subHeaderDictionaryItems\r\n }\">\r\n </dropdown>\r\n </div>\r\n </div>\r\n <div class=\"col-6 md:col-2 mt-2 mb-2 flex\">\r\n <div class=\"field col-12 pl-2 pb-0 mb-2 md:mr-2 md:col-12\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\r\n name:'layoutType',\r\n listLabelProperty:'name',\r\n listValueProperty:'value',\r\n displayText : 'Select Layout Type',\r\n options: widgetLayoutTypeList\r\n }\">\r\n </dropdown>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"field p-0 pr-2 col-12 md:col-12 flex gap-2\">\r\n <div class=\"col-6 md:col-2\">\r\n <div class=\"card m-0 p-0 mb-2\">\r\n <div class=\"mt-3 w-full flex\">\r\n <button pButton pRipple routerLinkActive=\"router-link-active\"\r\n icon=\"pi pi-plus font-semibold\"\r\n class=\"py-3 justify-content-center font-semibold w-full border-round\"\r\n (click)=\"handleBadgeAddBtnClick()\">\r\n <span class=\"ml-3\">Add Badge </span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-6 md:col-2\">\r\n <div class=\"card m-0 p-0 mb-2\">\r\n <div class=\"mt-3 w-full flex\">\r\n <button pButton pRipple routerLinkActive=\"router-link-active\"\r\n icon=\"pi pi-plus font-semibold\"\r\n class=\"py-3 justify-content-center font-semibold w-full border-round\"\r\n (click)=\"handleWidgetItemAddBtnClick()\">\r\n <span class=\"ml-3\">Add Widget Item </span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Badges Section -->\r\n <div class=\"field p-0 pr-2 col-12 md:col-12 mb-3\">\r\n <h5 *ngIf=\"(record?.badges?.length ?? 0) > 0\" class=\"font-bold col-12 md:col-12 mb-2\">Badges</h5>\r\n <div class=\"feild-card col-12 md:col-12 flex\" *ngFor=\"let badge of (record?.badges || []); let i = index;\">\r\n <div class=\"field col-3 col-sm-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"badge\" [attributeModel]=\"{\r\n name:'dictionaryID',\r\n listLabelProperty:'name',\r\n listValueProperty:'_id',\r\n displayText : 'Select Dictionary',\r\n isRequired:true,\r\n options: dictionaries\r\n }\" (onInput)=\"handleBadgeDictionarySelect($event, i)\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-3 col-sm-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"badge\" [attributeModel]=\"{\r\n name:'dictionaryItemID',\r\n listLabelProperty:'itemName',\r\n listValueProperty:'_id',\r\n displayText : 'Select Properties',\r\n isRequired:true,\r\n options: badgeDictionaryItemArray[i]\r\n }\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-4 col-sm-6\">\r\n <text-box [store]=\"widgetStore\" [record]=\"badge\" [attributeModel]=\"{\r\n name : 'style',\r\n readonly : false,\r\n displayText : 'Style',\r\n isRequired : false,\r\n }\"></text-box>\r\n </div>\r\n <div class=\"field col-2 m-0 flex justify-content-start md:col-2 mt-5\">\r\n <div class=\"ml-4 delete-icon-container\">\r\n <i class=\"pi pi-trash trash-icon-wrapper cursor-pointer\" (click)=\"handleDeleteBadge(i)\"></i>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Widget Items -->\r\n <h5 *ngIf=\"(record?.dataItems?.length ?? 0) > 0\" class=\"font-bold col-12 md:col-12 mb-2\">Widget Items</h5>\r\n <div class=\"feild-card col-12 md:col-12 flex\" *ngFor=\"let widgetItem of (record?.dataItems || []); let i = index;\">\r\n <div class=\"field col-2 col-sm-6\">\r\n <text-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\r\n name : 'name',\r\n readonly : false,\r\n displayText : 'Item Label',\r\n isRequired : true,\r\n }\"></text-box>\r\n </div>\r\n <div class=\"field col-2 col-sm-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"widgetItem\" [attributeModel]=\"{\r\n name:'dictionaryID',\r\n listLabelProperty:'name',\r\n listValueProperty:'_id',\r\n displayText : 'Select Dictionary',\r\n isRequired:true,\r\n options: dictionaries\r\n }\" (onInput)=\"handleWidgetItemDictionarySelect($event, i)\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-2 col-sm-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"widgetItem\" [attributeModel]=\"{\r\n name:'dictionaryItemID',\r\n listLabelProperty:'itemName',\r\n listValueProperty:'_id',\r\n displayText : 'Select Properties',\r\n isRequired:true,\r\n options: dictionaryItemArray[i]\r\n }\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-4 col-sm-6\">\r\n <text-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\r\n name : 'style',\r\n readonly : false,\r\n displayText : 'Item Style',\r\n isRequired : false,\r\n }\"></text-box>\r\n </div>\r\n <div class=\"field col-4 m-0 flex justify-content-center md:col-2 mt-5\">\r\n <div class=\"m-0\">\r\n <check-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\r\n name:'isActive',\r\n displayText : 'Is Active ?',\r\n }\">\r\n </check-box>\r\n </div>\r\n <div class=\"ml-4 delete-icon-container\">\r\n <i class=\"pi pi-trash trash-icon-wrapper cursor-pointer\" (click)=\"handleDeleteRecord(i)\"></i>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</form-container>", styles: [".trash-icon-wrapper{font-size:20px;color:var(--red-500)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TextBoxComponent, selector: "text-box" }, { kind: "component", type: DropdownComponent, selector: "dropdown", inputs: ["isStaticDropdown"] }, { kind: "component", type: FormContainerComponent, selector: "form-container", inputs: ["messages", "record", "headerText", "showSave", "disableSaveButton"], outputs: ["onSave", "onCancel"] }, { kind: "component", type: CheckBoxComponent, selector: "check-box" }, { kind: "directive", type: i3$3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }] });
|
|
4030
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetAdminFormComponent, isStandalone: false, selector: "lib-widget-admin-form", usesInheritance: true, ngImport: i0, template: "<form-container [record]=\"record\" [showSave]=\"true\" [messages]=\"message\" (onSave)=\"handleSubmit()\"\n (onCancel)=\"handleCancel()\">\n <div class=\"card p-fluid p-formgrid\">\n <h4 class=\"font-bold col-12 md:col-12\">Widget Form</h4>\n <div class=\"col-12 md:col-12 mt-2 mb-2 flex\">\n <div class=\"col-3 md:col-3 mt-2 mb-2\">\n <text-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\n readonly: false,\n name: 'name',\n isRequired: true,\n displayText: 'Name',\n placeholder: 'Enter Widget Name'\n }\"></text-box>\n </div>\n\n <div class=\"col-3 md:col-3 mt-2 mb-2\">\n <dropdown [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\n name:'apiConfigId',\n displayText : 'Select API',\n isRequired:true,\n }\" (onInput)=\"handleAPIChange($event)\">\n </dropdown>\n </div>\n\n <div class=\"col-4 md:col-4 mt-2 mb-2\">\n <text-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\n readonly: false,\n name: 'style',\n isRequired: false,\n displayText: 'Style',\n placeholder: 'Enter Widget Style'\n }\"></text-box>\n </div>\n\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n </div>\n <div class=\"grid align-items-center m-0\">\n <div class=\"col-6 md:col-5 mt-2 mb-2 flex\">\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name:'headerDictionaryID',\n listLabelProperty:'name',\n listValueProperty:'_id',\n displayText : 'Select Dictionary',\n options: dictionaries\n }\" (onInput)=\"handleHeaderDictionarySelect($event)\">\n </dropdown>\n </div>\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name:'headerDictionaryItemID',\n listLabelProperty:'itemName',\n listValueProperty:'_id',\n displayText : 'Select Header Item',\n options: headerDictionaryItems\n }\">\n </dropdown>\n </div>\n </div>\n <div class=\"col-6 md:col-5 mt-2 mb-2 flex\">\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name:'subHeaderDictionaryID',\n listLabelProperty:'name',\n listValueProperty:'_id',\n displayText : 'Select Dictionary',\n options: dictionaries\n }\" (onInput)=\"handleSubHeaderDictionarySelect($event)\">\n </dropdown>\n </div>\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name:'subHeaderDictionaryItemID',\n listLabelProperty:'itemName',\n listValueProperty:'_id',\n displayText : 'Select SubHeader Item',\n options: subHeaderDictionaryItems\n }\">\n </dropdown>\n </div>\n </div>\n <div class=\"col-6 md:col-2 mt-2 mb-2 flex\">\n <div class=\"field col-12 pl-2 pb-0 mb-2 md:mr-2 md:col-12\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name:'layoutType',\n listLabelProperty:'name',\n listValueProperty:'value',\n displayText : 'Select Layout Type',\n options: widgetLayoutTypeList\n }\">\n </dropdown>\n </div>\n </div>\n </div>\n\n <div class=\"field p-0 pr-2 col-12 md:col-12 flex gap-2\">\n <div class=\"col-6 md:col-2\">\n <div class=\"card m-0 p-0 mb-2\">\n <div class=\"mt-3 w-full flex\">\n <button pButton pRipple routerLinkActive=\"router-link-active\"\n icon=\"pi pi-plus font-semibold\"\n class=\"py-3 justify-content-center font-semibold w-full border-round\"\n (click)=\"handleBadgeAddBtnClick()\">\n <span class=\"ml-3\">Add Badge </span>\n </button>\n </div>\n </div>\n </div>\n <div class=\"col-6 md:col-2\">\n <div class=\"card m-0 p-0 mb-2\">\n <div class=\"mt-3 w-full flex\">\n <button pButton pRipple routerLinkActive=\"router-link-active\"\n icon=\"pi pi-plus font-semibold\"\n class=\"py-3 justify-content-center font-semibold w-full border-round\"\n (click)=\"handleWidgetItemAddBtnClick()\">\n <span class=\"ml-3\">Add Widget Item </span>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Badges Section -->\n <div class=\"field p-0 pr-2 col-12 md:col-12 mb-3\">\n <h5 *ngIf=\"(record?.badges?.length ?? 0) > 0\" class=\"font-bold col-12 md:col-12 mb-2\">Badges</h5>\n <div class=\"feild-card col-12 md:col-12 flex\" *ngFor=\"let badge of (record?.badges || []); let i = index;\">\n <div class=\"field col-3 col-sm-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"badge\" [attributeModel]=\"{\n name:'dictionaryID',\n listLabelProperty:'name',\n listValueProperty:'_id',\n displayText : 'Select Dictionary',\n isRequired:true,\n options: dictionaries\n }\" (onInput)=\"handleBadgeDictionarySelect($event, i)\">\n </dropdown>\n </div>\n <div class=\"field col-3 col-sm-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"badge\" [attributeModel]=\"{\n name:'dictionaryItemID',\n listLabelProperty:'itemName',\n listValueProperty:'_id',\n displayText : 'Select Properties',\n isRequired:true,\n options: badgeDictionaryItemArray[i]\n }\">\n </dropdown>\n </div>\n <div class=\"field col-4 col-sm-6\">\n <text-box [store]=\"widgetStore\" [record]=\"badge\" [attributeModel]=\"{\n name : 'style',\n readonly : false,\n displayText : 'Style',\n isRequired : false,\n }\"></text-box>\n </div>\n <div class=\"field col-2 m-0 flex justify-content-start md:col-2 mt-5\">\n <div class=\"ml-4 delete-icon-container\">\n <i class=\"pi pi-trash trash-icon-wrapper cursor-pointer\" (click)=\"handleDeleteBadge(i)\"></i>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Widget Items -->\n <h5 *ngIf=\"(record?.dataItems?.length ?? 0) > 0\" class=\"font-bold col-12 md:col-12 mb-2\">Widget Items</h5>\n <div class=\"feild-card col-12 md:col-12 flex\" *ngFor=\"let widgetItem of (record?.dataItems || []); let i = index;\">\n <div class=\"field col-2 col-sm-6\">\n <text-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\n name : 'name',\n readonly : false,\n displayText : 'Item Label',\n isRequired : true,\n }\"></text-box>\n </div>\n <div class=\"field col-2 col-sm-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"widgetItem\" [attributeModel]=\"{\n name:'dictionaryID',\n listLabelProperty:'name',\n listValueProperty:'_id',\n displayText : 'Select Dictionary',\n isRequired:true,\n options: dictionaries\n }\" (onInput)=\"handleWidgetItemDictionarySelect($event, i)\">\n </dropdown>\n </div>\n <div class=\"field col-2 col-sm-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"widgetItem\" [attributeModel]=\"{\n name:'dictionaryItemID',\n listLabelProperty:'itemName',\n listValueProperty:'_id',\n displayText : 'Select Properties',\n isRequired:true,\n options: dictionaryItemArray[i]\n }\">\n </dropdown>\n </div>\n <div class=\"field col-4 col-sm-6\">\n <text-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\n name : 'style',\n readonly : false,\n displayText : 'Item Style',\n isRequired : false,\n }\"></text-box>\n </div>\n <div class=\"field col-4 m-0 flex justify-content-center md:col-2 mt-5\">\n <div class=\"m-0\">\n <check-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Is Active ?',\n }\">\n </check-box>\n </div>\n <div class=\"ml-4 delete-icon-container\">\n <i class=\"pi pi-trash trash-icon-wrapper cursor-pointer\" (click)=\"handleDeleteRecord(i)\"></i>\n </div>\n </div>\n </div>\n </div>\n</form-container>", styles: [".trash-icon-wrapper{font-size:20px;color:var(--red-500)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TextBoxComponent, selector: "text-box" }, { kind: "component", type: DropdownComponent, selector: "dropdown", inputs: ["isStaticDropdown"] }, { kind: "component", type: FormContainerComponent, selector: "form-container", inputs: ["messages", "record", "headerText", "showSave", "disableSaveButton"], outputs: ["onSave", "onCancel"] }, { kind: "component", type: CheckBoxComponent, selector: "check-box" }, { kind: "directive", type: i3$3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }] });
|
|
4031
4031
|
}
|
|
4032
4032
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetAdminFormComponent, decorators: [{
|
|
4033
4033
|
type: Component,
|
|
4034
|
-
args: [{ selector: 'lib-widget-admin-form', standalone: false, template: "<form-container [record]=\"record\" [showSave]=\"true\" [messages]=\"message\" (onSave)=\"handleSubmit()\"\r\n (onCancel)=\"handleCancel()\">\r\n <div class=\"card p-fluid p-formgrid\">\r\n <h4 class=\"font-bold col-12 md:col-12\">Widget Form</h4>\r\n <div class=\"col-12 md:col-12 mt-2 mb-2 flex\">\r\n <div class=\"col-3 md:col-3 mt-2 mb-2\">\r\n <text-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\r\n readonly: false,\r\n name: 'name',\r\n isRequired: true,\r\n displayText: 'Name',\r\n placeholder: 'Enter Widget Name'\r\n }\"></text-box>\r\n </div>\r\n\r\n <div class=\"col-3 md:col-3 mt-2 mb-2\">\r\n <dropdown [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\r\n name:'apiConfigId',\r\n displayText : 'Select API',\r\n isRequired:true,\r\n }\" (onInput)=\"handleAPIChange($event)\">\r\n </dropdown>\r\n </div>\r\n\r\n <div class=\"col-4 md:col-4 mt-2 mb-2\">\r\n <text-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\r\n readonly: false,\r\n name: 'style',\r\n isRequired: false,\r\n displayText: 'Style',\r\n placeholder: 'Enter Widget Style'\r\n }\"></text-box>\r\n </div>\r\n\r\n <div class=\"col-2 md:col-2 mt-5\">\r\n <check-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\r\n name:'isActive',\r\n displayText : 'Active',\r\n }\">\r\n </check-box>\r\n </div>\r\n </div>\r\n <div class=\"grid align-items-center m-0\">\r\n <div class=\"col-6 md:col-5 mt-2 mb-2 flex\">\r\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\r\n name:'headerDictionaryID',\r\n listLabelProperty:'name',\r\n listValueProperty:'_id',\r\n displayText : 'Select Dictionary',\r\n options: dictionaries\r\n }\" (onInput)=\"handleHeaderDictionarySelect($event)\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\r\n name:'headerDictionaryItemID',\r\n listLabelProperty:'itemName',\r\n listValueProperty:'_id',\r\n displayText : 'Select Header Item',\r\n options: headerDictionaryItems\r\n }\">\r\n </dropdown>\r\n </div>\r\n </div>\r\n <div class=\"col-6 md:col-5 mt-2 mb-2 flex\">\r\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\r\n name:'subHeaderDictionaryID',\r\n listLabelProperty:'name',\r\n listValueProperty:'_id',\r\n displayText : 'Select Dictionary',\r\n options: dictionaries\r\n }\" (onInput)=\"handleSubHeaderDictionarySelect($event)\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\r\n name:'subHeaderDictionaryItemID',\r\n listLabelProperty:'itemName',\r\n listValueProperty:'_id',\r\n displayText : 'Select SubHeader Item',\r\n options: subHeaderDictionaryItems\r\n }\">\r\n </dropdown>\r\n </div>\r\n </div>\r\n <div class=\"col-6 md:col-2 mt-2 mb-2 flex\">\r\n <div class=\"field col-12 pl-2 pb-0 mb-2 md:mr-2 md:col-12\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\r\n name:'layoutType',\r\n listLabelProperty:'name',\r\n listValueProperty:'value',\r\n displayText : 'Select Layout Type',\r\n options: widgetLayoutTypeList\r\n }\">\r\n </dropdown>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"field p-0 pr-2 col-12 md:col-12 flex gap-2\">\r\n <div class=\"col-6 md:col-2\">\r\n <div class=\"card m-0 p-0 mb-2\">\r\n <div class=\"mt-3 w-full flex\">\r\n <button pButton pRipple routerLinkActive=\"router-link-active\"\r\n icon=\"pi pi-plus font-semibold\"\r\n class=\"py-3 justify-content-center font-semibold w-full border-round\"\r\n (click)=\"handleBadgeAddBtnClick()\">\r\n <span class=\"ml-3\">Add Badge </span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-6 md:col-2\">\r\n <div class=\"card m-0 p-0 mb-2\">\r\n <div class=\"mt-3 w-full flex\">\r\n <button pButton pRipple routerLinkActive=\"router-link-active\"\r\n icon=\"pi pi-plus font-semibold\"\r\n class=\"py-3 justify-content-center font-semibold w-full border-round\"\r\n (click)=\"handleWidgetItemAddBtnClick()\">\r\n <span class=\"ml-3\">Add Widget Item </span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Badges Section -->\r\n <div class=\"field p-0 pr-2 col-12 md:col-12 mb-3\">\r\n <h5 *ngIf=\"(record?.badges?.length ?? 0) > 0\" class=\"font-bold col-12 md:col-12 mb-2\">Badges</h5>\r\n <div class=\"feild-card col-12 md:col-12 flex\" *ngFor=\"let badge of (record?.badges || []); let i = index;\">\r\n <div class=\"field col-3 col-sm-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"badge\" [attributeModel]=\"{\r\n name:'dictionaryID',\r\n listLabelProperty:'name',\r\n listValueProperty:'_id',\r\n displayText : 'Select Dictionary',\r\n isRequired:true,\r\n options: dictionaries\r\n }\" (onInput)=\"handleBadgeDictionarySelect($event, i)\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-3 col-sm-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"badge\" [attributeModel]=\"{\r\n name:'dictionaryItemID',\r\n listLabelProperty:'itemName',\r\n listValueProperty:'_id',\r\n displayText : 'Select Properties',\r\n isRequired:true,\r\n options: badgeDictionaryItemArray[i]\r\n }\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-4 col-sm-6\">\r\n <text-box [store]=\"widgetStore\" [record]=\"badge\" [attributeModel]=\"{\r\n name : 'style',\r\n readonly : false,\r\n displayText : 'Style',\r\n isRequired : false,\r\n }\"></text-box>\r\n </div>\r\n <div class=\"field col-2 m-0 flex justify-content-start md:col-2 mt-5\">\r\n <div class=\"ml-4 delete-icon-container\">\r\n <i class=\"pi pi-trash trash-icon-wrapper cursor-pointer\" (click)=\"handleDeleteBadge(i)\"></i>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Widget Items -->\r\n <h5 *ngIf=\"(record?.dataItems?.length ?? 0) > 0\" class=\"font-bold col-12 md:col-12 mb-2\">Widget Items</h5>\r\n <div class=\"feild-card col-12 md:col-12 flex\" *ngFor=\"let widgetItem of (record?.dataItems || []); let i = index;\">\r\n <div class=\"field col-2 col-sm-6\">\r\n <text-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\r\n name : 'name',\r\n readonly : false,\r\n displayText : 'Item Label',\r\n isRequired : true,\r\n }\"></text-box>\r\n </div>\r\n <div class=\"field col-2 col-sm-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"widgetItem\" [attributeModel]=\"{\r\n name:'dictionaryID',\r\n listLabelProperty:'name',\r\n listValueProperty:'_id',\r\n displayText : 'Select Dictionary',\r\n isRequired:true,\r\n options: dictionaries\r\n }\" (onInput)=\"handleWidgetItemDictionarySelect($event, i)\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-2 col-sm-6\">\r\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"widgetItem\" [attributeModel]=\"{\r\n name:'dictionaryItemID',\r\n listLabelProperty:'itemName',\r\n listValueProperty:'_id',\r\n displayText : 'Select Properties',\r\n isRequired:true,\r\n options: dictionaryItemArray[i]\r\n }\">\r\n </dropdown>\r\n </div>\r\n <div class=\"field col-4 col-sm-6\">\r\n <text-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\r\n name : 'style',\r\n readonly : false,\r\n displayText : 'Item Style',\r\n isRequired : false,\r\n }\"></text-box>\r\n </div>\r\n <div class=\"field col-4 m-0 flex justify-content-center md:col-2 mt-5\">\r\n <div class=\"m-0\">\r\n <check-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\r\n name:'isActive',\r\n displayText : 'Is Active ?',\r\n }\">\r\n </check-box>\r\n </div>\r\n <div class=\"ml-4 delete-icon-container\">\r\n <i class=\"pi pi-trash trash-icon-wrapper cursor-pointer\" (click)=\"handleDeleteRecord(i)\"></i>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</form-container>", styles: [".trash-icon-wrapper{font-size:20px;color:var(--red-500)}\n"] }]
|
|
4034
|
+
args: [{ selector: 'lib-widget-admin-form', standalone: false, template: "<form-container [record]=\"record\" [showSave]=\"true\" [messages]=\"message\" (onSave)=\"handleSubmit()\"\n (onCancel)=\"handleCancel()\">\n <div class=\"card p-fluid p-formgrid\">\n <h4 class=\"font-bold col-12 md:col-12\">Widget Form</h4>\n <div class=\"col-12 md:col-12 mt-2 mb-2 flex\">\n <div class=\"col-3 md:col-3 mt-2 mb-2\">\n <text-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\n readonly: false,\n name: 'name',\n isRequired: true,\n displayText: 'Name',\n placeholder: 'Enter Widget Name'\n }\"></text-box>\n </div>\n\n <div class=\"col-3 md:col-3 mt-2 mb-2\">\n <dropdown [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\n name:'apiConfigId',\n displayText : 'Select API',\n isRequired:true,\n }\" (onInput)=\"handleAPIChange($event)\">\n </dropdown>\n </div>\n\n <div class=\"col-4 md:col-4 mt-2 mb-2\">\n <text-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\n readonly: false,\n name: 'style',\n isRequired: false,\n displayText: 'Style',\n placeholder: 'Enter Widget Style'\n }\"></text-box>\n </div>\n\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"widgetStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n </div>\n <div class=\"grid align-items-center m-0\">\n <div class=\"col-6 md:col-5 mt-2 mb-2 flex\">\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name:'headerDictionaryID',\n listLabelProperty:'name',\n listValueProperty:'_id',\n displayText : 'Select Dictionary',\n options: dictionaries\n }\" (onInput)=\"handleHeaderDictionarySelect($event)\">\n </dropdown>\n </div>\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name:'headerDictionaryItemID',\n listLabelProperty:'itemName',\n listValueProperty:'_id',\n displayText : 'Select Header Item',\n options: headerDictionaryItems\n }\">\n </dropdown>\n </div>\n </div>\n <div class=\"col-6 md:col-5 mt-2 mb-2 flex\">\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name:'subHeaderDictionaryID',\n listLabelProperty:'name',\n listValueProperty:'_id',\n displayText : 'Select Dictionary',\n options: dictionaries\n }\" (onInput)=\"handleSubHeaderDictionarySelect($event)\">\n </dropdown>\n </div>\n <div class=\"field col-6 pl-2 pb-0 mb-2 md:mr-2 md:col-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name:'subHeaderDictionaryItemID',\n listLabelProperty:'itemName',\n listValueProperty:'_id',\n displayText : 'Select SubHeader Item',\n options: subHeaderDictionaryItems\n }\">\n </dropdown>\n </div>\n </div>\n <div class=\"col-6 md:col-2 mt-2 mb-2 flex\">\n <div class=\"field col-12 pl-2 pb-0 mb-2 md:mr-2 md:col-12\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name:'layoutType',\n listLabelProperty:'name',\n listValueProperty:'value',\n displayText : 'Select Layout Type',\n options: widgetLayoutTypeList\n }\">\n </dropdown>\n </div>\n </div>\n </div>\n\n <div class=\"field p-0 pr-2 col-12 md:col-12 flex gap-2\">\n <div class=\"col-6 md:col-2\">\n <div class=\"card m-0 p-0 mb-2\">\n <div class=\"mt-3 w-full flex\">\n <button pButton pRipple routerLinkActive=\"router-link-active\"\n icon=\"pi pi-plus font-semibold\"\n class=\"py-3 justify-content-center font-semibold w-full border-round\"\n (click)=\"handleBadgeAddBtnClick()\">\n <span class=\"ml-3\">Add Badge </span>\n </button>\n </div>\n </div>\n </div>\n <div class=\"col-6 md:col-2\">\n <div class=\"card m-0 p-0 mb-2\">\n <div class=\"mt-3 w-full flex\">\n <button pButton pRipple routerLinkActive=\"router-link-active\"\n icon=\"pi pi-plus font-semibold\"\n class=\"py-3 justify-content-center font-semibold w-full border-round\"\n (click)=\"handleWidgetItemAddBtnClick()\">\n <span class=\"ml-3\">Add Widget Item </span>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Badges Section -->\n <div class=\"field p-0 pr-2 col-12 md:col-12 mb-3\">\n <h5 *ngIf=\"(record?.badges?.length ?? 0) > 0\" class=\"font-bold col-12 md:col-12 mb-2\">Badges</h5>\n <div class=\"feild-card col-12 md:col-12 flex\" *ngFor=\"let badge of (record?.badges || []); let i = index;\">\n <div class=\"field col-3 col-sm-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"badge\" [attributeModel]=\"{\n name:'dictionaryID',\n listLabelProperty:'name',\n listValueProperty:'_id',\n displayText : 'Select Dictionary',\n isRequired:true,\n options: dictionaries\n }\" (onInput)=\"handleBadgeDictionarySelect($event, i)\">\n </dropdown>\n </div>\n <div class=\"field col-3 col-sm-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"badge\" [attributeModel]=\"{\n name:'dictionaryItemID',\n listLabelProperty:'itemName',\n listValueProperty:'_id',\n displayText : 'Select Properties',\n isRequired:true,\n options: badgeDictionaryItemArray[i]\n }\">\n </dropdown>\n </div>\n <div class=\"field col-4 col-sm-6\">\n <text-box [store]=\"widgetStore\" [record]=\"badge\" [attributeModel]=\"{\n name : 'style',\n readonly : false,\n displayText : 'Style',\n isRequired : false,\n }\"></text-box>\n </div>\n <div class=\"field col-2 m-0 flex justify-content-start md:col-2 mt-5\">\n <div class=\"ml-4 delete-icon-container\">\n <i class=\"pi pi-trash trash-icon-wrapper cursor-pointer\" (click)=\"handleDeleteBadge(i)\"></i>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Widget Items -->\n <h5 *ngIf=\"(record?.dataItems?.length ?? 0) > 0\" class=\"font-bold col-12 md:col-12 mb-2\">Widget Items</h5>\n <div class=\"feild-card col-12 md:col-12 flex\" *ngFor=\"let widgetItem of (record?.dataItems || []); let i = index;\">\n <div class=\"field col-2 col-sm-6\">\n <text-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\n name : 'name',\n readonly : false,\n displayText : 'Item Label',\n isRequired : true,\n }\"></text-box>\n </div>\n <div class=\"field col-2 col-sm-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"widgetItem\" [attributeModel]=\"{\n name:'dictionaryID',\n listLabelProperty:'name',\n listValueProperty:'_id',\n displayText : 'Select Dictionary',\n isRequired:true,\n options: dictionaries\n }\" (onInput)=\"handleWidgetItemDictionarySelect($event, i)\">\n </dropdown>\n </div>\n <div class=\"field col-2 col-sm-6\">\n <dropdown [store]=\"widgetStore\" [isStaticDropdown]=\"true\" [record]=\"widgetItem\" [attributeModel]=\"{\n name:'dictionaryItemID',\n listLabelProperty:'itemName',\n listValueProperty:'_id',\n displayText : 'Select Properties',\n isRequired:true,\n options: dictionaryItemArray[i]\n }\">\n </dropdown>\n </div>\n <div class=\"field col-4 col-sm-6\">\n <text-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\n name : 'style',\n readonly : false,\n displayText : 'Item Style',\n isRequired : false,\n }\"></text-box>\n </div>\n <div class=\"field col-4 m-0 flex justify-content-center md:col-2 mt-5\">\n <div class=\"m-0\">\n <check-box [store]=\"widgetStore\" [record]=\"widgetItem\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Is Active ?',\n }\">\n </check-box>\n </div>\n <div class=\"ml-4 delete-icon-container\">\n <i class=\"pi pi-trash trash-icon-wrapper cursor-pointer\" (click)=\"handleDeleteRecord(i)\"></i>\n </div>\n </div>\n </div>\n </div>\n</form-container>", styles: [".trash-icon-wrapper{font-size:20px;color:var(--red-500)}\n"] }]
|
|
4035
4035
|
}], ctorParameters: () => [{ type: WidgetAdminService }, { type: ValidatorService }, { type: WidgetAdminStore }, { type: WidgetAdminQuery }, { type: i3$4.Router }, { type: i3$4.ActivatedRoute }, { type: BaseStore }, { type: BaseQuery }] });
|
|
4036
4036
|
|
|
4037
4037
|
/**
|
|
@@ -4302,11 +4302,11 @@ class QueueAdminFormComponent extends BaseFormComponent {
|
|
|
4302
4302
|
super.ngOnDestroy();
|
|
4303
4303
|
}
|
|
4304
4304
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueAdminFormComponent, deps: [{ token: QueueQuery }, { token: QueueService$1 }, { token: i3$4.ActivatedRoute }, { token: QueueStore }, { token: ValidatorService }, { token: i3$4.Router }, { token: BaseStore }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
4305
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueAdminFormComponent, isStandalone: false, selector: "lib-queue-admin-form", usesInheritance: true, ngImport: i0, template: "<div class=\"grid m-0\">\
|
|
4305
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueAdminFormComponent, isStandalone: false, selector: "lib-queue-admin-form", usesInheritance: true, ngImport: i0, template: "<div class=\"grid m-0\">\n <div class=\"col-12\">\n <div>\n <form-container\n [record]=\"record\"\n [headerText]=\"'Queue / Create Queue'\"\n (onSave)=\"handleSubmit()\"\n (onCancel)=\"handleCancel()\"\n [showSave]=\"true\"\n [messages]=\"messages\"\n >\n <div class=\"card m-0\">\n <div class=\"p-fluid p-formgrid grid m-0\">\n <h4 class=\"font-bold col-12 md:col-12\">Create Queue</h4>\n <div class=\"col-12 md:col-5\">\n <text-box\n [record]=\"record\"\n [store]=\"queueStore\"\n [attributeModel]=\"{\n name : 'name',\n displayText:'Queue Name',\n readonly : false,\n isRequired : true,\n }\"\n >\n </text-box>\n </div>\n <div class=\"col-12 md:col-5\">\n <dropdown\n [record]=\"record\"\n [store]=\"queueStore\"\n [attributeModel]=\"{\n name: 'apiConfigId',\n readonly: false,\n isRequired: true,\n dataSource: 'apiConfig',\n listLabelProperty: 'name',\n listValueProperty: '_id',\n displayText: 'Api'\n }\" (onInput)=\"handleQueueChange($event)\"\n >\n </dropdown>\n </div>\n\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"queueStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n </div>\n\n <div class=\"w-full px-2 mt-2 flex justify-content-end mb-2\">\n <button\n pButton\n pRipple\n type=\"button\"\n label=\"Validate\"\n (click)=\"handleGetData()\"\n class=\"p-button-raised validate-btn-wrapper\"\n ></button>\n </div>\n\n <div class=\"p-fluid p-formgrid grid m-0\">\n <div class=\"col-12 md:col-6\">\n <dropdown\n [store]=\"queueStore\"\n [record]=\"record\"\n [isStaticDropdown]=\"true\"\n [attributeModel]=\"{\n name:'header',\n displayText : 'Header',\n placeholder: 'Select Header',\n listValueProperty: 'value',\n listLabelProperty: 'value',\n readonly : false,\n isRequired : true,\n options: apiPropertyList\n }\"></dropdown>\n </div>\n <div class=\"col-12 md:col-6\">\n <dropdown\n [store]=\"queueStore\"\n [record]=\"record\"\n [isStaticDropdown]=\"true\"\n [attributeModel]=\"{\n name:'subHeader',\n displayText : 'SubHeader',\n placeholder: 'Select SubHeader',\n listValueProperty: 'value',\n listLabelProperty: 'value',\n readonly : false,\n isRequired : false,\n options: apiPropertyList\n }\"></dropdown>\n </div>\n </div>\n </div>\n\n <div class=\"card m-0\">\n <div class=\"p-fluid p-formgrid grid m-0 mb-2\">\n <h4 class=\"font-bold col-12 md:col-12\">Queue Details</h4>\n </div>\n <ngx-query-builder\n class=\"p-2\"\n [(ngModel)]=\"query\"\n [config]=\"config\"\n (queryChange)=\"onQueryChange($event)\"\n ></ngx-query-builder>\n </div>\n </form-container>\n </div>\n </div>\n</div>\n", styles: [".q-ruleset .q-switch-radio:checked+.q-switch-label{background:var(--surface-section)!important;color:var(--text-color)!important;border:1px solid var(--primary-color)!important}.q-ruleset .q-switch-label{color:#000!important;border:1px solid}.q-ruleset .q-button{color:var(--text-color)!important;background:var(--primary-color)!important;border-radius:var(--border-radius)!important}.q-ruleset .q-rule{background:var(--surface-section)!important}.q-ruleset .q-field-control,.q-ruleset .q-operator-control,.q-ruleset .q-input-control,.q-ruleset .q-remove-button{background:var(--surface-section)!important;color:var(--text-color)!important;border:1px solid var(--surface-border)!important}.q-ruleset .q-row{border:1px solid var(--surface-border)!important}.validate-btn-wrapper{width:15%;padding:.8rem 1rem!important}.card-footer{display:flex;justify-content:flex-end;margin:10px}.button-container{display:flex}.create-button{padding:10px}\n"], dependencies: [{ kind: "component", type: TextBoxComponent, selector: "text-box" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: DropdownComponent, selector: "dropdown", inputs: ["isStaticDropdown"] }, { kind: "component", type: FormContainerComponent, selector: "form-container", inputs: ["messages", "record", "headerText", "showSave", "disableSaveButton"], outputs: ["onSave", "onCancel"] }, { kind: "component", type: i11.QueryBuilderComponent, selector: "ngx-query-builder", inputs: ["disabled", "level", "data", "allowRuleset", "allowCollapse", "emptyMessage", "classNames", "operatorMap", "parentValue", "config", "parentArrowIconTemplate", "parentInputTemplates", "parentOperatorTemplate", "parentFieldTemplate", "parentEntityTemplate", "parentSwitchGroupTemplate", "parentButtonGroupTemplate", "parentRulesetAddRuleButtonTemplate", "parentRulesetAddRulesetButtonTemplate", "parentRulesetRemoveButtonTemplate", "parentRuleRemoveButtonTemplate", "parentEmptyWarningTemplate", "parentChangeCallback", "parentTouchedCallback", "persistValueOnFieldChange", "value"] }, { kind: "directive", type: i3$3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: CheckBoxComponent, selector: "check-box" }], encapsulation: i0.ViewEncapsulation.None });
|
|
4306
4306
|
}
|
|
4307
4307
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueAdminFormComponent, decorators: [{
|
|
4308
4308
|
type: Component,
|
|
4309
|
-
args: [{ selector: "lib-queue-admin-form", standalone: false, encapsulation: ViewEncapsulation.None, template: "<div class=\"grid m-0\">\
|
|
4309
|
+
args: [{ selector: "lib-queue-admin-form", standalone: false, encapsulation: ViewEncapsulation.None, template: "<div class=\"grid m-0\">\n <div class=\"col-12\">\n <div>\n <form-container\n [record]=\"record\"\n [headerText]=\"'Queue / Create Queue'\"\n (onSave)=\"handleSubmit()\"\n (onCancel)=\"handleCancel()\"\n [showSave]=\"true\"\n [messages]=\"messages\"\n >\n <div class=\"card m-0\">\n <div class=\"p-fluid p-formgrid grid m-0\">\n <h4 class=\"font-bold col-12 md:col-12\">Create Queue</h4>\n <div class=\"col-12 md:col-5\">\n <text-box\n [record]=\"record\"\n [store]=\"queueStore\"\n [attributeModel]=\"{\n name : 'name',\n displayText:'Queue Name',\n readonly : false,\n isRequired : true,\n }\"\n >\n </text-box>\n </div>\n <div class=\"col-12 md:col-5\">\n <dropdown\n [record]=\"record\"\n [store]=\"queueStore\"\n [attributeModel]=\"{\n name: 'apiConfigId',\n readonly: false,\n isRequired: true,\n dataSource: 'apiConfig',\n listLabelProperty: 'name',\n listValueProperty: '_id',\n displayText: 'Api'\n }\" (onInput)=\"handleQueueChange($event)\"\n >\n </dropdown>\n </div>\n\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"queueStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n </div>\n\n <div class=\"w-full px-2 mt-2 flex justify-content-end mb-2\">\n <button\n pButton\n pRipple\n type=\"button\"\n label=\"Validate\"\n (click)=\"handleGetData()\"\n class=\"p-button-raised validate-btn-wrapper\"\n ></button>\n </div>\n\n <div class=\"p-fluid p-formgrid grid m-0\">\n <div class=\"col-12 md:col-6\">\n <dropdown\n [store]=\"queueStore\"\n [record]=\"record\"\n [isStaticDropdown]=\"true\"\n [attributeModel]=\"{\n name:'header',\n displayText : 'Header',\n placeholder: 'Select Header',\n listValueProperty: 'value',\n listLabelProperty: 'value',\n readonly : false,\n isRequired : true,\n options: apiPropertyList\n }\"></dropdown>\n </div>\n <div class=\"col-12 md:col-6\">\n <dropdown\n [store]=\"queueStore\"\n [record]=\"record\"\n [isStaticDropdown]=\"true\"\n [attributeModel]=\"{\n name:'subHeader',\n displayText : 'SubHeader',\n placeholder: 'Select SubHeader',\n listValueProperty: 'value',\n listLabelProperty: 'value',\n readonly : false,\n isRequired : false,\n options: apiPropertyList\n }\"></dropdown>\n </div>\n </div>\n </div>\n\n <div class=\"card m-0\">\n <div class=\"p-fluid p-formgrid grid m-0 mb-2\">\n <h4 class=\"font-bold col-12 md:col-12\">Queue Details</h4>\n </div>\n <ngx-query-builder\n class=\"p-2\"\n [(ngModel)]=\"query\"\n [config]=\"config\"\n (queryChange)=\"onQueryChange($event)\"\n ></ngx-query-builder>\n </div>\n </form-container>\n </div>\n </div>\n</div>\n", styles: [".q-ruleset .q-switch-radio:checked+.q-switch-label{background:var(--surface-section)!important;color:var(--text-color)!important;border:1px solid var(--primary-color)!important}.q-ruleset .q-switch-label{color:#000!important;border:1px solid}.q-ruleset .q-button{color:var(--text-color)!important;background:var(--primary-color)!important;border-radius:var(--border-radius)!important}.q-ruleset .q-rule{background:var(--surface-section)!important}.q-ruleset .q-field-control,.q-ruleset .q-operator-control,.q-ruleset .q-input-control,.q-ruleset .q-remove-button{background:var(--surface-section)!important;color:var(--text-color)!important;border:1px solid var(--surface-border)!important}.q-ruleset .q-row{border:1px solid var(--surface-border)!important}.validate-btn-wrapper{width:15%;padding:.8rem 1rem!important}.card-footer{display:flex;justify-content:flex-end;margin:10px}.button-container{display:flex}.create-button{padding:10px}\n"] }]
|
|
4310
4310
|
}], ctorParameters: () => [{ type: QueueQuery }, { type: QueueService$1 }, { type: i3$4.ActivatedRoute }, { type: QueueStore }, { type: ValidatorService }, { type: i3$4.Router }, { type: BaseStore }, { type: BaseQuery }] });
|
|
4311
4311
|
|
|
4312
4312
|
const routes$1 = [
|
|
@@ -4439,11 +4439,11 @@ class QueueApplicationListComponent {
|
|
|
4439
4439
|
this.selectedStatus = selectedStatus.target.value;
|
|
4440
4440
|
}
|
|
4441
4441
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueApplicationListComponent, deps: [{ token: QueueService$1 }, { token: DataTransformerService }, { token: i3$4.Router }, { token: QueueStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
4442
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: QueueApplicationListComponent, isStandalone: false, selector: "queue-application-list", inputs: { queueData: "queueData" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"grid m-0\">\
|
|
4442
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: QueueApplicationListComponent, isStandalone: false, selector: "queue-application-list", inputs: { queueData: "queueData" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"grid m-0\">\n <div class=\"col-12\">\n <div class=\"p-fluid p-formgrid grid p-2\">\n <div class=\"card col-12 md:col-12 flex flex-column border-bottom align-items-start p-4 pb-3\" style=\"\n border-bottom: 1px solid var(--surface-border);\n border-radius: 0px;\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n \">\n <h4 class=\"text-color m-0 queue-name font-semibold margin\">\n {{ queueData.name }}\n </h4>\n </div>\n\n <div class=\"col-12 md:col-12 p-0 flex scrollable flex-column\" [ngClass]=\"\n selectedStatus === 'active' ? 'surface-card' : 'inactive-card-wrapper'\n \">\n @for(record of associateQueueList; track record; let i = $index) {\n @if(record){\n <div class=\"col-12 md:col-12 border-bottom-1 p-0 surface-border gap-2 hover:surface-ground cursor-pointer\"\n (click)=\"handleApplicationClick(record)\">\n\n <div class=\"col-12 md:col-12 flex align-items-center py-3 px-4 userInfo\">\n <div class=\"col-12 md:col-2 p-0 userImage\">\n <div\n class=\"mainimg flex align-items-center justify-content-center circleColor w-3rem h-3rem border-circle\">\n <span class=\"font-bold\" style=\"font-weight: 600; font-size: 13.5; font-family: inherit;\">\n {{ record.initials }}\n </span>\n </div>\n </div>\n <div class=\"col-12 md:col-10 p-0\">\n <div class=\"flex justify-content-between align-items-center col-12 md:col-12 p-0\">\n <div class=\"userName\" style=\"font-weight: 600; font-size: 15px; \">\n {{ record.FullName | capitalizeWords }} \n </div>\n <div class=\"dayAndtime flex\">\n @if(record.message.type == \"Email\"){\n <span class=\"pi pi-envelope mr-2\" style=\"color: #676B89; font-size: 17px;\"></span>\n }\n @else if(record.message.type == \"SMS\") {\n <span class=\"pi pi-comments mr-2\" style=\"color: #676B89; font-size: 17px;\"></span>\n }@else if(record.message.type == \"WhatsApp\"){\n <span class=\"pi pi-whatsapp mr-2\" style=\"color: #676B89;font-size: 17px;\"></span>\n\n }\n <span style=\"color: #676B89; font-family: inherit;\"> {{record.message.day}}</span>\n </div>\n </div>\n <div class=\"flex align-items-center justify-content-between mt-1\">\n <div class=\"email col-12 md:col-12 p-0\" style=\"color: #8A8EA6;\">\n {{ record.message.content }}\n </div>\n \n <div class=\"countOfMessages\">\n <span>{{record.message.count}}</span>\n </div>\n \n </div>\n </div>\n </div>\n </div>\n }\n }\n\n </div>\n </div>\n </div>\n</div>", styles: [".label,.value{font-size:14px}.card{margin-bottom:0!important}.queue-name{max-width:85%;word-wrap:break-word;white-space:normal}.text-verflow-elipses{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card{background:var(--surface-card)}.card .filter-section .filter-dropdown,.card .filter-section .filter-button{padding:.2rem .5rem;border:1px solid #cce7ff;border-radius:5px;background-color:#f0f8ff;color:#333;cursor:pointer}.set-reminder-box{background-color:#4c629214;border:1px solid rgba(76,98,146,.2)}.set-reminder-box .pi-bell{color:#f57c00}.inactive-card-wrapper{background-color:#f3f5f8;border-left:1px solid #e0e3f3!important;border-right:1px solid #e0e3f3!important}::ng-deep .inactive-tag-wrapper .p-tag{background-color:#676b89!important}.circleColor{background-color:#eef0f5;color:#4c6292}.email{max-width:85%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.countOfMessages{display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#0f8bfd;color:#fff;width:22px!important;height:22px!important}.userInfo:hover{background-color:#eef0f5b3}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: CapitalizeWordsPipe, name: "capitalizeWords" }] });
|
|
4443
4443
|
}
|
|
4444
4444
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueApplicationListComponent, decorators: [{
|
|
4445
4445
|
type: Component,
|
|
4446
|
-
args: [{ selector: 'queue-application-list', standalone: false, template: "<div class=\"grid m-0\">\
|
|
4446
|
+
args: [{ selector: 'queue-application-list', standalone: false, template: "<div class=\"grid m-0\">\n <div class=\"col-12\">\n <div class=\"p-fluid p-formgrid grid p-2\">\n <div class=\"card col-12 md:col-12 flex flex-column border-bottom align-items-start p-4 pb-3\" style=\"\n border-bottom: 1px solid var(--surface-border);\n border-radius: 0px;\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n \">\n <h4 class=\"text-color m-0 queue-name font-semibold margin\">\n {{ queueData.name }}\n </h4>\n </div>\n\n <div class=\"col-12 md:col-12 p-0 flex scrollable flex-column\" [ngClass]=\"\n selectedStatus === 'active' ? 'surface-card' : 'inactive-card-wrapper'\n \">\n @for(record of associateQueueList; track record; let i = $index) {\n @if(record){\n <div class=\"col-12 md:col-12 border-bottom-1 p-0 surface-border gap-2 hover:surface-ground cursor-pointer\"\n (click)=\"handleApplicationClick(record)\">\n\n <div class=\"col-12 md:col-12 flex align-items-center py-3 px-4 userInfo\">\n <div class=\"col-12 md:col-2 p-0 userImage\">\n <div\n class=\"mainimg flex align-items-center justify-content-center circleColor w-3rem h-3rem border-circle\">\n <span class=\"font-bold\" style=\"font-weight: 600; font-size: 13.5; font-family: inherit;\">\n {{ record.initials }}\n </span>\n </div>\n </div>\n <div class=\"col-12 md:col-10 p-0\">\n <div class=\"flex justify-content-between align-items-center col-12 md:col-12 p-0\">\n <div class=\"userName\" style=\"font-weight: 600; font-size: 15px; \">\n {{ record.FullName | capitalizeWords }} \n </div>\n <div class=\"dayAndtime flex\">\n @if(record.message.type == \"Email\"){\n <span class=\"pi pi-envelope mr-2\" style=\"color: #676B89; font-size: 17px;\"></span>\n }\n @else if(record.message.type == \"SMS\") {\n <span class=\"pi pi-comments mr-2\" style=\"color: #676B89; font-size: 17px;\"></span>\n }@else if(record.message.type == \"WhatsApp\"){\n <span class=\"pi pi-whatsapp mr-2\" style=\"color: #676B89;font-size: 17px;\"></span>\n\n }\n <span style=\"color: #676B89; font-family: inherit;\"> {{record.message.day}}</span>\n </div>\n </div>\n <div class=\"flex align-items-center justify-content-between mt-1\">\n <div class=\"email col-12 md:col-12 p-0\" style=\"color: #8A8EA6;\">\n {{ record.message.content }}\n </div>\n \n <div class=\"countOfMessages\">\n <span>{{record.message.count}}</span>\n </div>\n \n </div>\n </div>\n </div>\n </div>\n }\n }\n\n </div>\n </div>\n </div>\n</div>", styles: [".label,.value{font-size:14px}.card{margin-bottom:0!important}.queue-name{max-width:85%;word-wrap:break-word;white-space:normal}.text-verflow-elipses{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card{background:var(--surface-card)}.card .filter-section .filter-dropdown,.card .filter-section .filter-button{padding:.2rem .5rem;border:1px solid #cce7ff;border-radius:5px;background-color:#f0f8ff;color:#333;cursor:pointer}.set-reminder-box{background-color:#4c629214;border:1px solid rgba(76,98,146,.2)}.set-reminder-box .pi-bell{color:#f57c00}.inactive-card-wrapper{background-color:#f3f5f8;border-left:1px solid #e0e3f3!important;border-right:1px solid #e0e3f3!important}::ng-deep .inactive-tag-wrapper .p-tag{background-color:#676b89!important}.circleColor{background-color:#eef0f5;color:#4c6292}.email{max-width:85%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.countOfMessages{display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#0f8bfd;color:#fff;width:22px!important;height:22px!important}.userInfo:hover{background-color:#eef0f5b3}\n"] }]
|
|
4447
4447
|
}], ctorParameters: () => [{ type: QueueService$1 }, { type: DataTransformerService }, { type: i3$4.Router }, { type: QueueStore }], propDecorators: { queueData: [{
|
|
4448
4448
|
type: Input
|
|
4449
4449
|
}] } });
|
|
@@ -4484,11 +4484,11 @@ class QueueAdminListComponent extends BaseContainerComponent {
|
|
|
4484
4484
|
}
|
|
4485
4485
|
}
|
|
4486
4486
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueAdminListComponent, deps: [{ token: QueueStore }, { token: QueueService$1 }], target: i0.ɵɵFactoryTarget.Component });
|
|
4487
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: QueueAdminListComponent, isStandalone: false, selector: "lib-queue-admin-list", usesInheritance: true, ngImport: i0, template: "<div class=\"container grid m-0\">\
|
|
4487
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: QueueAdminListComponent, isStandalone: false, selector: "lib-queue-admin-list", usesInheritance: true, ngImport: i0, template: "<div class=\"container grid m-0\">\n <div class=\"col-12 xl:col-3 md:col-12\">\n <block-list\n [queueData]=\"queueList\"\n (queueDataById)=\"handleQueueData($event)\"\n ></block-list>\n </div>\n <div class=\"col-12 xl:col-3 md:col-12\">\n @if(selectedQueue){\n <div class=\"animation-duration-500 associated-list\">\n <queue-application-list\n [queueData]=\"selectedQueue\"\n ></queue-application-list>\n </div>\n }\n </div>\n \n <div class=\"xl:col-6 md:col-12\">\n <div class=\"searchbar-wrapper\">\n <queue-search-customer></queue-search-customer>\n </div>\n </div>\n </div>\n ", styles: [".custom-tabview .p-tabview-nav{display:flex}::ng-deep .custom-tabview .p-tabview-nav-content ul li{flex:1;max-width:25%}.scrollable{scroll-behavior:smooth;max-height:75vh}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background-color:#868181;border-radius:20px}\n"], dependencies: [{ kind: "component", type: QueueSearchCustomerComponent, selector: "queue-search-customer" }, { kind: "component", type: BlockListComponent, selector: "block-list", inputs: ["queueData", "showQueueDataForm"], outputs: ["queueDataById"] }, { kind: "component", type: QueueApplicationListComponent, selector: "queue-application-list", inputs: ["queueData"] }] });
|
|
4488
4488
|
}
|
|
4489
4489
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueAdminListComponent, decorators: [{
|
|
4490
4490
|
type: Component,
|
|
4491
|
-
args: [{ selector: 'lib-queue-admin-list', standalone: false, template: "<div class=\"container grid m-0\">\
|
|
4491
|
+
args: [{ selector: 'lib-queue-admin-list', standalone: false, template: "<div class=\"container grid m-0\">\n <div class=\"col-12 xl:col-3 md:col-12\">\n <block-list\n [queueData]=\"queueList\"\n (queueDataById)=\"handleQueueData($event)\"\n ></block-list>\n </div>\n <div class=\"col-12 xl:col-3 md:col-12\">\n @if(selectedQueue){\n <div class=\"animation-duration-500 associated-list\">\n <queue-application-list\n [queueData]=\"selectedQueue\"\n ></queue-application-list>\n </div>\n }\n </div>\n \n <div class=\"xl:col-6 md:col-12\">\n <div class=\"searchbar-wrapper\">\n <queue-search-customer></queue-search-customer>\n </div>\n </div>\n </div>\n ", styles: [".custom-tabview .p-tabview-nav{display:flex}::ng-deep .custom-tabview .p-tabview-nav-content ul li{flex:1;max-width:25%}.scrollable{scroll-behavior:smooth;max-height:75vh}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background-color:#868181;border-radius:20px}\n"] }]
|
|
4492
4492
|
}], ctorParameters: () => [{ type: QueueStore }, { type: QueueService$1 }] });
|
|
4493
4493
|
|
|
4494
4494
|
class QueueAdminModule {
|
|
@@ -4577,11 +4577,11 @@ class AdminActionListComponent extends BaseListComponent {
|
|
|
4577
4577
|
this.init(actionTableColumnWidthList);
|
|
4578
4578
|
}
|
|
4579
4579
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AdminActionListComponent, deps: [{ token: AdminActionService }, { token: TableBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
4580
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AdminActionListComponent, isStandalone: false, selector: "lib-admin-action-list", usesInheritance: true, ngImport: i0, template: "<div class=\"dicitonary-list-wrapper\">\
|
|
4580
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AdminActionListComponent, isStandalone: false, selector: "lib-admin-action-list", usesInheritance: true, ngImport: i0, template: "<div class=\"dicitonary-list-wrapper\">\n @if(table){\n <lib-table-primary [table]=\"table\" [pathName]=\"pathName\" [metaData]=\"metaData\"></lib-table-primary>\n }\n</div>", styles: [""], dependencies: [{ kind: "component", type: TablePrimaryComponent, selector: "lib-table-primary", inputs: ["table", "metaData", "title", "showStatus", "showActions", "showSearchBar", "showNewRecordButton", "showRefreshButton", "pathName"] }] });
|
|
4581
4581
|
}
|
|
4582
4582
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AdminActionListComponent, decorators: [{
|
|
4583
4583
|
type: Component,
|
|
4584
|
-
args: [{ selector: 'lib-admin-action-list', standalone: false, template: "<div class=\"dicitonary-list-wrapper\">\
|
|
4584
|
+
args: [{ selector: 'lib-admin-action-list', standalone: false, template: "<div class=\"dicitonary-list-wrapper\">\n @if(table){\n <lib-table-primary [table]=\"table\" [pathName]=\"pathName\" [metaData]=\"metaData\"></lib-table-primary>\n }\n</div>" }]
|
|
4585
4585
|
}], ctorParameters: () => [{ type: AdminActionService }, { type: TableBuilder }] });
|
|
4586
4586
|
|
|
4587
4587
|
class AdminActionModel extends BaseModel {
|
|
@@ -4668,11 +4668,11 @@ class AdminActionFormComponent extends BaseFormComponent {
|
|
|
4668
4668
|
super.ngOnDestroy();
|
|
4669
4669
|
}
|
|
4670
4670
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AdminActionFormComponent, deps: [{ token: AdminActionService }, { token: ValidatorService }, { token: i3$4.Router }, { token: i3$4.ActivatedRoute }, { token: AdminActionStore }, { token: AppConfigService }, { token: BaseStore }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
4671
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: AdminActionFormComponent, isStandalone: false, selector: "lib-admin-action-form", usesInheritance: true, ngImport: i0, template: "<form-container\
|
|
4671
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: AdminActionFormComponent, isStandalone: false, selector: "lib-admin-action-form", usesInheritance: true, ngImport: i0, template: "<form-container\n [record]=\"record\"\n [headerText]=\"'Actions / Actions Form'\"\n [messages]=\"messages\"\n (onSave)=\"handleSubmit()\"\n [showSave]=\"true\"\n (onCancel)=\"handleCancel()\"\n>\n <div class=\"card p-fluid p-formgrid grid \">\n <h4 class=\"font-bold col-12 md:col-12\">Actions Form</h4>\n <div class=\"col-12 md:col-5\">\n <text-box\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'name',\n isRequired: true,\n displayText: 'Action Name',\n placeholder: 'Enter Action Name'\n }\"\n ></text-box>\n </div>\n \n <div class=\"col-12 md:col-5\">\n <dropdown\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n name: 'apiConfigId',\n readonly: false,\n isRequired: true,\n displayText: 'End Point',\n placeholder: 'Select End Point'\n }\"></dropdown>\n </div>\n\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"adminActionStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n\n <div class=\"col-12 md:col-6\">\n <dropdown\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n name:'queueId',\n isRequired: true,\n displayText : 'Queue',\n placeholder: 'Select Queue',\n readonly: false\n }\"></dropdown>\n </div>\n\n <div class=\"col-12 md:col-6\">\n <text-box\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'apiDocsUrl',\n isRequired: false,\n displayText: 'API Docs URL',\n placeholder: 'Enter API Docs URL'\n }\"\n ></text-box>\n </div>\n\n <div class=\"col-12 md:col-12\">\n <text-area\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'prompt',\n isRequired: true,\n displayText: 'Prompt',\n placeholder: 'Enter prompt'\n }\"\n ></text-area>\n </div>\n\n <div class=\"w-full flex justify-content-end px-2 mt-2\">\n <button\n pButton\n pRipple\n type=\"button\"\n label=\"Validate\"\n class=\"p-button-raised validate-btn-wrapper\"\n (click)=\"handleValidateAction()\"\n ></button>\n </div>\n\n <div class=\"col-12 md:col-12\">\n <text-area\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'formFields',\n isRequired: true,\n displayText: 'Form Configuration',\n placeholder: 'Enter form fields'\n }\"\n ></text-area>\n </div>\n </div>\n \n</form-container>", styles: [".validate-btn-wrapper{width:15%;padding:.8rem 1rem!important}\n"], dependencies: [{ kind: "component", type: TextBoxComponent, selector: "text-box" }, { kind: "component", type: DropdownComponent, selector: "dropdown", inputs: ["isStaticDropdown"] }, { kind: "component", type: FormContainerComponent, selector: "form-container", inputs: ["messages", "record", "headerText", "showSave", "disableSaveButton"], outputs: ["onSave", "onCancel"] }, { kind: "component", type: TextAreaComponent, selector: "text-area", inputs: ["rowspan"] }, { kind: "directive", type: i3$3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: CheckBoxComponent, selector: "check-box" }] });
|
|
4672
4672
|
}
|
|
4673
4673
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AdminActionFormComponent, decorators: [{
|
|
4674
4674
|
type: Component,
|
|
4675
|
-
args: [{ selector: 'lib-admin-action-form', standalone: false, template: "<form-container\
|
|
4675
|
+
args: [{ selector: 'lib-admin-action-form', standalone: false, template: "<form-container\n [record]=\"record\"\n [headerText]=\"'Actions / Actions Form'\"\n [messages]=\"messages\"\n (onSave)=\"handleSubmit()\"\n [showSave]=\"true\"\n (onCancel)=\"handleCancel()\"\n>\n <div class=\"card p-fluid p-formgrid grid \">\n <h4 class=\"font-bold col-12 md:col-12\">Actions Form</h4>\n <div class=\"col-12 md:col-5\">\n <text-box\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'name',\n isRequired: true,\n displayText: 'Action Name',\n placeholder: 'Enter Action Name'\n }\"\n ></text-box>\n </div>\n \n <div class=\"col-12 md:col-5\">\n <dropdown\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n name: 'apiConfigId',\n readonly: false,\n isRequired: true,\n displayText: 'End Point',\n placeholder: 'Select End Point'\n }\"></dropdown>\n </div>\n\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"adminActionStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n\n <div class=\"col-12 md:col-6\">\n <dropdown\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n name:'queueId',\n isRequired: true,\n displayText : 'Queue',\n placeholder: 'Select Queue',\n readonly: false\n }\"></dropdown>\n </div>\n\n <div class=\"col-12 md:col-6\">\n <text-box\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'apiDocsUrl',\n isRequired: false,\n displayText: 'API Docs URL',\n placeholder: 'Enter API Docs URL'\n }\"\n ></text-box>\n </div>\n\n <div class=\"col-12 md:col-12\">\n <text-area\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'prompt',\n isRequired: true,\n displayText: 'Prompt',\n placeholder: 'Enter prompt'\n }\"\n ></text-area>\n </div>\n\n <div class=\"w-full flex justify-content-end px-2 mt-2\">\n <button\n pButton\n pRipple\n type=\"button\"\n label=\"Validate\"\n class=\"p-button-raised validate-btn-wrapper\"\n (click)=\"handleValidateAction()\"\n ></button>\n </div>\n\n <div class=\"col-12 md:col-12\">\n <text-area\n [store]=\"adminActionStore\"\n [record]=\"record\"\n [attributeModel]=\"{\n readonly: false,\n name: 'formFields',\n isRequired: true,\n displayText: 'Form Configuration',\n placeholder: 'Enter form fields'\n }\"\n ></text-area>\n </div>\n </div>\n \n</form-container>", styles: [".validate-btn-wrapper{width:15%;padding:.8rem 1rem!important}\n"] }]
|
|
4676
4676
|
}], ctorParameters: () => [{ type: AdminActionService }, { type: ValidatorService }, { type: i3$4.Router }, { type: i3$4.ActivatedRoute }, { type: AdminActionStore }, { type: AppConfigService }, { type: BaseStore }, { type: BaseQuery }] });
|
|
4677
4677
|
|
|
4678
4678
|
class ActionAdminModule {
|
|
@@ -4887,11 +4887,11 @@ class DdAdminItemFormComponent {
|
|
|
4887
4887
|
this.attributeRecord = new DdAttributeSidebarViewModel();
|
|
4888
4888
|
}
|
|
4889
4889
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DdAdminItemFormComponent, deps: [{ token: DictionaryStore }, { token: DictionaryQuery }, { token: BaseStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
4890
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DdAdminItemFormComponent, isStandalone: false, selector: "lib-dd-admin-item-form", inputs: { ddItemRecord: "ddItemRecord", isItemExpression: "isItemExpression", isSidebarVisible: "isSidebarVisible" }, outputs: { saveClick: "saveClick" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dicitonary-edit-action px-3\">\
|
|
4890
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DdAdminItemFormComponent, isStandalone: false, selector: "lib-dd-admin-item-form", inputs: { ddItemRecord: "ddItemRecord", isItemExpression: "isItemExpression", isSidebarVisible: "isSidebarVisible" }, outputs: { saveClick: "saveClick" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dicitonary-edit-action px-3\">\n <div class=\"flex align-items-center justify-content-end mt-3\">\n <lib-button\n [store]=\"dictionaryStore\"\n [record]=\"attributeRecord\"\n [attributeModel]=\"{\n buttonLabel: 'Save',\n isDisabled: false,\n }\"\n (onBtnClick)=\"handleSaveBtnClick($event)\"\n >\n </lib-button>\n </div>\n\n <div class=\"col-12 md:col-12 mt-5\">\n <label *ngIf=\"!isItemExpression\" for=\"styleInput\" class=\"text-gray-600 text-sm mb-2 block\">\n Hint: Use key-value pairs for styles.\n <br/>\n Example:<code>\n 'background-color': 'lightgray',\n 'font-size': '16px',<br>\n 'padding': '10px'\n </code>\n </label>\n <text-area\n [store]=\"dictionaryStore\"\n [record]=\"attributeRecord\"\n [attributeModel]=\"{\n displayText: 'Expression',\n readonly : false,\n name : 'mappingInfo',\n isRequired : isItemExpression ? true : false,\n placeholder : 'Enter Text',\n customPadding: '12px',\n }\"\n ></text-area>\n </div>\n <div class=\"col-12 md:col-12\">\n <div class=\"p-field queue-list-wrapper\">\n <dropdown [store]=\"dictionaryStore\" [isStaticDropdown]=\"true\" [record]=\"attributeRecord\" [attributeModel]=\"{\n name:'propertyList',\n displayText : 'Select properties',\n isRequired:false,\n listLabelProperty: 'label',\n listValueProperty: 'value',\n options : propertyOptions,\n filter : true\n }\">\n </dropdown>\n </div>\n </div>\n <div class=\"col-12 md:col-3\">\n <lib-button\n [store]=\"dictionaryStore\"\n [record]=\"attributeRecord\"\n [attributeModel]=\"{\n buttonLabel: 'Add to expression',\n isDisabled: false,\n }\"\n (onBtnClick)=\"handleAddExpressionClick($event)\"\n >\n </lib-button>\n </div>\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DropdownComponent, selector: "dropdown", inputs: ["isStaticDropdown"] }, { kind: "component", type: ButtonComponent, selector: "lib-button" }, { kind: "component", type: TextAreaComponent, selector: "text-area", inputs: ["rowspan"] }] });
|
|
4891
4891
|
}
|
|
4892
4892
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DdAdminItemFormComponent, decorators: [{
|
|
4893
4893
|
type: Component,
|
|
4894
|
-
args: [{ selector: 'lib-dd-admin-item-form', standalone: false, template: "<div class=\"dicitonary-edit-action px-3\">\
|
|
4894
|
+
args: [{ selector: 'lib-dd-admin-item-form', standalone: false, template: "<div class=\"dicitonary-edit-action px-3\">\n <div class=\"flex align-items-center justify-content-end mt-3\">\n <lib-button\n [store]=\"dictionaryStore\"\n [record]=\"attributeRecord\"\n [attributeModel]=\"{\n buttonLabel: 'Save',\n isDisabled: false,\n }\"\n (onBtnClick)=\"handleSaveBtnClick($event)\"\n >\n </lib-button>\n </div>\n\n <div class=\"col-12 md:col-12 mt-5\">\n <label *ngIf=\"!isItemExpression\" for=\"styleInput\" class=\"text-gray-600 text-sm mb-2 block\">\n Hint: Use key-value pairs for styles.\n <br/>\n Example:<code>\n 'background-color': 'lightgray',\n 'font-size': '16px',<br>\n 'padding': '10px'\n </code>\n </label>\n <text-area\n [store]=\"dictionaryStore\"\n [record]=\"attributeRecord\"\n [attributeModel]=\"{\n displayText: 'Expression',\n readonly : false,\n name : 'mappingInfo',\n isRequired : isItemExpression ? true : false,\n placeholder : 'Enter Text',\n customPadding: '12px',\n }\"\n ></text-area>\n </div>\n <div class=\"col-12 md:col-12\">\n <div class=\"p-field queue-list-wrapper\">\n <dropdown [store]=\"dictionaryStore\" [isStaticDropdown]=\"true\" [record]=\"attributeRecord\" [attributeModel]=\"{\n name:'propertyList',\n displayText : 'Select properties',\n isRequired:false,\n listLabelProperty: 'label',\n listValueProperty: 'value',\n options : propertyOptions,\n filter : true\n }\">\n </dropdown>\n </div>\n </div>\n <div class=\"col-12 md:col-3\">\n <lib-button\n [store]=\"dictionaryStore\"\n [record]=\"attributeRecord\"\n [attributeModel]=\"{\n buttonLabel: 'Add to expression',\n isDisabled: false,\n }\"\n (onBtnClick)=\"handleAddExpressionClick($event)\"\n >\n </lib-button>\n </div>\n</div>" }]
|
|
4895
4895
|
}], ctorParameters: () => [{ type: DictionaryStore }, { type: DictionaryQuery }, { type: BaseStore }], propDecorators: { ddItemRecord: [{
|
|
4896
4896
|
type: Input
|
|
4897
4897
|
}], isItemExpression: [{
|
|
@@ -4999,11 +4999,11 @@ class DdAdminFormComponent extends BaseFormComponent {
|
|
|
4999
4999
|
super.ngOnDestroy();
|
|
5000
5000
|
}
|
|
5001
5001
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DdAdminFormComponent, deps: [{ token: DictionaryService }, { token: DictionaryQuery }, { token: ValidatorService }, { token: i3$4.Router }, { token: i3$4.ActivatedRoute }, { token: DictionaryStore }, { token: BaseStore }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
5002
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DdAdminFormComponent, isStandalone: false, selector: "lib-dd-admin-form", usesInheritance: true, ngImport: i0, template: "<form-container [messages]=\"messages\" [record]=\"record\" [headerText]=\"'Dictionary Form'\" [showSave]=\"true\"\
|
|
5002
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DdAdminFormComponent, isStandalone: false, selector: "lib-dd-admin-form", usesInheritance: true, ngImport: i0, template: "<form-container [messages]=\"messages\" [record]=\"record\" [headerText]=\"'Dictionary Form'\" [showSave]=\"true\"\n (onCancel)=\"handleCancel()\" (onSave)=\"handleSubmit()\">\n <div class=\"card p-fluid p-formgrid grid m-0\">\n <div class=\"col-12 md:col-12 flex align-items-center justify-content-between\">\n <div class=\"col-12 md:col-5 p-field\">\n <div class=\"dictionary-name\">\n <text-box [store]=\"ddAdminStore\" [record]=\"record\" [attributeModel]=\"{\n readonly : false,\n name : 'name',\n isRequired : true,\n displayText: 'Dictionary Name',\n placeholder : 'Enter Text',\n }\"></text-box>\n </div>\n </div>\n <div class=\"col-12 md:col-5\">\n <div class=\"p-field queue-list-wrapper\">\n <dropdown [store]=\"ddAdminStore\" [record]=\"record\" [attributeModel]=\"{\n name: 'apiConfigId',\n dataSource: 'apiconfigs',\n listLabelProperty: 'name',\n listValueProperty: '_id',\n displayText: 'API ',\n placeholder: 'Select API',\n isRequired: true\n }\" (onInput)=\"handleGetProperties($event)\">\n </dropdown>\n </div>\n </div>\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"ddAdminStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n </div>\n\n <div class=\"field p-0 pr-2 ml-3 col-12 md:col-2\">\n <div class=\"card m-0 p-0 mb-2\">\n <div class=\"mt-3 w-full flex\">\n <button pButton pRipple routerLinkActive=\"router-link-active\"\n class=\"py-3 justify-content-center font-semibold w-full border-round\"\n (click)=\"handleDictionaryItemAddBtnClick()\">\n Add New Item\n </button>\n </div>\n </div>\n </div>\n\n <!-- dictionary Items -->\n <div class=\"col-12 md:col-12 flex align-items-center justify-content-between\"\n *ngFor=\"let ddItem of record.dictionaryItems; let i = index\">\n <div class=\"field col-12 md:col-3 pr-0\">\n <text-box [store]=\"ddAdminStore\" [record]=\"ddItem\" [attributeModel]=\"{\n name : 'itemName',\n readonly : false,\n displayText : 'Item Name',\n isRequired : true,\n }\"></text-box>\n </div>\n <div class=\"field flex align-items-center justify-content-between col-12 md:col-3 pr-0\">\n <div class=\"flex align-items-center w-full\">\n <div class=\"w-full mr-3\">\n <text-box [store]=\"ddAdminStore\" [record]=\"ddItem\" [attributeModel]=\"{\n name : 'itemExpression',\n readonly : true,\n displayText : 'Item Expression',\n isRequired : true,\n }\">\n </text-box>\n </div>\n <span class=\"pi pi-cog mt-4 cursor-pointer text-xl\"\n (click)=\"handleItemExpression(i, $event )\"></span>\n </div>\n </div>\n\n <div class=\"field col-12 md:col-3 flex align-items-center justify-content-between pr-0\">\n <div class=\"flex align-items-center w-full\">\n <div class=\"w-full mr-3\">\n <text-box [store]=\"ddAdminStore\" [record]=\"ddItem\" [attributeModel]=\"{\n name : 'styleExpression',\n readonly : false,\n disable : true,\n displayText : 'Style Expression',\n isRequired : false,\n }\">\n </text-box>\n </div>\n <span class=\"pi pi-cog mt-4 text-xl cursor-pointer text-color\"\n (click)=\"handleStyleExpression(i, $event)\"></span>\n </div>\n </div>\n\n <div class=\"field col-12 md:col-2 flex align-items-center justify-content-center mt-4\">\n <check-box [store]=\"ddAdminStore\" [record]=\"ddItem\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Is Active',\n }\">\n </check-box>\n\n <div class=\"ml-6 delete-icon-container\">\n <i class=\"pi pi-trash trash-icon-wrapper cursor-pointer\"\n (click)=\"handleDeleteRecord(i, ddItem?._id)\"></i>\n </div>\n </div>\n <sidebar [isSidebarVisible]=\"sidebarVisibility[i]\" [title]=\"'Edit Expression'\"\n (onClose)=\"onSidebarClose($event)\">\n <lib-dd-admin-item-form [ddItemRecord]=\"ddItem\" [isItemExpression]=\"isItemExpression\"\n (saveClick)=\"onSidebarClose($event)\"></lib-dd-admin-item-form>\n </sidebar>\n </div>\n\n </div>\n</form-container>", styles: [".trash-icon-wrapper{font-size:20px;color:var(--red-500)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: TextBoxComponent, selector: "text-box" }, { kind: "component", type: DropdownComponent, selector: "dropdown", inputs: ["isStaticDropdown"] }, { kind: "component", type: FormContainerComponent, selector: "form-container", inputs: ["messages", "record", "headerText", "showSave", "disableSaveButton"], outputs: ["onSave", "onCancel"] }, { kind: "component", type: SidebarComponent, selector: "sidebar", inputs: ["isSidebarVisible", "title"], outputs: ["onClose"] }, { kind: "component", type: CheckBoxComponent, selector: "check-box" }, { kind: "directive", type: i3$3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: DdAdminItemFormComponent, selector: "lib-dd-admin-item-form", inputs: ["ddItemRecord", "isItemExpression", "isSidebarVisible"], outputs: ["saveClick"] }] });
|
|
5003
5003
|
}
|
|
5004
5004
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DdAdminFormComponent, decorators: [{
|
|
5005
5005
|
type: Component,
|
|
5006
|
-
args: [{ selector: 'lib-dd-admin-form', standalone: false, template: "<form-container [messages]=\"messages\" [record]=\"record\" [headerText]=\"'Dictionary Form'\" [showSave]=\"true\"\
|
|
5006
|
+
args: [{ selector: 'lib-dd-admin-form', standalone: false, template: "<form-container [messages]=\"messages\" [record]=\"record\" [headerText]=\"'Dictionary Form'\" [showSave]=\"true\"\n (onCancel)=\"handleCancel()\" (onSave)=\"handleSubmit()\">\n <div class=\"card p-fluid p-formgrid grid m-0\">\n <div class=\"col-12 md:col-12 flex align-items-center justify-content-between\">\n <div class=\"col-12 md:col-5 p-field\">\n <div class=\"dictionary-name\">\n <text-box [store]=\"ddAdminStore\" [record]=\"record\" [attributeModel]=\"{\n readonly : false,\n name : 'name',\n isRequired : true,\n displayText: 'Dictionary Name',\n placeholder : 'Enter Text',\n }\"></text-box>\n </div>\n </div>\n <div class=\"col-12 md:col-5\">\n <div class=\"p-field queue-list-wrapper\">\n <dropdown [store]=\"ddAdminStore\" [record]=\"record\" [attributeModel]=\"{\n name: 'apiConfigId',\n dataSource: 'apiconfigs',\n listLabelProperty: 'name',\n listValueProperty: '_id',\n displayText: 'API ',\n placeholder: 'Select API',\n isRequired: true\n }\" (onInput)=\"handleGetProperties($event)\">\n </dropdown>\n </div>\n </div>\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"ddAdminStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n </div>\n\n <div class=\"field p-0 pr-2 ml-3 col-12 md:col-2\">\n <div class=\"card m-0 p-0 mb-2\">\n <div class=\"mt-3 w-full flex\">\n <button pButton pRipple routerLinkActive=\"router-link-active\"\n class=\"py-3 justify-content-center font-semibold w-full border-round\"\n (click)=\"handleDictionaryItemAddBtnClick()\">\n Add New Item\n </button>\n </div>\n </div>\n </div>\n\n <!-- dictionary Items -->\n <div class=\"col-12 md:col-12 flex align-items-center justify-content-between\"\n *ngFor=\"let ddItem of record.dictionaryItems; let i = index\">\n <div class=\"field col-12 md:col-3 pr-0\">\n <text-box [store]=\"ddAdminStore\" [record]=\"ddItem\" [attributeModel]=\"{\n name : 'itemName',\n readonly : false,\n displayText : 'Item Name',\n isRequired : true,\n }\"></text-box>\n </div>\n <div class=\"field flex align-items-center justify-content-between col-12 md:col-3 pr-0\">\n <div class=\"flex align-items-center w-full\">\n <div class=\"w-full mr-3\">\n <text-box [store]=\"ddAdminStore\" [record]=\"ddItem\" [attributeModel]=\"{\n name : 'itemExpression',\n readonly : true,\n displayText : 'Item Expression',\n isRequired : true,\n }\">\n </text-box>\n </div>\n <span class=\"pi pi-cog mt-4 cursor-pointer text-xl\"\n (click)=\"handleItemExpression(i, $event )\"></span>\n </div>\n </div>\n\n <div class=\"field col-12 md:col-3 flex align-items-center justify-content-between pr-0\">\n <div class=\"flex align-items-center w-full\">\n <div class=\"w-full mr-3\">\n <text-box [store]=\"ddAdminStore\" [record]=\"ddItem\" [attributeModel]=\"{\n name : 'styleExpression',\n readonly : false,\n disable : true,\n displayText : 'Style Expression',\n isRequired : false,\n }\">\n </text-box>\n </div>\n <span class=\"pi pi-cog mt-4 text-xl cursor-pointer text-color\"\n (click)=\"handleStyleExpression(i, $event)\"></span>\n </div>\n </div>\n\n <div class=\"field col-12 md:col-2 flex align-items-center justify-content-center mt-4\">\n <check-box [store]=\"ddAdminStore\" [record]=\"ddItem\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Is Active',\n }\">\n </check-box>\n\n <div class=\"ml-6 delete-icon-container\">\n <i class=\"pi pi-trash trash-icon-wrapper cursor-pointer\"\n (click)=\"handleDeleteRecord(i, ddItem?._id)\"></i>\n </div>\n </div>\n <sidebar [isSidebarVisible]=\"sidebarVisibility[i]\" [title]=\"'Edit Expression'\"\n (onClose)=\"onSidebarClose($event)\">\n <lib-dd-admin-item-form [ddItemRecord]=\"ddItem\" [isItemExpression]=\"isItemExpression\"\n (saveClick)=\"onSidebarClose($event)\"></lib-dd-admin-item-form>\n </sidebar>\n </div>\n\n </div>\n</form-container>", styles: [".trash-icon-wrapper{font-size:20px;color:var(--red-500)}\n"] }]
|
|
5007
5007
|
}], ctorParameters: () => [{ type: DictionaryService }, { type: DictionaryQuery }, { type: ValidatorService }, { type: i3$4.Router }, { type: i3$4.ActivatedRoute }, { type: DictionaryStore }, { type: BaseStore }, { type: BaseQuery }] });
|
|
5008
5008
|
|
|
5009
5009
|
class DdAdminListComponent extends BaseListComponent {
|
|
@@ -5020,11 +5020,11 @@ class DdAdminListComponent extends BaseListComponent {
|
|
|
5020
5020
|
this.init();
|
|
5021
5021
|
}
|
|
5022
5022
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DdAdminListComponent, deps: [{ token: DictionaryService }, { token: TableBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
5023
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DdAdminListComponent, isStandalone: false, selector: "lib-dd-admin-list", usesInheritance: true, ngImport: i0, template: "<div class=\"dicitonary-list-wrapper\">\
|
|
5023
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: DdAdminListComponent, isStandalone: false, selector: "lib-dd-admin-list", usesInheritance: true, ngImport: i0, template: "<div class=\"dicitonary-list-wrapper\">\n @if(table){\n <lib-table-primary [table]=\"table\" [pathName]=\"pathName\" [metaData]=\"metaData\"></lib-table-primary>\n }\n</div>", styles: [""], dependencies: [{ kind: "component", type: TablePrimaryComponent, selector: "lib-table-primary", inputs: ["table", "metaData", "title", "showStatus", "showActions", "showSearchBar", "showNewRecordButton", "showRefreshButton", "pathName"] }] });
|
|
5024
5024
|
}
|
|
5025
5025
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DdAdminListComponent, decorators: [{
|
|
5026
5026
|
type: Component,
|
|
5027
|
-
args: [{ selector: 'lib-dd-admin-list', standalone: false, template: "<div class=\"dicitonary-list-wrapper\">\
|
|
5027
|
+
args: [{ selector: 'lib-dd-admin-list', standalone: false, template: "<div class=\"dicitonary-list-wrapper\">\n @if(table){\n <lib-table-primary [table]=\"table\" [pathName]=\"pathName\" [metaData]=\"metaData\"></lib-table-primary>\n }\n</div>" }]
|
|
5028
5028
|
}], ctorParameters: () => [{ type: DictionaryService }, { type: TableBuilder }] });
|
|
5029
5029
|
|
|
5030
5030
|
class DdAdminModule {
|
|
@@ -5229,11 +5229,11 @@ class TemplateAdminFormComponent extends BaseFormComponent {
|
|
|
5229
5229
|
super.ngOnDestroy();
|
|
5230
5230
|
}
|
|
5231
5231
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TemplateAdminFormComponent, deps: [{ token: TemplateAdminService }, { token: ValidatorService }, { token: i3$4.Router }, { token: i3$4.ActivatedRoute }, { token: TemplateAdminQuery }, { token: TemplateAdminStore }, { token: BaseStore }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
5232
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: TemplateAdminFormComponent, isStandalone: false, selector: "lib-template-admin-form", usesInheritance: true, ngImport: i0, template: "<form-container [record]=\"record\" [showSave]=\"true\" [messages]=\"message\" (onSave)=\"handleSubmit()\"\
|
|
5232
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: TemplateAdminFormComponent, isStandalone: false, selector: "lib-template-admin-form", usesInheritance: true, ngImport: i0, template: "<form-container [record]=\"record\" [showSave]=\"true\" [messages]=\"message\" (onSave)=\"handleSubmit()\"\n (onCancel)=\"handleCancel()\">\n <div class=\"card p-fluid p-formgrid\">\n <h4 class=\"font-bold col-12 md:col-12\">Template Form</h4>\n <div class=\"col-12 md:col-12 flex px-0\">\n <div class=\"col-12 md:col-5\">\n <text-box [store]=\"templateStore\" [record]=\"record\" [attributeModel]=\"{\n readonly: false,\n name: 'name',\n isRequired: true,\n displayText: 'Name',\n placeholder: 'Enter Template Name'\n }\"></text-box>\n </div>\n\n <div class=\"col-12 md:col-5\">\n <div class=\"p-field queue-list-wrapper\">\n <dropdown [store]=\"templateStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name: 'type',\n displayText: 'Type',\n listLabelProperty: 'value',\n listValueProperty: 'value',\n placeholder: 'Select Type',\n isRequired: true,\n options: templateTypeList\n }\">\n </dropdown>\n </div>\n </div>\n\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"templateStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n </div>\n\n <div class=\"col-12 md:col-12 flex px-0\">\n <div class=\"col-12 md:col-6\">\n <dropdown [store]=\"templateStore\" [record]=\"record\" [attributeModel]=\"{\n name:'queueId',\n listLabelProperty: 'name',\n listValueProperty: '_id',\n displayText : 'Select Queue',\n placeholder: 'Select Queue',\n isRequired:true\n }\" (onInput)=\"handleQueueChange($event)\">\n </dropdown>\n </div>\n\n <div class=\"col-12 md:col-6\">\n <dropdown [store]=\"templateStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name: 'dictionaryID',\n displayText: 'Select Dictionary',\n listLabelProperty: 'name',\n listValueProperty: '_id',\n placeholder: 'Select Dictionary',\n options: dictionaries\n }\" (onInput)=\"handleDictionarySelect($event)\">\n </dropdown>\n </div>\n </div>\n\n <div class=\"col-12 md:col-12 flex px-0\">\n <div *ngIf=\"record.type === 'email'\" class=\"col-12 md:col-6\">\n <text-box [store]=\"templateStore\" [record]=\"record\" [attributeModel]=\"{\n readonly: false,\n name: 'subject',\n isRequired: true,\n displayText: 'Subject',\n placeholder: 'Enter Subject'\n }\"></text-box>\n </div>\n\n <div class=\"col-12 md:col-6\">\n <dropdown [store]=\"templateStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name: 'dictionaryItemID',\n displayText: 'Select Dictionary Item',\n listLabelProperty: 'itemName',\n listValueProperty: '_id',\n placeholder: 'Select Dictionary Item',\n options: dictionaryItems\n }\">\n </dropdown>\n </div>\n </div>\n\n <div class=\"col-12 md:col-12\">\n <label>Message</label>\n <span class=\"asterisk ml-1\">*</span>\n <quill-editor [(ngModel)]=\"messageContent\" class=\"w-full mt-2\"></quill-editor>\n <div *ngIf=\"isFormSubmitted && !messageContent\" class=\"error-message\">\n <small class=\"p-error\">Message is required</small>\n </div>\n </div>\n </div>\n</form-container>", styles: [".asterisk{color:red}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TextBoxComponent, selector: "text-box" }, { kind: "component", type: DropdownComponent, selector: "dropdown", inputs: ["isStaticDropdown"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormContainerComponent, selector: "form-container", inputs: ["messages", "record", "headerText", "showSave", "disableSaveButton"], outputs: ["onSave", "onCancel"] }, { kind: "component", type: CheckBoxComponent, selector: "check-box" }, { kind: "component", type: i1$2.QuillEditorComponent, selector: "quill-editor" }] });
|
|
5233
5233
|
}
|
|
5234
5234
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TemplateAdminFormComponent, decorators: [{
|
|
5235
5235
|
type: Component,
|
|
5236
|
-
args: [{ selector: 'lib-template-admin-form', standalone: false, template: "<form-container [record]=\"record\" [showSave]=\"true\" [messages]=\"message\" (onSave)=\"handleSubmit()\"\
|
|
5236
|
+
args: [{ selector: 'lib-template-admin-form', standalone: false, template: "<form-container [record]=\"record\" [showSave]=\"true\" [messages]=\"message\" (onSave)=\"handleSubmit()\"\n (onCancel)=\"handleCancel()\">\n <div class=\"card p-fluid p-formgrid\">\n <h4 class=\"font-bold col-12 md:col-12\">Template Form</h4>\n <div class=\"col-12 md:col-12 flex px-0\">\n <div class=\"col-12 md:col-5\">\n <text-box [store]=\"templateStore\" [record]=\"record\" [attributeModel]=\"{\n readonly: false,\n name: 'name',\n isRequired: true,\n displayText: 'Name',\n placeholder: 'Enter Template Name'\n }\"></text-box>\n </div>\n\n <div class=\"col-12 md:col-5\">\n <div class=\"p-field queue-list-wrapper\">\n <dropdown [store]=\"templateStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name: 'type',\n displayText: 'Type',\n listLabelProperty: 'value',\n listValueProperty: 'value',\n placeholder: 'Select Type',\n isRequired: true,\n options: templateTypeList\n }\">\n </dropdown>\n </div>\n </div>\n\n <div class=\"col-2 md:col-2 mt-5\">\n <check-box [store]=\"templateStore\" [record]=\"record\" [attributeModel]=\"{\n name:'isActive',\n displayText : 'Active',\n }\">\n </check-box>\n </div>\n </div>\n\n <div class=\"col-12 md:col-12 flex px-0\">\n <div class=\"col-12 md:col-6\">\n <dropdown [store]=\"templateStore\" [record]=\"record\" [attributeModel]=\"{\n name:'queueId',\n listLabelProperty: 'name',\n listValueProperty: '_id',\n displayText : 'Select Queue',\n placeholder: 'Select Queue',\n isRequired:true\n }\" (onInput)=\"handleQueueChange($event)\">\n </dropdown>\n </div>\n\n <div class=\"col-12 md:col-6\">\n <dropdown [store]=\"templateStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name: 'dictionaryID',\n displayText: 'Select Dictionary',\n listLabelProperty: 'name',\n listValueProperty: '_id',\n placeholder: 'Select Dictionary',\n options: dictionaries\n }\" (onInput)=\"handleDictionarySelect($event)\">\n </dropdown>\n </div>\n </div>\n\n <div class=\"col-12 md:col-12 flex px-0\">\n <div *ngIf=\"record.type === 'email'\" class=\"col-12 md:col-6\">\n <text-box [store]=\"templateStore\" [record]=\"record\" [attributeModel]=\"{\n readonly: false,\n name: 'subject',\n isRequired: true,\n displayText: 'Subject',\n placeholder: 'Enter Subject'\n }\"></text-box>\n </div>\n\n <div class=\"col-12 md:col-6\">\n <dropdown [store]=\"templateStore\" [isStaticDropdown]=\"true\" [record]=\"record\" [attributeModel]=\"{\n name: 'dictionaryItemID',\n displayText: 'Select Dictionary Item',\n listLabelProperty: 'itemName',\n listValueProperty: '_id',\n placeholder: 'Select Dictionary Item',\n options: dictionaryItems\n }\">\n </dropdown>\n </div>\n </div>\n\n <div class=\"col-12 md:col-12\">\n <label>Message</label>\n <span class=\"asterisk ml-1\">*</span>\n <quill-editor [(ngModel)]=\"messageContent\" class=\"w-full mt-2\"></quill-editor>\n <div *ngIf=\"isFormSubmitted && !messageContent\" class=\"error-message\">\n <small class=\"p-error\">Message is required</small>\n </div>\n </div>\n </div>\n</form-container>", styles: [".asterisk{color:red}\n"] }]
|
|
5237
5237
|
}], ctorParameters: () => [{ type: TemplateAdminService }, { type: ValidatorService }, { type: i3$4.Router }, { type: i3$4.ActivatedRoute }, { type: TemplateAdminQuery }, { type: TemplateAdminStore }, { type: BaseStore }, { type: BaseQuery }] });
|
|
5238
5238
|
|
|
5239
5239
|
class TemplateAdminListComponent extends BaseListComponent {
|
|
@@ -5259,11 +5259,11 @@ class TemplateAdminListComponent extends BaseListComponent {
|
|
|
5259
5259
|
this.baseStore.setSelectedTemplate(this.activeTabIndex === 0 ? SHARED.EMPTY : this.selectedType);
|
|
5260
5260
|
}
|
|
5261
5261
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TemplateAdminListComponent, deps: [{ token: TemplateAdminService }, { token: TableBuilder }, { token: BaseStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
5262
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: TemplateAdminListComponent, isStandalone: false, selector: "lib-template-admin-list", usesInheritance: true, ngImport: i0, template: "<div class=\"template-tab-wrapper\">\
|
|
5262
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: TemplateAdminListComponent, isStandalone: false, selector: "lib-template-admin-list", usesInheritance: true, ngImport: i0, template: "<div class=\"template-tab-wrapper\">\n <p-tabView class=\"application-tabs-wrapper h-full\" [(activeIndex)]=\"activeTabIndex\" (onChange)=\"onTabChange($event)\">\n <p-tabPanel>\n <ng-template pTemplate=\"header\">\n <span class=\"font-semibold\">All Templates</span>\n </ng-template>\n </p-tabPanel>\n \n <p-tabPanel>\n <ng-template pTemplate=\"header\">\n <div class=\"flex align-items-center font-semibold\">\n <i class=\"pi pi-envelope mr-3 message-type-wrapper\"></i>\n <span class=\"mr-1\">Email</span>\n </div>\n </ng-template>\n </p-tabPanel>\n \n <p-tabPanel>\n <ng-template pTemplate=\"header\">\n <div class=\"flex align-items-center font-semibold\">\n <i class=\"pi pi-comment mr-3 message-type-wrapper\"></i>\n <span>SMS</span>\n </div>\n </ng-template>\n </p-tabPanel>\n\n <p-tabPanel>\n <ng-template pTemplate=\"header\">\n <div class=\"flex align-items-center font-semibold\">\n <i class=\"pi pi-whatsapp mr-3 message-type-wrapper\"></i>\n <span>WhatsApp</span>\n </div>\n </ng-template>\n </p-tabPanel>\n </p-tabView>\n</div>\n\n@if(table){\n <lib-table-primary [table]=\"table\" [pathName]=\"pathName\" [metaData]=\"metaData\">\n </lib-table-primary>\n}", styles: ["::ng-deep .application-tabs-wrapper .p-tabview{height:100%}::ng-deep .application-tabs-wrapper .p-tabview-panels{height:calc(100% - 64px);padding-bottom:0}::ng-deep .application-tabs-wrapper .p-tabview-panel{height:100%}::ng-deep .application-tabs-wrapper .p-tabview-nav-content .p-tabview-nav li{width:15%;margin-bottom:2px}::ng-deep .application-tabs-wrapper .p-tabview-nav-content .p-tabview-nav a{justify-content:center}.message-type-wrapper{font-size:16px}\n"], dependencies: [{ kind: "component", type: TablePrimaryComponent, selector: "lib-table-primary", inputs: ["table", "metaData", "title", "showStatus", "showActions", "showSearchBar", "showNewRecordButton", "showRefreshButton", "pathName"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5$3.TabView, selector: "p-tabView", inputs: ["style", "styleClass", "controlClose", "scrollable", "activeIndex", "selectOnFocus", "nextButtonAriaLabel", "prevButtonAriaLabel", "autoHideButtons", "tabindex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i5$3.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }] });
|
|
5263
5263
|
}
|
|
5264
5264
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TemplateAdminListComponent, decorators: [{
|
|
5265
5265
|
type: Component,
|
|
5266
|
-
args: [{ selector: 'lib-template-admin-list', standalone: false, template: "<div class=\"template-tab-wrapper\">\
|
|
5266
|
+
args: [{ selector: 'lib-template-admin-list', standalone: false, template: "<div class=\"template-tab-wrapper\">\n <p-tabView class=\"application-tabs-wrapper h-full\" [(activeIndex)]=\"activeTabIndex\" (onChange)=\"onTabChange($event)\">\n <p-tabPanel>\n <ng-template pTemplate=\"header\">\n <span class=\"font-semibold\">All Templates</span>\n </ng-template>\n </p-tabPanel>\n \n <p-tabPanel>\n <ng-template pTemplate=\"header\">\n <div class=\"flex align-items-center font-semibold\">\n <i class=\"pi pi-envelope mr-3 message-type-wrapper\"></i>\n <span class=\"mr-1\">Email</span>\n </div>\n </ng-template>\n </p-tabPanel>\n \n <p-tabPanel>\n <ng-template pTemplate=\"header\">\n <div class=\"flex align-items-center font-semibold\">\n <i class=\"pi pi-comment mr-3 message-type-wrapper\"></i>\n <span>SMS</span>\n </div>\n </ng-template>\n </p-tabPanel>\n\n <p-tabPanel>\n <ng-template pTemplate=\"header\">\n <div class=\"flex align-items-center font-semibold\">\n <i class=\"pi pi-whatsapp mr-3 message-type-wrapper\"></i>\n <span>WhatsApp</span>\n </div>\n </ng-template>\n </p-tabPanel>\n </p-tabView>\n</div>\n\n@if(table){\n <lib-table-primary [table]=\"table\" [pathName]=\"pathName\" [metaData]=\"metaData\">\n </lib-table-primary>\n}", styles: ["::ng-deep .application-tabs-wrapper .p-tabview{height:100%}::ng-deep .application-tabs-wrapper .p-tabview-panels{height:calc(100% - 64px);padding-bottom:0}::ng-deep .application-tabs-wrapper .p-tabview-panel{height:100%}::ng-deep .application-tabs-wrapper .p-tabview-nav-content .p-tabview-nav li{width:15%;margin-bottom:2px}::ng-deep .application-tabs-wrapper .p-tabview-nav-content .p-tabview-nav a{justify-content:center}.message-type-wrapper{font-size:16px}\n"] }]
|
|
5267
5267
|
}], ctorParameters: () => [{ type: TemplateAdminService }, { type: TableBuilder }, { type: BaseStore }] });
|
|
5268
5268
|
|
|
5269
5269
|
class TemplateAdminModule {
|
|
@@ -5627,11 +5627,11 @@ class WidgetHeaderComponent {
|
|
|
5627
5627
|
}
|
|
5628
5628
|
}
|
|
5629
5629
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetHeaderComponent, deps: [{ token: StyleBuilderService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5630
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetHeaderComponent, isStandalone: false, selector: "lib-widget-header", inputs: { widget: "widget" }, usesOnChanges: true, ngImport: i0, template: "@if (widget.header || widget.subHeader) {\
|
|
5630
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetHeaderComponent, isStandalone: false, selector: "lib-widget-header", inputs: { widget: "widget" }, usesOnChanges: true, ngImport: i0, template: "@if (widget.header || widget.subHeader) {\n<div class=\"grid m-0 align-items-center justify-content-between px-3 pt-3\">\n <div class=\"col-12 p-0\">\n <div class=\"flex align-items-center justify-content-between\">\n <div class=\"flex align-items-center\">\n <i [class]=\"headerIconClass\" [ngStyle]=\"headerIconStyle\"></i>\n <h3 [ngStyle]=\"headerStyle\" class=\"m-0 application-title-wrapper\">\n {{ (widget.header) }}\n </h3>\n\n <!-- Badges -->\n @if (processedBadges && processedBadges.length > 0) {\n <div class=\"flex align-items-center gap-1 ml-2\">\n @for (badge of processedBadges; track $index) {\n @if (badge.value && badge.value !== 'null') {\n <span class=\"px-2 py-1 rounded font-semibold badge\"\n [ngClass]=\"badge.valueClass\"\n [ngStyle]=\"badge.badgeStyle\">\n @if (badge.valueIconClass) {\n <i [ngClass]=\"badge.valueIconClass\" \n [ngStyle]=\"badge.mergedValueIconStyle\"\n class=\"mr-1\"></i>\n }\n @if (badge.valueIconClassExpression) {\n <i [ngClass]=\"badge.valueIconClassExpression\" \n [ngStyle]=\"badge.mergedValueIconStyle\"\n class=\"mr-1\"></i>\n }\n {{ badge.value }}\n </span>\n }\n }\n </div>\n }\n </div>\n\n <!-- Widget Status Icon -->\n <div class=\"flex align-items-center\">\n @if (widgetStatusIconClass) {\n <i [ngClass]=\"widgetStatusIconClass\" [ngStyle]=\"mergedWidgetStatusIconStyle\"></i>\n }\n @if (widgetStatusIconClassExpression) {\n <i [ngClass]=\"widgetStatusIconClassExpression\" [ngStyle]=\"mergedWidgetStatusIconStyle\"></i>\n }\n </div>\n </div>\n @if (widget?.subHeader) {\n <div class=\"flex align-items-center mt-2\">\n <span [ngStyle]=\"subHeaderStyle\" class=\"mr-3 font-semibold\">{{ widget.subHeader }}</span>\n </div>\n }\n </div>\n</div>\n}", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}.application-title-wrapper{font-size:16px;font-weight:600}.chart-container{display:flex;flex-direction:column;align-items:center;justify-content:center}@media screen and (min-width: 1200px) and (max-width: 1800px){.application-title-wrapper{font-size:14px}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5631
5631
|
}
|
|
5632
5632
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetHeaderComponent, decorators: [{
|
|
5633
5633
|
type: Component,
|
|
5634
|
-
args: [{ selector: 'lib-widget-header', standalone: false, template: "@if (widget.header || widget.subHeader) {\
|
|
5634
|
+
args: [{ selector: 'lib-widget-header', standalone: false, template: "@if (widget.header || widget.subHeader) {\n<div class=\"grid m-0 align-items-center justify-content-between px-3 pt-3\">\n <div class=\"col-12 p-0\">\n <div class=\"flex align-items-center justify-content-between\">\n <div class=\"flex align-items-center\">\n <i [class]=\"headerIconClass\" [ngStyle]=\"headerIconStyle\"></i>\n <h3 [ngStyle]=\"headerStyle\" class=\"m-0 application-title-wrapper\">\n {{ (widget.header) }}\n </h3>\n\n <!-- Badges -->\n @if (processedBadges && processedBadges.length > 0) {\n <div class=\"flex align-items-center gap-1 ml-2\">\n @for (badge of processedBadges; track $index) {\n @if (badge.value && badge.value !== 'null') {\n <span class=\"px-2 py-1 rounded font-semibold badge\"\n [ngClass]=\"badge.valueClass\"\n [ngStyle]=\"badge.badgeStyle\">\n @if (badge.valueIconClass) {\n <i [ngClass]=\"badge.valueIconClass\" \n [ngStyle]=\"badge.mergedValueIconStyle\"\n class=\"mr-1\"></i>\n }\n @if (badge.valueIconClassExpression) {\n <i [ngClass]=\"badge.valueIconClassExpression\" \n [ngStyle]=\"badge.mergedValueIconStyle\"\n class=\"mr-1\"></i>\n }\n {{ badge.value }}\n </span>\n }\n }\n </div>\n }\n </div>\n\n <!-- Widget Status Icon -->\n <div class=\"flex align-items-center\">\n @if (widgetStatusIconClass) {\n <i [ngClass]=\"widgetStatusIconClass\" [ngStyle]=\"mergedWidgetStatusIconStyle\"></i>\n }\n @if (widgetStatusIconClassExpression) {\n <i [ngClass]=\"widgetStatusIconClassExpression\" [ngStyle]=\"mergedWidgetStatusIconStyle\"></i>\n }\n </div>\n </div>\n @if (widget?.subHeader) {\n <div class=\"flex align-items-center mt-2\">\n <span [ngStyle]=\"subHeaderStyle\" class=\"mr-3 font-semibold\">{{ widget.subHeader }}</span>\n </div>\n }\n </div>\n</div>\n}", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}.application-title-wrapper{font-size:16px;font-weight:600}.chart-container{display:flex;flex-direction:column;align-items:center;justify-content:center}@media screen and (min-width: 1200px) and (max-width: 1800px){.application-title-wrapper{font-size:14px}}\n"] }]
|
|
5635
5635
|
}], ctorParameters: () => [{ type: StyleBuilderService }], propDecorators: { widget: [{
|
|
5636
5636
|
type: Input
|
|
5637
5637
|
}] } });
|
|
@@ -5652,11 +5652,11 @@ class WidgetFooterComponent {
|
|
|
5652
5652
|
}
|
|
5653
5653
|
}
|
|
5654
5654
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetFooterComponent, deps: [{ token: WidgetStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
5655
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetFooterComponent, isStandalone: false, selector: "lib-widget-footer", inputs: { widget: "widget" }, ngImport: i0, template: "<div *ngIf=\"widget.isFormEnabled\" class=\"col-12 p-0 mt-3 flex justify-content-center\">\
|
|
5655
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetFooterComponent, isStandalone: false, selector: "lib-widget-footer", inputs: { widget: "widget" }, ngImport: i0, template: "<div *ngIf=\"widget.isFormEnabled\" class=\"col-12 p-0 mt-3 flex justify-content-center\">\n <a class=\"p-button p-button-link text-primary-500\">\n @if(widget.isFormEnabled){\n <span class=\"underline font-semibold\" [permission]=\"PERMISSION.WIDGETS_EVALUATE\"\n (click)=\"viewAllDetails($event)\">View\n All Details</span>\n <i class=\"pi pi-arrow-up-right arrow-up-icon ml-2\"></i>\n }\n </a>\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: HasPermissionDirective, selector: "[permission]", inputs: ["permission"] }] });
|
|
5656
5656
|
}
|
|
5657
5657
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetFooterComponent, decorators: [{
|
|
5658
5658
|
type: Component,
|
|
5659
|
-
args: [{ selector: 'lib-widget-footer', standalone: false, template: "<div *ngIf=\"widget.isFormEnabled\" class=\"col-12 p-0 mt-3 flex justify-content-center\">\
|
|
5659
|
+
args: [{ selector: 'lib-widget-footer', standalone: false, template: "<div *ngIf=\"widget.isFormEnabled\" class=\"col-12 p-0 mt-3 flex justify-content-center\">\n <a class=\"p-button p-button-link text-primary-500\">\n @if(widget.isFormEnabled){\n <span class=\"underline font-semibold\" [permission]=\"PERMISSION.WIDGETS_EVALUATE\"\n (click)=\"viewAllDetails($event)\">View\n All Details</span>\n <i class=\"pi pi-arrow-up-right arrow-up-icon ml-2\"></i>\n }\n </a>\n</div>" }]
|
|
5660
5660
|
}], ctorParameters: () => [{ type: WidgetStore }], propDecorators: { widget: [{
|
|
5661
5661
|
type: Input
|
|
5662
5662
|
}] } });
|
|
@@ -5854,11 +5854,11 @@ class WidgetItemComponent {
|
|
|
5854
5854
|
return value;
|
|
5855
5855
|
}
|
|
5856
5856
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetItemComponent, deps: [{ token: StyleBuilderService }, { token: WidgetStore }, { token: WidgetQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
5857
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetItemComponent, isStandalone: false, selector: "lib-widget-item", inputs: { widgetItem: "widgetItem", widget: "widget", application: "application" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-container px-3 overflow-hidden\" *ngIf=\"shouldShowItem\">\
|
|
5857
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetItemComponent, isStandalone: false, selector: "lib-widget-item", inputs: { widgetItem: "widgetItem", widget: "widget", application: "application" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-container px-3 overflow-hidden\" *ngIf=\"shouldShowItem\">\n <div class=\"widget-content widget-wrapper\" [class.border-top]=\"hasSeparator\" [ngClass]=\"{\n 'layout-row': widget.layoutType === 'row',\n 'layout-tile m-0': widget.layoutType === 'tile'\n }\">\n <div class=\"flex align-items-center justify-content-between\"\n [ngClass]=\"widget.layoutType === 'row' ? 'w-7' : 'w-full'\">\n <div class=\"flex align-items-center\">\n <i *ngIf=\"keyIconClass\" class=\"mr-2\" [ngClass]=\"keyIconClass\" [ngStyle]=\"keyIconStyle\"></i>\n <p *ngIf=\"!isMenu\" [ngClass]=\"keyClass\" [ngStyle]=\"fieldKeyStyle\" class=\"mb-0 mr-3 key-field-wrapper\">{{ widgetKey }}</p>\n <p *ngIf=\"isMenu\" [ngClass]=\"keyClass\" [ngStyle]=\"fieldKeyStyle\" (click)=\"handleDynamicEvent(widget.recordId)\"\n class=\"mb-0 mr-3 key-field-wrapper\">{{ widgetKey }}</p>\n </div>\n <div class=\"flex justify-content-end\" *ngIf=\"isConfirmed\">\n <img src=\"assets/icons/confirm-icon.svg\" alt=\"confirm icon\" width=\"18\" height=\"18\" />\n </div>\n </div>\n\n <div class=\"mb-0 text-color font-semibold text-value-wrapper w-full\" \n [ngClass]=\"widget.layoutType === 'row' ? 'flex align-items-center justify-content-end w-5': 'w-full'\">\n <i *ngIf=\"valueIconClass\" [ngClass]=\"valueIconClass\" [ngStyle]=\"mergedValueIconStyle\"></i>\n <i *ngIf=\"valueIconClassExpression\" [ngClass]=\"valueIconClassExpression\" [ngStyle]=\"mergedValueIconStyle\"></i>\n <ng-container *ngIf=\"widgetItem.isEvent; else notEvent\">\n <a class=\"cursor-pointer key-field-wrapper\" [ngClass]=\"valueClass\" [ngStyle]=\"mergedValueStyle\"\n (click)=\"handleDynamicEvent(widget.recordId)\">\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\n </a>\n </ng-container>\n\n <ng-template #notEvent>\n <ng-container *ngIf=\"widgetItem.isLink; else plainText\">\n <a class=\"cursor-pointer key-field-wrapper\" [ngClass]=\"valueClass\" [ngStyle]=\"mergedValueStyle\"\n (click)=\"handleWidgetItemClick(widgetItem)\">\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\n </a>\n </ng-container>\n </ng-template>\n\n <ng-template #plainText>\n @if(widgetItem.isHtml && hasHtmlContentValue) {\n <div class=\"key-field-wrapper\" [innerHTML]=\"widgetItem.value !== 'null' ? widgetItem.value : ''\"\n [ngClass]=\"valueClass\" [ngStyle]=\"mergedValueStyle\"></div>\n }\n @else if(!widgetItem.isHtml) {\n <p class=\"mb-0\" [ngClass]=\"valueClass\" [ngStyle]=\"mergedValueStyle\">\n\n <ng-container *ngIf=\"isDateValue; else normalText\">\n {{ formattedDateValue }}\n </ng-container>\n <ng-template #normalText>\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\n </ng-template>\n </p>\n }\n </ng-template>\n </div>\n </div>\n</div>", styles: [".text-value-wrapper{-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%}.key-field-wrapper{-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;white-space:normal;box-sizing:border-box;color:#4b5563}.w-50{width:50%!important}.map-icon-wrapper{font-size:16px;padding:13px;border-radius:30px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.address-title-wrapper{width:80%;word-break:break-word;margin-top:-12px}.border-top{border-top:1px solid rgba(76,98,146,.1)}.key-title-wrapper{width:100%}.widget-wrapper{padding:6px 0}.widget-content.layout-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:.5rem}.widget-content.layout-tile{display:grid;grid-template-columns:1fr;grid-auto-rows:auto;row-gap:.5rem;align-items:start;margin:0}\n"], dependencies: [{ 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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5858
5858
|
}
|
|
5859
5859
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetItemComponent, decorators: [{
|
|
5860
5860
|
type: Component,
|
|
5861
|
-
args: [{ selector: 'lib-widget-item', standalone: false, template: "<div class=\"widget-container px-3 overflow-hidden\" *ngIf=\"shouldShowItem\">\
|
|
5861
|
+
args: [{ selector: 'lib-widget-item', standalone: false, template: "<div class=\"widget-container px-3 overflow-hidden\" *ngIf=\"shouldShowItem\">\n <div class=\"widget-content widget-wrapper\" [class.border-top]=\"hasSeparator\" [ngClass]=\"{\n 'layout-row': widget.layoutType === 'row',\n 'layout-tile m-0': widget.layoutType === 'tile'\n }\">\n <div class=\"flex align-items-center justify-content-between\"\n [ngClass]=\"widget.layoutType === 'row' ? 'w-7' : 'w-full'\">\n <div class=\"flex align-items-center\">\n <i *ngIf=\"keyIconClass\" class=\"mr-2\" [ngClass]=\"keyIconClass\" [ngStyle]=\"keyIconStyle\"></i>\n <p *ngIf=\"!isMenu\" [ngClass]=\"keyClass\" [ngStyle]=\"fieldKeyStyle\" class=\"mb-0 mr-3 key-field-wrapper\">{{ widgetKey }}</p>\n <p *ngIf=\"isMenu\" [ngClass]=\"keyClass\" [ngStyle]=\"fieldKeyStyle\" (click)=\"handleDynamicEvent(widget.recordId)\"\n class=\"mb-0 mr-3 key-field-wrapper\">{{ widgetKey }}</p>\n </div>\n <div class=\"flex justify-content-end\" *ngIf=\"isConfirmed\">\n <img src=\"assets/icons/confirm-icon.svg\" alt=\"confirm icon\" width=\"18\" height=\"18\" />\n </div>\n </div>\n\n <div class=\"mb-0 text-color font-semibold text-value-wrapper w-full\" \n [ngClass]=\"widget.layoutType === 'row' ? 'flex align-items-center justify-content-end w-5': 'w-full'\">\n <i *ngIf=\"valueIconClass\" [ngClass]=\"valueIconClass\" [ngStyle]=\"mergedValueIconStyle\"></i>\n <i *ngIf=\"valueIconClassExpression\" [ngClass]=\"valueIconClassExpression\" [ngStyle]=\"mergedValueIconStyle\"></i>\n <ng-container *ngIf=\"widgetItem.isEvent; else notEvent\">\n <a class=\"cursor-pointer key-field-wrapper\" [ngClass]=\"valueClass\" [ngStyle]=\"mergedValueStyle\"\n (click)=\"handleDynamicEvent(widget.recordId)\">\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\n </a>\n </ng-container>\n\n <ng-template #notEvent>\n <ng-container *ngIf=\"widgetItem.isLink; else plainText\">\n <a class=\"cursor-pointer key-field-wrapper\" [ngClass]=\"valueClass\" [ngStyle]=\"mergedValueStyle\"\n (click)=\"handleWidgetItemClick(widgetItem)\">\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\n </a>\n </ng-container>\n </ng-template>\n\n <ng-template #plainText>\n @if(widgetItem.isHtml && hasHtmlContentValue) {\n <div class=\"key-field-wrapper\" [innerHTML]=\"widgetItem.value !== 'null' ? widgetItem.value : ''\"\n [ngClass]=\"valueClass\" [ngStyle]=\"mergedValueStyle\"></div>\n }\n @else if(!widgetItem.isHtml) {\n <p class=\"mb-0\" [ngClass]=\"valueClass\" [ngStyle]=\"mergedValueStyle\">\n\n <ng-container *ngIf=\"isDateValue; else normalText\">\n {{ formattedDateValue }}\n </ng-container>\n <ng-template #normalText>\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\n </ng-template>\n </p>\n }\n </ng-template>\n </div>\n </div>\n</div>", styles: [".text-value-wrapper{-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%}.key-field-wrapper{-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;white-space:normal;box-sizing:border-box;color:#4b5563}.w-50{width:50%!important}.map-icon-wrapper{font-size:16px;padding:13px;border-radius:30px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.address-title-wrapper{width:80%;word-break:break-word;margin-top:-12px}.border-top{border-top:1px solid rgba(76,98,146,.1)}.key-title-wrapper{width:100%}.widget-wrapper{padding:6px 0}.widget-content.layout-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:.5rem}.widget-content.layout-tile{display:grid;grid-template-columns:1fr;grid-auto-rows:auto;row-gap:.5rem;align-items:start;margin:0}\n"] }]
|
|
5862
5862
|
}], ctorParameters: () => [{ type: StyleBuilderService }, { type: WidgetStore }, { type: WidgetQuery }], propDecorators: { widgetItem: [{
|
|
5863
5863
|
type: Input
|
|
5864
5864
|
}], widget: [{
|
|
@@ -5892,11 +5892,11 @@ class WidgetBodyComponent {
|
|
|
5892
5892
|
}
|
|
5893
5893
|
}
|
|
5894
5894
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetBodyComponent, deps: [{ token: StyleBuilderService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5895
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetBodyComponent, isStandalone: false, selector: "lib-widget-body", inputs: { widget: "widget" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-body-container grid m-0\">\
|
|
5895
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetBodyComponent, isStandalone: false, selector: "lib-widget-body", inputs: { widget: "widget" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-body-container grid m-0\">\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\" [ngClass]=\"[widget.style.width, widget.style.width === 'col-12' ? 'p-0' : '']\">\n @if(!dataItem.isHidden){\n <div class=\"h-full\" [ngStyle]=\"widgetItemStyle[i]\" \n [ngClass]=\"{\n 'widget-confirm-wrapper': isConfirmed[i]\n }\">\n <div>\n <lib-widget-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-item>\n </div>\n </div>\n }\n </div>\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-confirm-wrapper{background-color:#e8fbee!important;border:1px solid #22C55E!important}.vulnerability-title-wrapper{background:#fb392d36}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: WidgetItemComponent, selector: "lib-widget-item", inputs: ["widgetItem", "widget", "application"] }] });
|
|
5896
5896
|
}
|
|
5897
5897
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetBodyComponent, decorators: [{
|
|
5898
5898
|
type: Component,
|
|
5899
|
-
args: [{ selector: 'lib-widget-body', standalone: false, template: "<div class=\"widget-body-container grid m-0\">\
|
|
5899
|
+
args: [{ selector: 'lib-widget-body', standalone: false, template: "<div class=\"widget-body-container grid m-0\">\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\" [ngClass]=\"[widget.style.width, widget.style.width === 'col-12' ? 'p-0' : '']\">\n @if(!dataItem.isHidden){\n <div class=\"h-full\" [ngStyle]=\"widgetItemStyle[i]\" \n [ngClass]=\"{\n 'widget-confirm-wrapper': isConfirmed[i]\n }\">\n <div>\n <lib-widget-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-item>\n </div>\n </div>\n }\n </div>\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-confirm-wrapper{background-color:#e8fbee!important;border:1px solid #22C55E!important}.vulnerability-title-wrapper{background:#fb392d36}\n"] }]
|
|
5900
5900
|
}], ctorParameters: () => [{ type: StyleBuilderService }], propDecorators: { widget: [{
|
|
5901
5901
|
type: Input
|
|
5902
5902
|
}] } });
|
|
@@ -5923,11 +5923,11 @@ class WidgetMainComponent {
|
|
|
5923
5923
|
}
|
|
5924
5924
|
}
|
|
5925
5925
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMainComponent, deps: [{ token: StyleBuilderService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5926
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetMainComponent, isStandalone: false, selector: "lib-widget-main", inputs: { widget: "widget", index: "index", isFullHeight: "isFullHeight" }, usesOnChanges: true, ngImport: i0, template: "<div [ngStyle]=\"widgetCombinedStyle\" class=\"widget-container-wrapper h-full\" [ngClass]=\"{'h-full': isFullHeight, 'mt-4': index !== 0}\">\
|
|
5926
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetMainComponent, isStandalone: false, selector: "lib-widget-main", inputs: { widget: "widget", index: "index", isFullHeight: "isFullHeight" }, usesOnChanges: true, ngImport: i0, template: "<div [ngStyle]=\"widgetCombinedStyle\" class=\"widget-container-wrapper h-full\" [ngClass]=\"{'h-full': isFullHeight, 'mt-4': index !== 0}\">\n <div class=\"widget-container-wrapper\">\n <lib-widget-header [widget]=\"widget\"></lib-widget-header>\n <div [ngClass]=\"[(widget.header || widget.subHeader) ? 'widget-content-wrapper' : '', widget.style.width === 'col-6' ? 'px-2' : '']\" class=\"py-3\">\n <lib-widget-body [widget]=\"widget\"></lib-widget-body>\n <lib-widget-footer [widget]=\"widget\"></lib-widget-footer>\n </div>\n </div>\n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}::ng-deep .refresh-btn-wrapper .p-button{padding:0}::ng-deep .valuation-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .rating-badge-wrapper .p-button{display:flex;align-items:center}::ng-deep .widget-block-wrapper{height:100%}::ng-deep .widget-block-wrapper .p-card{height:100%;background-color:var(--surface-0);border-radius:10px;box-shadow:none}::ng-deep .widget-block-wrapper .p-card-body{padding:0;height:100%}::ng-deep .widget-block-wrapper .p-card-content{padding:0;height:100%}.application-title-wrapper{font-size:18px;font-weight:400}.application-section-wrapper{background-color:#4c629208;border:1px solid rgba(76,98,146,.1);border-radius:10px}.widget-section-wrapper{height:100%}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}.widget-menu-container{border-radius:10px}:host ::-webkit-scrollbar{width:7px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n", ""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: WidgetHeaderComponent, selector: "lib-widget-header", inputs: ["widget"] }, { kind: "component", type: WidgetFooterComponent, selector: "lib-widget-footer", inputs: ["widget"] }, { kind: "component", type: WidgetBodyComponent, selector: "lib-widget-body", inputs: ["widget"] }] });
|
|
5927
5927
|
}
|
|
5928
5928
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMainComponent, decorators: [{
|
|
5929
5929
|
type: Component,
|
|
5930
|
-
args: [{ selector: 'lib-widget-main', standalone: false, template: "<div [ngStyle]=\"widgetCombinedStyle\" class=\"widget-container-wrapper h-full\" [ngClass]=\"{'h-full': isFullHeight, 'mt-4': index !== 0}\">\
|
|
5930
|
+
args: [{ selector: 'lib-widget-main', standalone: false, template: "<div [ngStyle]=\"widgetCombinedStyle\" class=\"widget-container-wrapper h-full\" [ngClass]=\"{'h-full': isFullHeight, 'mt-4': index !== 0}\">\n <div class=\"widget-container-wrapper\">\n <lib-widget-header [widget]=\"widget\"></lib-widget-header>\n <div [ngClass]=\"[(widget.header || widget.subHeader) ? 'widget-content-wrapper' : '', widget.style.width === 'col-6' ? 'px-2' : '']\" class=\"py-3\">\n <lib-widget-body [widget]=\"widget\"></lib-widget-body>\n <lib-widget-footer [widget]=\"widget\"></lib-widget-footer>\n </div>\n </div>\n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}::ng-deep .refresh-btn-wrapper .p-button{padding:0}::ng-deep .valuation-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .rating-badge-wrapper .p-button{display:flex;align-items:center}::ng-deep .widget-block-wrapper{height:100%}::ng-deep .widget-block-wrapper .p-card{height:100%;background-color:var(--surface-0);border-radius:10px;box-shadow:none}::ng-deep .widget-block-wrapper .p-card-body{padding:0;height:100%}::ng-deep .widget-block-wrapper .p-card-content{padding:0;height:100%}.application-title-wrapper{font-size:18px;font-weight:400}.application-section-wrapper{background-color:#4c629208;border:1px solid rgba(76,98,146,.1);border-radius:10px}.widget-section-wrapper{height:100%}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}.widget-menu-container{border-radius:10px}:host ::-webkit-scrollbar{width:7px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n"] }]
|
|
5931
5931
|
}], ctorParameters: () => [{ type: StyleBuilderService }], propDecorators: { widget: [{
|
|
5932
5932
|
type: Input
|
|
5933
5933
|
}], index: [{
|
|
@@ -5981,11 +5981,11 @@ class CustomWidgetComponent {
|
|
|
5981
5981
|
return this.widgetUtilService.getEventIndex(event, this.widgetData);
|
|
5982
5982
|
}
|
|
5983
5983
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CustomWidgetComponent, deps: [{ token: CustomWidgetService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5984
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CustomWidgetComponent, isStandalone: false, selector: "lib-custom-widget", inputs: { widgetData: "widgetData" }, ngImport: i0, template: "@if(widgetData){\
|
|
5984
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CustomWidgetComponent, isStandalone: false, selector: "lib-custom-widget", inputs: { widgetData: "widgetData" }, ngImport: i0, template: "@if(widgetData){\n<div class=\"custom-widget\">\n\n <div class=\" ml-3\" style=\"display: flex; flex-direction: row; align-items: center;\">\n <h3 class=\"mb-0 font-bold mr-3 widgetData-title-wrapper\">\n {{ (widgetData.title) }}\n </h3>\n \n <span class=\"px-2 py-1 rounded text-white font-semibold badge\" [ngClass]=\"{\n 'bg-yellow-500': widgetData.badge === 'Pending',\n 'bg-green-500': widgetData.badge === 'Verified'\n }\">\n <i class=\"{{ widgetData.badgeIcon }}\"></i> {{ widgetData.badge }}\n </span>\n \n </div>\n <div class=\"widget-body-wrapper\">\n\n <p-timeline class=\"widget-timeline-wrapper\" [value]=\"widgetData?.statusList\">\n <ng-template pTemplate=\"marker\" let-event let-i=\"index\">\n <div class=\"p-timeline-event-marker\" [ngStyle]=\"{\n 'background-color': event.status === 'active' ? '#0F8BFD' :\n event.status === 'pending' ? '#676B89' :\n event.status === 'removed' ? '#FF0000' :\n '#0F8BFD',\n 'border-color': event.status === 'active' ? '#0F8BFD' :\n event.status === 'pending' ? '#676B89' :\n event.status === 'removed' ? '#FF0000' :\n '#0F8BFD',\n 'outline': event.status === 'active' ? '4px solid #0f8bfd33' :\n event.status === 'pending' ? '4px solid #676b8933' :\n event.status === 'removed' ? '4px solid #FF0000' :\n '4px solid #0F8BFD',\n }\"></div>\n\n <div class=\"p-timeline-event-connector-border\" *ngIf=\"!isLastIndex(event)\" [ngStyle]=\"{\n border:\n getNextEventStatus(event) === 'active'\n ? '2px solid #0F8BFD'\n : getNextEventStatus(event) === 'pending'\n ? '2px solid #44486d33'\n : getNextEventStatus(event) === 'removed'\n ? '2px solid #FF0000'\n : '2px solid #0F8BFD',\n height: 'calc(100% - 18px)'\n }\"></div>\n </ng-template>\n\n <ng-template pTemplate=\"content\" let-event>\n <div class=\"p-timeline-event-content mb-2\"\n [ngClass]=\"{ 'mb-4': widgetData.title === 'Valuation' && event.title }\">\n\n <p *ngIf=\"!(widgetData.title === 'Valuation') && event.title\" class=\"event-title mb-2\"\n [innerHTML]=\"event.title\">\n </p>\n\n <p *ngIf=\"widgetData.title === 'Valuation' && event.title\" class=\"event-title mb-2\">\n <span style=\"color: #0f8bfd; text-decoration: underline; font-weight: bold\">{{ event.title?.split(' ')[0]\n }}</span>\n {{ event.title?.substring(event.title.indexOf(' ') + 1) }}\n </p>\n \n <span class=\"font-medium event-description\" [ngClass]=\"{ 'font-bold': event.textColor }\"\n [ngStyle]=\"{ color: event.textColor }\" [innerHTML]=\"event.description\"></span>\n </div>\n </ng-template>\n </p-timeline>\n </div>\n</div>\n\n}", styles: [".custom-widget{margin-top:21px}::ng-deep .widget-timeline-wrapper{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#f9fafb}::ng-deep .widget-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .p-timeline-event{min-height:50px!important}::ng-deep .p-timeline-event:last-child{min-height:30px!important}.widgetData-title-wrapper{font-size:18px;font-weight:400}.badge{display:flex;align-items:center;gap:5px;padding:5px 10px;border-radius:5px;font-size:14px}.widget-body-wrapper{padding:14px;margin-top:14px;margin-bottom:14px}\n"], dependencies: [{ 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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4$3.Timeline, selector: "p-timeline", inputs: ["value", "style", "styleClass", "align", "layout"] }] });
|
|
5985
5985
|
}
|
|
5986
5986
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CustomWidgetComponent, decorators: [{
|
|
5987
5987
|
type: Component,
|
|
5988
|
-
args: [{ selector: "lib-custom-widget", standalone: false, template: "@if(widgetData){\
|
|
5988
|
+
args: [{ selector: "lib-custom-widget", standalone: false, template: "@if(widgetData){\n<div class=\"custom-widget\">\n\n <div class=\" ml-3\" style=\"display: flex; flex-direction: row; align-items: center;\">\n <h3 class=\"mb-0 font-bold mr-3 widgetData-title-wrapper\">\n {{ (widgetData.title) }}\n </h3>\n \n <span class=\"px-2 py-1 rounded text-white font-semibold badge\" [ngClass]=\"{\n 'bg-yellow-500': widgetData.badge === 'Pending',\n 'bg-green-500': widgetData.badge === 'Verified'\n }\">\n <i class=\"{{ widgetData.badgeIcon }}\"></i> {{ widgetData.badge }}\n </span>\n \n </div>\n <div class=\"widget-body-wrapper\">\n\n <p-timeline class=\"widget-timeline-wrapper\" [value]=\"widgetData?.statusList\">\n <ng-template pTemplate=\"marker\" let-event let-i=\"index\">\n <div class=\"p-timeline-event-marker\" [ngStyle]=\"{\n 'background-color': event.status === 'active' ? '#0F8BFD' :\n event.status === 'pending' ? '#676B89' :\n event.status === 'removed' ? '#FF0000' :\n '#0F8BFD',\n 'border-color': event.status === 'active' ? '#0F8BFD' :\n event.status === 'pending' ? '#676B89' :\n event.status === 'removed' ? '#FF0000' :\n '#0F8BFD',\n 'outline': event.status === 'active' ? '4px solid #0f8bfd33' :\n event.status === 'pending' ? '4px solid #676b8933' :\n event.status === 'removed' ? '4px solid #FF0000' :\n '4px solid #0F8BFD',\n }\"></div>\n\n <div class=\"p-timeline-event-connector-border\" *ngIf=\"!isLastIndex(event)\" [ngStyle]=\"{\n border:\n getNextEventStatus(event) === 'active'\n ? '2px solid #0F8BFD'\n : getNextEventStatus(event) === 'pending'\n ? '2px solid #44486d33'\n : getNextEventStatus(event) === 'removed'\n ? '2px solid #FF0000'\n : '2px solid #0F8BFD',\n height: 'calc(100% - 18px)'\n }\"></div>\n </ng-template>\n\n <ng-template pTemplate=\"content\" let-event>\n <div class=\"p-timeline-event-content mb-2\"\n [ngClass]=\"{ 'mb-4': widgetData.title === 'Valuation' && event.title }\">\n\n <p *ngIf=\"!(widgetData.title === 'Valuation') && event.title\" class=\"event-title mb-2\"\n [innerHTML]=\"event.title\">\n </p>\n\n <p *ngIf=\"widgetData.title === 'Valuation' && event.title\" class=\"event-title mb-2\">\n <span style=\"color: #0f8bfd; text-decoration: underline; font-weight: bold\">{{ event.title?.split(' ')[0]\n }}</span>\n {{ event.title?.substring(event.title.indexOf(' ') + 1) }}\n </p>\n \n <span class=\"font-medium event-description\" [ngClass]=\"{ 'font-bold': event.textColor }\"\n [ngStyle]=\"{ color: event.textColor }\" [innerHTML]=\"event.description\"></span>\n </div>\n </ng-template>\n </p-timeline>\n </div>\n</div>\n\n}", styles: [".custom-widget{margin-top:21px}::ng-deep .widget-timeline-wrapper{border-radius:10px;border:1px solid rgba(76,98,146,.1);background:#f9fafb}::ng-deep .widget-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .p-timeline-event{min-height:50px!important}::ng-deep .p-timeline-event:last-child{min-height:30px!important}.widgetData-title-wrapper{font-size:18px;font-weight:400}.badge{display:flex;align-items:center;gap:5px;padding:5px 10px;border-radius:5px;font-size:14px}.widget-body-wrapper{padding:14px;margin-top:14px;margin-bottom:14px}\n"] }]
|
|
5989
5989
|
}], ctorParameters: () => [{ type: CustomWidgetService }], propDecorators: { widgetData: [{
|
|
5990
5990
|
type: Input
|
|
5991
5991
|
}] } });
|
|
@@ -6094,11 +6094,11 @@ class WidgetMenuComponent {
|
|
|
6094
6094
|
this.destroy$.complete();
|
|
6095
6095
|
}
|
|
6096
6096
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMenuComponent, deps: [{ token: WidgetService }, { token: i3$4.ActivatedRoute }, { token: WidgetQuery }, { token: WidgetStore }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
6097
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetMenuComponent, isStandalone: false, selector: "lib-widget-menu", inputs: { isSidebarVisible: "isSidebarVisible", offerWidgetData: "offerWidgetData", valuationWidgetData: "valuationWidgetData" }, outputs: { onViewAllDetails: "onViewAllDetails", onWidgetEventClick: "onWidgetEventClick", onWidgetItemClick: "onWidgetItemClick" }, usesOnChanges: true, ngImport: i0, template: "<p-card class=\"widget-block-wrapper block\">\
|
|
6097
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetMenuComponent, isStandalone: false, selector: "lib-widget-menu", inputs: { isSidebarVisible: "isSidebarVisible", offerWidgetData: "offerWidgetData", valuationWidgetData: "valuationWidgetData" }, outputs: { onViewAllDetails: "onViewAllDetails", onWidgetEventClick: "onWidgetEventClick", onWidgetItemClick: "onWidgetItemClick" }, usesOnChanges: true, ngImport: i0, template: "<p-card class=\"widget-block-wrapper block\">\n <div class=\"widget-section-wrapper custom-scroll pt-2\">\n <!-- Loading state -->\n <ng-container *ngIf=\"isLoading; else widgetContent\">\n <p class=\"text-color ml-3 font-semibold\">Widget configuration loading...</p>\n </ng-container>\n\n <!-- Content after API call -->\n <ng-template #widgetContent>\n <ng-container *ngIf=\"(widgets && widgets.length > 0) || (valuationWidgetData || offerWidgetData); else noWidgets\">\n <ng-container *ngFor=\"let widget of widgets; let i = index\">\n <lib-widget-main [widget]=\"widget\" [index]=\"i\"></lib-widget-main>\n </ng-container>\n <ng-container *ngIf=\"offerWidgetData\">\n <lib-custom-widget [widgetData]=\"offerWidgetData\"></lib-custom-widget>\n </ng-container>\n <ng-container *ngIf=\"valuationWidgetData\">\n <lib-custom-widget [widgetData]=\"valuationWidgetData\"></lib-custom-widget>\n </ng-container>\n </ng-container>\n\n <!-- No widget configured state -->\n <ng-template #noWidgets>\n <p class=\"text-color ml-3 font-semibold\">No Widgets Configured</p>\n </ng-template>\n </ng-template>\n </div>\n</p-card>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}::ng-deep .refresh-btn-wrapper .p-button{padding:0}::ng-deep .valuation-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .rating-badge-wrapper .p-button{display:flex;align-items:center}::ng-deep .widget-block-wrapper{height:100%}::ng-deep .widget-block-wrapper .p-card{height:100%;background-color:var(--surface-0);border-radius:10px;box-shadow:none}::ng-deep .widget-block-wrapper .p-card-body{padding:0;height:100%}::ng-deep .widget-block-wrapper .p-card-content{padding:0;height:100%}.application-title-wrapper{font-size:18px;font-weight:400}.application-section-wrapper{background-color:#4c629208;border:1px solid rgba(76,98,146,.1);border-radius:10px}.widget-section-wrapper{height:100%}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}.widget-menu-container{border-radius:10px}:host ::-webkit-scrollbar{width:7px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n", ""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$1.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: WidgetMainComponent, selector: "lib-widget-main", inputs: ["widget", "index", "isFullHeight"] }, { kind: "component", type: CustomWidgetComponent, selector: "lib-custom-widget", inputs: ["widgetData"] }] });
|
|
6098
6098
|
}
|
|
6099
6099
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMenuComponent, decorators: [{
|
|
6100
6100
|
type: Component,
|
|
6101
|
-
args: [{ selector: 'lib-widget-menu', standalone: false, template: "<p-card class=\"widget-block-wrapper block\">\
|
|
6101
|
+
args: [{ selector: 'lib-widget-menu', standalone: false, template: "<p-card class=\"widget-block-wrapper block\">\n <div class=\"widget-section-wrapper custom-scroll pt-2\">\n <!-- Loading state -->\n <ng-container *ngIf=\"isLoading; else widgetContent\">\n <p class=\"text-color ml-3 font-semibold\">Widget configuration loading...</p>\n </ng-container>\n\n <!-- Content after API call -->\n <ng-template #widgetContent>\n <ng-container *ngIf=\"(widgets && widgets.length > 0) || (valuationWidgetData || offerWidgetData); else noWidgets\">\n <ng-container *ngFor=\"let widget of widgets; let i = index\">\n <lib-widget-main [widget]=\"widget\" [index]=\"i\"></lib-widget-main>\n </ng-container>\n <ng-container *ngIf=\"offerWidgetData\">\n <lib-custom-widget [widgetData]=\"offerWidgetData\"></lib-custom-widget>\n </ng-container>\n <ng-container *ngIf=\"valuationWidgetData\">\n <lib-custom-widget [widgetData]=\"valuationWidgetData\"></lib-custom-widget>\n </ng-container>\n </ng-container>\n\n <!-- No widget configured state -->\n <ng-template #noWidgets>\n <p class=\"text-color ml-3 font-semibold\">No Widgets Configured</p>\n </ng-template>\n </ng-template>\n </div>\n</p-card>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}::ng-deep .refresh-btn-wrapper .p-button{padding:0}::ng-deep .valuation-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .rating-badge-wrapper .p-button{display:flex;align-items:center}::ng-deep .widget-block-wrapper{height:100%}::ng-deep .widget-block-wrapper .p-card{height:100%;background-color:var(--surface-0);border-radius:10px;box-shadow:none}::ng-deep .widget-block-wrapper .p-card-body{padding:0;height:100%}::ng-deep .widget-block-wrapper .p-card-content{padding:0;height:100%}.application-title-wrapper{font-size:18px;font-weight:400}.application-section-wrapper{background-color:#4c629208;border:1px solid rgba(76,98,146,.1);border-radius:10px}.widget-section-wrapper{height:100%}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}.widget-menu-container{border-radius:10px}:host ::-webkit-scrollbar{width:7px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n"] }]
|
|
6102
6102
|
}], ctorParameters: () => [{ type: WidgetService }, { type: i3$4.ActivatedRoute }, { type: WidgetQuery }, { type: WidgetStore }, { type: i0.ChangeDetectorRef }], propDecorators: { onViewAllDetails: [{
|
|
6103
6103
|
type: Output
|
|
6104
6104
|
}], onWidgetEventClick: [{
|
|
@@ -6189,11 +6189,11 @@ class WidgetRowTileComponent {
|
|
|
6189
6189
|
this.destroy$.complete();
|
|
6190
6190
|
}
|
|
6191
6191
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetRowTileComponent, deps: [{ token: WidgetService }, { token: WidgetStore }, { token: StyleBuilderService }, { token: i0.ChangeDetectorRef }, { token: WidgetQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
6192
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetRowTileComponent, isStandalone: false, selector: "lib-widget-row-tile", inputs: { recordId: "recordId", widgetName: "widgetName", onWidgetUpdate: "onWidgetUpdate", isFullHeight: "isFullHeight" }, outputs: { onWidgetItemClick: "onWidgetItemClick" }, usesOnChanges: true, ngImport: i0, template: "<p-card [style]=\"widgetCombinedStyle\" class=\"widget-block-wrapper block\" [ngClass]=\"{'h-full': isFullHeight}\">\
|
|
6192
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetRowTileComponent, isStandalone: false, selector: "lib-widget-row-tile", inputs: { recordId: "recordId", widgetName: "widgetName", onWidgetUpdate: "onWidgetUpdate", isFullHeight: "isFullHeight" }, outputs: { onWidgetItemClick: "onWidgetItemClick" }, usesOnChanges: true, ngImport: i0, template: "<p-card [style]=\"widgetCombinedStyle\" class=\"widget-block-wrapper block\" [ngClass]=\"{'h-full': isFullHeight}\">\n <div class=\"widget-section-wrapper\" [ngClass]=\"{'h-full': isFullHeight}\">\n <!-- Loading state -->\n @if (isLoading) {\n @for (n of [1, 2, 3]; track $index) {\n <div style=\"padding: 6px;\">\n <p-skeleton width=\"100%\" height=\"45px\" styleClass=\"mb-3\"></p-skeleton>\n </div>\n }\n } @else {\n\n <!-- Widgets Exist -->\n @if (widgets && widgets.length > 0) {\n @for (widget of widgets; let i = $index; track i) {\n <lib-widget-main \n [widget]=\"widget\" \n [index]=\"i\" \n [isFullHeight]=\"isFullHeight\"\n ></lib-widget-main>\n }\n } @else {\n <!-- No Widgets -->\n <p class=\"text-color ml-3 font-semibold\">\n No Widgets Configured\n </p>\n }\n }\n </div>\n</p-card>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}::ng-deep .refresh-btn-wrapper .p-button{padding:0}::ng-deep .valuation-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .rating-badge-wrapper .p-button{display:flex;align-items:center}::ng-deep .widget-block-wrapper{height:100%}::ng-deep .widget-block-wrapper .p-card{height:100%;background-color:var(--surface-0);border-radius:10px;box-shadow:none}::ng-deep .widget-block-wrapper .p-card-body{padding:0;height:100%}::ng-deep .widget-block-wrapper .p-card-content{padding:0;height:100%}.application-title-wrapper{font-size:18px;font-weight:400}.application-section-wrapper{background-color:#4c629208;border:1px solid rgba(76,98,146,.1);border-radius:10px}.widget-section-wrapper{height:100%}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}.widget-menu-container{border-radius:10px}:host ::-webkit-scrollbar{width:7px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n", ""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i6$1.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: i2$3.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: WidgetMainComponent, selector: "lib-widget-main", inputs: ["widget", "index", "isFullHeight"] }] });
|
|
6193
6193
|
}
|
|
6194
6194
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetRowTileComponent, decorators: [{
|
|
6195
6195
|
type: Component,
|
|
6196
|
-
args: [{ selector: 'lib-widget-row-tile', standalone: false, template: "<p-card [style]=\"widgetCombinedStyle\" class=\"widget-block-wrapper block\" [ngClass]=\"{'h-full': isFullHeight}\">\
|
|
6196
|
+
args: [{ selector: 'lib-widget-row-tile', standalone: false, template: "<p-card [style]=\"widgetCombinedStyle\" class=\"widget-block-wrapper block\" [ngClass]=\"{'h-full': isFullHeight}\">\n <div class=\"widget-section-wrapper\" [ngClass]=\"{'h-full': isFullHeight}\">\n <!-- Loading state -->\n @if (isLoading) {\n @for (n of [1, 2, 3]; track $index) {\n <div style=\"padding: 6px;\">\n <p-skeleton width=\"100%\" height=\"45px\" styleClass=\"mb-3\"></p-skeleton>\n </div>\n }\n } @else {\n\n <!-- Widgets Exist -->\n @if (widgets && widgets.length > 0) {\n @for (widget of widgets; let i = $index; track i) {\n <lib-widget-main \n [widget]=\"widget\" \n [index]=\"i\" \n [isFullHeight]=\"isFullHeight\"\n ></lib-widget-main>\n }\n } @else {\n <!-- No Widgets -->\n <p class=\"text-color ml-3 font-semibold\">\n No Widgets Configured\n </p>\n }\n }\n </div>\n</p-card>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}::ng-deep .refresh-btn-wrapper .p-button{padding:0}::ng-deep .valuation-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .rating-badge-wrapper .p-button{display:flex;align-items:center}::ng-deep .widget-block-wrapper{height:100%}::ng-deep .widget-block-wrapper .p-card{height:100%;background-color:var(--surface-0);border-radius:10px;box-shadow:none}::ng-deep .widget-block-wrapper .p-card-body{padding:0;height:100%}::ng-deep .widget-block-wrapper .p-card-content{padding:0;height:100%}.application-title-wrapper{font-size:18px;font-weight:400}.application-section-wrapper{background-color:#4c629208;border:1px solid rgba(76,98,146,.1);border-radius:10px}.widget-section-wrapper{height:100%}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}.widget-menu-container{border-radius:10px}:host ::-webkit-scrollbar{width:7px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n"] }]
|
|
6197
6197
|
}], ctorParameters: () => [{ type: WidgetService }, { type: WidgetStore }, { type: StyleBuilderService }, { type: i0.ChangeDetectorRef }, { type: WidgetQuery }], propDecorators: { recordId: [{
|
|
6198
6198
|
type: Input
|
|
6199
6199
|
}], widgetName: [{
|
|
@@ -6257,11 +6257,11 @@ class WidgetContainerComponent {
|
|
|
6257
6257
|
this.destroy$.complete();
|
|
6258
6258
|
}
|
|
6259
6259
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetContainerComponent, deps: [{ token: WidgetStore }, { token: WidgetQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
6260
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetContainerComponent, isStandalone: false, selector: "lib-widget-container", inputs: { isMenu: "isMenu", offerWidgetData: "offerWidgetData", valuationWidgetData: "valuationWidgetData", widgetName: "widgetName", recordId: "recordId", onWidgetUpdate: "onWidgetUpdate", isFullHeight: "isFullHeight" }, outputs: { onViewAllDetails: "onViewAllDetails", onWidgetEventClick: "onWidgetEventClick", onWidgetItemClick: "onWidgetItemClick", onUpdatedWidgetList: "onUpdatedWidgetList" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-container-wrapper\" [ngClass]=\"{'h-full': isFullHeight}\">\
|
|
6260
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetContainerComponent, isStandalone: false, selector: "lib-widget-container", inputs: { isMenu: "isMenu", offerWidgetData: "offerWidgetData", valuationWidgetData: "valuationWidgetData", widgetName: "widgetName", recordId: "recordId", onWidgetUpdate: "onWidgetUpdate", isFullHeight: "isFullHeight" }, outputs: { onViewAllDetails: "onViewAllDetails", onWidgetEventClick: "onWidgetEventClick", onWidgetItemClick: "onWidgetItemClick", onUpdatedWidgetList: "onUpdatedWidgetList" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-container-wrapper\" [ngClass]=\"{'h-full': isFullHeight}\">\n @if(isMenu) {\n <div class=\"bg-white widget-menu-container\">\n <lib-widget-menu \n [offerWidgetData]=\"offerWidgetData\"\n [valuationWidgetData]=\"valuationWidgetData\"\n (onViewAllDetails)=\"handleViewAllDetails($event)\"\n (onWidgetEventClick)=\"handleWidgetEventClick($event)\"\n (onWidgetItemClick)=\"handleWidgetItemClick($event)\"\n ></lib-widget-menu>\n </div>\n } @else {\n <div class=\"bg-white widget-menu-container\" [ngClass]=\"{'h-full': isFullHeight}\">\n <lib-widget-row-tile\n [recordId]=\"recordId\"\n [widgetName]=\"widgetName\"\n [onWidgetUpdate]=\"onWidgetUpdate\"\n [isFullHeight]=\"isFullHeight\"\n (onWidgetItemClick)=\"handleWidgetItemClick($event)\"\n ></lib-widget-row-tile>\n </div>\n }\n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}::ng-deep .refresh-btn-wrapper .p-button{padding:0}::ng-deep .valuation-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .rating-badge-wrapper .p-button{display:flex;align-items:center}::ng-deep .widget-block-wrapper{height:100%}::ng-deep .widget-block-wrapper .p-card{height:100%;background-color:var(--surface-0);border-radius:10px;box-shadow:none}::ng-deep .widget-block-wrapper .p-card-body{padding:0;height:100%}::ng-deep .widget-block-wrapper .p-card-content{padding:0;height:100%}.application-title-wrapper{font-size:18px;font-weight:400}.application-section-wrapper{background-color:#4c629208;border:1px solid rgba(76,98,146,.1);border-radius:10px}.widget-section-wrapper{height:100%}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}.widget-menu-container{border-radius:10px}:host ::-webkit-scrollbar{width:7px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: WidgetMenuComponent, selector: "lib-widget-menu", inputs: ["isSidebarVisible", "offerWidgetData", "valuationWidgetData"], outputs: ["onViewAllDetails", "onWidgetEventClick", "onWidgetItemClick"] }, { kind: "component", type: WidgetRowTileComponent, selector: "lib-widget-row-tile", inputs: ["recordId", "widgetName", "onWidgetUpdate", "isFullHeight"], outputs: ["onWidgetItemClick"] }] });
|
|
6261
6261
|
}
|
|
6262
6262
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetContainerComponent, decorators: [{
|
|
6263
6263
|
type: Component,
|
|
6264
|
-
args: [{ selector: 'lib-widget-container', standalone: false, template: "<div class=\"widget-container-wrapper\" [ngClass]=\"{'h-full': isFullHeight}\">\
|
|
6264
|
+
args: [{ selector: 'lib-widget-container', standalone: false, template: "<div class=\"widget-container-wrapper\" [ngClass]=\"{'h-full': isFullHeight}\">\n @if(isMenu) {\n <div class=\"bg-white widget-menu-container\">\n <lib-widget-menu \n [offerWidgetData]=\"offerWidgetData\"\n [valuationWidgetData]=\"valuationWidgetData\"\n (onViewAllDetails)=\"handleViewAllDetails($event)\"\n (onWidgetEventClick)=\"handleWidgetEventClick($event)\"\n (onWidgetItemClick)=\"handleWidgetItemClick($event)\"\n ></lib-widget-menu>\n </div>\n } @else {\n <div class=\"bg-white widget-menu-container\" [ngClass]=\"{'h-full': isFullHeight}\">\n <lib-widget-row-tile\n [recordId]=\"recordId\"\n [widgetName]=\"widgetName\"\n [onWidgetUpdate]=\"onWidgetUpdate\"\n [isFullHeight]=\"isFullHeight\"\n (onWidgetItemClick)=\"handleWidgetItemClick($event)\"\n ></lib-widget-row-tile>\n </div>\n }\n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}::ng-deep .refresh-btn-wrapper .p-button{padding:0}::ng-deep .valuation-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .rating-badge-wrapper .p-button{display:flex;align-items:center}::ng-deep .widget-block-wrapper{height:100%}::ng-deep .widget-block-wrapper .p-card{height:100%;background-color:var(--surface-0);border-radius:10px;box-shadow:none}::ng-deep .widget-block-wrapper .p-card-body{padding:0;height:100%}::ng-deep .widget-block-wrapper .p-card-content{padding:0;height:100%}.application-title-wrapper{font-size:18px;font-weight:400}.application-section-wrapper{background-color:#4c629208;border:1px solid rgba(76,98,146,.1);border-radius:10px}.widget-section-wrapper{height:100%}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}.widget-menu-container{border-radius:10px}:host ::-webkit-scrollbar{width:7px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n"] }]
|
|
6265
6265
|
}], ctorParameters: () => [{ type: WidgetStore }, { type: WidgetQuery }], propDecorators: { isMenu: [{
|
|
6266
6266
|
type: Input
|
|
6267
6267
|
}], offerWidgetData: [{
|
|
@@ -6290,11 +6290,11 @@ class WidgetMenuHeaderComponent {
|
|
|
6290
6290
|
widget;
|
|
6291
6291
|
progressChartData;
|
|
6292
6292
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMenuHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6293
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetMenuHeaderComponent, isStandalone: false, selector: "lib-widget-menu-header", inputs: { widget: "widget", progressChartData: "progressChartData" }, ngImport: i0, template: "<div class=\"grid m-0 align-items-center justify-content-between px-3\">\
|
|
6293
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetMenuHeaderComponent, isStandalone: false, selector: "lib-widget-menu-header", inputs: { widget: "widget", progressChartData: "progressChartData" }, ngImport: i0, template: "<div class=\"grid m-0 align-items-center justify-content-between px-3\">\n <div class=\"col-10 p-0\">\n <div class=\"flex align-items-center\">\n <h3 class=\"mb-0 application-title-wrapper font-bold mr-3\">\n {{ (widget.header) }}\n </h3>\n </div>\n <div *ngIf=\"widget?.subHeader\" class=\"flex align-items-center mt-2\">\n <span class=\"mr-1\">Risk Rating:</span>\n <span class=\"mr-3 font-semibold\" [ngClass]=\"{\n 'text-red-500': widget.subHeader === 'High',\n 'text-green-500': widget.subHeader === 'Low',\n 'text-yellow-500': widget.subHeader === 'Medium'\n }\">{{ widget.subHeader }}</span>\n </div>\n </div>\n @if(widget.predefinedName == \"ApplicationWidget\") {\n <div class=\"chart-container\">\n <p-chart type=\"pie\" [data]=\"progressChartData\" height=\"50px\" width=\"50px\"></p-chart>\n <p class=\"percentage-label text-green-500 text-lg\">{{ progressChartData.datasets[0].data[0] }}%</p>\n </div>\n }\n \n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}.application-title-wrapper{font-size:18px;font-weight:600}.chart-container{display:flex;flex-direction:column;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$4.UIChart, selector: "p-chart", inputs: ["type", "plugins", "width", "height", "responsive", "ariaLabel", "ariaLabelledBy", "data", "options"], outputs: ["onDataSelect"] }] });
|
|
6294
6294
|
}
|
|
6295
6295
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMenuHeaderComponent, decorators: [{
|
|
6296
6296
|
type: Component,
|
|
6297
|
-
args: [{ selector: 'lib-widget-menu-header', standalone: false, template: "<div class=\"grid m-0 align-items-center justify-content-between px-3\">\
|
|
6297
|
+
args: [{ selector: 'lib-widget-menu-header', standalone: false, template: "<div class=\"grid m-0 align-items-center justify-content-between px-3\">\n <div class=\"col-10 p-0\">\n <div class=\"flex align-items-center\">\n <h3 class=\"mb-0 application-title-wrapper font-bold mr-3\">\n {{ (widget.header) }}\n </h3>\n </div>\n <div *ngIf=\"widget?.subHeader\" class=\"flex align-items-center mt-2\">\n <span class=\"mr-1\">Risk Rating:</span>\n <span class=\"mr-3 font-semibold\" [ngClass]=\"{\n 'text-red-500': widget.subHeader === 'High',\n 'text-green-500': widget.subHeader === 'Low',\n 'text-yellow-500': widget.subHeader === 'Medium'\n }\">{{ widget.subHeader }}</span>\n </div>\n </div>\n @if(widget.predefinedName == \"ApplicationWidget\") {\n <div class=\"chart-container\">\n <p-chart type=\"pie\" [data]=\"progressChartData\" height=\"50px\" width=\"50px\"></p-chart>\n <p class=\"percentage-label text-green-500 text-lg\">{{ progressChartData.datasets[0].data[0] }}%</p>\n </div>\n }\n \n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}.application-title-wrapper{font-size:18px;font-weight:600}.chart-container{display:flex;flex-direction:column;align-items:center;justify-content:center}\n"] }]
|
|
6298
6298
|
}], propDecorators: { widget: [{
|
|
6299
6299
|
type: Input
|
|
6300
6300
|
}], progressChartData: [{
|
|
@@ -6358,11 +6358,11 @@ class WidgetMenuItemComponent {
|
|
|
6358
6358
|
this.widgetStore.setOnWidgetItemClick(updatedItem);
|
|
6359
6359
|
}
|
|
6360
6360
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMenuItemComponent, deps: [{ token: StyleBuilderService }, { token: WidgetStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
6361
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetMenuItemComponent, isStandalone: false, selector: "lib-widget-menu-item", inputs: { widgetItem: "widgetItem", widget: "widget", application: "application" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-container\">\
|
|
6361
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetMenuItemComponent, isStandalone: false, selector: "lib-widget-menu-item", inputs: { widgetItem: "widgetItem", widget: "widget", application: "application" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-container\">\n <div class=\"flex justify-content-between\"\n [ngClass]=\"!(widgetItem.key === 'Address' && widget.predefinedName === 'PropertyWidget') ? 'align-items-center' : ''\">\n <p class=\"mb-0 text-color-secondary mr-3 key-field-wrapper w-50\">{{ widgetItem?.key }}</p>\n \n <div class=\"mb-0 text-color font-semibold text-value-wrapper w-50 flex align-items-center justify-content-end\">\n <i *ngIf=\"false\" class=\"pi pi-exclamation-triangle text-red-500 mr-1\"\n style=\"font-size: 1.3rem\"></i>\n <p *ngIf=\"!(widgetItem.key === 'Address' && widget.predefinedName === 'PropertyWidget')\" class=\"key-field-wrapper\"\n [ngStyle]=\"getStyle(widgetItem.style)\">\n <ng-container *ngIf=\"widgetItem?.isLink; else plainText\">\n <a class=\"cursor-pointer\" (click)=\"handleWidgetItemClick(widgetItem)\">\n {{ (widgetItem.value && widgetItem.value !== 'null') ? widgetItem.value : '' }}\n </a>\n </ng-container>\n <ng-template #plainText>\n <a (click)=\"handleWidgetItemClick(widgetItem)\"> {{ (widgetItem?.value && widgetItem?.value !== 'null') ? widgetItem?.value : '' }} </a>\n </ng-template>\n </p>\n <i *ngIf=\"widgetItem.key === 'Address' && widget.predefinedName === 'PropertyWidget'\"\n class=\"pi pi-map-marker map-icon map-icon-wrapper\"></i>\n </div>\n </div>\n \n \n <div *ngIf=\"widgetItem.key === 'Address' && widget.predefinedName === 'PropertyWidget'\"\n class=\"address-title-wrapper cursor-pointer\" [ngStyle]=\"getStyle(widgetItem.style)\" (click)=\"onHandleSidebar(widget.recordId)\">\n {{ widgetItem?.value }}\n </div>\n</div>", styles: [".text-value-wrapper{-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%}.key-field-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.w-50{width:50%!important}.map-icon-wrapper{font-size:16px;padding:13px;border-radius:30px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.address-title-wrapper{width:80%;word-break:break-word;margin-top:-12px}\n"], dependencies: [{ 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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
6362
6362
|
}
|
|
6363
6363
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMenuItemComponent, decorators: [{
|
|
6364
6364
|
type: Component,
|
|
6365
|
-
args: [{ selector: 'lib-widget-menu-item', standalone: false, template: "<div class=\"widget-container\">\
|
|
6365
|
+
args: [{ selector: 'lib-widget-menu-item', standalone: false, template: "<div class=\"widget-container\">\n <div class=\"flex justify-content-between\"\n [ngClass]=\"!(widgetItem.key === 'Address' && widget.predefinedName === 'PropertyWidget') ? 'align-items-center' : ''\">\n <p class=\"mb-0 text-color-secondary mr-3 key-field-wrapper w-50\">{{ widgetItem?.key }}</p>\n \n <div class=\"mb-0 text-color font-semibold text-value-wrapper w-50 flex align-items-center justify-content-end\">\n <i *ngIf=\"false\" class=\"pi pi-exclamation-triangle text-red-500 mr-1\"\n style=\"font-size: 1.3rem\"></i>\n <p *ngIf=\"!(widgetItem.key === 'Address' && widget.predefinedName === 'PropertyWidget')\" class=\"key-field-wrapper\"\n [ngStyle]=\"getStyle(widgetItem.style)\">\n <ng-container *ngIf=\"widgetItem?.isLink; else plainText\">\n <a class=\"cursor-pointer\" (click)=\"handleWidgetItemClick(widgetItem)\">\n {{ (widgetItem.value && widgetItem.value !== 'null') ? widgetItem.value : '' }}\n </a>\n </ng-container>\n <ng-template #plainText>\n <a (click)=\"handleWidgetItemClick(widgetItem)\"> {{ (widgetItem?.value && widgetItem?.value !== 'null') ? widgetItem?.value : '' }} </a>\n </ng-template>\n </p>\n <i *ngIf=\"widgetItem.key === 'Address' && widget.predefinedName === 'PropertyWidget'\"\n class=\"pi pi-map-marker map-icon map-icon-wrapper\"></i>\n </div>\n </div>\n \n \n <div *ngIf=\"widgetItem.key === 'Address' && widget.predefinedName === 'PropertyWidget'\"\n class=\"address-title-wrapper cursor-pointer\" [ngStyle]=\"getStyle(widgetItem.style)\" (click)=\"onHandleSidebar(widget.recordId)\">\n {{ widgetItem?.value }}\n </div>\n</div>", styles: [".text-value-wrapper{-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%}.key-field-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.w-50{width:50%!important}.map-icon-wrapper{font-size:16px;padding:13px;border-radius:30px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.address-title-wrapper{width:80%;word-break:break-word;margin-top:-12px}\n"] }]
|
|
6366
6366
|
}], ctorParameters: () => [{ type: StyleBuilderService }, { type: WidgetStore }], propDecorators: { widgetItem: [{
|
|
6367
6367
|
type: Input
|
|
6368
6368
|
}], widget: [{
|
|
@@ -6374,11 +6374,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
|
|
|
6374
6374
|
class WidgetMenuBodyComponent {
|
|
6375
6375
|
widget;
|
|
6376
6376
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMenuBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6377
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetMenuBodyComponent, isStandalone: false, selector: "lib-widget-menu-body", inputs: { widget: "widget" }, ngImport: i0, template: "<div class=\"widget-body-container\">\
|
|
6377
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: WidgetMenuBodyComponent, isStandalone: false, selector: "lib-widget-menu-body", inputs: { widget: "widget" }, ngImport: i0, template: "<div class=\"widget-body-container\">\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\">\n @if(!dataItem.isHidden){\n <div [ngClass]=\"i !== ((widget.dataItems || []).length - 1) ? 'widget-item-wrapper' : ''\">\n <div [ngClass]=\"\n dataItem?.key === 'Vulnerability' && widget.predefinedName === 'ApplicantWidget'\n ? 'vulnerability-title-wrapper'\n : ( i !== ((widget.dataItems || []).length - 1) ? 'widget-wrapper' : 'widget-last-wrapper' )\n \" class=\"px-3\">\n <lib-widget-menu-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-menu-item>\n </div>\n </div>\n }\n </div>\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-wrapper{padding:10px 0}.vulnerability-title-wrapper{background:#fb392d36}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: WidgetMenuItemComponent, selector: "lib-widget-menu-item", inputs: ["widgetItem", "widget", "application"] }] });
|
|
6378
6378
|
}
|
|
6379
6379
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMenuBodyComponent, decorators: [{
|
|
6380
6380
|
type: Component,
|
|
6381
|
-
args: [{ selector: 'lib-widget-menu-body', standalone: false, template: "<div class=\"widget-body-container\">\
|
|
6381
|
+
args: [{ selector: 'lib-widget-menu-body', standalone: false, template: "<div class=\"widget-body-container\">\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\">\n @if(!dataItem.isHidden){\n <div [ngClass]=\"i !== ((widget.dataItems || []).length - 1) ? 'widget-item-wrapper' : ''\">\n <div [ngClass]=\"\n dataItem?.key === 'Vulnerability' && widget.predefinedName === 'ApplicantWidget'\n ? 'vulnerability-title-wrapper'\n : ( i !== ((widget.dataItems || []).length - 1) ? 'widget-wrapper' : 'widget-last-wrapper' )\n \" class=\"px-3\">\n <lib-widget-menu-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-menu-item>\n </div>\n </div>\n }\n </div>\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-wrapper{padding:10px 0}.vulnerability-title-wrapper{background:#fb392d36}\n"] }]
|
|
6382
6382
|
}], propDecorators: { widget: [{
|
|
6383
6383
|
type: Input
|
|
6384
6384
|
}] } });
|
|
@@ -6514,11 +6514,11 @@ class WidgetMenuContainerComponent {
|
|
|
6514
6514
|
this.destroy$.complete();
|
|
6515
6515
|
}
|
|
6516
6516
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMenuContainerComponent, deps: [{ token: WidgetService }, { token: i3$4.ActivatedRoute }, { token: WidgetQuery }, { token: WidgetStore }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
6517
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetMenuContainerComponent, isStandalone: false, selector: "lib-widget-menu-container", inputs: { widgetName: "widgetName", recordId: "recordId", isRouteChanged: "isRouteChanged", isSidebarVisible: "isSidebarVisible", offerWidgetData: "offerWidgetData", valuationWidgetData: "valuationWidgetData", progressChartData: "progressChartData" }, outputs: { onViewAllDetails: "onViewAllDetails", onViewAllProperties: "onViewAllProperties", onWidgetItemClick: "onWidgetItemClick", getWidgetData: "getWidgetData", onDirectDebitClick: "onDirectDebitClick", onWidgetLoaded: "onWidgetLoaded" }, usesOnChanges: true, ngImport: i0, template: "<p-card class=\"widget-block-wrapper block\">\
|
|
6517
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetMenuContainerComponent, isStandalone: false, selector: "lib-widget-menu-container", inputs: { widgetName: "widgetName", recordId: "recordId", isRouteChanged: "isRouteChanged", isSidebarVisible: "isSidebarVisible", offerWidgetData: "offerWidgetData", valuationWidgetData: "valuationWidgetData", progressChartData: "progressChartData" }, outputs: { onViewAllDetails: "onViewAllDetails", onViewAllProperties: "onViewAllProperties", onWidgetItemClick: "onWidgetItemClick", getWidgetData: "getWidgetData", onDirectDebitClick: "onDirectDebitClick", onWidgetLoaded: "onWidgetLoaded" }, usesOnChanges: true, ngImport: i0, template: "<p-card class=\"widget-block-wrapper block\">\n <div class=\"widget-section-wrapper pt-2\">\n <!-- Loading state -->\n <ng-container *ngIf=\"isLoading; else widgetContent\">\n <p class=\"text-color ml-3 font-semibold\">Widget configuration loading...</p>\n </ng-container>\n \n <!-- Content after API call -->\n <ng-template #widgetContent>\n <ng-container *ngIf=\"(widgets && widgets.length > 0) || (valuationWidgetData || offerWidgetData); else noWidgets\">\n <ng-container *ngFor=\"let widget of widgets; let i = index\">\n <div class=\"widget-container-wrapper pl-1\" [ngClass]=\"i !== 0 ? 'mt-4' : ''\">\n <lib-widget-menu-header [widget]=\"widget\" [progressChartData]=\"progressChartData\"></lib-widget-menu-header>\n <div class=\"widget-content-wrapper mt-3 py-3\">\n <lib-widget-menu-body [widget]=\"widget\"></lib-widget-menu-body>\n <lib-widget-footer [widget]=\"widget\"></lib-widget-footer>\n </div>\n </div>\n </ng-container>\n </ng-container>\n \n <!-- No widget configured state -->\n <ng-template #noWidgets>\n <p class=\"text-color ml-3 font-semibold\">No Widgets Configured</p>\n </ng-template>\n </ng-template>\n </div>\n </p-card>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}::ng-deep .refresh-btn-wrapper .p-button{padding:0}::ng-deep .valuation-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .rating-badge-wrapper .p-button{display:flex;align-items:center}.application-title-wrapper{font-size:18px;font-weight:400}.application-section-wrapper{background-color:#4c629208;border:1px solid rgba(76,98,146,.1);border-radius:10px}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$1.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: WidgetFooterComponent, selector: "lib-widget-footer", inputs: ["widget"] }, { kind: "component", type: WidgetMenuHeaderComponent, selector: "lib-widget-menu-header", inputs: ["widget", "progressChartData"] }, { kind: "component", type: WidgetMenuBodyComponent, selector: "lib-widget-menu-body", inputs: ["widget"] }] });
|
|
6518
6518
|
}
|
|
6519
6519
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetMenuContainerComponent, decorators: [{
|
|
6520
6520
|
type: Component,
|
|
6521
|
-
args: [{ selector: 'lib-widget-menu-container', standalone: false, template: "<p-card class=\"widget-block-wrapper block\">\
|
|
6521
|
+
args: [{ selector: 'lib-widget-menu-container', standalone: false, template: "<p-card class=\"widget-block-wrapper block\">\n <div class=\"widget-section-wrapper pt-2\">\n <!-- Loading state -->\n <ng-container *ngIf=\"isLoading; else widgetContent\">\n <p class=\"text-color ml-3 font-semibold\">Widget configuration loading...</p>\n </ng-container>\n \n <!-- Content after API call -->\n <ng-template #widgetContent>\n <ng-container *ngIf=\"(widgets && widgets.length > 0) || (valuationWidgetData || offerWidgetData); else noWidgets\">\n <ng-container *ngFor=\"let widget of widgets; let i = index\">\n <div class=\"widget-container-wrapper pl-1\" [ngClass]=\"i !== 0 ? 'mt-4' : ''\">\n <lib-widget-menu-header [widget]=\"widget\" [progressChartData]=\"progressChartData\"></lib-widget-menu-header>\n <div class=\"widget-content-wrapper mt-3 py-3\">\n <lib-widget-menu-body [widget]=\"widget\"></lib-widget-menu-body>\n <lib-widget-footer [widget]=\"widget\"></lib-widget-footer>\n </div>\n </div>\n </ng-container>\n </ng-container>\n \n <!-- No widget configured state -->\n <ng-template #noWidgets>\n <p class=\"text-color ml-3 font-semibold\">No Widgets Configured</p>\n </ng-template>\n </ng-template>\n </div>\n </p-card>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}::ng-deep .refresh-btn-wrapper .p-button{padding:0}::ng-deep .valuation-timeline-wrapper .p-timeline-event-opposite{display:none}::ng-deep .rating-badge-wrapper .p-button{display:flex;align-items:center}.application-title-wrapper{font-size:18px;font-weight:400}.application-section-wrapper{background-color:#4c629208;border:1px solid rgba(76,98,146,.1);border-radius:10px}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n"] }]
|
|
6522
6522
|
}], ctorParameters: () => [{ type: WidgetService }, { type: i3$4.ActivatedRoute }, { type: WidgetQuery }, { type: WidgetStore }, { type: i0.ChangeDetectorRef }], propDecorators: { widgetName: [{
|
|
6523
6523
|
type: Input
|
|
6524
6524
|
}], recordId: [{
|
|
@@ -7121,11 +7121,11 @@ class QueueSearchComponent {
|
|
|
7121
7121
|
return !!this.searchText;
|
|
7122
7122
|
}
|
|
7123
7123
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7124
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueSearchComponent, isStandalone: false, selector: "queue-search", inputs: { searchText: "searchText", placeholder: "placeholder", debounceTime: "debounceTime" }, outputs: { searchInputChanged: "searchInputChanged", searchRequested: "searchRequested", searchCleared: "searchCleared" }, ngImport: i0, template: "<div class=\"flex xl:mt-0 xl:justify-content-between align-items-center bg-white\" style=\"border: 1px solid #e0e4ea; border-radius: 8px; height: 44px;\">\
|
|
7124
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueSearchComponent, isStandalone: false, selector: "queue-search", inputs: { searchText: "searchText", placeholder: "placeholder", debounceTime: "debounceTime" }, outputs: { searchInputChanged: "searchInputChanged", searchRequested: "searchRequested", searchCleared: "searchCleared" }, ngImport: i0, template: "<div class=\"flex xl:mt-0 xl:justify-content-between align-items-center bg-white\" style=\"border: 1px solid #e0e4ea; border-radius: 8px; height: 44px;\">\n <div class=\"p-field m-0 p-0 w-full bg-white border-round\" >\n <div class=\"p-inputgroup border-round bg-white\" style=\"height: 100%;\">\n <span class=\"p-inputgroup-addon bg-white\" style=\"height: 100%; display: flex; align-items: center;\">\n <i class=\"pi pi-search\"></i>\n </span>\n <input \n type=\"text\" \n [(ngModel)]=\"searchText\" \n class=\"border-none p-0 border-noround-right bg-white w-full outline-none\" \n style=\"height: 100%;\" \n pInputText \n [placeholder]=\"placeholder\" \n (input)=\"onSearchInputChange()\"\n (keydown.enter)=\"onSearch()\" \n />\n <button \n *ngIf=\"hasSearchText\" \n type=\"button\" \n class=\"p-inputgroup-addon bg-white border-none cursor-pointer\" \n (click)=\"onClearSearch()\"\n pButton \n icon=\"pi pi-times\"\n [text]=\"true\"\n style=\"height: 100%; display: flex; align-items: center; border-radius: 8px;\"\n ></button>\n </div>\n </div>\n </div>\n ", styles: [".p-inputgroup{width:100%;display:flex;align-items:center;height:44px}.p-inputgroup-addon{display:flex;align-items:center;height:100%}input[type=text],input.p-inputtext{height:100%;display:flex;align-items:center;padding-top:0;padding-bottom:0;box-sizing:border-box}button.p-inputgroup-addon{display:flex;align-items:center;height:100%}.bg-primary{background-color:#d9d9d9}::ng-deep .left-arrow-dropdown .p-dropdown{direction:rtl;width:100%;height:44px;border-top-left-radius:0;border-bottom-left-radius:0}::ng-deep .left-arrow-dropdown .p-dropdown-label{display:flex;align-items:center}.h-44{height:44px}@media screen and (min-width: 1200px){.vh-100{height:calc(100vh - 170px)}}.bg-while{background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$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: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7125
7125
|
}
|
|
7126
7126
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueSearchComponent, decorators: [{
|
|
7127
7127
|
type: Component,
|
|
7128
|
-
args: [{ selector: 'queue-search', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex xl:mt-0 xl:justify-content-between align-items-center bg-white\" style=\"border: 1px solid #e0e4ea; border-radius: 8px; height: 44px;\">\
|
|
7128
|
+
args: [{ selector: 'queue-search', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex xl:mt-0 xl:justify-content-between align-items-center bg-white\" style=\"border: 1px solid #e0e4ea; border-radius: 8px; height: 44px;\">\n <div class=\"p-field m-0 p-0 w-full bg-white border-round\" >\n <div class=\"p-inputgroup border-round bg-white\" style=\"height: 100%;\">\n <span class=\"p-inputgroup-addon bg-white\" style=\"height: 100%; display: flex; align-items: center;\">\n <i class=\"pi pi-search\"></i>\n </span>\n <input \n type=\"text\" \n [(ngModel)]=\"searchText\" \n class=\"border-none p-0 border-noround-right bg-white w-full outline-none\" \n style=\"height: 100%;\" \n pInputText \n [placeholder]=\"placeholder\" \n (input)=\"onSearchInputChange()\"\n (keydown.enter)=\"onSearch()\" \n />\n <button \n *ngIf=\"hasSearchText\" \n type=\"button\" \n class=\"p-inputgroup-addon bg-white border-none cursor-pointer\" \n (click)=\"onClearSearch()\"\n pButton \n icon=\"pi pi-times\"\n [text]=\"true\"\n style=\"height: 100%; display: flex; align-items: center; border-radius: 8px;\"\n ></button>\n </div>\n </div>\n </div>\n ", styles: [".p-inputgroup{width:100%;display:flex;align-items:center;height:44px}.p-inputgroup-addon{display:flex;align-items:center;height:100%}input[type=text],input.p-inputtext{height:100%;display:flex;align-items:center;padding-top:0;padding-bottom:0;box-sizing:border-box}button.p-inputgroup-addon{display:flex;align-items:center;height:100%}.bg-primary{background-color:#d9d9d9}::ng-deep .left-arrow-dropdown .p-dropdown{direction:rtl;width:100%;height:44px;border-top-left-radius:0;border-bottom-left-radius:0}::ng-deep .left-arrow-dropdown .p-dropdown-label{display:flex;align-items:center}.h-44{height:44px}@media screen and (min-width: 1200px){.vh-100{height:calc(100vh - 170px)}}.bg-while{background-color:#fff}\n"] }]
|
|
7129
7129
|
}], propDecorators: { searchText: [{
|
|
7130
7130
|
type: Input
|
|
7131
7131
|
}], placeholder: [{
|
|
@@ -7170,11 +7170,11 @@ class QueueItemComponent {
|
|
|
7170
7170
|
return queueId === this.selectedQueueId;
|
|
7171
7171
|
}
|
|
7172
7172
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueItemComponent, deps: [{ token: QueueStore$1 }], target: i0.ɵɵFactoryTarget.Component });
|
|
7173
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: QueueItemComponent, isStandalone: false, selector: "app-queue-item", inputs: { filteredQueueData: "filteredQueueData", selectedQueueId: "selectedQueueId", selectedStatus: "selectedStatus", userRole: "userRole", showQueueDataForm: "showQueueDataForm" }, outputs: { queueSelected: "queueSelected", statusChanged: "statusChanged", insertQueueRequested: "insertQueueRequested" }, ngImport: i0, template: "<div class=\"p-4 pt-3 mb-0\">\
|
|
7173
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: QueueItemComponent, isStandalone: false, selector: "app-queue-item", inputs: { filteredQueueData: "filteredQueueData", selectedQueueId: "selectedQueueId", selectedStatus: "selectedStatus", userRole: "userRole", showQueueDataForm: "showQueueDataForm" }, outputs: { queueSelected: "queueSelected", statusChanged: "statusChanged", insertQueueRequested: "insertQueueRequested" }, ngImport: i0, template: "<div class=\"p-4 pt-3 mb-0\">\n <div class=\"queues overflow-x-hidden queue-item-wrapper\">\n <h4 class=\"queue-title-wrapper m-0 mb-3 pb-1\">Queues</h4>\n @for(queue of filteredQueueData; let i = $index; track queue){\n\n <div class=\"flex m-0 kanban-list\" [ngClass]=\"{'mt-2 pt-1': i !== 0}\" #listEl style=\"min-height:2rem\" (click)=\"onQueueClick(queue._id)\" >\n <div class=\"flex align-items-center p-0 w-full\">\n <div class=\"py-4 px-3 cursor-pointer w-full\" [ngClass]=\"{\n 'active-queue-wrapper': isQueueSelected(queue._id),\n 'inActiveQueue': !isQueueActive(queue),\n 'queue-list-wrapper': isQueueActive(queue)\n }\"\n >\n <div class=\"flex justify-content-between flex align-items-center\">\n <span class=\"text-color queue-name font-semibold\"\n [ngClass]=\"{'active-title-wrapper': isQueueSelected(queue._id)}\"\n >{{queue.name}}</span>\n <div class=\"elipsesWithCount flex align-items-center\">\n <p-badge [value]=\"queue.itemCount\" severity=\"primary\" [ngClass]=\"{\n 'inActiveBadgeColor': !isQueueActive(queue),\n }\" />\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- <div *ngIf=\"userRole\" class=\"w-full mt-4\">\n <p-button class=\"add-queue-btn-wrapper\" (onClick)=\"onInsertQueue()\">\n <div class=\"flex align-items-center justify-content-between\">\n <i class=\"pi pi-plus mr-2\"></i>\n <p class=\"mb-0\">Add Queue</p>\n </div>\n </p-button>\n </div> -->\n </div> ", styles: [".card{height:100%}.custom-scroll{height:calc(100% - 112px);overflow-y:hidden}.custom-scroll:hover{overflow-y:auto;scroll-behavior:smooth}.queue-list-wrapper{border-radius:10px;border:1px solid rgba(76,98,146,.18);background:var(--surface-0)}.active-queue-wrapper{border:1px solid #0f8bfd}.active-title-wrapper{color:#0f8bfd!important}.ellipsis-icon-wrapper{width:6px}.queue-title-wrapper{font-size:20px;font-weight:600}.queue-name{max-width:70%;font-size:12px;word-break:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal}.inactive-queue-wrapper{margin-left:20px}.create-button{border-radius:8px!important;border:2px solid transparent;border-image:repeating-linear-gradient(45deg,#676b89,#676b89 10px,transparent 10px,transparent 20px) 1;background:linear-gradient(0deg,#7f899e30 0% 100%),#fff;color:#0a061a;gap:8px;font-family:inherit;font-size:14px;font-weight:400;-webkit-mask:linear-gradient(#fff 0 0)}.create-button:hover{background-color:var(--blue-100)}.filter-dropdown{padding:.4rem .6rem;border:1px solid rgba(15,139,253,.1);border-radius:4px;background-color:#f0f8ff;color:var(--text-color);cursor:pointer}.filterContainer{display:flex;justify-content:end;margin-bottom:15px}.inActiveQueue{background-color:#7f899e30;border:2px solid #676b89;border-radius:8px;color:#0a061a;font-family:inherit;font-size:14px;font-weight:400}::ng-deep .add-queue-btn-wrapper .p-button{border:none;padding:8px 12px;border-radius:8px;box-shadow:none}.inActiveBadgeColor ::ng-deep .p-badge{background:#0a061a!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3$5.Badge, selector: "p-badge", inputs: ["styleClass", "style", "badgeSize", "severity", "value", "badgeDisabled", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7174
7174
|
}
|
|
7175
7175
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueItemComponent, decorators: [{
|
|
7176
7176
|
type: Component,
|
|
7177
|
-
args: [{ selector: 'app-queue-item', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"p-4 pt-3 mb-0\">\
|
|
7177
|
+
args: [{ selector: 'app-queue-item', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"p-4 pt-3 mb-0\">\n <div class=\"queues overflow-x-hidden queue-item-wrapper\">\n <h4 class=\"queue-title-wrapper m-0 mb-3 pb-1\">Queues</h4>\n @for(queue of filteredQueueData; let i = $index; track queue){\n\n <div class=\"flex m-0 kanban-list\" [ngClass]=\"{'mt-2 pt-1': i !== 0}\" #listEl style=\"min-height:2rem\" (click)=\"onQueueClick(queue._id)\" >\n <div class=\"flex align-items-center p-0 w-full\">\n <div class=\"py-4 px-3 cursor-pointer w-full\" [ngClass]=\"{\n 'active-queue-wrapper': isQueueSelected(queue._id),\n 'inActiveQueue': !isQueueActive(queue),\n 'queue-list-wrapper': isQueueActive(queue)\n }\"\n >\n <div class=\"flex justify-content-between flex align-items-center\">\n <span class=\"text-color queue-name font-semibold\"\n [ngClass]=\"{'active-title-wrapper': isQueueSelected(queue._id)}\"\n >{{queue.name}}</span>\n <div class=\"elipsesWithCount flex align-items-center\">\n <p-badge [value]=\"queue.itemCount\" severity=\"primary\" [ngClass]=\"{\n 'inActiveBadgeColor': !isQueueActive(queue),\n }\" />\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- <div *ngIf=\"userRole\" class=\"w-full mt-4\">\n <p-button class=\"add-queue-btn-wrapper\" (onClick)=\"onInsertQueue()\">\n <div class=\"flex align-items-center justify-content-between\">\n <i class=\"pi pi-plus mr-2\"></i>\n <p class=\"mb-0\">Add Queue</p>\n </div>\n </p-button>\n </div> -->\n </div> ", styles: [".card{height:100%}.custom-scroll{height:calc(100% - 112px);overflow-y:hidden}.custom-scroll:hover{overflow-y:auto;scroll-behavior:smooth}.queue-list-wrapper{border-radius:10px;border:1px solid rgba(76,98,146,.18);background:var(--surface-0)}.active-queue-wrapper{border:1px solid #0f8bfd}.active-title-wrapper{color:#0f8bfd!important}.ellipsis-icon-wrapper{width:6px}.queue-title-wrapper{font-size:20px;font-weight:600}.queue-name{max-width:70%;font-size:12px;word-break:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal}.inactive-queue-wrapper{margin-left:20px}.create-button{border-radius:8px!important;border:2px solid transparent;border-image:repeating-linear-gradient(45deg,#676b89,#676b89 10px,transparent 10px,transparent 20px) 1;background:linear-gradient(0deg,#7f899e30 0% 100%),#fff;color:#0a061a;gap:8px;font-family:inherit;font-size:14px;font-weight:400;-webkit-mask:linear-gradient(#fff 0 0)}.create-button:hover{background-color:var(--blue-100)}.filter-dropdown{padding:.4rem .6rem;border:1px solid rgba(15,139,253,.1);border-radius:4px;background-color:#f0f8ff;color:var(--text-color);cursor:pointer}.filterContainer{display:flex;justify-content:end;margin-bottom:15px}.inActiveQueue{background-color:#7f899e30;border:2px solid #676b89;border-radius:8px;color:#0a061a;font-family:inherit;font-size:14px;font-weight:400}::ng-deep .add-queue-btn-wrapper .p-button{border:none;padding:8px 12px;border-radius:8px;box-shadow:none}.inActiveBadgeColor ::ng-deep .p-badge{background:#0a061a!important}\n"] }]
|
|
7178
7178
|
}], ctorParameters: () => [{ type: QueueStore$1 }], propDecorators: { filteredQueueData: [{
|
|
7179
7179
|
type: Input
|
|
7180
7180
|
}], selectedQueueId: [{
|
|
@@ -7212,11 +7212,11 @@ class QueueListComponent {
|
|
|
7212
7212
|
this.insertQueueRequested.emit();
|
|
7213
7213
|
}
|
|
7214
7214
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7215
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueListComponent, isStandalone: false, selector: "app-queue-list", inputs: { queueData: "queueData", selectedQueueId: "selectedQueueId", selectedStatus: "selectedStatus", userRole: "userRole", showQueueDataForm: "showQueueDataForm" }, outputs: { queueSelected: "queueSelected", statusChanged: "statusChanged", insertQueueRequested: "insertQueueRequested" }, ngImport: i0, template: "<app-queue-item\
|
|
7215
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueListComponent, isStandalone: false, selector: "app-queue-list", inputs: { queueData: "queueData", selectedQueueId: "selectedQueueId", selectedStatus: "selectedStatus", userRole: "userRole", showQueueDataForm: "showQueueDataForm" }, outputs: { queueSelected: "queueSelected", statusChanged: "statusChanged", insertQueueRequested: "insertQueueRequested" }, ngImport: i0, template: "<app-queue-item\n [filteredQueueData]=\"queueData\"\n [selectedQueueId]=\"selectedQueueId\"\n [selectedStatus]=\"selectedStatus\"\n [userRole]=\"userRole\"\n [showQueueDataForm]=\"showQueueDataForm\"\n (queueSelected)=\"onQueueSelected($event)\"\n (statusChanged)=\"onStatusChanged($event)\"\n (insertQueueRequested)=\"onInsertQueue()\"\n></app-queue-item>\n", styles: [""], dependencies: [{ kind: "component", type: QueueItemComponent, selector: "app-queue-item", inputs: ["filteredQueueData", "selectedQueueId", "selectedStatus", "userRole", "showQueueDataForm"], outputs: ["queueSelected", "statusChanged", "insertQueueRequested"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7216
7216
|
}
|
|
7217
7217
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueListComponent, decorators: [{
|
|
7218
7218
|
type: Component,
|
|
7219
|
-
args: [{ selector: 'app-queue-list', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<app-queue-item\
|
|
7219
|
+
args: [{ selector: 'app-queue-list', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<app-queue-item\n [filteredQueueData]=\"queueData\"\n [selectedQueueId]=\"selectedQueueId\"\n [selectedStatus]=\"selectedStatus\"\n [userRole]=\"userRole\"\n [showQueueDataForm]=\"showQueueDataForm\"\n (queueSelected)=\"onQueueSelected($event)\"\n (statusChanged)=\"onStatusChanged($event)\"\n (insertQueueRequested)=\"onInsertQueue()\"\n></app-queue-item>\n" }]
|
|
7220
7220
|
}], propDecorators: { queueData: [{
|
|
7221
7221
|
type: Input
|
|
7222
7222
|
}], selectedQueueId: [{
|
|
@@ -7283,11 +7283,11 @@ class QueueRecordTableComponent {
|
|
|
7283
7283
|
return this.selectedRows?.length || 0;
|
|
7284
7284
|
}
|
|
7285
7285
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueRecordTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7286
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueRecordTableComponent, isStandalone: false, selector: "app-queue-record-table", inputs: { table: "table", metaData: "metaData", loading: "loading", selectedRows: "selectedRows", resetSort: "resetSort", isShowSkeleton: "isShowSkeleton", selectedQueue: "selectedQueue" }, outputs: { selectionChange: "selectionChange", selectedRowsData: "selectedRowsData", assignmentDataReady: "assignmentDataReady", rowClick: "rowClick", paginationChanged: "paginationChanged", filterApplied: "filterApplied", sortApplied: "sortApplied" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"bg-white queue-table-wrapper border-round-xl\">\
|
|
7286
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: QueueRecordTableComponent, isStandalone: false, selector: "app-queue-record-table", inputs: { table: "table", metaData: "metaData", loading: "loading", selectedRows: "selectedRows", resetSort: "resetSort", isShowSkeleton: "isShowSkeleton", selectedQueue: "selectedQueue" }, outputs: { selectionChange: "selectionChange", selectedRowsData: "selectedRowsData", assignmentDataReady: "assignmentDataReady", rowClick: "rowClick", paginationChanged: "paginationChanged", filterApplied: "filterApplied", sortApplied: "sortApplied" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"bg-white queue-table-wrapper border-round-xl\">\n <lib-table-secondary \n [table]=\"table\" \n [metaData]=\"metaData\"\n [enableSelection]=\"true\"\n [selectionMode]=\"'multiple'\"\n [isShowSkeleton]=\"isShowSkeleton\"\n [selection]=\"selectedRows\"\n [showActions]=\"false\"\n [noRecordsMessage]=\"selectedQueue?.name === 'Assigned To Me' ? 'No applications are currently assigned.' : 'No Records Found'\"\n (onPage)=\"onPaginationChange($event)\"\n (selectionChange)=\"onSelectionChange($event)\"\n (rowSelectionChange)=\"onRowClick($event)\"\n (sortChanged)=\"onSort($event)\"\n [sortField]=\"sortField\"\n [sortOrder]=\"sortOrder\">\n </lib-table-secondary>\n</div>", styles: [".queue-record-table-wrapper{height:100%;display:flex;flex-direction:column}.queue-record-table-wrapper .table-container{flex:1;overflow:hidden}.queue-record-table-wrapper .pagination-container{margin-top:1rem;padding:.5rem}::ng-deep .queue-table-wrapper{height:100%;overflow:auto}::ng-deep .queue-table-wrapper .p-datatable .p-datatable-wrapper{overflow:visible!important}::ng-deep .queue-table-wrapper .p-datatable .p-datatable-thead>tr>th{position:sticky!important;top:0!important;z-index:10!important;background-color:#fff!important}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}@media screen and (max-width: 768px){.queue-record-table-wrapper .pagination-container{flex-direction:column;gap:.5rem}}\n"], dependencies: [{ kind: "component", type: TableSecondaryComponent, selector: "lib-table-secondary", inputs: ["table", "metaData", "title", "builder", "showStatus", "showActions", "showSearchBar", "showNewRecordButton", "showRefreshButton", "isShowSkeleton", "pathName", "selectionMode", "selection", "usePagination", "scrollHeight", "rowSelection", "enableSelection", "noRecordsMessage", "sortField", "sortOrder", "searchTerm", "filterQuery"], outputs: ["selectionChange", "rowSelectionChange", "sortChanged", "onDeleteRow", "onPage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7287
7287
|
}
|
|
7288
7288
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueRecordTableComponent, decorators: [{
|
|
7289
7289
|
type: Component,
|
|
7290
|
-
args: [{ selector: 'app-queue-record-table', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"bg-white queue-table-wrapper border-round-xl\">\
|
|
7290
|
+
args: [{ selector: 'app-queue-record-table', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"bg-white queue-table-wrapper border-round-xl\">\n <lib-table-secondary \n [table]=\"table\" \n [metaData]=\"metaData\"\n [enableSelection]=\"true\"\n [selectionMode]=\"'multiple'\"\n [isShowSkeleton]=\"isShowSkeleton\"\n [selection]=\"selectedRows\"\n [showActions]=\"false\"\n [noRecordsMessage]=\"selectedQueue?.name === 'Assigned To Me' ? 'No applications are currently assigned.' : 'No Records Found'\"\n (onPage)=\"onPaginationChange($event)\"\n (selectionChange)=\"onSelectionChange($event)\"\n (rowSelectionChange)=\"onRowClick($event)\"\n (sortChanged)=\"onSort($event)\"\n [sortField]=\"sortField\"\n [sortOrder]=\"sortOrder\">\n </lib-table-secondary>\n</div>", styles: [".queue-record-table-wrapper{height:100%;display:flex;flex-direction:column}.queue-record-table-wrapper .table-container{flex:1;overflow:hidden}.queue-record-table-wrapper .pagination-container{margin-top:1rem;padding:.5rem}::ng-deep .queue-table-wrapper{height:100%;overflow:auto}::ng-deep .queue-table-wrapper .p-datatable .p-datatable-wrapper{overflow:visible!important}::ng-deep .queue-table-wrapper .p-datatable .p-datatable-thead>tr>th{position:sticky!important;top:0!important;z-index:10!important;background-color:#fff!important}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}@media screen and (max-width: 768px){.queue-record-table-wrapper .pagination-container{flex-direction:column;gap:.5rem}}\n"] }]
|
|
7291
7291
|
}], propDecorators: { table: [{
|
|
7292
7292
|
type: Input
|
|
7293
7293
|
}], metaData: [{
|
|
@@ -7802,7 +7802,7 @@ class QueueContainerComponent extends BaseContainerComponent {
|
|
|
7802
7802
|
});
|
|
7803
7803
|
filterQueryString = existingParams.toString();
|
|
7804
7804
|
}
|
|
7805
|
-
this.queueService.getPaginatedQueueRecords(
|
|
7805
|
+
this.queueService.getPaginatedQueueRecords(this.selectedQueue.apiConfig, this.currentSearchTerm, targetPage, targetLimit, filterQueryString, this.sortBy, this.getSortOrderString(this.sortOrder)).subscribe({
|
|
7806
7806
|
next: (res) => {
|
|
7807
7807
|
const apiData = res?.data || res?.paginatedResults || res || [];
|
|
7808
7808
|
if (apiData && apiData.length > 0) {
|
|
@@ -7901,11 +7901,11 @@ class QueueContainerComponent extends BaseContainerComponent {
|
|
|
7901
7901
|
}
|
|
7902
7902
|
}
|
|
7903
7903
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueContainerComponent, deps: [{ token: QueueStore$1 }, { token: QueueService }, { token: BaseStore }, { token: QueueBusinessService }, { token: QueueRecordTableBuilderService }, { token: QueueFilterDropdownService }, { token: BaseQuery }], target: i0.ɵɵFactoryTarget.Component });
|
|
7904
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: QueueContainerComponent, isStandalone: false, selector: "lib-queue-container", inputs: { placeholder: "placeholder", selectedRowsInput: "selectedRowsInput" }, outputs: { assignmentComplete: "assignmentComplete", userAssigned: "userAssigned", selectedRowsData: "selectedRowsData", assignmentDataReady: "assignmentDataReady", rowClick: "rowClick", selectionChange: "selectionChange", isAllRowSelected: "isAllRowSelected", excludedApplicationIds: "excludedApplicationIds" }, viewQueries: [{ propertyName: "filterDropdown", first: true, predicate: ["filterDropdown"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"container grid m-0 h-full\">\
|
|
7904
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: QueueContainerComponent, isStandalone: false, selector: "lib-queue-container", inputs: { placeholder: "placeholder", selectedRowsInput: "selectedRowsInput" }, outputs: { assignmentComplete: "assignmentComplete", userAssigned: "userAssigned", selectedRowsData: "selectedRowsData", assignmentDataReady: "assignmentDataReady", rowClick: "rowClick", selectionChange: "selectionChange", isAllRowSelected: "isAllRowSelected", excludedApplicationIds: "excludedApplicationIds" }, viewQueries: [{ propertyName: "filterDropdown", first: true, predicate: ["filterDropdown"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"container grid m-0 h-full\">\n <div class=\"col-12 xl:col-2 md:col-12 py-0 pl-0 h-full\">\n <lib-skeleton *ngIf=\"loading\" [isAllowCard]=\"true\" [count]=\"5\" [width]=\"'100%'\" [height]=\"'4.5rem'\"></lib-skeleton>\n @if(!loading){\n <div class=\"queue-list-container-wrapper p-0\">\n <app-queue-list\n [queueData]=\"filteredQueueData\"\n [selectedQueueId]=\"selectedQueueId\"\n [selectedStatus]=\"selectedStatus\"\n [userRole]=\"userRole\"\n [showQueueDataForm]=\"true\"\n (queueSelected)=\"onQueueSelected($event)\"\n (statusChanged)=\"onStatusChanged($event)\"\n (insertQueueRequested)=\"onInsertQueueRequested()\"\n ></app-queue-list>\n </div>\n }\n </div>\n <div class=\"col-12 xl:col-10 md:col-12 py-0 h-full\">\n @if(selectedQueue){\n <div class=\"queue-application-container-wrapper h-full\">\n <div class=\"grid m-0 justify-content-between align-items-center mb-3\">\n <div class=\"col-8 p-0 flex align-items-center\">\n <div class=\"col-7 p-0 mr-3\">\n <queue-search \n [placeholder]=\"placeholder\"\n [searchText]=\"searchText\"\n (searchInputChanged)=\"onSearchInputChanged($event)\"\n (searchRequested)=\"onSearchRequested($event)\"\n (searchCleared)=\"onSearchCleared()\">\n </queue-search>\n </div>\n <div>\n <lib-queue-filter-dropdown \n #filterDropdown\n [appliedFilters]=\"appliedFilters\"\n (filterApplied)=\"onFilterDropdownApplied($event)\"\n (filtersCleared)=\"onFiltersCleared()\">\n </lib-queue-filter-dropdown>\n </div>\n <div *ngIf=\"hasActiveFilters\">\n <button \n class=\"clear-filters-btn\"\n type=\"button\"\n (click)=\"onClearAllFilters()\">\n Clear <i class=\"pi pi-times ml-2\"></i>\n </button>\n </div>\n </div>\n \n <div class=\"flex align-items-center gap-3 col-3 py-0 pl-0 justify-content-end\">\n <ng-content select=\"[user-dropdown]\"></ng-content>\n </div>\n </div>\n\n <div class=\"animation-duration-500 associated-list queue-table-container-wrapper custom-scroll mb-0 p-0\">\n \n <app-queue-record-table\n [table]=\"table\"\n [metaData]=\"metaData\"\n [loading]=\"loading\"\n [selectedRows]=\"selectedRows\"\n [resetSort]=\"resetSort\"\n [isShowSkeleton]=\"isShowSkeleton\"\n [selectedQueue]=\"selectedQueue\"\n (selectionChange)=\"onTableSelectionChange($event)\"\n (selectedRowsData)=\"onTableSelectionChange($event)\"\n (assignmentDataReady)=\"onAssignmentDataReady($event)\"\n (rowClick)=\"onTableRowClick($event)\"\n (paginationChanged)=\"onPaginationChanged($event)\"\n (filterApplied)=\"onFilterApplied($event)\"\n (sortApplied)=\"onSortApplied($event)\">\n </app-queue-record-table>\n </div>\n </div>\n }\n </div>\n\n </div>", styles: [".custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}.queue-table-container-wrapper{height:calc(100% - 58px)}.queue-application-container-wrapper,.queue-list-container-wrapper{background-color:#fff;border-radius:10px}.queue-application-container-wrapper{padding:18px 11px 18px 18px}.clear-filters-btn{background:none;border:none;color:#2196f3;font-size:1.1rem;cursor:pointer;margin-left:.5rem;display:inline-flex;align-items:center;padding:0}.clear-filters-btn .clear-x{font-size:1.2rem;margin-left:.2rem;line-height:1}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SkeletonComponent, selector: "lib-skeleton", inputs: ["count", "columns", "width", "height", "isAllowCard"] }, { kind: "component", type: QueueSearchComponent, selector: "queue-search", inputs: ["searchText", "placeholder", "debounceTime"], outputs: ["searchInputChanged", "searchRequested", "searchCleared"] }, { kind: "component", type: QueueListComponent, selector: "app-queue-list", inputs: ["queueData", "selectedQueueId", "selectedStatus", "userRole", "showQueueDataForm"], outputs: ["queueSelected", "statusChanged", "insertQueueRequested"] }, { kind: "component", type: QueueRecordTableComponent, selector: "app-queue-record-table", inputs: ["table", "metaData", "loading", "selectedRows", "resetSort", "isShowSkeleton", "selectedQueue"], outputs: ["selectionChange", "selectedRowsData", "assignmentDataReady", "rowClick", "paginationChanged", "filterApplied", "sortApplied"] }, { kind: "component", type: QueueFilterDropdownComponent, selector: "lib-queue-filter-dropdown", inputs: ["appliedFilters"], outputs: ["filterApplied", "filtersCleared"] }] });
|
|
7905
7905
|
}
|
|
7906
7906
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: QueueContainerComponent, decorators: [{
|
|
7907
7907
|
type: Component,
|
|
7908
|
-
args: [{ selector: 'lib-queue-container', standalone: false, template: "<div class=\"container grid m-0 h-full\">\
|
|
7908
|
+
args: [{ selector: 'lib-queue-container', standalone: false, template: "<div class=\"container grid m-0 h-full\">\n <div class=\"col-12 xl:col-2 md:col-12 py-0 pl-0 h-full\">\n <lib-skeleton *ngIf=\"loading\" [isAllowCard]=\"true\" [count]=\"5\" [width]=\"'100%'\" [height]=\"'4.5rem'\"></lib-skeleton>\n @if(!loading){\n <div class=\"queue-list-container-wrapper p-0\">\n <app-queue-list\n [queueData]=\"filteredQueueData\"\n [selectedQueueId]=\"selectedQueueId\"\n [selectedStatus]=\"selectedStatus\"\n [userRole]=\"userRole\"\n [showQueueDataForm]=\"true\"\n (queueSelected)=\"onQueueSelected($event)\"\n (statusChanged)=\"onStatusChanged($event)\"\n (insertQueueRequested)=\"onInsertQueueRequested()\"\n ></app-queue-list>\n </div>\n }\n </div>\n <div class=\"col-12 xl:col-10 md:col-12 py-0 h-full\">\n @if(selectedQueue){\n <div class=\"queue-application-container-wrapper h-full\">\n <div class=\"grid m-0 justify-content-between align-items-center mb-3\">\n <div class=\"col-8 p-0 flex align-items-center\">\n <div class=\"col-7 p-0 mr-3\">\n <queue-search \n [placeholder]=\"placeholder\"\n [searchText]=\"searchText\"\n (searchInputChanged)=\"onSearchInputChanged($event)\"\n (searchRequested)=\"onSearchRequested($event)\"\n (searchCleared)=\"onSearchCleared()\">\n </queue-search>\n </div>\n <div>\n <lib-queue-filter-dropdown \n #filterDropdown\n [appliedFilters]=\"appliedFilters\"\n (filterApplied)=\"onFilterDropdownApplied($event)\"\n (filtersCleared)=\"onFiltersCleared()\">\n </lib-queue-filter-dropdown>\n </div>\n <div *ngIf=\"hasActiveFilters\">\n <button \n class=\"clear-filters-btn\"\n type=\"button\"\n (click)=\"onClearAllFilters()\">\n Clear <i class=\"pi pi-times ml-2\"></i>\n </button>\n </div>\n </div>\n \n <div class=\"flex align-items-center gap-3 col-3 py-0 pl-0 justify-content-end\">\n <ng-content select=\"[user-dropdown]\"></ng-content>\n </div>\n </div>\n\n <div class=\"animation-duration-500 associated-list queue-table-container-wrapper custom-scroll mb-0 p-0\">\n \n <app-queue-record-table\n [table]=\"table\"\n [metaData]=\"metaData\"\n [loading]=\"loading\"\n [selectedRows]=\"selectedRows\"\n [resetSort]=\"resetSort\"\n [isShowSkeleton]=\"isShowSkeleton\"\n [selectedQueue]=\"selectedQueue\"\n (selectionChange)=\"onTableSelectionChange($event)\"\n (selectedRowsData)=\"onTableSelectionChange($event)\"\n (assignmentDataReady)=\"onAssignmentDataReady($event)\"\n (rowClick)=\"onTableRowClick($event)\"\n (paginationChanged)=\"onPaginationChanged($event)\"\n (filterApplied)=\"onFilterApplied($event)\"\n (sortApplied)=\"onSortApplied($event)\">\n </app-queue-record-table>\n </div>\n </div>\n }\n </div>\n\n </div>", styles: [".custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}.queue-table-container-wrapper{height:calc(100% - 58px)}.queue-application-container-wrapper,.queue-list-container-wrapper{background-color:#fff;border-radius:10px}.queue-application-container-wrapper{padding:18px 11px 18px 18px}.clear-filters-btn{background:none;border:none;color:#2196f3;font-size:1.1rem;cursor:pointer;margin-left:.5rem;display:inline-flex;align-items:center;padding:0}.clear-filters-btn .clear-x{font-size:1.2rem;margin-left:.2rem;line-height:1}\n"] }]
|
|
7909
7909
|
}], ctorParameters: () => [{ type: QueueStore$1 }, { type: QueueService }, { type: BaseStore }, { type: QueueBusinessService }, { type: QueueRecordTableBuilderService }, { type: QueueFilterDropdownService }, { type: BaseQuery }], propDecorators: { placeholder: [{
|
|
7910
7910
|
type: Input
|
|
7911
7911
|
}], filterDropdown: [{
|