tango-app-ui-analyse-trax 3.6.0 → 3.6.2-bulktask-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 (56) hide show
  1. package/esm2022/lib/components/action-centre/action-centre.component.mjs +3 -3
  2. package/esm2022/lib/components/activity-log-v2/activity-log-v2.component.mjs +3 -2
  3. package/esm2022/lib/components/activity-log-v2/log-view-popup/store-user-dropdown/store-user-dropdown.component.mjs +3 -3
  4. package/esm2022/lib/components/activity-log-v2/log-view-popup/view-action/view-action.component.mjs +3 -3
  5. package/esm2022/lib/components/add-checklist/add-checklist.component.mjs +5 -3
  6. package/esm2022/lib/components/add-multitask/add-multitask.component.mjs +538 -0
  7. package/esm2022/lib/components/add-multitask/bulkcreationmodel/bulkcreationmodel.component.mjs +269 -0
  8. package/esm2022/lib/components/add-multitask/create-task.data.mjs +306 -0
  9. package/esm2022/lib/components/add-multitask/create-task.interface.mjs +2 -0
  10. package/esm2022/lib/components/add-multitask/unique-string-validator.mjs +10 -0
  11. package/esm2022/lib/components/add-multitask/whitespace-validator.mjs +10 -0
  12. package/esm2022/lib/components/add-task/add-task.component.mjs +3 -1
  13. package/esm2022/lib/components/checklist-configure/checklist-configure.component.mjs +4 -4
  14. package/esm2022/lib/components/dashboard/dashboard.component.mjs +3 -3
  15. package/esm2022/lib/components/dashboard-info/dashboard-info.component.mjs +1 -1
  16. package/esm2022/lib/components/disabled-select/disabled-select.component.mjs +158 -0
  17. package/esm2022/lib/components/export-gallery/export-gallery.component.mjs +7 -2
  18. package/esm2022/lib/components/eye-test-audit/eye-test/eye-test.component.mjs +11 -17
  19. package/esm2022/lib/components/eye-test-audit/group-select/group-select.component.mjs +3 -3
  20. package/esm2022/lib/components/eye-test-audit/reactive-select/reactive-select.component.mjs +3 -3
  21. package/esm2022/lib/components/flags/flags.component.mjs +1 -1
  22. package/esm2022/lib/components/flags-info/flags-info.component.mjs +1 -1
  23. package/esm2022/lib/components/gallery/gallery.component.mjs +324 -50
  24. package/esm2022/lib/components/reactive-select/reactive-select.component.mjs +6 -3
  25. package/esm2022/lib/components/task-configure/task-configure.component.mjs +6 -6
  26. package/esm2022/lib/components/task-info/task-info.component.mjs +1 -1
  27. package/esm2022/lib/services/trax.service.mjs +20 -2
  28. package/esm2022/lib/tango-analyse-trax.module.mjs +12 -5
  29. package/fesm2022/{tango-app-ui-analyse-trax-eye-test-audit.module-mp5zGDN4.mjs → tango-app-ui-analyse-trax-eye-test-audit.module-B6bePYMW.mjs} +20 -26
  30. package/fesm2022/tango-app-ui-analyse-trax-eye-test-audit.module-B6bePYMW.mjs.map +1 -0
  31. package/fesm2022/{tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-DKvlR9IQ.mjs → tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-IHj5-6FY.mjs} +1820 -253
  32. package/fesm2022/tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-IHj5-6FY.mjs.map +1 -0
  33. package/fesm2022/tango-app-ui-analyse-trax.mjs +1 -1
  34. package/lib/components/activity-log-v2/activity-log-v2.component.d.ts +1 -0
  35. package/lib/components/add-multitask/add-multitask.component.d.ts +95 -0
  36. package/lib/components/add-multitask/bulkcreationmodel/bulkcreationmodel.component.d.ts +42 -0
  37. package/lib/components/add-multitask/create-task.data.d.ts +244 -0
  38. package/lib/components/add-multitask/create-task.interface.d.ts +147 -0
  39. package/lib/components/add-multitask/unique-string-validator.d.ts +2 -0
  40. package/lib/components/add-multitask/whitespace-validator.d.ts +2 -0
  41. package/lib/components/disabled-select/disabled-select.component.d.ts +34 -0
  42. package/lib/components/eye-test-audit/eye-test-audit/start-audit/start-audit.component.d.ts +2 -2
  43. package/lib/components/flags/flags.component.d.ts +2 -2
  44. package/lib/components/flags-info/flags-info.component.d.ts +3 -3
  45. package/lib/components/flags-new/flags-new.component.d.ts +2 -2
  46. package/lib/components/gallery/gallery.component.d.ts +40 -2
  47. package/lib/components/manage-task/manage-task.component.d.ts +1 -1
  48. package/lib/components/orders/orders.component.d.ts +1 -1
  49. package/lib/components/reactive-select/reactive-select.component.d.ts +2 -2
  50. package/lib/components/reports/reports.component.d.ts +2 -2
  51. package/lib/components/task-configure/task-configure.component.d.ts +3 -3
  52. package/lib/services/trax.service.d.ts +6 -1
  53. package/lib/tango-analyse-trax.module.d.ts +11 -8
  54. package/package.json +1 -1
  55. package/fesm2022/tango-app-ui-analyse-trax-eye-test-audit.module-mp5zGDN4.mjs.map +0 -1
  56. package/fesm2022/tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-DKvlR9IQ.mjs.map +0 -1
@@ -724,7 +724,7 @@ export class DashboardInfoComponent {
724
724
  return this.infoChecklistData.filter(item => item.selected).length;
725
725
  }
