cat-qw-lib 0.43.73 → 0.44.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/cat-qw-lib.mjs +19 -14
- package/fesm2022/cat-qw-lib.mjs.map +1 -1
- package/lib/widget/components/widget-container/widget-container.component.d.ts +3 -2
- package/lib/widget/components/widget-header/widget-header.component.d.ts +3 -2
- package/lib/widget/models/progress-chart.model.d.ts +9 -0
- package/lib/widget/widget.module.d.ts +2 -1
- package/package.json +1 -1
package/fesm2022/cat-qw-lib.mjs
CHANGED
|
@@ -66,6 +66,8 @@ import { QuillModule, QuillConfigModule } from 'ngx-quill';
|
|
|
66
66
|
import * as i5$3 from 'primeng/tabview';
|
|
67
67
|
import { TabViewModule } from 'primeng/tabview';
|
|
68
68
|
import hljs from 'highlight.js';
|
|
69
|
+
import * as i2$3 from 'primeng/chart';
|
|
70
|
+
import { ChartModule } from 'primeng/chart';
|
|
69
71
|
|
|
70
72
|
class SHARED {
|
|
71
73
|
static EMPTY = "";
|
|
@@ -1735,11 +1737,11 @@ class CustomWidgetComponent {
|
|
|
1735
1737
|
return this.widgetUtilService.getEventIndex(event, this.widgetData);
|
|
1736
1738
|
}
|
|
1737
1739
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: CustomWidgetComponent, deps: [{ token: CustomWidgetService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1738
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: CustomWidgetComponent, isStandalone: false, selector: "lib-custom-widget", inputs: { widgetData: "widgetData" }, ngImport: i0, template: "@if(widgetData){\r\n<div class=\"custom-widget\">\r\n\r\n <div class=\" ml-3\" style=\"display: flex; flex-direction: row; align-items: center;\">\r\n <h3 class=\"mb-0 font-bold mr-3 widgetData-title-wrapper\">\r\n {{ (widgetData.title) }}\r\n </h3>\r\n \r\n <span class=\"px-2 py-1 rounded text-white font-semibold badge\" [ngClass]=\"{\r\n 'bg-yellow-500': widgetData.badge === 'Pending',\r\n 'bg-green-500': widgetData.badge === 'Verified'\r\n }\">\r\n <i class=\"{{ widgetData.badgeIcon }}\"></i> {{ widgetData.badge }}\r\n </span>\r\n \r\n </div>\r\n <div class=\"widget-body-wrapper\">\r\n\r\n <p-timeline class=\"widget-timeline-wrapper\" [value]=\"widgetData?.statusList\">\r\n <ng-template pTemplate=\"marker\" let-event let-i=\"index\">\r\n <div class=\"p-timeline-event-marker\" [ngStyle]=\"{\r\n 'background-color': event.status === 'active' ? '#0F8BFD' :\r\n event.status === 'pending' ? '#676B89' :\r\n event.status === 'removed' ? '#FF0000' :\r\n '#0F8BFD',\r\n 'border-color': event.status === 'active' ? '#0F8BFD' :\r\n event.status === 'pending' ? '#676B89' :\r\n event.status === 'removed' ? '#FF0000' :\r\n '#0F8BFD',\r\n 'outline': event.status === 'active' ? '4px solid #0f8bfd33' :\r\n event.status === 'pending' ? '4px solid #676b8933' :\r\n event.status === 'removed' ? '4px solid #FF0000' :\r\n '4px solid #0F8BFD',\r\n }\"></div>\r\n\r\n <div class=\"p-timeline-event-connector-border\" *ngIf=\"!isLastIndex(event)\" [ngStyle]=\"{\r\n border:\r\n getNextEventStatus(event) === 'active'\r\n ? '2px solid #0F8BFD'\r\n : getNextEventStatus(event) === 'pending'\r\n ? '2px solid #44486d33'\r\n : getNextEventStatus(event) === 'removed'\r\n ? '2px solid #FF0000'\r\n : '2px solid #0F8BFD',\r\n height: 'calc(100% - 18px)'\r\n }\"></div>\r\n </ng-template>\r\n\r\n <ng-template pTemplate=\"content\" let-event>\r\n <div class=\"p-timeline-event-content mb-2\"\r\n [ngClass]=\"{ 'mb-4': widgetData.title === 'Valuation' && event.title }\">\r\n\r\n <p *ngIf=\"!(widgetData.title === 'Valuation') && event.title\" class=\"event-title mb-2\"\r\n [innerHTML]=\"event.title\">\r\n </p>\r\n\r\n <p *ngIf=\"widgetData.title === 'Valuation' && event.title\" class=\"event-title mb-2\">\r\n <span style=\"color: #0f8bfd; text-decoration: underline; font-weight: bold\">{{ event.title?.split(' ')[0]\r\n }}</span>\r\n {{ event.title?.substring(event.title.indexOf(' ') + 1) }}\r\n </p>\r\n \r\n <span class=\"font-medium event-description\" [ngClass]=\"{ 'font-bold': event.textColor }\"\r\n [ngStyle]=\"{ color: event.textColor }\" [innerHTML]=\"event.description\"></span>\r\n </div>\r\n </ng-template>\r\n </p-timeline>\r\n </div>\r\n</div>\r\n\r\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}.widgetData-title-wrapper{font-size:
|
|
1740
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: CustomWidgetComponent, isStandalone: false, selector: "lib-custom-widget", inputs: { widgetData: "widgetData" }, ngImport: i0, template: "@if(widgetData){\r\n<div class=\"custom-widget\">\r\n\r\n <div class=\" ml-3\" style=\"display: flex; flex-direction: row; align-items: center;\">\r\n <h3 class=\"mb-0 font-bold mr-3 widgetData-title-wrapper\">\r\n {{ (widgetData.title) }}\r\n </h3>\r\n \r\n <span class=\"px-2 py-1 rounded text-white font-semibold badge\" [ngClass]=\"{\r\n 'bg-yellow-500': widgetData.badge === 'Pending',\r\n 'bg-green-500': widgetData.badge === 'Verified'\r\n }\">\r\n <i class=\"{{ widgetData.badgeIcon }}\"></i> {{ widgetData.badge }}\r\n </span>\r\n \r\n </div>\r\n <div class=\"widget-body-wrapper\">\r\n\r\n <p-timeline class=\"widget-timeline-wrapper\" [value]=\"widgetData?.statusList\">\r\n <ng-template pTemplate=\"marker\" let-event let-i=\"index\">\r\n <div class=\"p-timeline-event-marker\" [ngStyle]=\"{\r\n 'background-color': event.status === 'active' ? '#0F8BFD' :\r\n event.status === 'pending' ? '#676B89' :\r\n event.status === 'removed' ? '#FF0000' :\r\n '#0F8BFD',\r\n 'border-color': event.status === 'active' ? '#0F8BFD' :\r\n event.status === 'pending' ? '#676B89' :\r\n event.status === 'removed' ? '#FF0000' :\r\n '#0F8BFD',\r\n 'outline': event.status === 'active' ? '4px solid #0f8bfd33' :\r\n event.status === 'pending' ? '4px solid #676b8933' :\r\n event.status === 'removed' ? '4px solid #FF0000' :\r\n '4px solid #0F8BFD',\r\n }\"></div>\r\n\r\n <div class=\"p-timeline-event-connector-border\" *ngIf=\"!isLastIndex(event)\" [ngStyle]=\"{\r\n border:\r\n getNextEventStatus(event) === 'active'\r\n ? '2px solid #0F8BFD'\r\n : getNextEventStatus(event) === 'pending'\r\n ? '2px solid #44486d33'\r\n : getNextEventStatus(event) === 'removed'\r\n ? '2px solid #FF0000'\r\n : '2px solid #0F8BFD',\r\n height: 'calc(100% - 18px)'\r\n }\"></div>\r\n </ng-template>\r\n\r\n <ng-template pTemplate=\"content\" let-event>\r\n <div class=\"p-timeline-event-content mb-2\"\r\n [ngClass]=\"{ 'mb-4': widgetData.title === 'Valuation' && event.title }\">\r\n\r\n <p *ngIf=\"!(widgetData.title === 'Valuation') && event.title\" class=\"event-title mb-2\"\r\n [innerHTML]=\"event.title\">\r\n </p>\r\n\r\n <p *ngIf=\"widgetData.title === 'Valuation' && event.title\" class=\"event-title mb-2\">\r\n <span style=\"color: #0f8bfd; text-decoration: underline; font-weight: bold\">{{ event.title?.split(' ')[0]\r\n }}</span>\r\n {{ event.title?.substring(event.title.indexOf(' ') + 1) }}\r\n </p>\r\n \r\n <span class=\"font-medium event-description\" [ngClass]=\"{ 'font-bold': event.textColor }\"\r\n [ngStyle]=\"{ color: event.textColor }\" [innerHTML]=\"event.description\"></span>\r\n </div>\r\n </ng-template>\r\n </p-timeline>\r\n </div>\r\n</div>\r\n\r\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"] }] });
|
|
1739
1741
|
}
|
|
1740
1742
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: CustomWidgetComponent, decorators: [{
|
|
1741
1743
|
type: Component,
|
|
1742
|
-
args: [{ selector: "lib-custom-widget", standalone: false, template: "@if(widgetData){\r\n<div class=\"custom-widget\">\r\n\r\n <div class=\" ml-3\" style=\"display: flex; flex-direction: row; align-items: center;\">\r\n <h3 class=\"mb-0 font-bold mr-3 widgetData-title-wrapper\">\r\n {{ (widgetData.title) }}\r\n </h3>\r\n \r\n <span class=\"px-2 py-1 rounded text-white font-semibold badge\" [ngClass]=\"{\r\n 'bg-yellow-500': widgetData.badge === 'Pending',\r\n 'bg-green-500': widgetData.badge === 'Verified'\r\n }\">\r\n <i class=\"{{ widgetData.badgeIcon }}\"></i> {{ widgetData.badge }}\r\n </span>\r\n \r\n </div>\r\n <div class=\"widget-body-wrapper\">\r\n\r\n <p-timeline class=\"widget-timeline-wrapper\" [value]=\"widgetData?.statusList\">\r\n <ng-template pTemplate=\"marker\" let-event let-i=\"index\">\r\n <div class=\"p-timeline-event-marker\" [ngStyle]=\"{\r\n 'background-color': event.status === 'active' ? '#0F8BFD' :\r\n event.status === 'pending' ? '#676B89' :\r\n event.status === 'removed' ? '#FF0000' :\r\n '#0F8BFD',\r\n 'border-color': event.status === 'active' ? '#0F8BFD' :\r\n event.status === 'pending' ? '#676B89' :\r\n event.status === 'removed' ? '#FF0000' :\r\n '#0F8BFD',\r\n 'outline': event.status === 'active' ? '4px solid #0f8bfd33' :\r\n event.status === 'pending' ? '4px solid #676b8933' :\r\n event.status === 'removed' ? '4px solid #FF0000' :\r\n '4px solid #0F8BFD',\r\n }\"></div>\r\n\r\n <div class=\"p-timeline-event-connector-border\" *ngIf=\"!isLastIndex(event)\" [ngStyle]=\"{\r\n border:\r\n getNextEventStatus(event) === 'active'\r\n ? '2px solid #0F8BFD'\r\n : getNextEventStatus(event) === 'pending'\r\n ? '2px solid #44486d33'\r\n : getNextEventStatus(event) === 'removed'\r\n ? '2px solid #FF0000'\r\n : '2px solid #0F8BFD',\r\n height: 'calc(100% - 18px)'\r\n }\"></div>\r\n </ng-template>\r\n\r\n <ng-template pTemplate=\"content\" let-event>\r\n <div class=\"p-timeline-event-content mb-2\"\r\n [ngClass]=\"{ 'mb-4': widgetData.title === 'Valuation' && event.title }\">\r\n\r\n <p *ngIf=\"!(widgetData.title === 'Valuation') && event.title\" class=\"event-title mb-2\"\r\n [innerHTML]=\"event.title\">\r\n </p>\r\n\r\n <p *ngIf=\"widgetData.title === 'Valuation' && event.title\" class=\"event-title mb-2\">\r\n <span style=\"color: #0f8bfd; text-decoration: underline; font-weight: bold\">{{ event.title?.split(' ')[0]\r\n }}</span>\r\n {{ event.title?.substring(event.title.indexOf(' ') + 1) }}\r\n </p>\r\n \r\n <span class=\"font-medium event-description\" [ngClass]=\"{ 'font-bold': event.textColor }\"\r\n [ngStyle]=\"{ color: event.textColor }\" [innerHTML]=\"event.description\"></span>\r\n </div>\r\n </ng-template>\r\n </p-timeline>\r\n </div>\r\n</div>\r\n\r\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}.widgetData-title-wrapper{font-size:
|
|
1744
|
+
args: [{ selector: "lib-custom-widget", standalone: false, template: "@if(widgetData){\r\n<div class=\"custom-widget\">\r\n\r\n <div class=\" ml-3\" style=\"display: flex; flex-direction: row; align-items: center;\">\r\n <h3 class=\"mb-0 font-bold mr-3 widgetData-title-wrapper\">\r\n {{ (widgetData.title) }}\r\n </h3>\r\n \r\n <span class=\"px-2 py-1 rounded text-white font-semibold badge\" [ngClass]=\"{\r\n 'bg-yellow-500': widgetData.badge === 'Pending',\r\n 'bg-green-500': widgetData.badge === 'Verified'\r\n }\">\r\n <i class=\"{{ widgetData.badgeIcon }}\"></i> {{ widgetData.badge }}\r\n </span>\r\n \r\n </div>\r\n <div class=\"widget-body-wrapper\">\r\n\r\n <p-timeline class=\"widget-timeline-wrapper\" [value]=\"widgetData?.statusList\">\r\n <ng-template pTemplate=\"marker\" let-event let-i=\"index\">\r\n <div class=\"p-timeline-event-marker\" [ngStyle]=\"{\r\n 'background-color': event.status === 'active' ? '#0F8BFD' :\r\n event.status === 'pending' ? '#676B89' :\r\n event.status === 'removed' ? '#FF0000' :\r\n '#0F8BFD',\r\n 'border-color': event.status === 'active' ? '#0F8BFD' :\r\n event.status === 'pending' ? '#676B89' :\r\n event.status === 'removed' ? '#FF0000' :\r\n '#0F8BFD',\r\n 'outline': event.status === 'active' ? '4px solid #0f8bfd33' :\r\n event.status === 'pending' ? '4px solid #676b8933' :\r\n event.status === 'removed' ? '4px solid #FF0000' :\r\n '4px solid #0F8BFD',\r\n }\"></div>\r\n\r\n <div class=\"p-timeline-event-connector-border\" *ngIf=\"!isLastIndex(event)\" [ngStyle]=\"{\r\n border:\r\n getNextEventStatus(event) === 'active'\r\n ? '2px solid #0F8BFD'\r\n : getNextEventStatus(event) === 'pending'\r\n ? '2px solid #44486d33'\r\n : getNextEventStatus(event) === 'removed'\r\n ? '2px solid #FF0000'\r\n : '2px solid #0F8BFD',\r\n height: 'calc(100% - 18px)'\r\n }\"></div>\r\n </ng-template>\r\n\r\n <ng-template pTemplate=\"content\" let-event>\r\n <div class=\"p-timeline-event-content mb-2\"\r\n [ngClass]=\"{ 'mb-4': widgetData.title === 'Valuation' && event.title }\">\r\n\r\n <p *ngIf=\"!(widgetData.title === 'Valuation') && event.title\" class=\"event-title mb-2\"\r\n [innerHTML]=\"event.title\">\r\n </p>\r\n\r\n <p *ngIf=\"widgetData.title === 'Valuation' && event.title\" class=\"event-title mb-2\">\r\n <span style=\"color: #0f8bfd; text-decoration: underline; font-weight: bold\">{{ event.title?.split(' ')[0]\r\n }}</span>\r\n {{ event.title?.substring(event.title.indexOf(' ') + 1) }}\r\n </p>\r\n \r\n <span class=\"font-medium event-description\" [ngClass]=\"{ 'font-bold': event.textColor }\"\r\n [ngStyle]=\"{ color: event.textColor }\" [innerHTML]=\"event.description\"></span>\r\n </div>\r\n </ng-template>\r\n </p-timeline>\r\n </div>\r\n</div>\r\n\r\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"] }]
|
|
1743
1745
|
}], ctorParameters: () => [{ type: CustomWidgetService }], propDecorators: { widgetData: [{
|
|
1744
1746
|
type: Input
|
|
1745
1747
|
}] } });
|
|
@@ -4107,16 +4109,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImpor
|
|
|
4107
4109
|
|
|
4108
4110
|
class WidgetHeaderComponent {
|
|
4109
4111
|
widget;
|
|
4110
|
-
|
|
4112
|
+
progressChartData;
|
|
4111
4113
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4112
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: WidgetHeaderComponent, isStandalone: false, selector: "lib-widget-header", inputs: { widget: "widget",
|
|
4114
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: WidgetHeaderComponent, isStandalone: false, selector: "lib-widget-header", inputs: { widget: "widget", progressChartData: "progressChartData" }, ngImport: i0, template: "<div class=\"grid m-0 align-items-center justify-content-between px-3\">\r\n <div class=\"col-10 p-0\">\r\n <div class=\"flex align-items-center\">\r\n <h3 class=\"mb-0 application-title-wrapper font-bold mr-3\">\r\n {{ (widget.header) }}\r\n </h3>\r\n </div>\r\n <div *ngIf=\"widget?.subHeader\" class=\"flex align-items-center mt-2\">\r\n <span class=\"mr-1\">Risk Rating:</span>\r\n <span class=\"mr-3 font-semibold\" [ngClass]=\"{\r\n 'text-red-500': widget.subHeader === 'High',\r\n 'text-green-500': widget.subHeader === 'Low',\r\n 'text-yellow-500': widget.subHeader === 'Medium'\r\n }\">{{ widget.subHeader }}</span>\r\n </div>\r\n </div>\r\n @if(widget.predefinedName == \"ApplicationWidget\") {\r\n <div class=\"chart-container\">\r\n <p-chart type=\"pie\" [data]=\"progressChartData\" height=\"50px\" width=\"50px\"></p-chart>\r\n <p class=\"percentage-label text-green-500 text-lg\">{{ progressChartData.datasets[0].data[0] }}%</p>\r\n </div>\r\n }\r\n\r\n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}.application-title-wrapper{font-size:18px;font-weight:700}.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$3.UIChart, selector: "p-chart", inputs: ["type", "plugins", "width", "height", "responsive", "ariaLabel", "ariaLabelledBy", "data", "options"], outputs: ["onDataSelect"] }] });
|
|
4113
4115
|
}
|
|
4114
4116
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetHeaderComponent, decorators: [{
|
|
4115
4117
|
type: Component,
|
|
4116
|
-
args: [{ selector: 'lib-widget-header', standalone: false, template: "<div class=\"grid m-0 align-items-center justify-content-between px-3\">\r\n <div class=\"col-10 p-0\">\r\n <div class=\"flex align-items-center\">\r\n <h3 class=\"mb-0 application-title-wrapper font-bold mr-3\">\r\n {{ (widget.header) }}\r\n </h3>\r\n </div>\r\n <div *ngIf=\"widget?.subHeader\" class=\"flex align-items-center mt-2\">\r\n <span class=\"mr-1\">Risk Rating:</span>\r\n <span class=\"mr-3 font-semibold\" [ngClass]=\"{\r\n 'text-red-500': widget.subHeader === 'High',\r\n 'text-green-500': widget.subHeader === 'Low',\r\n 'text-yellow-500': widget.subHeader === 'Medium'\r\n }\">{{ widget.subHeader }}</span>\r\n </div>\r\n </div>\r\n @if(
|
|
4118
|
+
args: [{ selector: 'lib-widget-header', standalone: false, template: "<div class=\"grid m-0 align-items-center justify-content-between px-3\">\r\n <div class=\"col-10 p-0\">\r\n <div class=\"flex align-items-center\">\r\n <h3 class=\"mb-0 application-title-wrapper font-bold mr-3\">\r\n {{ (widget.header) }}\r\n </h3>\r\n </div>\r\n <div *ngIf=\"widget?.subHeader\" class=\"flex align-items-center mt-2\">\r\n <span class=\"mr-1\">Risk Rating:</span>\r\n <span class=\"mr-3 font-semibold\" [ngClass]=\"{\r\n 'text-red-500': widget.subHeader === 'High',\r\n 'text-green-500': widget.subHeader === 'Low',\r\n 'text-yellow-500': widget.subHeader === 'Medium'\r\n }\">{{ widget.subHeader }}</span>\r\n </div>\r\n </div>\r\n @if(widget.predefinedName == \"ApplicationWidget\") {\r\n <div class=\"chart-container\">\r\n <p-chart type=\"pie\" [data]=\"progressChartData\" height=\"50px\" width=\"50px\"></p-chart>\r\n <p class=\"percentage-label text-green-500 text-lg\">{{ progressChartData.datasets[0].data[0] }}%</p>\r\n </div>\r\n }\r\n\r\n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}.application-title-wrapper{font-size:18px;font-weight:700}.chart-container{display:flex;flex-direction:column;align-items:center;justify-content:center}\n"] }]
|
|
4117
4119
|
}], propDecorators: { widget: [{
|
|
4118
4120
|
type: Input
|
|
4119
|
-
}],
|
|
4121
|
+
}], progressChartData: [{
|
|
4120
4122
|
type: Input
|
|
4121
4123
|
}] } });
|
|
4122
4124
|
|
|
@@ -4228,10 +4230,10 @@ class WidgetContainerComponent {
|
|
|
4228
4230
|
isLoading = true;
|
|
4229
4231
|
onViewAllDetails = new EventEmitter();
|
|
4230
4232
|
onViewAllProperties = new EventEmitter();
|
|
4231
|
-
showEditionalFeild = SHARED.FALSE;
|
|
4232
4233
|
isSidebarVisible = SHARED.FALSE;
|
|
4233
4234
|
offerWidgetData;
|
|
4234
4235
|
valuationWidgetData;
|
|
4236
|
+
progressChartData;
|
|
4235
4237
|
ngOnInit() {
|
|
4236
4238
|
const detailsSubscription = this.widgetQuery.getOnViewAllDetails()?.subscribe((res) => {
|
|
4237
4239
|
if (res) {
|
|
@@ -4298,23 +4300,23 @@ class WidgetContainerComponent {
|
|
|
4298
4300
|
this.destroy$.complete();
|
|
4299
4301
|
}
|
|
4300
4302
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetContainerComponent, deps: [{ token: WidgetService }, { token: i3$4.ActivatedRoute }, { token: WidgetQuery }, { token: WidgetStore }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4301
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.4", type: WidgetContainerComponent, isStandalone: false, selector: "lib-widget-container", inputs: {
|
|
4303
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.4", type: WidgetContainerComponent, isStandalone: false, selector: "lib-widget-container", inputs: { isSidebarVisible: "isSidebarVisible", offerWidgetData: "offerWidgetData", valuationWidgetData: "valuationWidgetData", progressChartData: "progressChartData" }, outputs: { onViewAllDetails: "onViewAllDetails", onViewAllProperties: "onViewAllProperties" }, usesOnChanges: true, ngImport: i0, template: "<p-card class=\"widget-block-wrapper block\">\r\n <div class=\"widget-section-wrapper custom-scroll pt-2\">\r\n <!-- Loading state -->\r\n <ng-container *ngIf=\"isLoading; else widgetContent\">\r\n <p class=\"text-color ml-3 font-semibold\">Widget configuration loading...</p>\r\n </ng-container>\r\n\r\n <!-- Content after API call -->\r\n <ng-template #widgetContent>\r\n <ng-container *ngIf=\"(widgets && widgets.length > 0) || (valuationWidgetData || offerWidgetData); else noWidgets\">\r\n <ng-container *ngFor=\"let widget of widgets; let i = index\">\r\n <div class=\"widget-container-wrapper pl-1\" [ngClass]=\"i !== 0 ? 'mt-4' : ''\">\r\n <lib-widget-header [widget]=\"widget\" [progressChartData]=\"progressChartData\"></lib-widget-header>\r\n <div class=\"widget-content-wrapper mt-3 py-3\">\r\n <lib-widget-body [widget]=\"widget\"></lib-widget-body>\r\n <lib-widget-footer [widget]=\"widget\"></lib-widget-footer>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"offerWidgetData\">\r\n <lib-custom-widget [widgetData]=\"offerWidgetData\"></lib-custom-widget>\r\n </ng-container>\r\n <ng-container *ngIf=\"valuationWidgetData\">\r\n <lib-custom-widget [widgetData]=\"valuationWidgetData\"></lib-custom-widget>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- No widget configured state -->\r\n <ng-template #noWidgets>\r\n <p class=\"text-color ml-3 font-semibold\">No Widgets Configured</p>\r\n </ng-template>\r\n </ng-template>\r\n </div>\r\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%;box-shadow:none}::ng-deep .widget-block-wrapper .p-card-body{padding:0;height:100%}::ng-deep .widget-block-wrapper .p-card-content{padding-bottom: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-content-wrapper{border-top:1px solid rgba(68,72,109,.1)}: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: CustomWidgetComponent, selector: "lib-custom-widget", inputs: ["widgetData"] }, { kind: "component", type: WidgetHeaderComponent, selector: "lib-widget-header", inputs: ["widget", "progressChartData"] }, { kind: "component", type: WidgetFooterComponent, selector: "lib-widget-footer", inputs: ["widget"] }, { kind: "component", type: WidgetBodyComponent, selector: "lib-widget-body", inputs: ["widget"] }] });
|
|
4302
4304
|
}
|
|
4303
4305
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetContainerComponent, decorators: [{
|
|
4304
4306
|
type: Component,
|
|
4305
|
-
args: [{ selector: 'lib-widget-container', standalone: false, template: "<p-card class=\"widget-block-wrapper block\">\r\n <div class=\"widget-section-wrapper custom-scroll pt-2\">\r\n <!-- Loading state -->\r\n <ng-container *ngIf=\"isLoading; else widgetContent\">\r\n <p class=\"text-color ml-3 font-semibold\">Widget configuration loading...</p>\r\n </ng-container>\r\n\r\n <!-- Content after API call -->\r\n <ng-template #widgetContent>\r\n <ng-container *ngIf=\"(widgets && widgets.length > 0) || (valuationWidgetData || offerWidgetData); else noWidgets\">\r\n <ng-container *ngFor=\"let widget of widgets; let i = index\">\r\n <div class=\"widget-container-wrapper pl-1\" [ngClass]=\"i !== 0 ? 'mt-4' : ''\">\r\n <lib-widget-header [widget]=\"widget\" [
|
|
4307
|
+
args: [{ selector: 'lib-widget-container', standalone: false, template: "<p-card class=\"widget-block-wrapper block\">\r\n <div class=\"widget-section-wrapper custom-scroll pt-2\">\r\n <!-- Loading state -->\r\n <ng-container *ngIf=\"isLoading; else widgetContent\">\r\n <p class=\"text-color ml-3 font-semibold\">Widget configuration loading...</p>\r\n </ng-container>\r\n\r\n <!-- Content after API call -->\r\n <ng-template #widgetContent>\r\n <ng-container *ngIf=\"(widgets && widgets.length > 0) || (valuationWidgetData || offerWidgetData); else noWidgets\">\r\n <ng-container *ngFor=\"let widget of widgets; let i = index\">\r\n <div class=\"widget-container-wrapper pl-1\" [ngClass]=\"i !== 0 ? 'mt-4' : ''\">\r\n <lib-widget-header [widget]=\"widget\" [progressChartData]=\"progressChartData\"></lib-widget-header>\r\n <div class=\"widget-content-wrapper mt-3 py-3\">\r\n <lib-widget-body [widget]=\"widget\"></lib-widget-body>\r\n <lib-widget-footer [widget]=\"widget\"></lib-widget-footer>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"offerWidgetData\">\r\n <lib-custom-widget [widgetData]=\"offerWidgetData\"></lib-custom-widget>\r\n </ng-container>\r\n <ng-container *ngIf=\"valuationWidgetData\">\r\n <lib-custom-widget [widgetData]=\"valuationWidgetData\"></lib-custom-widget>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <!-- No widget configured state -->\r\n <ng-template #noWidgets>\r\n <p class=\"text-color ml-3 font-semibold\">No Widgets Configured</p>\r\n </ng-template>\r\n </ng-template>\r\n </div>\r\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%;box-shadow:none}::ng-deep .widget-block-wrapper .p-card-body{padding:0;height:100%}::ng-deep .widget-block-wrapper .p-card-content{padding-bottom: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-content-wrapper{border-top:1px solid rgba(68,72,109,.1)}:host ::-webkit-scrollbar{width:6px}:host ::-webkit-scrollbar-track{background:transparent}:host ::-webkit-scrollbar-thumb{background:#d1d5db94;border-radius:20px}\n"] }]
|
|
4306
4308
|
}], ctorParameters: () => [{ type: WidgetService }, { type: i3$4.ActivatedRoute }, { type: WidgetQuery }, { type: WidgetStore }, { type: i0.ChangeDetectorRef }], propDecorators: { onViewAllDetails: [{
|
|
4307
4309
|
type: Output
|
|
4308
4310
|
}], onViewAllProperties: [{
|
|
4309
4311
|
type: Output
|
|
4310
|
-
}], showEditionalFeild: [{
|
|
4311
|
-
type: Input
|
|
4312
4312
|
}], isSidebarVisible: [{
|
|
4313
4313
|
type: Input
|
|
4314
4314
|
}], offerWidgetData: [{
|
|
4315
4315
|
type: Input
|
|
4316
4316
|
}], valuationWidgetData: [{
|
|
4317
4317
|
type: Input
|
|
4318
|
+
}], progressChartData: [{
|
|
4319
|
+
type: Input
|
|
4318
4320
|
}] } });
|
|
4319
4321
|
|
|
4320
4322
|
class WidgetModule {
|
|
@@ -4325,14 +4327,16 @@ class WidgetModule {
|
|
|
4325
4327
|
CardModule,
|
|
4326
4328
|
SharedModule,
|
|
4327
4329
|
SidebarModule,
|
|
4328
|
-
TimelineModule
|
|
4330
|
+
TimelineModule,
|
|
4331
|
+
ChartModule], exports: [WidgetContainerComponent] });
|
|
4329
4332
|
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetModule, imports: [CommonModule,
|
|
4330
4333
|
ButtonModule,
|
|
4331
4334
|
DividerModule,
|
|
4332
4335
|
CardModule,
|
|
4333
4336
|
SharedModule,
|
|
4334
4337
|
SidebarModule,
|
|
4335
|
-
TimelineModule
|
|
4338
|
+
TimelineModule,
|
|
4339
|
+
ChartModule] });
|
|
4336
4340
|
}
|
|
4337
4341
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetModule, decorators: [{
|
|
4338
4342
|
type: NgModule,
|
|
@@ -4345,7 +4349,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImpor
|
|
|
4345
4349
|
CardModule,
|
|
4346
4350
|
SharedModule,
|
|
4347
4351
|
SidebarModule,
|
|
4348
|
-
TimelineModule
|
|
4352
|
+
TimelineModule,
|
|
4353
|
+
ChartModule
|
|
4349
4354
|
],
|
|
4350
4355
|
exports: [WidgetContainerComponent]
|
|
4351
4356
|
}]
|