@annalib/anna-core 35.1.0 → 35.1.2

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.
Files changed (13) hide show
  1. package/fesm2022/annalib-anna-core.mjs +201 -34
  2. package/fesm2022/annalib-anna-core.mjs.map +1 -1
  3. package/lib/anna-core-shared-lib/directives/digits-only/digits-only.directive.d.ts +2 -1
  4. package/lib/anna-core-shared-lib/directives/show-ellipsis-text/show-ellipsis-text.directive.d.ts +2 -1
  5. package/lib/anna-core-shared-lib/models/anna-global-dropdown-config.model.d.ts +3 -0
  6. package/lib/anna-core-shared-lib/models/anna-non-editable-gt-models.d.ts +39 -2
  7. package/lib/anna-core-shared-lib/services/anna-date-time-format.service.d.ts +2 -2
  8. package/lib/anna-dropdown-lib/components/anna-single-select/anna-single-select.component.d.ts +1 -0
  9. package/lib/anna-generic-table-lib/components/anna-non-editable-generic-table/anna-non-editable-generic-table.component.d.ts +26 -3
  10. package/package.json +1 -1
  11. package/src/lib/anna-common-scss/_email-button.scss +1 -1
  12. package/src/lib/anna-common-scss/_generic-table-common.scss +22 -0
  13. package/src/lib/anna-common-scss/_gt-table.scss +3 -0
package/fesm2022/annalib-anna-core.mjs CHANGED
@@ -110,7 +110,7 @@ class AnnaIconColumnComponent {
110
110
  this.columnIconClicked.emit();
111
111
  }
112
112
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AnnaIconColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
113
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AnnaIconColumnComponent, isStandalone: true, selector: "anna-core-icon-column", inputs: { componentName: "componentName", iconToShow: "iconToShow", dataObject: "dataObject" }, outputs: { columnIconClicked: "columnIconClicked" }, ngImport: i0, template: "<span *ngIf=\"iconToShow === 'PAY_FOR_PERFORMANCE_ACTIVE'\">\r\n <anna-core-pay-for-performance-icon-template\r\n [color]=\"PfpIconActiveColor\"\r\n [width]=\"'12px'\"\r\n [height]=\"'12px'\"\r\n >\r\n </anna-core-pay-for-performance-icon-template>\r\n</span>\r\n\r\n<anna-core-deleted-order-icon-template *ngIf=\"iconToShow === 'DELETED_ORDER'\"> </anna-core-deleted-order-icon-template>\r\n\r\n<i\r\n class=\"mdi mdi-alert\"\r\n *ngIf=\"iconToShow === 'NEED_SELLER_CONFIRMATION'\"\r\n></i>\r\n<i\r\n class=\"mdi mdi-alert\"\r\n *ngIf=\"iconToShow === 'NEED_BUYER_CONFIRMATION'\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'AUTOMATED'\"\r\n class=\"anna-automation-activated-icon mdi mdi-cog-refresh\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'WARNING_ICON'\"\r\n class=\"mdi mdi-alert\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'INFORMATION_OUTLINE_ICON'\"\r\n class=\"mdi mdi-information-outline\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'ALERT_OCTAGON_ICON'\"\r\n class=\"mdi mdi-alert-octagon\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'CANCEL_ICON'\"\r\n class=\"mdi mdi-cancel\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_B_CIRCLE'\"\r\n class=\"mdi mdi-alpha-b-circle-outline\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_E_CIRCLE'\"\r\n class=\"mdi mdi-alpha-r-circle-outline\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_A_CIRCLE'\"\r\n class=\"mdi mdi-alpha-a-circle\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'CALENDAR'\"\r\n class=\"mdi mdi-calendar\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'MESSAGE'\"\r\n class=\"mdi mdi-comment-edit-outline\"\r\n (click)=\"svgIconClicked()\"\r\n></i>\r\n<!-- <i\r\n *ngIf=\"iconToShow === 'ALPHA_R_CIRCLE'\"\r\n class=\"mdi mdi-alpha-r-circle-outline\"\r\n></i> -->\r\n\r\n<anna-core-anna-est-icon-template *ngIf=\"iconToShow === 'ALPHA_R_CIRCLE'\"></anna-core-anna-est-icon-template>\r\n", styles: [".cursor-not-allowed{cursor:not-allowed!important}.mdi-alert{color:#f97b07;font-size:.9375rem}:host ::ng-deep anna-core-pay-for-performance-icon-template svg{margin-bottom:6px}.mdi.mdi-alert{font-size:13px;position:relative;color:#f3c639;top:1px}.anna-automation-activated-icon.mdi.mdi-cog-refresh{font-size:13px;position:relative;top:1px}.mdi.mdi-information-outline{color:var(--primary-blue-color);cursor:pointer!important}.mdi.mdi-alert-octagon{color:red;cursor:pointer!important}.mdi.mdi-cancel{color:var(--primary-red-color);cursor:pointer!important}.mdi.mdi-comment-edit-outline{color:var(--primary-blue-color);cursor:pointer!important}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: AnnaPayForPerformanceIconTemplateComponent, selector: "anna-core-pay-for-performance-icon-template", inputs: ["isTitle", "color", "width", "height"] }, { kind: "component", type: AnnaDeletedOrderIconTemplateComponent, selector: "anna-core-deleted-order-icon-template" }, { kind: "component", type: AnnaEstIconTemplateComponent, selector: "anna-core-anna-est-icon-template" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
113
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AnnaIconColumnComponent, isStandalone: true, selector: "anna-core-icon-column", inputs: { componentName: "componentName", iconToShow: "iconToShow", dataObject: "dataObject" }, outputs: { columnIconClicked: "columnIconClicked" }, ngImport: i0, template: "<span *ngIf=\"iconToShow === 'PAY_FOR_PERFORMANCE_ACTIVE'\">\r\n <anna-core-pay-for-performance-icon-template\r\n [color]=\"PfpIconActiveColor\"\r\n [width]=\"'12px'\"\r\n [height]=\"'12px'\"\r\n >\r\n </anna-core-pay-for-performance-icon-template>\r\n</span>\r\n\r\n<anna-core-deleted-order-icon-template *ngIf=\"iconToShow === 'DELETED_ORDER'\"> </anna-core-deleted-order-icon-template>\r\n\r\n<i\r\n class=\"mdi mdi-alert\"\r\n *ngIf=\"iconToShow === 'NEED_SELLER_CONFIRMATION'\"\r\n></i>\r\n<i\r\n class=\"mdi mdi-alert\"\r\n *ngIf=\"iconToShow === 'NEED_BUYER_CONFIRMATION'\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'AUTOMATED'\"\r\n class=\"anna-automation-activated-icon mdi mdi-cog-refresh\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'WARNING_ICON'\"\r\n class=\"mdi mdi-alert\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'INFORMATION_OUTLINE_ICON'\"\r\n class=\"mdi mdi-information-outline\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'ALERT_OCTAGON_ICON'\"\r\n class=\"mdi mdi-alert-octagon\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'CANCEL_ICON'\"\r\n class=\"mdi mdi-cancel\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_B_CIRCLE'\"\r\n class=\"mdi mdi-alpha-b-circle-outline\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_E_CIRCLE'\"\r\n class=\"mdi mdi-alpha-r-circle-outline\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_A_CIRCLE'\"\r\n class=\"mdi mdi-alpha-a-circle\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'CALENDAR'\"\r\n class=\"mdi mdi-calendar\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'MESSAGE'\"\r\n class=\"mdi mdi-comment-edit-outline\"\r\n (click)=\"svgIconClicked()\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'EMAIL_ICON'\"\r\n class=\"mdi mdi-send\"\r\n (click)=\"svgIconClicked()\"\r\n></i>\r\n<!-- <i\r\n *ngIf=\"iconToShow === 'ALPHA_R_CIRCLE'\"\r\n class=\"mdi mdi-alpha-r-circle-outline\"\r\n></i> -->\r\n\r\n<anna-core-anna-est-icon-template *ngIf=\"iconToShow === 'ALPHA_R_CIRCLE'\"></anna-core-anna-est-icon-template>\r\n", styles: [".cursor-not-allowed{cursor:not-allowed!important}.mdi-alert{color:#f97b07;font-size:.9375rem}:host ::ng-deep anna-core-pay-for-performance-icon-template svg{margin-bottom:6px}.mdi.mdi-alert{font-size:13px;position:relative;color:#f3c639;top:1px}.anna-automation-activated-icon.mdi.mdi-cog-refresh{font-size:13px;position:relative;top:1px}.mdi.mdi-information-outline{color:var(--primary-blue-color);cursor:pointer!important}.mdi.mdi-alert-octagon{color:red;cursor:pointer!important}.mdi.mdi-cancel{color:var(--primary-red-color);cursor:pointer!important}.mdi.mdi-comment-edit-outline{color:var(--primary-blue-color);cursor:pointer!important}.mdi.mdi-send{color:var(--primary-blue-color);cursor:pointer!important;font-weight:400;font-size:16px;letter-spacing:0;padding-right:0}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: AnnaPayForPerformanceIconTemplateComponent, selector: "anna-core-pay-for-performance-icon-template", inputs: ["isTitle", "color", "width", "height"] }, { kind: "component", type: AnnaDeletedOrderIconTemplateComponent, selector: "anna-core-deleted-order-icon-template" }, { kind: "component", type: AnnaEstIconTemplateComponent, selector: "anna-core-anna-est-icon-template" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
114
114
  }
115
115
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AnnaIconColumnComponent, decorators: [{
116
116
  type: Component,
@@ -123,7 +123,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
123
123
  AnnaBuyerApprovalIconTemplateComponent,
124
124
  AnnaDeletedOrderIconTemplateComponent,
125
125
  AnnaEstIconTemplateComponent,
126
- ], template: "<span *ngIf=\"iconToShow === 'PAY_FOR_PERFORMANCE_ACTIVE'\">\r\n <anna-core-pay-for-performance-icon-template\r\n [color]=\"PfpIconActiveColor\"\r\n [width]=\"'12px'\"\r\n [height]=\"'12px'\"\r\n >\r\n </anna-core-pay-for-performance-icon-template>\r\n</span>\r\n\r\n<anna-core-deleted-order-icon-template *ngIf=\"iconToShow === 'DELETED_ORDER'\"> </anna-core-deleted-order-icon-template>\r\n\r\n<i\r\n class=\"mdi mdi-alert\"\r\n *ngIf=\"iconToShow === 'NEED_SELLER_CONFIRMATION'\"\r\n></i>\r\n<i\r\n class=\"mdi mdi-alert\"\r\n *ngIf=\"iconToShow === 'NEED_BUYER_CONFIRMATION'\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'AUTOMATED'\"\r\n class=\"anna-automation-activated-icon mdi mdi-cog-refresh\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'WARNING_ICON'\"\r\n class=\"mdi mdi-alert\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'INFORMATION_OUTLINE_ICON'\"\r\n class=\"mdi mdi-information-outline\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'ALERT_OCTAGON_ICON'\"\r\n class=\"mdi mdi-alert-octagon\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'CANCEL_ICON'\"\r\n class=\"mdi mdi-cancel\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_B_CIRCLE'\"\r\n class=\"mdi mdi-alpha-b-circle-outline\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_E_CIRCLE'\"\r\n class=\"mdi mdi-alpha-r-circle-outline\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_A_CIRCLE'\"\r\n class=\"mdi mdi-alpha-a-circle\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'CALENDAR'\"\r\n class=\"mdi mdi-calendar\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'MESSAGE'\"\r\n class=\"mdi mdi-comment-edit-outline\"\r\n (click)=\"svgIconClicked()\"\r\n></i>\r\n<!-- <i\r\n *ngIf=\"iconToShow === 'ALPHA_R_CIRCLE'\"\r\n class=\"mdi mdi-alpha-r-circle-outline\"\r\n></i> -->\r\n\r\n<anna-core-anna-est-icon-template *ngIf=\"iconToShow === 'ALPHA_R_CIRCLE'\"></anna-core-anna-est-icon-template>\r\n", styles: [".cursor-not-allowed{cursor:not-allowed!important}.mdi-alert{color:#f97b07;font-size:.9375rem}:host ::ng-deep anna-core-pay-for-performance-icon-template svg{margin-bottom:6px}.mdi.mdi-alert{font-size:13px;position:relative;color:#f3c639;top:1px}.anna-automation-activated-icon.mdi.mdi-cog-refresh{font-size:13px;position:relative;top:1px}.mdi.mdi-information-outline{color:var(--primary-blue-color);cursor:pointer!important}.mdi.mdi-alert-octagon{color:red;cursor:pointer!important}.mdi.mdi-cancel{color:var(--primary-red-color);cursor:pointer!important}.mdi.mdi-comment-edit-outline{color:var(--primary-blue-color);cursor:pointer!important}\n"] }]
126
+ ], template: "<span *ngIf=\"iconToShow === 'PAY_FOR_PERFORMANCE_ACTIVE'\">\r\n <anna-core-pay-for-performance-icon-template\r\n [color]=\"PfpIconActiveColor\"\r\n [width]=\"'12px'\"\r\n [height]=\"'12px'\"\r\n >\r\n </anna-core-pay-for-performance-icon-template>\r\n</span>\r\n\r\n<anna-core-deleted-order-icon-template *ngIf=\"iconToShow === 'DELETED_ORDER'\"> </anna-core-deleted-order-icon-template>\r\n\r\n<i\r\n class=\"mdi mdi-alert\"\r\n *ngIf=\"iconToShow === 'NEED_SELLER_CONFIRMATION'\"\r\n></i>\r\n<i\r\n class=\"mdi mdi-alert\"\r\n *ngIf=\"iconToShow === 'NEED_BUYER_CONFIRMATION'\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'AUTOMATED'\"\r\n class=\"anna-automation-activated-icon mdi mdi-cog-refresh\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'WARNING_ICON'\"\r\n class=\"mdi mdi-alert\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'INFORMATION_OUTLINE_ICON'\"\r\n class=\"mdi mdi-information-outline\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'ALERT_OCTAGON_ICON'\"\r\n class=\"mdi mdi-alert-octagon\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'CANCEL_ICON'\"\r\n class=\"mdi mdi-cancel\"\r\n></i>\r\n\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_B_CIRCLE'\"\r\n class=\"mdi mdi-alpha-b-circle-outline\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_E_CIRCLE'\"\r\n class=\"mdi mdi-alpha-r-circle-outline\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'ALPHA_A_CIRCLE'\"\r\n class=\"mdi mdi-alpha-a-circle\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'CALENDAR'\"\r\n class=\"mdi mdi-calendar\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'MESSAGE'\"\r\n class=\"mdi mdi-comment-edit-outline\"\r\n (click)=\"svgIconClicked()\"\r\n></i>\r\n<i\r\n *ngIf=\"iconToShow === 'EMAIL_ICON'\"\r\n class=\"mdi mdi-send\"\r\n (click)=\"svgIconClicked()\"\r\n></i>\r\n<!-- <i\r\n *ngIf=\"iconToShow === 'ALPHA_R_CIRCLE'\"\r\n class=\"mdi mdi-alpha-r-circle-outline\"\r\n></i> -->\r\n\r\n<anna-core-anna-est-icon-template *ngIf=\"iconToShow === 'ALPHA_R_CIRCLE'\"></anna-core-anna-est-icon-template>\r\n", styles: [".cursor-not-allowed{cursor:not-allowed!important}.mdi-alert{color:#f97b07;font-size:.9375rem}:host ::ng-deep anna-core-pay-for-performance-icon-template svg{margin-bottom:6px}.mdi.mdi-alert{font-size:13px;position:relative;color:#f3c639;top:1px}.anna-automation-activated-icon.mdi.mdi-cog-refresh{font-size:13px;position:relative;top:1px}.mdi.mdi-information-outline{color:var(--primary-blue-color);cursor:pointer!important}.mdi.mdi-alert-octagon{color:red;cursor:pointer!important}.mdi.mdi-cancel{color:var(--primary-red-color);cursor:pointer!important}.mdi.mdi-comment-edit-outline{color:var(--primary-blue-color);cursor:pointer!important}.mdi.mdi-send{color:var(--primary-blue-color);cursor:pointer!important;font-weight:400;font-size:16px;letter-spacing:0;padding-right:0}\n"] }]
127
127
  }], propDecorators: { componentName: [{
128
128
  type: Input
129
129
  }], iconToShow: [{
@@ -227,6 +227,17 @@ class DigitOnlyDirective {
227
227
  this.hasNegativeSign = newValue.split(this.negativeSign).length > -1;
228
228
  return;
229
229
  }
230
+ if (this.decimal && this.decimalPlaces != null && this.hasDecimalPoint) {
231
+ const valueParts = this.inputElement.value.split(this.decimalSeparator);
232
+ const selection = this.getSelection();
233
+ if (valueParts.length === 2 &&
234
+ this.inputElement.selectionStart != null &&
235
+ this.inputElement.selectionStart > this.inputElement.value.indexOf(this.decimalSeparator) &&
236
+ valueParts[1].length - selection.length >= this.decimalPlaces) {
237
+ e.preventDefault();
238
+ return;
239
+ }
240
+ }
230
241
  // Ensure that it is a number and stop the keypress
231
242
  if (e.key === " " || Number.isNaN(Number(e.key))) {
232
243
  e.preventDefault();
@@ -337,6 +348,13 @@ class DigitOnlyDirective {
337
348
  const allowedLength = maxLength - this.inputElement.value.length + (result.includes(`${this.negativeSign}`) ? 1 : 0);
338
349
  result = allowedLength > 0 ? result.substring(0, allowedLength) : "";
339
350
  }
351
+ if (this.decimal && this.decimalPlaces != null) {
352
+ const parts = result.split(this.decimalSeparator);
353
+ if (parts.length === 2) {
354
+ parts[1] = parts[1].substring(0, this.decimalPlaces);
355
+ result = parts.join(this.decimalSeparator);
356
+ }
357
+ }
340
358
  return result;
341
359
  }
342
360
  getNegativeSignRegExp() {
@@ -368,7 +386,7 @@ class DigitOnlyDirective {
368
386
  return oldValue.substring(0, selectionStart) + key + oldValue.substring(selectionEnd);
369
387
  }
370
388
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DigitOnlyDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
371
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: DigitOnlyDirective, isStandalone: true, selector: "[annaCoreDigitOnly]", inputs: { decimal: "decimal", decimalSeparator: "decimalSeparator", allowNegatives: "allowNegatives", allowPaste: "allowPaste", negativeSign: "negativeSign", min: "min", max: "max", pattern: "pattern" }, host: { listeners: { "beforeinput": "onBeforeInput($event)", "keydown": "onKeyDown($event)", "paste": "onPaste($event)", "drop": "onDrop($event)" } }, usesOnChanges: true, ngImport: i0 }); }
389
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: DigitOnlyDirective, isStandalone: true, selector: "[annaCoreDigitOnly]", inputs: { decimal: "decimal", decimalSeparator: "decimalSeparator", allowNegatives: "allowNegatives", allowPaste: "allowPaste", negativeSign: "negativeSign", min: "min", max: "max", pattern: "pattern", decimalPlaces: "decimalPlaces" }, host: { listeners: { "beforeinput": "onBeforeInput($event)", "keydown": "onKeyDown($event)", "paste": "onPaste($event)", "drop": "onDrop($event)" } }, usesOnChanges: true, ngImport: i0 }); }
372
390
  }
373
391
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DigitOnlyDirective, decorators: [{
374
392
  type: Directive,
@@ -392,6 +410,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
392
410
  type: Input
393
411
  }], pattern: [{
394
412
  type: Input
413
+ }], decimalPlaces: [{
414
+ type: Input
395
415
  }], onBeforeInput: [{
396
416
  type: HostListener,
397
417
  args: ["beforeinput", ["$event"]]
@@ -438,7 +458,7 @@ class AnnaLicensingTableComponent {
438
458
  this.specificationChanged.emit({ updatedValue, featureDetails });
439
459
  }
440
460
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AnnaLicensingTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
441
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AnnaLicensingTableComponent, isStandalone: true, selector: "anna-core-licensing-table", inputs: { plans: "plans", isEditMode: "isEditMode", loading: "loading", defaultListing: "defaultListing", editingCurrentPlan: "editingCurrentPlan", maxValueForEvaluationPlanPOD: "maxValueForEvaluationPlanPOD" }, outputs: { specificationChanged: "specificationChanged" }, ngImport: i0, template: "<table class=\"header-section\">\r\n <thead>\r\n <tr>\r\n <th><div>FEATURE</div></th>\r\n <ng-container *ngIf=\"loading\">\r\n <ng-container *ngIf=\"defaultListing\">\r\n <div class=\"skeleton-loader\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{ height: '100%', borderRadius: '8px', marginBottom: '0px' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{ height: '100%', borderRadius: '8px', marginBottom: '0px' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{ height: '100%', borderRadius: '8px', marginBottom: '0px' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"!defaultListing\">\r\n <div class=\"skeleton-loader\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{ height: '100%', borderRadius: '8px', marginBottom: '0px' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!loading && plans?.length\">\r\n <th *ngFor=\"let plan of plans\">\r\n {{ plan?.PlanName }}\r\n <ng-container *ngIf=\"plans.length === 1\">\r\n <p *ngIf=\"isEditMode\">\r\n {{ editingCurrentPlan ? \"Current plan\" : \"Upcoming Plan\" }}\r\n </p>\r\n <p *ngIf=\"!isEditMode\">\r\n {{ !plan?.PlanExpiryDays || plan?.PlanExpiryDays >= 0 ? \"Current plan\" : \"Expired Plan\" }}\r\n </p>\r\n </ng-container>\r\n </th>\r\n </ng-container>\r\n </tr>\r\n </thead>\r\n</table>\r\n<div class=\"scrollable-tbody\">\r\n <ng-container *ngIf=\"loading\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{ marginTop: '10px', marginBottom: '0', height: defaultListing ? '490px' : '430px' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </ng-container>\r\n <ng-container *ngIf=\"!loading && plans?.length\">\r\n <table>\r\n <tbody>\r\n <tr *ngFor=\"let feature of plans[0]?.FeatureDetails; let featureIndex = index\">\r\n <td>\r\n <strong>{{ feature.FeatureName }}</strong> {{ feature.FeatureDescription }}\r\n </td>\r\n <td *ngFor=\"let plan of plans; let planIndex = index\">\r\n <ng-container *ngIf=\"plan.FeatureDetails[featureIndex] as featureDetails\">\r\n <ng-container *ngIf=\"!featureDetails.Specification.length\">\r\n <i\r\n *ngIf=\"featureDetails.IsEnabled\"\r\n class=\"mdi mdi-checkbox-marked-circle\"\r\n ></i>\r\n <i\r\n *ngIf=\"!featureDetails.IsEnabled\"\r\n class=\"mdi mdi-close\"\r\n ></i>\r\n </ng-container>\r\n <ng-container *ngIf=\"featureDetails.Specification.length\">\r\n <ng-container *ngFor=\"let spec of featureDetails.Specification\">\r\n <ng-container *ngIf=\"spec.JsonType === 'PAY_PER_USE'\">\r\n <div *ngIf=\"isEditMode\">\r\n <input\r\n annaCoreDigitOnly\r\n type=\"number\"\r\n [ngModel]=\"spec.Json.TotalCount\"\r\n (ngModelChange)=\"onValueChange($event, featureDetails)\"\r\n [attr.min]=\"spec.JsonCloned.TotalCount\"\r\n [attr.max]=\"maxValueForEvaluationPlanPOD || null\"\r\n [ngClass]=\"{\r\n 'red-border':\r\n spec.Json.TotalCount < spec.JsonCloned.TotalCount ||\r\n (maxValueForEvaluationPlanPOD &&\r\n spec.Json.TotalCount > maxValueForEvaluationPlanPOD)\r\n }\"\r\n />\r\n Orders\r\n <i\r\n class=\"mdi mdi-alert-octagon\"\r\n *ngIf=\"\r\n spec.Json.TotalCount < spec.JsonCloned.TotalCount ||\r\n (maxValueForEvaluationPlanPOD && spec.Json.TotalCount > maxValueForEvaluationPlanPOD)\r\n \"\r\n matTooltipPosition=\"above\"\r\n matTooltip=\"The value must be at least the chosen plan's limit and no more than the next plan's limit.\"\r\n ></i>\r\n </div>\r\n <div *ngIf=\"!isEditMode\">\r\n <p>\r\n {{ spec.Json.TotalCount }} Orders\r\n <span *ngIf=\"spec.Json.ConsumedCount\"\r\n >|\r\n {{ spec.Json.TotalCount - spec.Json.ConsumedCount }}\r\n Remaining</span\r\n >\r\n </p>\r\n <span\r\n class=\"customized-text\"\r\n *ngIf=\"spec.IsCustomized\"\r\n >(Customized)</span\r\n >\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </ng-container>\r\n <ng-container *ngIf=\"!loading && !plans?.length\">\r\n <anna-core-no-data-lib [width]=\"'50%'\"></anna-core-no-data-lib>\r\n </ng-container>\r\n</div>\r\n", styles: ["table.header-section{border-collapse:separate;border-spacing:0 8px;width:100%;border-top:1px solid #9b1cd5;border-bottom:1px solid #9b1cd5}.scrollable-tbody table{border-collapse:collapse;width:100%}tr{height:40px}tr .skeleton-loader{display:flex;justify-content:flex-end}tr ::ng-deep ngx-skeleton-loader{border:1px solid #304598;border-radius:8px;width:153px;height:52px;display:inline-block;margin-right:8px}tr ::ng-deep ngx-skeleton-loader:nth-of-type(1) div{background-color:#f5f7ff}tr ::ng-deep ngx-skeleton-loader:nth-of-type(2) div{background-color:#dfe6ff}tr ::ng-deep ngx-skeleton-loader:nth-of-type(3) div{background-color:#c6d2ff}tr ::ng-deep ngx-skeleton-loader:last-of-type{margin-right:0}th{padding:8px 8px 8px 0;text-align:left;font-family:Roboto;font-size:16px;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;position:sticky;top:0;background-color:#fff;z-index:1}th:not(:first-child){border:1px solid #304598;border-radius:8px;padding-left:8px;width:137px;height:35px}th:not(:first-child) p{font-family:Roboto;font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;margin-bottom:0}th:nth-of-type(2){background-color:#f5f7ff}th:nth-of-type(3){background-color:#dfe6ff}th:nth-of-type(4){background-color:#c6d2ff}td{border-bottom:1px solid #d3d3d3;padding:8px 8px 8px 0;font-family:Roboto;font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}td p{margin-bottom:0}td input{width:30px}td .mdi-checkbox-marked-circle{font-size:14px;color:#304598;position:relative}td .mdi-close{color:#bdbdbd}td .mdi-alert-octagon{color:#f44336!important;cursor:pointer}td .red-border{border:1px solid #f44336;outline:#f44336}td:not(:first-child){width:142px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.customized-text{color:#a7a7a7;font-style:italic}\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: FormsModule }, { kind: "directive", type: i4.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: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: NgxSkeletonLoaderModule }, { kind: "component", type: i3.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }, { kind: "directive", type: DigitOnlyDirective, selector: "[annaCoreDigitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: AnnaNoDataComponent, selector: "anna-core-no-data-lib", inputs: ["width", "marginTop"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
461
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AnnaLicensingTableComponent, isStandalone: true, selector: "anna-core-licensing-table", inputs: { plans: "plans", isEditMode: "isEditMode", loading: "loading", defaultListing: "defaultListing", editingCurrentPlan: "editingCurrentPlan", maxValueForEvaluationPlanPOD: "maxValueForEvaluationPlanPOD" }, outputs: { specificationChanged: "specificationChanged" }, ngImport: i0, template: "<table class=\"header-section\">\r\n <thead>\r\n <tr>\r\n <th><div>FEATURE</div></th>\r\n <ng-container *ngIf=\"loading\">\r\n <ng-container *ngIf=\"defaultListing\">\r\n <div class=\"skeleton-loader\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{ height: '100%', borderRadius: '8px', marginBottom: '0px' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{ height: '100%', borderRadius: '8px', marginBottom: '0px' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{ height: '100%', borderRadius: '8px', marginBottom: '0px' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"!defaultListing\">\r\n <div class=\"skeleton-loader\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{ height: '100%', borderRadius: '8px', marginBottom: '0px' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!loading && plans?.length\">\r\n <th *ngFor=\"let plan of plans\">\r\n {{ plan?.PlanName }}\r\n <ng-container *ngIf=\"plans.length === 1\">\r\n <p *ngIf=\"isEditMode\">\r\n {{ editingCurrentPlan ? \"Current plan\" : \"Upcoming Plan\" }}\r\n </p>\r\n <p *ngIf=\"!isEditMode\">\r\n {{ !plan?.PlanExpiryDays || plan?.PlanExpiryDays >= 0 ? \"Current plan\" : \"Expired Plan\" }}\r\n </p>\r\n </ng-container>\r\n </th>\r\n </ng-container>\r\n </tr>\r\n </thead>\r\n</table>\r\n<div class=\"scrollable-tbody\">\r\n <ng-container *ngIf=\"loading\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{ marginTop: '10px', marginBottom: '0', height: defaultListing ? '490px' : '430px' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </ng-container>\r\n <ng-container *ngIf=\"!loading && plans?.length\">\r\n <table>\r\n <tbody>\r\n <tr *ngFor=\"let feature of plans[0]?.FeatureDetails; let featureIndex = index\">\r\n <td>\r\n <strong>{{ feature.FeatureName }}</strong> {{ feature.FeatureDescription }}\r\n </td>\r\n <td *ngFor=\"let plan of plans; let planIndex = index\">\r\n <ng-container *ngIf=\"plan.FeatureDetails[featureIndex] as featureDetails\">\r\n <ng-container *ngIf=\"!featureDetails.Specification.length\">\r\n <i\r\n *ngIf=\"featureDetails.IsEnabled\"\r\n class=\"mdi mdi-checkbox-marked-circle\"\r\n ></i>\r\n <i\r\n *ngIf=\"!featureDetails.IsEnabled\"\r\n class=\"mdi mdi-close\"\r\n ></i>\r\n </ng-container>\r\n <ng-container *ngIf=\"featureDetails.Specification.length\">\r\n <ng-container *ngFor=\"let spec of featureDetails.Specification\">\r\n <ng-container *ngIf=\"spec.JsonType === 'PAY_PER_USE'\">\r\n <div *ngIf=\"isEditMode\">\r\n <input\r\n annaCoreDigitOnly\r\n type=\"number\"\r\n [ngModel]=\"spec.Json.TotalCount\"\r\n (ngModelChange)=\"onValueChange($event, featureDetails)\"\r\n [attr.min]=\"spec.JsonCloned.TotalCount\"\r\n [attr.max]=\"maxValueForEvaluationPlanPOD || null\"\r\n [ngClass]=\"{\r\n 'red-border':\r\n spec.Json.TotalCount < spec.JsonCloned.TotalCount ||\r\n (maxValueForEvaluationPlanPOD &&\r\n spec.Json.TotalCount > maxValueForEvaluationPlanPOD)\r\n }\"\r\n />\r\n Orders\r\n <i\r\n class=\"mdi mdi-alert-octagon\"\r\n *ngIf=\"\r\n spec.Json.TotalCount < spec.JsonCloned.TotalCount ||\r\n (maxValueForEvaluationPlanPOD && spec.Json.TotalCount > maxValueForEvaluationPlanPOD)\r\n \"\r\n matTooltipPosition=\"above\"\r\n matTooltip=\"The value must be at least the chosen plan's limit and no more than the next plan's limit.\"\r\n ></i>\r\n </div>\r\n <div *ngIf=\"!isEditMode\">\r\n <p>\r\n {{ spec.Json.TotalCount }} Orders\r\n <span *ngIf=\"spec.Json.ConsumedCount\"\r\n >|\r\n {{ spec.Json.TotalCount - spec.Json.ConsumedCount }}\r\n Remaining</span\r\n >\r\n </p>\r\n <span\r\n class=\"customized-text\"\r\n *ngIf=\"spec.IsCustomized\"\r\n >(Customized)</span\r\n >\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </ng-container>\r\n <ng-container *ngIf=\"!loading && !plans?.length\">\r\n <anna-core-no-data-lib [width]=\"'50%'\"></anna-core-no-data-lib>\r\n </ng-container>\r\n</div>\r\n", styles: ["table.header-section{border-collapse:separate;border-spacing:0 8px;width:100%;border-top:1px solid #9b1cd5;border-bottom:1px solid #9b1cd5}.scrollable-tbody table{border-collapse:collapse;width:100%}tr{height:40px}tr .skeleton-loader{display:flex;justify-content:flex-end}tr ::ng-deep ngx-skeleton-loader{border:1px solid #304598;border-radius:8px;width:153px;height:52px;display:inline-block;margin-right:8px}tr ::ng-deep ngx-skeleton-loader:nth-of-type(1) div{background-color:#f5f7ff}tr ::ng-deep ngx-skeleton-loader:nth-of-type(2) div{background-color:#dfe6ff}tr ::ng-deep ngx-skeleton-loader:nth-of-type(3) div{background-color:#c6d2ff}tr ::ng-deep ngx-skeleton-loader:last-of-type{margin-right:0}th{padding:8px 8px 8px 0;text-align:left;font-family:Roboto;font-size:16px;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;position:sticky;top:0;background-color:#fff;z-index:1}th:not(:first-child){border:1px solid #304598;border-radius:8px;padding-left:8px;width:137px;height:35px}th:not(:first-child) p{font-family:Roboto;font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;margin-bottom:0}th:nth-of-type(2){background-color:#f5f7ff}th:nth-of-type(3){background-color:#dfe6ff}th:nth-of-type(4){background-color:#c6d2ff}td{border-bottom:1px solid #d3d3d3;padding:8px 8px 8px 0;font-family:Roboto;font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}td p{margin-bottom:0}td input{width:30px}td .mdi-checkbox-marked-circle{font-size:14px;color:#304598;position:relative}td .mdi-close{color:#bdbdbd}td .mdi-alert-octagon{color:#f44336!important;cursor:pointer}td .red-border{border:1px solid #f44336;outline:#f44336}td:not(:first-child){width:142px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.customized-text{color:#a7a7a7;font-style:italic}\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: FormsModule }, { kind: "directive", type: i4.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: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: NgxSkeletonLoaderModule }, { kind: "component", type: i3.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }, { kind: "directive", type: DigitOnlyDirective, selector: "[annaCoreDigitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern", "decimalPlaces"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: AnnaNoDataComponent, selector: "anna-core-no-data-lib", inputs: ["width", "marginTop"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
442
462
  }
443
463
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AnnaLicensingTableComponent, decorators: [{
444
464
  type: Component,
@@ -547,14 +567,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
547
567
  class ShowEllipsisTextOnHoverDirective {
548
568
  constructor(elementRef) {
549
569
  this.elementRef = elementRef;
570
+ this.includeFullWidth = true;
550
571
  }
551
572
  onMouseEnter() {
552
573
  const domElement = this.elementRef.nativeElement;
553
- if (domElement.offsetWidth < domElement.scrollWidth || this.checkPositionsInDecimals(domElement)) {
574
+ const clone = document.createElement("span");
575
+ clone.style.visibility = "hidden";
576
+ clone.style.whiteSpace = "nowrap";
577
+ clone.style.position = "absolute";
578
+ clone.style.font = window?.getComputedStyle(domElement)?.font;
579
+ clone.textContent = domElement.textContent;
580
+ document.body.appendChild(clone);
581
+ const fullWidth = clone.offsetWidth;
582
+ if (domElement.offsetWidth < domElement.scrollWidth ||
583
+ this.checkPositionsInDecimals(domElement) ||
584
+ (this.includeFullWidth && fullWidth > domElement.offsetWidth)) {
554
585
  domElement.title = domElement.textContent === "" ? domElement.value : domElement.textContent;
555
586
  }
556
- else if (domElement.title)
587
+ else if (domElement.title) {
557
588
  domElement.removeAttribute("title");
589
+ }
590
+ document.body.removeChild(clone);
558
591
  }
559
592
  checkPositionsInDecimals(domElement) {
560
593
  // if we don't have any children element Then we can't calculate
@@ -570,7 +603,7 @@ class ShowEllipsisTextOnHoverDirective {
570
603
  return childRect.right + padding > elementRect.right;
571
604
  }
572
605
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ShowEllipsisTextOnHoverDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
573
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: ShowEllipsisTextOnHoverDirective, isStandalone: true, selector: "[annaCoreShowEllipsisTextOnHover]", host: { listeners: { "mouseenter": "onMouseEnter()" } }, ngImport: i0 }); }
606
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: ShowEllipsisTextOnHoverDirective, isStandalone: true, selector: "[annaCoreShowEllipsisTextOnHover]", inputs: { includeFullWidth: "includeFullWidth" }, host: { listeners: { "mouseenter": "onMouseEnter()" } }, ngImport: i0 }); }
574
607
  }
575
608
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ShowEllipsisTextOnHoverDirective, decorators: [{
576
609
  type: Directive,
@@ -578,7 +611,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
578
611
  selector: "[annaCoreShowEllipsisTextOnHover]",
579
612
  standalone: true,
580
613
  }]
581
- }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { onMouseEnter: [{
614
+ }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { includeFullWidth: [{
615
+ type: Input
616
+ }], onMouseEnter: [{
582
617
  type: HostListener,
583
618
  args: ["mouseenter"]
584
619
  }] } });
@@ -1628,13 +1663,13 @@ class AnnaSortService {
1628
1663
  "flightEndDate",
1629
1664
  "date",
1630
1665
  "GeneratedOn",
1631
- "AirDate"
1666
+ "AirDate",
1632
1667
  ]);
1633
1668
  }
1634
1669
  sortDataForComponentOtherThanLurAndCsrPage(isAsc, data, key) {
1635
1670
  let param1;
1636
1671
  let param2;
1637
- let dataToBeSorted = cloneDeep(data);
1672
+ let dataToBeSorted = data;
1638
1673
  if (this.dateSet.has(key)) {
1639
1674
  dataToBeSorted.sort((a, b) => this.annaDateTimeFormatService.compareDate(a[key], b[key], isAsc));
1640
1675
  }
@@ -1759,17 +1794,17 @@ class AnnaSortService {
1759
1794
  applySorting(key, tempSortOrder, tableData, isLurAndCsrComponent) {
1760
1795
  let sortedTableData = tableData;
1761
1796
  if (tempSortOrder === "ASC") {
1762
- sortedTableData = cloneDeep(isLurAndCsrComponent
1797
+ sortedTableData = isLurAndCsrComponent
1763
1798
  ? this.sortEnterEditLurAndCsrPage(true, tableData, key)
1764
- : this.sortDataForComponentOtherThanLurAndCsrPage(true, tableData, key));
1799
+ : this.sortDataForComponentOtherThanLurAndCsrPage(true, tableData, key);
1765
1800
  }
1766
1801
  else if (tempSortOrder === "DESC") {
1767
- sortedTableData = cloneDeep(isLurAndCsrComponent
1802
+ sortedTableData = isLurAndCsrComponent
1768
1803
  ? this.sortEnterEditLurAndCsrPage(false, tableData, key)
1769
- : this.sortDataForComponentOtherThanLurAndCsrPage(false, tableData, key));
1804
+ : this.sortDataForComponentOtherThanLurAndCsrPage(false, tableData, key);
1770
1805
  }
1771
1806
  else if (tempSortOrder === "DEFAULT") {
1772
- sortedTableData = cloneDeep(this.noSortingAppliedData);
1807
+ sortedTableData = this.noSortingAppliedData;
1773
1808
  }
1774
1809
  return sortedTableData;
1775
1810
  }
@@ -1815,6 +1850,8 @@ class AnnaFilterService {
1815
1850
  "bookedVal",
1816
1851
  "ModifiedCpm",
1817
1852
  "ModifiedCpp",
1853
+ "Cpm",
1854
+ "Cpp",
1818
1855
  ]);
1819
1856
  this.isFilterSortActive = {};
1820
1857
  this.resetFilterSortActiveStatus = true;
@@ -1865,6 +1902,11 @@ class AnnaFilterService {
1865
1902
  "imps",
1866
1903
  "cpm",
1867
1904
  "osUnderDly",
1905
+ "activeQuarters",
1906
+ "averageActiveWeeksPerQuarter",
1907
+ "averageActiveDayparts",
1908
+ "acfiScore",
1909
+ "revenue",
1868
1910
  "totalWeeks",
1869
1911
  "WeekNumber",
1870
1912
  "Rate",
@@ -2050,7 +2092,18 @@ class AnnaFilterService {
2050
2092
  "actualImpressions",
2051
2093
  "totalAmount",
2052
2094
  "totalImps",
2053
- "totalGrp"
2095
+ "totalGrp",
2096
+ "BookedNormalizedRating",
2097
+ "BookedNormalizedImps",
2098
+ "Cpp",
2099
+ "Cpm",
2100
+ "estimatedTimeInMinutes",
2101
+ "createdVsSentTimeDifference",
2102
+ "userActionVsCreatedTimeDifference",
2103
+ "estimateVsCompletedTimeDifference",
2104
+ "actionVsCompletedTimeDifference",
2105
+ "StationPoliticalRateValue",
2106
+ "LURComputedByAnnaValue",
2054
2107
  ];
2055
2108
  const calendarArr = [
2056
2109
  "period",
@@ -2076,6 +2129,10 @@ class AnnaFilterService {
2076
2129
  "ModifiedFilterEndDate",
2077
2130
  "lastUpdatedAt",
2078
2131
  "lastUpdatedAtDate",
2132
+ "createdAtDate",
2133
+ "sentAtDate",
2134
+ "userActionAtDate",
2135
+ "CompletedAtDate"
2079
2136
  ];
2080
2137
  const timeArr = [
2081
2138
  "StartTimeForFilter",
@@ -2217,7 +2274,11 @@ class AnnaFilterService {
2217
2274
  this.selectedRadio === "airDate" ||
2218
2275
  this.selectedRadio === "scheduledWeek" ||
2219
2276
  this.selectedRadio === "ModifiedFilterStartDate" ||
2220
- this.selectedRadio === "ModifiedFilterEndDate") {
2277
+ this.selectedRadio === "ModifiedFilterEndDate" ||
2278
+ this.selectedRadio === "createdAtDate" ||
2279
+ this.selectedRadio === "sentAtDate" ||
2280
+ this.selectedRadio === "userActionAtDate" ||
2281
+ this.selectedRadio === "CompletedAtDate") {
2221
2282
  isDataFiltered =
2222
2283
  !isEqual(this.initialValueMap.get(this.selectedRadio), this.tooltipSelectedMap.get(this.selectedRadio)) && !isEqual(this.tooltipSelectedMap.get(this.selectedRadio), this.flightDateRange);
2223
2284
  if (!isDataFiltered && this.tooltipSelectedMap.has(this.selectedRadio)) {
@@ -2299,7 +2360,11 @@ class AnnaFilterService {
2299
2360
  key === "airDate" ||
2300
2361
  key === "scheduledWeek" ||
2301
2362
  key === "ModifiedFilterStartDate" ||
2302
- key === "ModifiedFilterEndDate") {
2363
+ key === "ModifiedFilterEndDate" ||
2364
+ key === "createdAtDate" ||
2365
+ key === "sentAtDate" ||
2366
+ key === "userActionAtDate" ||
2367
+ key === "CompletedAtDate") {
2303
2368
  filteredData = filteredData.filter((obj) => this.isObjectInTheRange(obj, value, key));
2304
2369
  }
2305
2370
  else if (key === "period") {
@@ -2457,7 +2522,11 @@ class AnnaFilterService {
2457
2522
  key === "airDate" ||
2458
2523
  key === "scheduledWeek" ||
2459
2524
  key === "ModifiedFilterStartDate" ||
2460
- key === "ModifiedFilterEndDate") {
2525
+ key === "ModifiedFilterEndDate" ||
2526
+ key === "createdAtDate" ||
2527
+ key === "sentAtDate" ||
2528
+ key === "userActionAtDate" ||
2529
+ key === "CompletedAtDate") {
2461
2530
  parsingFormat = "MM/DD/YYYY";
2462
2531
  const dateIsBetweenSelDate = dayjs(obj[key], parsingFormat).isBetween(value.minSelectedDate, value.maxSelectedDate);
2463
2532
  const dateIsSameAsSelStartDate = dayjs(obj[key], parsingFormat).isSame(value.minSelectedDate);
@@ -2533,7 +2602,11 @@ class AnnaFilterService {
2533
2602
  key === "airDate" ||
2534
2603
  key === "scheduledWeek" ||
2535
2604
  key === "ModifiedFilterStartDate" ||
2536
- key === "ModifiedFilterEndDate") {
2605
+ key === "ModifiedFilterEndDate" ||
2606
+ key === "createdAtDate" ||
2607
+ key === "sentAtDate" ||
2608
+ key === "userActionAtDate" ||
2609
+ key === "CompletedAtDate") {
2537
2610
  filteredData = filteredData.filter((obj) => this.isObjectInTheRange(obj, value, key));
2538
2611
  }
2539
2612
  else if (key === "period") {
@@ -3307,9 +3380,19 @@ class AnnaFilterService {
3307
3380
  item.disableTooltipIcon = true;
3308
3381
  item.filterSortObjectKeys.forEach((key) => {
3309
3382
  const latestFilters = this.appliedFiltersArray;
3310
- if (latestFilters.length > 0 &&
3311
- item.disableTooltipIcon &&
3312
- latestFilters[latestFilters.length - 1] === key) {
3383
+ // if (
3384
+ // latestFilters.length > 0 &&
3385
+ // item.disableTooltipIcon &&
3386
+ // latestFilters[latestFilters.length - 1] === key
3387
+ // ) {
3388
+ // item.disableTooltipIcon = false;
3389
+ // }
3390
+ // Enable the tooltip icon if *any* filter is currently applied on this column
3391
+ // Earlier we were only enabling the icon when the column happened to be the **last**
3392
+ // applied filter. This caused scenarios where the icon became disabled when users
3393
+ // switched between easy-filters after applying a column filter (e.g. AIR DATE & TIME).
3394
+ // Now, as long as the column has an active filter, the icon will stay enabled.
3395
+ if (item.disableTooltipIcon && latestFilters.includes(key)) {
3313
3396
  item.disableTooltipIcon = false;
3314
3397
  }
3315
3398
  if (item.disableTooltipIcon) {
@@ -4196,7 +4279,7 @@ class ButtonToggleComponent {
4196
4279
  useExisting: forwardRef(() => ButtonToggleComponent),
4197
4280
  multi: true,
4198
4281
  },
4199
- ], ngImport: i0, template: "<div\r\n class=\"toggle-group\"\r\n [ngClass]=\"isPageViewToggle ? 'view-switch-toggle' : ''\"\r\n [class.disabled]=\"disabled\"\r\n>\r\n <button\r\n *ngFor=\"let option of options\"\r\n class=\"toggle-button\"\r\n [class.active]=\"selectedValue === option.value\"\r\n [disabled]=\"disabled || option.disabled\"\r\n (click)=\"onToggle(option.value)\"\r\n >\r\n {{ option.label }}\r\n </button>\r\n</div>\r\n", styles: [".toggle-group{display:flex;border:1px solid #e0e0e0}.toggle-button{border:none;cursor:pointer;padding:0 12px;width:fit-content!important;font-weight:400;line-height:22px;font-size:var(--page-link-fs);font-family:Roboto;white-space:nowrap;transition:all .3s ease;opacity:1}.toggle-group:not(.disabled) .toggle-button.active{background:#1b88ff;color:#fff}.toggle-group:not(.disabled) .toggle-button:not(.active){background:#fff;color:#bdbdbd}.toggle-group.disabled .toggle-button.active{opacity:.5;background:#7b7b7b;color:#fff;cursor:not-allowed}.toggle-group.disabled .toggle-button:not(.active){opacity:.5;background-color:#bdbdbd;color:#4a4a4a;cursor:not-allowed}.toggle-group.view-switch-toggle{border:none!important;border-radius:2px;background:#f4f4f4!important}.toggle-group.view-switch-toggle button.toggle-button:not(.active){color:#268bff!important;background:none!important}.toggle-group.view-switch-toggle button.toggle-button.active{border-radius:2px}.toggle-group.view-switch-toggle button:only-child{cursor:default!important}\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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4282
+ ], ngImport: i0, template: "<div\r\n class=\"toggle-group\"\r\n [ngClass]=\"isPageViewToggle ? 'view-switch-toggle' : ''\"\r\n [class.disabled]=\"disabled\"\r\n>\r\n <button\r\n *ngFor=\"let option of options\"\r\n class=\"toggle-button\"\r\n [class.active]=\"selectedValue === option.value\"\r\n [disabled]=\"disabled || option.disabled\"\r\n (click)=\"onToggle(option.value)\"\r\n >\r\n {{ option.label }}\r\n </button>\r\n</div>\r\n", styles: [".toggle-group{display:flex;border:1px solid #e0e0e0}.toggle-button{border:none;cursor:pointer;padding:0 12px;width:fit-content!important;font-weight:400;line-height:22px;font-size:var(--page-link-fs);font-family:Roboto;white-space:nowrap;transition:all .3s ease;opacity:1}.toggle-group:not(.disabled) .toggle-button.active{background:#1b88ff;color:#fff}.toggle-group:not(.disabled) .toggle-button:not(.active){background:#fff;color:#bdbdbd}.toggle-group.disabled .toggle-button.active{opacity:.5;background:#7b7b7b!important;color:#fff!important;cursor:not-allowed}.toggle-group.disabled .toggle-button:not(.active){opacity:.5;background-color:#bdbdbd!important;color:#4a4a4a!important;cursor:not-allowed}.toggle-group.view-switch-toggle{border:none!important;border-radius:2px;background:#f4f4f4!important}.toggle-group.view-switch-toggle button.toggle-button:not(.active){color:#268bff;background:none}.toggle-group.view-switch-toggle button.toggle-button.active{border-radius:2px}.toggle-group.view-switch-toggle button:only-child{cursor:default!important}\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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4200
4283
  }
4201
4284
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ButtonToggleComponent, decorators: [{
4202
4285
  type: Component,
@@ -4206,7 +4289,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
4206
4289
  useExisting: forwardRef(() => ButtonToggleComponent),
4207
4290
  multi: true,
4208
4291
  },
4209
- ], template: "<div\r\n class=\"toggle-group\"\r\n [ngClass]=\"isPageViewToggle ? 'view-switch-toggle' : ''\"\r\n [class.disabled]=\"disabled\"\r\n>\r\n <button\r\n *ngFor=\"let option of options\"\r\n class=\"toggle-button\"\r\n [class.active]=\"selectedValue === option.value\"\r\n [disabled]=\"disabled || option.disabled\"\r\n (click)=\"onToggle(option.value)\"\r\n >\r\n {{ option.label }}\r\n </button>\r\n</div>\r\n", styles: [".toggle-group{display:flex;border:1px solid #e0e0e0}.toggle-button{border:none;cursor:pointer;padding:0 12px;width:fit-content!important;font-weight:400;line-height:22px;font-size:var(--page-link-fs);font-family:Roboto;white-space:nowrap;transition:all .3s ease;opacity:1}.toggle-group:not(.disabled) .toggle-button.active{background:#1b88ff;color:#fff}.toggle-group:not(.disabled) .toggle-button:not(.active){background:#fff;color:#bdbdbd}.toggle-group.disabled .toggle-button.active{opacity:.5;background:#7b7b7b;color:#fff;cursor:not-allowed}.toggle-group.disabled .toggle-button:not(.active){opacity:.5;background-color:#bdbdbd;color:#4a4a4a;cursor:not-allowed}.toggle-group.view-switch-toggle{border:none!important;border-radius:2px;background:#f4f4f4!important}.toggle-group.view-switch-toggle button.toggle-button:not(.active){color:#268bff!important;background:none!important}.toggle-group.view-switch-toggle button.toggle-button.active{border-radius:2px}.toggle-group.view-switch-toggle button:only-child{cursor:default!important}\n"] }]
4292
+ ], template: "<div\r\n class=\"toggle-group\"\r\n [ngClass]=\"isPageViewToggle ? 'view-switch-toggle' : ''\"\r\n [class.disabled]=\"disabled\"\r\n>\r\n <button\r\n *ngFor=\"let option of options\"\r\n class=\"toggle-button\"\r\n [class.active]=\"selectedValue === option.value\"\r\n [disabled]=\"disabled || option.disabled\"\r\n (click)=\"onToggle(option.value)\"\r\n >\r\n {{ option.label }}\r\n </button>\r\n</div>\r\n", styles: [".toggle-group{display:flex;border:1px solid #e0e0e0}.toggle-button{border:none;cursor:pointer;padding:0 12px;width:fit-content!important;font-weight:400;line-height:22px;font-size:var(--page-link-fs);font-family:Roboto;white-space:nowrap;transition:all .3s ease;opacity:1}.toggle-group:not(.disabled) .toggle-button.active{background:#1b88ff;color:#fff}.toggle-group:not(.disabled) .toggle-button:not(.active){background:#fff;color:#bdbdbd}.toggle-group.disabled .toggle-button.active{opacity:.5;background:#7b7b7b!important;color:#fff!important;cursor:not-allowed}.toggle-group.disabled .toggle-button:not(.active){opacity:.5;background-color:#bdbdbd!important;color:#4a4a4a!important;cursor:not-allowed}.toggle-group.view-switch-toggle{border:none!important;border-radius:2px;background:#f4f4f4!important}.toggle-group.view-switch-toggle button.toggle-button:not(.active){color:#268bff;background:none}.toggle-group.view-switch-toggle button.toggle-button.active{border-radius:2px}.toggle-group.view-switch-toggle button:only-child{cursor:default!important}\n"] }]
4210
4293
  }], propDecorators: { options: [{
4211
4294
  type: Input
4212
4295
  }], disabled: [{
@@ -4581,6 +4664,7 @@ class AnnaSingleSelectComponent {
4581
4664
  this.dropdownOpenedEvent = new EventEmitter();
4582
4665
  this.clearSelectionClickedEvent = new EventEmitter();
4583
4666
  this.yPosition = "above";
4667
+ this.showBlueBorder = false;
4584
4668
  }
4585
4669
  ngOnChanges(changes) {
4586
4670
  if (changes.config?.currentValue) {
@@ -4609,6 +4693,9 @@ class AnnaSingleSelectComponent {
4609
4693
  return;
4610
4694
  }
4611
4695
  if (!isEqual(this.selectedItem, item)) {
4696
+ if (this.config.showBlueBorderOnEdit) {
4697
+ this.showBlueBorder = !isEqual(this.config.initialSelectedItem, item);
4698
+ }
4612
4699
  this.valueChanged.emit(item);
4613
4700
  }
4614
4701
  this.selectedItem = item;
@@ -4647,7 +4734,7 @@ class AnnaSingleSelectComponent {
4647
4734
  }
4648
4735
  }
4649
4736
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AnnaSingleSelectComponent, deps: [{ token: AnnaGlobalConfigService }, { token: AnnaFilterSearchedTextPipe }], target: i0.ɵɵFactoryTarget.Component }); }
4650
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AnnaSingleSelectComponent, isStandalone: true, selector: "anna-core-single-select", inputs: { config: "config", loading: "loading", showAdditionalDataInSelectedText: "showAdditionalDataInSelectedText", disabled: "disabled", items: "items", selectedItem: "selectedItem", keyToUseForDisplay: "keyToUseForDisplay", keyToUseForCheckingSelectedItem: "keyToUseForCheckingSelectedItem", hideDropdownArrow: "hideDropdownArrow", borderbottomObject: "borderbottomObject", defaultDropdownHeight: "defaultDropdownHeight", itemsToHideInDropdownIds: "itemsToHideInDropdownIds", showClearSelection: "showClearSelection" }, outputs: { valueChanged: "valueChanged", dropdownClosedEvent: "dropdownClosedEvent", dropdownOpenedEvent: "dropdownOpenedEvent", clearSelectionClickedEvent: "clearSelectionClickedEvent" }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["dropdown"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<button\r\n id=\"dropdown-trigger\"\r\n #dropdown\r\n #t=\"matMenuTrigger\"\r\n (menuClosed)=\"dropdownClosed()\"\r\n (menuOpened)=\"dropdownOpened()\"\r\n [matMenuTriggerFor]=\"contextMenu\"\r\n [disabled]=\"disabled || loading\"\r\n>\r\n <span\r\n class=\"placeholder\"\r\n *ngIf=\"!selectedItem && config\"\r\n >{{ config.placeholder }}</span\r\n >\r\n <span\r\n class=\"selected-item\"\r\n [class]=\"selectedItem.class\"\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"selectedItem\"\r\n >\r\n <ng-container *ngIf=\"(selectedItem | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n {{ selectedItem[keyToUseForDisplay] }}\r\n <ng-container *ngIf=\"showAdditionalDataInSelectedText && selectedItem && selectedItem?.additionalData\">\r\n <span [class]=\"selectedItem?.additionalClass\">{{ selectedItem?.additionalData }} </span>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #stringTypeTemplate>\r\n {{ selectedItem }}\r\n </ng-template>\r\n </span>\r\n <div\r\n *ngIf=\"loading\"\r\n [ngClass]=\"{ 'spinner-for-button-directive': loading }\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"!loading && !hideDropdownArrow\">\r\n <i\r\n *ngIf=\"!t.menuOpen\"\r\n class=\"mdi mdi-menu-down icon\"\r\n ></i>\r\n <i\r\n *ngIf=\"t.menuOpen\"\r\n class=\"mdi mdi-menu-up icon\"\r\n ></i>\r\n </ng-container>\r\n</button>\r\n<ng-content select=\".role-tooltip-icon\"></ng-content>\r\n<mat-menu\r\n backdropClass=\"single-select-dropdown\"\r\n [yPosition]=\"yPosition\"\r\n #contextMenu=\"matMenu\"\r\n>\r\n <ng-template matMenuContent>\r\n <div\r\n class=\"{{ config.classes }}\"\r\n [style.width.px]=\"width\"\r\n >\r\n <div\r\n class=\"gap\"\r\n *ngIf=\"config.showSearchBar\"\r\n ></div>\r\n <div\r\n *ngIf=\"showClearSelection\"\r\n class=\"clear-selection\"\r\n >\r\n <a\r\n (click)=\"clearSelectionClicked()\"\r\n [ngClass]=\"{ disabled: !selectedItem }\"\r\n >Clear selection</a\r\n >\r\n </div>\r\n <section\r\n *ngIf=\"config.showSearchBar\"\r\n class=\"search-bar\"\r\n >\r\n <i class=\"mi mdi-search search-icon\"></i>\r\n <input\r\n type=\"text\"\r\n [(ngModel)]=\"searchFor\"\r\n placeholder=\"Search\"\r\n (ngModelChange)=\"updateHeight()\"\r\n (click)=\"$event.stopPropagation()\"\r\n />\r\n </section>\r\n <cdk-virtual-scroll-viewport\r\n class=\"dropdown-data-container\"\r\n itemSize=\"18\"\r\n [style.height.px]=\"heightOfCheckboxTooltipFilter\"\r\n >\r\n <ul\r\n class=\"single-select-ul\"\r\n [style.width.px]=\"width\"\r\n >\r\n <ng-container *ngIf=\"items && (items[0] | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *cdkVirtualFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n let last = last;\r\n trackBy: trackByFn\r\n \"\r\n [ngClass]=\"{\r\n active:\r\n selectedItem &&\r\n selectedItem[keyToUseForCheckingSelectedItem] ===\r\n item[keyToUseForCheckingSelectedItem],\r\n 'show-bottom-border': !last && borderbottomObject[item.id],\r\n disabled: item.isDisabled\r\n }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span [class]=\"item.class\"> {{ item[keyToUseForDisplay] }} </span>\r\n <ng-container *ngIf=\"item && item.additionalData\">\r\n <span\r\n class=\"ml-0\"\r\n [class]=\"item.additionalClass\"\r\n >\r\n {{ item?.additionalData }}\r\n </span>\r\n </ng-container>\r\n </li>\r\n\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #stringTypeTemplate>\r\n <ng-container\r\n *ngFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n [ngClass]=\"{ active: selectedItem && selectedItem === item }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span> {{ item }} </span>\r\n </li>\r\n </ng-container>\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-template>\r\n </ul>\r\n </cdk-virtual-scroll-viewport>\r\n </div>\r\n </ng-template>\r\n</mat-menu>\r\n\r\n<ng-template\r\n #noDataCase\r\n let-items=\"items\"\r\n>\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"(items | AnnafilterSearchedText: searchFor : keyToUseForDisplay)?.length === 0\"\r\n >\r\n <span> No data found </span>\r\n </li>\r\n</ng-template>\r\n", styles: ["#dropdown-trigger{height:1.5rem;background:#fff;border-radius:2px;border:1px solid #b7b7b7;width:100%;text-align:left;display:flex;align-items:center}#dropdown-trigger:disabled{background-color:#bdbdbd;opacity:.5}#dropdown-trigger:disabled .placeholder,#dropdown-trigger:disabled .icon{color:#000}.placeholder{color:#bdbdbd;width:100%;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;opacity:1!important}.icon{font-size:1.125rem;float:right;margin-left:auto}.search-bar{margin:0 7px 8px;border:1px solid #b7b7b7;height:24px;border-radius:2px}.search-bar input{outline:none;border:none;position:relative;bottom:4px;width:calc(100% - 29px);font-size:var(--dropdown-text-fs)}.search-bar .search-icon{font-size:var(--multi-select-dropdown-checkbox-fs);color:#9b9b9b;margin:5px}.search-bar .close-icon{cursor:pointer}ul{overflow-y:auto;padding-left:0;padding-bottom:0;margin-bottom:0;max-height:calc(50vh - 80px)!important}li{list-style-type:none;cursor:pointer;padding-inline:10px;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:2.14;letter-spacing:normal;color:#4a4a4a;width:100%}ul::-webkit-scrollbar{width:4px;height:4px}ul::-webkit-scrollbar-track{border:1px solid rgba(0,0,0,.1)}ul::-webkit-scrollbar-thumb{border-radius:4px;background-color:#0006!important;border:1px solid rgba(0,0,0,.2)}li:hover{background:#ebebeb}li.active{color:#fff;background:#268bff}span.selected-item{background:transparent;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;width:calc(100% - 22px);display:inline-block;vertical-align:middle}.ellipsify,li,span.selected-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}::ng-deep .cdk-overlay-container{z-index:1051}span.red-color-text{color:#f44336!important}span.additional-data-color-text{color:#b7b6b6!important}span.italic{font-style:italic}.spinner-for-button-directive{left:0;margin-left:auto}.spinner-for-button-directive span.additional-data-color-text{color:#000}::ng-deep .mat-menu-panel{min-height:auto!important}.small-text li{font-size:12px!important}.ml-0{margin-left:0}#dropdown-trigger:disabled{cursor:default!important}#dropdown-trigger:disabled span{color:#4a4a4a!important;cursor:default!important}::ng-deep .mat-mdc-menu-panel.mat-elevation-z8{box-shadow:var(--dropdown-box-shadow)}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content{background-color:#fff;padding:0!important}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content.mdc-list{background-color:#fff}::ng-deep .mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:none!important}::ng-deep .mat-mdc-menu-panel .clear-selection{margin:0 7px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a{color:var(--primary-color)!important;text-decoration:underline!important;font-size:12px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a.disabled{color:#4a4a4a!important;pointer-events:none;cursor:not-allowed;opacity:.5}li{background-color:#fff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.5rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container li.disabled{opacity:.5;cursor:default}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.1875rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}::ng-deep ul.single-select-ul{max-height:none!important}li.show-bottom-border{border-bottom:1px solid #e6e6e6}::ng-deep .no-wrap-text ul li{line-height:1.41!important;padding-top:4px;padding-bottom:4px}::ng-deep .no-wrap-text ul li span{white-space:normal!important}.gap{height:9px}\n"], dependencies: [{ kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i3$1.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: AnnaFilterSearchedTextPipe, name: "AnnafilterSearchedText" }, { kind: "pipe", type: AnnaTypeofDataPipe, name: "AnnatypeofData" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4737
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AnnaSingleSelectComponent, isStandalone: true, selector: "anna-core-single-select", inputs: { config: "config", loading: "loading", showAdditionalDataInSelectedText: "showAdditionalDataInSelectedText", disabled: "disabled", items: "items", selectedItem: "selectedItem", keyToUseForDisplay: "keyToUseForDisplay", keyToUseForCheckingSelectedItem: "keyToUseForCheckingSelectedItem", hideDropdownArrow: "hideDropdownArrow", borderbottomObject: "borderbottomObject", defaultDropdownHeight: "defaultDropdownHeight", itemsToHideInDropdownIds: "itemsToHideInDropdownIds", showClearSelection: "showClearSelection" }, outputs: { valueChanged: "valueChanged", dropdownClosedEvent: "dropdownClosedEvent", dropdownOpenedEvent: "dropdownOpenedEvent", clearSelectionClickedEvent: "clearSelectionClickedEvent" }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["dropdown"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<button\r\n id=\"dropdown-trigger\"\r\n #dropdown\r\n #t=\"matMenuTrigger\"\r\n [ngClass]=\"{ 'blue-border': config?.showBlueBorderOnEdit && showBlueBorder }\"\r\n (menuClosed)=\"dropdownClosed()\"\r\n (menuOpened)=\"dropdownOpened()\"\r\n [matMenuTriggerFor]=\"contextMenu\"\r\n [disabled]=\"disabled || loading\"\r\n>\r\n <span\r\n class=\"placeholder\"\r\n *ngIf=\"!selectedItem && config\"\r\n >{{ config.placeholder }}</span\r\n >\r\n <span\r\n class=\"selected-item\"\r\n [class]=\"selectedItem.class\"\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"selectedItem\"\r\n >\r\n <ng-container *ngIf=\"(selectedItem | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n {{ selectedItem[keyToUseForDisplay] }}\r\n <ng-container *ngIf=\"showAdditionalDataInSelectedText && selectedItem && selectedItem?.additionalData\">\r\n <span [class]=\"selectedItem?.additionalClass\">{{ selectedItem?.additionalData }} </span>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #stringTypeTemplate>\r\n {{ selectedItem }}\r\n </ng-template>\r\n </span>\r\n <div\r\n *ngIf=\"loading\"\r\n [ngClass]=\"{ 'spinner-for-button-directive': loading }\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"!loading && !hideDropdownArrow\">\r\n <i\r\n *ngIf=\"!t.menuOpen\"\r\n class=\"mdi mdi-menu-down icon\"\r\n ></i>\r\n <i\r\n *ngIf=\"t.menuOpen\"\r\n class=\"mdi mdi-menu-up icon\"\r\n ></i>\r\n </ng-container>\r\n</button>\r\n<ng-content select=\".role-tooltip-icon\"></ng-content>\r\n<mat-menu\r\n backdropClass=\"single-select-dropdown\"\r\n [yPosition]=\"yPosition\"\r\n #contextMenu=\"matMenu\"\r\n>\r\n <ng-template matMenuContent>\r\n <div\r\n class=\"{{ config.classes }}\"\r\n [style.width.px]=\"width\"\r\n >\r\n <div\r\n class=\"gap\"\r\n *ngIf=\"config.showSearchBar\"\r\n ></div>\r\n <div\r\n *ngIf=\"showClearSelection\"\r\n class=\"clear-selection\"\r\n >\r\n <a\r\n (click)=\"clearSelectionClicked()\"\r\n [ngClass]=\"{ disabled: !selectedItem }\"\r\n >Clear selection</a\r\n >\r\n </div>\r\n <section\r\n *ngIf=\"config.showSearchBar\"\r\n class=\"search-bar\"\r\n >\r\n <i class=\"mi mdi-search search-icon\"></i>\r\n <input\r\n type=\"text\"\r\n [(ngModel)]=\"searchFor\"\r\n placeholder=\"Search\"\r\n (ngModelChange)=\"updateHeight()\"\r\n (click)=\"$event.stopPropagation()\"\r\n />\r\n </section>\r\n <cdk-virtual-scroll-viewport\r\n class=\"dropdown-data-container\"\r\n itemSize=\"18\"\r\n [style.height.px]=\"heightOfCheckboxTooltipFilter\"\r\n >\r\n <ul\r\n class=\"single-select-ul\"\r\n [style.width.px]=\"width\"\r\n >\r\n <ng-container *ngIf=\"items && (items[0] | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *cdkVirtualFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n let last = last;\r\n trackBy: trackByFn\r\n \"\r\n [ngClass]=\"{\r\n active:\r\n selectedItem &&\r\n selectedItem[keyToUseForCheckingSelectedItem] ===\r\n item[keyToUseForCheckingSelectedItem],\r\n 'show-bottom-border': !last && borderbottomObject[item.id],\r\n disabled: item.isDisabled\r\n }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span [class]=\"item.class\"> {{ item[keyToUseForDisplay] }} </span>\r\n <ng-container *ngIf=\"item && item.additionalData\">\r\n <span\r\n class=\"ml-0\"\r\n [class]=\"item.additionalClass\"\r\n >\r\n {{ item?.additionalData }}\r\n </span>\r\n </ng-container>\r\n </li>\r\n\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #stringTypeTemplate>\r\n <ng-container\r\n *ngFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n [ngClass]=\"{ active: selectedItem && selectedItem === item }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span> {{ item }} </span>\r\n </li>\r\n </ng-container>\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-template>\r\n </ul>\r\n </cdk-virtual-scroll-viewport>\r\n </div>\r\n </ng-template>\r\n</mat-menu>\r\n\r\n<ng-template\r\n #noDataCase\r\n let-items=\"items\"\r\n>\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"(items | AnnafilterSearchedText: searchFor : keyToUseForDisplay)?.length === 0\"\r\n >\r\n <span> No data found </span>\r\n </li>\r\n</ng-template>\r\n", styles: ["#dropdown-trigger{height:1.5rem;background:#fff;border-radius:2px;border:1px solid #b7b7b7;width:100%;text-align:left;display:flex;align-items:center}#dropdown-trigger:disabled{background-color:#bdbdbd;opacity:.5}#dropdown-trigger:disabled .placeholder,#dropdown-trigger:disabled .icon{color:#000}.placeholder{color:#bdbdbd;width:100%;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;opacity:1!important}.icon{font-size:1.125rem;float:right;margin-left:auto}.search-bar{margin:0 7px 8px;border:1px solid #b7b7b7;height:24px;border-radius:2px}.search-bar input{outline:none;border:none;position:relative;bottom:4px;width:calc(100% - 29px);font-size:var(--dropdown-text-fs)}.search-bar .search-icon{font-size:var(--multi-select-dropdown-checkbox-fs);color:#9b9b9b;margin:5px}.search-bar .close-icon{cursor:pointer}ul{overflow-y:auto;padding-left:0;padding-bottom:0;margin-bottom:0;max-height:calc(50vh - 80px)!important}li{list-style-type:none;cursor:pointer;padding-inline:10px;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:2.14;letter-spacing:normal;color:#4a4a4a;width:100%}ul::-webkit-scrollbar{width:4px;height:4px}ul::-webkit-scrollbar-track{border:1px solid rgba(0,0,0,.1)}ul::-webkit-scrollbar-thumb{border-radius:4px;background-color:#0006!important;border:1px solid rgba(0,0,0,.2)}li:hover{background:#ebebeb}li.active{color:#fff;background:#268bff}span.selected-item{background:transparent;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;width:calc(100% - 22px);display:inline-block;vertical-align:middle}.ellipsify,li,span.selected-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}::ng-deep .cdk-overlay-container{z-index:1051}span.red-color-text{color:#f44336!important}span.additional-data-color-text{color:#b7b6b6!important}.blue-border{border:1px solid #268bff!important}span.italic{font-style:italic}.spinner-for-button-directive{left:0;margin-left:auto}.spinner-for-button-directive span.additional-data-color-text{color:#000}::ng-deep .mat-menu-panel{min-height:auto!important}.small-text li{font-size:12px!important}.ml-0{margin-left:0}#dropdown-trigger:disabled{cursor:default!important}#dropdown-trigger:disabled span{color:#4a4a4a!important;cursor:default!important}::ng-deep .mat-mdc-menu-panel.mat-elevation-z8{box-shadow:var(--dropdown-box-shadow)}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content{background-color:#fff;padding:0!important}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content.mdc-list{background-color:#fff}::ng-deep .mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:none!important}::ng-deep .mat-mdc-menu-panel .clear-selection{margin:0 7px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a{color:var(--primary-color)!important;text-decoration:underline!important;font-size:12px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a.disabled{color:#4a4a4a!important;pointer-events:none;cursor:not-allowed;opacity:.5}li{background-color:#fff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.5rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container li.disabled{opacity:.5;cursor:default}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.1875rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}::ng-deep ul.single-select-ul{max-height:none!important}li.show-bottom-border{border-bottom:1px solid #e6e6e6}::ng-deep .no-wrap-text ul li{line-height:1.41!important;padding-top:4px;padding-bottom:4px}::ng-deep .no-wrap-text ul li span{white-space:normal!important}.gap{height:9px}\n"], dependencies: [{ kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i3$1.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: AnnaFilterSearchedTextPipe, name: "AnnafilterSearchedText" }, { kind: "pipe", type: AnnaTypeofDataPipe, name: "AnnatypeofData" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4651
4738
  }
4652
4739
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AnnaSingleSelectComponent, decorators: [{
4653
4740
  type: Component,
@@ -4663,7 +4750,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
4663
4750
  NgFor,
4664
4751
  AnnaFilterSearchedTextPipe,
4665
4752
  AnnaTypeofDataPipe,
4666
- ], template: "<button\r\n id=\"dropdown-trigger\"\r\n #dropdown\r\n #t=\"matMenuTrigger\"\r\n (menuClosed)=\"dropdownClosed()\"\r\n (menuOpened)=\"dropdownOpened()\"\r\n [matMenuTriggerFor]=\"contextMenu\"\r\n [disabled]=\"disabled || loading\"\r\n>\r\n <span\r\n class=\"placeholder\"\r\n *ngIf=\"!selectedItem && config\"\r\n >{{ config.placeholder }}</span\r\n >\r\n <span\r\n class=\"selected-item\"\r\n [class]=\"selectedItem.class\"\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"selectedItem\"\r\n >\r\n <ng-container *ngIf=\"(selectedItem | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n {{ selectedItem[keyToUseForDisplay] }}\r\n <ng-container *ngIf=\"showAdditionalDataInSelectedText && selectedItem && selectedItem?.additionalData\">\r\n <span [class]=\"selectedItem?.additionalClass\">{{ selectedItem?.additionalData }} </span>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #stringTypeTemplate>\r\n {{ selectedItem }}\r\n </ng-template>\r\n </span>\r\n <div\r\n *ngIf=\"loading\"\r\n [ngClass]=\"{ 'spinner-for-button-directive': loading }\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"!loading && !hideDropdownArrow\">\r\n <i\r\n *ngIf=\"!t.menuOpen\"\r\n class=\"mdi mdi-menu-down icon\"\r\n ></i>\r\n <i\r\n *ngIf=\"t.menuOpen\"\r\n class=\"mdi mdi-menu-up icon\"\r\n ></i>\r\n </ng-container>\r\n</button>\r\n<ng-content select=\".role-tooltip-icon\"></ng-content>\r\n<mat-menu\r\n backdropClass=\"single-select-dropdown\"\r\n [yPosition]=\"yPosition\"\r\n #contextMenu=\"matMenu\"\r\n>\r\n <ng-template matMenuContent>\r\n <div\r\n class=\"{{ config.classes }}\"\r\n [style.width.px]=\"width\"\r\n >\r\n <div\r\n class=\"gap\"\r\n *ngIf=\"config.showSearchBar\"\r\n ></div>\r\n <div\r\n *ngIf=\"showClearSelection\"\r\n class=\"clear-selection\"\r\n >\r\n <a\r\n (click)=\"clearSelectionClicked()\"\r\n [ngClass]=\"{ disabled: !selectedItem }\"\r\n >Clear selection</a\r\n >\r\n </div>\r\n <section\r\n *ngIf=\"config.showSearchBar\"\r\n class=\"search-bar\"\r\n >\r\n <i class=\"mi mdi-search search-icon\"></i>\r\n <input\r\n type=\"text\"\r\n [(ngModel)]=\"searchFor\"\r\n placeholder=\"Search\"\r\n (ngModelChange)=\"updateHeight()\"\r\n (click)=\"$event.stopPropagation()\"\r\n />\r\n </section>\r\n <cdk-virtual-scroll-viewport\r\n class=\"dropdown-data-container\"\r\n itemSize=\"18\"\r\n [style.height.px]=\"heightOfCheckboxTooltipFilter\"\r\n >\r\n <ul\r\n class=\"single-select-ul\"\r\n [style.width.px]=\"width\"\r\n >\r\n <ng-container *ngIf=\"items && (items[0] | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *cdkVirtualFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n let last = last;\r\n trackBy: trackByFn\r\n \"\r\n [ngClass]=\"{\r\n active:\r\n selectedItem &&\r\n selectedItem[keyToUseForCheckingSelectedItem] ===\r\n item[keyToUseForCheckingSelectedItem],\r\n 'show-bottom-border': !last && borderbottomObject[item.id],\r\n disabled: item.isDisabled\r\n }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span [class]=\"item.class\"> {{ item[keyToUseForDisplay] }} </span>\r\n <ng-container *ngIf=\"item && item.additionalData\">\r\n <span\r\n class=\"ml-0\"\r\n [class]=\"item.additionalClass\"\r\n >\r\n {{ item?.additionalData }}\r\n </span>\r\n </ng-container>\r\n </li>\r\n\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #stringTypeTemplate>\r\n <ng-container\r\n *ngFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n [ngClass]=\"{ active: selectedItem && selectedItem === item }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span> {{ item }} </span>\r\n </li>\r\n </ng-container>\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-template>\r\n </ul>\r\n </cdk-virtual-scroll-viewport>\r\n </div>\r\n </ng-template>\r\n</mat-menu>\r\n\r\n<ng-template\r\n #noDataCase\r\n let-items=\"items\"\r\n>\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"(items | AnnafilterSearchedText: searchFor : keyToUseForDisplay)?.length === 0\"\r\n >\r\n <span> No data found </span>\r\n </li>\r\n</ng-template>\r\n", styles: ["#dropdown-trigger{height:1.5rem;background:#fff;border-radius:2px;border:1px solid #b7b7b7;width:100%;text-align:left;display:flex;align-items:center}#dropdown-trigger:disabled{background-color:#bdbdbd;opacity:.5}#dropdown-trigger:disabled .placeholder,#dropdown-trigger:disabled .icon{color:#000}.placeholder{color:#bdbdbd;width:100%;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;opacity:1!important}.icon{font-size:1.125rem;float:right;margin-left:auto}.search-bar{margin:0 7px 8px;border:1px solid #b7b7b7;height:24px;border-radius:2px}.search-bar input{outline:none;border:none;position:relative;bottom:4px;width:calc(100% - 29px);font-size:var(--dropdown-text-fs)}.search-bar .search-icon{font-size:var(--multi-select-dropdown-checkbox-fs);color:#9b9b9b;margin:5px}.search-bar .close-icon{cursor:pointer}ul{overflow-y:auto;padding-left:0;padding-bottom:0;margin-bottom:0;max-height:calc(50vh - 80px)!important}li{list-style-type:none;cursor:pointer;padding-inline:10px;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:2.14;letter-spacing:normal;color:#4a4a4a;width:100%}ul::-webkit-scrollbar{width:4px;height:4px}ul::-webkit-scrollbar-track{border:1px solid rgba(0,0,0,.1)}ul::-webkit-scrollbar-thumb{border-radius:4px;background-color:#0006!important;border:1px solid rgba(0,0,0,.2)}li:hover{background:#ebebeb}li.active{color:#fff;background:#268bff}span.selected-item{background:transparent;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;width:calc(100% - 22px);display:inline-block;vertical-align:middle}.ellipsify,li,span.selected-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}::ng-deep .cdk-overlay-container{z-index:1051}span.red-color-text{color:#f44336!important}span.additional-data-color-text{color:#b7b6b6!important}span.italic{font-style:italic}.spinner-for-button-directive{left:0;margin-left:auto}.spinner-for-button-directive span.additional-data-color-text{color:#000}::ng-deep .mat-menu-panel{min-height:auto!important}.small-text li{font-size:12px!important}.ml-0{margin-left:0}#dropdown-trigger:disabled{cursor:default!important}#dropdown-trigger:disabled span{color:#4a4a4a!important;cursor:default!important}::ng-deep .mat-mdc-menu-panel.mat-elevation-z8{box-shadow:var(--dropdown-box-shadow)}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content{background-color:#fff;padding:0!important}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content.mdc-list{background-color:#fff}::ng-deep .mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:none!important}::ng-deep .mat-mdc-menu-panel .clear-selection{margin:0 7px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a{color:var(--primary-color)!important;text-decoration:underline!important;font-size:12px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a.disabled{color:#4a4a4a!important;pointer-events:none;cursor:not-allowed;opacity:.5}li{background-color:#fff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.5rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container li.disabled{opacity:.5;cursor:default}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.1875rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}::ng-deep ul.single-select-ul{max-height:none!important}li.show-bottom-border{border-bottom:1px solid #e6e6e6}::ng-deep .no-wrap-text ul li{line-height:1.41!important;padding-top:4px;padding-bottom:4px}::ng-deep .no-wrap-text ul li span{white-space:normal!important}.gap{height:9px}\n"] }]
4753
+ ], template: "<button\r\n id=\"dropdown-trigger\"\r\n #dropdown\r\n #t=\"matMenuTrigger\"\r\n [ngClass]=\"{ 'blue-border': config?.showBlueBorderOnEdit && showBlueBorder }\"\r\n (menuClosed)=\"dropdownClosed()\"\r\n (menuOpened)=\"dropdownOpened()\"\r\n [matMenuTriggerFor]=\"contextMenu\"\r\n [disabled]=\"disabled || loading\"\r\n>\r\n <span\r\n class=\"placeholder\"\r\n *ngIf=\"!selectedItem && config\"\r\n >{{ config.placeholder }}</span\r\n >\r\n <span\r\n class=\"selected-item\"\r\n [class]=\"selectedItem.class\"\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"selectedItem\"\r\n >\r\n <ng-container *ngIf=\"(selectedItem | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n {{ selectedItem[keyToUseForDisplay] }}\r\n <ng-container *ngIf=\"showAdditionalDataInSelectedText && selectedItem && selectedItem?.additionalData\">\r\n <span [class]=\"selectedItem?.additionalClass\">{{ selectedItem?.additionalData }} </span>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #stringTypeTemplate>\r\n {{ selectedItem }}\r\n </ng-template>\r\n </span>\r\n <div\r\n *ngIf=\"loading\"\r\n [ngClass]=\"{ 'spinner-for-button-directive': loading }\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"!loading && !hideDropdownArrow\">\r\n <i\r\n *ngIf=\"!t.menuOpen\"\r\n class=\"mdi mdi-menu-down icon\"\r\n ></i>\r\n <i\r\n *ngIf=\"t.menuOpen\"\r\n class=\"mdi mdi-menu-up icon\"\r\n ></i>\r\n </ng-container>\r\n</button>\r\n<ng-content select=\".role-tooltip-icon\"></ng-content>\r\n<mat-menu\r\n backdropClass=\"single-select-dropdown\"\r\n [yPosition]=\"yPosition\"\r\n #contextMenu=\"matMenu\"\r\n>\r\n <ng-template matMenuContent>\r\n <div\r\n class=\"{{ config.classes }}\"\r\n [style.width.px]=\"width\"\r\n >\r\n <div\r\n class=\"gap\"\r\n *ngIf=\"config.showSearchBar\"\r\n ></div>\r\n <div\r\n *ngIf=\"showClearSelection\"\r\n class=\"clear-selection\"\r\n >\r\n <a\r\n (click)=\"clearSelectionClicked()\"\r\n [ngClass]=\"{ disabled: !selectedItem }\"\r\n >Clear selection</a\r\n >\r\n </div>\r\n <section\r\n *ngIf=\"config.showSearchBar\"\r\n class=\"search-bar\"\r\n >\r\n <i class=\"mi mdi-search search-icon\"></i>\r\n <input\r\n type=\"text\"\r\n [(ngModel)]=\"searchFor\"\r\n placeholder=\"Search\"\r\n (ngModelChange)=\"updateHeight()\"\r\n (click)=\"$event.stopPropagation()\"\r\n />\r\n </section>\r\n <cdk-virtual-scroll-viewport\r\n class=\"dropdown-data-container\"\r\n itemSize=\"18\"\r\n [style.height.px]=\"heightOfCheckboxTooltipFilter\"\r\n >\r\n <ul\r\n class=\"single-select-ul\"\r\n [style.width.px]=\"width\"\r\n >\r\n <ng-container *ngIf=\"items && (items[0] | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *cdkVirtualFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n let last = last;\r\n trackBy: trackByFn\r\n \"\r\n [ngClass]=\"{\r\n active:\r\n selectedItem &&\r\n selectedItem[keyToUseForCheckingSelectedItem] ===\r\n item[keyToUseForCheckingSelectedItem],\r\n 'show-bottom-border': !last && borderbottomObject[item.id],\r\n disabled: item.isDisabled\r\n }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span [class]=\"item.class\"> {{ item[keyToUseForDisplay] }} </span>\r\n <ng-container *ngIf=\"item && item.additionalData\">\r\n <span\r\n class=\"ml-0\"\r\n [class]=\"item.additionalClass\"\r\n >\r\n {{ item?.additionalData }}\r\n </span>\r\n </ng-container>\r\n </li>\r\n\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #stringTypeTemplate>\r\n <ng-container\r\n *ngFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n [ngClass]=\"{ active: selectedItem && selectedItem === item }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span> {{ item }} </span>\r\n </li>\r\n </ng-container>\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-template>\r\n </ul>\r\n </cdk-virtual-scroll-viewport>\r\n </div>\r\n </ng-template>\r\n</mat-menu>\r\n\r\n<ng-template\r\n #noDataCase\r\n let-items=\"items\"\r\n>\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"(items | AnnafilterSearchedText: searchFor : keyToUseForDisplay)?.length === 0\"\r\n >\r\n <span> No data found </span>\r\n </li>\r\n</ng-template>\r\n", styles: ["#dropdown-trigger{height:1.5rem;background:#fff;border-radius:2px;border:1px solid #b7b7b7;width:100%;text-align:left;display:flex;align-items:center}#dropdown-trigger:disabled{background-color:#bdbdbd;opacity:.5}#dropdown-trigger:disabled .placeholder,#dropdown-trigger:disabled .icon{color:#000}.placeholder{color:#bdbdbd;width:100%;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;opacity:1!important}.icon{font-size:1.125rem;float:right;margin-left:auto}.search-bar{margin:0 7px 8px;border:1px solid #b7b7b7;height:24px;border-radius:2px}.search-bar input{outline:none;border:none;position:relative;bottom:4px;width:calc(100% - 29px);font-size:var(--dropdown-text-fs)}.search-bar .search-icon{font-size:var(--multi-select-dropdown-checkbox-fs);color:#9b9b9b;margin:5px}.search-bar .close-icon{cursor:pointer}ul{overflow-y:auto;padding-left:0;padding-bottom:0;margin-bottom:0;max-height:calc(50vh - 80px)!important}li{list-style-type:none;cursor:pointer;padding-inline:10px;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:2.14;letter-spacing:normal;color:#4a4a4a;width:100%}ul::-webkit-scrollbar{width:4px;height:4px}ul::-webkit-scrollbar-track{border:1px solid rgba(0,0,0,.1)}ul::-webkit-scrollbar-thumb{border-radius:4px;background-color:#0006!important;border:1px solid rgba(0,0,0,.2)}li:hover{background:#ebebeb}li.active{color:#fff;background:#268bff}span.selected-item{background:transparent;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;width:calc(100% - 22px);display:inline-block;vertical-align:middle}.ellipsify,li,span.selected-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}::ng-deep .cdk-overlay-container{z-index:1051}span.red-color-text{color:#f44336!important}span.additional-data-color-text{color:#b7b6b6!important}.blue-border{border:1px solid #268bff!important}span.italic{font-style:italic}.spinner-for-button-directive{left:0;margin-left:auto}.spinner-for-button-directive span.additional-data-color-text{color:#000}::ng-deep .mat-menu-panel{min-height:auto!important}.small-text li{font-size:12px!important}.ml-0{margin-left:0}#dropdown-trigger:disabled{cursor:default!important}#dropdown-trigger:disabled span{color:#4a4a4a!important;cursor:default!important}::ng-deep .mat-mdc-menu-panel.mat-elevation-z8{box-shadow:var(--dropdown-box-shadow)}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content{background-color:#fff;padding:0!important}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content.mdc-list{background-color:#fff}::ng-deep .mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:none!important}::ng-deep .mat-mdc-menu-panel .clear-selection{margin:0 7px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a{color:var(--primary-color)!important;text-decoration:underline!important;font-size:12px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a.disabled{color:#4a4a4a!important;pointer-events:none;cursor:not-allowed;opacity:.5}li{background-color:#fff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.5rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container li.disabled{opacity:.5;cursor:default}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.1875rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}::ng-deep ul.single-select-ul{max-height:none!important}li.show-bottom-border{border-bottom:1px solid #e6e6e6}::ng-deep .no-wrap-text ul li{line-height:1.41!important;padding-top:4px;padding-bottom:4px}::ng-deep .no-wrap-text ul li span{white-space:normal!important}.gap{height:9px}\n"] }]
4667
4754
  }], ctorParameters: () => [{ type: AnnaGlobalConfigService }, { type: AnnaFilterSearchedTextPipe }], propDecorators: { config: [{
4668
4755
  type: Input
4669
4756
  }], loading: [{
@@ -4744,8 +4831,10 @@ class AnnaNonEditableGenericTableComponent {
4744
4831
  this.editableInputEdited = new EventEmitter();
4745
4832
  this.radioButtonMessageIconClicked = new EventEmitter();
4746
4833
  this.statusNotePopupOpened = new EventEmitter();
4834
+ this.textPopupOpened = new EventEmitter();
4747
4835
  this.digitOnlyInputChanged = new EventEmitter();
4748
4836
  this.singleSelectDropdownValueEmit = new EventEmitter();
4837
+ this.timeSelected = new EventEmitter();
4749
4838
  this.totalRowRadioButtonClicked = new EventEmitter();
4750
4839
  this.totalRowRadioButtonIconClicked = new EventEmitter();
4751
4840
  this.numberOfSkeletonRows = Array(20).fill(0);
@@ -4770,6 +4859,7 @@ class AnnaNonEditableGenericTableComponent {
4770
4859
  this.stringWithTooltipTemplate = null;
4771
4860
  this.statusNoteForTooltip = "";
4772
4861
  this.statusNoteForPopup = "";
4862
+ this.currentColumnType = "";
4773
4863
  this.bufferSizeInPxAfterWhichWillAppendNewRows = 150;
4774
4864
  this.numberOfRowsToAppend = 30;
4775
4865
  this.digitInputmin = -Infinity;
@@ -4803,6 +4893,14 @@ class AnnaNonEditableGenericTableComponent {
4803
4893
  this.setTableHeight();
4804
4894
  this.setTableBottomBorder();
4805
4895
  }
4896
+ if (changes &&
4897
+ changes.fixNumberOfRowsForPopup &&
4898
+ !changes.gtDimension &&
4899
+ this.setTableHeightWhenRowSizeIsFixed &&
4900
+ !changes.showSkeletonLoading) {
4901
+ this.setTableHeight();
4902
+ this.setTableBottomBorder();
4903
+ }
4806
4904
  if (this.showSkeletonLoading) {
4807
4905
  this.setScrollToInitialPosition();
4808
4906
  this.tableData = this.numberOfSkeletonRows;
@@ -4944,7 +5042,7 @@ class AnnaNonEditableGenericTableComponent {
4944
5042
  if (this.maximumRowsWhichCanBeRenderedWithoutScroll) {
4945
5043
  this.noOfRowsToCheck = this.maximumRowsWhichCanBeRenderedWithoutScroll;
4946
5044
  if (this.gtGeneralConfig.totalRow) {
4947
- this.noOfRowsToCheck = this.maximumRowsWhichCanBeRenderedWithoutScroll - 1;
5045
+ this.noOfRowsToCheck = this.maximumRowsWhichCanBeRenderedWithoutScroll;
4948
5046
  }
4949
5047
  }
4950
5048
  else {
@@ -5310,6 +5408,12 @@ class AnnaNonEditableGenericTableComponent {
5310
5408
  this.tooltipRadioTextMap.set("smReviewedDateTime", "SM Reviewed At");
5311
5409
  this.tooltipRadioTextMap.set("sentForEntryBy", "Sent For Entry By");
5312
5410
  this.tooltipRadioTextMap.set("sentForEntryDateTime", "Sent For Entry At");
5411
+ this.tooltipRadioTextMap.set("sendForEcClickedAt", "Send For EC Clicked At");
5412
+ this.tooltipRadioTextMap.set("ecGridFileFetchedAt", "EC Grid File Fetched At");
5413
+ this.tooltipRadioTextMap.set("jsonSentForEntryAt", "Json Sent For Entry At");
5414
+ this.tooltipRadioTextMap.set("entryCompletedAt", "Entry Completed At");
5415
+ this.tooltipRadioTextMap.set("orderConfirmedAt", "Order Confirmed At");
5416
+ this.tooltipRadioTextMap.set("linesSentForEdit", "Lines Sent For Edit At");
5313
5417
  this.tooltipRadioTextMap.set("bookedDps", "Booked DPs");
5314
5418
  this.tooltipRadioTextMap.set("totalBookedGrp", "Total Booked GRP");
5315
5419
  this.tooltipRadioTextMap.set("totalBookedImps", "Total Booked IMPS");
@@ -5374,6 +5478,7 @@ class AnnaNonEditableGenericTableComponent {
5374
5478
  this.tooltipRadioTextMap.set("actionType", "Action");
5375
5479
  this.tooltipRadioTextMap.set("projectedGrp", "Projected GRP");
5376
5480
  this.tooltipRadioTextMap.set("postedGrp", "Posted GRP");
5481
+ this.tooltipRadioTextMap.set("status", "Status");
5377
5482
  this.tooltipRadioTextMap.set("MarketName", "Market");
5378
5483
  this.tooltipRadioTextMap.set("StationName", "Market");
5379
5484
  this.tooltipRadioTextMap.set("Program", "Program Name");
@@ -5382,6 +5487,8 @@ class AnnaNonEditableGenericTableComponent {
5382
5487
  this.tooltipRadioTextMap.set("ModifiedFilterEndDate", "End Date");
5383
5488
  this.tooltipRadioTextMap.set("Daypart", "Daypart");
5384
5489
  this.tooltipRadioTextMap.set("Length", "Len");
5490
+ this.tooltipRadioTextMap.set("StationPoliticalRateValue", "Station Poltical Rate");
5491
+ this.tooltipRadioTextMap.set("LURComputedByAnnaValue", "LUR Computed By ANNA");
5385
5492
  }
5386
5493
  selectOrUnselectCheckbox(rowData, columnKeys, isCheckboxSelected) {
5387
5494
  rowData[columnKeys] = !rowData[columnKeys];
@@ -5700,20 +5807,31 @@ class AnnaNonEditableGenericTableComponent {
5700
5807
  this.ellispsisWithTableTooltip = tooltip;
5701
5808
  this.ellispsisWithTableTooltip.open();
5702
5809
  }
5703
- bindTheValueToStatusNote(note, tooltip) {
5810
+ bindTheValueToStatusNote(note, tooltip, columnType) {
5704
5811
  if (this.statusNoteTooltip && this.statusNoteTooltip.isOpen()) {
5705
5812
  this.statusNoteTooltip.close();
5706
5813
  }
5707
5814
  const lastIndex = note.length < 100 ? note.length : 100;
5708
5815
  this.statusNoteForTooltip = "";
5709
5816
  this.statusNoteForTooltip = note.substring(0, lastIndex);
5817
+ this.currentColumnType = columnType || 'statusNote';
5710
5818
  this.statusNoteForPopup = note;
5711
5819
  this.statusNoteTooltip = tooltip;
5712
5820
  this.statusNoteTooltip.open();
5713
5821
  }
5714
5822
  showEntireStatusNote() {
5715
5823
  this.closeStatusNoteTooltip();
5716
- this.statusNotePopupOpened.emit(this.statusNoteForPopup);
5824
+ if (this.currentColumnType === 'statusNote') {
5825
+ this.statusNotePopupOpened.emit(this.statusNoteForPopup);
5826
+ }
5827
+ else {
5828
+ const columnName = this.getColumnName(this.currentColumnType);
5829
+ this.textPopupOpened.emit({ text: this.statusNoteForPopup, columnName });
5830
+ }
5831
+ }
5832
+ getColumnName(columnType) {
5833
+ const header = this.tableHeaders.find(h => h.headerInfo.some(info => info.objectKey === columnType));
5834
+ return header?.headerInfo[0]?.name || columnType;
5717
5835
  }
5718
5836
  closeStatusNoteTooltip() {
5719
5837
  if (this.statusNoteTooltip && this.statusNoteTooltip.isOpen()) {
@@ -5745,8 +5863,41 @@ class AnnaNonEditableGenericTableComponent {
5745
5863
  })
5746
5864
  .join(" ");
5747
5865
  }
5866
+ bindTheValueToTimeInputTooltip(tooltip) {
5867
+ if (this.timeTableRowtooltip && this.timeTableRowtooltip.isOpen()) {
5868
+ this.closeTimeInputTooltip();
5869
+ }
5870
+ else {
5871
+ this.timeTableRowtooltip = tooltip;
5872
+ this.timeTableRowtooltip.open();
5873
+ this.filterTabObjects = [new RadioButtonModel("time", "time", false, true)];
5874
+ }
5875
+ }
5876
+ closeTimeInputTooltip() {
5877
+ if (this.timeTableRowtooltip && this.timeTableRowtooltip.isOpen()) {
5878
+ this.timeTableRowtooltip.close();
5879
+ }
5880
+ this.timeTableRowtooltip = null;
5881
+ }
5882
+ timeInputTooltipClickedInTableBody(event, rowData) {
5883
+ this.selectedRowForTimeEdit = rowData;
5884
+ this.timeInputData = [{ time: event.startTime }, { time: event.endTime }];
5885
+ }
5886
+ timeSelectedInTableRow(event) {
5887
+ // event value example -> ['02','30','am'],['02','30','pm'] ( start & end selected times)
5888
+ const startTime = this.annaDateTimeFormatService.convertTotwentyFourHrsFormat(`${event[0][0]}:${event[0][1]} ${event[0][2]}`, true);
5889
+ const endTime = this.annaDateTimeFormatService.convertTotwentyFourHrsFormat(`${event[1][0]}:${event[1][1]} ${event[1][2]}`, true);
5890
+ const convertedStartTime = `${startTime[0]}:${startTime[1]}:00`;
5891
+ const convertedEndTime = `${endTime[0]}:${endTime[1]}:00`;
5892
+ this.timeSelected.emit({
5893
+ selectedTime: event,
5894
+ selectedTimeConverted: { startTime: convertedStartTime, endTime: convertedEndTime },
5895
+ rowData: this.selectedRowForTimeEdit,
5896
+ });
5897
+ this.selectedRowForTimeEdit = null;
5898
+ }
5748
5899
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AnnaNonEditableGenericTableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: AnnaSortService }, { token: AnnaDateTimeFormatService }, { token: AnnaFilterService }], target: i0.ɵɵFactoryTarget.Component }); }
5749
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AnnaNonEditableGenericTableComponent, isStandalone: true, selector: "anna-core-non-editable-generic-table-lib", inputs: { showSkeletonLoading: "showSkeletonLoading", tableHeaders: "tableHeaders", tableData: "tableData", clonedTableData: "clonedTableData", gtGeneralConfig: "gtGeneralConfig", totalRowInfo: "totalRowInfo", gtDimension: "gtDimension", extraHeaderRowForAdjustingColumnWidths: "extraHeaderRowForAdjustingColumnWidths", tableClass: "tableClass", maximumRowsWhichCanBeRenderedWithoutScroll: "maximumRowsWhichCanBeRenderedWithoutScroll", fixNumberOfRowsForPopup: "fixNumberOfRowsForPopup", fixRowsToRender: "fixRowsToRender", includeBorderInTableHeight: "includeBorderInTableHeight", downloadInProgress: "downloadInProgress", percentDone: "percentDone", starredInProgress: "starredInProgress", clickableRow: "clickableRow", setTableHeightWhenRowSizeIsFixed: "setTableHeightWhenRowSizeIsFixed", tableBorderBottomClassRequired: "tableBorderBottomClassRequired", hideSomeTds: "hideSomeTds", tdsHaveRowSpan: "tdsHaveRowSpan", multipleTablesPresent: "multipleTablesPresent", showOrHideToggleForTotalRow: "showOrHideToggleForTotalRow" }, outputs: { toggleCheckbox: "toggleCheckbox", toggleRowCheckbox: "toggleRowCheckbox", toggleHeaderCheckbox: "toggleHeaderCheckbox", undoIconClicked: "undoIconClicked", filterAppliedToTable: "filterAppliedToTable", sortingAppliedToTable: "sortingAppliedToTable", rowClicked: "rowClicked", radioButtonSelected: "radioButtonSelected", columnFilterOpened: "columnFilterOpened", columnFilterClosed: "columnFilterClosed", gtIconClicked: "gtIconClicked", gtSVGIconClicked: "gtSVGIconClicked", gtTextActionClicked: "gtTextActionClicked", gtViewDetailClicked: "gtViewDetailClicked", gtInnerHTMLClicked: "gtInnerHTMLClicked", downloadSpotDetails: "downloadSpotDetails", clickableDataClicked: "clickableDataClicked", totalRowIconClicked: "totalRowIconClicked", notificationIconHover: "notificationIconHover", notificationIconHoverLeave: "notificationIconHoverLeave", editableInputEdited: "editableInputEdited", radioButtonMessageIconClicked: "radioButtonMessageIconClicked", statusNotePopupOpened: "statusNotePopupOpened", digitOnlyInputChanged: "digitOnlyInputChanged", singleSelectDropdownValueEmit: "singleSelectDropdownValueEmit", totalRowRadioButtonClicked: "totalRowRadioButtonClicked", totalRowRadioButtonIconClicked: "totalRowRadioButtonIconClicked" }, viewQueries: [{ propertyName: "tableElementRef", first: true, predicate: ["tableElementRef"], descendants: true, static: true }, { propertyName: "textActionTooltipTemplateRef", first: true, predicate: ["textActionTooltipTemplate"], descendants: true }, { propertyName: "programChangeTooltipTemplateRef", first: true, predicate: ["programChangeTooltipTemplate"], descendants: true }, { propertyName: "viewChildTableHeaders", predicate: ["tableHeader"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\r\n id=\"generic-table-conatiner\"\r\n #tableElementRef\r\n class=\"table-container {{ gtGeneralConfig?.tableOuterContainerName }} {{ tableBottomBorderClass }}\"\r\n [ngClass]=\"{\r\n 'scroll-left-shadow-effect': isScrolledLeft,\r\n 'scroll-right-shadow-effect': !isScrollEnded,\r\n 'clickable-row': clickableRow,\r\n 'no-data-table': (isNoDataToDisplaySubject$ | async),\r\n 'table-with-show-hide-total-row-toggle': showOrHideToggleForTotalRow\r\n }\"\r\n (scroll)=\"onTableContainerScroll($event)\"\r\n>\r\n <div\r\n [class]=\"gtGeneralConfig.tableContainerName\"\r\n class=\"horizontal-scroll-for-table-container\"\r\n [ngStyle]=\"{\r\n height:\r\n tableData.length < noOfRowsToCheck - 1\r\n ? 'calc(' +\r\n (gtDimension.rowHeight * tableData.length +\r\n (!tableData.length || !gtGeneralConfig.totalRow\r\n ? gtDimension.headerHeight\r\n : gtDimension.headerHeight + gtDimension.rowHeight)) +\r\n 'px)'\r\n : gtDimension.tableHeight\r\n }\"\r\n >\r\n <button\r\n *ngIf=\"showOrHideToggleForTotalRow && !showSkeletonLoading && (isNoDataToDisplaySubject$ | async) === false\"\r\n [ngClass]=\"{\r\n 'shift-toggle-top-on-total-row-click': !gtGeneralConfig.totalRow\r\n }\"\r\n class=\"show-or-hide-toggle-btn\"\r\n (click)=\"showHideTotalRow()\"\r\n >\r\n <i\r\n class=\"mdi mdi-menu-swap\"\r\n tooltipClass=\"show-or-hide-toggle-tooltip\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n [ngbTooltip]=\"showOrHideToggleForTotalRowTooltip\"\r\n ></i>\r\n </button>\r\n\r\n <table\r\n class=\"gt\"\r\n [ngClass]=\"tableClass\"\r\n mat-table\r\n [dataSource]=\"renderedData\"\r\n >\r\n <ng-container *ngIf=\"gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"modifiedExtraHeaderRowForAdjustingColumnWidths?.objectKeys\"\r\n [style.height.px]=\"'4px'\"\r\n [class.visibility-collapse]=\"true\"\r\n ></tr>\r\n\r\n <ng-container *ngFor=\"let row of tableColumnsOfEachRow; let i = index\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"tableColumnsOfEachRow[i]; sticky: true\"\r\n [style.height.px]=\"gtDimension.headerHeight\"\r\n ></tr>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"tableColumns; sticky: true\"\r\n [style.height.px]=\"gtDimension.headerHeight\"\r\n ></tr>\r\n </ng-container>\r\n\r\n <tr\r\n class=\"total-row\"\r\n mat-header-row\r\n [style.height.px]=\"gtDimension.rowHeight\"\r\n *matHeaderRowDef=\"totalRowColumns; sticky: true\"\r\n [class.hidden]=\"\r\n showSkeletonLoading ||\r\n (!showSkeletonLoading && !tableData.length) ||\r\n (isNoDataToDisplaySubject$ | async) ||\r\n (!showSkeletonLoading && !gtGeneralConfig.totalRow)\r\n \"\r\n ></tr>\r\n <tr\r\n [class]=\"rowData.gtClass\"\r\n [ngClass]=\"{ 'no-border-tr': (isNoDataToDisplaySubject$ | async) }\"\r\n mat-row\r\n *matRowDef=\"let rowData; columns: tableColumns\"\r\n [style.height.px]=\"gtDimension.rowHeight\"\r\n (click)=\"dataRowClicked(rowData)\"\r\n ></tr>\r\n\r\n <!-- TOTAL ROW -->\r\n <ng-container\r\n [matColumnDef]=\"column.colName\"\r\n *ngFor=\"let column of totalRowInfo; trackBy: trackByFn\"\r\n >\r\n <td\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [attr.colspan]=\"column.colspan\"\r\n class=\"{{ column.class }}\"\r\n >\r\n <ng-container\r\n *ngIf=\"\r\n column['radioButtonColumnData'] && column['radioButtonColumnData']['isRadioButtonsColumn']\r\n \"\r\n >\r\n <mat-radio-group\r\n [ngModel]=\"column.radioButtonColumnData?.selectedRadioButton\"\r\n [disabled]=\"column.radioButtonColumnData?.disableRadioGroup\"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let radioButton of column.radioButtonColumnData?.radioButtonsData;\r\n let last = last\r\n \"\r\n >\r\n <mat-radio-button\r\n value=\"{{ radioButton.value }}\"\r\n class=\"{{ radioButton.class }}\"\r\n [ngClass]=\"{\r\n disabled:\r\n radioButton?.disabled || column.radioButtonColumnData?.disableRadioGroup\r\n }\"\r\n (click)=\"totalRowRadioButtonClickedByUser(radioButton.value)\"\r\n >{{ radioButton.label }}\r\n </mat-radio-button>\r\n <ng-container *ngFor=\"let iconClass of radioButton?.iconClass\">\r\n <i\r\n class=\" {{ iconClass }}\"\r\n (click)=\"totalRowRadioButtonIconClickedByUser(radioButton.value)\"\r\n ></i\r\n ></ng-container>\r\n <br *ngIf=\"!last\" />\r\n </ng-container>\r\n </mat-radio-group>\r\n </ng-container>\r\n <ng-container *ngIf=\"column['isActionColumn']\">\r\n <a\r\n *ngFor=\"let data of column.actionData\"\r\n [class]=\"data.class\"\r\n (click)=\"onClickableDataClicked({}, data.id)\"\r\n >\r\n {{ data.name }}\r\n </a>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"column['isIconColumn']\">\r\n <i\r\n class=\"{{ column?.iconData?.class }}\"\r\n (click)=\"iconClickedInTotalRow(column?.colName)\"\r\n >\r\n </i>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!column['isActionColumn']\">\r\n <strong class=\"upper-label\"\r\n >{{ column.data }}\r\n <span\r\n class=\"red-text-totol-row\"\r\n *ngIf=\"column.additionalRedTextAfterData\"\r\n >{{ column.additionalRedTextAfterData }}</span\r\n ></strong\r\n >\r\n <ng-container *ngIf=\"column.lowerData\">\r\n <p\r\n *ngIf=\"\r\n column.colName === 'total-potential-booked-unit' &&\r\n gtGeneralConfig.component === 'RATING';\r\n else columnLowerData\r\n \"\r\n class=\"clickable-data\"\r\n (click)=\"spotDetailsDownloadClicked('TOTALROW')\"\r\n [ngClass]=\"{\r\n 'disabled-clickable-data': downloadInProgress || column.lowerData === '0'\r\n }\"\r\n >\r\n {{ column.lowerData }}\r\n <span class=\"material-icons mdi mdi-download spot-details-download-icons\"></span>\r\n <ng-container *ngIf=\"downloadInProgress && selectedRowTypeForDownload === 'TOTALROW'\">\r\n <ng-container [ngTemplateOutlet]=\"circularProgressBar\"></ng-container>\r\n </ng-container>\r\n </p>\r\n <ng-template #columnLowerData>\r\n <p class=\"lower-label\">{{ column.lowerData }}</p>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"column.tooltipMessage && gtGeneralConfig.component !== 'LUR_VIOLATIONS'\">\r\n <i\r\n class=\"{{ column.tooltipIconClass }}\"\r\n container=\"body\"\r\n [ngbTooltip]=\"column.tooltipMessage\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"top bottom\"\r\n ></i>\r\n </ng-container>\r\n <ng-container *ngIf=\"gtGeneralConfig.component === 'LUR_VIOLATIONS' && column.tooltipMessage\">\r\n <i\r\n class=\"mi mdi-info-outline info-label\"\r\n container=\"body\"\r\n [ngbTooltip]=\"lurViolationTotalRowToolTip\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"bottom\"\r\n ></i>\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <ng-container\r\n [matColumnDef]=\"columnDef\"\r\n *ngFor=\"\r\n let columnDef of modifiedExtraHeaderRowForAdjustingColumnWidths.objectKeys;\r\n let i = index;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <th\r\n #tableHeader\r\n nowrap\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [style.width]=\"modifiedExtraHeaderRowForAdjustingColumnWidths.widths[i]\"\r\n ></th\r\n ></ng-container>\r\n ></ng-container\r\n >\r\n\r\n <!-- MAIN ROW -->\r\n <ng-container\r\n [matColumnDef]=\"columnDef.headerInfo[0].objectKey\"\r\n *ngFor=\"let columnDef of tableHeaders; trackBy: trackByFn\"\r\n >\r\n <th\r\n #tableHeader\r\n nowrap\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [style.width]=\"columnDef.width\"\r\n [attr.rowspan]=\"columnDef.rowspan ? columnDef.rowspan : 1\"\r\n [attr.colspan]=\"columnDef.colspan ? columnDef.colspan : 1\"\r\n >\r\n <div\r\n class=\"row mx-0\"\r\n [ngClass]=\"{ 'dummy-header': columnDef.dummyHeader }\"\r\n *ngFor=\"let header of columnDef.headerInfo; let j = index\"\r\n >\r\n <p\r\n *ngIf=\"header.typeOfHeaderData === 'STRING'\"\r\n [ngClass]=\"{ 'upper-label': j === 0, 'lower-label': j === 1 }\"\r\n >\r\n <ngx-skeleton-loader\r\n *ngIf=\"header.name == null\"\r\n count=\"1\"\r\n [theme]=\"{\r\n height: '10px',\r\n display: 'block',\r\n width: columnDef.width,\r\n 'max-width': 'calc(100% - 20px)'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <!-- <ng-container *ngIf=\"header.name\">\r\n {{ header.name }}\r\n </ng-container> -->\r\n <span [innerHTML]=\"header.name\"></span>\r\n <ng-container *ngIf=\"header.tooltip && header.tooltip.tooltipMessage\">\r\n <i\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"header.tooltip.tooltipMessage\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </ng-container>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'impsInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"impsInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"\r\n header.tooltip && header.tooltip.name === 'spotsColumnEquivalizationMessageTooltip'\r\n \"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"spotsColumnEquivalizationMessageTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'underDeliveryTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"underDeliveryTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'overDeliveryTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"overDeliveryTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'ratingInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"ratingInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'rateInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"rateInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'ongoingRevBookedColumnTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"ongoingRevBookedColumnTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'completedRevBookedColumnTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"completedRevBookedColumnTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedRate'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedRate\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedRtg'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedRtg\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedImps'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedImps\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'automationTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"automationTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'rebateImpact'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"rebateImpact\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'projectedImpsRtg'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"projectedImpsRtg\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </p>\r\n\r\n <ng-container *ngIf=\"header.typeOfHeaderData === 'CHECKBOX'\">\r\n <span\r\n *ngIf=\"gtGeneralConfig.isHeaderChecked\"\r\n class=\"mdi mdi-checkbox-marked custom-column-checkbox-checked\"\r\n (click)=\"selectUnselectAllRows()\"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!gtGeneralConfig.isHeaderChecked\"\r\n class=\"mdi mdi-checkbox-blank-outline custom-column-checkbox-unchecked\"\r\n [ngClass]=\"{ 'disable-checkbox': gtGeneralConfig.disableHeaderCheckbox }\"\r\n (click)=\"selectUnselectAllRows()\"\r\n >\r\n </span>\r\n </ng-container>\r\n\r\n <div\r\n *ngIf=\"gtGeneralConfig.showAllColumnFilter && header && header.typeOfHeaderData !== ''\"\r\n class=\"sort-filter-container\"\r\n >\r\n <ng-container *ngIf=\"header.showTooltipIcon\">\r\n <!-- Active tooltip Functionality -->\r\n <ng-container *ngIf=\"header.filter === 'CHECKBOX'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"filterTooltip\"\r\n placement=\"{{ filterAlignment }}\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-checkbox-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'SLIDER'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"sliderToolTip\"\r\n placement=\"bottom left-top\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-slider-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t1=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t1, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'DATE'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"datePickerTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-datepicker-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t2=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t2, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'WEEK'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"weekPickerToolTip\"\r\n placement=\"bottom left-top\"\r\n container=\"body\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t3=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t3, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'TIME'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"timeFilterToolTip\"\r\n placement=\"bottom left-top auto\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-time-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t4=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t4, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!header.showTooltipIcon\">\r\n <span id=\"no-filter-space\"></span><br />\r\n </ng-container>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'lurViolationInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"lurViolationInfoTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </div>\r\n </div>\r\n </th>\r\n\r\n <ng-container *matCellDef=\"let ROW_DATA\">\r\n <td\r\n mat-cell\r\n [style.background]=\"ROW_DATA.backgroundColor\"\r\n [style.border]=\"ROW_DATA.border\"\r\n class=\"{{ ROW_DATA.rowClass }}\"\r\n [ngClass]=\"ROW_DATA[columnDef.headerInfo[0].objectKey + 'TdClass']\"\r\n [attr.rowspan]=\"tdsHaveRowSpan ? ROW_DATA[columnDef.headerInfo[0].objectKey + 'Rowspan'] : 1\"\r\n *ngIf=\"\r\n !hideSomeTds ||\r\n (hideSomeTds && !ROW_DATA['hide' + columnDef.headerInfo[0].objectKey + 'Td'])\r\n \"\r\n >\r\n <ngx-skeleton-loader\r\n *ngIf=\"showSkeletonLoading\"\r\n count=\"1\"\r\n [theme]=\"{ height: '10px', display: 'block', marginBottom: '0' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n\r\n <ng-container *ngIf=\"!showSkeletonLoading\">\r\n <ng-container *ngIf=\"tableData.length > 0 && (isNoDataToDisplaySubject$ | async) === false\">\r\n <ng-container\r\n *ngFor=\"\r\n let subline of columnDef.headerInfo;\r\n let subLineIndex = index;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <div annaCoreShowEllipsisTextOnHover>\r\n <ng-container [ngSwitch]=\"columnDef.headerInfo[subLineIndex].typeOfBodyData\">\r\n <ng-container *ngSwitchCase=\"'ICON'\">\r\n <i\r\n *ngIf=\"\r\n !(\r\n starredInProgress &&\r\n ROW_DATA.orderId === selectedStarredOrderId\r\n )\r\n \"\r\n [class]=\"ROW_DATA.iconClass\"\r\n [ngClass]=\"{ 'disabled-starring': starredInProgress }\"\r\n (click)=\"iconClicked(ROW_DATA, ROW_DATA.iconClass)\"\r\n ngbTooltip=\"{{ ROW_DATA.iconTitleText }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n ></i>\r\n <ng-container\r\n *ngIf=\"\r\n starredInProgress && ROW_DATA.orderId === selectedStarredOrderId\r\n \"\r\n >\r\n <div\r\n class=\"spinner-for-button-directive\"\r\n [ngClass]=\"{ 'disabled-starring': starredInProgress }\"\r\n ></div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'ICON_CELL'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <ng-container *ngIf=\"action.showObjectKey\">\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </ng-container>\r\n\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action.tooltipClass\r\n }}\"\r\n [ngbTooltip]=\"\r\n action.showTooltip && action?.tooltipData\r\n ? tipContent\r\n : null\r\n \"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!action.showTooltip\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action.tooltipData\"></div\r\n ></ng-template>\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'HTML_STRING'\">\r\n <p\r\n [innerHTML]=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n (click)=\"innerHTMLCellClicked($event, ROW_DATA)\"\r\n ></p>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SVG_ICON'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n class=\"pr-4\"\r\n *ngIf=\"action?.showObjectKey\"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n class=\"pr-4 {{ action?.additionalTextClass }}\"\r\n *ngIf=\"action?.additionalText\"\r\n >\r\n {{ action?.additionalText }}\r\n </span>\r\n\r\n <anna-core-icon-column\r\n class=\"pr-4\"\r\n *ngIf=\"action?.svgOrIconName\"\r\n [componentName]=\"gtGeneralConfig.component\"\r\n [dataObject]=\"ROW_DATA\"\r\n [iconToShow]=\"action.svgOrIconName\"\r\n data-html=\"true\"\r\n [ngbTooltip]=\"tipContent\"\r\n [disableTooltip]=\"!action?.svgOrIconTooltipMsg\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n (columnIconClicked)=\"\r\n svgIconClicked(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n )\r\n \"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action?.svgOrIconTooltipMsg\"></div\r\n ></ng-template>\r\n </anna-core-icon-column>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'TEXT_ACTIONS'\">\r\n <ng-container\r\n *ngFor=\"\r\n let text of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <button\r\n *ngIf=\"text.showTooltip\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n text.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disabled]=\"text.isDisabled\"\r\n class=\"{{ text.class }}\"\r\n (mouseenter)=\"\r\n mouseEnterOnTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n [ngbTooltip]=\"textActionTooltipTemplate\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n >\r\n {{ text.name }}\r\n </button>\r\n\r\n <button\r\n *ngIf=\"!text.showTooltip\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n text.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disabled]=\"text.isDisabled\"\r\n class=\"{{ text.class }}\"\r\n >\r\n {{ text.name }}\r\n </button>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'CHECKBOX'\">\r\n <span\r\n *ngIf=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n class=\"mdi mdi-checkbox-marked custom-column-checkbox-checked\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n false\r\n )\r\n \"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n class=\"mdi mdi-checkbox-blank-outline custom-column-checkbox-unchecked\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n true\r\n )\r\n \"\r\n >\r\n </span>\r\n\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionTypeContainingTable(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"tooltip-containing-table remove-on-scroll-class\"\r\n ngbTooltip=\"tooltipContainingTableTemplate\"\r\n >\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'CLICKABLE_DATA'\">\r\n <a\r\n *ngFor=\"\r\n let text of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n [class]=\"text.class\"\r\n (click)=\"onClickableDataClicked(ROW_DATA, text.id)\"\r\n >{{ text.name }}</a\r\n >\r\n <span\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedUnits' &&\r\n gtGeneralConfig.component === 'RATING'\r\n \"\r\n class=\"clickable-data\"\r\n (click)=\"spotDetailsDownloadClicked('DATAROW', ROW_DATA)\"\r\n [ngClass]=\"{\r\n 'disabled-clickable-data':\r\n downloadInProgress || ROW_DATA.displayBookedUnits === '-'\r\n }\"\r\n >{{ ROW_DATA.displayBookedUnits }}\r\n <span\r\n class=\"material-icons mdi mdi-download spot-details-download-icons\"\r\n ></span>\r\n <ng-container\r\n *ngIf=\"\r\n downloadInProgress &&\r\n ROW_DATA.ProgramId === selectedProgramIdForDownload &&\r\n ROW_DATA.Demographic === selectedDemographicForDownload\r\n \"\r\n >\r\n <ng-container\r\n [ngTemplateOutlet]=\"circularProgressBar\"\r\n ></ng-container>\r\n </ng-container>\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING___ICON_OR_TEXT_ACTION'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n [class]=\"action.additionalTextBeforeLinkClass\"\r\n [innerHtml]=\"action.additionalTextBeforeLink\"\r\n ngbTooltip=\"{{ action.additionalTextBeforeLink }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n [disableTooltip]=\"!action.enableTooltipForAdditionalText\"\r\n ></span>\r\n\r\n <ng-container *ngIf=\"action && action.typeOfData === 'STRING'\">\r\n <span\r\n class=\"text-with-icon-and-text\"\r\n [ngClass]=\"{ 'reduced-width': action.showIcon }\"\r\n annaCoreShowEllipsisTextOnHover\r\n >{{ action.data }}</span\r\n >\r\n </ng-container>\r\n\r\n <a\r\n [id]=\"action.id\"\r\n *ngIf=\"action.showLink\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [class]=\"action.linkClass\"\r\n [ngClass]=\"{ disabled: action.disabledLink }\"\r\n >{{ action.data }}</a\r\n >\r\n <span\r\n ngbTooltip=\"{{ action.additionalTextAfterLink }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n [class]=\"action.additionalTextAfterLinkClass\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n [disableTooltip]=\"!action.enableTooltipForAdditionalAfterText\"\r\n >\r\n {{ action.additionalTextAfterLink }}\r\n </span>\r\n\r\n <ng-container *ngIf=\"action.showTooltip\">\r\n <ng-container *ngIf=\"action.tooltipData.innerHtml\">\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionTypeContainingTable(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"tooltip-containing-table remove-on-scroll-class\"\r\n [ngbTooltip]=\"tooltipContainingTableTemplate\"\r\n >\r\n </i>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!action.tooltipData.tooltipTableBody\">\r\n <span\r\n *ngIf=\"action.showIcon\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n class=\"icon-tooltip-text\"\r\n (click)=\"\r\n iconClickedOnStringIconActionType(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n (mouseleave)=\"mouseLeaveTextActionType(ROW_DATA)\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n [placement]=\"\r\n action.tooltipPlacement\r\n ? action.tooltipPlacement\r\n : 'bottom auto'\r\n \"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action.tooltipClass\r\n }}\"\r\n [ngbTooltip]=\"userLoggedInDetails\"\r\n >\r\n <i [class]=\"action.iconClass\"> </i>\r\n {{ action.additionalTextAfterIcon ?? \"\" }}\r\n </span>\r\n <ng-container *ngIf=\"action['showSvgIcon']\">\r\n <anna-core-anna-est-icon-template\r\n class=\"float-right\"\r\n *ngIf=\"action['svgIconName'] === 'anna-icon'\"\r\n (mouseleave)=\"mouseLeaveTextActionType(ROW_DATA)\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex]\r\n .tooltipKey\r\n )\r\n \"\r\n [placement]=\"\r\n action.tooltipPlacement\r\n ? action.tooltipPlacement\r\n : 'bottom auto'\r\n \"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action['tooltipClass']\r\n }}\"\r\n [ngbTooltip]=\"userLoggedInDetails\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n >\r\n </anna-core-anna-est-icon-template>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!action.showTooltip\">\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (click)=\"\r\n iconClickedOnStringIconActionType(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n >\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_OR_INPUT'\">\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.type ===\r\n 'STRING';\r\n else inputBox\r\n \"\r\n >\r\n <span\r\n [innerHtml]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.value\r\n \"\r\n ></span>\r\n </ng-container>\r\n\r\n <ng-template #inputBox>\r\n <span class=\"input-box-container\">\r\n <input\r\n placeholder=\"{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.placeholder\r\n }}\"\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .className\r\n }}\"\r\n (keydown)=\"\r\n changesMadeInEditableInputBox(\r\n $event,\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n false\r\n )\r\n \"\r\n (paste)=\"\r\n changesMadeInEditableInputBox(\r\n $event,\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n true\r\n )\r\n \"\r\n (ngModelChange)=\"\r\n editableInputValueChanged(\r\n $event,\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n )\r\n \"\r\n [ngModel]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .value\r\n \"\r\n [disabled]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .disabled\r\n \"\r\n [ngClass]=\"{\r\n 'red-border':\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ].hasError\r\n }\"\r\n />\r\n\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action?.showIcon\"\r\n container=\"body\"\r\n [ngbTooltip]=\"tipContent\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"bottom\"\r\n class=\"{{ action?.iconClass }}\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action?.iconTooltip\"></div\r\n ></ng-template>\r\n </i>\r\n <ng-container *ngIf=\"action?.showSvgIcon\">\r\n <anna-core-icon-column\r\n class=\"pr-4\"\r\n *ngIf=\"action?.svgOrIconName\"\r\n [componentName]=\"gtGeneralConfig.component\"\r\n [dataObject]=\"ROW_DATA\"\r\n [iconToShow]=\"action?.svgOrIconName\"\r\n data-html=\"true\"\r\n [ngbTooltip]=\"tipContent\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n >\r\n <ng-template #tipContent>\r\n <div\r\n [innerHTML]=\"action?.svgOrIconTooltipMsg\"\r\n ></div></ng-template\r\n ></anna-core-icon-column>\r\n </ng-container>\r\n <ng-container *ngIf=\"action?.showLink\">\r\n <a\r\n [id]=\"action?.id\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action?.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [class]=\"action.linkClass\"\r\n >{{ action?.linkText }}\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </span>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'HTML'\">\r\n <span\r\n [innerHtml]=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n ></span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SINGLE_SELECT_DROPDOWN'\">\r\n <ng-container\r\n *ngFor=\"\r\n let dropdown of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ];\r\n let dropdownIndex = index\r\n \"\r\n >\r\n <anna-core-single-select\r\n class=\"gt-single-select dropdown {{ dropdown?.className }}\"\r\n [ngClass]=\"{ error: !dropdown?.selectedItem }\"\r\n [items]=\"dropdown?.itemList\"\r\n [selectedItem]=\"dropdown?.selectedItem\"\r\n [config]=\"dropdown?.dropdownConfig\"\r\n (valueChanged)=\"\r\n onDropdownChanged($event, ROW_DATA, dropdownIndex)\r\n \"\r\n >\r\n </anna-core-single-select>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SINGLE_RADIO'\">\r\n <span\r\n *ngIf=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n class=\"mdi mdi-radiobox-marked\"\r\n (click)=\"(null)\"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n class=\"mdi mdi-radiobox-blank\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n true\r\n )\r\n \"\r\n >\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'RADIO'\">\r\n <mat-radio-group\r\n *ngIf=\"ROW_DATA['RadioButtonConfig']; else showHyphen\"\r\n [ngModel]=\"ROW_DATA[subline.objectKey]\"\r\n [disabled]=\"ROW_DATA['RadioButtonConfig'][0].isDisabled\"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let radioButton of ROW_DATA['RadioButtonConfig'];\r\n let last = last\r\n \"\r\n >\r\n <mat-radio-button\r\n value=\"{{ radioButton.value }}\"\r\n class=\"{{ radioButton.class }}\"\r\n (click)=\"\r\n radioButtonClicked(\r\n ROW_DATA,\r\n radioButton.value,\r\n ROW_DATA['RadioButtonConfig'][0].isDisabled\r\n )\r\n \"\r\n >{{ radioButton.label }}\r\n </mat-radio-button>\r\n <ng-container *ngIf=\"radioButton.icons\">\r\n <i\r\n *ngFor=\"let icon of radioButton.icons\"\r\n class=\" {{ icon.class }}\"\r\n (click)=\"radioButtonIconClicked(ROW_DATA, icon.name)\"\r\n ></i>\r\n </ng-container>\r\n\r\n <i\r\n *ngIf=\"radioButton.tooltipMessage\"\r\n class=\"mi mdi-info-outline\"\r\n [ngbTooltip]=\"radioButton.tooltipMessage\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n ></i>\r\n <br *ngIf=\"!last\" />\r\n </ng-container>\r\n </mat-radio-group>\r\n <ng-template #showHyphen> - </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_TOOLTIP'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span class=\"action-data\"> {{ action?.dataToDisplay }}</span>\r\n <ng-container *ngIf=\"action?.additionalTextWoTooltip\">\r\n <span\r\n class=\"additional-text-wo-tooltip\"\r\n [innerHtml]=\"action.additionalTextWoTooltip\"\r\n >\r\n </span>\r\n </ng-container>\r\n <span\r\n *ngIf=\"action?.showTooltip\"\r\n [ngbTooltip]=\"stringWithTooltipTemplate\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringWithTooltipTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey,\r\n tooltipWithStringRef\r\n )\r\n \"\r\n [placement]=\"action?.tooltipPosition\"\r\n container=\"body\"\r\n [class]=\"action?.tooltipIconClass\"\r\n [autoClose]=\"'outside'\"\r\n [triggers]=\"action.isManualTrigger ? 'manual' : 'hover focus'\"\r\n #tooltipWithStringRef=\"ngbTooltip\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class {{\r\n action?.tooltipInnerClass\r\n }}\"\r\n [disableTooltip]=\"action?.disableTooltip\"\r\n >\r\n </span>\r\n <span>{{ action?.dataToDisplayAfterTooltip }}</span>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_ELLIPSIS_WITH_TABLE_TOOLTIP'\">\r\n <div class=\"new-ellipsis-container\">\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"cell-value\"\r\n >\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .cellValue\r\n }}\r\n </span>\r\n <span\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.showTooltip\r\n \"\r\n class=\"tooltip-text\"\r\n [ngbTooltip]=\"tableInsideTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n triggers=\"manual\"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"table-inside-tooltip remove-on-scroll-class {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.tooltipClass\r\n }}\"\r\n (mouseenter)=\"\r\n bindTheValueToTableTooltip(\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey],\r\n info\r\n )\r\n \"\r\n >\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.tooltipHoverText\r\n }}\r\n </span>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_ELLIPSIS_AND_READ_MORE_TOOLTIP'\">\r\n <span\r\n title=\"\"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length <\r\n 26\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n title=\"\"\r\n [ngbTooltip]=\"statusNoteTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n [triggers]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length >\r\n 100\r\n ? 'manual'\r\n : 'hover focus'\r\n \"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"status-note-tooltip\"\r\n (mouseenter)=\"\r\n bindTheValueToStatusNote(\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey],\r\n info\r\n )\r\n \"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length >\r\n 25\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_TOOLTIP_INNER_HTML'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"action-data\"\r\n [ngClass]=\"action?.showTooltip ? 'reduced-width-text' : ''\"\r\n >\r\n {{ action?.dataToDisplay }}</span\r\n >\r\n <span\r\n *ngIf=\"action?.showTooltip\"\r\n [ngbTooltip]=\"innerHtmlToolTipTemplate\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringWithInnerHtmlTooltipTextActionType(\r\n ROW_DATA,\r\n action,\r\n tooltipWithInnerHtmlRef,\r\n !action.isManualTrigger\r\n )\r\n \"\r\n [placement]=\"action?.tooltipPosition\"\r\n container=\"body\"\r\n [class]=\"\r\n 'innrHtml-tooltip-icon-marker ' + action?.tooltipIconClass\r\n \"\r\n [autoClose]=\"'outside'\"\r\n [triggers]=\"action.isManualTrigger ? 'manual' : 'hover focus'\"\r\n #tooltipWithInnerHtmlRef=\"ngbTooltip\"\r\n tooltipClass=\"gt-icon-innerHtml-tooltip remove-on-scroll-class {{\r\n action?.tooltipInnerClass\r\n }}\"\r\n [disableTooltip]=\"action?.disableTooltip\"\r\n >\r\n {{ action.tooltipMarkerText }}\r\n </span>\r\n <span *ngIf=\"action?.dataToDisplayAfterTooltip\">\r\n {{ action?.dataToDisplayAfterTooltip }}\r\n </span>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngSwitchCase=\"\r\n 'ICON_CELL_AND_STRING_WITH_ELLIPSIS_AND_READ_MORE_TOOLTIP'\r\n \"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n title=\"\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"action.showTooltip ? action.tooltipData : null\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!action.showTooltip\"\r\n >\r\n </i>\r\n\r\n <ng-container *ngIf=\"action.showObjectKey\">\r\n <span\r\n title=\"\"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length < 26\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n title=\"\"\r\n [ngbTooltip]=\"statusNoteTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n [triggers]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length > 100\r\n ? 'manual'\r\n : 'hover focus'\r\n \"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"status-note-tooltip\"\r\n (mouseenter)=\"\r\n bindTheValueToStatusNote(\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n info\r\n )\r\n \"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length > 25\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'DIGIT_ONLY_INPUT'\">\r\n <input\r\n annaCoreDigitOnly\r\n [type]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].type\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .type\r\n : 'text'\r\n \"\r\n [decimal]=\"true\"\r\n [readOnly]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].disabled\r\n \"\r\n inputmode=\"numeric\"\r\n [min]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].min ||\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.min ===\r\n 0\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].min\r\n : digitInputmin\r\n \"\r\n [max]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].max ||\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.max ===\r\n 0\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].max\r\n : digitInputMax\r\n \"\r\n [allowPaste]=\"false\"\r\n class=\"form-control\"\r\n [value]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].value\r\n \"\r\n [placeholder]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .placeholder\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .placeholder\r\n : 'Enter value'\r\n \"\r\n (input)=\"\r\n onInputChange(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n $event\r\n )\r\n \"\r\n />\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container *ngIf=\"subline.objectKey !== 'description'\">\r\n <span annaCoreShowEllipsisTextOnHover>{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n }}</span>\r\n <!-- <i\r\n *ngIf=\"\r\n subline.objectKey === 'inventoryCode' &&\r\n ROW_DATA['isSellerGroup'] &&\r\n gtGeneralConfig.component === 'RATING'\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n [ngbTooltip]=\"sellerHierarchyTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n triggers=\"manual\"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"hierarchy-tooltip remove-on-scroll-class\"\r\n (mouseenter)=\"\r\n bindTheValueToSellerGroupTooltip(\r\n ROW_DATA.sellerGroupHierarchy,\r\n info\r\n )\r\n \" \r\n >\r\n </i>-->\r\n\r\n <i\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedAverageRating' &&\r\n gtGeneralConfig.component === 'RATING' &&\r\n ROW_DATA['showRatingAverageIcon']\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n (mouseenter)=\"\r\n setIsDifference(ROW_DATA.isDifferenceLessThan25Percent)\r\n \"\r\n tooltipClass=\"posted-avg-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"postedRatingDifference\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedAverageImpression' &&\r\n gtGeneralConfig.component === 'RATING' &&\r\n ROW_DATA['showImpressionAverageIcon']\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n (mouseenter)=\"\r\n setIsDifference(ROW_DATA.isDifferenceLessThan25Percent)\r\n \"\r\n tooltipClass=\"posted-avg-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"postedImpDifference\"\r\n >\r\n </i>\r\n </ng-container>\r\n <ng-container *ngIf=\"subline.objectKey === 'description'\">\r\n <p\r\n *ngIf=\"\r\n ROW_DATA.descriptionMessage ||\r\n ROW_DATA.descriptionEmailReferenceNum\r\n \"\r\n >\r\n <ng-container *ngIf=\"ROW_DATA.descriptionMessage\">\r\n {{ ROW_DATA.descriptionMessage }}\r\n <br />\r\n </ng-container>\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA.descriptionEmailReferenceNum !== '-' &&\r\n ROW_DATA.descriptionEmailReferenceNum !== ''\r\n \"\r\n >\r\n Email Ref: {{ ROW_DATA.descriptionEmailReferenceNum }}\r\n <br />\r\n </ng-container>\r\n </p>\r\n <a\r\n href=\"{{ ROW_DATA.descriptionDetailsUrl }}\"\r\n target=\"_blank\"\r\n *ngIf=\"\r\n ROW_DATA.descriptionDetailsUrlType === 'PDF' ||\r\n ROW_DATA.descriptionDetailsUrlType === 'EXCEL'\r\n \"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn\">Download</button>\r\n </a>\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA.activityname.toLowerCase() === 'order onboarded'\r\n \"\r\n >\r\n <a\r\n *ngIf=\"ROW_DATA.descriptionDetailsUrlType === 'LINK'\"\r\n (click)=\"viewDetailsClicked(ROW_DATA)\"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn order-onboarded\">\r\n View details\r\n </button>\r\n </a>\r\n </ng-container>\r\n\r\n <a\r\n href=\"{{ ROW_DATA.descriptionEmailUrl }}\"\r\n target=\"_blank\"\r\n *ngIf=\"\r\n ROW_DATA.descriptionEmailUrl !== '-' &&\r\n ROW_DATA.descriptionEmailUrl !== ''\r\n \"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn\">View email</button>\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"isNoDataToDisplaySubject$ | async\">\r\n <div>\r\n {{ null }}\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n </table>\r\n </div>\r\n <anna-core-no-data-lib\r\n [width]=\"noDataWidth\"\r\n [marginTop]=\"marginTop\"\r\n *ngIf=\"isNoDataToDisplaySubject$ | async\"\r\n >\r\n </anna-core-no-data-lib>\r\n</div>\r\n\r\n<!-- Checkbox template -->\r\n<ng-template #filterTooltip>\r\n <anna-core-anna-column-checkbox-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-checkbox-filter>\r\n</ng-template>\r\n\r\n<!-- Slider template -->\r\n<ng-template #sliderToolTip>\r\n <anna-core-anna-column-slider-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-slider-filter>\r\n</ng-template>\r\n\r\n<!-- Date Picker Template -->\r\n<ng-template #datePickerTooltip>\r\n <anna-core-anna-column-date-range-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-date-range-filter>\r\n</ng-template>\r\n\r\n<!-- Week Picker Template -->\r\n<ng-template #weekPickerToolTip>\r\n <!-- <div class=\"weekpicker-container\">\r\n <anna-core-week-calendar-filter-lib\r\n [week-calendar-config]=\"gtGeneralConfig.multiWeekPickerConfig\"\r\n (apply)=\"applyWeekFilter($event)\"\r\n [from-date]=\"calendarMinEnabledDate\"\r\n [to-date]=\"calendarMaxEnabledDate\"\r\n >\r\n </anna-core-week-calendar-filter-lib>\r\n </div> -->\r\n</ng-template>\r\n\r\n<!-- Time Filter Template -->\r\n<ng-template #timeFilterToolTip>\r\n <anna-core-anna-column-time-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [showAllTimeRangeCheckboxes]=\"showCheckboxesForTimeFilter\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-time-filter>\r\n</ng-template>\r\n\r\n<ng-template #columnInfoTooltip>\r\n <p class=\"black-color-text white-space-nowrap\">This preemption is rejected and not marked for credit.</p>\r\n</ng-template>\r\n\r\n<ng-template #ratingInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked Rating' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected Rating' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #impsInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked IMPS' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected IMPS' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #spotsColumnEquivalizationMessageTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n This consists of equivalized spots and un-equivalized Paid Programs & un-equivalized Non-spots.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #underDeliveryTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n Indicates the Under-delivery percentage based on booked and posted RTG/IMPS.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #overDeliveryTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n Indicates the Over-delivery percentage based on booked and posted RTG/IMPS.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #rateInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked Rate' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected $ Value' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #sellerHierarchyTooltip>\r\n <ng-container *ngIf=\"sellerGroupHierarchy.length > 0\">\r\n <section class=\"hierarchy-table-container\">\r\n <table class=\"seller-hierarchy-table\">\r\n <thead>\r\n <tr>\r\n <th>#</th>\r\n <th>Inventory Codes</th>\r\n <th>Program/Description</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of sellerGroupHierarchy; let tooltipIndex = index\">\r\n <td>{{ tooltipIndex + 1 }}</td>\r\n <td>\r\n <span annaCoreShowEllipsisTextOnHover>{{ data.InventoryCode }}</span>\r\n </td>\r\n <td>\r\n <span annaCoreShowEllipsisTextOnHover>{{ data.Program }}</span>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </section>\r\n </ng-container>\r\n <ng-container *ngIf=\"sellerGroupHierarchy.length === 0\">\r\n <span class=\"black-color-text\">Seller group not available for this inventory code</span>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #tableInsideTooltip>\r\n <label class=\"ellipsis-tooltip-heading\">{{ ellipsisWithTooltipHeading }}</label>\r\n <section class=\"table-inside-tooltip-container\">\r\n <table class=\"ellipsis-tooltip-table\">\r\n <thead>\r\n <tr>\r\n <th\r\n [style.width]=\"header.width\"\r\n *ngFor=\"let header of ellipsisWithTooltipTableHeaders\"\r\n >\r\n <div>\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"upper-label\"\r\n >{{ header.headerName }}</span\r\n >\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of ellipsisWithTooltipTableData\">\r\n <td *ngFor=\"let header of ellipsisWithTooltipTableHeaders\">\r\n <div>\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"upper-label\"\r\n >{{ data[header.objectKey] }}</span\r\n >\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #lurViolationInfoTooltip>\r\n <p class=\"first-row\">The values are for the entire week.</p>\r\n</ng-template>\r\n\r\n<ng-template #postedRatingDifference>\r\n <p class=\"difference-text\">\r\n The difference between posted and booked average rating is\r\n {{ isDifferenceLessThan25Percent ? \"less\" : \"more\" }} than 25%.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #postedImpDifference>\r\n <p class=\"difference-text\">\r\n The difference between posted and booked average impression is\r\n {{ isDifferenceLessThan25Percent ? \"less\" : \"more\" }} than 25%.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #ongoingRevBookedColumnTooltip>\r\n <p>The Booked $ value, Spots, GRP, CPP, IMPS, CPM corresponds on the last permanent revision generated</p>\r\n</ng-template>\r\n\r\n<ng-template #completedRevBookedColumnTooltip>\r\n <p>The Booked $ value corresponds on the last permanent revision generated</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedRate>\r\n <p>This is the booked average Rate</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedRtg>\r\n <p>This is the booked average RTG</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedImps>\r\n <p>This is the booked average IMP(\u2019000)</p>\r\n</ng-template>\r\n\r\n<ng-template #projectedImpsRtg>\r\n <p>\r\n ANNA calculates projected RTG/IMPS values using either the computed estimates or the actual posted data,\r\n depending on what is available. If posted data has not yet been received, ANNA will use the computed estimates\r\n as the projected value. Once the actual posted data is received, the projection will automatically update to\r\n reflect the real, posted values. This ensures that projected data is always based on the most accurate and\r\n up-to-date information.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #automationTooltip>\r\n <p>\r\n Please get the order business rules approved to automate the orders. Only for the automated orders, any approved\r\n MGs, ADUs, or credited spots on ANNA will be fed into the traffic system i.e. ANNA revisions.\r\n <!-- removed below line as part of enhancmennt in 14.0 releas -->\r\n <!-- Additionally, ANNA will only enter buyer revisions into traffic for the selected\r\n Medialine/WOC orders. -->\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #rebateImpact>\r\n <p>Rebate impact value is for the originally ordered spot length and is not equivalized.</p>\r\n</ng-template>\r\n\r\n<ng-template #lurViolationTotalRowToolTip>\r\n <ul>\r\n <li>\r\n <strong>POLITICAL RATE VIOLATIONS:</strong>\r\n Violations flagged when non-political spots are booked at a rate lower than the minimum booked rate for\r\n political candidates for the same week, Inventory Code and Revenue Class.\r\n </li>\r\n <li>\r\n <strong>CANDIDATE TO CANDIDATE VIOLATION:</strong>\r\n Violations flagged when political spots are booked at different rates to other political spots for the same\r\n week, Inventory Code and Revenue Class.\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #circularProgressBar>\r\n <anna-core-circular-progress\r\n [percent]=\"percentDone\"\r\n [radius]=\"5\"\r\n [outerStrokeWidth]=\"2\"\r\n [innerStrokeWidth]=\"2\"\r\n [outerStrokeColor]=\"'#268bff'\"\r\n [innerStrokeColor]=\"'#d5d5d5'\"\r\n [animationDuration]=\"500\"\r\n ></anna-core-circular-progress>\r\n</ng-template>\r\n\r\n<ng-template #userLoggedInDetails>\r\n <div class=\"tooltip-div-container\">\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n <span *ngIf=\"data.key !== 'read'\">\r\n {{ data.key }} <b>{{ data.value }}</b>\r\n </span>\r\n <span *ngIf=\"data.key === 'read'\">\r\n {{ data.value }}\r\n </span>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #markAsReadTip>\r\n <div class=\"notification-tooltip-div-container\">\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.value }}\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #textActionTooltipTemplate>\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.key }} <b>{{ data.value }}</b>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #programChangeTooltipTemplate>\r\n <div class=\"program-schedule-tooltip\">\r\n <h2>Program Change</h2>\r\n <p class=\"previous\">Previous:</p>\r\n <b annaCoreShowEllipsisTextOnHover>{{ textActionTooltip.OldProgramName }}</b>\r\n\r\n <p class=\"updated\">Updated:</p>\r\n <b\r\n *ngIf=\"textActionTooltip.NewProgramNames.length === 1\"\r\n annaCoreShowEllipsisTextOnHover\r\n >{{ textActionTooltip.NewProgramNames[0] }}</b\r\n >\r\n <ul *ngIf=\"textActionTooltip.NewProgramNames.length > 1\">\r\n <li *ngFor=\"let item of textActionTooltip.NewProgramNames\">\r\n <label class=\"dot\"></label>\r\n <span annaCoreShowEllipsisTextOnHover>{{ item }}</span>\r\n </li>\r\n </ul>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #showOrHideToggleForTotalRowTooltip>\r\n <div>\r\n {{ showOrHideToggleForTotalRow && !gtGeneralConfig.totalRow ? \"Show Total Row\" : \"Hide Total Row\" }}\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #tooltipContainingTableTemplate>\r\n <div\r\n *ngIf=\"tooltipContainingTable\"\r\n [innerHTML]=\"tooltipContainingTable.innerHtml\"\r\n class=\"notification-tooltip-div-container\"\r\n >\r\n <!-- <ul>\r\n <li *ngFor=\"let headerMsg of tooltipContainingTable.tableHeaderMsg\">\r\n <b> {{headerMsg}} </b>\r\n </li>\r\n </ul>\r\n\r\n <table class=\"tooltip-table\">\r\n <thead>\r\n <tr>\r\n <th *ngFor=\"let header of tooltipContainingTable.tooltipTableHeader\">\r\n {{ header}}\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let rows of tooltipContainingTable.tooltipTableBody\">\r\n <td *ngFor=\"let data of rows\">\r\n {{ data }}\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <ul>\r\n <li style=\"margin-top:10px; padding:0\" *ngFor=\"let footerMsg of tooltipContainingTable.tableFooterMsg\">\r\n {{ footerMsg }} \r\n </li>\r\n </ul> -->\r\n </div>\r\n</ng-template>\r\n<!-- <ng-template #textActionTooltipTemplate>\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.key }} <b> {{data.value}}</b>\r\n </ng-container>\r\n</ng-template> -->\r\n\r\n<ng-template #statusNoteTooltip>\r\n <div>\r\n <span class=\"status-note-tooltip\">{{ statusNoteForTooltip }}</span>\r\n <span *ngIf=\"statusNoteForPopup.length > 100\"\r\n >...<a\r\n class=\"view-more-comments\"\r\n (click)=\"showEntireStatusNote()\"\r\n >View more</a\r\n ></span\r\n >\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #innerHtmlToolTipTemplate>\r\n <div [innerHtml]=\"toolTipInnerHtmlData\"></div>\r\n</ng-template>\r\n", styles: ["::ng-deep .show-or-hide-toggle-tooltip .tooltip-inner{max-width:229px}.show-or-hide-toggle-btn.shift-toggle-top-on-total-row-click{transform:translate(calc(var(--app-left-space-show-hide-total-row-icon) - 12px),32px)}.show-or-hide-toggle-btn{width:16px;height:16px;padding:0;margin:0;border-radius:50%;position:absolute;transform:translate(calc(var(--app-left-space-show-hide-total-row-icon) - 12px),52px);z-index:999;background-color:#d9d9d9}.show-or-hide-toggle-btn i.mdi.mdi-menu-swap{font-size:16px;display:flex}#generic-table-conatiner.table-with-show-hide-total-row-toggle .total-row td:nth-of-type(2){padding-left:16px!important}::ng-deep .gt-icon-innerHtml-tooltip .tooltip-inner{max-width:600px;width:min-content}::ng-deep .gt-icon-innerHtml-tooltip .tooltip-inner>div{width:max-content}::ng-deep .generic-innerHtml-table-heading{margin-bottom:2px;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a}::ng-deep .generic-innerHtml-table-container{max-height:8.75rem;width:min-content;overflow:auto}::ng-deep .generic-innerHtml-table-container table{table-layout:fixed;width:100%}::ng-deep .generic-innerHtml-table-container table thead tr th{background:#e9e9e9;height:22px;padding:3px 8px;position:sticky;top:0;cursor:default;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0;box-shadow:inset 1px -1px #d4d4d4,inset 0 1px #d4d4d4}::ng-deep .generic-innerHtml-table-container table thead tr th:last-of-type{box-shadow:inset 1px -1px #d4d4d4,inset -1px 1px #d4d4d4!important}::ng-deep .generic-innerHtml-table-container table tbody tr td{padding:3px 8px;width:100%;color:#000;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px;box-shadow:inset 1px -1px #d4d4d4}::ng-deep .generic-innerHtml-table-container table tbody tr td:last-of-type{box-shadow:inset 1px -1px #d4d4d4,inset -1px 0 #d4d4d4}::ng-deep .generic-innerHtml-table-container table tbody tr:first-of-type td{border-top:none}::ng-deep .generic-innerHtml-table-container::-webkit-scrollbar-track{margin-top:22px!important}.sort-btn{background:#fff;border:none;border-right:1px solid #1b88ff;text-decoration:underline;font-family:Roboto;font-size:var(--sort-label-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.07;letter-spacing:normal;color:#1b88ff;cursor:pointer;flex:1;text-align:center}.sort-btn:last-of-type{border-right:none}.sort-btn.active{color:#202b47;text-decoration:none}p.sort-container{margin-top:8px;padding-bottom:8px;border-bottom:1px solid #e6e6e6;margin-bottom:0;display:flex}::ng-deep .tooltip-inner{max-height:22rem;background-color:#fff;border:1px solid white;border-radius:5px;box-shadow:0 2px 2px #0000003d,0 0 2px #0000001f;max-width:251px;width:100%;padding:0!important}::ng-deep .tooltip-inner div.radio-container{flex-wrap:wrap}::ng-deep .md-drppicker{box-shadow:unset!important}::ng-deep .available{color:#999}::ng-deep .bs-tooltip-bottom .arrow:before{border-bottom-color:#fff!important}::ng-deep .bs-tooltip-left .arrow:before{border-left-color:#fff!important}::ng-deep .tooltip.show{opacity:1}.input{text-align:left;margin:5px 10px 5px 5px;display:flex;align-items:center;width:230px;white-space:nowrap}.data{color:#000;font-weight:700;margin-left:5px;margin-right:5px}span.data{display:inline-block;text-overflow:ellipsis;white-space:pre;width:100%;overflow:hidden}.check-box{font-size:14px;cursor:pointer;position:relative;top:-1px}span.mdi-filter.active{color:#000;opacity:1!important;pointer-events:all!important}p{margin-bottom:0;line-height:initial}span.mdi-filter{color:#cbcbcb}::ng-deep .ngx-slider-pointer{top:-5px!important;width:12px!important;height:12px!important;background:#bdbdbd!important;border:1px solid #ffffff!important;box-shadow:0 1px 3px #0000004d!important;border-radius:16px!important}input:focus{outline:none}input::placeholder{color:#c8c8c8}.cancel-btn{background:#c7e1ff;color:#268bff}.apply-btn{background:#268bff;color:#fff;margin-left:.3125rem}div.radio-container{display:flex;white-space:nowrap;justify-content:space-between;background-color:#f4f4f4;border-radius:.125rem;margin:.4375rem .4375rem .25rem}div.radio-container div{flex:1;width:50%}div.radio-container div.full-width{width:100%}div.radio-container input{position:relative;top:.125rem;margin-right:.25rem}div.radio-container label{font-family:Roboto;font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:0;color:#4a4a4a;margin:0;padding-left:.125rem}div.radio-container label:first-of-type{margin-right:.188rem}div.radio-container input[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;width:.9375rem;height:.9375rem;padding:.125rem;background-clip:content-box;border:.125rem solid #268bff;background-color:transparent;border-radius:50%}div.radio-container input[type=radio]:checked{background-color:#268bff}.checkbox-filter-buttons-container{padding:0 8px!important}.buttons-container{display:flex;margin:0px auto .4375rem;justify-content:center;padding:0 12px}.buttons-container .button{padding:0 10px;width:100%;margin:8px 0 0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.buttons-container button:last-of-type{background-color:#268bff;color:#fff;margin-left:.5rem}.buttons-container button.disabled{background:#bdbdbd;opacity:.5;color:#4a4a4a}.button{display:inline-block;margin:8px 4px 0 8px;padding:0 16px;border-radius:4px;text-align:center;outline:none;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.67;letter-spacing:normal;border:none;color:#268bff;background-color:#e5f1ff}.search-box{display:flex;align-items:center;color:#c8c8c8;border:1px solid #e6e6e6;border-radius:.125rem;margin:.25rem .4375rem .188rem;height:1.5rem;padding:.188rem 8px .188rem .5rem}.search-box .search-bar-close{margin-left:auto;float:right}.search-icon{margin:0 4px 0 0;font-size:var(--filter-search-icon-fs);color:#9b9b9b}.filter-icon{justify-content:right;margin-left:auto;color:#d4d4d4;color:#a1a1a1;font-size:16px;cursor:pointer}.data{margin:0 13px 0 8px;font-family:Roboto;font-size:var(--filter-checkbox-label-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.86;letter-spacing:\"\";color:#4a4a4a}.search-input{font-family:Roboto;font-size:var(--filter-search-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#c8c8c8;width:calc(100% - 38px);margin:1px 0 1px 2px;border:none;padding:0}.check-box{color:#268bff}.tooltip-data-container{overflow-y:scroll;max-height:8rem}.searchbar{width:100%;display:flex;justify-content:flex-end;align-items:flex-end}.clear-button{opacity:.5;font-family:Roboto;font-size:.9375rem;font-weight:500;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;text-decoration:underline;border:none;background-color:#fff;color:#4a4a4a;margin-left:.625rem;padding:0}.clear-button:focus{outline:none;box-shadow:none}.unchecked{color:#268bff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.3rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container p.input{margin-left:0}cdk-virtual-scroll-viewport.dropdown-data-container p.input span.mi{padding-left:.4375rem}cdk-virtual-scroll-viewport.dropdown-data-container p.input:hover{background-color:#ebebeb;cursor:pointer}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.188rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}section.min-maxContainer{display:flex;justify-content:center;margin-bottom:-.125rem;margin-top:.5rem;width:100%}section.min-maxContainer input{width:30%;height:1.5rem;border:1px solid lightgray;color:gray}section.min-maxContainer span{display:inline-block;padding-left:.5rem;padding-right:.5rem;position:relative;top:.3125rem;color:#666;font-size:var(--page-message-content-fs)}.time-container{width:100%;display:flex;padding:0 .75rem}.time-container input.form-control:disabled{background-color:#fff;width:2.813rem}.time-container input.numberInput:focus{box-shadow:none;border-color:#c2cfd6}.time-container .dot{color:#cbcbcb;position:relative;left:-7px;font-size:17px}.time-container div.arrow-container{flex-direction:column;display:flex;margin-top:.375rem;width:9px;height:18px;margin-right:.875rem}.time-container div.arrow-container i{color:#000;cursor:pointer;max-height:9px;font-size:20px;width:10px}.time-container div.arrow-container i:before{width:0;height:0;pointer-events:none;position:relative;left:-9px;top:-11px}.mdi-filter{cursor:pointer}.time-label-container{display:flex;justify-content:flex-start}.time-label-container label{margin-bottom:0;color:#4a4a4a;margin-top:.125rem;margin-left:.75rem;font-weight:700;font-size:var(--dropdown-label-fs)}.time-heading{color:#000;font-size:.8125rem;text-align:left;padding-left:.625rem;margin-top:.625rem;font-weight:700}.column-clear-all{width:94%;text-align:center;border:none;font-size:var(--filter-clear-select-btn-fs);background:none;text-decoration:underline;color:#268bff}.checkbox-container{display:flex;padding-inline:.625rem}.checkbox-container .data{text-align:left}.checkbox-container:first-of-type{margin-top:.625rem;font-weight:500}.column-clear-all{width:94%;text-align:center;border:none;background:none;text-decoration:underline;color:#268bff}.column-clear-all:disabled{opacity:.5;color:#4a4a4a;font-weight:400}.column-clear-all.align-center{text-align:center}span.mdi-filter-variant.disabled{pointer-events:none;opacity:.5}.datepicker-container{width:100%}span.mdi-filter-variant{color:#cbcbcb;cursor:pointer;font-size:.875rem}span.mdi-filter-variant.active{color:#000}p.filter-tab{font-family:Roboto;font-size:var(--filter-tab-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:normal;color:#1b88ff;border-radius:5px;background-color:#f4f4f4;padding-inline:8px;cursor:pointer;overflow:hidden;text-align:center;text-overflow:ellipsis;padding-block:3px}p.filter-tab.active{color:#fff;background-color:#1b88ff}button.filter-text-btn{background:#fff;text-decoration:underline;font-family:Roboto;font-size:var(--filter-clear-select-btn-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;border:none;color:#268bff;margin-inline:4px;margin-top:2px}button.filter-text-btn:disabled{color:#b1b1b1;cursor:not-allowed}::ng-deep .non-edit-datepicker-tooltip .tooltip-inner{max-width:310px!important;width:283px!important;overflow-y:initial!important;padding:0!important}input.slider-text::-webkit-outer-spin-button,input.slider-text::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input.slider-text{-moz-appearance:textfield}input.slider-text.red-border{border:1px solid #f44336!important}::ng-deep .checkbox-sort p.sort-container{margin-top:8px!important;padding-bottom:8px!important}i.mdi-close{cursor:pointer}i.mdi-close.disable-close-icon{pointer-events:none;cursor:not-allowed}input.error-border{border:1px solid #f44336!important}::ng-deep .non-edit-checkbox-tooltip .tooltip-inner{width:238px!important;padding:0!important}::ng-deep .non-edit-slider-tooltip .tooltip-inner{width:238px!important;padding:0!important}::ng-deep .non-edit-time-tooltip .tooltip-inner{width:250px!important;padding:0!important}::ng-deep .non-edit-time-tooltip.bs-tooltip-start{padding:.4rem}::ng-deep .non-edit-time-tooltip.bs-tooltip-start .tooltip-arrow{right:0;top:5px!important;width:var(--bs-tooltip-arrow-height);height:var(--bs-tooltip-arrow-width)}::ng-deep .non-edit-time-tooltip.bs-tooltip-start .tooltip-arrow:before{border-left-color:#fff;left:-1px;border-width:calc(var(--bs-tooltip-arrow-width) * .5) 0 calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height)}::ng-deep .no-bottom-border p.sort-container{border-bottom:none!important}::ng-deep .ngx-slider-pointer-min:after{display:none}::ng-deep .ngx-slider-pointer-max:after{display:none}::ng-deep .ngx-slider span.ngx-slider-pointer{width:12px;height:12px;top:-5px;background-color:#bdbdbd}::ng-deep .ngx-slider span.ngx-slider-bar{height:3px;background:#ededed}::ng-deep .ngx-slider span.ngx-slider-selection{background:#bdbdbd}::ng-deep .ngx-slider span.ngx-slider-bubble{bottom:-22px;font-size:12px;color:#333}::ng-deep .show-min.ngx-slider span.ngx-slider-model-value{background:#fff;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003}::ng-deep .show-max.ngx-slider span.ngx-slider-model-high{background:#fff;box-shadow:none}::ng-deep .ngx-slider span.ngx-slider-combined{background:#fff;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003}::ng-deep .ngx-slider{top:10px!important;margin:5px 0 2px!important}::ng-deep .ngx-slider-animate{top:0!important}.sidebar-slider{margin-bottom:35px!important;margin-left:5px;margin-right:5px}.slider-placeholder{height:14px}::ng-deep .filter-calendar select.form-select:focus{border-color:#c2cfd6;box-shadow:none}::ng-deep .filter-calendar select.form-select{background-color:#fff}.no-data-case{padding-left:.4375rem!important;font-size:var(--filter-checkbox-label-fs)!important;margin-top:10px!important;cursor:pointer}.virtual-scroll-div{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.red-text-totol-row{color:#f44336!important}.check-mark,.unread-mark{cursor:pointer}.on-hover:hover .unread-mark,.notificationHover .check-mark{opacity:0;cursor:pointer}.on-hover:hover .check-mark{opacity:1;cursor:pointer}table{margin-bottom:0;table-layout:fixed;width:100%}:host ::ng-deep .gt thead{top:.1px!important;position:relative}:host ::ng-deep .gt .header-row th{border:none;background:#ededed;padding:2px 8px;line-height:normal;position:sticky;position:-webkit-sticky;top:0;box-shadow:inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row th .upper-label{font-family:Roboto;font-size:var(--table-header-fs);font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0}:host ::ng-deep .gt .header-row th .lower-label{font-family:Roboto;font-size:var(--table-header-fs);font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#a7a7a7;margin-bottom:0}:host ::ng-deep .gt .header-row th div.row{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;width:max-content}:host ::ng-deep .gt .header-row th div.dummy-header{justify-content:center;margin-left:50%!important;margin-right:50%!important;width:-webkit-fill-available}:host ::ng-deep .gt .header-row th div.sort-filter-container{display:flex;flex-wrap:nowrap;align-items:center;margin-left:.25rem;margin-right:auto}:host ::ng-deep .gt .header-row th span.mdi-filter-variant{font-size:13px!important;top:-1px!important;position:relative}:host ::ng-deep .gt .header-row th:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row th:last-of-type{box-shadow:inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row br{display:block;content:\"\";margin-top:-8px}:host ::ng-deep .gt tbody tr td{padding:2px 8px;border:none;box-shadow:inset 1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr td div:nth-child(1){color:#000;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:Roboto;font-size:var(--table-body-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}:host ::ng-deep .gt tbody tr td div:nth-child(2){color:#a7a7a7;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:Roboto;font-size:var(--table-body-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}:host ::ng-deep .gt tbody tr td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr td:last-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr br{display:block;content:\"\";margin-top:-8px}:host ::ng-deep .gt .custom-column-checkbox-checked,:host ::ng-deep .gt .custom-column-checkbox-unchecked{font-size:.875rem;cursor:pointer}:host ::ng-deep .gt .custom-column-checkbox-checked{color:#268bff}:host ::ng-deep .gt .custom-column-checkbox-unchecked{color:#2962ff}:host ::ng-deep .gt .cell-value{width:calc(100% - 24px)!important;display:inline-block;width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .gt .tooltip-text{color:#268bff;cursor:pointer;float:right}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td{box-shadow:inset 1px 0 #d4d4d4}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td:first-of-type{box-shadow:inset 1px 0 #d4d4d4}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td:last-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4}.table-container{overflow-x:auto;overflow-y:auto}.rowSelectCheckbox,#selectAllRowsCheckbox{cursor:pointer}.disable-checkbox{color:#dedede!important;pointer-events:none!important}.mdi-warning{color:#f3c639;font-size:16px;line-height:28px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{opacity:1}.redcolor-status{color:#c62a2a}#no-filter-space{width:.875rem}input.numberInput{margin-right:-.8125rem;padding:0 0 0 .625rem;height:1.875rem}.hidden{display:none}.visibility-collapse{visibility:collapse}.no-data-div{margin-top:2.5px}.no-data-div label{margin:0;width:auto;font-weight:500;background-color:#d3d3d3;padding:.3125rem 1.125rem;border-radius:.25rem}.column-values:nth-of-type(2){color:#a7a7a7!important}.custom-column-checkbox-checked,.custom-column-checkbox-unchecked{font-size:.875rem;cursor:pointer}.custom-column-checkbox-checked{color:#268bff}.custom-column-checkbox-unchecked{color:#2962ff}.time-filter-checkboxes>div>p{color:#151b1e}::ng-deep .margin-bottom-zero .mat-radio-label{margin-bottom:0}:host ::ng-deep mat-radio-group br{margin-top:0!important}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio__background{width:var(--mat-radio-size);height:var(--mat-radio-size)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio__inner-circle{border-width:calc(var(--mat-radio-size) / 2)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-form-field>label{margin:0 0 0 4px;padding:0;top:-2px;position:relative;font-size:var(--radio-button-label-fs)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio--disabled+label{color:var(--primary-text-color-dark)!important}:host ::ng-deep mat-radio-group mat-radio-button.mat-mdc-radio-button .mdc-form-field .mdc-radio{padding:0}:host ::ng-deep mat-radio-group mat-radio-button .mdc-form-field>label{left:-94px;font-size:12px;color:#4a4a4a;position:relative}:host ::ng-deep mat-radio-group mat-radio-button .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:var(--mdc-radio-selected-icon-color)}::ng-deep .reject.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:#ff0}::ng-deep .reject.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:#ff0}::ng-deep .resubmit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:#ff0}::ng-deep .resubmit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:#ff0}::ng-deep .noAction.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:green}::ng-deep .noAction.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:green}::ng-deep .approve.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:green}::ng-deep .approve.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:green}::ng-deep .credit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:red}::ng-deep .credit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:red}::ng-deep .mat-radio-button.mat-radio-disabled .mat-radio-outer-circle{border-color:#00000061!important}::ng-deep .mat-radio-button.mat-radio-disabled.mat-radio-checked .mat-radio-inner-circle{background-color:#00000061!important}::ng-deep tr.white-background-row{background:#fff}::ng-deep tr.gray-background-row{background:#e9e9e980!important}.remarks-tooltip,.mdi-information,.mdi-information-outline,.seller-tooltip{font-size:.875rem;color:#268bff;position:relative;top:.1875rem;cursor:pointer}.seller-tooltip{top:-1px;float:right}::ng-deep .remarks-info-tooltip .tooltip-inner{max-width:19.25rem!important}.rating-icon,.lur-violation-icon{color:#268bff;cursor:pointer;position:relative;left:-2px}::ng-deep .rating-info-tooltip .tooltip-inner{max-width:800px!important}.spots-info-icon{color:#268bff;cursor:pointer;margin:1px 2px 0 -14px}.spots-info-icon-ol{color:#268bff;cursor:pointer;margin:1px 4px 0 -2px}::ng-deep .spot-info-tooltip .tooltip-inner{position:relative;max-width:220px!important;background:#fff;word-break:break-word;display:flex}::ng-deep .spot-info-tooltip-for-orderlisting-table .tooltip-inner{max-width:220px!important;background:#fff;word-break:break-word;display:flex}p.first-row{padding:.5rem .5rem 0;color:#000;white-space:nowrap;text-align:left}p.second-row{padding:2px .5rem .5rem;color:#000;white-space:nowrap;text-align:left}::ng-deep .gt-total-row-tooltip{opacity:1!important}::ng-deep .gt-total-row-tooltip .tooltip-inner{color:#000;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;background-color:#fff;padding:4px!important;width:100%;border-radius:2px!important}::ng-deep .gt-total-row-tooltip .arrow:before{border-top-color:#fff!important}.info-label{margin-left:4px;color:#268bff;vertical-align:text-top}::ng-deep .hierarchy-tooltip{max-width:fit-content;width:310px!important}::ng-deep .hierarchy-tooltip .tooltip-inner{padding:4px!important;max-width:22.75rem;max-height:11.25rem}table.seller-hierarchy-table{table-layout:fixed}table.seller-hierarchy-table tr th{font-family:Roboto;font-size:.75rem;font-weight:500;font-stretch:normal;font-style:normal;line-height:1.67;letter-spacing:normal;color:#5e5e5e;white-space:nowrap;background:#ededed;position:sticky;box-shadow:inset 0 1px #d4d4d4;top:0;z-index:1}table.seller-hierarchy-table tr th:nth-child(1){width:20px}table.seller-hierarchy-table tr th:first-of-type,table.seller-hierarchy-table tr td:first-of-type{width:30px;border-left:1px solid #d4d4d4}table.seller-hierarchy-table tr th:last-of-type,table.seller-hierarchy-table tr td:last-of-type{border-right:1px solid #d4d4d4;width:7.875rem!important}table.seller-hierarchy-table tr th:nth-of-type(2){width:7.75rem!important}table.seller-hierarchy-table tr td{font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;box-shadow:none!important;border-top:1px solid #d4d4d4;border-bottom:1px solid #d4d4d4}table.seller-hierarchy-table tr td:nth-of-type(2),table.seller-hierarchy-table tr td:nth-of-type(3){padding-top:.25rem}table.seller-hierarchy-table tr td span{display:inline-block;width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative}section.hierarchy-table-container,section.table-inside-tooltip-container{max-height:8.75rem;overflow:auto}section.hierarchy-table-container::-webkit-scrollbar-track{margin-top:1.5rem}section.table-inside-tooltip-container::-webkit-scrollbar-track{margin-top:1.1875rem}.difference-text{padding:.5rem;color:#000;text-align:left}::ng-deep .posted-avg-tooltip .tooltip-inner{width:13.8125rem!important}::ng-deep .drrBooked-info-tooltip{transform:translate(26px,6px)}::ng-deep .drrBooked-info-tooltip .tooltip-inner{max-width:307px!important;width:242px!important;background:#fff;word-break:break-word;display:flex;padding:4px!important;text-align:left}::ng-deep .drrBooked-info-tooltip .tooltip-inner p{color:#000}::ng-deep .drrBooked-info-tooltip .arrow:before{border-right-color:#fff!important}.clickable-data{cursor:pointer;color:#268bff!important;display:flex!important;align-items:center}.clickable-data .spot-details-download-icons{font-size:12px}.disabled-clickable-data{pointer-events:none;color:#d4d4d4!important}.spot-column-tooltip-message{color:#000;width:max-content;text-align:left}div.spinner-for-button-directive{position:relative;left:-1px}.clickable-row table tr.mat-row td{cursor:pointer!important}.tooltip-div-container{text-align:left!important;padding:8px 4px;color:#4a4a4a!important;font-size:11px!important;font-family:Roboto;font-size:11px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}.notification-tooltip-div-container{text-align:left!important;padding:6px 8px;color:#4a4a4a!important;font-size:12px!important;font-family:Roboto;font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}.mdi-information,.mdi-information-outline{left:3px;top:1px}.mdi-information-outline{position:static}::ng-deep .team-user-tooltip.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .team-user-tooltip .tooltip-inner{opacity:1!important;width:fit-content!important;max-width:520px;border-radius:2px;padding:0 4px!important}::ng-deep .team-user-tooltip .tooltip-inner .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .gt-icon-column-tooltip{opacity:1!important}::ng-deep .gt-icon-column-tooltip .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .gt-icon-column-tooltip.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .gt-icon-column-tooltip .tooltip-inner{width:100%}::ng-deep .tooltip-containing-table{opacity:1!important}::ng-deep .tooltip-containing-table .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .tooltip-containing-table.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .tooltip-containing-table li{margin:0!important;padding:0!important}::ng-deep .tooltip-containing-table ul{margin:0!important;padding-left:8px!important}::ng-deep .tooltip-containing-table ul.pl-16{padding-left:16px!important}::ng-deep .tooltip-containing-table .tooltip-inner{width:100%;max-width:230px}table.tooltip-table{table-layout:fixed;margin:4px 0 0;width:100%}table.tooltip-table th,table.tooltip-table td{padding:2px 8px;line-height:normal}table.tooltip-table thead tr th:first-of-type{box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4!important;border:none}table.tooltip-table thead tr th{color:#5e5e5e!important;font-size:12px;font-weight:500;font-family:Roboto;line-height:1.67;background-color:#ededed;border-top:none!important;border-bottom:none!important;outline:none!important;box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4}table.tooltip-table thead tr th div.row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}table.tooltip-table tbody tr td{color:#5e5e5e!important;font-size:12px;font-weight:500;font-family:Roboto;line-height:1.67}table.tooltip-table tbody tr td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}table.tooltip-table tbody tr td:nth-of-type(n+2){box-shadow:inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}.bottom-border{border-bottom:1px solid #d4d4d4!important}i.disabled{pointer-events:none!important}.black-color-text{color:#000}.white-space-nowrap{white-space:nowrap}.ellipsis-tooltip-heading{margin-bottom:2px;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a}table.ellipsis-tooltip-table{table-layout:fixed;width:100%}table.ellipsis-tooltip-table thead th:first-of-type{box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4!important}table.ellipsis-tooltip-table thead th{background:#e9e9e9;padding:3px 8px;line-height:normal;position:sticky;top:0;cursor:default;box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4}table.ellipsis-tooltip-table thead th .upper-label{font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0}table.ellipsis-tooltip-table tbody td{padding:3px 8px}table.ellipsis-tooltip-table tbody td .upper-label{width:100%;color:#000;text-overflow:ellipsis;overflow:hidden;display:inline-block;white-space:nowrap;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}table.ellipsis-tooltip-table tbody td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}table.ellipsis-tooltip-table tbody td:nth-of-type(n+2){box-shadow:inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}.pr-4{padding-right:4px}.status-note-tooltip{font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:14px;letter-spacing:normal;color:#4a4a4a;white-space:normal!important}.view-more-comments{display:block;color:#268bff;font-family:Roboto;font-size:.75rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:14px;letter-spacing:normal;cursor:pointer;margin-left:2px}td.mat-column-isOrderStarred:has(.disabled-starring){pointer-events:none!important}td.mat-column-isOrderStarred .mdi.mdi-star.disabled-starring,td.mat-column-isOrderStarred .mdi.mdi-star-outline.disabled-starring{pointer-events:none!important;color:#dbdbdb80!important}table.disable-table-scrolling{overflow:hidden!important}.icon-tooltip-text{display:inline-block;color:#268bff}.text-with-icon-and-text.reduced-width{text-overflow:ellipsis;overflow:hidden;display:inline-block;max-width:calc(100% - 25px);margin-bottom:-3.5px}.innrHtml-tooltip-icon-marker{float:right;color:#268bff}.reduced-width-text{text-overflow:ellipsis;overflow:hidden;display:inline-block;max-width:calc(100% - 25px)}input[type=radio].anna-gt-radio{accent-color:var(--primary-blue-color);width:16px;height:16px;display:inline-flex;vertical-align:middle;margin-right:4px}input[type=radio].anna-gt-radio:hover{accent-color:var(--primary-blue-color)!important;opacity:1!important;background-color:var(--primary-blue-color)!important;border-color:initial!important;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i4$3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4$3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4$3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4$3.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i4$3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4$3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4$3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4$3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4$3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4$3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "ngmodule", type: NgxSkeletonLoaderModule }, { kind: "component", type: i3.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }, { kind: "directive", type: ShowEllipsisTextOnHoverDirective, selector: "[annaCoreShowEllipsisTextOnHover]" }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: AnnaIconColumnComponent, selector: "anna-core-icon-column", inputs: ["componentName", "iconToShow", "dataObject"], outputs: ["columnIconClicked"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: AnnaNoDataComponent, selector: "anna-core-no-data-lib", inputs: ["width", "marginTop"] }, { kind: "component", type: AnnaColumnCheckboxFilterComponent, selector: "anna-core-anna-column-checkbox-filter", inputs: ["showFilterHeaderTabs", "isLurAndCsrComponent", "tableData", "clonedTableData", "filterTabObjects"], outputs: ["filterAppliedToTable", "sortingAppliedToTable", "getSortType", "closeTooltip"] }, { kind: "component", type: AnnaColumnSliderFilterComponent, selector: "anna-core-anna-column-slider-filter", inputs: ["filterTabObjects", "isLurAndCsrComponent", "tableData", "showFilterHeaderTabs", "clonedTableData"], outputs: ["closeTooltip", "filterAppliedToTable", "getSortType", "sortingAppliedToTable"] }, { kind: "component", type: AnnaColumnDateRangeFilterComponent, selector: "anna-core-anna-column-date-range-filter", inputs: ["tableData", "clonedTableData", "filterTabObjects", "isLurAndCsrComponent", "showFilterHeaderTabs"], outputs: ["filterAppliedToTable", "sortingAppliedToTable", "getSortType", "closeTooltip"] }, { kind: "component", type: AnnaColumnTimeFilterComponent, selector: "anna-core-anna-column-time-filter", inputs: ["tableData", "clonedTableData", "filterTabObjects", "isLurAndCsrComponent", "showFilterHeaderTabs", "showAllTimeRangeCheckboxes", "gtGeneralConfig", "showClearAllFilter", "startFromText", "endToText", "isSortAndFilterAbsent"], outputs: ["timeChanges", "timeChangedEmitter", "filterAppliedToTable", "sortingAppliedToTable", "getSortType", "closeTooltip"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: AnnaEstIconTemplateComponent, selector: "anna-core-anna-est-icon-template" }, { kind: "component", type: AnnaSingleSelectComponent, selector: "anna-core-single-select", inputs: ["config", "loading", "showAdditionalDataInSelectedText", "disabled", "items", "selectedItem", "keyToUseForDisplay", "keyToUseForCheckingSelectedItem", "hideDropdownArrow", "borderbottomObject", "defaultDropdownHeight", "itemsToHideInDropdownIds", "showClearSelection"], outputs: ["valueChanged", "dropdownClosedEvent", "dropdownOpenedEvent", "clearSelectionClickedEvent"] }, { kind: "directive", type: DigitOnlyDirective, selector: "[annaCoreDigitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern"] }, { kind: "component", type: AnnaCircularProgressComponent, selector: "anna-core-circular-progress", inputs: ["percent", "radius", "outerStrokeWidth", "innerStrokeWidth", "outerStrokeColor", "innerStrokeColor", "animationDuration"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i7.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i7.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5900
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AnnaNonEditableGenericTableComponent, isStandalone: true, selector: "anna-core-non-editable-generic-table-lib", inputs: { showSkeletonLoading: "showSkeletonLoading", tableHeaders: "tableHeaders", tableData: "tableData", clonedTableData: "clonedTableData", gtGeneralConfig: "gtGeneralConfig", totalRowInfo: "totalRowInfo", gtDimension: "gtDimension", extraHeaderRowForAdjustingColumnWidths: "extraHeaderRowForAdjustingColumnWidths", tableClass: "tableClass", maximumRowsWhichCanBeRenderedWithoutScroll: "maximumRowsWhichCanBeRenderedWithoutScroll", fixNumberOfRowsForPopup: "fixNumberOfRowsForPopup", fixRowsToRender: "fixRowsToRender", includeBorderInTableHeight: "includeBorderInTableHeight", downloadInProgress: "downloadInProgress", percentDone: "percentDone", starredInProgress: "starredInProgress", clickableRow: "clickableRow", setTableHeightWhenRowSizeIsFixed: "setTableHeightWhenRowSizeIsFixed", tableBorderBottomClassRequired: "tableBorderBottomClassRequired", hideSomeTds: "hideSomeTds", tdsHaveRowSpan: "tdsHaveRowSpan", multipleTablesPresent: "multipleTablesPresent", showOrHideToggleForTotalRow: "showOrHideToggleForTotalRow" }, outputs: { toggleCheckbox: "toggleCheckbox", toggleRowCheckbox: "toggleRowCheckbox", toggleHeaderCheckbox: "toggleHeaderCheckbox", undoIconClicked: "undoIconClicked", filterAppliedToTable: "filterAppliedToTable", sortingAppliedToTable: "sortingAppliedToTable", rowClicked: "rowClicked", radioButtonSelected: "radioButtonSelected", columnFilterOpened: "columnFilterOpened", columnFilterClosed: "columnFilterClosed", gtIconClicked: "gtIconClicked", gtSVGIconClicked: "gtSVGIconClicked", gtTextActionClicked: "gtTextActionClicked", gtViewDetailClicked: "gtViewDetailClicked", gtInnerHTMLClicked: "gtInnerHTMLClicked", downloadSpotDetails: "downloadSpotDetails", clickableDataClicked: "clickableDataClicked", totalRowIconClicked: "totalRowIconClicked", notificationIconHover: "notificationIconHover", notificationIconHoverLeave: "notificationIconHoverLeave", editableInputEdited: "editableInputEdited", radioButtonMessageIconClicked: "radioButtonMessageIconClicked", statusNotePopupOpened: "statusNotePopupOpened", textPopupOpened: "textPopupOpened", digitOnlyInputChanged: "digitOnlyInputChanged", singleSelectDropdownValueEmit: "singleSelectDropdownValueEmit", timeSelected: "timeSelected", totalRowRadioButtonClicked: "totalRowRadioButtonClicked", totalRowRadioButtonIconClicked: "totalRowRadioButtonIconClicked" }, viewQueries: [{ propertyName: "tableElementRef", first: true, predicate: ["tableElementRef"], descendants: true, static: true }, { propertyName: "textActionTooltipTemplateRef", first: true, predicate: ["textActionTooltipTemplate"], descendants: true }, { propertyName: "programChangeTooltipTemplateRef", first: true, predicate: ["programChangeTooltipTemplate"], descendants: true }, { propertyName: "viewChildTableHeaders", predicate: ["tableHeader"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\r\n id=\"generic-table-conatiner\"\r\n #tableElementRef\r\n class=\"table-container {{ gtGeneralConfig?.tableOuterContainerName }} {{ tableBottomBorderClass }}\"\r\n [ngClass]=\"{\r\n 'scroll-left-shadow-effect': isScrolledLeft,\r\n 'scroll-right-shadow-effect': !isScrollEnded,\r\n 'clickable-row': clickableRow,\r\n 'no-data-table': (isNoDataToDisplaySubject$ | async),\r\n 'table-with-show-hide-total-row-toggle': showOrHideToggleForTotalRow\r\n }\"\r\n (scroll)=\"onTableContainerScroll($event)\"\r\n>\r\n <div\r\n [class]=\"gtGeneralConfig.tableContainerName\"\r\n class=\"horizontal-scroll-for-table-container\"\r\n [ngStyle]=\"{\r\n height:\r\n tableData.length < noOfRowsToCheck - 1\r\n ? 'calc(' +\r\n (gtDimension.rowHeight * tableData.length +\r\n (!tableData.length || !gtGeneralConfig.totalRow\r\n ? gtDimension.headerHeight\r\n : gtDimension.headerHeight + gtDimension.rowHeight)) +\r\n 'px)'\r\n : gtDimension.tableHeight\r\n }\"\r\n >\r\n <button\r\n *ngIf=\"showOrHideToggleForTotalRow && !showSkeletonLoading && (isNoDataToDisplaySubject$ | async) === false\"\r\n [ngClass]=\"{\r\n 'shift-toggle-top-on-total-row-click': !gtGeneralConfig.totalRow\r\n }\"\r\n class=\"show-or-hide-toggle-btn\"\r\n (click)=\"showHideTotalRow()\"\r\n >\r\n <i\r\n class=\"mdi mdi-menu-swap\"\r\n tooltipClass=\"show-or-hide-toggle-tooltip\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n [ngbTooltip]=\"showOrHideToggleForTotalRowTooltip\"\r\n ></i>\r\n </button>\r\n\r\n <table\r\n class=\"gt\"\r\n [ngClass]=\"tableClass\"\r\n mat-table\r\n [dataSource]=\"renderedData\"\r\n >\r\n <ng-container *ngIf=\"gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"modifiedExtraHeaderRowForAdjustingColumnWidths?.objectKeys\"\r\n [style.height.px]=\"'4px'\"\r\n [class.visibility-collapse]=\"true\"\r\n ></tr>\r\n\r\n <ng-container *ngFor=\"let row of tableColumnsOfEachRow; let i = index\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"tableColumnsOfEachRow[i]; sticky: true\"\r\n [style.height.px]=\"gtDimension.headerHeight\"\r\n ></tr>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"tableColumns; sticky: true\"\r\n [style.height.px]=\"gtDimension.headerHeight\"\r\n ></tr>\r\n </ng-container>\r\n\r\n <tr\r\n class=\"total-row\"\r\n mat-header-row\r\n [style.height.px]=\"gtDimension.rowHeight\"\r\n *matHeaderRowDef=\"totalRowColumns; sticky: true\"\r\n [class.hidden]=\"\r\n showSkeletonLoading ||\r\n (!showSkeletonLoading && !tableData.length) ||\r\n (isNoDataToDisplaySubject$ | async) ||\r\n (!showSkeletonLoading && !gtGeneralConfig.totalRow)\r\n \"\r\n ></tr>\r\n <tr\r\n [class]=\"rowData.gtClass\"\r\n [ngClass]=\"{ 'no-border-tr': (isNoDataToDisplaySubject$ | async) }\"\r\n mat-row\r\n *matRowDef=\"let rowData; columns: tableColumns\"\r\n [style.height.px]=\"gtDimension.rowHeight\"\r\n (click)=\"dataRowClicked(rowData)\"\r\n ></tr>\r\n\r\n <!-- TOTAL ROW -->\r\n <ng-container\r\n [matColumnDef]=\"column.colName\"\r\n *ngFor=\"let column of totalRowInfo; trackBy: trackByFn\"\r\n >\r\n <td\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [attr.colspan]=\"column.colspan\"\r\n class=\"{{ column.class }}\"\r\n >\r\n <ng-container\r\n *ngIf=\"\r\n column['radioButtonColumnData'] && column['radioButtonColumnData']['isRadioButtonsColumn']\r\n \"\r\n >\r\n <mat-radio-group\r\n [ngModel]=\"column.radioButtonColumnData?.selectedRadioButton\"\r\n [disabled]=\"column.radioButtonColumnData?.disableRadioGroup\"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let radioButton of column.radioButtonColumnData?.radioButtonsData;\r\n let last = last\r\n \"\r\n >\r\n <mat-radio-button\r\n value=\"{{ radioButton.value }}\"\r\n class=\"{{ radioButton.class }}\"\r\n [ngClass]=\"{\r\n disabled:\r\n radioButton?.disabled || column.radioButtonColumnData?.disableRadioGroup\r\n }\"\r\n (click)=\"totalRowRadioButtonClickedByUser(radioButton.value)\"\r\n >{{ radioButton.label }}\r\n </mat-radio-button>\r\n <ng-container *ngFor=\"let iconClass of radioButton?.iconClass\">\r\n <i\r\n class=\" {{ iconClass }}\"\r\n (click)=\"totalRowRadioButtonIconClickedByUser(radioButton.value)\"\r\n ></i\r\n ></ng-container>\r\n <br *ngIf=\"!last\" />\r\n </ng-container>\r\n </mat-radio-group>\r\n </ng-container>\r\n <ng-container *ngIf=\"column['isActionColumn']\">\r\n <a\r\n *ngFor=\"let data of column.actionData\"\r\n [class]=\"data.class\"\r\n (click)=\"onClickableDataClicked({}, data.id)\"\r\n >\r\n {{ data.name }}\r\n </a>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"column['isIconColumn']\">\r\n <i\r\n class=\"{{ column?.iconData?.class }}\"\r\n (click)=\"iconClickedInTotalRow(column?.colName)\"\r\n >\r\n </i>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!column['isActionColumn']\">\r\n <strong class=\"upper-label\"\r\n >{{ column.data }}\r\n <span\r\n class=\"red-text-totol-row\"\r\n *ngIf=\"column.additionalRedTextAfterData\"\r\n >{{ column.additionalRedTextAfterData }}</span\r\n ></strong\r\n >\r\n <ng-container *ngIf=\"column.lowerData\">\r\n <p\r\n *ngIf=\"\r\n column.colName === 'total-potential-booked-unit' &&\r\n gtGeneralConfig.component === 'RATING';\r\n else columnLowerData\r\n \"\r\n class=\"clickable-data\"\r\n (click)=\"spotDetailsDownloadClicked('TOTALROW')\"\r\n [ngClass]=\"{\r\n 'disabled-clickable-data': downloadInProgress || column.lowerData === '0'\r\n }\"\r\n >\r\n {{ column.lowerData }}\r\n <span class=\"material-icons mdi mdi-download spot-details-download-icons\"></span>\r\n <ng-container *ngIf=\"downloadInProgress && selectedRowTypeForDownload === 'TOTALROW'\">\r\n <ng-container [ngTemplateOutlet]=\"circularProgressBar\"></ng-container>\r\n </ng-container>\r\n </p>\r\n <ng-template #columnLowerData>\r\n <p class=\"lower-label\">{{ column.lowerData }}</p>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"column.tooltipMessage && gtGeneralConfig.component !== 'LUR_VIOLATIONS'\">\r\n <i\r\n class=\"{{ column.tooltipIconClass }}\"\r\n container=\"body\"\r\n [ngbTooltip]=\"column.tooltipMessage\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"top bottom\"\r\n ></i>\r\n </ng-container>\r\n <ng-container *ngIf=\"gtGeneralConfig.component === 'LUR_VIOLATIONS' && column.tooltipMessage\">\r\n <i\r\n class=\"mi mdi-info-outline info-label\"\r\n container=\"body\"\r\n [ngbTooltip]=\"lurViolationTotalRowToolTip\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"bottom\"\r\n ></i>\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <ng-container\r\n [matColumnDef]=\"columnDef\"\r\n *ngFor=\"\r\n let columnDef of modifiedExtraHeaderRowForAdjustingColumnWidths.objectKeys;\r\n let i = index;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <th\r\n #tableHeader\r\n nowrap\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [style.width]=\"modifiedExtraHeaderRowForAdjustingColumnWidths.widths[i]\"\r\n ></th\r\n ></ng-container>\r\n ></ng-container\r\n >\r\n\r\n <!-- MAIN ROW -->\r\n <ng-container\r\n [matColumnDef]=\"columnDef.headerInfo[0].objectKey\"\r\n *ngFor=\"let columnDef of tableHeaders; trackBy: trackByFn\"\r\n >\r\n <th\r\n #tableHeader\r\n nowrap\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [style.width]=\"columnDef.width\"\r\n [attr.rowspan]=\"columnDef.rowspan ? columnDef.rowspan : 1\"\r\n [attr.colspan]=\"columnDef.colspan ? columnDef.colspan : 1\"\r\n >\r\n <div\r\n class=\"row mx-0\"\r\n [ngClass]=\"{ 'dummy-header': columnDef.dummyHeader }\"\r\n *ngFor=\"let header of columnDef.headerInfo; let j = index\"\r\n >\r\n <p\r\n *ngIf=\"header.typeOfHeaderData === 'STRING'\"\r\n [ngClass]=\"{ 'upper-label': j === 0, 'lower-label': j === 1 }\"\r\n >\r\n <ngx-skeleton-loader\r\n *ngIf=\"header.name == null\"\r\n count=\"1\"\r\n [theme]=\"{\r\n height: '10px',\r\n display: 'block',\r\n width: columnDef.width,\r\n 'max-width': 'calc(100% - 20px)'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <!-- <ng-container *ngIf=\"header.name\">\r\n {{ header.name }}\r\n </ng-container> -->\r\n <span [innerHTML]=\"header.name\"></span>\r\n <ng-container *ngIf=\"header.tooltip && header.tooltip.tooltipMessage\">\r\n <i\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"header.tooltip.tooltipMessage\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </ng-container>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'impsInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"impsInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"\r\n header.tooltip && header.tooltip.name === 'spotsColumnEquivalizationMessageTooltip'\r\n \"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"spotsColumnEquivalizationMessageTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'underDeliveryTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"underDeliveryTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'overDeliveryTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"overDeliveryTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'ratingInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"ratingInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'rateInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"rateInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'ongoingRevBookedColumnTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"ongoingRevBookedColumnTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'completedRevBookedColumnTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"completedRevBookedColumnTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedRate'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedRate\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedRtg'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedRtg\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedImps'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedImps\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'automationTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"automationTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'rebateImpact'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"rebateImpact\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'projectedImpsRtg'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"projectedImpsRtg\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </p>\r\n\r\n <ng-container *ngIf=\"header.typeOfHeaderData === 'CHECKBOX'\">\r\n <span\r\n *ngIf=\"gtGeneralConfig.isHeaderChecked\"\r\n class=\"mdi mdi-checkbox-marked custom-column-checkbox-checked\"\r\n (click)=\"selectUnselectAllRows()\"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!gtGeneralConfig.isHeaderChecked\"\r\n class=\"mdi mdi-checkbox-blank-outline custom-column-checkbox-unchecked\"\r\n [ngClass]=\"{ 'disable-checkbox': gtGeneralConfig.disableHeaderCheckbox }\"\r\n (click)=\"selectUnselectAllRows()\"\r\n >\r\n </span>\r\n </ng-container>\r\n\r\n <div\r\n *ngIf=\"gtGeneralConfig.showAllColumnFilter && header && header.typeOfHeaderData !== ''\"\r\n class=\"sort-filter-container\"\r\n >\r\n <ng-container *ngIf=\"header.showTooltipIcon\">\r\n <!-- Active tooltip Functionality -->\r\n <ng-container *ngIf=\"header.filter === 'CHECKBOX'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"filterTooltip\"\r\n placement=\"{{ filterAlignment }}\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-checkbox-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'SLIDER'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"sliderToolTip\"\r\n placement=\"bottom left-top\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-slider-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t1=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t1, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'DATE'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"datePickerTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-datepicker-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t2=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t2, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'WEEK'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"weekPickerToolTip\"\r\n placement=\"bottom left-top\"\r\n container=\"body\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t3=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t3, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'TIME'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"timeFilterToolTip\"\r\n placement=\"bottom left-top auto\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-time-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t4=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t4, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!header.showTooltipIcon\">\r\n <span id=\"no-filter-space\"></span><br />\r\n </ng-container>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'lurViolationInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"lurViolationInfoTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </div>\r\n </div>\r\n </th>\r\n\r\n <ng-container *matCellDef=\"let ROW_DATA\">\r\n <td\r\n mat-cell\r\n [style.background]=\"ROW_DATA.backgroundColor\"\r\n [style.border]=\"ROW_DATA.border\"\r\n class=\"{{ ROW_DATA.rowClass }}\"\r\n [ngClass]=\"ROW_DATA[columnDef.headerInfo[0].objectKey + 'TdClass']\"\r\n [attr.rowspan]=\"tdsHaveRowSpan ? ROW_DATA[columnDef.headerInfo[0].objectKey + 'Rowspan'] : 1\"\r\n *ngIf=\"\r\n !hideSomeTds ||\r\n (hideSomeTds && !ROW_DATA['hide' + columnDef.headerInfo[0].objectKey + 'Td'])\r\n \"\r\n >\r\n <ngx-skeleton-loader\r\n *ngIf=\"showSkeletonLoading\"\r\n count=\"1\"\r\n [theme]=\"{ height: '10px', display: 'block', marginBottom: '0' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n\r\n <ng-container *ngIf=\"!showSkeletonLoading\">\r\n <ng-container *ngIf=\"tableData.length > 0 && (isNoDataToDisplaySubject$ | async) === false\">\r\n <ng-container\r\n *ngFor=\"\r\n let subline of columnDef.headerInfo;\r\n let subLineIndex = index;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <div\r\n annaCoreShowEllipsisTextOnHover\r\n [includeFullWidth]=\"\r\n columnDef.headerInfo[subLineIndex].typeOfBodyData !== 'RADIO'\r\n \"\r\n [class]=\"columnDef.headerInfo[subLineIndex]?.tdCellClass\"\r\n >\r\n <ng-container [ngSwitch]=\"columnDef.headerInfo[subLineIndex].typeOfBodyData\">\r\n <ng-container *ngSwitchCase=\"'ICON'\">\r\n <i\r\n *ngIf=\"\r\n !(\r\n starredInProgress &&\r\n ROW_DATA.orderId === selectedStarredOrderId\r\n )\r\n \"\r\n [class]=\"ROW_DATA.iconClass\"\r\n [ngClass]=\"{ 'disabled-starring': starredInProgress }\"\r\n (click)=\"iconClicked(ROW_DATA, ROW_DATA.iconClass)\"\r\n ngbTooltip=\"{{ ROW_DATA.iconTitleText }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n ></i>\r\n <ng-container\r\n *ngIf=\"\r\n starredInProgress && ROW_DATA.orderId === selectedStarredOrderId\r\n \"\r\n >\r\n <div\r\n class=\"spinner-for-button-directive\"\r\n [ngClass]=\"{ 'disabled-starring': starredInProgress }\"\r\n ></div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'ICON_CELL'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <ng-container *ngIf=\"action.showObjectKey\">\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </ng-container>\r\n\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action.tooltipClass\r\n }}\"\r\n [ngbTooltip]=\"\r\n action.showTooltip && action?.tooltipData\r\n ? tipContent\r\n : null\r\n \"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!action.showTooltip\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action.tooltipData\"></div\r\n ></ng-template>\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'HTML_STRING'\">\r\n <p\r\n [innerHTML]=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n (click)=\"innerHTMLCellClicked($event, ROW_DATA)\"\r\n ></p>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'HTML_STRING_AND_CLICKABLE_DATA'\">\r\n <ng-container\r\n *ngFor=\"\r\n let text of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n *ngIf=\"text.showText\"\r\n [innerHtml]=\"text.innerHTMLText\"\r\n ></span>\r\n\r\n <a\r\n *ngIf=\"text.showLink\"\r\n class=\"view-link\"\r\n [class]=\"text.class\"\r\n (click)=\"onClickableDataClicked(ROW_DATA, text.id)\"\r\n >{{ text.linkName }}\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SVG_ICON'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ];\r\n let isLast = last\r\n \"\r\n >\r\n <span\r\n class=\"pr-4\"\r\n *ngIf=\"action?.showObjectKey\"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n class=\"pr-4 {{ action?.additionalTextClass }}\"\r\n *ngIf=\"action?.additionalText\"\r\n >\r\n {{ action?.additionalText }}\r\n </span>\r\n\r\n <anna-core-icon-column\r\n [ngClass]=\"{ 'pr-4': !isLast }\"\r\n *ngIf=\"action?.svgOrIconName\"\r\n [componentName]=\"gtGeneralConfig.component\"\r\n [dataObject]=\"ROW_DATA\"\r\n [iconToShow]=\"action.svgOrIconName\"\r\n data-html=\"true\"\r\n [ngbTooltip]=\"tipContent\"\r\n [disableTooltip]=\"!action?.svgOrIconTooltipMsg\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n (columnIconClicked)=\"\r\n svgIconClicked(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n )\r\n \"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action?.svgOrIconTooltipMsg\"></div\r\n ></ng-template>\r\n </anna-core-icon-column>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'TEXT_ACTIONS'\">\r\n <ng-container\r\n *ngFor=\"\r\n let text of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <button\r\n *ngIf=\"text.showTooltip\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n text.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disabled]=\"text.isDisabled\"\r\n class=\"{{ text.class }}\"\r\n (mouseenter)=\"\r\n mouseEnterOnTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n [ngbTooltip]=\"textActionTooltipTemplate\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n >\r\n {{ text.name }}\r\n </button>\r\n\r\n <button\r\n *ngIf=\"!text.showTooltip\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n text.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disabled]=\"text.isDisabled\"\r\n class=\"{{ text.class }}\"\r\n >\r\n {{ text.name }}\r\n </button>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'CHECKBOX'\">\r\n <span\r\n *ngIf=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n class=\"mdi mdi-checkbox-marked custom-column-checkbox-checked\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n false\r\n )\r\n \"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n class=\"mdi mdi-checkbox-blank-outline custom-column-checkbox-unchecked\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n true\r\n )\r\n \"\r\n >\r\n </span>\r\n\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionTypeContainingTable(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"tooltip-containing-table remove-on-scroll-class\"\r\n ngbTooltip=\"tooltipContainingTableTemplate\"\r\n >\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'CLICKABLE_DATA'\">\r\n <a\r\n *ngFor=\"\r\n let text of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n [class]=\"text.class\"\r\n (click)=\"onClickableDataClicked(ROW_DATA, text.id)\"\r\n >{{ text.name }}</a\r\n >\r\n <span\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedUnits' &&\r\n gtGeneralConfig.component === 'RATING'\r\n \"\r\n class=\"clickable-data\"\r\n (click)=\"spotDetailsDownloadClicked('DATAROW', ROW_DATA)\"\r\n [ngClass]=\"{\r\n 'disabled-clickable-data':\r\n downloadInProgress || ROW_DATA.displayBookedUnits === '-'\r\n }\"\r\n >{{ ROW_DATA.displayBookedUnits }}\r\n <span\r\n class=\"material-icons mdi mdi-download spot-details-download-icons\"\r\n ></span>\r\n <ng-container\r\n *ngIf=\"\r\n downloadInProgress &&\r\n ROW_DATA.ProgramId === selectedProgramIdForDownload &&\r\n ROW_DATA.Demographic === selectedDemographicForDownload\r\n \"\r\n >\r\n <ng-container\r\n [ngTemplateOutlet]=\"circularProgressBar\"\r\n ></ng-container>\r\n </ng-container>\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING___ICON_OR_TEXT_ACTION'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n [class]=\"action.additionalTextBeforeLinkClass\"\r\n [innerHtml]=\"action.additionalTextBeforeLink\"\r\n ngbTooltip=\"{{ action.additionalTextBeforeLink }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n [disableTooltip]=\"!action.enableTooltipForAdditionalText\"\r\n ></span>\r\n\r\n <ng-container *ngIf=\"action && action.typeOfData === 'STRING'\">\r\n <span\r\n class=\"text-with-icon-and-text\"\r\n [ngClass]=\"{ 'reduced-width': action.showIcon }\"\r\n annaCoreShowEllipsisTextOnHover\r\n >{{ action.data }}</span\r\n >\r\n </ng-container>\r\n\r\n <a\r\n [id]=\"action.id\"\r\n *ngIf=\"action.showLink\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [class]=\"action.linkClass\"\r\n [ngClass]=\"{ disabled: action.disabledLink }\"\r\n >{{ action.data }}</a\r\n >\r\n <span\r\n ngbTooltip=\"{{ action.additionalTextAfterLink }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n [class]=\"action.additionalTextAfterLinkClass\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n [disableTooltip]=\"!action.enableTooltipForAdditionalAfterText\"\r\n >\r\n {{ action.additionalTextAfterLink }}\r\n </span>\r\n\r\n <ng-container *ngIf=\"action.showTooltip\">\r\n <ng-container *ngIf=\"action.tooltipData.innerHtml\">\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionTypeContainingTable(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"tooltip-containing-table remove-on-scroll-class\"\r\n [ngbTooltip]=\"tooltipContainingTableTemplate\"\r\n >\r\n </i>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!action.tooltipData.tooltipTableBody\">\r\n <span\r\n *ngIf=\"action.showIcon\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n class=\"icon-tooltip-text\"\r\n (click)=\"\r\n iconClickedOnStringIconActionType(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n (mouseleave)=\"mouseLeaveTextActionType(ROW_DATA)\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n [placement]=\"\r\n action.tooltipPlacement\r\n ? action.tooltipPlacement\r\n : 'bottom auto'\r\n \"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action.tooltipClass\r\n }}\"\r\n [ngbTooltip]=\"userLoggedInDetails\"\r\n >\r\n <i [class]=\"action.iconClass\"> </i>\r\n {{ action.additionalTextAfterIcon ?? \"\" }}\r\n </span>\r\n <ng-container *ngIf=\"action['showSvgIcon']\">\r\n <anna-core-anna-est-icon-template\r\n class=\"float-right\"\r\n *ngIf=\"action['svgIconName'] === 'anna-icon'\"\r\n (mouseleave)=\"mouseLeaveTextActionType(ROW_DATA)\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex]\r\n .tooltipKey\r\n )\r\n \"\r\n [placement]=\"\r\n action.tooltipPlacement\r\n ? action.tooltipPlacement\r\n : 'bottom auto'\r\n \"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action['tooltipClass']\r\n }}\"\r\n [ngbTooltip]=\"userLoggedInDetails\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n >\r\n </anna-core-anna-est-icon-template>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!action.showTooltip\">\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (click)=\"\r\n iconClickedOnStringIconActionType(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n >\r\n </i>\r\n </ng-container>\r\n\r\n <i\r\n *ngIf=\"action.showSimpleIcon\"\r\n [class]=\"action.iconClass\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"\r\n action?.tooltipDataForSimpleIcon ? tipContent : null\r\n \"\r\n (click)=\"\r\n iconClickedOnStringIconActionType(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!action.tooltipDataForSimpleIcon\"\r\n >\r\n <ng-template #tipContent>\r\n <div\r\n class=\"p-8\"\r\n [innerHTML]=\"action.tooltipDataForSimpleIcon\"\r\n ></div\r\n ></ng-template>\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_OR_INPUT'\">\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.type ===\r\n 'STRING';\r\n else inputBox\r\n \"\r\n >\r\n <span\r\n [innerHtml]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.value\r\n \"\r\n ></span>\r\n </ng-container>\r\n\r\n <ng-template #inputBox>\r\n <span class=\"input-box-container\">\r\n <input\r\n placeholder=\"{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.placeholder\r\n }}\"\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .className\r\n }}\"\r\n (keydown)=\"\r\n changesMadeInEditableInputBox(\r\n $event,\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n false\r\n )\r\n \"\r\n (paste)=\"\r\n changesMadeInEditableInputBox(\r\n $event,\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n true\r\n )\r\n \"\r\n (ngModelChange)=\"\r\n editableInputValueChanged(\r\n $event,\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n )\r\n \"\r\n [ngModel]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .value\r\n \"\r\n [disabled]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .disabled\r\n \"\r\n [ngClass]=\"{\r\n 'red-border':\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ].hasError\r\n }\"\r\n />\r\n\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ];\r\n let isLast = last\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action?.showIcon\"\r\n container=\"body\"\r\n [ngbTooltip]=\"tipContent\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"bottom\"\r\n class=\"{{ action?.iconClass }}\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action?.iconTooltip\"></div\r\n ></ng-template>\r\n </i>\r\n <ng-container *ngIf=\"action?.showSvgIcon\">\r\n <anna-core-icon-column\r\n [ngClass]=\"{ 'pr-4': !isLast }\"\r\n *ngIf=\"action?.svgOrIconName\"\r\n [componentName]=\"gtGeneralConfig.component\"\r\n [dataObject]=\"ROW_DATA\"\r\n [iconToShow]=\"action?.svgOrIconName\"\r\n data-html=\"true\"\r\n [ngbTooltip]=\"tipContent\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n >\r\n <ng-template #tipContent>\r\n <div\r\n [innerHTML]=\"action?.svgOrIconTooltipMsg\"\r\n ></div></ng-template\r\n ></anna-core-icon-column>\r\n </ng-container>\r\n <ng-container *ngIf=\"action?.showLink\">\r\n <a\r\n [id]=\"action?.id\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action?.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [class]=\"action.linkClass\"\r\n >{{ action?.linkText }}\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </span>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'HTML'\">\r\n <span\r\n [innerHtml]=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n ></span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SINGLE_SELECT_DROPDOWN'\">\r\n <ng-container\r\n *ngFor=\"\r\n let dropdown of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ];\r\n let dropdownIndex = index\r\n \"\r\n >\r\n <anna-core-single-select\r\n class=\"gt-single-select dropdown {{ dropdown?.className }}\"\r\n [ngClass]=\"{ error: !dropdown?.selectedItem }\"\r\n [items]=\"dropdown?.itemList\"\r\n [selectedItem]=\"dropdown?.selectedItem\"\r\n [disabled]=\"dropdown.isDisabled\"\r\n [config]=\"dropdown?.dropdownConfig\"\r\n (valueChanged)=\"\r\n onDropdownChanged($event, ROW_DATA, dropdownIndex)\r\n \"\r\n >\r\n </anna-core-single-select>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SINGLE_SELECT_DROPDOWN_AND_ICON'\">\r\n <ng-container\r\n *ngFor=\"\r\n let dropdown of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ];\r\n let dropdownIndex = index\r\n \"\r\n >\r\n <div [ngClass]=\"{ 'icon-dropdown': dropdown.showIcon }\">\r\n <anna-core-single-select\r\n class=\"gt-single-select dropdown {{ dropdown?.className }}\"\r\n [ngClass]=\"{ error: !dropdown?.selectedItem }\"\r\n [items]=\"dropdown?.itemList\"\r\n [selectedItem]=\"dropdown?.selectedItem\"\r\n [config]=\"dropdown?.dropdownConfig\"\r\n (valueChanged)=\"\r\n onDropdownChanged($event, ROW_DATA, dropdownIndex)\r\n \"\r\n >\r\n </anna-core-single-select>\r\n <i\r\n *ngIf=\"dropdown.showIcon\"\r\n [class]=\"dropdown.iconClass\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n dropdown.tooltipClass\r\n }}\"\r\n [ngbTooltip]=\"\r\n dropdown.showTooltip && dropdown?.tooltipData\r\n ? tipContent\r\n : null\r\n \"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n dropdown.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!dropdown.showTooltip\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"dropdown.tooltipData\"></div\r\n ></ng-template>\r\n </i>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SINGLE_RADIO'\">\r\n <span\r\n *ngIf=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n class=\"mdi mdi-radiobox-marked\"\r\n (click)=\"(null)\"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n class=\"mdi mdi-radiobox-blank\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n true\r\n )\r\n \"\r\n >\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'RADIO'\">\r\n <mat-radio-group\r\n *ngIf=\"ROW_DATA['RadioButtonConfig']; else showHyphen\"\r\n [ngModel]=\"ROW_DATA[subline.objectKey]\"\r\n [disabled]=\"ROW_DATA['RadioButtonConfig'][0].isDisabled\"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let radioButton of ROW_DATA['RadioButtonConfig'];\r\n let last = last\r\n \"\r\n >\r\n <mat-radio-button\r\n value=\"{{ radioButton.value }}\"\r\n class=\"{{ radioButton.class }}\"\r\n (click)=\"\r\n radioButtonClicked(\r\n ROW_DATA,\r\n radioButton.value,\r\n ROW_DATA['RadioButtonConfig'][0].isDisabled\r\n )\r\n \"\r\n >{{ radioButton.label }}\r\n </mat-radio-button>\r\n <ng-container *ngIf=\"radioButton.icons\">\r\n <i\r\n *ngFor=\"let icon of radioButton.icons\"\r\n class=\" {{ icon.class }}\"\r\n (click)=\"radioButtonIconClicked(ROW_DATA, icon.name)\"\r\n ></i>\r\n </ng-container>\r\n\r\n <i\r\n *ngIf=\"radioButton.tooltipMessage\"\r\n class=\"mi mdi-info-outline\"\r\n [ngbTooltip]=\"radioButton.tooltipMessage\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n ></i>\r\n <br *ngIf=\"!last\" />\r\n </ng-container>\r\n </mat-radio-group>\r\n <ng-template #showHyphen> - </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_TOOLTIP'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span class=\"action-data\"> {{ action?.dataToDisplay }}</span>\r\n <ng-container *ngIf=\"action?.additionalTextWoTooltip\">\r\n <span\r\n class=\"additional-text-wo-tooltip\"\r\n [innerHtml]=\"action.additionalTextWoTooltip\"\r\n >\r\n </span>\r\n </ng-container>\r\n <span\r\n *ngIf=\"action?.showTooltip\"\r\n [ngbTooltip]=\"stringWithTooltipTemplate\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringWithTooltipTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey,\r\n tooltipWithStringRef\r\n )\r\n \"\r\n [placement]=\"action?.tooltipPosition\"\r\n container=\"body\"\r\n [class]=\"action?.tooltipIconClass\"\r\n [autoClose]=\"'outside'\"\r\n [triggers]=\"action.isManualTrigger ? 'manual' : 'hover focus'\"\r\n #tooltipWithStringRef=\"ngbTooltip\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class {{\r\n action?.tooltipInnerClass\r\n }}\"\r\n [disableTooltip]=\"action?.disableTooltip\"\r\n >\r\n </span>\r\n <span>{{ action?.dataToDisplayAfterTooltip }}</span>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_ELLIPSIS_WITH_TABLE_TOOLTIP'\">\r\n <div class=\"new-ellipsis-container\">\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"cell-value\"\r\n >\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .cellValue\r\n }}\r\n </span>\r\n <span\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.showTooltip\r\n \"\r\n class=\"tooltip-text\"\r\n [ngbTooltip]=\"tableInsideTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n triggers=\"manual\"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"table-inside-tooltip remove-on-scroll-class {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.tooltipClass\r\n }}\"\r\n (mouseenter)=\"\r\n bindTheValueToTableTooltip(\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey],\r\n info\r\n )\r\n \"\r\n >\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.tooltipHoverText\r\n }}\r\n </span>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_ELLIPSIS_AND_READ_MORE_TOOLTIP'\">\r\n <span\r\n title=\"\"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length <\r\n 26\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n title=\"\"\r\n [ngbTooltip]=\"statusNoteTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n [triggers]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length >\r\n 100\r\n ? 'manual'\r\n : 'hover focus'\r\n \"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"status-note-tooltip\"\r\n (mouseenter)=\"\r\n bindTheValueToStatusNote(\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey],\r\n info,\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n )\r\n \"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length >\r\n 25\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_TOOLTIP_INNER_HTML'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"action-data\"\r\n [ngClass]=\"action?.showTooltip ? 'reduced-width-text' : ''\"\r\n >\r\n {{ action?.dataToDisplay }}</span\r\n >\r\n <span\r\n *ngIf=\"action?.showTooltip\"\r\n [ngbTooltip]=\"innerHtmlToolTipTemplate\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringWithInnerHtmlTooltipTextActionType(\r\n ROW_DATA,\r\n action,\r\n tooltipWithInnerHtmlRef,\r\n !action.isManualTrigger\r\n )\r\n \"\r\n [placement]=\"action?.tooltipPosition\"\r\n container=\"body\"\r\n [class]=\"\r\n 'innrHtml-tooltip-icon-marker ' + action?.tooltipIconClass\r\n \"\r\n [autoClose]=\"'outside'\"\r\n [triggers]=\"action.isManualTrigger ? 'manual' : 'hover focus'\"\r\n #tooltipWithInnerHtmlRef=\"ngbTooltip\"\r\n tooltipClass=\"gt-icon-innerHtml-tooltip remove-on-scroll-class {{\r\n action?.tooltipInnerClass\r\n }}\"\r\n [disableTooltip]=\"action?.disableTooltip\"\r\n >\r\n {{ action.tooltipMarkerText }}\r\n </span>\r\n <span *ngIf=\"action?.dataToDisplayAfterTooltip\">\r\n {{ action?.dataToDisplayAfterTooltip }}\r\n </span>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngSwitchCase=\"\r\n 'ICON_CELL_AND_STRING_WITH_ELLIPSIS_AND_READ_MORE_TOOLTIP'\r\n \"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n title=\"\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"action.showTooltip ? action.tooltipData : null\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!action.showTooltip\"\r\n >\r\n </i>\r\n\r\n <ng-container *ngIf=\"action.showObjectKey\">\r\n <span\r\n title=\"\"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length < 26\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n title=\"\"\r\n [ngbTooltip]=\"statusNoteTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n [triggers]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length > 100\r\n ? 'manual'\r\n : 'hover focus'\r\n \"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"status-note-tooltip\"\r\n (mouseenter)=\"\r\n bindTheValueToStatusNote(\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n info\r\n )\r\n \"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length > 25\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'DIGIT_ONLY_INPUT'\">\r\n <input\r\n annaCoreDigitOnly\r\n [type]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].type\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .type\r\n : 'text'\r\n \"\r\n [decimal]=\"true\"\r\n [readOnly]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].disabled\r\n \"\r\n [decimalPlaces]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .decimalPlaces\r\n \"\r\n inputmode=\"numeric\"\r\n [min]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].min ||\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.min ===\r\n 0\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].min\r\n : digitInputmin\r\n \"\r\n [max]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].max ||\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.max ===\r\n 0\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].max\r\n : digitInputMax\r\n \"\r\n [allowPaste]=\"false\"\r\n class=\"form-control\"\r\n [value]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].value\r\n \"\r\n [placeholder]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .placeholder\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .placeholder\r\n : 'Enter value'\r\n \"\r\n (input)=\"\r\n onInputChange(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n $event\r\n )\r\n \"\r\n />\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'TIME_INPUT'\">\r\n <div\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .showAsInput;\r\n else timeAsString\r\n \"\r\n class=\"time-selected-div {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].class\r\n }}\"\r\n [ngbTooltip]=\"timeInputTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"false\"\r\n triggers=\"manual\"\r\n #timeInputTooltipInRow=\"ngbTooltip\"\r\n (click)=\"\r\n timeInputTooltipClickedInTableBody(\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey],\r\n ROW_DATA\r\n );\r\n bindTheValueToTimeInputTooltip(timeInputTooltipInRow)\r\n \"\r\n >\r\n <div class=\"time-selection-menu\">\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .selectedTimeAsAString\r\n }}\r\n <i\r\n *ngIf=\"\r\n !timeTableRowtooltip ||\r\n !selectedRowForTimeEdit ||\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.id !==\r\n selectedRowForTimeEdit[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ]?.id\r\n \"\r\n class=\"mdi mdi-menu-down icon\"\r\n ></i>\r\n <i\r\n *ngIf=\"\r\n timeTableRowtooltip &&\r\n selectedRowForTimeEdit &&\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.id ===\r\n selectedRowForTimeEdit[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ]?.id\r\n \"\r\n class=\"mdi mdi-menu-up icon\"\r\n ></i>\r\n </div>\r\n </div>\r\n <ng-template #timeAsString>\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .selectedTimeAsAString\r\n }}\r\n </ng-template>\r\n <ng-container\r\n *ngIf=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].icons\"\r\n >\r\n <i\r\n *ngFor=\"\r\n let icon of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ].icons\r\n \"\r\n container=\"body\"\r\n [ngbTooltip]=\"tipContent\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"bottom\"\r\n class=\"{{ icon.class }}\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"icon?.tooltipMessage\"></div\r\n ></ng-template>\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container *ngIf=\"subline.objectKey !== 'description'\">\r\n <span annaCoreShowEllipsisTextOnHover>{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n }}</span>\r\n <!-- <i\r\n *ngIf=\"\r\n subline.objectKey === 'inventoryCode' &&\r\n ROW_DATA['isSellerGroup'] &&\r\n gtGeneralConfig.component === 'RATING'\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n [ngbTooltip]=\"sellerHierarchyTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n triggers=\"manual\"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"hierarchy-tooltip remove-on-scroll-class\"\r\n (mouseenter)=\"\r\n bindTheValueToSellerGroupTooltip(\r\n ROW_DATA.sellerGroupHierarchy,\r\n info\r\n )\r\n \" \r\n >\r\n </i>-->\r\n\r\n <i\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedAverageRating' &&\r\n gtGeneralConfig.component === 'RATING' &&\r\n ROW_DATA['showRatingAverageIcon']\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n (mouseenter)=\"\r\n setIsDifference(ROW_DATA.isDifferenceLessThan25Percent)\r\n \"\r\n tooltipClass=\"posted-avg-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"postedRatingDifference\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedAverageImpression' &&\r\n gtGeneralConfig.component === 'RATING' &&\r\n ROW_DATA['showImpressionAverageIcon']\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n (mouseenter)=\"\r\n setIsDifference(ROW_DATA.isDifferenceLessThan25Percent)\r\n \"\r\n tooltipClass=\"posted-avg-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"postedImpDifference\"\r\n >\r\n </i>\r\n </ng-container>\r\n <ng-container *ngIf=\"subline.objectKey === 'description'\">\r\n <p\r\n *ngIf=\"\r\n ROW_DATA.descriptionMessage ||\r\n ROW_DATA.descriptionEmailReferenceNum\r\n \"\r\n >\r\n <ng-container *ngIf=\"ROW_DATA.descriptionMessage\">\r\n {{ ROW_DATA.descriptionMessage }}\r\n <br />\r\n </ng-container>\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA.descriptionEmailReferenceNum !== '-' &&\r\n ROW_DATA.descriptionEmailReferenceNum !== ''\r\n \"\r\n >\r\n Email Ref: {{ ROW_DATA.descriptionEmailReferenceNum }}\r\n <br />\r\n </ng-container>\r\n </p>\r\n <a\r\n href=\"{{ ROW_DATA.descriptionDetailsUrl }}\"\r\n target=\"_blank\"\r\n *ngIf=\"\r\n ROW_DATA.descriptionDetailsUrlType === 'PDF' ||\r\n ROW_DATA.descriptionDetailsUrlType === 'EXCEL'\r\n \"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn\">Download</button>\r\n </a>\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA.activityname.toLowerCase() === 'order onboarded'\r\n \"\r\n >\r\n <a\r\n *ngIf=\"ROW_DATA.descriptionDetailsUrlType === 'LINK'\"\r\n (click)=\"viewDetailsClicked(ROW_DATA)\"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn order-onboarded\">\r\n View details\r\n </button>\r\n </a>\r\n </ng-container>\r\n\r\n <a\r\n href=\"{{ ROW_DATA.descriptionEmailUrl }}\"\r\n target=\"_blank\"\r\n *ngIf=\"\r\n ROW_DATA.descriptionEmailUrl !== '-' &&\r\n ROW_DATA.descriptionEmailUrl !== ''\r\n \"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn\">View email</button>\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"isNoDataToDisplaySubject$ | async\">\r\n <div>\r\n {{ null }}\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n </table>\r\n </div>\r\n <anna-core-no-data-lib\r\n [width]=\"noDataWidth\"\r\n [marginTop]=\"marginTop\"\r\n *ngIf=\"isNoDataToDisplaySubject$ | async\"\r\n >\r\n </anna-core-no-data-lib>\r\n</div>\r\n\r\n<!-- Checkbox template -->\r\n<ng-template #filterTooltip>\r\n <anna-core-anna-column-checkbox-filter\r\n *ngIf=\"filterTabObjects\"\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-checkbox-filter>\r\n</ng-template>\r\n\r\n<!-- Slider template -->\r\n<ng-template #sliderToolTip>\r\n <anna-core-anna-column-slider-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-slider-filter>\r\n</ng-template>\r\n\r\n<!-- Date Picker Template -->\r\n<ng-template #datePickerTooltip>\r\n <anna-core-anna-column-date-range-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-date-range-filter>\r\n</ng-template>\r\n\r\n<!-- Week Picker Template -->\r\n<ng-template #weekPickerToolTip>\r\n <!-- <div class=\"weekpicker-container\">\r\n <anna-core-week-calendar-filter-lib\r\n [week-calendar-config]=\"gtGeneralConfig.multiWeekPickerConfig\"\r\n (apply)=\"applyWeekFilter($event)\"\r\n [from-date]=\"calendarMinEnabledDate\"\r\n [to-date]=\"calendarMaxEnabledDate\"\r\n >\r\n </anna-core-week-calendar-filter-lib>\r\n </div> -->\r\n</ng-template>\r\n\r\n<!-- Time Filter Template -->\r\n<ng-template #timeFilterToolTip>\r\n <anna-core-anna-column-time-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [showAllTimeRangeCheckboxes]=\"showCheckboxesForTimeFilter\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-time-filter>\r\n</ng-template>\r\n\r\n<ng-template #timeInputTooltip>\r\n <anna-core-anna-column-time-filter\r\n [tableData]=\"timeInputData\"\r\n [clonedTableData]=\"timeInputData\"\r\n [showClearAllFilter]=\"false\"\r\n [startFromText]=\"'Start time'\"\r\n [endToText]=\"'End time'\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n [showAllTimeRangeCheckboxes]=\"false\"\r\n [isSortAndFilterAbsent]=\"true\"\r\n (closeTooltip)=\"closeTimeInputTooltip()\"\r\n (timeChanges)=\"timeSelectedInTableRow($event)\"\r\n >\r\n </anna-core-anna-column-time-filter>\r\n</ng-template>\r\n\r\n<ng-template #columnInfoTooltip>\r\n <p class=\"black-color-text white-space-nowrap\">This preemption is rejected and not marked for credit.</p>\r\n</ng-template>\r\n\r\n<ng-template #ratingInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked Rating' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected Rating' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #impsInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked IMPS' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected IMPS' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #spotsColumnEquivalizationMessageTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n This consists of equivalized spots and un-equivalized Paid Programs & un-equivalized Non-spots.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #underDeliveryTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n Indicates the Under-delivery percentage based on booked and posted RTG/IMPS.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #overDeliveryTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n Indicates the Over-delivery percentage based on booked and posted RTG/IMPS.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #rateInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked Rate' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected $ Value' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #sellerHierarchyTooltip>\r\n <ng-container *ngIf=\"sellerGroupHierarchy.length > 0\">\r\n <section class=\"hierarchy-table-container\">\r\n <table class=\"seller-hierarchy-table\">\r\n <thead>\r\n <tr>\r\n <th>#</th>\r\n <th>Inventory Codes</th>\r\n <th>Program/Description</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of sellerGroupHierarchy; let tooltipIndex = index\">\r\n <td>{{ tooltipIndex + 1 }}</td>\r\n <td>\r\n <span annaCoreShowEllipsisTextOnHover>{{ data.InventoryCode }}</span>\r\n </td>\r\n <td>\r\n <span annaCoreShowEllipsisTextOnHover>{{ data.Program }}</span>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </section>\r\n </ng-container>\r\n <ng-container *ngIf=\"sellerGroupHierarchy.length === 0\">\r\n <span class=\"black-color-text\">Seller group not available for this inventory code</span>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #tableInsideTooltip>\r\n <label class=\"ellipsis-tooltip-heading\">{{ ellipsisWithTooltipHeading }}</label>\r\n <section class=\"table-inside-tooltip-container\">\r\n <table class=\"ellipsis-tooltip-table\">\r\n <thead>\r\n <tr>\r\n <th\r\n [style.width]=\"header.width\"\r\n *ngFor=\"let header of ellipsisWithTooltipTableHeaders\"\r\n >\r\n <div>\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"upper-label\"\r\n >{{ header.headerName }}</span\r\n >\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of ellipsisWithTooltipTableData\">\r\n <td *ngFor=\"let header of ellipsisWithTooltipTableHeaders\">\r\n <div>\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"upper-label\"\r\n >{{ data[header.objectKey] }}</span\r\n >\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #lurViolationInfoTooltip>\r\n <p class=\"first-row\">The values are for the entire week.</p>\r\n</ng-template>\r\n\r\n<ng-template #postedRatingDifference>\r\n <p class=\"difference-text\">\r\n The difference between posted and booked average rating is\r\n {{ isDifferenceLessThan25Percent ? \"less\" : \"more\" }} than 25%.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #postedImpDifference>\r\n <p class=\"difference-text\">\r\n The difference between posted and booked average impression is\r\n {{ isDifferenceLessThan25Percent ? \"less\" : \"more\" }} than 25%.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #ongoingRevBookedColumnTooltip>\r\n <p>The Booked $ value, Spots, GRP, CPP, IMPS, CPM corresponds on the last permanent revision generated</p>\r\n</ng-template>\r\n\r\n<ng-template #completedRevBookedColumnTooltip>\r\n <p>The Booked $ value corresponds on the last permanent revision generated</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedRate>\r\n <p>This is the booked average Rate</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedRtg>\r\n <p>This is the booked average RTG</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedImps>\r\n <p>This is the booked average IMP(\u2019000)</p>\r\n</ng-template>\r\n\r\n<ng-template #projectedImpsRtg>\r\n <p>\r\n ANNA calculates projected RTG/IMPS values using either the computed estimates or the actual posted data,\r\n depending on what is available. If posted data has not yet been received, ANNA will use the computed estimates\r\n as the projected value. Once the actual posted data is received, the projection will automatically update to\r\n reflect the real, posted values. This ensures that projected data is always based on the most accurate and\r\n up-to-date information.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #automationTooltip>\r\n <p>\r\n Please get the order business rules approved to automate the orders. Only for the automated orders, any approved\r\n MGs, ADUs, or credited spots on ANNA will be fed into the traffic system i.e. ANNA revisions.\r\n <!-- removed below line as part of enhancmennt in 14.0 releas -->\r\n <!-- Additionally, ANNA will only enter buyer revisions into traffic for the selected\r\n Medialine/WOC orders. -->\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #rebateImpact>\r\n <p>Rebate impact value is for the originally ordered spot length and is not equivalized.</p>\r\n</ng-template>\r\n\r\n<ng-template #lurViolationTotalRowToolTip>\r\n <ul>\r\n <li>\r\n <strong>POLITICAL RATE VIOLATIONS:</strong>\r\n Violations flagged when non-political spots are booked at a rate lower than the minimum booked rate for\r\n political candidates for the same week, Inventory Code and Revenue Class.\r\n </li>\r\n <li>\r\n <strong>CANDIDATE TO CANDIDATE VIOLATION:</strong>\r\n Violations flagged when political spots are booked at different rates to other political spots for the same\r\n week, Inventory Code and Revenue Class.\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #circularProgressBar>\r\n <anna-core-circular-progress\r\n [percent]=\"percentDone\"\r\n [radius]=\"5\"\r\n [outerStrokeWidth]=\"2\"\r\n [innerStrokeWidth]=\"2\"\r\n [outerStrokeColor]=\"'#268bff'\"\r\n [innerStrokeColor]=\"'#d5d5d5'\"\r\n [animationDuration]=\"500\"\r\n ></anna-core-circular-progress>\r\n</ng-template>\r\n\r\n<ng-template #userLoggedInDetails>\r\n <div class=\"tooltip-div-container\">\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n <span *ngIf=\"data.key !== 'read'\">\r\n {{ data.key }} <b>{{ data.value }}</b>\r\n </span>\r\n <span *ngIf=\"data.key === 'read'\">\r\n {{ data.value }}\r\n </span>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #markAsReadTip>\r\n <div class=\"notification-tooltip-div-container\">\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.value }}\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #textActionTooltipTemplate>\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.key }} <b>{{ data.value }}</b>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #programChangeTooltipTemplate>\r\n <div class=\"program-schedule-tooltip\">\r\n <h2>Program Change</h2>\r\n <p class=\"previous\">Previous:</p>\r\n <b annaCoreShowEllipsisTextOnHover>{{ textActionTooltip.OldProgramName }}</b>\r\n\r\n <p class=\"updated\">Updated:</p>\r\n <b\r\n *ngIf=\"textActionTooltip.NewProgramNames.length === 1\"\r\n annaCoreShowEllipsisTextOnHover\r\n >{{ textActionTooltip.NewProgramNames[0] }}</b\r\n >\r\n <ul *ngIf=\"textActionTooltip.NewProgramNames.length > 1\">\r\n <li *ngFor=\"let item of textActionTooltip.NewProgramNames\">\r\n <label class=\"dot\"></label>\r\n <span annaCoreShowEllipsisTextOnHover>{{ item }}</span>\r\n </li>\r\n </ul>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #showOrHideToggleForTotalRowTooltip>\r\n <div>\r\n {{ showOrHideToggleForTotalRow && !gtGeneralConfig.totalRow ? \"Show Total Row\" : \"Hide Total Row\" }}\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #tooltipContainingTableTemplate>\r\n <div\r\n *ngIf=\"tooltipContainingTable\"\r\n [innerHTML]=\"tooltipContainingTable.innerHtml\"\r\n class=\"notification-tooltip-div-container\"\r\n >\r\n <!-- <ul>\r\n <li *ngFor=\"let headerMsg of tooltipContainingTable.tableHeaderMsg\">\r\n <b> {{headerMsg}} </b>\r\n </li>\r\n </ul>\r\n\r\n <table class=\"tooltip-table\">\r\n <thead>\r\n <tr>\r\n <th *ngFor=\"let header of tooltipContainingTable.tooltipTableHeader\">\r\n {{ header}}\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let rows of tooltipContainingTable.tooltipTableBody\">\r\n <td *ngFor=\"let data of rows\">\r\n {{ data }}\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <ul>\r\n <li style=\"margin-top:10px; padding:0\" *ngFor=\"let footerMsg of tooltipContainingTable.tableFooterMsg\">\r\n {{ footerMsg }} \r\n </li>\r\n </ul> -->\r\n </div>\r\n</ng-template>\r\n<!-- <ng-template #textActionTooltipTemplate>\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.key }} <b> {{data.value}}</b>\r\n </ng-container>\r\n</ng-template> -->\r\n\r\n<ng-template #statusNoteTooltip>\r\n <div>\r\n <span class=\"status-note-tooltip\">{{ statusNoteForTooltip }}</span>\r\n <span *ngIf=\"statusNoteForPopup.length > 100\"\r\n >...<a\r\n class=\"view-more-comments\"\r\n (click)=\"showEntireStatusNote()\"\r\n >View more</a\r\n ></span\r\n >\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #innerHtmlToolTipTemplate>\r\n <div [innerHtml]=\"toolTipInnerHtmlData\"></div>\r\n</ng-template>\r\n", styles: ["::ng-deep .show-or-hide-toggle-tooltip .tooltip-inner{max-width:229px}.show-or-hide-toggle-btn.shift-toggle-top-on-total-row-click{transform:translate(calc(var(--app-left-space-show-hide-total-row-icon) - 12px),32px)}.show-or-hide-toggle-btn{width:16px;height:16px;padding:0;margin:0;border-radius:50%;position:absolute;transform:translate(calc(var(--app-left-space-show-hide-total-row-icon) - 12px),52px);z-index:999;background-color:#d9d9d9}.show-or-hide-toggle-btn i.mdi.mdi-menu-swap{font-size:16px;display:flex}#generic-table-conatiner.table-with-show-hide-total-row-toggle .total-row td:nth-of-type(2){padding-left:16px!important}::ng-deep .gt-icon-innerHtml-tooltip .tooltip-inner{max-width:600px;width:min-content}::ng-deep .gt-icon-innerHtml-tooltip .tooltip-inner>div{width:max-content}::ng-deep .generic-innerHtml-table-heading{margin-bottom:2px;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a}::ng-deep .generic-innerHtml-table-container{max-height:8.75rem;width:min-content;overflow:auto}::ng-deep .generic-innerHtml-table-container table{table-layout:fixed;width:100%}::ng-deep .generic-innerHtml-table-container table thead tr th{background:#e9e9e9;height:22px;padding:3px 8px;position:sticky;top:0;cursor:default;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0;box-shadow:inset 1px -1px #d4d4d4,inset 0 1px #d4d4d4}::ng-deep .generic-innerHtml-table-container table thead tr th:last-of-type{box-shadow:inset 1px -1px #d4d4d4,inset -1px 1px #d4d4d4!important}::ng-deep .generic-innerHtml-table-container table tbody tr td{padding:3px 8px;width:100%;color:#000;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px;box-shadow:inset 1px -1px #d4d4d4}::ng-deep .generic-innerHtml-table-container table tbody tr td:last-of-type{box-shadow:inset 1px -1px #d4d4d4,inset -1px 0 #d4d4d4}::ng-deep .generic-innerHtml-table-container table tbody tr:first-of-type td{border-top:none}::ng-deep .generic-innerHtml-table-container::-webkit-scrollbar-track{margin-top:22px!important}.sort-btn{background:#fff;border:none;border-right:1px solid #1b88ff;text-decoration:underline;font-family:Roboto;font-size:var(--sort-label-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.07;letter-spacing:normal;color:#1b88ff;cursor:pointer;flex:1;text-align:center}.sort-btn:last-of-type{border-right:none}.sort-btn.active{color:#202b47;text-decoration:none}p.sort-container{margin-top:8px;padding-bottom:8px;border-bottom:1px solid #e6e6e6;margin-bottom:0;display:flex}::ng-deep .tooltip-inner{max-height:22rem;background-color:#fff;border:1px solid white;border-radius:5px;box-shadow:0 2px 2px #0000003d,0 0 2px #0000001f;max-width:251px;width:100%;padding:0!important}::ng-deep .tooltip-inner div.radio-container{flex-wrap:wrap}::ng-deep .md-drppicker{box-shadow:unset!important}::ng-deep .available{color:#999}::ng-deep .bs-tooltip-bottom .arrow:before{border-bottom-color:#fff!important}::ng-deep .bs-tooltip-left .arrow:before{border-left-color:#fff!important}::ng-deep .tooltip.show{opacity:1}.input{text-align:left;margin:5px 10px 5px 5px;display:flex;align-items:center;width:230px;white-space:nowrap}.data{color:#000;font-weight:700;margin-left:5px;margin-right:5px}span.data{display:inline-block;text-overflow:ellipsis;white-space:pre;width:100%;overflow:hidden}.check-box{font-size:14px;cursor:pointer;position:relative;top:-1px}span.mdi-filter.active{color:#000;opacity:1!important;pointer-events:all!important}p{margin-bottom:0;line-height:initial}span.mdi-filter{color:#cbcbcb}::ng-deep .ngx-slider-pointer{top:-5px!important;width:12px!important;height:12px!important;background:#bdbdbd!important;border:1px solid #ffffff!important;box-shadow:0 1px 3px #0000004d!important;border-radius:16px!important}input:focus{outline:none}input::placeholder{color:#c8c8c8}.cancel-btn{background:#c7e1ff;color:#268bff}.apply-btn{background:#268bff;color:#fff;margin-left:.3125rem}div.radio-container{display:flex;white-space:nowrap;justify-content:space-between;background-color:#f4f4f4;border-radius:.125rem;margin:.4375rem .4375rem .25rem}div.radio-container div{flex:1;width:50%}div.radio-container div.full-width{width:100%}div.radio-container input{position:relative;top:.125rem;margin-right:.25rem}div.radio-container label{font-family:Roboto;font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:0;color:#4a4a4a;margin:0;padding-left:.125rem}div.radio-container label:first-of-type{margin-right:.188rem}div.radio-container input[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;width:.9375rem;height:.9375rem;padding:.125rem;background-clip:content-box;border:.125rem solid #268bff;background-color:transparent;border-radius:50%}div.radio-container input[type=radio]:checked{background-color:#268bff}.checkbox-filter-buttons-container{padding:0 8px!important}.buttons-container{display:flex;margin:0px auto .4375rem;justify-content:center;padding:0 12px}.buttons-container .button{padding:0 10px;width:100%;margin:8px 0 0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.buttons-container button:last-of-type{background-color:#268bff;color:#fff;margin-left:.5rem}.buttons-container button.disabled{background:#bdbdbd;opacity:.5;color:#4a4a4a}.button{display:inline-block;margin:8px 4px 0 8px;padding:0 16px;border-radius:4px;text-align:center;outline:none;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.67;letter-spacing:normal;border:none;color:#268bff;background-color:#e5f1ff}.search-box{display:flex;align-items:center;color:#c8c8c8;border:1px solid #e6e6e6;border-radius:.125rem;margin:.25rem .4375rem .188rem;height:1.5rem;padding:.188rem 8px .188rem .5rem}.search-box .search-bar-close{margin-left:auto;float:right}.search-icon{margin:0 4px 0 0;font-size:var(--filter-search-icon-fs);color:#9b9b9b}.filter-icon{justify-content:right;margin-left:auto;color:#d4d4d4;color:#a1a1a1;font-size:16px;cursor:pointer}.data{margin:0 13px 0 8px;font-family:Roboto;font-size:var(--filter-checkbox-label-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.86;letter-spacing:\"\";color:#4a4a4a}.search-input{font-family:Roboto;font-size:var(--filter-search-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#c8c8c8;width:calc(100% - 38px);margin:1px 0 1px 2px;border:none;padding:0}.check-box{color:#268bff}.tooltip-data-container{overflow-y:scroll;max-height:8rem}.searchbar{width:100%;display:flex;justify-content:flex-end;align-items:flex-end}.clear-button{opacity:.5;font-family:Roboto;font-size:.9375rem;font-weight:500;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;text-decoration:underline;border:none;background-color:#fff;color:#4a4a4a;margin-left:.625rem;padding:0}.clear-button:focus{outline:none;box-shadow:none}.unchecked{color:#268bff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.3rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container p.input{margin-left:0}cdk-virtual-scroll-viewport.dropdown-data-container p.input span.mi{padding-left:.4375rem}cdk-virtual-scroll-viewport.dropdown-data-container p.input:hover{background-color:#ebebeb;cursor:pointer}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.188rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}section.min-maxContainer{display:flex;justify-content:center;margin-bottom:-.125rem;margin-top:.5rem;width:100%}section.min-maxContainer input{width:30%;height:1.5rem;border:1px solid lightgray;color:gray}section.min-maxContainer span{display:inline-block;padding-left:.5rem;padding-right:.5rem;position:relative;top:.3125rem;color:#666;font-size:var(--page-message-content-fs)}.time-container{width:100%;display:flex;padding:0 .75rem}.time-container input.form-control:disabled{background-color:#fff;width:2.813rem}.time-container input.numberInput:focus{box-shadow:none;border-color:#c2cfd6}.time-container .dot{color:#cbcbcb;position:relative;left:-7px;font-size:17px}.time-container div.arrow-container{flex-direction:column;display:flex;margin-top:.375rem;width:9px;height:18px;margin-right:.875rem}.time-container div.arrow-container i{color:#000;cursor:pointer;max-height:9px;font-size:20px;width:10px}.time-container div.arrow-container i:before{width:0;height:0;pointer-events:none;position:relative;left:-9px;top:-11px}.mdi-filter{cursor:pointer}.time-label-container{display:flex;justify-content:flex-start}.time-label-container label{margin-bottom:0;color:#4a4a4a;margin-top:.125rem;margin-left:.75rem;font-weight:700;font-size:var(--dropdown-label-fs)}.time-heading{color:#000;font-size:.8125rem;text-align:left;padding-left:.625rem;margin-top:.625rem;font-weight:700}.column-clear-all{width:94%;text-align:center;border:none;font-size:var(--filter-clear-select-btn-fs);background:none;text-decoration:underline;color:#268bff}.checkbox-container{display:flex;padding-inline:.625rem}.checkbox-container .data{text-align:left}.checkbox-container:first-of-type{margin-top:.625rem;font-weight:500}.column-clear-all{width:94%;text-align:center;border:none;background:none;text-decoration:underline;color:#268bff}.column-clear-all:disabled{opacity:.5;color:#4a4a4a;font-weight:400}.column-clear-all.align-center{text-align:center}span.mdi-filter-variant.disabled{pointer-events:none;opacity:.5}.datepicker-container{width:100%}span.mdi-filter-variant{color:#cbcbcb;cursor:pointer;font-size:.875rem}span.mdi-filter-variant.active{color:#000}p.filter-tab{font-family:Roboto;font-size:var(--filter-tab-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:normal;color:#1b88ff;border-radius:5px;background-color:#f4f4f4;padding-inline:8px;cursor:pointer;overflow:hidden;text-align:center;text-overflow:ellipsis;padding-block:3px}p.filter-tab.active{color:#fff;background-color:#1b88ff}button.filter-text-btn{background:#fff;text-decoration:underline;font-family:Roboto;font-size:var(--filter-clear-select-btn-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;border:none;color:#268bff;margin-inline:4px;margin-top:2px}button.filter-text-btn:disabled{color:#b1b1b1;cursor:not-allowed}::ng-deep .non-edit-datepicker-tooltip .tooltip-inner{max-width:310px!important;width:283px!important;overflow-y:initial!important;padding:0!important}input.slider-text::-webkit-outer-spin-button,input.slider-text::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input.slider-text{-moz-appearance:textfield}input.slider-text.red-border{border:1px solid #f44336!important}::ng-deep .checkbox-sort p.sort-container{margin-top:8px!important;padding-bottom:8px!important}i.mdi-close{cursor:pointer}i.mdi-close.disable-close-icon{pointer-events:none;cursor:not-allowed}input.error-border{border:1px solid #f44336!important}::ng-deep .non-edit-checkbox-tooltip .tooltip-inner{width:238px!important;padding:0!important}::ng-deep .non-edit-slider-tooltip .tooltip-inner{width:238px!important;padding:0!important}::ng-deep .non-edit-time-tooltip .tooltip-inner{width:250px!important;padding:0!important}::ng-deep .non-edit-time-tooltip.bs-tooltip-start{padding:.4rem}::ng-deep .non-edit-time-tooltip.bs-tooltip-start .tooltip-arrow{right:0;top:5px!important;width:var(--bs-tooltip-arrow-height);height:var(--bs-tooltip-arrow-width)}::ng-deep .non-edit-time-tooltip.bs-tooltip-start .tooltip-arrow:before{border-left-color:#fff;left:-1px;border-width:calc(var(--bs-tooltip-arrow-width) * .5) 0 calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height)}::ng-deep .no-bottom-border p.sort-container{border-bottom:none!important}::ng-deep .ngx-slider-pointer-min:after{display:none}::ng-deep .ngx-slider-pointer-max:after{display:none}::ng-deep .ngx-slider span.ngx-slider-pointer{width:12px;height:12px;top:-5px;background-color:#bdbdbd}::ng-deep .ngx-slider span.ngx-slider-bar{height:3px;background:#ededed}::ng-deep .ngx-slider span.ngx-slider-selection{background:#bdbdbd}::ng-deep .ngx-slider span.ngx-slider-bubble{bottom:-22px;font-size:12px;color:#333}::ng-deep .show-min.ngx-slider span.ngx-slider-model-value{background:#fff;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003}::ng-deep .show-max.ngx-slider span.ngx-slider-model-high{background:#fff;box-shadow:none}::ng-deep .ngx-slider span.ngx-slider-combined{background:#fff;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003}::ng-deep .ngx-slider{top:10px!important;margin:5px 0 2px!important}::ng-deep .ngx-slider-animate{top:0!important}.sidebar-slider{margin-bottom:35px!important;margin-left:5px;margin-right:5px}.slider-placeholder{height:14px}::ng-deep .filter-calendar select.form-select:focus{border-color:#c2cfd6;box-shadow:none}::ng-deep .filter-calendar select.form-select{background-color:#fff}.no-data-case{padding-left:.4375rem!important;font-size:var(--filter-checkbox-label-fs)!important;margin-top:10px!important;cursor:pointer}.virtual-scroll-div{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.red-text-totol-row{color:#f44336!important}.icon-dropdown{display:flex;align-items:center;gap:3px}.check-mark,.unread-mark{cursor:pointer}.on-hover:hover .unread-mark,.notificationHover .check-mark{opacity:0;cursor:pointer}.on-hover:hover .check-mark{opacity:1;cursor:pointer}table{margin-bottom:0;table-layout:fixed;width:100%}:host ::ng-deep .gt thead{top:.1px!important;position:relative}:host ::ng-deep .gt .header-row th{border:none;background:#ededed;padding:2px 8px;line-height:normal;position:sticky;position:-webkit-sticky;top:0;box-shadow:inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row th .upper-label{font-family:Roboto;font-size:var(--table-header-fs);font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0}:host ::ng-deep .gt .header-row th .lower-label{font-family:Roboto;font-size:var(--table-header-fs);font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#a7a7a7;margin-bottom:0}:host ::ng-deep .gt .header-row th div.row{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;width:max-content}:host ::ng-deep .gt .header-row th div.dummy-header{justify-content:center;margin-left:50%!important;margin-right:50%!important;width:-webkit-fill-available}:host ::ng-deep .gt .header-row th div.sort-filter-container{display:flex;flex-wrap:nowrap;align-items:center;margin-left:.25rem;margin-right:auto}:host ::ng-deep .gt .header-row th span.mdi-filter-variant{font-size:13px!important;top:-1px!important;position:relative}:host ::ng-deep .gt .header-row th:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row th:last-of-type{box-shadow:inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row br{display:block;content:\"\";margin-top:-8px}:host ::ng-deep .gt tbody tr td{padding:2px 8px;border:none;box-shadow:inset 1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr td div:nth-child(1){color:#000;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:Roboto;font-size:var(--table-body-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}:host ::ng-deep .gt tbody tr td div:nth-child(2){color:#a7a7a7;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:Roboto;font-size:var(--table-body-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}:host ::ng-deep .gt tbody tr td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr td:last-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr br{display:block;content:\"\";margin-top:-8px}:host ::ng-deep .gt .custom-column-checkbox-checked,:host ::ng-deep .gt .custom-column-checkbox-unchecked{font-size:.875rem;cursor:pointer}:host ::ng-deep .gt .custom-column-checkbox-checked{color:#268bff}:host ::ng-deep .gt .custom-column-checkbox-unchecked{color:#2962ff}:host ::ng-deep .gt .cell-value{width:calc(100% - 24px)!important;display:inline-block;width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .gt .tooltip-text{color:#268bff;cursor:pointer;float:right}:host ::ng-deep .gt .time-selected-div{display:flex;align-items:center;column-gap:4px}:host ::ng-deep .gt .time-selected-div .time-selection-menu{border:solid 1px #b7b7b7;height:24px;text-overflow:ellipsis;padding:2px;width:99%}:host ::ng-deep .gt .time-selected-div .time-selection-menu i.mdi.mdi-menu-down,:host ::ng-deep .gt .time-selected-div .time-selection-menu i.mdi.mdi-menu-up{float:right;margin-left:auto}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td{box-shadow:inset 1px 0 #d4d4d4}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td:first-of-type{box-shadow:inset 1px 0 #d4d4d4}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td:last-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4}.table-container{overflow-x:auto;overflow-y:auto}.rowSelectCheckbox,#selectAllRowsCheckbox{cursor:pointer}.disable-checkbox{color:#dedede!important;pointer-events:none!important}.mdi-warning{color:#f3c639;font-size:16px;line-height:28px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{opacity:1}.redcolor-status{color:#c62a2a}#no-filter-space{width:.875rem}input.numberInput{margin-right:-.8125rem;padding:0 0 0 .625rem;height:1.875rem}.hidden{display:none}.visibility-collapse{visibility:collapse}.no-data-div{margin-top:2.5px}.no-data-div label{margin:0;width:auto;font-weight:500;background-color:#d3d3d3;padding:.3125rem 1.125rem;border-radius:.25rem}.column-values:nth-of-type(2){color:#a7a7a7!important}.custom-column-checkbox-checked,.custom-column-checkbox-unchecked{font-size:.875rem;cursor:pointer}.custom-column-checkbox-checked{color:#268bff}.custom-column-checkbox-unchecked{color:#2962ff}.time-filter-checkboxes>div>p{color:#151b1e}::ng-deep .margin-bottom-zero .mat-radio-label{margin-bottom:0}:host ::ng-deep mat-radio-group br{margin-top:0!important}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio__background{width:var(--mat-radio-size);height:var(--mat-radio-size)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio__inner-circle{border-width:calc(var(--mat-radio-size) / 2)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-form-field>label{margin:0 0 0 4px;padding:0;top:-2px;position:relative;font-size:var(--radio-button-label-fs)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio--disabled+label{color:var(--primary-text-color-dark)!important}:host ::ng-deep mat-radio-group mat-radio-button.mat-mdc-radio-button .mdc-form-field .mdc-radio{padding:0}:host ::ng-deep mat-radio-group mat-radio-button .mdc-form-field>label{left:-94px;font-size:12px;color:#4a4a4a;position:relative}:host ::ng-deep mat-radio-group mat-radio-button .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:var(--mdc-radio-selected-icon-color)}::ng-deep .reject.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:#ff0}::ng-deep .reject.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:#ff0}::ng-deep .resubmit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:#ff0}::ng-deep .resubmit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:#ff0}::ng-deep .noAction.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:green}::ng-deep .noAction.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:green}::ng-deep .approve.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:green}::ng-deep .approve.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:green}::ng-deep .credit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:red}::ng-deep .credit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:red}::ng-deep .mat-radio-button.mat-radio-disabled .mat-radio-outer-circle{border-color:#00000061!important}::ng-deep .mat-radio-button.mat-radio-disabled.mat-radio-checked .mat-radio-inner-circle{background-color:#00000061!important}::ng-deep tr.white-background-row{background:#fff}::ng-deep tr.gray-background-row{background:#e9e9e980!important}.remarks-tooltip,.mdi-information,.mdi-information-outline,.seller-tooltip{font-size:.875rem;color:#268bff;position:relative;top:.1875rem;cursor:pointer}.seller-tooltip{top:-1px;float:right}::ng-deep .remarks-info-tooltip .tooltip-inner{max-width:19.25rem!important}.rating-icon,.lur-violation-icon{color:#268bff;cursor:pointer;position:relative;left:-2px}::ng-deep .rating-info-tooltip .tooltip-inner{max-width:800px!important}.spots-info-icon{color:#268bff;cursor:pointer;margin:1px 2px 0 -14px}.spots-info-icon-ol{color:#268bff;cursor:pointer;margin:1px 4px 0 -2px}::ng-deep .spot-info-tooltip .tooltip-inner{position:relative;max-width:220px!important;background:#fff;word-break:break-word;display:flex}::ng-deep .spot-info-tooltip-for-orderlisting-table .tooltip-inner{max-width:220px!important;background:#fff;word-break:break-word;display:flex}p.first-row{padding:.5rem .5rem 0;color:#000;white-space:nowrap;text-align:left}p.second-row{padding:2px .5rem .5rem;color:#000;white-space:nowrap;text-align:left}::ng-deep .gt-total-row-tooltip{opacity:1!important}::ng-deep .gt-total-row-tooltip .tooltip-inner{color:#000;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;background-color:#fff;padding:4px!important;width:100%;border-radius:2px!important}::ng-deep .gt-total-row-tooltip .arrow:before{border-top-color:#fff!important}.info-label{margin-left:4px;color:#268bff;vertical-align:text-top}::ng-deep .hierarchy-tooltip{max-width:fit-content;width:310px!important}::ng-deep .hierarchy-tooltip .tooltip-inner{padding:4px!important;max-width:22.75rem;max-height:11.25rem}table.seller-hierarchy-table{table-layout:fixed}table.seller-hierarchy-table tr th{font-family:Roboto;font-size:.75rem;font-weight:500;font-stretch:normal;font-style:normal;line-height:1.67;letter-spacing:normal;color:#5e5e5e;white-space:nowrap;background:#ededed;position:sticky;box-shadow:inset 0 1px #d4d4d4;top:0;z-index:1}table.seller-hierarchy-table tr th:nth-child(1){width:20px}table.seller-hierarchy-table tr th:first-of-type,table.seller-hierarchy-table tr td:first-of-type{width:30px;border-left:1px solid #d4d4d4}table.seller-hierarchy-table tr th:last-of-type,table.seller-hierarchy-table tr td:last-of-type{border-right:1px solid #d4d4d4;width:7.875rem!important}table.seller-hierarchy-table tr th:nth-of-type(2){width:7.75rem!important}table.seller-hierarchy-table tr td{font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;box-shadow:none!important;border-top:1px solid #d4d4d4;border-bottom:1px solid #d4d4d4}table.seller-hierarchy-table tr td:nth-of-type(2),table.seller-hierarchy-table tr td:nth-of-type(3){padding-top:.25rem}table.seller-hierarchy-table tr td span{display:inline-block;width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative}section.hierarchy-table-container,section.table-inside-tooltip-container{max-height:8.75rem;overflow:auto}section.hierarchy-table-container::-webkit-scrollbar-track{margin-top:1.5rem}section.table-inside-tooltip-container::-webkit-scrollbar-track{margin-top:1.1875rem}.difference-text{padding:.5rem;color:#000;text-align:left}::ng-deep .posted-avg-tooltip .tooltip-inner{width:13.8125rem!important}::ng-deep .drrBooked-info-tooltip{transform:translate(26px,6px)}::ng-deep .drrBooked-info-tooltip .tooltip-inner{max-width:307px!important;width:242px!important;background:#fff;word-break:break-word;display:flex;padding:4px!important;text-align:left}::ng-deep .drrBooked-info-tooltip .tooltip-inner p{color:#000}::ng-deep .drrBooked-info-tooltip .arrow:before{border-right-color:#fff!important}.clickable-data{cursor:pointer;color:#268bff!important;display:flex!important;align-items:center}.clickable-data .spot-details-download-icons{font-size:12px}.disabled-clickable-data{pointer-events:none;color:#d4d4d4!important}.spot-column-tooltip-message{color:#000;width:max-content;text-align:left}div.spinner-for-button-directive{position:relative;left:-1px}.clickable-row table tr.mat-row td{cursor:pointer!important}.tooltip-div-container{text-align:left!important;padding:8px 4px;color:#4a4a4a!important;font-size:11px!important;font-family:Roboto;font-size:11px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}.notification-tooltip-div-container{text-align:left!important;padding:6px 8px;color:#4a4a4a!important;font-size:12px!important;font-family:Roboto;font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}.mdi-information,.mdi-information-outline{left:3px;top:1px}.mdi-information-outline{position:static}::ng-deep .team-user-tooltip.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .team-user-tooltip .tooltip-inner{opacity:1!important;width:fit-content!important;max-width:520px;border-radius:2px;padding:0 4px!important}::ng-deep .team-user-tooltip .tooltip-inner .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .gt-icon-column-tooltip{opacity:1!important}::ng-deep .gt-icon-column-tooltip .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .gt-icon-column-tooltip.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .gt-icon-column-tooltip .tooltip-inner{width:100%}.view-link{color:#268bff;padding:0;text-decoration:underline;border:none;background-color:inherit;cursor:pointer;letter-spacing:normal;font-weight:400;margin-left:3px}::ng-deep .tooltip-containing-table{opacity:1!important}::ng-deep .tooltip-containing-table .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .tooltip-containing-table.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .tooltip-containing-table li{margin:0!important;padding:0!important}::ng-deep .tooltip-containing-table ul{margin:0!important;padding-left:8px!important}::ng-deep .tooltip-containing-table ul.pl-16{padding-left:16px!important}::ng-deep .tooltip-containing-table .tooltip-inner{width:100%;max-width:230px}table.tooltip-table{table-layout:fixed;margin:4px 0 0;width:100%}table.tooltip-table th,table.tooltip-table td{padding:2px 8px;line-height:normal}table.tooltip-table thead tr th:first-of-type{box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4!important;border:none}table.tooltip-table thead tr th{color:#5e5e5e!important;font-size:12px;font-weight:500;font-family:Roboto;line-height:1.67;background-color:#ededed;border-top:none!important;border-bottom:none!important;outline:none!important;box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4}table.tooltip-table thead tr th div.row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}table.tooltip-table tbody tr td{color:#5e5e5e!important;font-size:12px;font-weight:500;font-family:Roboto;line-height:1.67}table.tooltip-table tbody tr td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}table.tooltip-table tbody tr td:nth-of-type(n+2){box-shadow:inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}.bottom-border{border-bottom:1px solid #d4d4d4!important}i.disabled{pointer-events:none!important}.black-color-text{color:#000}.white-space-nowrap{white-space:nowrap}.ellipsis-tooltip-heading{margin-bottom:2px;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a}table.ellipsis-tooltip-table{table-layout:fixed;width:100%}table.ellipsis-tooltip-table thead th:first-of-type{box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4!important}table.ellipsis-tooltip-table thead th{background:#e9e9e9;padding:3px 8px;line-height:normal;position:sticky;top:0;cursor:default;box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4}table.ellipsis-tooltip-table thead th .upper-label{font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0}table.ellipsis-tooltip-table tbody td{padding:3px 8px}table.ellipsis-tooltip-table tbody td .upper-label{width:100%;color:#000;text-overflow:ellipsis;overflow:hidden;display:inline-block;white-space:nowrap;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}table.ellipsis-tooltip-table tbody td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}table.ellipsis-tooltip-table tbody td:nth-of-type(n+2){box-shadow:inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}.pr-4{padding-right:4px}.status-note-tooltip{font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:14px;letter-spacing:normal;color:#4a4a4a;white-space:normal!important}.view-more-comments{display:block;color:#268bff;font-family:Roboto;font-size:.75rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:14px;letter-spacing:normal;cursor:pointer;margin-left:2px}td.mat-column-isOrderStarred:has(.disabled-starring){pointer-events:none!important}td.mat-column-isOrderStarred .mdi.mdi-star.disabled-starring,td.mat-column-isOrderStarred .mdi.mdi-star-outline.disabled-starring{pointer-events:none!important;color:#dbdbdb80!important}table.disable-table-scrolling{overflow:hidden!important}.icon-tooltip-text{display:inline-block;color:#268bff}.text-with-icon-and-text.reduced-width{text-overflow:ellipsis;overflow:hidden;display:inline-block;max-width:calc(100% - 25px);margin-bottom:-3.5px}.innrHtml-tooltip-icon-marker{float:right;color:#268bff}.reduced-width-text{text-overflow:ellipsis;overflow:hidden;display:inline-block;max-width:calc(100% - 25px)}.p-8{padding:8px!important}.anna-icons{cursor:pointer}.anna-icons.color-black{color:#000}.anna-icons.color-primary-color{color:var(--primary-color)}.anna-icons.float-right{float:right}.anna-icons.ml-4{margin-left:4px}.anna-icons.mr-4{margin-right:4px}.anna-icons.disable{pointer-events:none}tr td div:first-of-type.CENTRE{display:flex;justify-content:center;align-items:center;height:100%}input[type=radio].anna-gt-radio{accent-color:var(--primary-blue-color);width:16px;height:16px;display:inline-flex;vertical-align:middle;margin-right:4px}input[type=radio].anna-gt-radio:hover{accent-color:var(--primary-blue-color)!important;opacity:1!important;background-color:var(--primary-blue-color)!important;border-color:initial!important;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i4$3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4$3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i4$3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4$3.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i4$3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i4$3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i4$3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i4$3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i4$3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4$3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "ngmodule", type: NgxSkeletonLoaderModule }, { kind: "component", type: i3.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }, { kind: "directive", type: ShowEllipsisTextOnHoverDirective, selector: "[annaCoreShowEllipsisTextOnHover]", inputs: ["includeFullWidth"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: AnnaIconColumnComponent, selector: "anna-core-icon-column", inputs: ["componentName", "iconToShow", "dataObject"], outputs: ["columnIconClicked"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: AnnaNoDataComponent, selector: "anna-core-no-data-lib", inputs: ["width", "marginTop"] }, { kind: "component", type: AnnaColumnCheckboxFilterComponent, selector: "anna-core-anna-column-checkbox-filter", inputs: ["showFilterHeaderTabs", "isLurAndCsrComponent", "tableData", "clonedTableData", "filterTabObjects"], outputs: ["filterAppliedToTable", "sortingAppliedToTable", "getSortType", "closeTooltip"] }, { kind: "component", type: AnnaColumnSliderFilterComponent, selector: "anna-core-anna-column-slider-filter", inputs: ["filterTabObjects", "isLurAndCsrComponent", "tableData", "showFilterHeaderTabs", "clonedTableData"], outputs: ["closeTooltip", "filterAppliedToTable", "getSortType", "sortingAppliedToTable"] }, { kind: "component", type: AnnaColumnDateRangeFilterComponent, selector: "anna-core-anna-column-date-range-filter", inputs: ["tableData", "clonedTableData", "filterTabObjects", "isLurAndCsrComponent", "showFilterHeaderTabs"], outputs: ["filterAppliedToTable", "sortingAppliedToTable", "getSortType", "closeTooltip"] }, { kind: "component", type: AnnaColumnTimeFilterComponent, selector: "anna-core-anna-column-time-filter", inputs: ["tableData", "clonedTableData", "filterTabObjects", "isLurAndCsrComponent", "showFilterHeaderTabs", "showAllTimeRangeCheckboxes", "gtGeneralConfig", "showClearAllFilter", "startFromText", "endToText", "isSortAndFilterAbsent"], outputs: ["timeChanges", "timeChangedEmitter", "filterAppliedToTable", "sortingAppliedToTable", "getSortType", "closeTooltip"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: AnnaEstIconTemplateComponent, selector: "anna-core-anna-est-icon-template" }, { kind: "component", type: AnnaSingleSelectComponent, selector: "anna-core-single-select", inputs: ["config", "loading", "showAdditionalDataInSelectedText", "disabled", "items", "selectedItem", "keyToUseForDisplay", "keyToUseForCheckingSelectedItem", "hideDropdownArrow", "borderbottomObject", "defaultDropdownHeight", "itemsToHideInDropdownIds", "showClearSelection"], outputs: ["valueChanged", "dropdownClosedEvent", "dropdownOpenedEvent", "clearSelectionClickedEvent"] }, { kind: "directive", type: DigitOnlyDirective, selector: "[annaCoreDigitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern", "decimalPlaces"] }, { kind: "component", type: AnnaCircularProgressComponent, selector: "anna-core-circular-progress", inputs: ["percent", "radius", "outerStrokeWidth", "innerStrokeWidth", "outerStrokeColor", "innerStrokeColor", "animationDuration"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i7.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i7.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5750
5901
  }
5751
5902
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AnnaNonEditableGenericTableComponent, decorators: [{
5752
5903
  type: Component,
@@ -5776,7 +5927,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
5776
5927
  DigitOnlyDirective,
5777
5928
  AnnaCircularProgressComponent,
5778
5929
  MatRadioModule,
5779
- ], template: "<div\r\n id=\"generic-table-conatiner\"\r\n #tableElementRef\r\n class=\"table-container {{ gtGeneralConfig?.tableOuterContainerName }} {{ tableBottomBorderClass }}\"\r\n [ngClass]=\"{\r\n 'scroll-left-shadow-effect': isScrolledLeft,\r\n 'scroll-right-shadow-effect': !isScrollEnded,\r\n 'clickable-row': clickableRow,\r\n 'no-data-table': (isNoDataToDisplaySubject$ | async),\r\n 'table-with-show-hide-total-row-toggle': showOrHideToggleForTotalRow\r\n }\"\r\n (scroll)=\"onTableContainerScroll($event)\"\r\n>\r\n <div\r\n [class]=\"gtGeneralConfig.tableContainerName\"\r\n class=\"horizontal-scroll-for-table-container\"\r\n [ngStyle]=\"{\r\n height:\r\n tableData.length < noOfRowsToCheck - 1\r\n ? 'calc(' +\r\n (gtDimension.rowHeight * tableData.length +\r\n (!tableData.length || !gtGeneralConfig.totalRow\r\n ? gtDimension.headerHeight\r\n : gtDimension.headerHeight + gtDimension.rowHeight)) +\r\n 'px)'\r\n : gtDimension.tableHeight\r\n }\"\r\n >\r\n <button\r\n *ngIf=\"showOrHideToggleForTotalRow && !showSkeletonLoading && (isNoDataToDisplaySubject$ | async) === false\"\r\n [ngClass]=\"{\r\n 'shift-toggle-top-on-total-row-click': !gtGeneralConfig.totalRow\r\n }\"\r\n class=\"show-or-hide-toggle-btn\"\r\n (click)=\"showHideTotalRow()\"\r\n >\r\n <i\r\n class=\"mdi mdi-menu-swap\"\r\n tooltipClass=\"show-or-hide-toggle-tooltip\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n [ngbTooltip]=\"showOrHideToggleForTotalRowTooltip\"\r\n ></i>\r\n </button>\r\n\r\n <table\r\n class=\"gt\"\r\n [ngClass]=\"tableClass\"\r\n mat-table\r\n [dataSource]=\"renderedData\"\r\n >\r\n <ng-container *ngIf=\"gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"modifiedExtraHeaderRowForAdjustingColumnWidths?.objectKeys\"\r\n [style.height.px]=\"'4px'\"\r\n [class.visibility-collapse]=\"true\"\r\n ></tr>\r\n\r\n <ng-container *ngFor=\"let row of tableColumnsOfEachRow; let i = index\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"tableColumnsOfEachRow[i]; sticky: true\"\r\n [style.height.px]=\"gtDimension.headerHeight\"\r\n ></tr>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"tableColumns; sticky: true\"\r\n [style.height.px]=\"gtDimension.headerHeight\"\r\n ></tr>\r\n </ng-container>\r\n\r\n <tr\r\n class=\"total-row\"\r\n mat-header-row\r\n [style.height.px]=\"gtDimension.rowHeight\"\r\n *matHeaderRowDef=\"totalRowColumns; sticky: true\"\r\n [class.hidden]=\"\r\n showSkeletonLoading ||\r\n (!showSkeletonLoading && !tableData.length) ||\r\n (isNoDataToDisplaySubject$ | async) ||\r\n (!showSkeletonLoading && !gtGeneralConfig.totalRow)\r\n \"\r\n ></tr>\r\n <tr\r\n [class]=\"rowData.gtClass\"\r\n [ngClass]=\"{ 'no-border-tr': (isNoDataToDisplaySubject$ | async) }\"\r\n mat-row\r\n *matRowDef=\"let rowData; columns: tableColumns\"\r\n [style.height.px]=\"gtDimension.rowHeight\"\r\n (click)=\"dataRowClicked(rowData)\"\r\n ></tr>\r\n\r\n <!-- TOTAL ROW -->\r\n <ng-container\r\n [matColumnDef]=\"column.colName\"\r\n *ngFor=\"let column of totalRowInfo; trackBy: trackByFn\"\r\n >\r\n <td\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [attr.colspan]=\"column.colspan\"\r\n class=\"{{ column.class }}\"\r\n >\r\n <ng-container\r\n *ngIf=\"\r\n column['radioButtonColumnData'] && column['radioButtonColumnData']['isRadioButtonsColumn']\r\n \"\r\n >\r\n <mat-radio-group\r\n [ngModel]=\"column.radioButtonColumnData?.selectedRadioButton\"\r\n [disabled]=\"column.radioButtonColumnData?.disableRadioGroup\"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let radioButton of column.radioButtonColumnData?.radioButtonsData;\r\n let last = last\r\n \"\r\n >\r\n <mat-radio-button\r\n value=\"{{ radioButton.value }}\"\r\n class=\"{{ radioButton.class }}\"\r\n [ngClass]=\"{\r\n disabled:\r\n radioButton?.disabled || column.radioButtonColumnData?.disableRadioGroup\r\n }\"\r\n (click)=\"totalRowRadioButtonClickedByUser(radioButton.value)\"\r\n >{{ radioButton.label }}\r\n </mat-radio-button>\r\n <ng-container *ngFor=\"let iconClass of radioButton?.iconClass\">\r\n <i\r\n class=\" {{ iconClass }}\"\r\n (click)=\"totalRowRadioButtonIconClickedByUser(radioButton.value)\"\r\n ></i\r\n ></ng-container>\r\n <br *ngIf=\"!last\" />\r\n </ng-container>\r\n </mat-radio-group>\r\n </ng-container>\r\n <ng-container *ngIf=\"column['isActionColumn']\">\r\n <a\r\n *ngFor=\"let data of column.actionData\"\r\n [class]=\"data.class\"\r\n (click)=\"onClickableDataClicked({}, data.id)\"\r\n >\r\n {{ data.name }}\r\n </a>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"column['isIconColumn']\">\r\n <i\r\n class=\"{{ column?.iconData?.class }}\"\r\n (click)=\"iconClickedInTotalRow(column?.colName)\"\r\n >\r\n </i>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!column['isActionColumn']\">\r\n <strong class=\"upper-label\"\r\n >{{ column.data }}\r\n <span\r\n class=\"red-text-totol-row\"\r\n *ngIf=\"column.additionalRedTextAfterData\"\r\n >{{ column.additionalRedTextAfterData }}</span\r\n ></strong\r\n >\r\n <ng-container *ngIf=\"column.lowerData\">\r\n <p\r\n *ngIf=\"\r\n column.colName === 'total-potential-booked-unit' &&\r\n gtGeneralConfig.component === 'RATING';\r\n else columnLowerData\r\n \"\r\n class=\"clickable-data\"\r\n (click)=\"spotDetailsDownloadClicked('TOTALROW')\"\r\n [ngClass]=\"{\r\n 'disabled-clickable-data': downloadInProgress || column.lowerData === '0'\r\n }\"\r\n >\r\n {{ column.lowerData }}\r\n <span class=\"material-icons mdi mdi-download spot-details-download-icons\"></span>\r\n <ng-container *ngIf=\"downloadInProgress && selectedRowTypeForDownload === 'TOTALROW'\">\r\n <ng-container [ngTemplateOutlet]=\"circularProgressBar\"></ng-container>\r\n </ng-container>\r\n </p>\r\n <ng-template #columnLowerData>\r\n <p class=\"lower-label\">{{ column.lowerData }}</p>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"column.tooltipMessage && gtGeneralConfig.component !== 'LUR_VIOLATIONS'\">\r\n <i\r\n class=\"{{ column.tooltipIconClass }}\"\r\n container=\"body\"\r\n [ngbTooltip]=\"column.tooltipMessage\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"top bottom\"\r\n ></i>\r\n </ng-container>\r\n <ng-container *ngIf=\"gtGeneralConfig.component === 'LUR_VIOLATIONS' && column.tooltipMessage\">\r\n <i\r\n class=\"mi mdi-info-outline info-label\"\r\n container=\"body\"\r\n [ngbTooltip]=\"lurViolationTotalRowToolTip\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"bottom\"\r\n ></i>\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <ng-container\r\n [matColumnDef]=\"columnDef\"\r\n *ngFor=\"\r\n let columnDef of modifiedExtraHeaderRowForAdjustingColumnWidths.objectKeys;\r\n let i = index;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <th\r\n #tableHeader\r\n nowrap\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [style.width]=\"modifiedExtraHeaderRowForAdjustingColumnWidths.widths[i]\"\r\n ></th\r\n ></ng-container>\r\n ></ng-container\r\n >\r\n\r\n <!-- MAIN ROW -->\r\n <ng-container\r\n [matColumnDef]=\"columnDef.headerInfo[0].objectKey\"\r\n *ngFor=\"let columnDef of tableHeaders; trackBy: trackByFn\"\r\n >\r\n <th\r\n #tableHeader\r\n nowrap\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [style.width]=\"columnDef.width\"\r\n [attr.rowspan]=\"columnDef.rowspan ? columnDef.rowspan : 1\"\r\n [attr.colspan]=\"columnDef.colspan ? columnDef.colspan : 1\"\r\n >\r\n <div\r\n class=\"row mx-0\"\r\n [ngClass]=\"{ 'dummy-header': columnDef.dummyHeader }\"\r\n *ngFor=\"let header of columnDef.headerInfo; let j = index\"\r\n >\r\n <p\r\n *ngIf=\"header.typeOfHeaderData === 'STRING'\"\r\n [ngClass]=\"{ 'upper-label': j === 0, 'lower-label': j === 1 }\"\r\n >\r\n <ngx-skeleton-loader\r\n *ngIf=\"header.name == null\"\r\n count=\"1\"\r\n [theme]=\"{\r\n height: '10px',\r\n display: 'block',\r\n width: columnDef.width,\r\n 'max-width': 'calc(100% - 20px)'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <!-- <ng-container *ngIf=\"header.name\">\r\n {{ header.name }}\r\n </ng-container> -->\r\n <span [innerHTML]=\"header.name\"></span>\r\n <ng-container *ngIf=\"header.tooltip && header.tooltip.tooltipMessage\">\r\n <i\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"header.tooltip.tooltipMessage\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </ng-container>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'impsInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"impsInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"\r\n header.tooltip && header.tooltip.name === 'spotsColumnEquivalizationMessageTooltip'\r\n \"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"spotsColumnEquivalizationMessageTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'underDeliveryTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"underDeliveryTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'overDeliveryTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"overDeliveryTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'ratingInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"ratingInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'rateInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"rateInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'ongoingRevBookedColumnTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"ongoingRevBookedColumnTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'completedRevBookedColumnTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"completedRevBookedColumnTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedRate'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedRate\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedRtg'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedRtg\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedImps'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedImps\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'automationTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"automationTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'rebateImpact'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"rebateImpact\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'projectedImpsRtg'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"projectedImpsRtg\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </p>\r\n\r\n <ng-container *ngIf=\"header.typeOfHeaderData === 'CHECKBOX'\">\r\n <span\r\n *ngIf=\"gtGeneralConfig.isHeaderChecked\"\r\n class=\"mdi mdi-checkbox-marked custom-column-checkbox-checked\"\r\n (click)=\"selectUnselectAllRows()\"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!gtGeneralConfig.isHeaderChecked\"\r\n class=\"mdi mdi-checkbox-blank-outline custom-column-checkbox-unchecked\"\r\n [ngClass]=\"{ 'disable-checkbox': gtGeneralConfig.disableHeaderCheckbox }\"\r\n (click)=\"selectUnselectAllRows()\"\r\n >\r\n </span>\r\n </ng-container>\r\n\r\n <div\r\n *ngIf=\"gtGeneralConfig.showAllColumnFilter && header && header.typeOfHeaderData !== ''\"\r\n class=\"sort-filter-container\"\r\n >\r\n <ng-container *ngIf=\"header.showTooltipIcon\">\r\n <!-- Active tooltip Functionality -->\r\n <ng-container *ngIf=\"header.filter === 'CHECKBOX'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"filterTooltip\"\r\n placement=\"{{ filterAlignment }}\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-checkbox-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'SLIDER'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"sliderToolTip\"\r\n placement=\"bottom left-top\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-slider-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t1=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t1, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'DATE'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"datePickerTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-datepicker-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t2=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t2, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'WEEK'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"weekPickerToolTip\"\r\n placement=\"bottom left-top\"\r\n container=\"body\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t3=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t3, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'TIME'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"timeFilterToolTip\"\r\n placement=\"bottom left-top auto\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-time-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t4=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t4, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!header.showTooltipIcon\">\r\n <span id=\"no-filter-space\"></span><br />\r\n </ng-container>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'lurViolationInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"lurViolationInfoTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </div>\r\n </div>\r\n </th>\r\n\r\n <ng-container *matCellDef=\"let ROW_DATA\">\r\n <td\r\n mat-cell\r\n [style.background]=\"ROW_DATA.backgroundColor\"\r\n [style.border]=\"ROW_DATA.border\"\r\n class=\"{{ ROW_DATA.rowClass }}\"\r\n [ngClass]=\"ROW_DATA[columnDef.headerInfo[0].objectKey + 'TdClass']\"\r\n [attr.rowspan]=\"tdsHaveRowSpan ? ROW_DATA[columnDef.headerInfo[0].objectKey + 'Rowspan'] : 1\"\r\n *ngIf=\"\r\n !hideSomeTds ||\r\n (hideSomeTds && !ROW_DATA['hide' + columnDef.headerInfo[0].objectKey + 'Td'])\r\n \"\r\n >\r\n <ngx-skeleton-loader\r\n *ngIf=\"showSkeletonLoading\"\r\n count=\"1\"\r\n [theme]=\"{ height: '10px', display: 'block', marginBottom: '0' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n\r\n <ng-container *ngIf=\"!showSkeletonLoading\">\r\n <ng-container *ngIf=\"tableData.length > 0 && (isNoDataToDisplaySubject$ | async) === false\">\r\n <ng-container\r\n *ngFor=\"\r\n let subline of columnDef.headerInfo;\r\n let subLineIndex = index;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <div annaCoreShowEllipsisTextOnHover>\r\n <ng-container [ngSwitch]=\"columnDef.headerInfo[subLineIndex].typeOfBodyData\">\r\n <ng-container *ngSwitchCase=\"'ICON'\">\r\n <i\r\n *ngIf=\"\r\n !(\r\n starredInProgress &&\r\n ROW_DATA.orderId === selectedStarredOrderId\r\n )\r\n \"\r\n [class]=\"ROW_DATA.iconClass\"\r\n [ngClass]=\"{ 'disabled-starring': starredInProgress }\"\r\n (click)=\"iconClicked(ROW_DATA, ROW_DATA.iconClass)\"\r\n ngbTooltip=\"{{ ROW_DATA.iconTitleText }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n ></i>\r\n <ng-container\r\n *ngIf=\"\r\n starredInProgress && ROW_DATA.orderId === selectedStarredOrderId\r\n \"\r\n >\r\n <div\r\n class=\"spinner-for-button-directive\"\r\n [ngClass]=\"{ 'disabled-starring': starredInProgress }\"\r\n ></div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'ICON_CELL'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <ng-container *ngIf=\"action.showObjectKey\">\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </ng-container>\r\n\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action.tooltipClass\r\n }}\"\r\n [ngbTooltip]=\"\r\n action.showTooltip && action?.tooltipData\r\n ? tipContent\r\n : null\r\n \"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!action.showTooltip\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action.tooltipData\"></div\r\n ></ng-template>\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'HTML_STRING'\">\r\n <p\r\n [innerHTML]=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n (click)=\"innerHTMLCellClicked($event, ROW_DATA)\"\r\n ></p>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SVG_ICON'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n class=\"pr-4\"\r\n *ngIf=\"action?.showObjectKey\"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n class=\"pr-4 {{ action?.additionalTextClass }}\"\r\n *ngIf=\"action?.additionalText\"\r\n >\r\n {{ action?.additionalText }}\r\n </span>\r\n\r\n <anna-core-icon-column\r\n class=\"pr-4\"\r\n *ngIf=\"action?.svgOrIconName\"\r\n [componentName]=\"gtGeneralConfig.component\"\r\n [dataObject]=\"ROW_DATA\"\r\n [iconToShow]=\"action.svgOrIconName\"\r\n data-html=\"true\"\r\n [ngbTooltip]=\"tipContent\"\r\n [disableTooltip]=\"!action?.svgOrIconTooltipMsg\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n (columnIconClicked)=\"\r\n svgIconClicked(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n )\r\n \"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action?.svgOrIconTooltipMsg\"></div\r\n ></ng-template>\r\n </anna-core-icon-column>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'TEXT_ACTIONS'\">\r\n <ng-container\r\n *ngFor=\"\r\n let text of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <button\r\n *ngIf=\"text.showTooltip\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n text.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disabled]=\"text.isDisabled\"\r\n class=\"{{ text.class }}\"\r\n (mouseenter)=\"\r\n mouseEnterOnTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n [ngbTooltip]=\"textActionTooltipTemplate\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n >\r\n {{ text.name }}\r\n </button>\r\n\r\n <button\r\n *ngIf=\"!text.showTooltip\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n text.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disabled]=\"text.isDisabled\"\r\n class=\"{{ text.class }}\"\r\n >\r\n {{ text.name }}\r\n </button>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'CHECKBOX'\">\r\n <span\r\n *ngIf=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n class=\"mdi mdi-checkbox-marked custom-column-checkbox-checked\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n false\r\n )\r\n \"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n class=\"mdi mdi-checkbox-blank-outline custom-column-checkbox-unchecked\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n true\r\n )\r\n \"\r\n >\r\n </span>\r\n\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionTypeContainingTable(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"tooltip-containing-table remove-on-scroll-class\"\r\n ngbTooltip=\"tooltipContainingTableTemplate\"\r\n >\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'CLICKABLE_DATA'\">\r\n <a\r\n *ngFor=\"\r\n let text of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n [class]=\"text.class\"\r\n (click)=\"onClickableDataClicked(ROW_DATA, text.id)\"\r\n >{{ text.name }}</a\r\n >\r\n <span\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedUnits' &&\r\n gtGeneralConfig.component === 'RATING'\r\n \"\r\n class=\"clickable-data\"\r\n (click)=\"spotDetailsDownloadClicked('DATAROW', ROW_DATA)\"\r\n [ngClass]=\"{\r\n 'disabled-clickable-data':\r\n downloadInProgress || ROW_DATA.displayBookedUnits === '-'\r\n }\"\r\n >{{ ROW_DATA.displayBookedUnits }}\r\n <span\r\n class=\"material-icons mdi mdi-download spot-details-download-icons\"\r\n ></span>\r\n <ng-container\r\n *ngIf=\"\r\n downloadInProgress &&\r\n ROW_DATA.ProgramId === selectedProgramIdForDownload &&\r\n ROW_DATA.Demographic === selectedDemographicForDownload\r\n \"\r\n >\r\n <ng-container\r\n [ngTemplateOutlet]=\"circularProgressBar\"\r\n ></ng-container>\r\n </ng-container>\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING___ICON_OR_TEXT_ACTION'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n [class]=\"action.additionalTextBeforeLinkClass\"\r\n [innerHtml]=\"action.additionalTextBeforeLink\"\r\n ngbTooltip=\"{{ action.additionalTextBeforeLink }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n [disableTooltip]=\"!action.enableTooltipForAdditionalText\"\r\n ></span>\r\n\r\n <ng-container *ngIf=\"action && action.typeOfData === 'STRING'\">\r\n <span\r\n class=\"text-with-icon-and-text\"\r\n [ngClass]=\"{ 'reduced-width': action.showIcon }\"\r\n annaCoreShowEllipsisTextOnHover\r\n >{{ action.data }}</span\r\n >\r\n </ng-container>\r\n\r\n <a\r\n [id]=\"action.id\"\r\n *ngIf=\"action.showLink\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [class]=\"action.linkClass\"\r\n [ngClass]=\"{ disabled: action.disabledLink }\"\r\n >{{ action.data }}</a\r\n >\r\n <span\r\n ngbTooltip=\"{{ action.additionalTextAfterLink }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n [class]=\"action.additionalTextAfterLinkClass\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n [disableTooltip]=\"!action.enableTooltipForAdditionalAfterText\"\r\n >\r\n {{ action.additionalTextAfterLink }}\r\n </span>\r\n\r\n <ng-container *ngIf=\"action.showTooltip\">\r\n <ng-container *ngIf=\"action.tooltipData.innerHtml\">\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionTypeContainingTable(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"tooltip-containing-table remove-on-scroll-class\"\r\n [ngbTooltip]=\"tooltipContainingTableTemplate\"\r\n >\r\n </i>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!action.tooltipData.tooltipTableBody\">\r\n <span\r\n *ngIf=\"action.showIcon\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n class=\"icon-tooltip-text\"\r\n (click)=\"\r\n iconClickedOnStringIconActionType(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n (mouseleave)=\"mouseLeaveTextActionType(ROW_DATA)\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n [placement]=\"\r\n action.tooltipPlacement\r\n ? action.tooltipPlacement\r\n : 'bottom auto'\r\n \"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action.tooltipClass\r\n }}\"\r\n [ngbTooltip]=\"userLoggedInDetails\"\r\n >\r\n <i [class]=\"action.iconClass\"> </i>\r\n {{ action.additionalTextAfterIcon ?? \"\" }}\r\n </span>\r\n <ng-container *ngIf=\"action['showSvgIcon']\">\r\n <anna-core-anna-est-icon-template\r\n class=\"float-right\"\r\n *ngIf=\"action['svgIconName'] === 'anna-icon'\"\r\n (mouseleave)=\"mouseLeaveTextActionType(ROW_DATA)\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex]\r\n .tooltipKey\r\n )\r\n \"\r\n [placement]=\"\r\n action.tooltipPlacement\r\n ? action.tooltipPlacement\r\n : 'bottom auto'\r\n \"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action['tooltipClass']\r\n }}\"\r\n [ngbTooltip]=\"userLoggedInDetails\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n >\r\n </anna-core-anna-est-icon-template>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!action.showTooltip\">\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (click)=\"\r\n iconClickedOnStringIconActionType(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n >\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_OR_INPUT'\">\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.type ===\r\n 'STRING';\r\n else inputBox\r\n \"\r\n >\r\n <span\r\n [innerHtml]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.value\r\n \"\r\n ></span>\r\n </ng-container>\r\n\r\n <ng-template #inputBox>\r\n <span class=\"input-box-container\">\r\n <input\r\n placeholder=\"{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.placeholder\r\n }}\"\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .className\r\n }}\"\r\n (keydown)=\"\r\n changesMadeInEditableInputBox(\r\n $event,\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n false\r\n )\r\n \"\r\n (paste)=\"\r\n changesMadeInEditableInputBox(\r\n $event,\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n true\r\n )\r\n \"\r\n (ngModelChange)=\"\r\n editableInputValueChanged(\r\n $event,\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n )\r\n \"\r\n [ngModel]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .value\r\n \"\r\n [disabled]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .disabled\r\n \"\r\n [ngClass]=\"{\r\n 'red-border':\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ].hasError\r\n }\"\r\n />\r\n\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action?.showIcon\"\r\n container=\"body\"\r\n [ngbTooltip]=\"tipContent\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"bottom\"\r\n class=\"{{ action?.iconClass }}\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action?.iconTooltip\"></div\r\n ></ng-template>\r\n </i>\r\n <ng-container *ngIf=\"action?.showSvgIcon\">\r\n <anna-core-icon-column\r\n class=\"pr-4\"\r\n *ngIf=\"action?.svgOrIconName\"\r\n [componentName]=\"gtGeneralConfig.component\"\r\n [dataObject]=\"ROW_DATA\"\r\n [iconToShow]=\"action?.svgOrIconName\"\r\n data-html=\"true\"\r\n [ngbTooltip]=\"tipContent\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n >\r\n <ng-template #tipContent>\r\n <div\r\n [innerHTML]=\"action?.svgOrIconTooltipMsg\"\r\n ></div></ng-template\r\n ></anna-core-icon-column>\r\n </ng-container>\r\n <ng-container *ngIf=\"action?.showLink\">\r\n <a\r\n [id]=\"action?.id\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action?.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [class]=\"action.linkClass\"\r\n >{{ action?.linkText }}\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </span>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'HTML'\">\r\n <span\r\n [innerHtml]=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n ></span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SINGLE_SELECT_DROPDOWN'\">\r\n <ng-container\r\n *ngFor=\"\r\n let dropdown of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ];\r\n let dropdownIndex = index\r\n \"\r\n >\r\n <anna-core-single-select\r\n class=\"gt-single-select dropdown {{ dropdown?.className }}\"\r\n [ngClass]=\"{ error: !dropdown?.selectedItem }\"\r\n [items]=\"dropdown?.itemList\"\r\n [selectedItem]=\"dropdown?.selectedItem\"\r\n [config]=\"dropdown?.dropdownConfig\"\r\n (valueChanged)=\"\r\n onDropdownChanged($event, ROW_DATA, dropdownIndex)\r\n \"\r\n >\r\n </anna-core-single-select>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SINGLE_RADIO'\">\r\n <span\r\n *ngIf=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n class=\"mdi mdi-radiobox-marked\"\r\n (click)=\"(null)\"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n class=\"mdi mdi-radiobox-blank\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n true\r\n )\r\n \"\r\n >\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'RADIO'\">\r\n <mat-radio-group\r\n *ngIf=\"ROW_DATA['RadioButtonConfig']; else showHyphen\"\r\n [ngModel]=\"ROW_DATA[subline.objectKey]\"\r\n [disabled]=\"ROW_DATA['RadioButtonConfig'][0].isDisabled\"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let radioButton of ROW_DATA['RadioButtonConfig'];\r\n let last = last\r\n \"\r\n >\r\n <mat-radio-button\r\n value=\"{{ radioButton.value }}\"\r\n class=\"{{ radioButton.class }}\"\r\n (click)=\"\r\n radioButtonClicked(\r\n ROW_DATA,\r\n radioButton.value,\r\n ROW_DATA['RadioButtonConfig'][0].isDisabled\r\n )\r\n \"\r\n >{{ radioButton.label }}\r\n </mat-radio-button>\r\n <ng-container *ngIf=\"radioButton.icons\">\r\n <i\r\n *ngFor=\"let icon of radioButton.icons\"\r\n class=\" {{ icon.class }}\"\r\n (click)=\"radioButtonIconClicked(ROW_DATA, icon.name)\"\r\n ></i>\r\n </ng-container>\r\n\r\n <i\r\n *ngIf=\"radioButton.tooltipMessage\"\r\n class=\"mi mdi-info-outline\"\r\n [ngbTooltip]=\"radioButton.tooltipMessage\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n ></i>\r\n <br *ngIf=\"!last\" />\r\n </ng-container>\r\n </mat-radio-group>\r\n <ng-template #showHyphen> - </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_TOOLTIP'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span class=\"action-data\"> {{ action?.dataToDisplay }}</span>\r\n <ng-container *ngIf=\"action?.additionalTextWoTooltip\">\r\n <span\r\n class=\"additional-text-wo-tooltip\"\r\n [innerHtml]=\"action.additionalTextWoTooltip\"\r\n >\r\n </span>\r\n </ng-container>\r\n <span\r\n *ngIf=\"action?.showTooltip\"\r\n [ngbTooltip]=\"stringWithTooltipTemplate\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringWithTooltipTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey,\r\n tooltipWithStringRef\r\n )\r\n \"\r\n [placement]=\"action?.tooltipPosition\"\r\n container=\"body\"\r\n [class]=\"action?.tooltipIconClass\"\r\n [autoClose]=\"'outside'\"\r\n [triggers]=\"action.isManualTrigger ? 'manual' : 'hover focus'\"\r\n #tooltipWithStringRef=\"ngbTooltip\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class {{\r\n action?.tooltipInnerClass\r\n }}\"\r\n [disableTooltip]=\"action?.disableTooltip\"\r\n >\r\n </span>\r\n <span>{{ action?.dataToDisplayAfterTooltip }}</span>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_ELLIPSIS_WITH_TABLE_TOOLTIP'\">\r\n <div class=\"new-ellipsis-container\">\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"cell-value\"\r\n >\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .cellValue\r\n }}\r\n </span>\r\n <span\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.showTooltip\r\n \"\r\n class=\"tooltip-text\"\r\n [ngbTooltip]=\"tableInsideTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n triggers=\"manual\"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"table-inside-tooltip remove-on-scroll-class {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.tooltipClass\r\n }}\"\r\n (mouseenter)=\"\r\n bindTheValueToTableTooltip(\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey],\r\n info\r\n )\r\n \"\r\n >\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.tooltipHoverText\r\n }}\r\n </span>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_ELLIPSIS_AND_READ_MORE_TOOLTIP'\">\r\n <span\r\n title=\"\"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length <\r\n 26\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n title=\"\"\r\n [ngbTooltip]=\"statusNoteTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n [triggers]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length >\r\n 100\r\n ? 'manual'\r\n : 'hover focus'\r\n \"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"status-note-tooltip\"\r\n (mouseenter)=\"\r\n bindTheValueToStatusNote(\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey],\r\n info\r\n )\r\n \"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length >\r\n 25\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_TOOLTIP_INNER_HTML'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"action-data\"\r\n [ngClass]=\"action?.showTooltip ? 'reduced-width-text' : ''\"\r\n >\r\n {{ action?.dataToDisplay }}</span\r\n >\r\n <span\r\n *ngIf=\"action?.showTooltip\"\r\n [ngbTooltip]=\"innerHtmlToolTipTemplate\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringWithInnerHtmlTooltipTextActionType(\r\n ROW_DATA,\r\n action,\r\n tooltipWithInnerHtmlRef,\r\n !action.isManualTrigger\r\n )\r\n \"\r\n [placement]=\"action?.tooltipPosition\"\r\n container=\"body\"\r\n [class]=\"\r\n 'innrHtml-tooltip-icon-marker ' + action?.tooltipIconClass\r\n \"\r\n [autoClose]=\"'outside'\"\r\n [triggers]=\"action.isManualTrigger ? 'manual' : 'hover focus'\"\r\n #tooltipWithInnerHtmlRef=\"ngbTooltip\"\r\n tooltipClass=\"gt-icon-innerHtml-tooltip remove-on-scroll-class {{\r\n action?.tooltipInnerClass\r\n }}\"\r\n [disableTooltip]=\"action?.disableTooltip\"\r\n >\r\n {{ action.tooltipMarkerText }}\r\n </span>\r\n <span *ngIf=\"action?.dataToDisplayAfterTooltip\">\r\n {{ action?.dataToDisplayAfterTooltip }}\r\n </span>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngSwitchCase=\"\r\n 'ICON_CELL_AND_STRING_WITH_ELLIPSIS_AND_READ_MORE_TOOLTIP'\r\n \"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n title=\"\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"action.showTooltip ? action.tooltipData : null\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!action.showTooltip\"\r\n >\r\n </i>\r\n\r\n <ng-container *ngIf=\"action.showObjectKey\">\r\n <span\r\n title=\"\"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length < 26\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n title=\"\"\r\n [ngbTooltip]=\"statusNoteTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n [triggers]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length > 100\r\n ? 'manual'\r\n : 'hover focus'\r\n \"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"status-note-tooltip\"\r\n (mouseenter)=\"\r\n bindTheValueToStatusNote(\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n info\r\n )\r\n \"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length > 25\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'DIGIT_ONLY_INPUT'\">\r\n <input\r\n annaCoreDigitOnly\r\n [type]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].type\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .type\r\n : 'text'\r\n \"\r\n [decimal]=\"true\"\r\n [readOnly]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].disabled\r\n \"\r\n inputmode=\"numeric\"\r\n [min]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].min ||\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.min ===\r\n 0\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].min\r\n : digitInputmin\r\n \"\r\n [max]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].max ||\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.max ===\r\n 0\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].max\r\n : digitInputMax\r\n \"\r\n [allowPaste]=\"false\"\r\n class=\"form-control\"\r\n [value]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].value\r\n \"\r\n [placeholder]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .placeholder\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .placeholder\r\n : 'Enter value'\r\n \"\r\n (input)=\"\r\n onInputChange(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n $event\r\n )\r\n \"\r\n />\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container *ngIf=\"subline.objectKey !== 'description'\">\r\n <span annaCoreShowEllipsisTextOnHover>{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n }}</span>\r\n <!-- <i\r\n *ngIf=\"\r\n subline.objectKey === 'inventoryCode' &&\r\n ROW_DATA['isSellerGroup'] &&\r\n gtGeneralConfig.component === 'RATING'\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n [ngbTooltip]=\"sellerHierarchyTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n triggers=\"manual\"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"hierarchy-tooltip remove-on-scroll-class\"\r\n (mouseenter)=\"\r\n bindTheValueToSellerGroupTooltip(\r\n ROW_DATA.sellerGroupHierarchy,\r\n info\r\n )\r\n \" \r\n >\r\n </i>-->\r\n\r\n <i\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedAverageRating' &&\r\n gtGeneralConfig.component === 'RATING' &&\r\n ROW_DATA['showRatingAverageIcon']\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n (mouseenter)=\"\r\n setIsDifference(ROW_DATA.isDifferenceLessThan25Percent)\r\n \"\r\n tooltipClass=\"posted-avg-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"postedRatingDifference\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedAverageImpression' &&\r\n gtGeneralConfig.component === 'RATING' &&\r\n ROW_DATA['showImpressionAverageIcon']\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n (mouseenter)=\"\r\n setIsDifference(ROW_DATA.isDifferenceLessThan25Percent)\r\n \"\r\n tooltipClass=\"posted-avg-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"postedImpDifference\"\r\n >\r\n </i>\r\n </ng-container>\r\n <ng-container *ngIf=\"subline.objectKey === 'description'\">\r\n <p\r\n *ngIf=\"\r\n ROW_DATA.descriptionMessage ||\r\n ROW_DATA.descriptionEmailReferenceNum\r\n \"\r\n >\r\n <ng-container *ngIf=\"ROW_DATA.descriptionMessage\">\r\n {{ ROW_DATA.descriptionMessage }}\r\n <br />\r\n </ng-container>\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA.descriptionEmailReferenceNum !== '-' &&\r\n ROW_DATA.descriptionEmailReferenceNum !== ''\r\n \"\r\n >\r\n Email Ref: {{ ROW_DATA.descriptionEmailReferenceNum }}\r\n <br />\r\n </ng-container>\r\n </p>\r\n <a\r\n href=\"{{ ROW_DATA.descriptionDetailsUrl }}\"\r\n target=\"_blank\"\r\n *ngIf=\"\r\n ROW_DATA.descriptionDetailsUrlType === 'PDF' ||\r\n ROW_DATA.descriptionDetailsUrlType === 'EXCEL'\r\n \"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn\">Download</button>\r\n </a>\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA.activityname.toLowerCase() === 'order onboarded'\r\n \"\r\n >\r\n <a\r\n *ngIf=\"ROW_DATA.descriptionDetailsUrlType === 'LINK'\"\r\n (click)=\"viewDetailsClicked(ROW_DATA)\"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn order-onboarded\">\r\n View details\r\n </button>\r\n </a>\r\n </ng-container>\r\n\r\n <a\r\n href=\"{{ ROW_DATA.descriptionEmailUrl }}\"\r\n target=\"_blank\"\r\n *ngIf=\"\r\n ROW_DATA.descriptionEmailUrl !== '-' &&\r\n ROW_DATA.descriptionEmailUrl !== ''\r\n \"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn\">View email</button>\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"isNoDataToDisplaySubject$ | async\">\r\n <div>\r\n {{ null }}\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n </table>\r\n </div>\r\n <anna-core-no-data-lib\r\n [width]=\"noDataWidth\"\r\n [marginTop]=\"marginTop\"\r\n *ngIf=\"isNoDataToDisplaySubject$ | async\"\r\n >\r\n </anna-core-no-data-lib>\r\n</div>\r\n\r\n<!-- Checkbox template -->\r\n<ng-template #filterTooltip>\r\n <anna-core-anna-column-checkbox-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-checkbox-filter>\r\n</ng-template>\r\n\r\n<!-- Slider template -->\r\n<ng-template #sliderToolTip>\r\n <anna-core-anna-column-slider-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-slider-filter>\r\n</ng-template>\r\n\r\n<!-- Date Picker Template -->\r\n<ng-template #datePickerTooltip>\r\n <anna-core-anna-column-date-range-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-date-range-filter>\r\n</ng-template>\r\n\r\n<!-- Week Picker Template -->\r\n<ng-template #weekPickerToolTip>\r\n <!-- <div class=\"weekpicker-container\">\r\n <anna-core-week-calendar-filter-lib\r\n [week-calendar-config]=\"gtGeneralConfig.multiWeekPickerConfig\"\r\n (apply)=\"applyWeekFilter($event)\"\r\n [from-date]=\"calendarMinEnabledDate\"\r\n [to-date]=\"calendarMaxEnabledDate\"\r\n >\r\n </anna-core-week-calendar-filter-lib>\r\n </div> -->\r\n</ng-template>\r\n\r\n<!-- Time Filter Template -->\r\n<ng-template #timeFilterToolTip>\r\n <anna-core-anna-column-time-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [showAllTimeRangeCheckboxes]=\"showCheckboxesForTimeFilter\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-time-filter>\r\n</ng-template>\r\n\r\n<ng-template #columnInfoTooltip>\r\n <p class=\"black-color-text white-space-nowrap\">This preemption is rejected and not marked for credit.</p>\r\n</ng-template>\r\n\r\n<ng-template #ratingInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked Rating' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected Rating' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #impsInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked IMPS' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected IMPS' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #spotsColumnEquivalizationMessageTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n This consists of equivalized spots and un-equivalized Paid Programs & un-equivalized Non-spots.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #underDeliveryTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n Indicates the Under-delivery percentage based on booked and posted RTG/IMPS.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #overDeliveryTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n Indicates the Over-delivery percentage based on booked and posted RTG/IMPS.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #rateInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked Rate' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected $ Value' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #sellerHierarchyTooltip>\r\n <ng-container *ngIf=\"sellerGroupHierarchy.length > 0\">\r\n <section class=\"hierarchy-table-container\">\r\n <table class=\"seller-hierarchy-table\">\r\n <thead>\r\n <tr>\r\n <th>#</th>\r\n <th>Inventory Codes</th>\r\n <th>Program/Description</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of sellerGroupHierarchy; let tooltipIndex = index\">\r\n <td>{{ tooltipIndex + 1 }}</td>\r\n <td>\r\n <span annaCoreShowEllipsisTextOnHover>{{ data.InventoryCode }}</span>\r\n </td>\r\n <td>\r\n <span annaCoreShowEllipsisTextOnHover>{{ data.Program }}</span>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </section>\r\n </ng-container>\r\n <ng-container *ngIf=\"sellerGroupHierarchy.length === 0\">\r\n <span class=\"black-color-text\">Seller group not available for this inventory code</span>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #tableInsideTooltip>\r\n <label class=\"ellipsis-tooltip-heading\">{{ ellipsisWithTooltipHeading }}</label>\r\n <section class=\"table-inside-tooltip-container\">\r\n <table class=\"ellipsis-tooltip-table\">\r\n <thead>\r\n <tr>\r\n <th\r\n [style.width]=\"header.width\"\r\n *ngFor=\"let header of ellipsisWithTooltipTableHeaders\"\r\n >\r\n <div>\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"upper-label\"\r\n >{{ header.headerName }}</span\r\n >\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of ellipsisWithTooltipTableData\">\r\n <td *ngFor=\"let header of ellipsisWithTooltipTableHeaders\">\r\n <div>\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"upper-label\"\r\n >{{ data[header.objectKey] }}</span\r\n >\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #lurViolationInfoTooltip>\r\n <p class=\"first-row\">The values are for the entire week.</p>\r\n</ng-template>\r\n\r\n<ng-template #postedRatingDifference>\r\n <p class=\"difference-text\">\r\n The difference between posted and booked average rating is\r\n {{ isDifferenceLessThan25Percent ? \"less\" : \"more\" }} than 25%.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #postedImpDifference>\r\n <p class=\"difference-text\">\r\n The difference between posted and booked average impression is\r\n {{ isDifferenceLessThan25Percent ? \"less\" : \"more\" }} than 25%.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #ongoingRevBookedColumnTooltip>\r\n <p>The Booked $ value, Spots, GRP, CPP, IMPS, CPM corresponds on the last permanent revision generated</p>\r\n</ng-template>\r\n\r\n<ng-template #completedRevBookedColumnTooltip>\r\n <p>The Booked $ value corresponds on the last permanent revision generated</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedRate>\r\n <p>This is the booked average Rate</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedRtg>\r\n <p>This is the booked average RTG</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedImps>\r\n <p>This is the booked average IMP(\u2019000)</p>\r\n</ng-template>\r\n\r\n<ng-template #projectedImpsRtg>\r\n <p>\r\n ANNA calculates projected RTG/IMPS values using either the computed estimates or the actual posted data,\r\n depending on what is available. If posted data has not yet been received, ANNA will use the computed estimates\r\n as the projected value. Once the actual posted data is received, the projection will automatically update to\r\n reflect the real, posted values. This ensures that projected data is always based on the most accurate and\r\n up-to-date information.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #automationTooltip>\r\n <p>\r\n Please get the order business rules approved to automate the orders. Only for the automated orders, any approved\r\n MGs, ADUs, or credited spots on ANNA will be fed into the traffic system i.e. ANNA revisions.\r\n <!-- removed below line as part of enhancmennt in 14.0 releas -->\r\n <!-- Additionally, ANNA will only enter buyer revisions into traffic for the selected\r\n Medialine/WOC orders. -->\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #rebateImpact>\r\n <p>Rebate impact value is for the originally ordered spot length and is not equivalized.</p>\r\n</ng-template>\r\n\r\n<ng-template #lurViolationTotalRowToolTip>\r\n <ul>\r\n <li>\r\n <strong>POLITICAL RATE VIOLATIONS:</strong>\r\n Violations flagged when non-political spots are booked at a rate lower than the minimum booked rate for\r\n political candidates for the same week, Inventory Code and Revenue Class.\r\n </li>\r\n <li>\r\n <strong>CANDIDATE TO CANDIDATE VIOLATION:</strong>\r\n Violations flagged when political spots are booked at different rates to other political spots for the same\r\n week, Inventory Code and Revenue Class.\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #circularProgressBar>\r\n <anna-core-circular-progress\r\n [percent]=\"percentDone\"\r\n [radius]=\"5\"\r\n [outerStrokeWidth]=\"2\"\r\n [innerStrokeWidth]=\"2\"\r\n [outerStrokeColor]=\"'#268bff'\"\r\n [innerStrokeColor]=\"'#d5d5d5'\"\r\n [animationDuration]=\"500\"\r\n ></anna-core-circular-progress>\r\n</ng-template>\r\n\r\n<ng-template #userLoggedInDetails>\r\n <div class=\"tooltip-div-container\">\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n <span *ngIf=\"data.key !== 'read'\">\r\n {{ data.key }} <b>{{ data.value }}</b>\r\n </span>\r\n <span *ngIf=\"data.key === 'read'\">\r\n {{ data.value }}\r\n </span>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #markAsReadTip>\r\n <div class=\"notification-tooltip-div-container\">\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.value }}\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #textActionTooltipTemplate>\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.key }} <b>{{ data.value }}</b>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #programChangeTooltipTemplate>\r\n <div class=\"program-schedule-tooltip\">\r\n <h2>Program Change</h2>\r\n <p class=\"previous\">Previous:</p>\r\n <b annaCoreShowEllipsisTextOnHover>{{ textActionTooltip.OldProgramName }}</b>\r\n\r\n <p class=\"updated\">Updated:</p>\r\n <b\r\n *ngIf=\"textActionTooltip.NewProgramNames.length === 1\"\r\n annaCoreShowEllipsisTextOnHover\r\n >{{ textActionTooltip.NewProgramNames[0] }}</b\r\n >\r\n <ul *ngIf=\"textActionTooltip.NewProgramNames.length > 1\">\r\n <li *ngFor=\"let item of textActionTooltip.NewProgramNames\">\r\n <label class=\"dot\"></label>\r\n <span annaCoreShowEllipsisTextOnHover>{{ item }}</span>\r\n </li>\r\n </ul>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #showOrHideToggleForTotalRowTooltip>\r\n <div>\r\n {{ showOrHideToggleForTotalRow && !gtGeneralConfig.totalRow ? \"Show Total Row\" : \"Hide Total Row\" }}\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #tooltipContainingTableTemplate>\r\n <div\r\n *ngIf=\"tooltipContainingTable\"\r\n [innerHTML]=\"tooltipContainingTable.innerHtml\"\r\n class=\"notification-tooltip-div-container\"\r\n >\r\n <!-- <ul>\r\n <li *ngFor=\"let headerMsg of tooltipContainingTable.tableHeaderMsg\">\r\n <b> {{headerMsg}} </b>\r\n </li>\r\n </ul>\r\n\r\n <table class=\"tooltip-table\">\r\n <thead>\r\n <tr>\r\n <th *ngFor=\"let header of tooltipContainingTable.tooltipTableHeader\">\r\n {{ header}}\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let rows of tooltipContainingTable.tooltipTableBody\">\r\n <td *ngFor=\"let data of rows\">\r\n {{ data }}\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <ul>\r\n <li style=\"margin-top:10px; padding:0\" *ngFor=\"let footerMsg of tooltipContainingTable.tableFooterMsg\">\r\n {{ footerMsg }} \r\n </li>\r\n </ul> -->\r\n </div>\r\n</ng-template>\r\n<!-- <ng-template #textActionTooltipTemplate>\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.key }} <b> {{data.value}}</b>\r\n </ng-container>\r\n</ng-template> -->\r\n\r\n<ng-template #statusNoteTooltip>\r\n <div>\r\n <span class=\"status-note-tooltip\">{{ statusNoteForTooltip }}</span>\r\n <span *ngIf=\"statusNoteForPopup.length > 100\"\r\n >...<a\r\n class=\"view-more-comments\"\r\n (click)=\"showEntireStatusNote()\"\r\n >View more</a\r\n ></span\r\n >\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #innerHtmlToolTipTemplate>\r\n <div [innerHtml]=\"toolTipInnerHtmlData\"></div>\r\n</ng-template>\r\n", styles: ["::ng-deep .show-or-hide-toggle-tooltip .tooltip-inner{max-width:229px}.show-or-hide-toggle-btn.shift-toggle-top-on-total-row-click{transform:translate(calc(var(--app-left-space-show-hide-total-row-icon) - 12px),32px)}.show-or-hide-toggle-btn{width:16px;height:16px;padding:0;margin:0;border-radius:50%;position:absolute;transform:translate(calc(var(--app-left-space-show-hide-total-row-icon) - 12px),52px);z-index:999;background-color:#d9d9d9}.show-or-hide-toggle-btn i.mdi.mdi-menu-swap{font-size:16px;display:flex}#generic-table-conatiner.table-with-show-hide-total-row-toggle .total-row td:nth-of-type(2){padding-left:16px!important}::ng-deep .gt-icon-innerHtml-tooltip .tooltip-inner{max-width:600px;width:min-content}::ng-deep .gt-icon-innerHtml-tooltip .tooltip-inner>div{width:max-content}::ng-deep .generic-innerHtml-table-heading{margin-bottom:2px;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a}::ng-deep .generic-innerHtml-table-container{max-height:8.75rem;width:min-content;overflow:auto}::ng-deep .generic-innerHtml-table-container table{table-layout:fixed;width:100%}::ng-deep .generic-innerHtml-table-container table thead tr th{background:#e9e9e9;height:22px;padding:3px 8px;position:sticky;top:0;cursor:default;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0;box-shadow:inset 1px -1px #d4d4d4,inset 0 1px #d4d4d4}::ng-deep .generic-innerHtml-table-container table thead tr th:last-of-type{box-shadow:inset 1px -1px #d4d4d4,inset -1px 1px #d4d4d4!important}::ng-deep .generic-innerHtml-table-container table tbody tr td{padding:3px 8px;width:100%;color:#000;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px;box-shadow:inset 1px -1px #d4d4d4}::ng-deep .generic-innerHtml-table-container table tbody tr td:last-of-type{box-shadow:inset 1px -1px #d4d4d4,inset -1px 0 #d4d4d4}::ng-deep .generic-innerHtml-table-container table tbody tr:first-of-type td{border-top:none}::ng-deep .generic-innerHtml-table-container::-webkit-scrollbar-track{margin-top:22px!important}.sort-btn{background:#fff;border:none;border-right:1px solid #1b88ff;text-decoration:underline;font-family:Roboto;font-size:var(--sort-label-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.07;letter-spacing:normal;color:#1b88ff;cursor:pointer;flex:1;text-align:center}.sort-btn:last-of-type{border-right:none}.sort-btn.active{color:#202b47;text-decoration:none}p.sort-container{margin-top:8px;padding-bottom:8px;border-bottom:1px solid #e6e6e6;margin-bottom:0;display:flex}::ng-deep .tooltip-inner{max-height:22rem;background-color:#fff;border:1px solid white;border-radius:5px;box-shadow:0 2px 2px #0000003d,0 0 2px #0000001f;max-width:251px;width:100%;padding:0!important}::ng-deep .tooltip-inner div.radio-container{flex-wrap:wrap}::ng-deep .md-drppicker{box-shadow:unset!important}::ng-deep .available{color:#999}::ng-deep .bs-tooltip-bottom .arrow:before{border-bottom-color:#fff!important}::ng-deep .bs-tooltip-left .arrow:before{border-left-color:#fff!important}::ng-deep .tooltip.show{opacity:1}.input{text-align:left;margin:5px 10px 5px 5px;display:flex;align-items:center;width:230px;white-space:nowrap}.data{color:#000;font-weight:700;margin-left:5px;margin-right:5px}span.data{display:inline-block;text-overflow:ellipsis;white-space:pre;width:100%;overflow:hidden}.check-box{font-size:14px;cursor:pointer;position:relative;top:-1px}span.mdi-filter.active{color:#000;opacity:1!important;pointer-events:all!important}p{margin-bottom:0;line-height:initial}span.mdi-filter{color:#cbcbcb}::ng-deep .ngx-slider-pointer{top:-5px!important;width:12px!important;height:12px!important;background:#bdbdbd!important;border:1px solid #ffffff!important;box-shadow:0 1px 3px #0000004d!important;border-radius:16px!important}input:focus{outline:none}input::placeholder{color:#c8c8c8}.cancel-btn{background:#c7e1ff;color:#268bff}.apply-btn{background:#268bff;color:#fff;margin-left:.3125rem}div.radio-container{display:flex;white-space:nowrap;justify-content:space-between;background-color:#f4f4f4;border-radius:.125rem;margin:.4375rem .4375rem .25rem}div.radio-container div{flex:1;width:50%}div.radio-container div.full-width{width:100%}div.radio-container input{position:relative;top:.125rem;margin-right:.25rem}div.radio-container label{font-family:Roboto;font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:0;color:#4a4a4a;margin:0;padding-left:.125rem}div.radio-container label:first-of-type{margin-right:.188rem}div.radio-container input[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;width:.9375rem;height:.9375rem;padding:.125rem;background-clip:content-box;border:.125rem solid #268bff;background-color:transparent;border-radius:50%}div.radio-container input[type=radio]:checked{background-color:#268bff}.checkbox-filter-buttons-container{padding:0 8px!important}.buttons-container{display:flex;margin:0px auto .4375rem;justify-content:center;padding:0 12px}.buttons-container .button{padding:0 10px;width:100%;margin:8px 0 0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.buttons-container button:last-of-type{background-color:#268bff;color:#fff;margin-left:.5rem}.buttons-container button.disabled{background:#bdbdbd;opacity:.5;color:#4a4a4a}.button{display:inline-block;margin:8px 4px 0 8px;padding:0 16px;border-radius:4px;text-align:center;outline:none;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.67;letter-spacing:normal;border:none;color:#268bff;background-color:#e5f1ff}.search-box{display:flex;align-items:center;color:#c8c8c8;border:1px solid #e6e6e6;border-radius:.125rem;margin:.25rem .4375rem .188rem;height:1.5rem;padding:.188rem 8px .188rem .5rem}.search-box .search-bar-close{margin-left:auto;float:right}.search-icon{margin:0 4px 0 0;font-size:var(--filter-search-icon-fs);color:#9b9b9b}.filter-icon{justify-content:right;margin-left:auto;color:#d4d4d4;color:#a1a1a1;font-size:16px;cursor:pointer}.data{margin:0 13px 0 8px;font-family:Roboto;font-size:var(--filter-checkbox-label-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.86;letter-spacing:\"\";color:#4a4a4a}.search-input{font-family:Roboto;font-size:var(--filter-search-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#c8c8c8;width:calc(100% - 38px);margin:1px 0 1px 2px;border:none;padding:0}.check-box{color:#268bff}.tooltip-data-container{overflow-y:scroll;max-height:8rem}.searchbar{width:100%;display:flex;justify-content:flex-end;align-items:flex-end}.clear-button{opacity:.5;font-family:Roboto;font-size:.9375rem;font-weight:500;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;text-decoration:underline;border:none;background-color:#fff;color:#4a4a4a;margin-left:.625rem;padding:0}.clear-button:focus{outline:none;box-shadow:none}.unchecked{color:#268bff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.3rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container p.input{margin-left:0}cdk-virtual-scroll-viewport.dropdown-data-container p.input span.mi{padding-left:.4375rem}cdk-virtual-scroll-viewport.dropdown-data-container p.input:hover{background-color:#ebebeb;cursor:pointer}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.188rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}section.min-maxContainer{display:flex;justify-content:center;margin-bottom:-.125rem;margin-top:.5rem;width:100%}section.min-maxContainer input{width:30%;height:1.5rem;border:1px solid lightgray;color:gray}section.min-maxContainer span{display:inline-block;padding-left:.5rem;padding-right:.5rem;position:relative;top:.3125rem;color:#666;font-size:var(--page-message-content-fs)}.time-container{width:100%;display:flex;padding:0 .75rem}.time-container input.form-control:disabled{background-color:#fff;width:2.813rem}.time-container input.numberInput:focus{box-shadow:none;border-color:#c2cfd6}.time-container .dot{color:#cbcbcb;position:relative;left:-7px;font-size:17px}.time-container div.arrow-container{flex-direction:column;display:flex;margin-top:.375rem;width:9px;height:18px;margin-right:.875rem}.time-container div.arrow-container i{color:#000;cursor:pointer;max-height:9px;font-size:20px;width:10px}.time-container div.arrow-container i:before{width:0;height:0;pointer-events:none;position:relative;left:-9px;top:-11px}.mdi-filter{cursor:pointer}.time-label-container{display:flex;justify-content:flex-start}.time-label-container label{margin-bottom:0;color:#4a4a4a;margin-top:.125rem;margin-left:.75rem;font-weight:700;font-size:var(--dropdown-label-fs)}.time-heading{color:#000;font-size:.8125rem;text-align:left;padding-left:.625rem;margin-top:.625rem;font-weight:700}.column-clear-all{width:94%;text-align:center;border:none;font-size:var(--filter-clear-select-btn-fs);background:none;text-decoration:underline;color:#268bff}.checkbox-container{display:flex;padding-inline:.625rem}.checkbox-container .data{text-align:left}.checkbox-container:first-of-type{margin-top:.625rem;font-weight:500}.column-clear-all{width:94%;text-align:center;border:none;background:none;text-decoration:underline;color:#268bff}.column-clear-all:disabled{opacity:.5;color:#4a4a4a;font-weight:400}.column-clear-all.align-center{text-align:center}span.mdi-filter-variant.disabled{pointer-events:none;opacity:.5}.datepicker-container{width:100%}span.mdi-filter-variant{color:#cbcbcb;cursor:pointer;font-size:.875rem}span.mdi-filter-variant.active{color:#000}p.filter-tab{font-family:Roboto;font-size:var(--filter-tab-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:normal;color:#1b88ff;border-radius:5px;background-color:#f4f4f4;padding-inline:8px;cursor:pointer;overflow:hidden;text-align:center;text-overflow:ellipsis;padding-block:3px}p.filter-tab.active{color:#fff;background-color:#1b88ff}button.filter-text-btn{background:#fff;text-decoration:underline;font-family:Roboto;font-size:var(--filter-clear-select-btn-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;border:none;color:#268bff;margin-inline:4px;margin-top:2px}button.filter-text-btn:disabled{color:#b1b1b1;cursor:not-allowed}::ng-deep .non-edit-datepicker-tooltip .tooltip-inner{max-width:310px!important;width:283px!important;overflow-y:initial!important;padding:0!important}input.slider-text::-webkit-outer-spin-button,input.slider-text::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input.slider-text{-moz-appearance:textfield}input.slider-text.red-border{border:1px solid #f44336!important}::ng-deep .checkbox-sort p.sort-container{margin-top:8px!important;padding-bottom:8px!important}i.mdi-close{cursor:pointer}i.mdi-close.disable-close-icon{pointer-events:none;cursor:not-allowed}input.error-border{border:1px solid #f44336!important}::ng-deep .non-edit-checkbox-tooltip .tooltip-inner{width:238px!important;padding:0!important}::ng-deep .non-edit-slider-tooltip .tooltip-inner{width:238px!important;padding:0!important}::ng-deep .non-edit-time-tooltip .tooltip-inner{width:250px!important;padding:0!important}::ng-deep .non-edit-time-tooltip.bs-tooltip-start{padding:.4rem}::ng-deep .non-edit-time-tooltip.bs-tooltip-start .tooltip-arrow{right:0;top:5px!important;width:var(--bs-tooltip-arrow-height);height:var(--bs-tooltip-arrow-width)}::ng-deep .non-edit-time-tooltip.bs-tooltip-start .tooltip-arrow:before{border-left-color:#fff;left:-1px;border-width:calc(var(--bs-tooltip-arrow-width) * .5) 0 calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height)}::ng-deep .no-bottom-border p.sort-container{border-bottom:none!important}::ng-deep .ngx-slider-pointer-min:after{display:none}::ng-deep .ngx-slider-pointer-max:after{display:none}::ng-deep .ngx-slider span.ngx-slider-pointer{width:12px;height:12px;top:-5px;background-color:#bdbdbd}::ng-deep .ngx-slider span.ngx-slider-bar{height:3px;background:#ededed}::ng-deep .ngx-slider span.ngx-slider-selection{background:#bdbdbd}::ng-deep .ngx-slider span.ngx-slider-bubble{bottom:-22px;font-size:12px;color:#333}::ng-deep .show-min.ngx-slider span.ngx-slider-model-value{background:#fff;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003}::ng-deep .show-max.ngx-slider span.ngx-slider-model-high{background:#fff;box-shadow:none}::ng-deep .ngx-slider span.ngx-slider-combined{background:#fff;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003}::ng-deep .ngx-slider{top:10px!important;margin:5px 0 2px!important}::ng-deep .ngx-slider-animate{top:0!important}.sidebar-slider{margin-bottom:35px!important;margin-left:5px;margin-right:5px}.slider-placeholder{height:14px}::ng-deep .filter-calendar select.form-select:focus{border-color:#c2cfd6;box-shadow:none}::ng-deep .filter-calendar select.form-select{background-color:#fff}.no-data-case{padding-left:.4375rem!important;font-size:var(--filter-checkbox-label-fs)!important;margin-top:10px!important;cursor:pointer}.virtual-scroll-div{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.red-text-totol-row{color:#f44336!important}.check-mark,.unread-mark{cursor:pointer}.on-hover:hover .unread-mark,.notificationHover .check-mark{opacity:0;cursor:pointer}.on-hover:hover .check-mark{opacity:1;cursor:pointer}table{margin-bottom:0;table-layout:fixed;width:100%}:host ::ng-deep .gt thead{top:.1px!important;position:relative}:host ::ng-deep .gt .header-row th{border:none;background:#ededed;padding:2px 8px;line-height:normal;position:sticky;position:-webkit-sticky;top:0;box-shadow:inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row th .upper-label{font-family:Roboto;font-size:var(--table-header-fs);font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0}:host ::ng-deep .gt .header-row th .lower-label{font-family:Roboto;font-size:var(--table-header-fs);font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#a7a7a7;margin-bottom:0}:host ::ng-deep .gt .header-row th div.row{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;width:max-content}:host ::ng-deep .gt .header-row th div.dummy-header{justify-content:center;margin-left:50%!important;margin-right:50%!important;width:-webkit-fill-available}:host ::ng-deep .gt .header-row th div.sort-filter-container{display:flex;flex-wrap:nowrap;align-items:center;margin-left:.25rem;margin-right:auto}:host ::ng-deep .gt .header-row th span.mdi-filter-variant{font-size:13px!important;top:-1px!important;position:relative}:host ::ng-deep .gt .header-row th:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row th:last-of-type{box-shadow:inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row br{display:block;content:\"\";margin-top:-8px}:host ::ng-deep .gt tbody tr td{padding:2px 8px;border:none;box-shadow:inset 1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr td div:nth-child(1){color:#000;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:Roboto;font-size:var(--table-body-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}:host ::ng-deep .gt tbody tr td div:nth-child(2){color:#a7a7a7;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:Roboto;font-size:var(--table-body-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}:host ::ng-deep .gt tbody tr td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr td:last-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr br{display:block;content:\"\";margin-top:-8px}:host ::ng-deep .gt .custom-column-checkbox-checked,:host ::ng-deep .gt .custom-column-checkbox-unchecked{font-size:.875rem;cursor:pointer}:host ::ng-deep .gt .custom-column-checkbox-checked{color:#268bff}:host ::ng-deep .gt .custom-column-checkbox-unchecked{color:#2962ff}:host ::ng-deep .gt .cell-value{width:calc(100% - 24px)!important;display:inline-block;width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .gt .tooltip-text{color:#268bff;cursor:pointer;float:right}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td{box-shadow:inset 1px 0 #d4d4d4}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td:first-of-type{box-shadow:inset 1px 0 #d4d4d4}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td:last-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4}.table-container{overflow-x:auto;overflow-y:auto}.rowSelectCheckbox,#selectAllRowsCheckbox{cursor:pointer}.disable-checkbox{color:#dedede!important;pointer-events:none!important}.mdi-warning{color:#f3c639;font-size:16px;line-height:28px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{opacity:1}.redcolor-status{color:#c62a2a}#no-filter-space{width:.875rem}input.numberInput{margin-right:-.8125rem;padding:0 0 0 .625rem;height:1.875rem}.hidden{display:none}.visibility-collapse{visibility:collapse}.no-data-div{margin-top:2.5px}.no-data-div label{margin:0;width:auto;font-weight:500;background-color:#d3d3d3;padding:.3125rem 1.125rem;border-radius:.25rem}.column-values:nth-of-type(2){color:#a7a7a7!important}.custom-column-checkbox-checked,.custom-column-checkbox-unchecked{font-size:.875rem;cursor:pointer}.custom-column-checkbox-checked{color:#268bff}.custom-column-checkbox-unchecked{color:#2962ff}.time-filter-checkboxes>div>p{color:#151b1e}::ng-deep .margin-bottom-zero .mat-radio-label{margin-bottom:0}:host ::ng-deep mat-radio-group br{margin-top:0!important}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio__background{width:var(--mat-radio-size);height:var(--mat-radio-size)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio__inner-circle{border-width:calc(var(--mat-radio-size) / 2)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-form-field>label{margin:0 0 0 4px;padding:0;top:-2px;position:relative;font-size:var(--radio-button-label-fs)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio--disabled+label{color:var(--primary-text-color-dark)!important}:host ::ng-deep mat-radio-group mat-radio-button.mat-mdc-radio-button .mdc-form-field .mdc-radio{padding:0}:host ::ng-deep mat-radio-group mat-radio-button .mdc-form-field>label{left:-94px;font-size:12px;color:#4a4a4a;position:relative}:host ::ng-deep mat-radio-group mat-radio-button .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:var(--mdc-radio-selected-icon-color)}::ng-deep .reject.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:#ff0}::ng-deep .reject.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:#ff0}::ng-deep .resubmit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:#ff0}::ng-deep .resubmit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:#ff0}::ng-deep .noAction.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:green}::ng-deep .noAction.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:green}::ng-deep .approve.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:green}::ng-deep .approve.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:green}::ng-deep .credit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:red}::ng-deep .credit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:red}::ng-deep .mat-radio-button.mat-radio-disabled .mat-radio-outer-circle{border-color:#00000061!important}::ng-deep .mat-radio-button.mat-radio-disabled.mat-radio-checked .mat-radio-inner-circle{background-color:#00000061!important}::ng-deep tr.white-background-row{background:#fff}::ng-deep tr.gray-background-row{background:#e9e9e980!important}.remarks-tooltip,.mdi-information,.mdi-information-outline,.seller-tooltip{font-size:.875rem;color:#268bff;position:relative;top:.1875rem;cursor:pointer}.seller-tooltip{top:-1px;float:right}::ng-deep .remarks-info-tooltip .tooltip-inner{max-width:19.25rem!important}.rating-icon,.lur-violation-icon{color:#268bff;cursor:pointer;position:relative;left:-2px}::ng-deep .rating-info-tooltip .tooltip-inner{max-width:800px!important}.spots-info-icon{color:#268bff;cursor:pointer;margin:1px 2px 0 -14px}.spots-info-icon-ol{color:#268bff;cursor:pointer;margin:1px 4px 0 -2px}::ng-deep .spot-info-tooltip .tooltip-inner{position:relative;max-width:220px!important;background:#fff;word-break:break-word;display:flex}::ng-deep .spot-info-tooltip-for-orderlisting-table .tooltip-inner{max-width:220px!important;background:#fff;word-break:break-word;display:flex}p.first-row{padding:.5rem .5rem 0;color:#000;white-space:nowrap;text-align:left}p.second-row{padding:2px .5rem .5rem;color:#000;white-space:nowrap;text-align:left}::ng-deep .gt-total-row-tooltip{opacity:1!important}::ng-deep .gt-total-row-tooltip .tooltip-inner{color:#000;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;background-color:#fff;padding:4px!important;width:100%;border-radius:2px!important}::ng-deep .gt-total-row-tooltip .arrow:before{border-top-color:#fff!important}.info-label{margin-left:4px;color:#268bff;vertical-align:text-top}::ng-deep .hierarchy-tooltip{max-width:fit-content;width:310px!important}::ng-deep .hierarchy-tooltip .tooltip-inner{padding:4px!important;max-width:22.75rem;max-height:11.25rem}table.seller-hierarchy-table{table-layout:fixed}table.seller-hierarchy-table tr th{font-family:Roboto;font-size:.75rem;font-weight:500;font-stretch:normal;font-style:normal;line-height:1.67;letter-spacing:normal;color:#5e5e5e;white-space:nowrap;background:#ededed;position:sticky;box-shadow:inset 0 1px #d4d4d4;top:0;z-index:1}table.seller-hierarchy-table tr th:nth-child(1){width:20px}table.seller-hierarchy-table tr th:first-of-type,table.seller-hierarchy-table tr td:first-of-type{width:30px;border-left:1px solid #d4d4d4}table.seller-hierarchy-table tr th:last-of-type,table.seller-hierarchy-table tr td:last-of-type{border-right:1px solid #d4d4d4;width:7.875rem!important}table.seller-hierarchy-table tr th:nth-of-type(2){width:7.75rem!important}table.seller-hierarchy-table tr td{font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;box-shadow:none!important;border-top:1px solid #d4d4d4;border-bottom:1px solid #d4d4d4}table.seller-hierarchy-table tr td:nth-of-type(2),table.seller-hierarchy-table tr td:nth-of-type(3){padding-top:.25rem}table.seller-hierarchy-table tr td span{display:inline-block;width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative}section.hierarchy-table-container,section.table-inside-tooltip-container{max-height:8.75rem;overflow:auto}section.hierarchy-table-container::-webkit-scrollbar-track{margin-top:1.5rem}section.table-inside-tooltip-container::-webkit-scrollbar-track{margin-top:1.1875rem}.difference-text{padding:.5rem;color:#000;text-align:left}::ng-deep .posted-avg-tooltip .tooltip-inner{width:13.8125rem!important}::ng-deep .drrBooked-info-tooltip{transform:translate(26px,6px)}::ng-deep .drrBooked-info-tooltip .tooltip-inner{max-width:307px!important;width:242px!important;background:#fff;word-break:break-word;display:flex;padding:4px!important;text-align:left}::ng-deep .drrBooked-info-tooltip .tooltip-inner p{color:#000}::ng-deep .drrBooked-info-tooltip .arrow:before{border-right-color:#fff!important}.clickable-data{cursor:pointer;color:#268bff!important;display:flex!important;align-items:center}.clickable-data .spot-details-download-icons{font-size:12px}.disabled-clickable-data{pointer-events:none;color:#d4d4d4!important}.spot-column-tooltip-message{color:#000;width:max-content;text-align:left}div.spinner-for-button-directive{position:relative;left:-1px}.clickable-row table tr.mat-row td{cursor:pointer!important}.tooltip-div-container{text-align:left!important;padding:8px 4px;color:#4a4a4a!important;font-size:11px!important;font-family:Roboto;font-size:11px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}.notification-tooltip-div-container{text-align:left!important;padding:6px 8px;color:#4a4a4a!important;font-size:12px!important;font-family:Roboto;font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}.mdi-information,.mdi-information-outline{left:3px;top:1px}.mdi-information-outline{position:static}::ng-deep .team-user-tooltip.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .team-user-tooltip .tooltip-inner{opacity:1!important;width:fit-content!important;max-width:520px;border-radius:2px;padding:0 4px!important}::ng-deep .team-user-tooltip .tooltip-inner .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .gt-icon-column-tooltip{opacity:1!important}::ng-deep .gt-icon-column-tooltip .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .gt-icon-column-tooltip.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .gt-icon-column-tooltip .tooltip-inner{width:100%}::ng-deep .tooltip-containing-table{opacity:1!important}::ng-deep .tooltip-containing-table .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .tooltip-containing-table.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .tooltip-containing-table li{margin:0!important;padding:0!important}::ng-deep .tooltip-containing-table ul{margin:0!important;padding-left:8px!important}::ng-deep .tooltip-containing-table ul.pl-16{padding-left:16px!important}::ng-deep .tooltip-containing-table .tooltip-inner{width:100%;max-width:230px}table.tooltip-table{table-layout:fixed;margin:4px 0 0;width:100%}table.tooltip-table th,table.tooltip-table td{padding:2px 8px;line-height:normal}table.tooltip-table thead tr th:first-of-type{box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4!important;border:none}table.tooltip-table thead tr th{color:#5e5e5e!important;font-size:12px;font-weight:500;font-family:Roboto;line-height:1.67;background-color:#ededed;border-top:none!important;border-bottom:none!important;outline:none!important;box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4}table.tooltip-table thead tr th div.row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}table.tooltip-table tbody tr td{color:#5e5e5e!important;font-size:12px;font-weight:500;font-family:Roboto;line-height:1.67}table.tooltip-table tbody tr td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}table.tooltip-table tbody tr td:nth-of-type(n+2){box-shadow:inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}.bottom-border{border-bottom:1px solid #d4d4d4!important}i.disabled{pointer-events:none!important}.black-color-text{color:#000}.white-space-nowrap{white-space:nowrap}.ellipsis-tooltip-heading{margin-bottom:2px;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a}table.ellipsis-tooltip-table{table-layout:fixed;width:100%}table.ellipsis-tooltip-table thead th:first-of-type{box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4!important}table.ellipsis-tooltip-table thead th{background:#e9e9e9;padding:3px 8px;line-height:normal;position:sticky;top:0;cursor:default;box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4}table.ellipsis-tooltip-table thead th .upper-label{font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0}table.ellipsis-tooltip-table tbody td{padding:3px 8px}table.ellipsis-tooltip-table tbody td .upper-label{width:100%;color:#000;text-overflow:ellipsis;overflow:hidden;display:inline-block;white-space:nowrap;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}table.ellipsis-tooltip-table tbody td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}table.ellipsis-tooltip-table tbody td:nth-of-type(n+2){box-shadow:inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}.pr-4{padding-right:4px}.status-note-tooltip{font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:14px;letter-spacing:normal;color:#4a4a4a;white-space:normal!important}.view-more-comments{display:block;color:#268bff;font-family:Roboto;font-size:.75rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:14px;letter-spacing:normal;cursor:pointer;margin-left:2px}td.mat-column-isOrderStarred:has(.disabled-starring){pointer-events:none!important}td.mat-column-isOrderStarred .mdi.mdi-star.disabled-starring,td.mat-column-isOrderStarred .mdi.mdi-star-outline.disabled-starring{pointer-events:none!important;color:#dbdbdb80!important}table.disable-table-scrolling{overflow:hidden!important}.icon-tooltip-text{display:inline-block;color:#268bff}.text-with-icon-and-text.reduced-width{text-overflow:ellipsis;overflow:hidden;display:inline-block;max-width:calc(100% - 25px);margin-bottom:-3.5px}.innrHtml-tooltip-icon-marker{float:right;color:#268bff}.reduced-width-text{text-overflow:ellipsis;overflow:hidden;display:inline-block;max-width:calc(100% - 25px)}input[type=radio].anna-gt-radio{accent-color:var(--primary-blue-color);width:16px;height:16px;display:inline-flex;vertical-align:middle;margin-right:4px}input[type=radio].anna-gt-radio:hover{accent-color:var(--primary-blue-color)!important;opacity:1!important;background-color:var(--primary-blue-color)!important;border-color:initial!important;box-shadow:none!important}\n"] }]
5930
+ ], template: "<div\r\n id=\"generic-table-conatiner\"\r\n #tableElementRef\r\n class=\"table-container {{ gtGeneralConfig?.tableOuterContainerName }} {{ tableBottomBorderClass }}\"\r\n [ngClass]=\"{\r\n 'scroll-left-shadow-effect': isScrolledLeft,\r\n 'scroll-right-shadow-effect': !isScrollEnded,\r\n 'clickable-row': clickableRow,\r\n 'no-data-table': (isNoDataToDisplaySubject$ | async),\r\n 'table-with-show-hide-total-row-toggle': showOrHideToggleForTotalRow\r\n }\"\r\n (scroll)=\"onTableContainerScroll($event)\"\r\n>\r\n <div\r\n [class]=\"gtGeneralConfig.tableContainerName\"\r\n class=\"horizontal-scroll-for-table-container\"\r\n [ngStyle]=\"{\r\n height:\r\n tableData.length < noOfRowsToCheck - 1\r\n ? 'calc(' +\r\n (gtDimension.rowHeight * tableData.length +\r\n (!tableData.length || !gtGeneralConfig.totalRow\r\n ? gtDimension.headerHeight\r\n : gtDimension.headerHeight + gtDimension.rowHeight)) +\r\n 'px)'\r\n : gtDimension.tableHeight\r\n }\"\r\n >\r\n <button\r\n *ngIf=\"showOrHideToggleForTotalRow && !showSkeletonLoading && (isNoDataToDisplaySubject$ | async) === false\"\r\n [ngClass]=\"{\r\n 'shift-toggle-top-on-total-row-click': !gtGeneralConfig.totalRow\r\n }\"\r\n class=\"show-or-hide-toggle-btn\"\r\n (click)=\"showHideTotalRow()\"\r\n >\r\n <i\r\n class=\"mdi mdi-menu-swap\"\r\n tooltipClass=\"show-or-hide-toggle-tooltip\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n [ngbTooltip]=\"showOrHideToggleForTotalRowTooltip\"\r\n ></i>\r\n </button>\r\n\r\n <table\r\n class=\"gt\"\r\n [ngClass]=\"tableClass\"\r\n mat-table\r\n [dataSource]=\"renderedData\"\r\n >\r\n <ng-container *ngIf=\"gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"modifiedExtraHeaderRowForAdjustingColumnWidths?.objectKeys\"\r\n [style.height.px]=\"'4px'\"\r\n [class.visibility-collapse]=\"true\"\r\n ></tr>\r\n\r\n <ng-container *ngFor=\"let row of tableColumnsOfEachRow; let i = index\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"tableColumnsOfEachRow[i]; sticky: true\"\r\n [style.height.px]=\"gtDimension.headerHeight\"\r\n ></tr>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <tr\r\n class=\"header-row\"\r\n mat-header-row\r\n *matHeaderRowDef=\"tableColumns; sticky: true\"\r\n [style.height.px]=\"gtDimension.headerHeight\"\r\n ></tr>\r\n </ng-container>\r\n\r\n <tr\r\n class=\"total-row\"\r\n mat-header-row\r\n [style.height.px]=\"gtDimension.rowHeight\"\r\n *matHeaderRowDef=\"totalRowColumns; sticky: true\"\r\n [class.hidden]=\"\r\n showSkeletonLoading ||\r\n (!showSkeletonLoading && !tableData.length) ||\r\n (isNoDataToDisplaySubject$ | async) ||\r\n (!showSkeletonLoading && !gtGeneralConfig.totalRow)\r\n \"\r\n ></tr>\r\n <tr\r\n [class]=\"rowData.gtClass\"\r\n [ngClass]=\"{ 'no-border-tr': (isNoDataToDisplaySubject$ | async) }\"\r\n mat-row\r\n *matRowDef=\"let rowData; columns: tableColumns\"\r\n [style.height.px]=\"gtDimension.rowHeight\"\r\n (click)=\"dataRowClicked(rowData)\"\r\n ></tr>\r\n\r\n <!-- TOTAL ROW -->\r\n <ng-container\r\n [matColumnDef]=\"column.colName\"\r\n *ngFor=\"let column of totalRowInfo; trackBy: trackByFn\"\r\n >\r\n <td\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [attr.colspan]=\"column.colspan\"\r\n class=\"{{ column.class }}\"\r\n >\r\n <ng-container\r\n *ngIf=\"\r\n column['radioButtonColumnData'] && column['radioButtonColumnData']['isRadioButtonsColumn']\r\n \"\r\n >\r\n <mat-radio-group\r\n [ngModel]=\"column.radioButtonColumnData?.selectedRadioButton\"\r\n [disabled]=\"column.radioButtonColumnData?.disableRadioGroup\"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let radioButton of column.radioButtonColumnData?.radioButtonsData;\r\n let last = last\r\n \"\r\n >\r\n <mat-radio-button\r\n value=\"{{ radioButton.value }}\"\r\n class=\"{{ radioButton.class }}\"\r\n [ngClass]=\"{\r\n disabled:\r\n radioButton?.disabled || column.radioButtonColumnData?.disableRadioGroup\r\n }\"\r\n (click)=\"totalRowRadioButtonClickedByUser(radioButton.value)\"\r\n >{{ radioButton.label }}\r\n </mat-radio-button>\r\n <ng-container *ngFor=\"let iconClass of radioButton?.iconClass\">\r\n <i\r\n class=\" {{ iconClass }}\"\r\n (click)=\"totalRowRadioButtonIconClickedByUser(radioButton.value)\"\r\n ></i\r\n ></ng-container>\r\n <br *ngIf=\"!last\" />\r\n </ng-container>\r\n </mat-radio-group>\r\n </ng-container>\r\n <ng-container *ngIf=\"column['isActionColumn']\">\r\n <a\r\n *ngFor=\"let data of column.actionData\"\r\n [class]=\"data.class\"\r\n (click)=\"onClickableDataClicked({}, data.id)\"\r\n >\r\n {{ data.name }}\r\n </a>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"column['isIconColumn']\">\r\n <i\r\n class=\"{{ column?.iconData?.class }}\"\r\n (click)=\"iconClickedInTotalRow(column?.colName)\"\r\n >\r\n </i>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!column['isActionColumn']\">\r\n <strong class=\"upper-label\"\r\n >{{ column.data }}\r\n <span\r\n class=\"red-text-totol-row\"\r\n *ngIf=\"column.additionalRedTextAfterData\"\r\n >{{ column.additionalRedTextAfterData }}</span\r\n ></strong\r\n >\r\n <ng-container *ngIf=\"column.lowerData\">\r\n <p\r\n *ngIf=\"\r\n column.colName === 'total-potential-booked-unit' &&\r\n gtGeneralConfig.component === 'RATING';\r\n else columnLowerData\r\n \"\r\n class=\"clickable-data\"\r\n (click)=\"spotDetailsDownloadClicked('TOTALROW')\"\r\n [ngClass]=\"{\r\n 'disabled-clickable-data': downloadInProgress || column.lowerData === '0'\r\n }\"\r\n >\r\n {{ column.lowerData }}\r\n <span class=\"material-icons mdi mdi-download spot-details-download-icons\"></span>\r\n <ng-container *ngIf=\"downloadInProgress && selectedRowTypeForDownload === 'TOTALROW'\">\r\n <ng-container [ngTemplateOutlet]=\"circularProgressBar\"></ng-container>\r\n </ng-container>\r\n </p>\r\n <ng-template #columnLowerData>\r\n <p class=\"lower-label\">{{ column.lowerData }}</p>\r\n </ng-template>\r\n </ng-container>\r\n <ng-container *ngIf=\"column.tooltipMessage && gtGeneralConfig.component !== 'LUR_VIOLATIONS'\">\r\n <i\r\n class=\"{{ column.tooltipIconClass }}\"\r\n container=\"body\"\r\n [ngbTooltip]=\"column.tooltipMessage\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"top bottom\"\r\n ></i>\r\n </ng-container>\r\n <ng-container *ngIf=\"gtGeneralConfig.component === 'LUR_VIOLATIONS' && column.tooltipMessage\">\r\n <i\r\n class=\"mi mdi-info-outline info-label\"\r\n container=\"body\"\r\n [ngbTooltip]=\"lurViolationTotalRowToolTip\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"bottom\"\r\n ></i>\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"gtGeneralConfig?.hasMultipleTableHeaderRows\">\r\n <ng-container\r\n [matColumnDef]=\"columnDef\"\r\n *ngFor=\"\r\n let columnDef of modifiedExtraHeaderRowForAdjustingColumnWidths.objectKeys;\r\n let i = index;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <th\r\n #tableHeader\r\n nowrap\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [style.width]=\"modifiedExtraHeaderRowForAdjustingColumnWidths.widths[i]\"\r\n ></th\r\n ></ng-container>\r\n ></ng-container\r\n >\r\n\r\n <!-- MAIN ROW -->\r\n <ng-container\r\n [matColumnDef]=\"columnDef.headerInfo[0].objectKey\"\r\n *ngFor=\"let columnDef of tableHeaders; trackBy: trackByFn\"\r\n >\r\n <th\r\n #tableHeader\r\n nowrap\r\n mat-header-cell\r\n *matHeaderCellDef\r\n [style.width]=\"columnDef.width\"\r\n [attr.rowspan]=\"columnDef.rowspan ? columnDef.rowspan : 1\"\r\n [attr.colspan]=\"columnDef.colspan ? columnDef.colspan : 1\"\r\n >\r\n <div\r\n class=\"row mx-0\"\r\n [ngClass]=\"{ 'dummy-header': columnDef.dummyHeader }\"\r\n *ngFor=\"let header of columnDef.headerInfo; let j = index\"\r\n >\r\n <p\r\n *ngIf=\"header.typeOfHeaderData === 'STRING'\"\r\n [ngClass]=\"{ 'upper-label': j === 0, 'lower-label': j === 1 }\"\r\n >\r\n <ngx-skeleton-loader\r\n *ngIf=\"header.name == null\"\r\n count=\"1\"\r\n [theme]=\"{\r\n height: '10px',\r\n display: 'block',\r\n width: columnDef.width,\r\n 'max-width': 'calc(100% - 20px)'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <!-- <ng-container *ngIf=\"header.name\">\r\n {{ header.name }}\r\n </ng-container> -->\r\n <span [innerHTML]=\"header.name\"></span>\r\n <ng-container *ngIf=\"header.tooltip && header.tooltip.tooltipMessage\">\r\n <i\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"header.tooltip.tooltipMessage\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </ng-container>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'impsInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"impsInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"\r\n header.tooltip && header.tooltip.name === 'spotsColumnEquivalizationMessageTooltip'\r\n \"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"spotsColumnEquivalizationMessageTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'underDeliveryTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"underDeliveryTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'overDeliveryTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n container=\"body\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"overDeliveryTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'ratingInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"ratingInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'rateInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"rateInfoTooltip\"\r\n container=\"body\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'ongoingRevBookedColumnTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"ongoingRevBookedColumnTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'completedRevBookedColumnTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"completedRevBookedColumnTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedRate'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedRate\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedRtg'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedRtg\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'avgBookedImps'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"avgBookedImps\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'automationTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"automationTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'rebateImpact'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"rebateImpact\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'projectedImpsRtg'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"projectedImpsRtg\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </p>\r\n\r\n <ng-container *ngIf=\"header.typeOfHeaderData === 'CHECKBOX'\">\r\n <span\r\n *ngIf=\"gtGeneralConfig.isHeaderChecked\"\r\n class=\"mdi mdi-checkbox-marked custom-column-checkbox-checked\"\r\n (click)=\"selectUnselectAllRows()\"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!gtGeneralConfig.isHeaderChecked\"\r\n class=\"mdi mdi-checkbox-blank-outline custom-column-checkbox-unchecked\"\r\n [ngClass]=\"{ 'disable-checkbox': gtGeneralConfig.disableHeaderCheckbox }\"\r\n (click)=\"selectUnselectAllRows()\"\r\n >\r\n </span>\r\n </ng-container>\r\n\r\n <div\r\n *ngIf=\"gtGeneralConfig.showAllColumnFilter && header && header.typeOfHeaderData !== ''\"\r\n class=\"sort-filter-container\"\r\n >\r\n <ng-container *ngIf=\"header.showTooltipIcon\">\r\n <!-- Active tooltip Functionality -->\r\n <ng-container *ngIf=\"header.filter === 'CHECKBOX'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"filterTooltip\"\r\n placement=\"{{ filterAlignment }}\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-checkbox-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'SLIDER'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"sliderToolTip\"\r\n placement=\"bottom left-top\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-slider-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t1=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t1, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'DATE'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"datePickerTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-datepicker-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t2=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t2, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'WEEK'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"weekPickerToolTip\"\r\n placement=\"bottom left-top\"\r\n container=\"body\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t3=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t3, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n <ng-container *ngIf=\"header.filter === 'TIME'\">\r\n <span\r\n class=\"mdi mdi-filter-variant\"\r\n [ngClass]=\"{\r\n active:\r\n annaFilterService.isFilterSortActive &&\r\n annaFilterService.isFilterSortActive[header.joinedFilterSortObjectKeys],\r\n disabled: header.disableTooltipIcon || showSkeletonLoading\r\n }\"\r\n [ngbTooltip]=\"timeFilterToolTip\"\r\n placement=\"bottom left-top auto\"\r\n container=\"body\"\r\n tooltipClass=\"non-edit-time-tooltip\"\r\n [autoClose]=\"'outside'\"\r\n triggers=\"manual\"\r\n #t4=\"ngbTooltip\"\r\n (click)=\"bindTheValueToToolTip(t4, header)\"\r\n (hidden)=\"closeTooltip()\"\r\n >\r\n </span\r\n ><br />\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"!header.showTooltipIcon\">\r\n <span id=\"no-filter-space\"></span><br />\r\n </ng-container>\r\n <i\r\n *ngIf=\"header.tooltip && header.tooltip.name === 'lurViolationInfoTooltip'\"\r\n class=\"{{ header['tooltip'].iconClass }}\"\r\n [ngStyle]=\"{ float: header['tooltip'].iconPosition }\"\r\n #t=\"ngbTooltip\"\r\n container=\"body\"\r\n [ngbTooltip]=\"lurViolationInfoTooltip\"\r\n placement=\"{{ header['tooltip'].tooltipPosition }}\"\r\n tooltipClass=\"{{ header['tooltip'].tooltipClass }}\"\r\n >\r\n </i>\r\n </div>\r\n </div>\r\n </th>\r\n\r\n <ng-container *matCellDef=\"let ROW_DATA\">\r\n <td\r\n mat-cell\r\n [style.background]=\"ROW_DATA.backgroundColor\"\r\n [style.border]=\"ROW_DATA.border\"\r\n class=\"{{ ROW_DATA.rowClass }}\"\r\n [ngClass]=\"ROW_DATA[columnDef.headerInfo[0].objectKey + 'TdClass']\"\r\n [attr.rowspan]=\"tdsHaveRowSpan ? ROW_DATA[columnDef.headerInfo[0].objectKey + 'Rowspan'] : 1\"\r\n *ngIf=\"\r\n !hideSomeTds ||\r\n (hideSomeTds && !ROW_DATA['hide' + columnDef.headerInfo[0].objectKey + 'Td'])\r\n \"\r\n >\r\n <ngx-skeleton-loader\r\n *ngIf=\"showSkeletonLoading\"\r\n count=\"1\"\r\n [theme]=\"{ height: '10px', display: 'block', marginBottom: '0' }\"\r\n >\r\n </ngx-skeleton-loader>\r\n\r\n <ng-container *ngIf=\"!showSkeletonLoading\">\r\n <ng-container *ngIf=\"tableData.length > 0 && (isNoDataToDisplaySubject$ | async) === false\">\r\n <ng-container\r\n *ngFor=\"\r\n let subline of columnDef.headerInfo;\r\n let subLineIndex = index;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <div\r\n annaCoreShowEllipsisTextOnHover\r\n [includeFullWidth]=\"\r\n columnDef.headerInfo[subLineIndex].typeOfBodyData !== 'RADIO'\r\n \"\r\n [class]=\"columnDef.headerInfo[subLineIndex]?.tdCellClass\"\r\n >\r\n <ng-container [ngSwitch]=\"columnDef.headerInfo[subLineIndex].typeOfBodyData\">\r\n <ng-container *ngSwitchCase=\"'ICON'\">\r\n <i\r\n *ngIf=\"\r\n !(\r\n starredInProgress &&\r\n ROW_DATA.orderId === selectedStarredOrderId\r\n )\r\n \"\r\n [class]=\"ROW_DATA.iconClass\"\r\n [ngClass]=\"{ 'disabled-starring': starredInProgress }\"\r\n (click)=\"iconClicked(ROW_DATA, ROW_DATA.iconClass)\"\r\n ngbTooltip=\"{{ ROW_DATA.iconTitleText }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n ></i>\r\n <ng-container\r\n *ngIf=\"\r\n starredInProgress && ROW_DATA.orderId === selectedStarredOrderId\r\n \"\r\n >\r\n <div\r\n class=\"spinner-for-button-directive\"\r\n [ngClass]=\"{ 'disabled-starring': starredInProgress }\"\r\n ></div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'ICON_CELL'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <ng-container *ngIf=\"action.showObjectKey\">\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </ng-container>\r\n\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action.tooltipClass\r\n }}\"\r\n [ngbTooltip]=\"\r\n action.showTooltip && action?.tooltipData\r\n ? tipContent\r\n : null\r\n \"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!action.showTooltip\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action.tooltipData\"></div\r\n ></ng-template>\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'HTML_STRING'\">\r\n <p\r\n [innerHTML]=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n (click)=\"innerHTMLCellClicked($event, ROW_DATA)\"\r\n ></p>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'HTML_STRING_AND_CLICKABLE_DATA'\">\r\n <ng-container\r\n *ngFor=\"\r\n let text of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n *ngIf=\"text.showText\"\r\n [innerHtml]=\"text.innerHTMLText\"\r\n ></span>\r\n\r\n <a\r\n *ngIf=\"text.showLink\"\r\n class=\"view-link\"\r\n [class]=\"text.class\"\r\n (click)=\"onClickableDataClicked(ROW_DATA, text.id)\"\r\n >{{ text.linkName }}\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SVG_ICON'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ];\r\n let isLast = last\r\n \"\r\n >\r\n <span\r\n class=\"pr-4\"\r\n *ngIf=\"action?.showObjectKey\"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n class=\"pr-4 {{ action?.additionalTextClass }}\"\r\n *ngIf=\"action?.additionalText\"\r\n >\r\n {{ action?.additionalText }}\r\n </span>\r\n\r\n <anna-core-icon-column\r\n [ngClass]=\"{ 'pr-4': !isLast }\"\r\n *ngIf=\"action?.svgOrIconName\"\r\n [componentName]=\"gtGeneralConfig.component\"\r\n [dataObject]=\"ROW_DATA\"\r\n [iconToShow]=\"action.svgOrIconName\"\r\n data-html=\"true\"\r\n [ngbTooltip]=\"tipContent\"\r\n [disableTooltip]=\"!action?.svgOrIconTooltipMsg\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n (columnIconClicked)=\"\r\n svgIconClicked(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n )\r\n \"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action?.svgOrIconTooltipMsg\"></div\r\n ></ng-template>\r\n </anna-core-icon-column>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'TEXT_ACTIONS'\">\r\n <ng-container\r\n *ngFor=\"\r\n let text of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <button\r\n *ngIf=\"text.showTooltip\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n text.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disabled]=\"text.isDisabled\"\r\n class=\"{{ text.class }}\"\r\n (mouseenter)=\"\r\n mouseEnterOnTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n [ngbTooltip]=\"textActionTooltipTemplate\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n >\r\n {{ text.name }}\r\n </button>\r\n\r\n <button\r\n *ngIf=\"!text.showTooltip\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n text.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disabled]=\"text.isDisabled\"\r\n class=\"{{ text.class }}\"\r\n >\r\n {{ text.name }}\r\n </button>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'CHECKBOX'\">\r\n <span\r\n *ngIf=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n class=\"mdi mdi-checkbox-marked custom-column-checkbox-checked\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n false\r\n )\r\n \"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n class=\"mdi mdi-checkbox-blank-outline custom-column-checkbox-unchecked\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n true\r\n )\r\n \"\r\n >\r\n </span>\r\n\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionTypeContainingTable(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"tooltip-containing-table remove-on-scroll-class\"\r\n ngbTooltip=\"tooltipContainingTableTemplate\"\r\n >\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'CLICKABLE_DATA'\">\r\n <a\r\n *ngFor=\"\r\n let text of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n [class]=\"text.class\"\r\n (click)=\"onClickableDataClicked(ROW_DATA, text.id)\"\r\n >{{ text.name }}</a\r\n >\r\n <span\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedUnits' &&\r\n gtGeneralConfig.component === 'RATING'\r\n \"\r\n class=\"clickable-data\"\r\n (click)=\"spotDetailsDownloadClicked('DATAROW', ROW_DATA)\"\r\n [ngClass]=\"{\r\n 'disabled-clickable-data':\r\n downloadInProgress || ROW_DATA.displayBookedUnits === '-'\r\n }\"\r\n >{{ ROW_DATA.displayBookedUnits }}\r\n <span\r\n class=\"material-icons mdi mdi-download spot-details-download-icons\"\r\n ></span>\r\n <ng-container\r\n *ngIf=\"\r\n downloadInProgress &&\r\n ROW_DATA.ProgramId === selectedProgramIdForDownload &&\r\n ROW_DATA.Demographic === selectedDemographicForDownload\r\n \"\r\n >\r\n <ng-container\r\n [ngTemplateOutlet]=\"circularProgressBar\"\r\n ></ng-container>\r\n </ng-container>\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING___ICON_OR_TEXT_ACTION'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n [class]=\"action.additionalTextBeforeLinkClass\"\r\n [innerHtml]=\"action.additionalTextBeforeLink\"\r\n ngbTooltip=\"{{ action.additionalTextBeforeLink }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n [disableTooltip]=\"!action.enableTooltipForAdditionalText\"\r\n ></span>\r\n\r\n <ng-container *ngIf=\"action && action.typeOfData === 'STRING'\">\r\n <span\r\n class=\"text-with-icon-and-text\"\r\n [ngClass]=\"{ 'reduced-width': action.showIcon }\"\r\n annaCoreShowEllipsisTextOnHover\r\n >{{ action.data }}</span\r\n >\r\n </ng-container>\r\n\r\n <a\r\n [id]=\"action.id\"\r\n *ngIf=\"action.showLink\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [class]=\"action.linkClass\"\r\n [ngClass]=\"{ disabled: action.disabledLink }\"\r\n >{{ action.data }}</a\r\n >\r\n <span\r\n ngbTooltip=\"{{ action.additionalTextAfterLink }}\"\r\n placement=\"bottom\"\r\n container=\"body\"\r\n [class]=\"action.additionalTextAfterLinkClass\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n [disableTooltip]=\"!action.enableTooltipForAdditionalAfterText\"\r\n >\r\n {{ action.additionalTextAfterLink }}\r\n </span>\r\n\r\n <ng-container *ngIf=\"action.showTooltip\">\r\n <ng-container *ngIf=\"action.tooltipData.innerHtml\">\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionTypeContainingTable(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"tooltip-containing-table remove-on-scroll-class\"\r\n [ngbTooltip]=\"tooltipContainingTableTemplate\"\r\n >\r\n </i>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!action.tooltipData.tooltipTableBody\">\r\n <span\r\n *ngIf=\"action.showIcon\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n class=\"icon-tooltip-text\"\r\n (click)=\"\r\n iconClickedOnStringIconActionType(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n (mouseleave)=\"mouseLeaveTextActionType(ROW_DATA)\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n [placement]=\"\r\n action.tooltipPlacement\r\n ? action.tooltipPlacement\r\n : 'bottom auto'\r\n \"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action.tooltipClass\r\n }}\"\r\n [ngbTooltip]=\"userLoggedInDetails\"\r\n >\r\n <i [class]=\"action.iconClass\"> </i>\r\n {{ action.additionalTextAfterIcon ?? \"\" }}\r\n </span>\r\n <ng-container *ngIf=\"action['showSvgIcon']\">\r\n <anna-core-anna-est-icon-template\r\n class=\"float-right\"\r\n *ngIf=\"action['svgIconName'] === 'anna-icon'\"\r\n (mouseleave)=\"mouseLeaveTextActionType(ROW_DATA)\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex]\r\n .tooltipKey\r\n )\r\n \"\r\n [placement]=\"\r\n action.tooltipPlacement\r\n ? action.tooltipPlacement\r\n : 'bottom auto'\r\n \"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n action['tooltipClass']\r\n }}\"\r\n [ngbTooltip]=\"userLoggedInDetails\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n >\r\n </anna-core-anna-est-icon-template>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!action.showTooltip\">\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n [ngClass]=\"{ disabled: action.disabledIcon }\"\r\n (click)=\"\r\n iconClickedOnStringIconActionType(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n >\r\n </i>\r\n </ng-container>\r\n\r\n <i\r\n *ngIf=\"action.showSimpleIcon\"\r\n [class]=\"action.iconClass\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"\r\n action?.tooltipDataForSimpleIcon ? tipContent : null\r\n \"\r\n (click)=\"\r\n iconClickedOnStringIconActionType(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!action.tooltipDataForSimpleIcon\"\r\n >\r\n <ng-template #tipContent>\r\n <div\r\n class=\"p-8\"\r\n [innerHTML]=\"action.tooltipDataForSimpleIcon\"\r\n ></div\r\n ></ng-template>\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_OR_INPUT'\">\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.type ===\r\n 'STRING';\r\n else inputBox\r\n \"\r\n >\r\n <span\r\n [innerHtml]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.value\r\n \"\r\n ></span>\r\n </ng-container>\r\n\r\n <ng-template #inputBox>\r\n <span class=\"input-box-container\">\r\n <input\r\n placeholder=\"{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.placeholder\r\n }}\"\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .className\r\n }}\"\r\n (keydown)=\"\r\n changesMadeInEditableInputBox(\r\n $event,\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n false\r\n )\r\n \"\r\n (paste)=\"\r\n changesMadeInEditableInputBox(\r\n $event,\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n true\r\n )\r\n \"\r\n (ngModelChange)=\"\r\n editableInputValueChanged(\r\n $event,\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n )\r\n \"\r\n [ngModel]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .value\r\n \"\r\n [disabled]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .disabled\r\n \"\r\n [ngClass]=\"{\r\n 'red-border':\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ].hasError\r\n }\"\r\n />\r\n\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ];\r\n let isLast = last\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action?.showIcon\"\r\n container=\"body\"\r\n [ngbTooltip]=\"tipContent\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"bottom\"\r\n class=\"{{ action?.iconClass }}\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"action?.iconTooltip\"></div\r\n ></ng-template>\r\n </i>\r\n <ng-container *ngIf=\"action?.showSvgIcon\">\r\n <anna-core-icon-column\r\n [ngClass]=\"{ 'pr-4': !isLast }\"\r\n *ngIf=\"action?.svgOrIconName\"\r\n [componentName]=\"gtGeneralConfig.component\"\r\n [dataObject]=\"ROW_DATA\"\r\n [iconToShow]=\"action?.svgOrIconName\"\r\n data-html=\"true\"\r\n [ngbTooltip]=\"tipContent\"\r\n placement=\"auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n >\r\n <ng-template #tipContent>\r\n <div\r\n [innerHTML]=\"action?.svgOrIconTooltipMsg\"\r\n ></div></ng-template\r\n ></anna-core-icon-column>\r\n </ng-container>\r\n <ng-container *ngIf=\"action?.showLink\">\r\n <a\r\n [id]=\"action?.id\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action?.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [class]=\"action.linkClass\"\r\n >{{ action?.linkText }}\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </span>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'HTML'\">\r\n <span\r\n [innerHtml]=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n ></span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SINGLE_SELECT_DROPDOWN'\">\r\n <ng-container\r\n *ngFor=\"\r\n let dropdown of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ];\r\n let dropdownIndex = index\r\n \"\r\n >\r\n <anna-core-single-select\r\n class=\"gt-single-select dropdown {{ dropdown?.className }}\"\r\n [ngClass]=\"{ error: !dropdown?.selectedItem }\"\r\n [items]=\"dropdown?.itemList\"\r\n [selectedItem]=\"dropdown?.selectedItem\"\r\n [disabled]=\"dropdown.isDisabled\"\r\n [config]=\"dropdown?.dropdownConfig\"\r\n (valueChanged)=\"\r\n onDropdownChanged($event, ROW_DATA, dropdownIndex)\r\n \"\r\n >\r\n </anna-core-single-select>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SINGLE_SELECT_DROPDOWN_AND_ICON'\">\r\n <ng-container\r\n *ngFor=\"\r\n let dropdown of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ];\r\n let dropdownIndex = index\r\n \"\r\n >\r\n <div [ngClass]=\"{ 'icon-dropdown': dropdown.showIcon }\">\r\n <anna-core-single-select\r\n class=\"gt-single-select dropdown {{ dropdown?.className }}\"\r\n [ngClass]=\"{ error: !dropdown?.selectedItem }\"\r\n [items]=\"dropdown?.itemList\"\r\n [selectedItem]=\"dropdown?.selectedItem\"\r\n [config]=\"dropdown?.dropdownConfig\"\r\n (valueChanged)=\"\r\n onDropdownChanged($event, ROW_DATA, dropdownIndex)\r\n \"\r\n >\r\n </anna-core-single-select>\r\n <i\r\n *ngIf=\"dropdown.showIcon\"\r\n [class]=\"dropdown.iconClass\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class {{\r\n dropdown.tooltipClass\r\n }}\"\r\n [ngbTooltip]=\"\r\n dropdown.showTooltip && dropdown?.tooltipData\r\n ? tipContent\r\n : null\r\n \"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n dropdown.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!dropdown.showTooltip\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"dropdown.tooltipData\"></div\r\n ></ng-template>\r\n </i>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'SINGLE_RADIO'\">\r\n <span\r\n *ngIf=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n class=\"mdi mdi-radiobox-marked\"\r\n (click)=\"(null)\"\r\n >\r\n </span>\r\n <span\r\n *ngIf=\"!ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\"\r\n class=\"mdi mdi-radiobox-blank\"\r\n [ngClass]=\"{\r\n 'disable-checkbox':\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].isDisabledKey]\r\n }\"\r\n (click)=\"\r\n selectOrUnselectCheckbox(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n true\r\n )\r\n \"\r\n >\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'RADIO'\">\r\n <mat-radio-group\r\n *ngIf=\"ROW_DATA['RadioButtonConfig']; else showHyphen\"\r\n [ngModel]=\"ROW_DATA[subline.objectKey]\"\r\n [disabled]=\"ROW_DATA['RadioButtonConfig'][0].isDisabled\"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let radioButton of ROW_DATA['RadioButtonConfig'];\r\n let last = last\r\n \"\r\n >\r\n <mat-radio-button\r\n value=\"{{ radioButton.value }}\"\r\n class=\"{{ radioButton.class }}\"\r\n (click)=\"\r\n radioButtonClicked(\r\n ROW_DATA,\r\n radioButton.value,\r\n ROW_DATA['RadioButtonConfig'][0].isDisabled\r\n )\r\n \"\r\n >{{ radioButton.label }}\r\n </mat-radio-button>\r\n <ng-container *ngIf=\"radioButton.icons\">\r\n <i\r\n *ngFor=\"let icon of radioButton.icons\"\r\n class=\" {{ icon.class }}\"\r\n (click)=\"radioButtonIconClicked(ROW_DATA, icon.name)\"\r\n ></i>\r\n </ng-container>\r\n\r\n <i\r\n *ngIf=\"radioButton.tooltipMessage\"\r\n class=\"mi mdi-info-outline\"\r\n [ngbTooltip]=\"radioButton.tooltipMessage\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class\"\r\n ></i>\r\n <br *ngIf=\"!last\" />\r\n </ng-container>\r\n </mat-radio-group>\r\n <ng-template #showHyphen> - </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_TOOLTIP'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span class=\"action-data\"> {{ action?.dataToDisplay }}</span>\r\n <ng-container *ngIf=\"action?.additionalTextWoTooltip\">\r\n <span\r\n class=\"additional-text-wo-tooltip\"\r\n [innerHtml]=\"action.additionalTextWoTooltip\"\r\n >\r\n </span>\r\n </ng-container>\r\n <span\r\n *ngIf=\"action?.showTooltip\"\r\n [ngbTooltip]=\"stringWithTooltipTemplate\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringWithTooltipTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey,\r\n tooltipWithStringRef\r\n )\r\n \"\r\n [placement]=\"action?.tooltipPosition\"\r\n container=\"body\"\r\n [class]=\"action?.tooltipIconClass\"\r\n [autoClose]=\"'outside'\"\r\n [triggers]=\"action.isManualTrigger ? 'manual' : 'hover focus'\"\r\n #tooltipWithStringRef=\"ngbTooltip\"\r\n tooltipClass=\"gt-icon-column-tooltip remove-on-scroll-class {{\r\n action?.tooltipInnerClass\r\n }}\"\r\n [disableTooltip]=\"action?.disableTooltip\"\r\n >\r\n </span>\r\n <span>{{ action?.dataToDisplayAfterTooltip }}</span>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_ELLIPSIS_WITH_TABLE_TOOLTIP'\">\r\n <div class=\"new-ellipsis-container\">\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"cell-value\"\r\n >\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .cellValue\r\n }}\r\n </span>\r\n <span\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.showTooltip\r\n \"\r\n class=\"tooltip-text\"\r\n [ngbTooltip]=\"tableInsideTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n triggers=\"manual\"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"table-inside-tooltip remove-on-scroll-class {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.tooltipClass\r\n }}\"\r\n (mouseenter)=\"\r\n bindTheValueToTableTooltip(\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey],\r\n info\r\n )\r\n \"\r\n >\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.tooltipHoverText\r\n }}\r\n </span>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_ELLIPSIS_AND_READ_MORE_TOOLTIP'\">\r\n <span\r\n title=\"\"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length <\r\n 26\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n title=\"\"\r\n [ngbTooltip]=\"statusNoteTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n [triggers]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length >\r\n 100\r\n ? 'manual'\r\n : 'hover focus'\r\n \"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"status-note-tooltip\"\r\n (mouseenter)=\"\r\n bindTheValueToStatusNote(\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey],\r\n info,\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n )\r\n \"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].length >\r\n 25\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'STRING_WITH_TOOLTIP_INNER_HTML'\">\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"action-data\"\r\n [ngClass]=\"action?.showTooltip ? 'reduced-width-text' : ''\"\r\n >\r\n {{ action?.dataToDisplay }}</span\r\n >\r\n <span\r\n *ngIf=\"action?.showTooltip\"\r\n [ngbTooltip]=\"innerHtmlToolTipTemplate\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringWithInnerHtmlTooltipTextActionType(\r\n ROW_DATA,\r\n action,\r\n tooltipWithInnerHtmlRef,\r\n !action.isManualTrigger\r\n )\r\n \"\r\n [placement]=\"action?.tooltipPosition\"\r\n container=\"body\"\r\n [class]=\"\r\n 'innrHtml-tooltip-icon-marker ' + action?.tooltipIconClass\r\n \"\r\n [autoClose]=\"'outside'\"\r\n [triggers]=\"action.isManualTrigger ? 'manual' : 'hover focus'\"\r\n #tooltipWithInnerHtmlRef=\"ngbTooltip\"\r\n tooltipClass=\"gt-icon-innerHtml-tooltip remove-on-scroll-class {{\r\n action?.tooltipInnerClass\r\n }}\"\r\n [disableTooltip]=\"action?.disableTooltip\"\r\n >\r\n {{ action.tooltipMarkerText }}\r\n </span>\r\n <span *ngIf=\"action?.dataToDisplayAfterTooltip\">\r\n {{ action?.dataToDisplayAfterTooltip }}\r\n </span>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngSwitchCase=\"\r\n 'ICON_CELL_AND_STRING_WITH_ELLIPSIS_AND_READ_MORE_TOOLTIP'\r\n \"\r\n >\r\n <ng-container\r\n *ngFor=\"\r\n let action of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].actionKey\r\n ]\r\n \"\r\n >\r\n <i\r\n *ngIf=\"action.showIcon\"\r\n [class]=\"action.iconClass\"\r\n title=\"\"\r\n (mouseenter)=\"\r\n mouseEnterOnStringTextActionType(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].tooltipKey\r\n )\r\n \"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n tooltipClass=\"team-user-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"action.showTooltip ? action.tooltipData : null\"\r\n (click)=\"\r\n textActionClicked(\r\n ROW_DATA,\r\n action.id,\r\n columnDef.headerInfo[subLineIndex]\r\n )\r\n \"\r\n [disableTooltip]=\"!action.showTooltip\"\r\n >\r\n </i>\r\n\r\n <ng-container *ngIf=\"action.showObjectKey\">\r\n <span\r\n title=\"\"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length < 26\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n\r\n <span\r\n title=\"\"\r\n [ngbTooltip]=\"statusNoteTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n [triggers]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length > 100\r\n ? 'manual'\r\n : 'hover focus'\r\n \"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"status-note-tooltip\"\r\n (mouseenter)=\"\r\n bindTheValueToStatusNote(\r\n ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ],\r\n info\r\n )\r\n \"\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .length > 25\r\n \"\r\n >\r\n {{ ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey] }}\r\n </span>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'DIGIT_ONLY_INPUT'\">\r\n <input\r\n annaCoreDigitOnly\r\n [type]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].type\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .type\r\n : 'text'\r\n \"\r\n [decimal]=\"true\"\r\n [readOnly]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].disabled\r\n \"\r\n [decimalPlaces]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .decimalPlaces\r\n \"\r\n inputmode=\"numeric\"\r\n [min]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].min ||\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.min ===\r\n 0\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].min\r\n : digitInputmin\r\n \"\r\n [max]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].max ||\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]?.max ===\r\n 0\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].max\r\n : digitInputMax\r\n \"\r\n [allowPaste]=\"false\"\r\n class=\"form-control\"\r\n [value]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].value\r\n \"\r\n [placeholder]=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .placeholder\r\n ? ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .placeholder\r\n : 'Enter value'\r\n \"\r\n (input)=\"\r\n onInputChange(\r\n ROW_DATA,\r\n columnDef.headerInfo[subLineIndex].objectKey,\r\n $event\r\n )\r\n \"\r\n />\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'TIME_INPUT'\">\r\n <div\r\n *ngIf=\"\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .showAsInput;\r\n else timeAsString\r\n \"\r\n class=\"time-selected-div {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].class\r\n }}\"\r\n [ngbTooltip]=\"timeInputTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"false\"\r\n triggers=\"manual\"\r\n #timeInputTooltipInRow=\"ngbTooltip\"\r\n (click)=\"\r\n timeInputTooltipClickedInTableBody(\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey],\r\n ROW_DATA\r\n );\r\n bindTheValueToTimeInputTooltip(timeInputTooltipInRow)\r\n \"\r\n >\r\n <div class=\"time-selection-menu\">\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .selectedTimeAsAString\r\n }}\r\n <i\r\n *ngIf=\"\r\n !timeTableRowtooltip ||\r\n !selectedRowForTimeEdit ||\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.id !==\r\n selectedRowForTimeEdit[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ]?.id\r\n \"\r\n class=\"mdi mdi-menu-down icon\"\r\n ></i>\r\n <i\r\n *ngIf=\"\r\n timeTableRowtooltip &&\r\n selectedRowForTimeEdit &&\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n ?.id ===\r\n selectedRowForTimeEdit[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ]?.id\r\n \"\r\n class=\"mdi mdi-menu-up icon\"\r\n ></i>\r\n </div>\r\n </div>\r\n <ng-template #timeAsString>\r\n {{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n .selectedTimeAsAString\r\n }}\r\n </ng-template>\r\n <ng-container\r\n *ngIf=\"ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey].icons\"\r\n >\r\n <i\r\n *ngFor=\"\r\n let icon of ROW_DATA[\r\n columnDef.headerInfo[subLineIndex].objectKey\r\n ].icons\r\n \"\r\n container=\"body\"\r\n [ngbTooltip]=\"tipContent\"\r\n tooltipClass=\"gt-total-row-tooltip\"\r\n placement=\"bottom\"\r\n class=\"{{ icon.class }}\"\r\n >\r\n <ng-template #tipContent>\r\n <div [innerHTML]=\"icon?.tooltipMessage\"></div\r\n ></ng-template>\r\n </i>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container *ngIf=\"subline.objectKey !== 'description'\">\r\n <span annaCoreShowEllipsisTextOnHover>{{\r\n ROW_DATA[columnDef.headerInfo[subLineIndex].objectKey]\r\n }}</span>\r\n <!-- <i\r\n *ngIf=\"\r\n subline.objectKey === 'inventoryCode' &&\r\n ROW_DATA['isSellerGroup'] &&\r\n gtGeneralConfig.component === 'RATING'\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n [ngbTooltip]=\"sellerHierarchyTooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n triggers=\"manual\"\r\n (hidden)=\"closeTooltip()\"\r\n #info=\"ngbTooltip\"\r\n tooltipClass=\"hierarchy-tooltip remove-on-scroll-class\"\r\n (mouseenter)=\"\r\n bindTheValueToSellerGroupTooltip(\r\n ROW_DATA.sellerGroupHierarchy,\r\n info\r\n )\r\n \" \r\n >\r\n </i>-->\r\n\r\n <i\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedAverageRating' &&\r\n gtGeneralConfig.component === 'RATING' &&\r\n ROW_DATA['showRatingAverageIcon']\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n (mouseenter)=\"\r\n setIsDifference(ROW_DATA.isDifferenceLessThan25Percent)\r\n \"\r\n tooltipClass=\"posted-avg-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"postedRatingDifference\"\r\n >\r\n </i>\r\n\r\n <i\r\n *ngIf=\"\r\n subline.objectKey === 'displayBookedAverageImpression' &&\r\n gtGeneralConfig.component === 'RATING' &&\r\n ROW_DATA['showImpressionAverageIcon']\r\n \"\r\n class=\"mi mdi-info-outline seller-tooltip\"\r\n placement=\"bottom auto\"\r\n container=\"body\"\r\n [autoClose]=\"true\"\r\n (mouseenter)=\"\r\n setIsDifference(ROW_DATA.isDifferenceLessThan25Percent)\r\n \"\r\n tooltipClass=\"posted-avg-tooltip remove-on-scroll-class\"\r\n [ngbTooltip]=\"postedImpDifference\"\r\n >\r\n </i>\r\n </ng-container>\r\n <ng-container *ngIf=\"subline.objectKey === 'description'\">\r\n <p\r\n *ngIf=\"\r\n ROW_DATA.descriptionMessage ||\r\n ROW_DATA.descriptionEmailReferenceNum\r\n \"\r\n >\r\n <ng-container *ngIf=\"ROW_DATA.descriptionMessage\">\r\n {{ ROW_DATA.descriptionMessage }}\r\n <br />\r\n </ng-container>\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA.descriptionEmailReferenceNum !== '-' &&\r\n ROW_DATA.descriptionEmailReferenceNum !== ''\r\n \"\r\n >\r\n Email Ref: {{ ROW_DATA.descriptionEmailReferenceNum }}\r\n <br />\r\n </ng-container>\r\n </p>\r\n <a\r\n href=\"{{ ROW_DATA.descriptionDetailsUrl }}\"\r\n target=\"_blank\"\r\n *ngIf=\"\r\n ROW_DATA.descriptionDetailsUrlType === 'PDF' ||\r\n ROW_DATA.descriptionDetailsUrlType === 'EXCEL'\r\n \"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn\">Download</button>\r\n </a>\r\n <ng-container\r\n *ngIf=\"\r\n ROW_DATA.activityname.toLowerCase() === 'order onboarded'\r\n \"\r\n >\r\n <a\r\n *ngIf=\"ROW_DATA.descriptionDetailsUrlType === 'LINK'\"\r\n (click)=\"viewDetailsClicked(ROW_DATA)\"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn order-onboarded\">\r\n View details\r\n </button>\r\n </a>\r\n </ng-container>\r\n\r\n <a\r\n href=\"{{ ROW_DATA.descriptionEmailUrl }}\"\r\n target=\"_blank\"\r\n *ngIf=\"\r\n ROW_DATA.descriptionEmailUrl !== '-' &&\r\n ROW_DATA.descriptionEmailUrl !== ''\r\n \"\r\n >\r\n <button class=\"btn viewDetailsAndEmailBtn\">View email</button>\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"isNoDataToDisplaySubject$ | async\">\r\n <div>\r\n {{ null }}\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n </table>\r\n </div>\r\n <anna-core-no-data-lib\r\n [width]=\"noDataWidth\"\r\n [marginTop]=\"marginTop\"\r\n *ngIf=\"isNoDataToDisplaySubject$ | async\"\r\n >\r\n </anna-core-no-data-lib>\r\n</div>\r\n\r\n<!-- Checkbox template -->\r\n<ng-template #filterTooltip>\r\n <anna-core-anna-column-checkbox-filter\r\n *ngIf=\"filterTabObjects\"\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-checkbox-filter>\r\n</ng-template>\r\n\r\n<!-- Slider template -->\r\n<ng-template #sliderToolTip>\r\n <anna-core-anna-column-slider-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-slider-filter>\r\n</ng-template>\r\n\r\n<!-- Date Picker Template -->\r\n<ng-template #datePickerTooltip>\r\n <anna-core-anna-column-date-range-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-date-range-filter>\r\n</ng-template>\r\n\r\n<!-- Week Picker Template -->\r\n<ng-template #weekPickerToolTip>\r\n <!-- <div class=\"weekpicker-container\">\r\n <anna-core-week-calendar-filter-lib\r\n [week-calendar-config]=\"gtGeneralConfig.multiWeekPickerConfig\"\r\n (apply)=\"applyWeekFilter($event)\"\r\n [from-date]=\"calendarMinEnabledDate\"\r\n [to-date]=\"calendarMaxEnabledDate\"\r\n >\r\n </anna-core-week-calendar-filter-lib>\r\n </div> -->\r\n</ng-template>\r\n\r\n<!-- Time Filter Template -->\r\n<ng-template #timeFilterToolTip>\r\n <anna-core-anna-column-time-filter\r\n [tableData]=\"tableData\"\r\n [showFilterHeaderTabs]=\"showFilterTooltipTabs\"\r\n [isLurAndCsrComponent]=\"false\"\r\n [showAllTimeRangeCheckboxes]=\"showCheckboxesForTimeFilter\"\r\n [clonedTableData]=\"clonedTableData\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n (filterAppliedToTable)=\"filterApplied($event)\"\r\n (sortingAppliedToTable)=\"sortingApplied($event)\"\r\n (closeTooltip)=\"closeTooltip()\"\r\n >\r\n </anna-core-anna-column-time-filter>\r\n</ng-template>\r\n\r\n<ng-template #timeInputTooltip>\r\n <anna-core-anna-column-time-filter\r\n [tableData]=\"timeInputData\"\r\n [clonedTableData]=\"timeInputData\"\r\n [showClearAllFilter]=\"false\"\r\n [startFromText]=\"'Start time'\"\r\n [endToText]=\"'End time'\"\r\n [filterTabObjects]=\"filterTabObjects\"\r\n [showAllTimeRangeCheckboxes]=\"false\"\r\n [isSortAndFilterAbsent]=\"true\"\r\n (closeTooltip)=\"closeTimeInputTooltip()\"\r\n (timeChanges)=\"timeSelectedInTableRow($event)\"\r\n >\r\n </anna-core-anna-column-time-filter>\r\n</ng-template>\r\n\r\n<ng-template #columnInfoTooltip>\r\n <p class=\"black-color-text white-space-nowrap\">This preemption is rejected and not marked for credit.</p>\r\n</ng-template>\r\n\r\n<ng-template #ratingInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked Rating' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected Rating' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #impsInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked IMPS' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected IMPS' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #spotsColumnEquivalizationMessageTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n This consists of equivalized spots and un-equivalized Paid Programs & un-equivalized Non-spots.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #underDeliveryTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n Indicates the Under-delivery percentage based on booked and posted RTG/IMPS.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #overDeliveryTooltip>\r\n <p class=\"spot-column-tooltip-message\">\r\n Indicates the Over-delivery percentage based on booked and posted RTG/IMPS.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #rateInfoTooltip>\r\n <p class=\"first-row\">Shows 'Booked Rate' for Preemptions & MakeGood Offered spot(s).</p>\r\n <p class=\"second-row\">Shows 'Projected $ Value' for ADU Offered spot(s).</p>\r\n</ng-template>\r\n\r\n<ng-template #sellerHierarchyTooltip>\r\n <ng-container *ngIf=\"sellerGroupHierarchy.length > 0\">\r\n <section class=\"hierarchy-table-container\">\r\n <table class=\"seller-hierarchy-table\">\r\n <thead>\r\n <tr>\r\n <th>#</th>\r\n <th>Inventory Codes</th>\r\n <th>Program/Description</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of sellerGroupHierarchy; let tooltipIndex = index\">\r\n <td>{{ tooltipIndex + 1 }}</td>\r\n <td>\r\n <span annaCoreShowEllipsisTextOnHover>{{ data.InventoryCode }}</span>\r\n </td>\r\n <td>\r\n <span annaCoreShowEllipsisTextOnHover>{{ data.Program }}</span>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </section>\r\n </ng-container>\r\n <ng-container *ngIf=\"sellerGroupHierarchy.length === 0\">\r\n <span class=\"black-color-text\">Seller group not available for this inventory code</span>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #tableInsideTooltip>\r\n <label class=\"ellipsis-tooltip-heading\">{{ ellipsisWithTooltipHeading }}</label>\r\n <section class=\"table-inside-tooltip-container\">\r\n <table class=\"ellipsis-tooltip-table\">\r\n <thead>\r\n <tr>\r\n <th\r\n [style.width]=\"header.width\"\r\n *ngFor=\"let header of ellipsisWithTooltipTableHeaders\"\r\n >\r\n <div>\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"upper-label\"\r\n >{{ header.headerName }}</span\r\n >\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of ellipsisWithTooltipTableData\">\r\n <td *ngFor=\"let header of ellipsisWithTooltipTableHeaders\">\r\n <div>\r\n <span\r\n annaCoreShowEllipsisTextOnHover\r\n class=\"upper-label\"\r\n >{{ data[header.objectKey] }}</span\r\n >\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #lurViolationInfoTooltip>\r\n <p class=\"first-row\">The values are for the entire week.</p>\r\n</ng-template>\r\n\r\n<ng-template #postedRatingDifference>\r\n <p class=\"difference-text\">\r\n The difference between posted and booked average rating is\r\n {{ isDifferenceLessThan25Percent ? \"less\" : \"more\" }} than 25%.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #postedImpDifference>\r\n <p class=\"difference-text\">\r\n The difference between posted and booked average impression is\r\n {{ isDifferenceLessThan25Percent ? \"less\" : \"more\" }} than 25%.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #ongoingRevBookedColumnTooltip>\r\n <p>The Booked $ value, Spots, GRP, CPP, IMPS, CPM corresponds on the last permanent revision generated</p>\r\n</ng-template>\r\n\r\n<ng-template #completedRevBookedColumnTooltip>\r\n <p>The Booked $ value corresponds on the last permanent revision generated</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedRate>\r\n <p>This is the booked average Rate</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedRtg>\r\n <p>This is the booked average RTG</p>\r\n</ng-template>\r\n\r\n<ng-template #avgBookedImps>\r\n <p>This is the booked average IMP(\u2019000)</p>\r\n</ng-template>\r\n\r\n<ng-template #projectedImpsRtg>\r\n <p>\r\n ANNA calculates projected RTG/IMPS values using either the computed estimates or the actual posted data,\r\n depending on what is available. If posted data has not yet been received, ANNA will use the computed estimates\r\n as the projected value. Once the actual posted data is received, the projection will automatically update to\r\n reflect the real, posted values. This ensures that projected data is always based on the most accurate and\r\n up-to-date information.\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #automationTooltip>\r\n <p>\r\n Please get the order business rules approved to automate the orders. Only for the automated orders, any approved\r\n MGs, ADUs, or credited spots on ANNA will be fed into the traffic system i.e. ANNA revisions.\r\n <!-- removed below line as part of enhancmennt in 14.0 releas -->\r\n <!-- Additionally, ANNA will only enter buyer revisions into traffic for the selected\r\n Medialine/WOC orders. -->\r\n </p>\r\n</ng-template>\r\n\r\n<ng-template #rebateImpact>\r\n <p>Rebate impact value is for the originally ordered spot length and is not equivalized.</p>\r\n</ng-template>\r\n\r\n<ng-template #lurViolationTotalRowToolTip>\r\n <ul>\r\n <li>\r\n <strong>POLITICAL RATE VIOLATIONS:</strong>\r\n Violations flagged when non-political spots are booked at a rate lower than the minimum booked rate for\r\n political candidates for the same week, Inventory Code and Revenue Class.\r\n </li>\r\n <li>\r\n <strong>CANDIDATE TO CANDIDATE VIOLATION:</strong>\r\n Violations flagged when political spots are booked at different rates to other political spots for the same\r\n week, Inventory Code and Revenue Class.\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #circularProgressBar>\r\n <anna-core-circular-progress\r\n [percent]=\"percentDone\"\r\n [radius]=\"5\"\r\n [outerStrokeWidth]=\"2\"\r\n [innerStrokeWidth]=\"2\"\r\n [outerStrokeColor]=\"'#268bff'\"\r\n [innerStrokeColor]=\"'#d5d5d5'\"\r\n [animationDuration]=\"500\"\r\n ></anna-core-circular-progress>\r\n</ng-template>\r\n\r\n<ng-template #userLoggedInDetails>\r\n <div class=\"tooltip-div-container\">\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n <span *ngIf=\"data.key !== 'read'\">\r\n {{ data.key }} <b>{{ data.value }}</b>\r\n </span>\r\n <span *ngIf=\"data.key === 'read'\">\r\n {{ data.value }}\r\n </span>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #markAsReadTip>\r\n <div class=\"notification-tooltip-div-container\">\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.value }}\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #textActionTooltipTemplate>\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.key }} <b>{{ data.value }}</b>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #programChangeTooltipTemplate>\r\n <div class=\"program-schedule-tooltip\">\r\n <h2>Program Change</h2>\r\n <p class=\"previous\">Previous:</p>\r\n <b annaCoreShowEllipsisTextOnHover>{{ textActionTooltip.OldProgramName }}</b>\r\n\r\n <p class=\"updated\">Updated:</p>\r\n <b\r\n *ngIf=\"textActionTooltip.NewProgramNames.length === 1\"\r\n annaCoreShowEllipsisTextOnHover\r\n >{{ textActionTooltip.NewProgramNames[0] }}</b\r\n >\r\n <ul *ngIf=\"textActionTooltip.NewProgramNames.length > 1\">\r\n <li *ngFor=\"let item of textActionTooltip.NewProgramNames\">\r\n <label class=\"dot\"></label>\r\n <span annaCoreShowEllipsisTextOnHover>{{ item }}</span>\r\n </li>\r\n </ul>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #showOrHideToggleForTotalRowTooltip>\r\n <div>\r\n {{ showOrHideToggleForTotalRow && !gtGeneralConfig.totalRow ? \"Show Total Row\" : \"Hide Total Row\" }}\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #tooltipContainingTableTemplate>\r\n <div\r\n *ngIf=\"tooltipContainingTable\"\r\n [innerHTML]=\"tooltipContainingTable.innerHtml\"\r\n class=\"notification-tooltip-div-container\"\r\n >\r\n <!-- <ul>\r\n <li *ngFor=\"let headerMsg of tooltipContainingTable.tableHeaderMsg\">\r\n <b> {{headerMsg}} </b>\r\n </li>\r\n </ul>\r\n\r\n <table class=\"tooltip-table\">\r\n <thead>\r\n <tr>\r\n <th *ngFor=\"let header of tooltipContainingTable.tooltipTableHeader\">\r\n {{ header}}\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let rows of tooltipContainingTable.tooltipTableBody\">\r\n <td *ngFor=\"let data of rows\">\r\n {{ data }}\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <ul>\r\n <li style=\"margin-top:10px; padding:0\" *ngFor=\"let footerMsg of tooltipContainingTable.tableFooterMsg\">\r\n {{ footerMsg }} \r\n </li>\r\n </ul> -->\r\n </div>\r\n</ng-template>\r\n<!-- <ng-template #textActionTooltipTemplate>\r\n <ng-container *ngFor=\"let data of textActionTooltip\">\r\n {{ data.key }} <b> {{data.value}}</b>\r\n </ng-container>\r\n</ng-template> -->\r\n\r\n<ng-template #statusNoteTooltip>\r\n <div>\r\n <span class=\"status-note-tooltip\">{{ statusNoteForTooltip }}</span>\r\n <span *ngIf=\"statusNoteForPopup.length > 100\"\r\n >...<a\r\n class=\"view-more-comments\"\r\n (click)=\"showEntireStatusNote()\"\r\n >View more</a\r\n ></span\r\n >\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #innerHtmlToolTipTemplate>\r\n <div [innerHtml]=\"toolTipInnerHtmlData\"></div>\r\n</ng-template>\r\n", styles: ["::ng-deep .show-or-hide-toggle-tooltip .tooltip-inner{max-width:229px}.show-or-hide-toggle-btn.shift-toggle-top-on-total-row-click{transform:translate(calc(var(--app-left-space-show-hide-total-row-icon) - 12px),32px)}.show-or-hide-toggle-btn{width:16px;height:16px;padding:0;margin:0;border-radius:50%;position:absolute;transform:translate(calc(var(--app-left-space-show-hide-total-row-icon) - 12px),52px);z-index:999;background-color:#d9d9d9}.show-or-hide-toggle-btn i.mdi.mdi-menu-swap{font-size:16px;display:flex}#generic-table-conatiner.table-with-show-hide-total-row-toggle .total-row td:nth-of-type(2){padding-left:16px!important}::ng-deep .gt-icon-innerHtml-tooltip .tooltip-inner{max-width:600px;width:min-content}::ng-deep .gt-icon-innerHtml-tooltip .tooltip-inner>div{width:max-content}::ng-deep .generic-innerHtml-table-heading{margin-bottom:2px;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a}::ng-deep .generic-innerHtml-table-container{max-height:8.75rem;width:min-content;overflow:auto}::ng-deep .generic-innerHtml-table-container table{table-layout:fixed;width:100%}::ng-deep .generic-innerHtml-table-container table thead tr th{background:#e9e9e9;height:22px;padding:3px 8px;position:sticky;top:0;cursor:default;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0;box-shadow:inset 1px -1px #d4d4d4,inset 0 1px #d4d4d4}::ng-deep .generic-innerHtml-table-container table thead tr th:last-of-type{box-shadow:inset 1px -1px #d4d4d4,inset -1px 1px #d4d4d4!important}::ng-deep .generic-innerHtml-table-container table tbody tr td{padding:3px 8px;width:100%;color:#000;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px;box-shadow:inset 1px -1px #d4d4d4}::ng-deep .generic-innerHtml-table-container table tbody tr td:last-of-type{box-shadow:inset 1px -1px #d4d4d4,inset -1px 0 #d4d4d4}::ng-deep .generic-innerHtml-table-container table tbody tr:first-of-type td{border-top:none}::ng-deep .generic-innerHtml-table-container::-webkit-scrollbar-track{margin-top:22px!important}.sort-btn{background:#fff;border:none;border-right:1px solid #1b88ff;text-decoration:underline;font-family:Roboto;font-size:var(--sort-label-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.07;letter-spacing:normal;color:#1b88ff;cursor:pointer;flex:1;text-align:center}.sort-btn:last-of-type{border-right:none}.sort-btn.active{color:#202b47;text-decoration:none}p.sort-container{margin-top:8px;padding-bottom:8px;border-bottom:1px solid #e6e6e6;margin-bottom:0;display:flex}::ng-deep .tooltip-inner{max-height:22rem;background-color:#fff;border:1px solid white;border-radius:5px;box-shadow:0 2px 2px #0000003d,0 0 2px #0000001f;max-width:251px;width:100%;padding:0!important}::ng-deep .tooltip-inner div.radio-container{flex-wrap:wrap}::ng-deep .md-drppicker{box-shadow:unset!important}::ng-deep .available{color:#999}::ng-deep .bs-tooltip-bottom .arrow:before{border-bottom-color:#fff!important}::ng-deep .bs-tooltip-left .arrow:before{border-left-color:#fff!important}::ng-deep .tooltip.show{opacity:1}.input{text-align:left;margin:5px 10px 5px 5px;display:flex;align-items:center;width:230px;white-space:nowrap}.data{color:#000;font-weight:700;margin-left:5px;margin-right:5px}span.data{display:inline-block;text-overflow:ellipsis;white-space:pre;width:100%;overflow:hidden}.check-box{font-size:14px;cursor:pointer;position:relative;top:-1px}span.mdi-filter.active{color:#000;opacity:1!important;pointer-events:all!important}p{margin-bottom:0;line-height:initial}span.mdi-filter{color:#cbcbcb}::ng-deep .ngx-slider-pointer{top:-5px!important;width:12px!important;height:12px!important;background:#bdbdbd!important;border:1px solid #ffffff!important;box-shadow:0 1px 3px #0000004d!important;border-radius:16px!important}input:focus{outline:none}input::placeholder{color:#c8c8c8}.cancel-btn{background:#c7e1ff;color:#268bff}.apply-btn{background:#268bff;color:#fff;margin-left:.3125rem}div.radio-container{display:flex;white-space:nowrap;justify-content:space-between;background-color:#f4f4f4;border-radius:.125rem;margin:.4375rem .4375rem .25rem}div.radio-container div{flex:1;width:50%}div.radio-container div.full-width{width:100%}div.radio-container input{position:relative;top:.125rem;margin-right:.25rem}div.radio-container label{font-family:Roboto;font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:0;color:#4a4a4a;margin:0;padding-left:.125rem}div.radio-container label:first-of-type{margin-right:.188rem}div.radio-container input[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;width:.9375rem;height:.9375rem;padding:.125rem;background-clip:content-box;border:.125rem solid #268bff;background-color:transparent;border-radius:50%}div.radio-container input[type=radio]:checked{background-color:#268bff}.checkbox-filter-buttons-container{padding:0 8px!important}.buttons-container{display:flex;margin:0px auto .4375rem;justify-content:center;padding:0 12px}.buttons-container .button{padding:0 10px;width:100%;margin:8px 0 0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.buttons-container button:last-of-type{background-color:#268bff;color:#fff;margin-left:.5rem}.buttons-container button.disabled{background:#bdbdbd;opacity:.5;color:#4a4a4a}.button{display:inline-block;margin:8px 4px 0 8px;padding:0 16px;border-radius:4px;text-align:center;outline:none;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.67;letter-spacing:normal;border:none;color:#268bff;background-color:#e5f1ff}.search-box{display:flex;align-items:center;color:#c8c8c8;border:1px solid #e6e6e6;border-radius:.125rem;margin:.25rem .4375rem .188rem;height:1.5rem;padding:.188rem 8px .188rem .5rem}.search-box .search-bar-close{margin-left:auto;float:right}.search-icon{margin:0 4px 0 0;font-size:var(--filter-search-icon-fs);color:#9b9b9b}.filter-icon{justify-content:right;margin-left:auto;color:#d4d4d4;color:#a1a1a1;font-size:16px;cursor:pointer}.data{margin:0 13px 0 8px;font-family:Roboto;font-size:var(--filter-checkbox-label-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.86;letter-spacing:\"\";color:#4a4a4a}.search-input{font-family:Roboto;font-size:var(--filter-search-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#c8c8c8;width:calc(100% - 38px);margin:1px 0 1px 2px;border:none;padding:0}.check-box{color:#268bff}.tooltip-data-container{overflow-y:scroll;max-height:8rem}.searchbar{width:100%;display:flex;justify-content:flex-end;align-items:flex-end}.clear-button{opacity:.5;font-family:Roboto;font-size:.9375rem;font-weight:500;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;text-decoration:underline;border:none;background-color:#fff;color:#4a4a4a;margin-left:.625rem;padding:0}.clear-button:focus{outline:none;box-shadow:none}.unchecked{color:#268bff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.3rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container p.input{margin-left:0}cdk-virtual-scroll-viewport.dropdown-data-container p.input span.mi{padding-left:.4375rem}cdk-virtual-scroll-viewport.dropdown-data-container p.input:hover{background-color:#ebebeb;cursor:pointer}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.188rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}section.min-maxContainer{display:flex;justify-content:center;margin-bottom:-.125rem;margin-top:.5rem;width:100%}section.min-maxContainer input{width:30%;height:1.5rem;border:1px solid lightgray;color:gray}section.min-maxContainer span{display:inline-block;padding-left:.5rem;padding-right:.5rem;position:relative;top:.3125rem;color:#666;font-size:var(--page-message-content-fs)}.time-container{width:100%;display:flex;padding:0 .75rem}.time-container input.form-control:disabled{background-color:#fff;width:2.813rem}.time-container input.numberInput:focus{box-shadow:none;border-color:#c2cfd6}.time-container .dot{color:#cbcbcb;position:relative;left:-7px;font-size:17px}.time-container div.arrow-container{flex-direction:column;display:flex;margin-top:.375rem;width:9px;height:18px;margin-right:.875rem}.time-container div.arrow-container i{color:#000;cursor:pointer;max-height:9px;font-size:20px;width:10px}.time-container div.arrow-container i:before{width:0;height:0;pointer-events:none;position:relative;left:-9px;top:-11px}.mdi-filter{cursor:pointer}.time-label-container{display:flex;justify-content:flex-start}.time-label-container label{margin-bottom:0;color:#4a4a4a;margin-top:.125rem;margin-left:.75rem;font-weight:700;font-size:var(--dropdown-label-fs)}.time-heading{color:#000;font-size:.8125rem;text-align:left;padding-left:.625rem;margin-top:.625rem;font-weight:700}.column-clear-all{width:94%;text-align:center;border:none;font-size:var(--filter-clear-select-btn-fs);background:none;text-decoration:underline;color:#268bff}.checkbox-container{display:flex;padding-inline:.625rem}.checkbox-container .data{text-align:left}.checkbox-container:first-of-type{margin-top:.625rem;font-weight:500}.column-clear-all{width:94%;text-align:center;border:none;background:none;text-decoration:underline;color:#268bff}.column-clear-all:disabled{opacity:.5;color:#4a4a4a;font-weight:400}.column-clear-all.align-center{text-align:center}span.mdi-filter-variant.disabled{pointer-events:none;opacity:.5}.datepicker-container{width:100%}span.mdi-filter-variant{color:#cbcbcb;cursor:pointer;font-size:.875rem}span.mdi-filter-variant.active{color:#000}p.filter-tab{font-family:Roboto;font-size:var(--filter-tab-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:normal;color:#1b88ff;border-radius:5px;background-color:#f4f4f4;padding-inline:8px;cursor:pointer;overflow:hidden;text-align:center;text-overflow:ellipsis;padding-block:3px}p.filter-tab.active{color:#fff;background-color:#1b88ff}button.filter-text-btn{background:#fff;text-decoration:underline;font-family:Roboto;font-size:var(--filter-clear-select-btn-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;border:none;color:#268bff;margin-inline:4px;margin-top:2px}button.filter-text-btn:disabled{color:#b1b1b1;cursor:not-allowed}::ng-deep .non-edit-datepicker-tooltip .tooltip-inner{max-width:310px!important;width:283px!important;overflow-y:initial!important;padding:0!important}input.slider-text::-webkit-outer-spin-button,input.slider-text::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input.slider-text{-moz-appearance:textfield}input.slider-text.red-border{border:1px solid #f44336!important}::ng-deep .checkbox-sort p.sort-container{margin-top:8px!important;padding-bottom:8px!important}i.mdi-close{cursor:pointer}i.mdi-close.disable-close-icon{pointer-events:none;cursor:not-allowed}input.error-border{border:1px solid #f44336!important}::ng-deep .non-edit-checkbox-tooltip .tooltip-inner{width:238px!important;padding:0!important}::ng-deep .non-edit-slider-tooltip .tooltip-inner{width:238px!important;padding:0!important}::ng-deep .non-edit-time-tooltip .tooltip-inner{width:250px!important;padding:0!important}::ng-deep .non-edit-time-tooltip.bs-tooltip-start{padding:.4rem}::ng-deep .non-edit-time-tooltip.bs-tooltip-start .tooltip-arrow{right:0;top:5px!important;width:var(--bs-tooltip-arrow-height);height:var(--bs-tooltip-arrow-width)}::ng-deep .non-edit-time-tooltip.bs-tooltip-start .tooltip-arrow:before{border-left-color:#fff;left:-1px;border-width:calc(var(--bs-tooltip-arrow-width) * .5) 0 calc(var(--bs-tooltip-arrow-width) * .5) var(--bs-tooltip-arrow-height)}::ng-deep .no-bottom-border p.sort-container{border-bottom:none!important}::ng-deep .ngx-slider-pointer-min:after{display:none}::ng-deep .ngx-slider-pointer-max:after{display:none}::ng-deep .ngx-slider span.ngx-slider-pointer{width:12px;height:12px;top:-5px;background-color:#bdbdbd}::ng-deep .ngx-slider span.ngx-slider-bar{height:3px;background:#ededed}::ng-deep .ngx-slider span.ngx-slider-selection{background:#bdbdbd}::ng-deep .ngx-slider span.ngx-slider-bubble{bottom:-22px;font-size:12px;color:#333}::ng-deep .show-min.ngx-slider span.ngx-slider-model-value{background:#fff;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003}::ng-deep .show-max.ngx-slider span.ngx-slider-model-high{background:#fff;box-shadow:none}::ng-deep .ngx-slider span.ngx-slider-combined{background:#fff;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003}::ng-deep .ngx-slider{top:10px!important;margin:5px 0 2px!important}::ng-deep .ngx-slider-animate{top:0!important}.sidebar-slider{margin-bottom:35px!important;margin-left:5px;margin-right:5px}.slider-placeholder{height:14px}::ng-deep .filter-calendar select.form-select:focus{border-color:#c2cfd6;box-shadow:none}::ng-deep .filter-calendar select.form-select{background-color:#fff}.no-data-case{padding-left:.4375rem!important;font-size:var(--filter-checkbox-label-fs)!important;margin-top:10px!important;cursor:pointer}.virtual-scroll-div{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.red-text-totol-row{color:#f44336!important}.icon-dropdown{display:flex;align-items:center;gap:3px}.check-mark,.unread-mark{cursor:pointer}.on-hover:hover .unread-mark,.notificationHover .check-mark{opacity:0;cursor:pointer}.on-hover:hover .check-mark{opacity:1;cursor:pointer}table{margin-bottom:0;table-layout:fixed;width:100%}:host ::ng-deep .gt thead{top:.1px!important;position:relative}:host ::ng-deep .gt .header-row th{border:none;background:#ededed;padding:2px 8px;line-height:normal;position:sticky;position:-webkit-sticky;top:0;box-shadow:inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row th .upper-label{font-family:Roboto;font-size:var(--table-header-fs);font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0}:host ::ng-deep .gt .header-row th .lower-label{font-family:Roboto;font-size:var(--table-header-fs);font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#a7a7a7;margin-bottom:0}:host ::ng-deep .gt .header-row th div.row{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;width:max-content}:host ::ng-deep .gt .header-row th div.dummy-header{justify-content:center;margin-left:50%!important;margin-right:50%!important;width:-webkit-fill-available}:host ::ng-deep .gt .header-row th div.sort-filter-container{display:flex;flex-wrap:nowrap;align-items:center;margin-left:.25rem;margin-right:auto}:host ::ng-deep .gt .header-row th span.mdi-filter-variant{font-size:13px!important;top:-1px!important;position:relative}:host ::ng-deep .gt .header-row th:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row th:last-of-type{box-shadow:inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4,inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt .header-row br{display:block;content:\"\";margin-top:-8px}:host ::ng-deep .gt tbody tr td{padding:2px 8px;border:none;box-shadow:inset 1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr td div:nth-child(1){color:#000;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:Roboto;font-size:var(--table-body-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}:host ::ng-deep .gt tbody tr td div:nth-child(2){color:#a7a7a7;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:Roboto;font-size:var(--table-body-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}:host ::ng-deep .gt tbody tr td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr td:last-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4}:host ::ng-deep .gt tbody tr br{display:block;content:\"\";margin-top:-8px}:host ::ng-deep .gt .custom-column-checkbox-checked,:host ::ng-deep .gt .custom-column-checkbox-unchecked{font-size:.875rem;cursor:pointer}:host ::ng-deep .gt .custom-column-checkbox-checked{color:#268bff}:host ::ng-deep .gt .custom-column-checkbox-unchecked{color:#2962ff}:host ::ng-deep .gt .cell-value{width:calc(100% - 24px)!important;display:inline-block;width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .gt .tooltip-text{color:#268bff;cursor:pointer;float:right}:host ::ng-deep .gt .time-selected-div{display:flex;align-items:center;column-gap:4px}:host ::ng-deep .gt .time-selected-div .time-selection-menu{border:solid 1px #b7b7b7;height:24px;text-overflow:ellipsis;padding:2px;width:99%}:host ::ng-deep .gt .time-selected-div .time-selection-menu i.mdi.mdi-menu-down,:host ::ng-deep .gt .time-selected-div .time-selection-menu i.mdi.mdi-menu-up{float:right;margin-left:auto}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td{box-shadow:inset 1px 0 #d4d4d4}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td:first-of-type{box-shadow:inset 1px 0 #d4d4d4}:host ::ng-deep .bottom-border .gt tbody tr:last-of-type td:last-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4}.table-container{overflow-x:auto;overflow-y:auto}.rowSelectCheckbox,#selectAllRowsCheckbox{cursor:pointer}.disable-checkbox{color:#dedede!important;pointer-events:none!important}.mdi-warning{color:#f3c639;font-size:16px;line-height:28px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{opacity:1}.redcolor-status{color:#c62a2a}#no-filter-space{width:.875rem}input.numberInput{margin-right:-.8125rem;padding:0 0 0 .625rem;height:1.875rem}.hidden{display:none}.visibility-collapse{visibility:collapse}.no-data-div{margin-top:2.5px}.no-data-div label{margin:0;width:auto;font-weight:500;background-color:#d3d3d3;padding:.3125rem 1.125rem;border-radius:.25rem}.column-values:nth-of-type(2){color:#a7a7a7!important}.custom-column-checkbox-checked,.custom-column-checkbox-unchecked{font-size:.875rem;cursor:pointer}.custom-column-checkbox-checked{color:#268bff}.custom-column-checkbox-unchecked{color:#2962ff}.time-filter-checkboxes>div>p{color:#151b1e}::ng-deep .margin-bottom-zero .mat-radio-label{margin-bottom:0}:host ::ng-deep mat-radio-group br{margin-top:0!important}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio__background{width:var(--mat-radio-size);height:var(--mat-radio-size)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio__inner-circle{border-width:calc(var(--mat-radio-size) / 2)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-form-field>label{margin:0 0 0 4px;padding:0;top:-2px;position:relative;font-size:var(--radio-button-label-fs)}:host ::ng-deep mat-radio-group mat-radio-button .mdc-radio--disabled+label{color:var(--primary-text-color-dark)!important}:host ::ng-deep mat-radio-group mat-radio-button.mat-mdc-radio-button .mdc-form-field .mdc-radio{padding:0}:host ::ng-deep mat-radio-group mat-radio-button .mdc-form-field>label{left:-94px;font-size:12px;color:#4a4a4a;position:relative}:host ::ng-deep mat-radio-group mat-radio-button .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:var(--mdc-radio-selected-icon-color)}::ng-deep .reject.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:#ff0}::ng-deep .reject.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:#ff0}::ng-deep .resubmit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:#ff0}::ng-deep .resubmit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:#ff0}::ng-deep .noAction.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:green}::ng-deep .noAction.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:green}::ng-deep .approve.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:green}::ng-deep .approve.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:green}::ng-deep .credit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{border-color:red}::ng-deep .credit.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle{background-color:red}::ng-deep .mat-radio-button.mat-radio-disabled .mat-radio-outer-circle{border-color:#00000061!important}::ng-deep .mat-radio-button.mat-radio-disabled.mat-radio-checked .mat-radio-inner-circle{background-color:#00000061!important}::ng-deep tr.white-background-row{background:#fff}::ng-deep tr.gray-background-row{background:#e9e9e980!important}.remarks-tooltip,.mdi-information,.mdi-information-outline,.seller-tooltip{font-size:.875rem;color:#268bff;position:relative;top:.1875rem;cursor:pointer}.seller-tooltip{top:-1px;float:right}::ng-deep .remarks-info-tooltip .tooltip-inner{max-width:19.25rem!important}.rating-icon,.lur-violation-icon{color:#268bff;cursor:pointer;position:relative;left:-2px}::ng-deep .rating-info-tooltip .tooltip-inner{max-width:800px!important}.spots-info-icon{color:#268bff;cursor:pointer;margin:1px 2px 0 -14px}.spots-info-icon-ol{color:#268bff;cursor:pointer;margin:1px 4px 0 -2px}::ng-deep .spot-info-tooltip .tooltip-inner{position:relative;max-width:220px!important;background:#fff;word-break:break-word;display:flex}::ng-deep .spot-info-tooltip-for-orderlisting-table .tooltip-inner{max-width:220px!important;background:#fff;word-break:break-word;display:flex}p.first-row{padding:.5rem .5rem 0;color:#000;white-space:nowrap;text-align:left}p.second-row{padding:2px .5rem .5rem;color:#000;white-space:nowrap;text-align:left}::ng-deep .gt-total-row-tooltip{opacity:1!important}::ng-deep .gt-total-row-tooltip .tooltip-inner{color:#000;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;background-color:#fff;padding:4px!important;width:100%;border-radius:2px!important}::ng-deep .gt-total-row-tooltip .arrow:before{border-top-color:#fff!important}.info-label{margin-left:4px;color:#268bff;vertical-align:text-top}::ng-deep .hierarchy-tooltip{max-width:fit-content;width:310px!important}::ng-deep .hierarchy-tooltip .tooltip-inner{padding:4px!important;max-width:22.75rem;max-height:11.25rem}table.seller-hierarchy-table{table-layout:fixed}table.seller-hierarchy-table tr th{font-family:Roboto;font-size:.75rem;font-weight:500;font-stretch:normal;font-style:normal;line-height:1.67;letter-spacing:normal;color:#5e5e5e;white-space:nowrap;background:#ededed;position:sticky;box-shadow:inset 0 1px #d4d4d4;top:0;z-index:1}table.seller-hierarchy-table tr th:nth-child(1){width:20px}table.seller-hierarchy-table tr th:first-of-type,table.seller-hierarchy-table tr td:first-of-type{width:30px;border-left:1px solid #d4d4d4}table.seller-hierarchy-table tr th:last-of-type,table.seller-hierarchy-table tr td:last-of-type{border-right:1px solid #d4d4d4;width:7.875rem!important}table.seller-hierarchy-table tr th:nth-of-type(2){width:7.75rem!important}table.seller-hierarchy-table tr td{font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;box-shadow:none!important;border-top:1px solid #d4d4d4;border-bottom:1px solid #d4d4d4}table.seller-hierarchy-table tr td:nth-of-type(2),table.seller-hierarchy-table tr td:nth-of-type(3){padding-top:.25rem}table.seller-hierarchy-table tr td span{display:inline-block;width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative}section.hierarchy-table-container,section.table-inside-tooltip-container{max-height:8.75rem;overflow:auto}section.hierarchy-table-container::-webkit-scrollbar-track{margin-top:1.5rem}section.table-inside-tooltip-container::-webkit-scrollbar-track{margin-top:1.1875rem}.difference-text{padding:.5rem;color:#000;text-align:left}::ng-deep .posted-avg-tooltip .tooltip-inner{width:13.8125rem!important}::ng-deep .drrBooked-info-tooltip{transform:translate(26px,6px)}::ng-deep .drrBooked-info-tooltip .tooltip-inner{max-width:307px!important;width:242px!important;background:#fff;word-break:break-word;display:flex;padding:4px!important;text-align:left}::ng-deep .drrBooked-info-tooltip .tooltip-inner p{color:#000}::ng-deep .drrBooked-info-tooltip .arrow:before{border-right-color:#fff!important}.clickable-data{cursor:pointer;color:#268bff!important;display:flex!important;align-items:center}.clickable-data .spot-details-download-icons{font-size:12px}.disabled-clickable-data{pointer-events:none;color:#d4d4d4!important}.spot-column-tooltip-message{color:#000;width:max-content;text-align:left}div.spinner-for-button-directive{position:relative;left:-1px}.clickable-row table tr.mat-row td{cursor:pointer!important}.tooltip-div-container{text-align:left!important;padding:8px 4px;color:#4a4a4a!important;font-size:11px!important;font-family:Roboto;font-size:11px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}.notification-tooltip-div-container{text-align:left!important;padding:6px 8px;color:#4a4a4a!important;font-size:12px!important;font-family:Roboto;font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}.mdi-information,.mdi-information-outline{left:3px;top:1px}.mdi-information-outline{position:static}::ng-deep .team-user-tooltip.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .team-user-tooltip.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .team-user-tooltip .tooltip-inner{opacity:1!important;width:fit-content!important;max-width:520px;border-radius:2px;padding:0 4px!important}::ng-deep .team-user-tooltip .tooltip-inner .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .team-user-tooltip .tooltip-inner.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .gt-icon-column-tooltip{opacity:1!important}::ng-deep .gt-icon-column-tooltip .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .gt-icon-column-tooltip.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .gt-icon-column-tooltip.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .gt-icon-column-tooltip .tooltip-inner{width:100%}.view-link{color:#268bff;padding:0;text-decoration:underline;border:none;background-color:inherit;cursor:pointer;letter-spacing:normal;font-weight:400;margin-left:3px}::ng-deep .tooltip-containing-table{opacity:1!important}::ng-deep .tooltip-containing-table .tooltip-inner{color:#4a4a4a;text-align:left;padding:8px!important;border-radius:2px;background:#fff!important;box-shadow:0 6px 10px #0000004d,0 2px 2px #0003;font-family:Roboto;font-size:var(--page-message-content-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal}::ng-deep .tooltip-containing-table.bs-tooltip-top .arrow:before{border-top:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-left .arrow:before{border-left:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-bottom .arrow:before{border-bottom:6px solid white}::ng-deep .tooltip-containing-table.bs-tooltip-right .arrow:before{border-right:5px solid white}::ng-deep .tooltip-containing-table li{margin:0!important;padding:0!important}::ng-deep .tooltip-containing-table ul{margin:0!important;padding-left:8px!important}::ng-deep .tooltip-containing-table ul.pl-16{padding-left:16px!important}::ng-deep .tooltip-containing-table .tooltip-inner{width:100%;max-width:230px}table.tooltip-table{table-layout:fixed;margin:4px 0 0;width:100%}table.tooltip-table th,table.tooltip-table td{padding:2px 8px;line-height:normal}table.tooltip-table thead tr th:first-of-type{box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4!important;border:none}table.tooltip-table thead tr th{color:#5e5e5e!important;font-size:12px;font-weight:500;font-family:Roboto;line-height:1.67;background-color:#ededed;border-top:none!important;border-bottom:none!important;outline:none!important;box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4}table.tooltip-table thead tr th div.row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}table.tooltip-table tbody tr td{color:#5e5e5e!important;font-size:12px;font-weight:500;font-family:Roboto;line-height:1.67}table.tooltip-table tbody tr td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}table.tooltip-table tbody tr td:nth-of-type(n+2){box-shadow:inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}.bottom-border{border-bottom:1px solid #d4d4d4!important}i.disabled{pointer-events:none!important}.black-color-text{color:#000}.white-space-nowrap{white-space:nowrap}.ellipsis-tooltip-heading{margin-bottom:2px;font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a}table.ellipsis-tooltip-table{table-layout:fixed;width:100%}table.ellipsis-tooltip-table thead th:first-of-type{box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4,inset 1px 0 #d4d4d4!important}table.ellipsis-tooltip-table thead th{background:#e9e9e9;padding:3px 8px;line-height:normal;position:sticky;top:0;cursor:default;box-shadow:inset 0 1px #d4d4d4,inset 0 -1px #d4d4d4,inset -1px 0 #d4d4d4}table.ellipsis-tooltip-table thead th .upper-label{font-family:Roboto;font-size:.6875rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:.3px;color:#4a4a4a;margin-bottom:0}table.ellipsis-tooltip-table tbody td{padding:3px 8px}table.ellipsis-tooltip-table tbody td .upper-label{width:100%;color:#000;text-overflow:ellipsis;overflow:hidden;display:inline-block;white-space:nowrap;font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:0px}table.ellipsis-tooltip-table tbody td:first-of-type{box-shadow:inset 1px 0 #d4d4d4,inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}table.ellipsis-tooltip-table tbody td:nth-of-type(n+2){box-shadow:inset -1px 0 #d4d4d4,inset 0 -1px #d4d4d4;border:none}.pr-4{padding-right:4px}.status-note-tooltip{font-family:Roboto;font-size:.75rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:14px;letter-spacing:normal;color:#4a4a4a;white-space:normal!important}.view-more-comments{display:block;color:#268bff;font-family:Roboto;font-size:.75rem;font-weight:700;font-stretch:normal;font-style:normal;line-height:14px;letter-spacing:normal;cursor:pointer;margin-left:2px}td.mat-column-isOrderStarred:has(.disabled-starring){pointer-events:none!important}td.mat-column-isOrderStarred .mdi.mdi-star.disabled-starring,td.mat-column-isOrderStarred .mdi.mdi-star-outline.disabled-starring{pointer-events:none!important;color:#dbdbdb80!important}table.disable-table-scrolling{overflow:hidden!important}.icon-tooltip-text{display:inline-block;color:#268bff}.text-with-icon-and-text.reduced-width{text-overflow:ellipsis;overflow:hidden;display:inline-block;max-width:calc(100% - 25px);margin-bottom:-3.5px}.innrHtml-tooltip-icon-marker{float:right;color:#268bff}.reduced-width-text{text-overflow:ellipsis;overflow:hidden;display:inline-block;max-width:calc(100% - 25px)}.p-8{padding:8px!important}.anna-icons{cursor:pointer}.anna-icons.color-black{color:#000}.anna-icons.color-primary-color{color:var(--primary-color)}.anna-icons.float-right{float:right}.anna-icons.ml-4{margin-left:4px}.anna-icons.mr-4{margin-right:4px}.anna-icons.disable{pointer-events:none}tr td div:first-of-type.CENTRE{display:flex;justify-content:center;align-items:center;height:100%}input[type=radio].anna-gt-radio{accent-color:var(--primary-blue-color);width:16px;height:16px;display:inline-flex;vertical-align:middle;margin-right:4px}input[type=radio].anna-gt-radio:hover{accent-color:var(--primary-blue-color)!important;opacity:1!important;background-color:var(--primary-blue-color)!important;border-color:initial!important;box-shadow:none!important}\n"] }]
5780
5931
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: AnnaSortService }, { type: AnnaDateTimeFormatService }, { type: AnnaFilterService }], propDecorators: { showSkeletonLoading: [{
5781
5932
  type: Input
5782
5933
  }], tableHeaders: [{
@@ -5874,10 +6025,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
5874
6025
  type: Output
5875
6026
  }], statusNotePopupOpened: [{
5876
6027
  type: Output
6028
+ }], textPopupOpened: [{
6029
+ type: Output
5877
6030
  }], digitOnlyInputChanged: [{
5878
6031
  type: Output
5879
6032
  }], singleSelectDropdownValueEmit: [{
5880
6033
  type: Output
6034
+ }], timeSelected: [{
6035
+ type: Output
5881
6036
  }], totalRowRadioButtonClicked: [{
5882
6037
  type: Output
5883
6038
  }], totalRowRadioButtonIconClicked: [{
@@ -6263,7 +6418,9 @@ class AnnaNumberFormatService {
6263
6418
  const result = AnnaNumberFormatService.GetValueInUnits(Math.abs(inputValue));
6264
6419
  let value = result[0];
6265
6420
  const unit = result[1];
6266
- value = +(+value).toFixed(digitsToRoundDecimalPoint);
6421
+ const factor = 10 ** digitsToRoundDecimalPoint;
6422
+ value = Math.round(((+value) + Number.EPSILON) * factor) / factor;
6423
+ // value = +(+value).toFixed(digitsToRoundDecimalPoint);
6267
6424
  if (inputValue < 0) {
6268
6425
  value *= -1;
6269
6426
  }
@@ -6587,6 +6744,16 @@ class ClickableItem {
6587
6744
  this.enableTooltipForAdditionalText = false;
6588
6745
  }
6589
6746
  }
6747
+ class ITextAndClickableDataActionKey {
6748
+ constructor(id, innerHTMLText, linkName, showLink, showText, className = null) {
6749
+ this.id = id;
6750
+ this.innerHTMLText = innerHTMLText;
6751
+ this.linkName = linkName;
6752
+ this.showLink = showLink;
6753
+ this.showText = showText;
6754
+ this.class = className;
6755
+ }
6756
+ }
6590
6757
  class IconCellActionKey {
6591
6758
  constructor(id, showIcon, iconClass, showObjectKey, showTooltip, tooltipData) {
6592
6759
  this.showIcon = true;
@@ -6687,5 +6854,5 @@ class AnnaApplicationConstants {
6687
6854
  * Generated bundle index. Do not edit.
6688
6855
  */
6689
6856
 
6690
- export { ANNAIconNames, AllSelectedStatus, AnnaApplicationConstants, AnnaBuyerApprovalIconTemplateComponent, AnnaCalendarFilterComponent, AnnaCircularProgressComponent, AnnaColumnCheckboxFilterComponent, AnnaColumnDateRangeFilterComponent, AnnaColumnSliderFilterComponent, AnnaColumnTimeFilterComponent, AnnaConvertArrayToCommaSeperatedValue, AnnaConvertZeroOrNullOrUndefinedPipe, AnnaCoreModule, AnnaDateFormatterPipe, AnnaDateTimeFormatService, AnnaDeletedOrderIconTemplateComponent, AnnaFilterSearchedTextPipe, AnnaFilterService, AnnaGlobalConfigService, AnnaGtHelperService, AnnaIconColumnComponent, AnnaLicensingTableComponent, AnnaLiveIconTemplateComponent, AnnaNoDataComponent, AnnaNonEditableGenericTableComponent, AnnaNotifyIconTemplateComponent, AnnaNumberFormatService, AnnaPayForPerformanceIconTemplateComponent, AnnaPersistingFilterService, AnnaRejectedIconTemplateComponent, AnnaReplaceCharPipe, AnnaSortComponent, AnnaSortService, AnnaSpinnerLoaderComponent, AnnaSpinnerLoaderService, AnnaTypeofDataPipe, AnnaWeekCalendarComponent, ButtonToggleComponent, ButtonToggleOptions, ClickableItem, Constants, Days, DigitOnlyDirective, EllipsisWithTableTooltip, ErrorCodes, FeatureDetails, FixedRowsPopupTableDirective, GTTableRelatedCommonFunctionsService, GenericTooltipHtmlService, IconCellActionKey, LicensingPlan, OrderSources, RadioButtonModel, RegexPatternsService, ShowEllipsisTextOnHoverDirective, SortTypeEnum, SvgOrIconNames, SvgOrIconTypeInGTTable, TableClassNameConstant, TooltipModel, TooltipModelForColumnLevelFiltering, UpdateStationIdService };
6857
+ export { ANNAIconNames, AllSelectedStatus, AnnaApplicationConstants, AnnaBuyerApprovalIconTemplateComponent, AnnaCalendarFilterComponent, AnnaCircularProgressComponent, AnnaColumnCheckboxFilterComponent, AnnaColumnDateRangeFilterComponent, AnnaColumnSliderFilterComponent, AnnaColumnTimeFilterComponent, AnnaConvertArrayToCommaSeperatedValue, AnnaConvertZeroOrNullOrUndefinedPipe, AnnaCoreModule, AnnaDateFormatterPipe, AnnaDateTimeFormatService, AnnaDeletedOrderIconTemplateComponent, AnnaFilterSearchedTextPipe, AnnaFilterService, AnnaGlobalConfigService, AnnaGtHelperService, AnnaIconColumnComponent, AnnaLicensingTableComponent, AnnaLiveIconTemplateComponent, AnnaNoDataComponent, AnnaNonEditableGenericTableComponent, AnnaNotifyIconTemplateComponent, AnnaNumberFormatService, AnnaPayForPerformanceIconTemplateComponent, AnnaPersistingFilterService, AnnaRejectedIconTemplateComponent, AnnaReplaceCharPipe, AnnaSortComponent, AnnaSortService, AnnaSpinnerLoaderComponent, AnnaSpinnerLoaderService, AnnaTypeofDataPipe, AnnaWeekCalendarComponent, ButtonToggleComponent, ButtonToggleOptions, ClickableItem, Constants, Days, DigitOnlyDirective, EllipsisWithTableTooltip, ErrorCodes, FeatureDetails, FixedRowsPopupTableDirective, GTTableRelatedCommonFunctionsService, GenericTooltipHtmlService, ITextAndClickableDataActionKey, IconCellActionKey, LicensingPlan, OrderSources, RadioButtonModel, RegexPatternsService, ShowEllipsisTextOnHoverDirective, SortTypeEnum, SvgOrIconNames, SvgOrIconTypeInGTTable, TableClassNameConstant, TooltipModel, TooltipModelForColumnLevelFiltering, UpdateStationIdService };
6691
6858
  //# sourceMappingURL=annalib-anna-core.mjs.map