726
726
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DashboardInfoComponent, deps: [{ token: i1.ActivatedRoute }, { token: i1.Router }, { token: i2.GlobalStateService }, { token: i0.ChangeDetectorRef }, { token: i3.ToastService }, { token: i4.TraxService }, { token: i5.FormBuilder }, { token: i2.PageInfoService }, { token: i3.ToastService }], target: i0.ɵɵFactoryTarget.Component });
727
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DashboardInfoComponent, selector: "lib-dashboard-info", ngImport: i0, template: "<div *ngIf=\"receivedData === 'Checklist'\" class=\"card mb-3\">\r\n <div class=\"card-body pt-2 pb-1\">\r\n <div class=\"d-flex flex-column\">\r\n <div class=\"d-flex flex-wrap my-2 pe-2\">\r\n <a [routerLink]=\"['/manage/trax/dashboard']\" [queryParams]=\"{type: 'Checklist'}\" class=\"d-flex align-items-center me-3 cursor-pointer\">\r\n <span><svg width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_d_987_30898)\">\r\n <rect x=\"2\" y=\"1\" width=\"40\" height=\"40\" rx=\"8\" fill=\"white\" />\r\n <rect x=\"2.5\" y=\"1.5\" width=\"39\" height=\"39\" rx=\"7.5\" stroke=\"#D0D5DD\" />\r\n <path\r\n d=\"M27.8346 21.0001H16.168M16.168 21.0001L22.0013 26.8334M16.168 21.0001L22.0013 15.1667\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_987_30898\" x=\"0\" y=\"0\" width=\"44\" height=\"44\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\"\r\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\" />\r\n <feOffset dy=\"1\" />\r\n <feGaussianBlur stdDeviation=\"1\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_987_30898\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_987_30898\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n </a>\r\n\r\n <form class=\"mt-1 me-3 cursor-pointer\" style=\"min-width: 200px;\" [formGroup]=\"form\">\r\n <!-- <div class=\"col-md-4 w-200px\"> -->\r\n <lib-select *ngIf=\"refreshDropdown\" [items]=\"checklistDropdown\" [multi]=\"false\" [searchField]=\"'checkListName'\"\r\n [idField]=\"'_id'\" [selectedValues]=\"[selectedChecklist]\" (selected)=\"onChecklistSelect($event)\">\r\n </lib-select>\r\n <!-- <ng-template let-item>\r\n <div class=\"d-flex justify-content-between align-items-center no-border-custom-select\">\r\n <span>{{ item.checkListName }}</span>\r\n <span class=\"d-flex align-items-center\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M4 6L8 10L12 6\" stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </ng-template> -->\r\n \r\n\r\n <!-- <lib-reactive-select [formControl]=\"checklistselectControl\" [idField]=\"'_id'\"\r\n [nameField]=\"'checkListName'\" [data]=\"checklistDropdown\" class=\"w-100 \"\r\n style=\"border: none !important; box-shadow: none !important;\"\r\n (valueChange)=\"onValueChangeChecklist($event)\">\r\n <ng-template let-item>\r\n <div class=\"d-flex justify-content-between align-items-center no-border-custom-select\">\r\n <span>{{ item.checkListName }}</span>\r\n <span class=\"d-flex align-items-center\">\r\n \r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path d=\"M4 6L8 10L12 6\" stroke=\"#101828\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </ng-template>\r\n </lib-reactive-select> -->\r\n <!-- </div> -->\r\n </form>\r\n <div class=\"checklist-details d-flex flex-wrap mt-3\">\r\n <!-- <div class=\"d-flex align-items-center grey-badge me-3 my-3\">\r\n {{ selectedChecklist?.checkListName }}\r\n </div> -->\r\n\r\n <div class=\"d-flex align-items-center mb-2\">\r\n <span *ngIf=\"selectedChecklist?.publish\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M7.9987 14.6666C11.6806 14.6666 14.6654 11.6818 14.6654 7.99992C14.6654 4.31802 11.6806 1.33325 7.9987 1.33325C4.3168 1.33325 1.33203 4.31802 1.33203 7.99992C1.33203 11.6818 4.3168 14.6666 7.9987 14.6666Z\"\r\n fill=\"#12B76A\" />\r\n </svg>\r\n </span>\r\n\r\n <span *ngIf=\"!selectedChecklist?.publish\">\r\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.9987 13.6666C10.6806 13.6666 13.6654 10.6818 13.6654 6.99992C13.6654 3.31802 10.6806 0.333252 6.9987 0.333252C3.3168 0.333252 0.332031 3.31802 0.332031 6.99992C0.332031 10.6818 3.3168 13.6666 6.9987 13.6666Z\"\r\n fill=\"#F04438\" />\r\n </svg>\r\n </span>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center me-3 checklisttext\">\r\n <span><svg class=\"mx-2 mb-1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M13.3346 14V12.6667C13.3346 11.9594 13.0537 11.2811 12.5536 10.781C12.0535 10.281 11.3752 10 10.668 10H5.33464C4.62739 10 3.94911 10.281 3.44902 10.781C2.94892 11.2811 2.66797 11.9594 2.66797 12.6667V14M10.668 4.66667C10.668 6.13943 9.47406 7.33333 8.0013 7.33333C6.52854 7.33333 5.33464 6.13943 5.33464 4.66667C5.33464 3.19391 6.52854 2 8.0013 2C9.47406 2 10.668 3.19391 10.668 4.66667Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg><span class=\"mt-2\">{{ selectedChecklist?.createdByName }}</span></span>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center me-3 checklisttext\">\r\n <span><svg class=\"mx-2 mb-1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M12 3H13.5C13.8978 3 14.2794 3.15804 14.5607 3.43934C14.842 3.72064 15 4.10218 15 4.5V15C15 15.3978 14.842 15.7794 14.5607 16.0607C14.2794 16.342 13.8978 16.5 13.5 16.5H4.5C4.10218 16.5 3.72064 16.342 3.43934 16.0607C3.15804 15.7794 3 15.3978 3 15V4.5C3 4.10218 3.15804 3.72064 3.43934 3.43934C3.72064 3.15804 4.10218 3 4.5 3H6M6.75 1.5H11.25C11.6642 1.5 12 1.83579 12 2.25V3.75C12 4.16421 11.6642 4.5 11.25 4.5H6.75C6.33579 4.5 6 4.16421 6 3.75V2.25C6 1.83579 6.33579 1.5 6.75 1.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{ selectedChecklist?.storeCount?.toLocaleString('en-US', { minimumFractionDigits: 0\r\n }) || '--' }} {{selectedChecklist?.coverage === 'store' ? 'Stores' : 'Users'}}</span>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center me-3 checklisttext\">\r\n <span><svg class=\"mx-2 mb-1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M12 1.5V4.5M6 1.5V4.5M2.25 7.5H15.75M3.75 3H14.25C15.0784 3 15.75 3.67157 15.75 4.5V15C15.75 15.8284 15.0784 16.5 14.25 16.5H3.75C2.92157 16.5 2.25 15.8284 2.25 15V4.5C2.25 3.67157 2.92157 3 3.75 3Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>Repeats {{selectedChecklist?.scheduleRepeatedType === 'onetime' ? 'Single' : (selectedChecklist?.scheduleRepeatedType || '--' )}}</span>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center me-3 checklisttext\">\r\n <span><svg class=\"mx-2 mb-1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_987_30895)\">\r\n <path\r\n d=\"M9 4.5V9L12 10.5M16.5 9C16.5 13.1421 13.1421 16.5 9 16.5C4.85786 16.5 1.5 13.1421 1.5 9C1.5 4.85786 4.85786 1.5 9 1.5C13.1421 1.5 16.5 4.85786 16.5 9Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_987_30895\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg> {{ selectedChecklist?.scheduleStartTime?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) || '--' }} - {{\r\n selectedChecklist?.scheduleEndTime?.toLocaleString('en-US', { minimumFractionDigits: 0 }) ||\r\n '--' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <!--end::Info-->\r\n </div>\r\n </div>\r\n</div>\r\n<div *ngIf=\"receivedData === 'User'\" class=\"card mb-5\">\r\n <div class=\"card-body pt-2 pb-1\">\r\n <div class=\"d-flex flex-column\">\r\n <div class=\"d-flex flex-wrap my-2 pe-2\">\r\n <a [routerLink]=\"['/manage/trax/dashboard']\" [queryParams]=\"{type: 'user'}\" class=\"d-flex align-items-center me-3 cursor-pointer\">\r\n <span><svg width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_d_987_30898)\">\r\n <rect x=\"2\" y=\"1\" width=\"40\" height=\"40\" rx=\"8\" fill=\"white\" />\r\n <rect x=\"2.5\" y=\"1.5\" width=\"39\" height=\"39\" rx=\"7.5\" stroke=\"#D0D5DD\" />\r\n <path\r\n d=\"M27.8346 21.0001H16.168M16.168 21.0001L22.0013 26.8334M16.168 21.0001L22.0013 15.1667\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_987_30898\" x=\"0\" y=\"0\" width=\"44\" height=\"44\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\"\r\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\" />\r\n <feOffset dy=\"1\" />\r\n <feGaussianBlur stdDeviation=\"1\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_987_30898\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_987_30898\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n </a>\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label bg-light-primary text-primary me-2 mt-2\">\r\n {{ selectedUser?.userNameChar }}\r\n </span>\r\n </div>\r\n <form class=\"mt-1 me-3 cursor-pointer\" style=\"min-width: 200px;\" [formGroup]=\"form\"> \r\n <lib-select *ngIf=\"refreshuserDropdown\"\r\n [items]=\"userlistDropdown\" \r\n [multi]=\"false\" \r\n [searchField]=\"'userName'\" \r\n [idField]=\"'userEmail'\" \r\n [selectedValues]=\"[selectedUser]\" \r\n (selected)=\"onUserSelect($event)\" \r\n >\r\n <!-- <ng-template let-item>\r\n <div class=\"d-flex justify-content-between align-items-center no-border-custom-select\">\r\n <span>{{ item.userName }}</span>\r\n <span class=\"d-flex align-items-center\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M4 6L8 10L12 6\" stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </ng-template> -->\r\n </lib-select>\r\n <!-- <div class=\"col-md-4 w-200px\">\r\n <lib-reactive-select [formControl]=\"userlistselectControl\" [idField]=\"'userEmail'\"\r\n [nameField]=\"'userName'\" [data]=\"userlistDropdown\" class=\"w-100\"\r\n style=\"border: none !important; box-shadow: none !important;\"\r\n (valueChange)=\"onValueChangeUserChecklist($event)\">\r\n <ng-template let-item>\r\n <div class=\"d-flex justify-content-between align-items-center no-border-custom-select\">\r\n <span>{{ item.userName }}</span>\r\n <span class=\"d-flex align-items-center\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M4 6L8 10L12 6\" stroke=\"#101828\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </ng-template>\r\n </lib-reactive-select>\r\n </div> -->\r\n </form>\r\n\r\n <div *ngIf=\"selectedUser?.role\" class=\"checklist-details d-flex flex-wrap mt-2\">\r\n <div class=\"d-flex align-items-center badge badge-light-primary me-3 my-3\">\r\n {{ selectedUser?.role }}\r\n </div>\r\n </div>\r\n </div>\r\n <!--end::Info-->\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"col-md-12\">\r\n <div class=\"row\">\r\n <div class=\"col-9\">\r\n <div *ngIf=\"receivedData === 'Checklist' || receivedData === 'User'\" class=\"row\">\r\n <div class=\"col-4\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Total instances\r\n </div>\r\n <div class=\"row mt-5\">\r\n <div class=\"col-md-10 infocount mb-6\">{{ infoCardsData?.totalInstances?.count !==null ?\r\n infoCardsData?.totalInstances?.count.toLocaleString('en-US', { minimumFractionDigits: 0 }) :\r\n '--'}}\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.totalInstances?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.totalInstances?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\">\r\n\r\n <span class=\"percent-value\">{{\r\n infoComparisonCardsData?.totalInstances?.comparisonData !==null\r\n ?infoComparisonCardsData?.totalInstances?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span>\r\n <span class=\"week-font\"> vs last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1\">\r\n <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='daily' ? 'text-primary' :''\"\r\n (click)=\"dateValue('daily')\">1D</div>\r\n <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='weekly' ? 'text-primary' :''\"\r\n (click)=\"dateValue('weekly')\">1W</div>\r\n <div *ngIf=\"traxMonthlyComparisonData\" class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='monthly' ? 'text-primary' :''\"\r\n (click)=\"dateValue('monthly')\">1M</div>\r\n <!-- <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='monthly' ? 'text-primary' :''\" (click)=\"dateValue('monthly')\">1M</div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-4\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Completed instances\r\n </div>\r\n <div class=\"row mt-5\">\r\n <div class=\"infocount mb-6\">{{ infoCardsData?.completedInstances?.count !==null ?\r\n infoCardsData?.completedInstances?.count.toLocaleString('en-US', { minimumFractionDigits: 0\r\n }) : '--' }}\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.completedInstances?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.completedInstances?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\">\r\n <span class=\"percent-value\">{{\r\n infoComparisonCardsData?.completedInstances?.comparisonData !==null\r\n ?infoComparisonCardsData?.completedInstances?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span>\r\n <span class=\"week-font\"> vs last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-4\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Flags\r\n </div>\r\n <div class=\"row mt-5\">\r\n <div class=\"infocount mb-6\">{{ infoCardsData?.flags?.count !==null ?\r\n infoCardsData?.flags?.count.toLocaleString('en-US', { minimumFractionDigits: 0 }) : '--' }}\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.flags?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.flags?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\">\r\n <span class=\"percent-value\">{{ infoComparisonCardsData?.flags?.comparisonData\r\n !==null ? infoComparisonCardsData?.flags?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span>\r\n <span class=\"week-font\"> vs last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span>\r\n </span>\r\n </div>\r\n <!-- <div class=\"avgcount\">Avg Flag Rate : {{ infoCardsData.flags.count ? '50%' : 'N/A' }}</div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"receivedData === 'Checklist'\" class=\"row my-3\">\r\n <div class=\"col-6\">\r\n <div class=\"subinfocard\">\r\n <div class=\"headingcard\">\r\n Completion Score\r\n </div>\r\n\r\n <div class=\"infocount\">\r\n {{ infoCardsData?.completionScore?.count !==null ?\r\n infoCardsData?.completionScore?.count.toLocaleString('en-US', { minimumFractionDigits: 0 })\r\n : '--' }}%\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.completionScore?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.completionScore?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\">\r\n <span class=\"percent-value\">{{\r\n infoComparisonCardsData?.completionScore?.comparisonData !==null ?\r\n infoComparisonCardsData?.completionScore?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }} %</span>\r\n <span class=\"week-font\"> vs last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-6\">\r\n <div class=\"subinfocard\">\r\n <div class=\"headingcard\">\r\n Compliance Rate\r\n </div>\r\n <div class=\"infocount\">\r\n\r\n {{ infoCardsData?.complianceRate?.count !==null ?\r\n infoCardsData?.complianceRate?.count.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }} %\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.complianceRate?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.complianceRate?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\">\r\n <span class=\"percent-value\">{{\r\n infoComparisonCardsData?.complianceRate?.comparisonData !==null\r\n ?infoComparisonCardsData?.complianceRate?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span>\r\n <span class=\"week-font\"> vs last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"receivedData === 'User'\" class=\"row my-3\">\r\n <div class=\"col-6\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Completion Score\r\n </div>\r\n <div class=\"row mt-5\">\r\n <div class=\"infocount mb-6\">{{ infoCardsData?.completionScore?.count !==null ?\r\n infoCardsData?.completionScore?.count.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--'}} %\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.completionScore?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.completionScore?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\"><span class=\"percent-value\">{{\r\n infoComparisonCardsData?.completionScore?.comparisonData !==null ?\r\n infoComparisonCardsData?.completionScore?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span><span class=\"week-font\"> vs last\r\n <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-6\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Compliance Rate\r\n </div>\r\n <div class=\"row mt-5\">\r\n <div class=\"infocount mb-6\">{{ infoCardsData?.complianceRate?.count !==null ?\r\n infoCardsData?.complianceRate?.count.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }} %\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.complianceRate?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.complianceRate?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\"><span class=\"percent-value\">{{\r\n infoComparisonCardsData?.complianceRate?.comparisonData !==null ?\r\n infoComparisonCardsData?.complianceRate?.comparisonData.toLocaleString('en-US',\r\n { minimumFractionDigits: 0 }) :\r\n '--'}}%</span><span class=\"week-font\"> vs last <span\r\n *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n <!-- <div class=\"col-4\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Assigned Tasks\r\n </div>\r\n <div class=\"infocount\"><u>6</u>\r\n <div><span class=\"mt-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\"\r\n height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg></span><span class=\"mt-2 ms-2\"><span class=\"percent-value\">13%</span><span\r\n class=\"week-font\"> vs\r\n last week</span></span></div>\r\n <div class=\"actiondownload\">View All </div>\r\n </div>\r\n \r\n \r\n </div>\r\n </div> -->\r\n </div>\r\n\r\n <!-- <ng-container *ngIf=\"infoCardDataLoading\">\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"infoCardNoData && !infoCardDataLoading\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 my-6\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodatamaintext mt-3\">No data found</div>\r\n <div class=\"nodatasubtext\">There is no result for Checklist Performance Table\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> -->\r\n\r\n </div>\r\n\r\n\r\n <div *ngIf=\"receivedData === 'Checklist' || receivedData === 'User'\" class=\"col-3\">\r\n <lib-monthlyperformance-datepicker\r\n [monthlyperformce]=\"selectedSourceCheckListId\"></lib-monthlyperformance-datepicker>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"receivedData === 'Store'\" class=\"row mb-4 d-flex justify-content-between align-items-stretch\">\r\n <div class=\"col-2 px-2\">\r\n <div class=\"card card-border pt-2 h-100\">\r\n <div class=\"card-header ellipse1 border-0 px-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"cardcount\">{{ infoCardsData?.activeUnique !==null ?\r\n infoCardsData?.activeUnique?.toLocaleString('en-US', { minimumFractionDigits: 0 }) : '--'\r\n }}</span>\r\n <span class=\"cardtext\">Active Checklists</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-body p-0\">\r\n <div class=\"h-auto py-3 px-3\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.totalInstances?.count !==null ?\r\n infoCardsData?.totalInstances?.count?.toLocaleString('en-US', { minimumFractionDigits: 0 }) :\r\n '--' }}</div>\r\n <div class=\"cardtext\">Checklist Instances</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-5 px-2\">\r\n <div class=\"card card-border pt-2 h-100\">\r\n <div class=\"card-header ellipse1 border-0 px-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"cardcount\">{{ infoCardsData?.notSubmittedInstances?.count !==null ?\r\n infoCardsData?.notSubmittedInstances?.count?.toLocaleString('en-US', { minimumFractionDigits: 0\r\n }) : '--' }}</span>\r\n <span class=\"cardtext\">Not Submitted Checklists</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-body p-0\">\r\n <div class=\"row h-auto py-3 px-3\">\r\n <div class=\"col-md-6\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.notSubmittedInstances?.open !==null ?\r\n infoCardsData?.notSubmittedInstances?.open?.toLocaleString('en-US', { minimumFractionDigits:\r\n 0 }) : '--' }}</div>\r\n <div class=\"cardtext\">Open Checklists</div>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.notSubmittedInstances?.inprogress !==null ?\r\n infoCardsData?.notSubmittedInstances?.inprogress?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }}</div>\r\n <div class=\"cardtext\">In Progress Checklists</div>\r\n </div>\r\n <!-- <div class=\"col-md-4\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.notSubmittedInstances?.delay ?\r\n infoCardsData?.notSubmittedInstances?.delay.toLocaleString('en-US', { minimumFractionDigits:\r\n 0 }) : '--' }}</div>\r\n <div class=\"cardtext\">Delay in Submission</div>\r\n </div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-5 px-2\">\r\n <div class=\"card card-border pt-2 h-100\">\r\n <div class=\"card-header ellipse1 border-0 px-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"cardcount\">{{ infoCardsData?.completedInstances?.count !==null ?\r\n infoCardsData?.completedInstances?.count?.toLocaleString('en-US', { minimumFractionDigits: 0 }) :\r\n '--' }}</span>\r\n <span class=\"cardtext\">Submitted Checklists</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-body p-0\">\r\n <div class=\"row h-auto py-3 px-3\">\r\n <div class=\"col-md-11\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.completionScore?.count !==null ?\r\n infoCardsData?.completionScore?.count?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 })\r\n : '--' }}%</div>\r\n <div class=\"cardtext\">Completion Score</div>\r\n <div class=\"mt-2\">\r\n <span *ngIf=\"infoComparisonCardsData?.completionScore?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.completionScore?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\"><span class=\"percent-value\">{{\r\n infoComparisonCardsData?.completionScore?.comparisonData !==null?\r\n infoComparisonCardsData?.completionScore?.comparisonData?.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span><span class=\"week-font\"> vs\r\n last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-4\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.complianceRate?.count !==null ?\r\n infoCardsData?.complianceRate?.count?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }}%</div>\r\n <div class=\"cardtext\">Compliance Score</div>\r\n <div class=\"mt-2\">\r\n <span *ngIf=\"infoComparisonCardsData?.complianceRate?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.complianceRate?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\"><span class=\"percent-value\">{{\r\n infoComparisonCardsData?.complianceRate?.comparisonData !==null?\r\n infoComparisonCardsData?.complianceRate?.comparisonData?.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span><span class=\"week-font\"> vs\r\n last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-4\">\r\n <div *ngIf=\"infoCardsData?.flags?.count; else noDataFlagged\" [routerLink]=\"['/manage/trax/flags']\" class=\"cardsubcount my-2 cursor-pointer\">\r\n <u>{{\r\n infoCardsData?.flags?.count !==null ?\r\n infoCardsData?.flags?.count?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }}</u></div>\r\n <ng-template #noDataFlagged>\r\n <div class=\"cardsubcount my-2\">--</div>\r\n </ng-template>\r\n <div class=\"cardtext\">Total Flags</div>\r\n <div class=\"mt-2\">\r\n <span *ngIf=\"infoComparisonCardsData?.flags?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.flags?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\"><span class=\"percent-value\">{{\r\n infoComparisonCardsData?.flags?.comparisonData !==null ?\r\n infoComparisonCardsData?.flags?.comparisonData?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }}%</span><span class=\"week-font\"> vs\r\n last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1 mt-3\">\r\n <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='daily' ? 'text-primary' :''\"\r\n (click)=\"dateValue('daily')\">1D</div>\r\n <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='weekly' ? 'text-primary' :''\"\r\n (click)=\"dateValue('weekly')\">1W</div>\r\n <div *ngIf=\"traxMonthlyComparisonData\" class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='monthly' ? 'text-primary' :''\"\r\n (click)=\"dateValue('monthly')\">1M</div>\r\n <!-- <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='monthly' ? 'text-primary' :''\" (click)=\"dateValue('monthly')\">1M</div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"row\">\r\n <div class=\"col-lg-12\">\r\n <div class=\"card\">\r\n <div class=\"col-lg-12\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <!-- {{receivedData}} -->\r\n <span class=\"card-label mb-2\">Checklist Info <span class=\"badge badge-light-primary\">{{totalItems}} Total</span></span>\r\n <span class=\"text-sub mb-2\"> Based on {{ headerData?.date?.startDate | date: 'MMM d' }} - {{\r\n headerData?.date?.endDate | date: 'MMM d, y' }}\r\n </span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div>\r\n <form class=\"mt-1\" [formGroup]=\"form\">\r\n <div class=\"col-md-4 w-200px\">\r\n <lib-reactive-select [formControl]=\"selectedlistselectControl\" [idField]=\"'_id'\"\r\n [nameField]=\"'label'\" [data]=\"statusselectControl\" class=\"w-200px\"\r\n (valueChange)=\"onValueChangeStatusSelect($event)\">\r\n <ng-template let-item>\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <span>{{ item.label }}</span>\r\n <span class=\"d-flex align-items-center\">\r\n <!-- <span class=\"status-text\">Status</span> -->\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#344054\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </ng-template>\r\n </lib-reactive-select>\r\n </div>\r\n </form>\r\n </div>\r\n <div *ngIf=\"receivedData === 'Checklist'\"\r\n class=\"d-flex align-items-center position-relative\">\r\n <span class=\"svg-icon footfallsearch svg-icon-1 position-absolute ms-8\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\">\r\n </rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <!-- [disabled]=\"searchDisabled\" -->\r\n <input [(ngModel)]=\"searchInput\" type=\"text\"\r\n class=\"form-control ps-14 ms-4 footfallsearch\" placeholder=\"Search\"\r\n autocomplete=\"off\" (keyup.enter)=\"searchField()\" />\r\n <button type=\"button\" (click)=\"onExport()\"\r\n class=\"btn-outline btn align-items-end text-nowrap invheader ms-4\"\r\n [disabled]=\"!infoChecklistData.length\">\r\n <!-- Export Icon -->\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </svg>\r\n <span class=\"ms-2\"></span> Export\r\n </button> \r\n \r\n </div>\r\n <div *ngIf=\"receivedData !== 'Checklist'\"\r\n class=\"d-flex align-items-center position-relative\">\r\n <span class=\"svg-icon footfallsearch svg-icon-1 position-absolute ms-8\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\">\r\n </rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <!-- [disabled]=\"searchDisabled\" -->\r\n <input [(ngModel)]=\"searchInput\" type=\"text\"\r\n class=\"form-control ps-14 ms-4 footfallsearch\" placeholder=\"Search by checklist\"\r\n autocomplete=\"off\" (keyup.enter)=\"searchField()\" />\r\n <button type=\"button\" (click)=\"onExport()\"\r\n class=\"btn-outline btn align-items-end text-nowrap invheader ms-4\"\r\n [disabled]=\"!infoChecklistData.length\">\r\n <!-- Export Icon -->\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </svg>\r\n <span class=\"ms-2\"></span> Export\r\n </button>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.TangoTrax_checklist_isAdd\">\r\n <a [routerLink]=\"['/manage/trax/createChecklist']\" *ngIf=\"receivedData === 'Store'\"\r\n type=\"button\" class=\"btn btn-primary ms-4 rounded-3 text-nowrap ng-star-inserted\"\r\n tabindex=\"0\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\r\n </svg><span class=\"ms-2 text-white\">Create Checklist</span></a>\r\n </div>\r\n <!-- <div >\r\n <a (click)=\"sendAlert()\"\r\n type=\"button\" class=\"btn btn-primary ms-4 rounded-3 text-nowrap ng-star-inserted\"\r\n tabindex=\"0\"><span class=\"ms-2 text-white\">Send Alert</span></a>\r\n </div> -->\r\n <div>\r\n <a (click)=\"sendAlert()\"\r\n type=\"button\"\r\n class=\"btn btn-primary ms-4 rounded-3 text-nowrap ng-star-inserted\"\r\n [class.disabled]=\"!isSendAlertEnabled\"\r\n [attr.aria-disabled]=\"!isSendAlertEnabled\"\r\n [tabindex]=\"isSendAlertEnabled ? 0 : -1\">\r\n <span class=\"ms-2 text-white\">Send Alert</span>\r\n </a>\r\n </div>\r\n \r\n\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectAll\" class=\"filtercard m-4\">\r\n <span><svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#DAF1FF\"/>\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#EAF8FF\" stroke-width=\"4\"/>\r\n <g clip-path=\"url(#clip0_6978_12777)\">\r\n <path d=\"M24.6654 17.3867V18.0001C24.6645 19.4377 24.199 20.8365 23.3383 21.988C22.4775 23.1394 21.2676 23.9817 19.8889 24.3893C18.5103 24.797 17.0369 24.748 15.6883 24.2498C14.3398 23.7516 13.1885 22.8308 12.406 21.6248C11.6235 20.4188 11.2519 18.9921 11.3465 17.5576C11.4411 16.1231 11.9968 14.7576 12.9309 13.6648C13.8649 12.572 15.1272 11.8103 16.5295 11.4935C17.9318 11.1767 19.3989 11.3216 20.712 11.9067M24.6654 12.6667L17.9987 19.3401L15.9987 17.3401\" stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_6978_12777\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\" transform=\"translate(10 10)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <span class=\"selectedtext ms-2\">All {{ totalItems }} Users on this page are selected.</span></span>\r\n </div>\r\n <!-- <span class=\"table-title-primary mx-2\">Select all {{ totalItems }} Users filtered</span><span class=\"selectedtext ms-2\">Alerts will only send for Open and Inprogress</span></span> -->\r\n \r\n <div class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n\r\n <table *ngIf=\"!checklistLoading && !checklistNoData\" class=\"table text-nowrap bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>\r\n <input class=\"form-check-input h-14px w-14px c-checkbox\"\r\n type=\"checkbox\"\r\n [(ngModel)]=\"selectAll\"\r\n [disabled]=\"!isTodaySelected || selectedlistselectControl.value === 'submit'\"\r\n (change)=\"toggleSelectAll()\"\r\n />\r\n \r\n </th>\r\n <th *ngIf=\"receivedData === 'Checklist' || receivedData === 'User' \"\r\n class=\"cursor-pointer\" (click)=\"sortData('date_string')\">Date\r\n <svg [ngClass]=\"sortColumName === 'date_string' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'date_string' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"receivedData === 'Store' || receivedData === 'User'\"\r\n class=\"cursor-pointer\" (click)=\"sortData('checkListName')\">CheckList Name\r\n <svg [ngClass]=\"sortColumName === 'checkListName' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'date_string' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"(receivedData === 'Checklist' || receivedData === 'User')\"\r\n class=\"cursor-pointer\" (click)=\"sortData('storeName')\">Store Name\r\n <svg [ngClass]=\"sortColumName === 'storeName' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'storeName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"(receivedData === 'Checklist' || receivedData === 'User')\"\r\n class=\"cursor-pointer\" (click)=\"sortData('userName')\">User Name\r\n <svg [ngClass]=\"sortColumName === 'userName' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th>Status</th>\r\n <!-- <th *ngIf=\"selectedChecklist?.coverage === 'store'\">User Name</th> -->\r\n <th *ngIf=\"receivedData !== 'User'\">Submitted By</th>\r\n <th class=\"cursor-pointer\" (click)=\"sortData('submitTime_string')\">Submitted On\r\n <svg [ngClass]=\"sortColumName === 'submitTime_string' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'submitTime_string' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"sortData('submitCount')\" >Submission Count\r\n <svg [ngClass]=\"sortColumName === 'submitCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'submitCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th>Flags</th>\r\n <th >Approved By</th>\r\n <!-- class=\"cursor-pointer\" (click)=\"sortData('approvalTime')\" -->\r\n <th >Approved On\r\n <!-- <svg [ngClass]=\"sortColumName === 'approvalTime' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'approvalTime' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> -->\r\n </th>\r\n <th>Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of infoChecklistData\">\r\n <td>\r\n <input class=\"form-check-input h-14px w-14px c-checkbox\"\r\n type=\"checkbox\"\r\n [(ngModel)]=\"item.selected\"\r\n [disabled]=\"!isTodaySelected || item.checklistStatus === 'Submitted'\"\r\n (change)=\"updateSelectAllState()\"\r\n />\r\n </td>\r\n <td *ngIf=\"receivedData === 'Checklist' || receivedData === 'User' \">\r\n <div class=\"table-title\">{{ item.date_string }}</div>\r\n </td>\r\n <td *ngIf=\"receivedData === 'Store' || receivedData === 'User'\">\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label bg-light-primary text-primary me-2\">\r\n {{ item.checkListChar || '--' }}\r\n </span>\r\n </div>\r\n <span class=\"table-titlechecklist\">{{\r\n item.checkListName }}</span>\r\n </td>\r\n\r\n <td *ngIf=\"receivedData === 'Checklist' || receivedData === 'User'\">\r\n <div class=\"table-title\">{{ item?.coverage === 'store' ? item.storeName : '--' }}</div>\r\n </td>\r\n <td *ngIf=\"(receivedData === 'Checklist' || receivedData === 'User')\">\r\n <div class=\"table-title\">{{ item.userName }}</div>\r\n </td>\r\n <td class=\"table-title\">\r\n <span class=\"badge\" [ngClass]=\"{\r\n 'badge-light-success': item.checklistStatus === 'Submitted',\r\n 'badge-light-warning': item.checklistStatus === 'In Progress',\r\n 'badge-light-primary': item.checklistStatus === 'Open',\r\n 'badge-light-danger': item.checklistStatus === 'delayed'\r\n }\"><span *ngIf=\"item.redoStatus\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"14\" viewBox=\"0 0 12 14\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_7166_57025)\">\r\n <path \r\n d=\"M0.5 2.66674V5.91674M0.5 5.91674H3.5M0.5 5.91674L2.82 3.55507C3.51046 2.80834 4.40623 2.32493 5.37234 2.17768C6.33845 2.03042 7.32257 2.22731 8.17642 2.73865C9.03026 3.25 9.70758 4.04812 10.1063 5.01275C10.505 5.97738 10.6036 7.05627 10.3871 8.08685C10.1706 9.11744 9.65084 10.0439 8.90606 10.7266C8.16129 11.4093 7.23187 11.8113 6.25786 11.8721C5.28384 11.9328 4.31799 11.649 3.50583 11.0633C2.69367 10.4777 2.0792 9.62195 1.755 8.62507\"\r\n [attr.stroke]=\"getSvgColor(item.checklistStatus)\"\r\n stroke-width=\"2\" \r\n stroke-linecap=\"round\" \r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_7166_57025\">\r\n <rect width=\"12\" height=\"13\" fill=\"white\" transform=\"translate(0 0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>{{ item.checklistStatus | titlecase }}</span>\r\n </td>\r\n <td *ngIf=\"receivedData !== 'User'\">\r\n <div class=\"table-title\">{{ item.userEmail }}</div>\r\n </td>\r\n \r\n <td>\r\n <div class=\"table-title\">{{ item.submitTime_string?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) || '--' }}</div>\r\n </td>\r\n <td >\r\n <div class=\"table-title\">{{ item?.submitCount || 0}}</div>\r\n </td>\r\n\r\n <td>\r\n <div class=\"table-title\">\r\n {{ item.flaggedChecklist !==null ? item?.flaggedChecklist?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }}\r\n </div>\r\n </td>\r\n\r\n <td>\r\n <div class=\"table-title\">{{ item.approvalByEmail || \"--\" }}</div>\r\n </td>\r\n <td>\r\n <div class=\"table-title\">{{ item.approvalTime_string?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) || '--' }}</div>\r\n </td>\r\n\r\n <td>\r\n <div class=\"table-title d-flex\">\r\n <ng-container *ngIf=\"item.checklistStatus === 'Submitted'\">\r\n <!-- <span [routerLink]=\"['/manage/trax/gallery']\"\r\n [queryParams]=\"{ storeId: item.store_id, checklistType: item.checkListType, ChecklistDate: item.checklistDate, checklistId: item.sourceCheckList_id }\"\r\n class=\"actionview me-4 cursor-pointer\">View</span> -->\r\n <span (click)=\"navigateToGallery(item)\"\r\n class=\"actionview me-4 cursor-pointer\">View</span>\r\n <span (click)=\"download('pdf',item )\"\r\n class=\"actiondownload cursor-pointer\">Download</span>\r\n </ng-container>\r\n \r\n <ng-container>\r\n <span *ngIf=\"checklistInfoDate === item.date_string && !item.reinitiateStatus && item.checklistStatus !== 'Submitted' && item.timeFlag > 0\"\r\n (click)=\"reinitiate(item._id)\" class=\"actiondownload cursor-pointer\">\r\n Reinitiate\r\n </span>\r\n <span *ngIf=\"checklistInfoDate === item.date_string && item.reinitiateStatus && item.checklistStatus !== 'Submitted' && item.timeFlag > 0\"\r\n class=\"actionview disabled\">\r\n Reinitiate\r\n </span>\r\n\r\n <span \r\n *ngIf=\"checklistInfoDate === item.date_string && item.reinitiateStatus && item.checklistStatus !== 'Submitted' && item.timeFlag > 0\"\r\n (click)=\"sendAlert(item._id)\" \r\n class=\"actiondownload cursor-pointer ms-3\">\r\n SendAlert\r\n </span>\r\n </ng-container>\r\n \r\n <ng-container>\r\n <div *ngIf=\"item.checklistStatus !== 'Submitted' && item.timeFlag <= 0\" \r\n [class.disabled]=\"item.date_string !== todayDate || selectedCheckboxCount > 1\"\r\n [attr.aria-disabled]=\"item.date_string !== todayDate || selectedCheckboxCount > 1\"\r\n [tabindex]=\"item.date_string !== todayDate || selectedCheckboxCount > 1 ? -1 : 0\">\r\n <span \r\n (click)=\"(item.date_string === todayDate && selectedCheckboxCount <= 1) ? sendAlert(item._id) : $event.stopPropagation()\"\r\n class=\"actiondownload cursor-pointer\">\r\n SendAlert\r\n </span>\r\n </div>\r\n </ng-container>\r\n \r\n <!-- <ng-container>\r\n <div *ngIf=\"checklistInfoDate === item.date_string && item.checklistStatus !== 'Submitted' && isTodaySelected\"\r\n [class.disabled]=\"selectedCheckboxCount > 1\"\r\n [attr.aria-disabled]=\"selectedCheckboxCount > 1\" \r\n [tabindex]=\"selectedCheckboxCount > 1 ? -1 : 0\">\r\n <span (click)=\"selectedCheckboxCount <= 1 ? sendAlert(item._id) : $event.stopPropagation()\"\r\n class=\"actiondownload cursor-pointer\">\r\n SendAlert\r\n </span>\r\n </div>\r\n </ng-container> -->\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <ng-container *ngIf=\"checklistLoading\">\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"checklistNoData && !checklistLoading\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 my-6\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodatamaintext mt-3\">No data found</div>\r\n <div class=\"nodatasubtext\">There is no result for Performance Table\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>\r\n <div *ngIf=\"!checklistLoading && !checklistNoData\">\r\n <lib-pagination class=\"text-start\" [itemsPerPage]=\"itemsPerPage\" [currentPage]=\"currentPage\"\r\n [totalItems]=\"totalItems\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\"\r\n (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".grey-badge{border-radius:16px;background:var(--Gray-100, #F2F4F7);display:flex;padding:2px 8px;justify-content:center;align-items:center;color:var(--Gray-700, #344054);text-align:center;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.text-success{border-radius:16px;background:var(--Success-50, #ECFDF3);display:flex;padding:2px 8px 2px 6px;justify-content:center;align-items:center;gap:6px;color:var(--Success-500, #12B76A);text-align:center;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.checklistheading{color:var(--Gray-900, #101828);font-size:18px;font-style:normal;font-weight:600;line-height:28px}.checklisttext{color:var(--Gray-500, #667085);font-size:12px;font-style:normal;font-weight:500;line-height:18px}.totalinfocard{border-radius:5.359px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;padding:16px 12px 24px;flex-direction:column;align-items:center;gap:24px;align-self:stretch}.headingcard{color:var(--Black, #101828);font-size:16px;font-style:normal;font-weight:500;line-height:24px;display:flex;padding:8px;flex-direction:column;align-items:center;gap:4px;align-self:stretch;border-radius:4px;background:radial-gradient(206.89% 107.47% at 16.16% 32.77%,#fff6,#45bbfe33),#f9fafb}.infocount{color:var(--Black, #101828);font-size:24px;font-style:normal;font-weight:600;line-height:32px;text-align:center}.subinfocard{border-radius:5.359px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;display:flex;padding:21px 12px 40px;flex-direction:column;align-items:center;gap:24px;align-self:stretch}.avgcount{color:var(--Black, #101828);font-size:14px;font-style:normal;font-weight:400;line-height:20px}.actionview{color:var(--Gray-500, #667085);font-size:14px;font-weight:600;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.actiondownload{color:var(--Primary-700, #009BF3);font-size:14px;font-weight:600;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.actionalert{color:var(--Error-700, #B42318);font-size:14px;font-weight:600;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.ellipse1{border-radius:6px;border-bottom:2px solid var(--Gray-200, #EAECF0);background:radial-gradient(206.89% 107.47% at 16.16% 32.77%,#fff6,#45bbfe33),#f2f4f7;box-shadow:0 4px 10px #0000000d}.cardcount{color:var(--Black, #101828);font-size:30px;font-style:normal;font-weight:600;line-height:38px}.cardtext{color:var(--Gray-700, #344054);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.cardsubcount{color:var(--Black, #101828);font-size:20px;font-style:normal;font-weight:700;line-height:30px}.card-border{padding:8px;border-radius:12px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF)}.percent-value{color:var(--Gray-500, #667085);text-align:center;font-size:16px;font-style:normal;font-weight:600;line-height:18px}.week-font{color:var(--Gray-800, #1D2939);font-size:12px;font-style:normal;font-weight:400;line-height:18px}.nodatamaintext{font-family:Inter;font-size:16px;font-weight:600;line-height:24px;text-align:center;color:#101828}.nodatasubtext{font-family:Inter;font-size:14px;font-weight:400;line-height:20px;text-align:center;color:#667085}.rotate{transform:rotate(180deg)}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}table tr{vertical-align:middle}table th,table td{height:44px!important;padding:20px 15px!important;align-items:center;gap:12px;align-self:stretch}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-size:14px;font-style:normal;font-weight:500;line-height:20px;text-decoration-line:underline}.table-title{color:var(--Gray-500, #667085);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.diasbled{cursor:default;color:var(--gray-300, #D0D5DD);font-family:Inter;font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-text-decoration-line:underline;text-decoration-line:underline;text-transform:capitalize}.enabled{font-family:Inter;font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-text-decoration-line:underline;text-decoration-line:underline;text-transform:capitalize}.table-titlechecklist{color:var(--Gray-900, #101828);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.card .card-header{padding:0px 1.5rem}input[type=checkbox].c-checkbox{width:16px!important;height:16px!important;margin:5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-600, #D0D5DD)!important;box-shadow:none;font-size:.5em;text-align:center;line-height:1em;background:#fff}input[type=checkbox].c-checkbox:checked{outline:1px solid var(--primary-600, #00A3FF)!important;background-color:var(--primary-50, #EAF8FF)}input[type=checkbox].c-checkbox:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:3px;padding-top:10px;padding-right:0}.filtercard{display:flex;height:68px;padding:6px 8px 6px 16px;justify-content:center;align-items:center;gap:8px;align-self:stretch;border-radius:4px;border-left:2px solid var(--Primary-600, #00A3FF);background:var(--Gray-100, #F2F4F7);box-shadow:0 4px 16px #0000001a}.selectedtext{color:var(--Gray-500, #667085);font-size:14px;font-style:normal;font-weight:600;line-height:140%}a.disabled{pointer-events:none;opacity:.6}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i3.CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.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: i5.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i7.ReactiveSelectComponent, selector: "lib-reactive-select", inputs: ["idField", "nameField", "label", "data"], outputs: ["itemChange"] }, { kind: "component", type: i8.MonthlyperformanceDatepickerComponent, selector: "lib-monthlyperformance-datepicker", inputs: ["monthlyperformce"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i6.DatePipe, name: "date" }] });
727
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DashboardInfoComponent, selector: "lib-dashboard-info", ngImport: i0, template: "<div *ngIf=\"receivedData === 'Checklist'\" class=\"card mb-3\">\r\n <div class=\"card-body pt-2 pb-1\">\r\n <div class=\"d-flex flex-column\">\r\n <div class=\"d-flex flex-wrap my-2 pe-2\">\r\n <a [routerLink]=\"['/manage/trax/dashboard']\" [queryParams]=\"{type: 'Checklist'}\" class=\"d-flex align-items-center me-3 cursor-pointer\">\r\n <span><svg width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_d_987_30898)\">\r\n <rect x=\"2\" y=\"1\" width=\"40\" height=\"40\" rx=\"8\" fill=\"white\" />\r\n <rect x=\"2.5\" y=\"1.5\" width=\"39\" height=\"39\" rx=\"7.5\" stroke=\"#D0D5DD\" />\r\n <path\r\n d=\"M27.8346 21.0001H16.168M16.168 21.0001L22.0013 26.8334M16.168 21.0001L22.0013 15.1667\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_987_30898\" x=\"0\" y=\"0\" width=\"44\" height=\"44\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\"\r\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\" />\r\n <feOffset dy=\"1\" />\r\n <feGaussianBlur stdDeviation=\"1\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_987_30898\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_987_30898\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n </a>\r\n\r\n <form class=\"mt-1 me-3 cursor-pointer\" style=\"min-width: 200px;\" [formGroup]=\"form\">\r\n <!-- <div class=\"col-md-4 w-200px\"> -->\r\n <lib-select *ngIf=\"refreshDropdown\" [items]=\"checklistDropdown\" [multi]=\"false\" [searchField]=\"'checkListName'\"\r\n [idField]=\"'_id'\" [selectedValues]=\"[selectedChecklist]\" (selected)=\"onChecklistSelect($event)\">\r\n </lib-select>\r\n <!-- <ng-template let-item>\r\n <div class=\"d-flex justify-content-between align-items-center no-border-custom-select\">\r\n <span>{{ item.checkListName }}</span>\r\n <span class=\"d-flex align-items-center\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M4 6L8 10L12 6\" stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </ng-template> -->\r\n \r\n\r\n <!-- <lib-reactive-select [formControl]=\"checklistselectControl\" [idField]=\"'_id'\"\r\n [nameField]=\"'checkListName'\" [data]=\"checklistDropdown\" class=\"w-100 \"\r\n style=\"border: none !important; box-shadow: none !important;\"\r\n (valueChange)=\"onValueChangeChecklist($event)\">\r\n <ng-template let-item>\r\n <div class=\"d-flex justify-content-between align-items-center no-border-custom-select\">\r\n <span>{{ item.checkListName }}</span>\r\n <span class=\"d-flex align-items-center\">\r\n \r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path d=\"M4 6L8 10L12 6\" stroke=\"#101828\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </ng-template>\r\n </lib-reactive-select> -->\r\n <!-- </div> -->\r\n </form>\r\n <div class=\"checklist-details d-flex flex-wrap mt-3\">\r\n <!-- <div class=\"d-flex align-items-center grey-badge me-3 my-3\">\r\n {{ selectedChecklist?.checkListName }}\r\n </div> -->\r\n\r\n <div class=\"d-flex align-items-center mb-2\">\r\n <span *ngIf=\"selectedChecklist?.publish\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M7.9987 14.6666C11.6806 14.6666 14.6654 11.6818 14.6654 7.99992C14.6654 4.31802 11.6806 1.33325 7.9987 1.33325C4.3168 1.33325 1.33203 4.31802 1.33203 7.99992C1.33203 11.6818 4.3168 14.6666 7.9987 14.6666Z\"\r\n fill=\"#12B76A\" />\r\n </svg>\r\n </span>\r\n\r\n <span *ngIf=\"!selectedChecklist?.publish\">\r\n <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.9987 13.6666C10.6806 13.6666 13.6654 10.6818 13.6654 6.99992C13.6654 3.31802 10.6806 0.333252 6.9987 0.333252C3.3168 0.333252 0.332031 3.31802 0.332031 6.99992C0.332031 10.6818 3.3168 13.6666 6.9987 13.6666Z\"\r\n fill=\"#F04438\" />\r\n </svg>\r\n </span>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center me-3 checklisttext\">\r\n <span><svg class=\"mx-2 mb-1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M13.3346 14V12.6667C13.3346 11.9594 13.0537 11.2811 12.5536 10.781C12.0535 10.281 11.3752 10 10.668 10H5.33464C4.62739 10 3.94911 10.281 3.44902 10.781C2.94892 11.2811 2.66797 11.9594 2.66797 12.6667V14M10.668 4.66667C10.668 6.13943 9.47406 7.33333 8.0013 7.33333C6.52854 7.33333 5.33464 6.13943 5.33464 4.66667C5.33464 3.19391 6.52854 2 8.0013 2C9.47406 2 10.668 3.19391 10.668 4.66667Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg><span class=\"mt-2\">{{ selectedChecklist?.createdByName }}</span></span>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center me-3 checklisttext\">\r\n <span><svg class=\"mx-2 mb-1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M12 3H13.5C13.8978 3 14.2794 3.15804 14.5607 3.43934C14.842 3.72064 15 4.10218 15 4.5V15C15 15.3978 14.842 15.7794 14.5607 16.0607C14.2794 16.342 13.8978 16.5 13.5 16.5H4.5C4.10218 16.5 3.72064 16.342 3.43934 16.0607C3.15804 15.7794 3 15.3978 3 15V4.5C3 4.10218 3.15804 3.72064 3.43934 3.43934C3.72064 3.15804 4.10218 3 4.5 3H6M6.75 1.5H11.25C11.6642 1.5 12 1.83579 12 2.25V3.75C12 4.16421 11.6642 4.5 11.25 4.5H6.75C6.33579 4.5 6 4.16421 6 3.75V2.25C6 1.83579 6.33579 1.5 6.75 1.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{ selectedChecklist?.storeCount?.toLocaleString('en-US', { minimumFractionDigits: 0\r\n }) || '--' }} {{selectedChecklist?.coverage === 'store' ? 'Stores' : 'Users'}}</span>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center me-3 checklisttext\">\r\n <span><svg class=\"mx-2 mb-1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M12 1.5V4.5M6 1.5V4.5M2.25 7.5H15.75M3.75 3H14.25C15.0784 3 15.75 3.67157 15.75 4.5V15C15.75 15.8284 15.0784 16.5 14.25 16.5H3.75C2.92157 16.5 2.25 15.8284 2.25 15V4.5C2.25 3.67157 2.92157 3 3.75 3Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>Repeats {{selectedChecklist?.scheduleRepeatedType === 'onetime' ? 'Single' : (selectedChecklist?.scheduleRepeatedType || '--' )}}</span>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center me-3 checklisttext\">\r\n <span><svg class=\"mx-2 mb-1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_987_30895)\">\r\n <path\r\n d=\"M9 4.5V9L12 10.5M16.5 9C16.5 13.1421 13.1421 16.5 9 16.5C4.85786 16.5 1.5 13.1421 1.5 9C1.5 4.85786 4.85786 1.5 9 1.5C13.1421 1.5 16.5 4.85786 16.5 9Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_987_30895\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg> {{ selectedChecklist?.scheduleStartTime?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) || '--' }} - {{\r\n selectedChecklist?.scheduleEndTime?.toLocaleString('en-US', { minimumFractionDigits: 0 }) ||\r\n '--' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <!--end::Info-->\r\n </div>\r\n </div>\r\n</div>\r\n<div *ngIf=\"receivedData === 'User'\" class=\"card mb-5\">\r\n <div class=\"card-body pt-2 pb-1\">\r\n <div class=\"d-flex flex-column\">\r\n <div class=\"d-flex flex-wrap my-2 pe-2\">\r\n <a [routerLink]=\"['/manage/trax/dashboard']\" [queryParams]=\"{type: 'user'}\" class=\"d-flex align-items-center me-3 cursor-pointer\">\r\n <span><svg width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_d_987_30898)\">\r\n <rect x=\"2\" y=\"1\" width=\"40\" height=\"40\" rx=\"8\" fill=\"white\" />\r\n <rect x=\"2.5\" y=\"1.5\" width=\"39\" height=\"39\" rx=\"7.5\" stroke=\"#D0D5DD\" />\r\n <path\r\n d=\"M27.8346 21.0001H16.168M16.168 21.0001L22.0013 26.8334M16.168 21.0001L22.0013 15.1667\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_987_30898\" x=\"0\" y=\"0\" width=\"44\" height=\"44\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\"\r\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\" />\r\n <feOffset dy=\"1\" />\r\n <feGaussianBlur stdDeviation=\"1\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_987_30898\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_987_30898\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n </a>\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label bg-light-primary text-primary me-2 mt-2\">\r\n {{ selectedUser?.userNameChar }}\r\n </span>\r\n </div>\r\n <form class=\"mt-1 me-3 cursor-pointer\" style=\"min-width: 200px;\" [formGroup]=\"form\"> \r\n <lib-select *ngIf=\"refreshuserDropdown\"\r\n [items]=\"userlistDropdown\" \r\n [multi]=\"false\" \r\n [searchField]=\"'userName'\" \r\n [idField]=\"'userEmail'\" \r\n [selectedValues]=\"[selectedUser]\" \r\n (selected)=\"onUserSelect($event)\" \r\n >\r\n <!-- <ng-template let-item>\r\n <div class=\"d-flex justify-content-between align-items-center no-border-custom-select\">\r\n <span>{{ item.userName }}</span>\r\n <span class=\"d-flex align-items-center\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M4 6L8 10L12 6\" stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </ng-template> -->\r\n </lib-select>\r\n <!-- <div class=\"col-md-4 w-200px\">\r\n <lib-reactive-select [formControl]=\"userlistselectControl\" [idField]=\"'userEmail'\"\r\n [nameField]=\"'userName'\" [data]=\"userlistDropdown\" class=\"w-100\"\r\n style=\"border: none !important; box-shadow: none !important;\"\r\n (valueChange)=\"onValueChangeUserChecklist($event)\">\r\n <ng-template let-item>\r\n <div class=\"d-flex justify-content-between align-items-center no-border-custom-select\">\r\n <span>{{ item.userName }}</span>\r\n <span class=\"d-flex align-items-center\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M4 6L8 10L12 6\" stroke=\"#101828\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </ng-template>\r\n </lib-reactive-select>\r\n </div> -->\r\n </form>\r\n\r\n <div *ngIf=\"selectedUser?.role\" class=\"checklist-details d-flex flex-wrap mt-2\">\r\n <div class=\"d-flex align-items-center badge badge-light-primary me-3 my-3\">\r\n {{ selectedUser?.role }}\r\n </div>\r\n </div>\r\n </div>\r\n <!--end::Info-->\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"col-md-12\">\r\n <div class=\"row\">\r\n <div class=\"col-9\">\r\n <div *ngIf=\"receivedData === 'Checklist' || receivedData === 'User'\" class=\"row\">\r\n <div class=\"col-4\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Total instances\r\n </div>\r\n <div class=\"row mt-5\">\r\n <div class=\"col-md-10 infocount mb-6\">{{ infoCardsData?.totalInstances?.count !==null ?\r\n infoCardsData?.totalInstances?.count.toLocaleString('en-US', { minimumFractionDigits: 0 }) :\r\n '--'}}\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.totalInstances?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.totalInstances?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\">\r\n\r\n <span class=\"percent-value\">{{\r\n infoComparisonCardsData?.totalInstances?.comparisonData !==null\r\n ?infoComparisonCardsData?.totalInstances?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span>\r\n <span class=\"week-font\"> vs last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1\">\r\n <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='daily' ? 'text-primary' :''\"\r\n (click)=\"dateValue('daily')\">1D</div>\r\n <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='weekly' ? 'text-primary' :''\"\r\n (click)=\"dateValue('weekly')\">1W</div>\r\n <div *ngIf=\"traxMonthlyComparisonData\" class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='monthly' ? 'text-primary' :''\"\r\n (click)=\"dateValue('monthly')\">1M</div>\r\n <!-- <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='monthly' ? 'text-primary' :''\" (click)=\"dateValue('monthly')\">1M</div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-4\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Completed instances\r\n </div>\r\n <div class=\"row mt-5\">\r\n <div class=\"infocount mb-6\">{{ infoCardsData?.completedInstances?.count !==null ?\r\n infoCardsData?.completedInstances?.count.toLocaleString('en-US', { minimumFractionDigits: 0\r\n }) : '--' }}\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.completedInstances?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.completedInstances?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\">\r\n <span class=\"percent-value\">{{\r\n infoComparisonCardsData?.completedInstances?.comparisonData !==null\r\n ?infoComparisonCardsData?.completedInstances?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span>\r\n <span class=\"week-font\"> vs last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-4\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Flags\r\n </div>\r\n <div class=\"row mt-5\">\r\n <div class=\"infocount mb-6\">{{ infoCardsData?.flags?.count !==null ?\r\n infoCardsData?.flags?.count.toLocaleString('en-US', { minimumFractionDigits: 0 }) : '--' }}\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.flags?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.flags?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\">\r\n <span class=\"percent-value\">{{ infoComparisonCardsData?.flags?.comparisonData\r\n !==null ? infoComparisonCardsData?.flags?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span>\r\n <span class=\"week-font\"> vs last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span>\r\n </span>\r\n </div>\r\n <!-- <div class=\"avgcount\">Avg Flag Rate : {{ infoCardsData.flags.count ? '50%' : 'N/A' }}</div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"receivedData === 'Checklist'\" class=\"row my-3\">\r\n <div class=\"col-6\">\r\n <div class=\"subinfocard\">\r\n <div class=\"headingcard\">\r\n Completion Score\r\n </div>\r\n\r\n <div class=\"infocount\">\r\n {{ infoCardsData?.completionScore?.count !==null ?\r\n infoCardsData?.completionScore?.count.toLocaleString('en-US', { minimumFractionDigits: 0 })\r\n : '--' }}%\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.completionScore?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.completionScore?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\">\r\n <span class=\"percent-value\">{{\r\n infoComparisonCardsData?.completionScore?.comparisonData !==null ?\r\n infoComparisonCardsData?.completionScore?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }} %</span>\r\n <span class=\"week-font\"> vs last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-6\">\r\n <div class=\"subinfocard\">\r\n <div class=\"headingcard\">\r\n Compliance Rate\r\n </div>\r\n <div class=\"infocount\">\r\n\r\n {{ infoCardsData?.complianceRate?.count !==null ?\r\n infoCardsData?.complianceRate?.count.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }} %\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.complianceRate?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.complianceRate?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\">\r\n <span class=\"percent-value\">{{\r\n infoComparisonCardsData?.complianceRate?.comparisonData !==null\r\n ?infoComparisonCardsData?.complianceRate?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span>\r\n <span class=\"week-font\"> vs last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"receivedData === 'User'\" class=\"row my-3\">\r\n <div class=\"col-6\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Completion Score\r\n </div>\r\n <div class=\"row mt-5\">\r\n <div class=\"infocount mb-6\">{{ infoCardsData?.completionScore?.count !==null ?\r\n infoCardsData?.completionScore?.count.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--'}} %\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.completionScore?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.completionScore?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\"><span class=\"percent-value\">{{\r\n infoComparisonCardsData?.completionScore?.comparisonData !==null ?\r\n infoComparisonCardsData?.completionScore?.comparisonData.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span><span class=\"week-font\"> vs last\r\n <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-6\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Compliance Rate\r\n </div>\r\n <div class=\"row mt-5\">\r\n <div class=\"infocount mb-6\">{{ infoCardsData?.complianceRate?.count !==null ?\r\n infoCardsData?.complianceRate?.count.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }} %\r\n <div>\r\n <span *ngIf=\"infoComparisonCardsData?.complianceRate?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.complianceRate?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\"><span class=\"percent-value\">{{\r\n infoComparisonCardsData?.complianceRate?.comparisonData !==null ?\r\n infoComparisonCardsData?.complianceRate?.comparisonData.toLocaleString('en-US',\r\n { minimumFractionDigits: 0 }) :\r\n '--'}}%</span><span class=\"week-font\"> vs last <span\r\n *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span></span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n <!-- <div class=\"col-4\">\r\n <div class=\"totalinfocard\">\r\n <div class=\"headingcard\">\r\n Assigned Tasks\r\n </div>\r\n <div class=\"infocount\"><u>6</u>\r\n <div><span class=\"mt-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\"\r\n height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg></span><span class=\"mt-2 ms-2\"><span class=\"percent-value\">13%</span><span\r\n class=\"week-font\"> vs\r\n last week</span></span></div>\r\n <div class=\"actiondownload\">View All </div>\r\n </div>\r\n \r\n \r\n </div>\r\n </div> -->\r\n </div>\r\n\r\n <!-- <ng-container *ngIf=\"infoCardDataLoading\">\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"infoCardNoData && !infoCardDataLoading\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 my-6\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodatamaintext mt-3\">No data found</div>\r\n <div class=\"nodatasubtext\">There is no result for Checklist Performance Table\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> -->\r\n\r\n </div>\r\n\r\n\r\n <div *ngIf=\"receivedData === 'Checklist' || receivedData === 'User'\" class=\"col-3\">\r\n <lib-monthlyperformance-datepicker\r\n [monthlyperformce]=\"selectedSourceCheckListId\"></lib-monthlyperformance-datepicker>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"receivedData === 'Store'\" class=\"row mb-4 d-flex justify-content-between align-items-stretch\">\r\n <div class=\"col-2 px-2\">\r\n <div class=\"card card-border pt-2 h-100\">\r\n <div class=\"card-header ellipse1 border-0 px-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"cardcount\">{{ infoCardsData?.activeUnique !==null ?\r\n infoCardsData?.activeUnique?.toLocaleString('en-US', { minimumFractionDigits: 0 }) : '--'\r\n }}</span>\r\n <span class=\"cardtext\">Active Checklists</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-body p-0\">\r\n <div class=\"h-auto py-3 px-3\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.totalInstances?.count !==null ?\r\n infoCardsData?.totalInstances?.count?.toLocaleString('en-US', { minimumFractionDigits: 0 }) :\r\n '--' }}</div>\r\n <div class=\"cardtext\">Checklist Instances</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-5 px-2\">\r\n <div class=\"card card-border pt-2 h-100\">\r\n <div class=\"card-header ellipse1 border-0 px-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"cardcount\">{{ infoCardsData?.notSubmittedInstances?.count !==null ?\r\n infoCardsData?.notSubmittedInstances?.count?.toLocaleString('en-US', { minimumFractionDigits: 0\r\n }) : '--' }}</span>\r\n <span class=\"cardtext\">Not Submitted Checklists</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-body p-0\">\r\n <div class=\"row h-auto py-3 px-3\">\r\n <div class=\"col-md-6\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.notSubmittedInstances?.open !==null ?\r\n infoCardsData?.notSubmittedInstances?.open?.toLocaleString('en-US', { minimumFractionDigits:\r\n 0 }) : '--' }}</div>\r\n <div class=\"cardtext\">Open Checklists</div>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.notSubmittedInstances?.inprogress !==null ?\r\n infoCardsData?.notSubmittedInstances?.inprogress?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }}</div>\r\n <div class=\"cardtext\">In Progress Checklists</div>\r\n </div>\r\n <!-- <div class=\"col-md-4\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.notSubmittedInstances?.delay ?\r\n infoCardsData?.notSubmittedInstances?.delay.toLocaleString('en-US', { minimumFractionDigits:\r\n 0 }) : '--' }}</div>\r\n <div class=\"cardtext\">Delay in Submission</div>\r\n </div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-5 px-2\">\r\n <div class=\"card card-border pt-2 h-100\">\r\n <div class=\"card-header ellipse1 border-0 px-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"cardcount\">{{ infoCardsData?.completedInstances?.count !==null ?\r\n infoCardsData?.completedInstances?.count?.toLocaleString('en-US', { minimumFractionDigits: 0 }) :\r\n '--' }}</span>\r\n <span class=\"cardtext\">Submitted Checklists</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-body p-0\">\r\n <div class=\"row h-auto py-3 px-3\">\r\n <div class=\"col-md-11\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.completionScore?.count !==null ?\r\n infoCardsData?.completionScore?.count?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 })\r\n : '--' }}%</div>\r\n <div class=\"cardtext\">Completion Score</div>\r\n <div class=\"mt-2\">\r\n <span *ngIf=\"infoComparisonCardsData?.completionScore?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.completionScore?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\"><span class=\"percent-value\">{{\r\n infoComparisonCardsData?.completionScore?.comparisonData !==null?\r\n infoComparisonCardsData?.completionScore?.comparisonData?.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span><span class=\"week-font\"> vs\r\n last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-4\">\r\n <div class=\"cardsubcount my-2\">{{ infoCardsData?.complianceRate?.count !==null ?\r\n infoCardsData?.complianceRate?.count?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }}%</div>\r\n <div class=\"cardtext\">Compliance Score</div>\r\n <div class=\"mt-2\">\r\n <span *ngIf=\"infoComparisonCardsData?.complianceRate?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.complianceRate?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\"><span class=\"percent-value\">{{\r\n infoComparisonCardsData?.complianceRate?.comparisonData !==null?\r\n infoComparisonCardsData?.complianceRate?.comparisonData?.toLocaleString('en-US',\r\n {\r\n minimumFractionDigits: 0 }) : '--' }}%</span><span class=\"week-font\"> vs\r\n last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span></span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-4\">\r\n <div *ngIf=\"infoCardsData?.flags?.count; else noDataFlagged\" [routerLink]=\"['/manage/trax/flags']\" class=\"cardsubcount my-2 cursor-pointer\">\r\n <u>{{\r\n infoCardsData?.flags?.count !==null ?\r\n infoCardsData?.flags?.count?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }}</u></div>\r\n <ng-template #noDataFlagged>\r\n <div class=\"cardsubcount my-2\">--</div>\r\n </ng-template>\r\n <div class=\"cardtext\">Total Flags</div>\r\n <div class=\"mt-2\">\r\n <span *ngIf=\"infoComparisonCardsData?.flags?.comparisonData\">\r\n <span class=\"mt-2\"\r\n *ngIf=\"infoComparisonCardsData?.flags?.ComparisonFlag; else showArrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_3216_118)\">\r\n <path d=\"M11.5 3L6.75 7.75L4.25 5.25L0.5 9M11.5 3H8.5M11.5 3V6\"\r\n stroke=\"#039855\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <ng-template #showArrow2>\r\n <span class=\"arrow2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\"\r\n viewBox=\"0 0 18 18\" fill=\"none\" class=\"ng-star-inserted\">\r\n <g clip-path=\"url(#clip0_2328_4654)\">\r\n <path d=\"M11.5 9L6.75 4.25L4.25 6.75L0.5 3M11.5 9H8.5M11.5 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2328_4654\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"></rect>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </ng-template>\r\n </span>\r\n <span class=\"mt-2 ms-2\"><span class=\"percent-value\">{{\r\n infoComparisonCardsData?.flags?.comparisonData !==null ?\r\n infoComparisonCardsData?.flags?.comparisonData?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }}%</span><span class=\"week-font\"> vs\r\n last <span *ngIf=\"dateType ==='daily'\">day</span><span\r\n *ngIf=\"dateType ==='weekly'\">week</span> <span\r\n *ngIf=\"dateType ==='monthly'\">month</span></span></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-md-1 mt-3\">\r\n <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='daily' ? 'text-primary' :''\"\r\n (click)=\"dateValue('daily')\">1D</div>\r\n <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='weekly' ? 'text-primary' :''\"\r\n (click)=\"dateValue('weekly')\">1W</div>\r\n <div *ngIf=\"traxMonthlyComparisonData\" class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='monthly' ? 'text-primary' :''\"\r\n (click)=\"dateValue('monthly')\">1M</div>\r\n <!-- <div class=\"mt-1 cursor-pointer fs-5\" [ngClass]=\"dateType ==='monthly' ? 'text-primary' :''\" (click)=\"dateValue('monthly')\">1M</div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<div class=\"row\">\r\n <div class=\"col-lg-12\">\r\n <div class=\"card\">\r\n <div class=\"col-lg-12\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <!-- {{receivedData}} -->\r\n <span class=\"card-label mb-2\">Checklist Info <span class=\"badge badge-light-primary\">{{totalItems}} Total</span></span>\r\n <span class=\"text-sub mb-2\"> Based on {{ headerData?.date?.startDate | date: 'MMM d' }} - {{\r\n headerData?.date?.endDate | date: 'MMM d, y' }}\r\n </span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div>\r\n <form class=\"mt-1\" [formGroup]=\"form\">\r\n <div class=\"col-md-4 w-200px\">\r\n <lib-reactive-select [formControl]=\"selectedlistselectControl\" [idField]=\"'_id'\"\r\n [nameField]=\"'label'\" [data]=\"statusselectControl\" class=\"w-200px\"\r\n (valueChange)=\"onValueChangeStatusSelect($event)\">\r\n <ng-template let-item>\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <span>{{ item.label }}</span>\r\n <span class=\"d-flex align-items-center\">\r\n <!-- <span class=\"status-text\">Status</span> -->\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#344054\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </ng-template>\r\n </lib-reactive-select>\r\n </div>\r\n </form>\r\n </div>\r\n <div *ngIf=\"receivedData === 'Checklist'\"\r\n class=\"d-flex align-items-center position-relative\">\r\n <span class=\"svg-icon footfallsearch svg-icon-1 position-absolute ms-8\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\">\r\n </rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <!-- [disabled]=\"searchDisabled\" -->\r\n <input [(ngModel)]=\"searchInput\" type=\"text\"\r\n class=\"form-control ps-14 ms-4 footfallsearch\" placeholder=\"Search\"\r\n autocomplete=\"off\" (keyup.enter)=\"searchField()\" />\r\n <button type=\"button\" (click)=\"onExport()\"\r\n class=\"btn-outline btn align-items-end text-nowrap invheader ms-4\"\r\n [disabled]=\"!infoChecklistData.length\">\r\n <!-- Export Icon -->\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </svg>\r\n <span class=\"ms-2\"></span> Export\r\n </button> \r\n \r\n </div>\r\n <div *ngIf=\"receivedData !== 'Checklist'\"\r\n class=\"d-flex align-items-center position-relative\">\r\n <span class=\"svg-icon footfallsearch svg-icon-1 position-absolute ms-8\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\">\r\n </rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <!-- [disabled]=\"searchDisabled\" -->\r\n <input [(ngModel)]=\"searchInput\" type=\"text\"\r\n class=\"form-control ps-14 ms-4 footfallsearch\" placeholder=\"Search by checklist\"\r\n autocomplete=\"off\" (keyup.enter)=\"searchField()\" />\r\n <button type=\"button\" (click)=\"onExport()\"\r\n class=\"btn-outline btn align-items-end text-nowrap invheader ms-4\"\r\n [disabled]=\"!infoChecklistData.length\">\r\n <!-- Export Icon -->\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </svg>\r\n <span class=\"ms-2\"></span> Export\r\n </button>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.TangoTrax_checklist_isAdd\">\r\n <a [routerLink]=\"['/manage/trax/createChecklist']\" *ngIf=\"receivedData === 'Store'\"\r\n type=\"button\" class=\"btn btn-primary ms-4 rounded-3 text-nowrap ng-star-inserted\"\r\n tabindex=\"0\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\r\n </svg><span class=\"ms-2 text-white\">Create Checklist</span></a>\r\n </div>\r\n <!-- <div >\r\n <a (click)=\"sendAlert()\"\r\n type=\"button\" class=\"btn btn-primary ms-4 rounded-3 text-nowrap ng-star-inserted\"\r\n tabindex=\"0\"><span class=\"ms-2 text-white\">Send Alert</span></a>\r\n </div> -->\r\n <div>\r\n <a (click)=\"sendAlert()\"\r\n type=\"button\"\r\n class=\"btn btn-primary ms-4 rounded-3 text-nowrap ng-star-inserted\"\r\n [class.disabled]=\"!isSendAlertEnabled\"\r\n [attr.aria-disabled]=\"!isSendAlertEnabled\"\r\n [tabindex]=\"isSendAlertEnabled ? 0 : -1\">\r\n <span class=\"ms-2 text-white\">Send Alert</span>\r\n </a>\r\n </div>\r\n \r\n\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectAll\" class=\"filtercard m-4\">\r\n <span><svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#DAF1FF\"/>\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#EAF8FF\" stroke-width=\"4\"/>\r\n <g clip-path=\"url(#clip0_6978_12777)\">\r\n <path d=\"M24.6654 17.3867V18.0001C24.6645 19.4377 24.199 20.8365 23.3383 21.988C22.4775 23.1394 21.2676 23.9817 19.8889 24.3893C18.5103 24.797 17.0369 24.748 15.6883 24.2498C14.3398 23.7516 13.1885 22.8308 12.406 21.6248C11.6235 20.4188 11.2519 18.9921 11.3465 17.5576C11.4411 16.1231 11.9968 14.7576 12.9309 13.6648C13.8649 12.572 15.1272 11.8103 16.5295 11.4935C17.9318 11.1767 19.3989 11.3216 20.712 11.9067M24.6654 12.6667L17.9987 19.3401L15.9987 17.3401\" stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_6978_12777\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\" transform=\"translate(10 10)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <span class=\"selectedtext ms-2\">All {{ totalItems }} Users on this page are selected.</span></span>\r\n </div>\r\n <!-- <span class=\"table-title-primary mx-2\">Select all {{ totalItems }} Users filtered</span><span class=\"selectedtext ms-2\">Alerts will only send for Open and Inprogress</span></span> -->\r\n \r\n <div class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n\r\n <table *ngIf=\"!checklistLoading && !checklistNoData\" class=\"table text-nowrap bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>\r\n <input class=\"form-check-input h-14px w-14px c-checkbox\"\r\n type=\"checkbox\"\r\n [(ngModel)]=\"selectAll\"\r\n [disabled]=\"!isTodaySelected || selectedlistselectControl.value === 'submit'\"\r\n (change)=\"toggleSelectAll()\"\r\n />\r\n \r\n </th>\r\n <th *ngIf=\"receivedData === 'Checklist' || receivedData === 'User' \"\r\n class=\"cursor-pointer\" (click)=\"sortData('date_string')\">Date\r\n <svg [ngClass]=\"sortColumName === 'date_string' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'date_string' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"receivedData === 'Store' || receivedData === 'User'\"\r\n class=\"cursor-pointer\" (click)=\"sortData('checkListName')\">CheckList Name\r\n <svg [ngClass]=\"sortColumName === 'checkListName' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'date_string' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"(receivedData === 'Checklist' || receivedData === 'User')\"\r\n class=\"cursor-pointer\" (click)=\"sortData('storeName')\">Store Name\r\n <svg [ngClass]=\"sortColumName === 'storeName' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'storeName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"(receivedData === 'Checklist' || receivedData === 'User')\"\r\n class=\"cursor-pointer\" (click)=\"sortData('userName')\">User Name\r\n <svg [ngClass]=\"sortColumName === 'userName' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th>Status</th>\r\n <!-- <th *ngIf=\"selectedChecklist?.coverage === 'store'\">User Name</th> -->\r\n <th *ngIf=\"receivedData !== 'User'\">Submitted By</th>\r\n <th class=\"cursor-pointer\" (click)=\"sortData('submitTime_string')\">Submitted On\r\n <svg [ngClass]=\"sortColumName === 'submitTime_string' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'submitTime_string' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"sortData('submitCount')\" >Submission Count\r\n <svg [ngClass]=\"sortColumName === 'submitCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'submitCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th>Flags</th>\r\n <th >Approved By</th>\r\n <!-- class=\"cursor-pointer\" (click)=\"sortData('approvalTime')\" -->\r\n <th >Approved On\r\n <!-- <svg [ngClass]=\"sortColumName === 'approvalTime' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\"\r\n viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'approvalTime' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> -->\r\n </th>\r\n <th>Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of infoChecklistData\">\r\n <td>\r\n <input class=\"form-check-input h-14px w-14px c-checkbox\"\r\n type=\"checkbox\"\r\n [(ngModel)]=\"item.selected\"\r\n [disabled]=\"!isTodaySelected || item.checklistStatus === 'Submitted'\"\r\n (change)=\"updateSelectAllState()\"\r\n />\r\n </td>\r\n <td *ngIf=\"receivedData === 'Checklist' || receivedData === 'User' \">\r\n <div class=\"table-title\">{{ item.date_string }}</div>\r\n </td>\r\n <td *ngIf=\"receivedData === 'Store' || receivedData === 'User'\">\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label bg-light-primary text-primary me-2\">\r\n {{ item.checkListChar || '--' }}\r\n </span>\r\n </div>\r\n <span class=\"table-titlechecklist\">{{\r\n item.checkListName }}</span>\r\n </td>\r\n\r\n <td *ngIf=\"receivedData === 'Checklist' || receivedData === 'User'\">\r\n <div class=\"table-title\">{{ item?.coverage === 'store' ? item.storeName : '--' }}</div>\r\n </td>\r\n <td *ngIf=\"(receivedData === 'Checklist' || receivedData === 'User')\">\r\n <div class=\"table-title\">{{ item.userName }}</div>\r\n </td>\r\n <td class=\"table-title\">\r\n <span class=\"badge\" [ngClass]=\"{\r\n 'badge-light-success': item.checklistStatus === 'Submitted',\r\n 'badge-light-warning': item.checklistStatus === 'In Progress',\r\n 'badge-light-primary': item.checklistStatus === 'Open',\r\n 'badge-light-danger': item.checklistStatus === 'delayed'\r\n }\"><span *ngIf=\"item.redoStatus\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"14\" viewBox=\"0 0 12 14\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_7166_57025)\">\r\n <path \r\n d=\"M0.5 2.66674V5.91674M0.5 5.91674H3.5M0.5 5.91674L2.82 3.55507C3.51046 2.80834 4.40623 2.32493 5.37234 2.17768C6.33845 2.03042 7.32257 2.22731 8.17642 2.73865C9.03026 3.25 9.70758 4.04812 10.1063 5.01275C10.505 5.97738 10.6036 7.05627 10.3871 8.08685C10.1706 9.11744 9.65084 10.0439 8.90606 10.7266C8.16129 11.4093 7.23187 11.8113 6.25786 11.8721C5.28384 11.9328 4.31799 11.649 3.50583 11.0633C2.69367 10.4777 2.0792 9.62195 1.755 8.62507\"\r\n [attr.stroke]=\"getSvgColor(item.checklistStatus)\"\r\n stroke-width=\"2\" \r\n stroke-linecap=\"round\" \r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_7166_57025\">\r\n <rect width=\"12\" height=\"13\" fill=\"white\" transform=\"translate(0 0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>{{ item.checklistStatus | titlecase }}</span>\r\n </td>\r\n <td *ngIf=\"receivedData !== 'User'\">\r\n <div class=\"table-title\">{{ item.userEmail }}</div>\r\n </td>\r\n \r\n <td>\r\n <div class=\"table-title\">{{ item.submitTime_string?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) || '--' }}</div>\r\n </td>\r\n <td >\r\n <div class=\"table-title\">{{ item?.submitCount || 0}}</div>\r\n </td>\r\n\r\n <td>\r\n <div class=\"table-title\">\r\n {{ item.flaggedChecklist !==null ? item?.flaggedChecklist?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) : '--' }}\r\n </div>\r\n </td>\r\n\r\n <td>\r\n <div class=\"table-title\">{{ item.approvalByEmail || \"--\" }}</div>\r\n </td>\r\n <td>\r\n <div class=\"table-title\">{{ item.approvalTime_string?.toLocaleString('en-US', {\r\n minimumFractionDigits: 0 }) || '--' }}</div>\r\n </td>\r\n\r\n <td>\r\n <div class=\"table-title d-flex\">\r\n <ng-container *ngIf=\"item.checklistStatus === 'Submitted'\">\r\n <!-- <span [routerLink]=\"['/manage/trax/gallery']\"\r\n [queryParams]=\"{ storeId: item.store_id, checklistType: item.checkListType, ChecklistDate: item.checklistDate, checklistId: item.sourceCheckList_id }\"\r\n class=\"actionview me-4 cursor-pointer\">View</span> -->\r\n <span (click)=\"navigateToGallery(item)\"\r\n class=\"actionview me-4 cursor-pointer\">View</span>\r\n <span (click)=\"download('pdf',item )\"\r\n class=\"actiondownload cursor-pointer\">Download</span>\r\n </ng-container>\r\n \r\n <ng-container>\r\n <span *ngIf=\"checklistInfoDate === item.date_string && !item.reinitiateStatus && item.checklistStatus !== 'Submitted' && item.timeFlag > 0\"\r\n (click)=\"reinitiate(item._id)\" class=\"actiondownload cursor-pointer\">\r\n Reinitiate\r\n </span>\r\n <span *ngIf=\"checklistInfoDate === item.date_string && item.reinitiateStatus && item.checklistStatus !== 'Submitted' && item.timeFlag > 0\"\r\n class=\"actionview disabled\">\r\n Reinitiate\r\n </span>\r\n\r\n <span \r\n *ngIf=\"checklistInfoDate === item.date_string && item.reinitiateStatus && item.checklistStatus !== 'Submitted' && item.timeFlag > 0\"\r\n (click)=\"sendAlert(item._id)\" \r\n class=\"actiondownload cursor-pointer ms-3\">\r\n SendAlert\r\n </span>\r\n </ng-container>\r\n \r\n <ng-container>\r\n <div *ngIf=\"item.checklistStatus !== 'Submitted' && item.timeFlag <= 0\" \r\n [class.disabled]=\"item.date_string !== todayDate || selectedCheckboxCount > 1\"\r\n [attr.aria-disabled]=\"item.date_string !== todayDate || selectedCheckboxCount > 1\"\r\n [tabindex]=\"item.date_string !== todayDate || selectedCheckboxCount > 1 ? -1 : 0\">\r\n <span \r\n (click)=\"(item.date_string === todayDate && selectedCheckboxCount <= 1) ? sendAlert(item._id) : $event.stopPropagation()\"\r\n class=\"actiondownload cursor-pointer\">\r\n SendAlert\r\n </span>\r\n </div>\r\n </ng-container>\r\n \r\n <!-- <ng-container>\r\n <div *ngIf=\"checklistInfoDate === item.date_string && item.checklistStatus !== 'Submitted' && isTodaySelected\"\r\n [class.disabled]=\"selectedCheckboxCount > 1\"\r\n [attr.aria-disabled]=\"selectedCheckboxCount > 1\" \r\n [tabindex]=\"selectedCheckboxCount > 1 ? -1 : 0\">\r\n <span (click)=\"selectedCheckboxCount <= 1 ? sendAlert(item._id) : $event.stopPropagation()\"\r\n class=\"actiondownload cursor-pointer\">\r\n SendAlert\r\n </span>\r\n </div>\r\n </ng-container> -->\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <ng-container *ngIf=\"checklistLoading\">\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"checklistNoData && !checklistLoading\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 my-6\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodatamaintext mt-3\">No data found</div>\r\n <div class=\"nodatasubtext\">There is no result for Performance Table\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>\r\n <div *ngIf=\"!checklistLoading && !checklistNoData\">\r\n <lib-pagination class=\"text-start\" [itemsPerPage]=\"itemsPerPage\" [currentPage]=\"currentPage\"\r\n [totalItems]=\"totalItems\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\"\r\n (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".grey-badge{border-radius:16px;background:var(--Gray-100, #F2F4F7);display:flex;padding:2px 8px;justify-content:center;align-items:center;color:var(--Gray-700, #344054);text-align:center;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.text-success{border-radius:16px;background:var(--Success-50, #ECFDF3);display:flex;padding:2px 8px 2px 6px;justify-content:center;align-items:center;gap:6px;color:var(--Success-500, #12B76A);text-align:center;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.checklistheading{color:var(--Gray-900, #101828);font-size:18px;font-style:normal;font-weight:600;line-height:28px}.checklisttext{color:var(--Gray-500, #667085);font-size:12px;font-style:normal;font-weight:500;line-height:18px}.totalinfocard{border-radius:5.359px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;padding:16px 12px 24px;flex-direction:column;align-items:center;gap:24px;align-self:stretch}.headingcard{color:var(--Black, #101828);font-size:16px;font-style:normal;font-weight:500;line-height:24px;display:flex;padding:8px;flex-direction:column;align-items:center;gap:4px;align-self:stretch;border-radius:4px;background:radial-gradient(206.89% 107.47% at 16.16% 32.77%,#fff6,#45bbfe33),#f9fafb}.infocount{color:var(--Black, #101828);font-size:24px;font-style:normal;font-weight:600;line-height:32px;text-align:center}.subinfocard{border-radius:5.359px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;display:flex;padding:21px 12px 40px;flex-direction:column;align-items:center;gap:24px;align-self:stretch}.avgcount{color:var(--Black, #101828);font-size:14px;font-style:normal;font-weight:400;line-height:20px}.actionview{color:var(--Gray-500, #667085);font-size:14px;font-weight:600;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.actiondownload{color:var(--Primary-700, #009BF3);font-size:14px;font-weight:600;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.actionalert{color:var(--Error-700, #B42318);font-size:14px;font-weight:600;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.ellipse1{border-radius:6px;border-bottom:2px solid var(--Gray-200, #EAECF0);background:radial-gradient(206.89% 107.47% at 16.16% 32.77%,#fff6,#45bbfe33),#f2f4f7;box-shadow:0 4px 10px #0000000d}.cardcount{color:var(--Black, #101828);font-size:30px;font-style:normal;font-weight:600;line-height:38px}.cardtext{color:var(--Gray-700, #344054);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.cardsubcount{color:var(--Black, #101828);font-size:20px;font-style:normal;font-weight:700;line-height:30px}.card-border{padding:8px;border-radius:12px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF)}.percent-value{color:var(--Gray-500, #667085);text-align:center;font-size:16px;font-style:normal;font-weight:600;line-height:18px}.week-font{color:var(--Gray-800, #1D2939);font-size:12px;font-style:normal;font-weight:400;line-height:18px}.nodatamaintext{font-family:Inter;font-size:16px;font-weight:600;line-height:24px;text-align:center;color:#101828}.nodatasubtext{font-family:Inter;font-size:14px;font-weight:400;line-height:20px;text-align:center;color:#667085}.rotate{transform:rotate(180deg)}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}table tr{vertical-align:middle}table th,table td{height:44px!important;padding:20px 15px!important;align-items:center;gap:12px;align-self:stretch}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-size:14px;font-style:normal;font-weight:500;line-height:20px;text-decoration-line:underline}.table-title{color:var(--Gray-500, #667085);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.diasbled{cursor:default;color:var(--gray-300, #D0D5DD);font-family:Inter;font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-text-decoration-line:underline;text-decoration-line:underline;text-transform:capitalize}.enabled{font-family:Inter;font-size:14px;font-style:normal;font-weight:600;line-height:20px;-webkit-text-decoration-line:underline;text-decoration-line:underline;text-transform:capitalize}.table-titlechecklist{color:var(--Gray-900, #101828);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.card .card-header{padding:0px 1.5rem}input[type=checkbox].c-checkbox{width:16px!important;height:16px!important;margin:5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-600, #D0D5DD)!important;box-shadow:none;font-size:.5em;text-align:center;line-height:1em;background:#fff}input[type=checkbox].c-checkbox:checked{outline:1px solid var(--primary-600, #00A3FF)!important;background-color:var(--primary-50, #EAF8FF)}input[type=checkbox].c-checkbox:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:3px;padding-top:10px;padding-right:0}.filtercard{display:flex;height:68px;padding:6px 8px 6px 16px;justify-content:center;align-items:center;gap:8px;align-self:stretch;border-radius:4px;border-left:2px solid var(--Primary-600, #00A3FF);background:var(--Gray-100, #F2F4F7);box-shadow:0 4px 16px #0000001a}.selectedtext{color:var(--Gray-500, #667085);font-size:14px;font-style:normal;font-weight:600;line-height:140%}a.disabled{pointer-events:none;opacity:.6}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i3.CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.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: i5.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i7.ReactiveSelectComponent, selector: "lib-reactive-select", inputs: ["isDisabled", "idField", "nameField", "label", "data"], outputs: ["itemChange"] }, { kind: "component", type: i8.MonthlyperformanceDatepickerComponent, selector: "lib-monthlyperformance-datepicker", inputs: ["monthlyperformce"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i6.DatePipe, name: "date" }] });
728
728
  }
729
729
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DashboardInfoComponent, decorators: [{
730
730
  type: Component,