tango-app-ui-analyse-trax 3.7.40 → 3.7.41

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 (4) hide show
  1. package/esm2022/lib/components/eye-test-audit/eye-test/eye-test.component.mjs +3 -3
  2. package/fesm2022/tango-app-ui-analyse-trax.mjs +2 -2
  3. package/fesm2022/tango-app-ui-analyse-trax.mjs.map +1 -1
  4. package/package.json +1 -1
package/fesm2022/tango-app-ui-analyse-trax.mjs CHANGED
@@ -24010,11 +24010,11 @@ class EyeTestComponent {
24010
24010
  this.modalRef.dismiss();
24011
24011
  }
24012
24012
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EyeTestComponent, deps: [{ token: i2$1.PageInfoService }, { token: i1$1.FormBuilder }, { token: TraxService }, { token: EyeTestAuditService }, { token: i1$3.Router }, { token: i0.ChangeDetectorRef }, { token: i2$1.GlobalStateService }, { token: i3.ToastService }, { token: i1.NgbModal }, { token: i1$3.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
24013
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: EyeTestComponent, selector: "lib-eye-test", viewQueries: [{ propertyName: "tooltipContent", first: true, predicate: ["tooltipContent"], descendants: true }, { propertyName: "viewHistory", first: true, predicate: ["viewHistory"], descendants: true }, { propertyName: "viewCancel", first: true, predicate: ["viewCancel"], descendants: true }, { propertyName: "videoPlayer", first: true, predicate: ["videoPlayer"], descendants: true }], ngImport: i0, template: "<section *ngIf=\"!eyeView\" class=\"container-fluid\">\r\n<div class=\"card mb-2\">\r\n <div *ngIf=\"loading1\" 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>\r\n <form *ngIf=\"!loading1\" [formGroup]=\"eyeTestForm\">\r\n <div class=\"row\">\r\n <div class=\"col-md-12 mt-7 mb-3\">\r\n <div class=\"row px-3\">\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-2 mb-4'\" class=\"col-1 mb-4\">\r\n <lib-reactive-select formControlName=\"dateType\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"dateType\" (itemChange)=\"dateTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-3 mb-4' : 'col-2 mb-4'\">\r\n <div class=\"position-relative\">\r\n <span style=\"top: 20%;\" class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-10 z-2\" style=\"min-width: 210px !important;\" type=\"text\"\r\n matInput ngxDaterangepickerMd [drops]=\"'down'\" [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"false\" autocomplete=\"off\"\r\n [(ngModel)]=\"selectedDateRange\" [ngModelOptions]=\"{standalone: true}\"\r\n (datesUpdated)=\"datechange($event)\" (click)=\"resetValidation()\"\r\n (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\" [autoApply]=\"true\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-2 mb-4'\" class=\"col-2 mb-4\">\r\n <lib-reactive-select formControlName=\"type\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"type\"\r\n (itemChange)=\"typeChange($event)\"></lib-reactive-select>\r\n </div>\r\n \r\n <!-- </div>\r\n </div> -->\r\n <!-- *ngIf=\"users?.role ==='superadmin'\" -->\r\n <div class=\"col-md-3\">\r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('RmList')?.value?.length)\">\r\n Select RM\r\n </div>\r\n <lib-group-select [items]=\"RmList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userName'\" (selected)=\"onRmSelect($event)\" [selectedValues]=\"eyeTestForm.get('RmList')?.value\">\r\n </lib-group-select>\r\n </div>\r\n \r\n \r\n </div>\r\n <!-- *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\" -->\r\n <div class=\"col-md-3\">\r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('ClusterList')?.value?.length)\">\r\n Select cluster\r\n </div>\r\n <lib-group-select [items]=\"ClusterList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'clusterName'\"\r\n [idField]=\"'clusterName'\" (selected)=\"ongroupSelect($event)\"\r\n [selectedValues]=\"eyeTestForm.get('ClusterList')?.value\">\r\n </lib-group-select>\r\n </div>\r\n </div>\r\n \r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-3 mb-4' : 'col-2 mb-4'\">\r\n \r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('storeList')?.value?.length)\">\r\n Select Stores\r\n </div>\r\n <lib-stores-select [items]=\"storeList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'storeName'\"\r\n [idField]=\"'storeId'\" (selected)=\"onStoreSelect($event)\"\r\n [selectedValues]=\"eyeTestForm.get('storeList')?.value\"></lib-stores-select>\r\n \r\n </div>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2' : 'col-2'\">\r\n <div class=\"select-wrapper mb-4\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('complianceScore')?.value?.length)\">\r\n Select Score\r\n </div>\r\n <lib-select-drop [items]=\"typePercentageArray\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'label'\"\r\n [idField]=\"'value'\" (selected)=\"typePercentageChange($event)\"\r\n [selectedValues]=\"eyeTestForm.get('complianceScore')?.value\">\r\n </lib-select-drop>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-1 mb-4\">\r\n <lib-reactive-select formControlName=\"auditType\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"auditType\"\r\n (itemChange)=\"auditTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2' : 'col-2'\">\r\n <div class=\"select-wrapper mb-4\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('auditStatus')?.value?.length)\">\r\n Audit Status\r\n </div>\r\n <lib-select-drop [items]=\"auditStatusArray\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'label'\"\r\n [idField]=\"'value'\" (selected)=\"typeAuditStatusChange($event)\"\r\n [selectedValues]=\"eyeTestForm.get('auditStatus')?.value\">\r\n </lib-select-drop>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-md-2\">\r\n <div class=\"mb-4\">\r\n <lib-reactive-select formControlName=\"nearAddition\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"nearAdditionArray\" (itemChange)=\"nearAdditionChange($event)\"></lib-reactive-select>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-md-2\">\r\n <div class=\"mb-4\">\r\n <lib-reactive-select formControlName=\"category\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"categoryArray\" (itemChange)=\"categoryTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n </div>\r\n <div \r\n *ngIf=\"users?.role\" \r\n class=\"text-end\"\r\n [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-1 mb-4'\"\r\n>\r\n<!-- [ngClass]=\"getApplyButtonClass(users?.role, eyeTestForm.get('type')?.value)\" -->\r\n\r\n <a (click)=\"onSubmit();\" type=\"submit\" class=\"btn btn-sm btn-primary py-3 \">\r\n <span>Apply</span>\r\n </a>\r\n\r\n</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </form>\r\n <div *ngIf=\"showEyeTest\" class=\"ms-6 mb-3\">\r\n\r\n <h3 class=\"card-title dashed w-100 row\">\r\n <span class=\"col-10 title-text py-3\"><span class=\"mx-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\"\r\n viewBox=\"0 0 32 32\" fill=\"none\">\r\n <rect width=\"32\" height=\"32\" rx=\"16\" fill=\"#FEE4E2\" />\r\n <g clip-path=\"url(#clip0_235_24234)\">\r\n <path\r\n d=\"M16 13.3335V16.0002M16 18.6668H16.0067M22.6667 16.0002C22.6667 19.6821 19.6819 22.6668 16 22.6668C12.3181 22.6668 9.33337 19.6821 9.33337 16.0002C9.33337 12.3183 12.3181 9.3335 16 9.3335C19.6819 9.3335 22.6667 12.3183 22.6667 16.0002Z\"\r\n stroke=\"#D92D20\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_235_24234\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\" transform=\"translate(8 8)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span><span class=\"dashed-desc\">Eye test video preview is available for 30 days. Audit data\r\n remains accessible, but videos will not be retained beyond this period.</span></span>\r\n <span class=\"col-2 pt-2 text-end cursor-pointer\" (click)=\"closeEyeTest()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\">\r\n <path d=\"M25 15L15 25M15 15L25 25\" stroke=\"#667085\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n </h3>\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<!-- <div class=\"card my-3\">\r\n <div class=\"card-header border-0 py-1\">\r\n \r\n </div>\r\n</div> -->\r\n\r\n<div class=\"row\">\r\n <div *ngIf=\"users?.role ==='superadmin' && keyType ==='rm'\" class=\"col\">\r\n <div class=\"card p-2\">\r\n <div class=\"card-header ellipse1 min-h-55px py-1 px-3 d-flex justify-content-between align-items-center\">\r\n <h5 class=\"card-title my-0\">Regional Managers</h5>\r\n <span class=\"text-value\">{{RmListData ?? '--'}}</span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card mt-5 p-2\">\r\n <div class=\"card-header ellipse1 min-h-55px py-1 px-3 d-flex justify-content-between align-items-center\">\r\n <h5 class=\"card-title my-0\">Clusters</h5>\r\n <span class=\"text-value\">{{groups?.length ?? '--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"users?.role ==='superadmin' && keyType !=='rm' || users?.role ==='admin'\" class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Clusters</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ groups?.length ?? '-' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Total Tango AI Files</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.totalFiles ?? '-' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Trust Audit Completed</h5>\r\n </div>\r\n <div class=\"card-body py-3 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.completedFiles ?? '-' }}</span>\r\n\r\n </div>\r\n <div class=\"card-footer py-0 border-0 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-sub\">{{ (eyeTestCardData?.completedRatio ?? '-') + '%' }} <span\r\n class=\"test-sub\">Completed</span></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Tango Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.tangoScore ?? '-' }}</span>\r\n </div>\r\n <div class=\"card-footer pe-0 ps-3 py-0 border-0 d-flex justify-content-center align-items-center\">\r\n <span>\r\n <svg *ngIf=\"eyeTestCardData?.trend\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\">\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\" stroke=\"#039855\" stroke-width=\"1.5\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <svg *ngIf=\"!eyeTestCardData?.trend\" xmlns=\"http://www.w3.org/2000/svg\" width=\"13\" height=\"12\" viewBox=\"0 0 13 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_760_9776)\">\r\n <path d=\"M11.575 9L6.82495 4.25L4.32495 6.75L0.574951 3M11.575 9H8.57495M11.575 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_760_9776\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0.0749512)\" />\r\n </clipPath>\r\n </defs>\r\n </svg> \r\n <span class=\"text-sub ms-2\">{{ eyeTestCardData?.tangoScoreTrend !== null \r\n ? (getAbsValue(eyeTestCardData.tangoScoreTrend) | number:'1.0-0':'en-US') + '%' \r\n : '-' }}\r\n <span\r\n class=\"test-sub1\">vs previous week</span></span></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Trust Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ (eyeTestCardData?.trustScore && eyeTestCardData?.trustScore !== 'NA' \r\n ? eyeTestCardData.trustScore + '%' \r\n : 'NA') }}</span>\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Human Audited Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ (eyeTestCardData?.humanScore && eyeTestCardData?.humanScore !== 'NA' \r\n ? eyeTestCardData.humanScore \r\n : 'NA') }}</span>\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n \r\n</div>\r\n\r\n\r\n<div class=\"card mt-3\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span *ngIf=\"users?.role === 'superadmin' && keyType ==='rm'\" class=\"title-text mb-2\">\r\n Audit Summary\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary\">{{ totalItems }} Total</span>\r\n </span>\r\n\r\n <!-- Admin + cluster present \u2192 RM Summary -->\r\n <div class=\"d-flex\">\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='cluster' && users?.role === 'superadmin'\" (click)=\"typeVal1('rm','')\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" x=\"0\" y=\"0\" width=\"44\" height=\"44\" filterUnits=\"userSpaceOnUse\"\r\n 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"users?.role === 'admin' && keyType ==='cluster' || users?.role === 'superadmin' && keyType ==='cluster'\" class=\"title-text my-4 mb-2\">\r\n RM Summary\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary text-capitalize\">{{ eyeTestData[0]?.RMName ? eyeTestData[0]?.RMName : '' }}</span>\r\n </span>\r\n </div>\r\n\r\n <!-- All other cases \u2192 Eye Test -->\r\n <div class=\"d-flex \">\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='store' && (users?.role === 'superadmin')\"\r\n (click)=\"typeVal1('cluster',this.rmEmail)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='store' && (users?.role === 'admin')\"\r\n (click)=\"typeVal1('cluster',this.groups)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"!(users?.role === 'superadmin' && keyType ==='rm') && !(users?.role === 'superadmin' && keyType ==='cluster') \r\n && !(users?.role === 'admin' && keyType ==='cluster')\" class=\"title-text my-4 mb-2\">\r\n Eye Test\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary\">{{ totalItems }} Total</span>\r\n </span>\r\n </div>\r\n <span *ngIf=\"users?.role ==='superadmin' && keyType ==='rm'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n <span *ngIf=\"users?.role ==='admin' && keyType ==='cluster'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n <span *ngIf=\"users?.role ==='user' && keyType ==='store'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" 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\"></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 <input (change)=\"searchData()\" [(ngModel)]=\"searchValue\" type=\"text\" class=\"form-control ps-14 me-2\" autocomplete=\"off\"\r\n [placeholder]=\"\r\n keyType === 'rm'\r\n ? 'Search by RMName'\r\n : keyType === 'cluster'\r\n ? 'Search by Cluster'\r\n : 'Search'\r\n \" />\r\n\r\n\r\n <span class=\"cursor-pointer\" *ngIf=\"users?.role ==='superadmin'\" (click)=\"settingsView()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"45\" height=\"46\"\r\n viewBox=\"0 0 45 46\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_760_9988)\">\r\n <rect x=\"2.71973\" y=\"1.98047\" width=\"40.04\" height=\"40.04\" rx=\"7.28\" fill=\"white\" />\r\n <rect x=\"3.17473\" y=\"2.43547\" width=\"39.13\" height=\"39.13\" rx=\"6.825\" stroke=\"#D0D5DD\"\r\n stroke-width=\"0.91\" />\r\n <g clip-path=\"url(#clip0_760_9988)\">\r\n <path\r\n d=\"M22.7396 24.2749C23.9961 24.2749 25.0146 23.2563 25.0146 21.9999C25.0146 20.7434 23.9961 19.7249 22.7396 19.7249C21.4832 19.7249 20.4646 20.7434 20.4646 21.9999C20.4646 23.2563 21.4832 24.2749 22.7396 24.2749Z\"\r\n stroke=\"#344054\" stroke-width=\"1.5197\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M28.3513 24.2749C28.2503 24.5036 28.2202 24.7573 28.2648 25.0033C28.3094 25.2493 28.4267 25.4763 28.6015 25.655L28.647 25.7005C28.788 25.8414 28.8999 26.0087 28.9762 26.1928C29.0526 26.3769 29.0919 26.5743 29.0919 26.7736C29.0919 26.9729 29.0526 27.1703 28.9762 27.3544C28.8999 27.5385 28.788 27.7058 28.647 27.8466C28.5062 27.9876 28.3389 28.0995 28.1548 28.1758C27.9707 28.2522 27.7733 28.2914 27.574 28.2914C27.3747 28.2914 27.1773 28.2522 26.9932 28.1758C26.8091 28.0995 26.6418 27.9876 26.5009 27.8466L26.4554 27.8011C26.2767 27.6263 26.0497 27.509 25.8037 27.4644C25.5577 27.4198 25.304 27.4499 25.0753 27.5509C24.851 27.647 24.6597 27.8066 24.525 28.0101C24.3902 28.2135 24.3179 28.4519 24.3169 28.696V28.8249C24.3169 29.2271 24.1572 29.6129 23.8727 29.8973C23.5883 30.1817 23.2025 30.3415 22.8003 30.3415C22.398 30.3415 22.0123 30.1817 21.7278 29.8973C21.4434 29.6129 21.2836 29.2271 21.2836 28.8249V28.7566C21.2777 28.5056 21.1965 28.2622 21.0504 28.058C20.9044 27.8538 20.7003 27.6982 20.4646 27.6115C20.2359 27.5106 19.9822 27.4805 19.7362 27.5251C19.4902 27.5697 19.2632 27.687 19.0844 27.8618L19.0389 27.9073C18.8981 28.0483 18.7308 28.1602 18.5467 28.2365C18.3626 28.3128 18.1652 28.3521 17.9659 28.3521C17.7666 28.3521 17.5692 28.3128 17.3851 28.2365C17.201 28.1602 17.0337 28.0483 16.8929 27.9073C16.7519 27.7664 16.64 27.5992 16.5637 27.415C16.4873 27.2309 16.448 27.0336 16.448 26.8342C16.448 26.6349 16.4873 26.4376 16.5637 26.2535C16.64 26.0693 16.7519 25.9021 16.8929 25.7612L16.9384 25.7157C17.1132 25.537 17.2305 25.31 17.2751 25.064C17.3197 24.818 17.2896 24.5643 17.1886 24.3355C17.0925 24.1112 16.9329 23.92 16.7294 23.7852C16.526 23.6505 16.2876 23.5782 16.0435 23.5772H15.9146C15.5124 23.5772 15.1266 23.4174 14.8422 23.133C14.5577 22.8486 14.3979 22.4628 14.3979 22.0605C14.3979 21.6583 14.5577 21.2725 14.8422 20.9881C15.1266 20.7037 15.5124 20.5439 15.9146 20.5439H15.9829C16.2339 20.538 16.4773 20.4568 16.6815 20.3107C16.8857 20.1646 17.0413 19.9605 17.1279 19.7249C17.2289 19.4961 17.259 19.2424 17.2144 18.9964C17.1698 18.7504 17.0525 18.5234 16.8777 18.3447L16.8322 18.2992C16.6912 18.1583 16.5793 17.9911 16.503 17.807C16.4267 17.6228 16.3874 17.4255 16.3874 17.2262C16.3874 17.0268 16.4267 16.8295 16.503 16.6454C16.5793 16.4612 16.6912 16.294 16.8322 16.1531C16.9731 16.0121 17.1403 15.9002 17.3244 15.8239C17.5086 15.7476 17.7059 15.7083 17.9052 15.7083C18.1046 15.7083 18.3019 15.7476 18.486 15.8239C18.6702 15.9002 18.8374 16.0121 18.9783 16.1531L19.0238 16.1986C19.2025 16.3734 19.4295 16.4907 19.6755 16.5353C19.9215 16.5799 20.1752 16.5498 20.4039 16.4489H20.4646C20.6889 16.3527 20.8802 16.1931 21.0149 15.9897C21.1497 15.7862 21.222 15.5478 21.2229 15.3038V15.1749C21.2229 14.7726 21.3827 14.3869 21.6672 14.1024C21.9516 13.818 22.3374 13.6582 22.7396 13.6582C23.1419 13.6582 23.5276 13.818 23.8121 14.1024C24.0965 14.3869 24.2563 14.7726 24.2563 15.1749V15.2431C24.2573 15.4871 24.3296 15.7256 24.4643 15.929C24.599 16.1325 24.7903 16.2921 25.0146 16.3882C25.2433 16.4891 25.4971 16.5193 25.7431 16.4747C25.9891 16.4301 26.2161 16.3128 26.3948 16.138L26.4403 16.0925C26.5811 15.9514 26.7484 15.8396 26.9325 15.7632C27.1167 15.6869 27.314 15.6476 27.5133 15.6476C27.7126 15.6476 27.91 15.6869 28.0941 15.7632C28.2782 15.8396 28.4455 15.9514 28.5864 16.0925C28.7274 16.2333 28.8392 16.4006 28.9156 16.5847C28.9919 16.7688 29.0312 16.9662 29.0312 17.1655C29.0312 17.3648 28.9919 17.5622 28.9156 17.7463C28.8392 17.9304 28.7274 18.0977 28.5864 18.2385L28.5409 18.284C28.366 18.4628 28.2488 18.6898 28.2042 18.9358C28.1596 19.1818 28.1897 19.4355 28.2906 19.6642V19.7249C28.3867 19.9492 28.5464 20.1404 28.7498 20.2752C28.9533 20.4099 29.1917 20.4822 29.4357 20.4832H29.5646C29.9669 20.4832 30.3526 20.643 30.6371 20.9274C30.9215 21.2119 31.0813 21.5976 31.0813 21.9999C31.0813 22.4021 30.9215 22.7879 30.6371 23.0723C30.3526 23.3567 29.9669 23.5165 29.5646 23.5165H29.4964C29.2523 23.5175 29.0139 23.5898 28.8105 23.7246C28.607 23.8593 28.4474 24.0506 28.3513 24.2749Z\"\r\n stroke=\"#344054\" stroke-width=\"1.5197\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_760_9988\" x=\"0.719727\" y=\"0.980469\" width=\"44.04\" height=\"44.04\"\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_760_9988\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_760_9988\"\r\n result=\"shape\" />\r\n </filter>\r\n <clipPath id=\"clip0_760_9988\">\r\n <rect width=\"18.2\" height=\"18.2\" fill=\"white\"\r\n transform=\"translate(13.6396 12.9004)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n\r\n <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"19\" height=\"20\" viewBox=\"0 0 19 20\" fill=\"none\">\r\n <path d=\"M7.53369 12.8441H15.0241L13.5568 14.3172L14.3587 15.1191L17.2024 12.2754L14.3587 9.43164L13.5568 10.2336L15.0241 11.7066H7.53369V12.8441Z\" fill=\"black\"/>\r\n <path d=\"M12.6526 8.8631V6.5881C12.653 6.51325 12.6387 6.43904 12.6104 6.36975C12.5821 6.30045 12.5404 6.23743 12.4877 6.18428L8.5064 2.20303C8.45326 2.15032 8.39023 2.10862 8.32094 2.08031C8.25164 2.05201 8.17744 2.03766 8.10259 2.0381H2.41509C2.1134 2.0381 1.82408 2.15794 1.61075 2.37126C1.39743 2.58458 1.27759 2.87391 1.27759 3.1756V16.8256C1.27759 17.1273 1.39743 17.4166 1.61075 17.6299C1.82408 17.8433 2.1134 17.9631 2.41509 17.9631H11.5151C11.8168 17.9631 12.1061 17.8433 12.3194 17.6299C12.5327 17.4166 12.6526 17.1273 12.6526 16.8256V15.6881H11.5151V16.8256H2.41509V3.1756H6.96509V6.5881C6.96509 6.88978 7.08493 7.17911 7.29826 7.39243C7.51158 7.60575 7.80091 7.7256 8.10259 7.7256H11.5151V8.8631H12.6526ZM8.10259 6.5881V3.40878L11.2819 6.5881H8.10259Z\" fill=\"black\"/>\r\n</svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"loading\" 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 <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata-table\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this eye test table</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!noData && !loading\" class=\"card-body\">\r\n <div class=\"table-responsive\">\r\n <table *ngIf=\"keyType ==='store'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('date')\"> Date <svg\r\n [ngClass]=\"sortedColumn === 'date' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'date' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('auditedDate')\">Audited Date <svg\r\n [ngClass]=\"sortedColumn === 'auditedDate' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'auditedDate' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th *ngIf=\"users?.role ==='superadmin'\" class=\"text-start\">\r\n RM Name\r\n </th>\r\n <th *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\" class=\"text-start\">\r\n Cluster Name\r\n </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name <svg\r\n [ngClass]=\"sortedColumn === 'storeName' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storeName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID <svg\r\n [ngClass]=\"sortedColumn === 'storeId' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'storeId' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th *ngIf=\"this.typeValue ==='remote'\" class=\"text-start\">Engagement ID</th>\r\n <th class=\"text-start\">Optom ID</th>\r\n <th class=\"text-start\">Optom Email ID</th>\r\n <th *ngIf=\"this.typeValue ==='remote'\" class=\"text-start\">Optom Name</th>\r\n <th *ngIf=\"this.typeValue !=='remote'\" class=\"text-start\">Queue ID</th>\r\n <th *ngIf=\"this.typeValue !=='remote'\" class=\"text-start\">Power Types</th>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('ComplianceScore')\">Tango Score <svg\r\n [ngClass]=\"sortedColumn === 'ComplianceScore' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'ComplianceScore' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> \r\n </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('coveredStepsAI')\">Steps Covered By AI <svg\r\n [ngClass]=\"sortedColumn === 'coveredStepsAI' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'coveredStepsAI' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('trustScore')\">Trust Score <svg\r\n [ngClass]=\"sortedColumn === 'trustScore' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'trustScore' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n\r\n<th><span class=\"cursor-pointer\" (click)=\"onSort('auditedSteps')\">Steps Covered By Human <svg\r\n [ngClass]=\"sortedColumn === 'auditedSteps' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'auditedSteps' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th>Human Audited Score</th>\r\n\r\n \r\n\r\n <th *ngIf=\"this.typeValue !=='remote'\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('visitorsType')\">Visitor Type <svg\r\n [ngClass]=\"sortedColumn === 'visitorsType' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'visitorsType' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th class=\"text-start\">Test Duration</th>\r\n <th class=\"text-start\" *ngIf=\"this.typeValue !=='remote'\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('comment')\">Eye Test Status <svg\r\n [ngClass]=\"sortedColumn === 'comment' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'comment' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th class=\"text-start\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('subComment')\">Comments <svg\r\n [ngClass]=\"sortedColumn === 'subComment' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'subComment' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('auditStatus')\">Audit Status <svg\r\n [ngClass]=\"sortedColumn === 'auditStatus' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'auditStatus' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th class=\"text-start\">Audited By</th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.date | date:'dd MMM, yyyy'}}</td>\r\n <td>{{obj?.auditedDate}}</td>\r\n <td *ngIf=\"users?.role === 'superadmin'\">\r\n <ng-container *ngIf=\"obj?.RMName\">\r\n <!-- Split and show the first value -->\r\n {{ obj.RMName.split(',')[0] }}\r\n\r\n <!-- Show +N badge if more values exist -->\r\n <span *ngIf=\"obj.RMName.split(',').length > 1\" class=\"badge badge-light-default ms-2\">\r\n +{{ obj.RMName.split(',').length - 1 }}\r\n </span>\r\n </ng-container>\r\n</td>\r\n\r\n <td *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\">\r\n <ng-container *ngIf=\"obj?.clusterName\">\r\n {{ obj.clusterName.split(',')[0] }}\r\n <span *ngIf=\"obj.clusterName.split(',').length > 1\" class=\"badge badge-light-default ms-2\">\r\n +{{ obj.clusterName.split(',').length - 1 }}\r\n </span>\r\n </ng-container>\r\n \r\n \r\n </td>\r\n <td>{{obj?.storeName}}</td>\r\n <td>{{obj?.storeId}}</td>\r\n <td *ngIf=\"this.typeValue ==='remote'\" class=\"engage-text\">{{obj?.engagementId}}</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\">{{obj?.optumId ? obj?.optumId :''}}\r\n <td *ngIf=\"this.typeValue ==='remote'\">{{obj?.optm_userId ? obj?.optm_userId :''}}\r\n <td *ngIf=\"this.typeValue !=='remote'\">{{obj?.salesmanEmailId ? obj?.salesmanEmailId :''}}\r\n <td *ngIf=\"this.typeValue =='remote'\">{{obj?.userEmail ? obj?.userEmail :''}}\r\n <td *ngIf=\"this.typeValue ==='remote'\">{{obj?.displayName ? obj?.displayName :''}}\r\n </td>\r\n <td *ngIf=\"this.typeValue !=='remote'\" class=\"engage-text\">{{obj?.queueId ?\r\n obj?.queueId:''}}</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\" >{{obj?.nearAddition ?\r\n obj?.nearAddition == \"true\"? \"With Near Addition\" :\"Without Near Addition\":'--'}}</td>\r\n <td>\r\n {{ obj?.complianceScore ?? '--' }}\r\n</td>\r\n<td>{{obj?.coveredStepsAI ? obj?.coveredStepsAI:'--'}}</td>\r\n <td>{{obj?.trustScore ?? '--'}}</td>\r\n <td>{{obj?.auditedSteps ? obj?.auditedSteps:'--'}}</td>\r\n <td>{{obj?.humanComplianceScore ? obj?.humanComplianceScore :'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"this.typeValue !=='remote'\">{{obj?.visitorsType ?\r\n obj?.visitorsType:'--'}}</td>\r\n <td>{{obj?.min ? obj?.min :'0'}} mins {{obj?.sec ?\r\n obj?.sec:'0'}} secs</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\">\r\n <span \r\n class=\"badge\" \r\n [ngClass]=\"obj?.comment ? 'badge-light-danger' : 'badge-light-success'\">\r\n {{ obj?.comment ? 'Fake' : 'Genuine' }}\r\n </span>\r\n</td>\r\n <td>{{obj?.subComment ? obj?.subComment:'--'}}</td>\r\n <td><span class=\"badge badge-light-primary\"\r\n *ngIf=\"obj?.auditStatus ==='Yet-to-Audit'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-warning\"\r\n *ngIf=\"obj?.auditStatus ==='Re-Audited'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-success\"\r\n *ngIf=\"obj?.auditStatus ==='Audited'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-info\"\r\n *ngIf=\"obj?.auditStatus ==='In-Progress'\">{{obj?.auditStatus}}</span>\r\n </td>\r\n <td>{{obj?.auditedBy?obj?.auditedBy:\"-\"}}</td>\r\n <td class=\"cursor-pointer\" (click)=\"eyeTestView(obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <table *ngIf=\"keyType ==='rm'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('RMName')\"> RM Name <svg\r\n [ngClass]=\"sortedColumn === 'RMName' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'RMName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('clusterCount')\"> Clusters Count <svg\r\n [ngClass]=\"sortedColumn === 'clusterCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'clusterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('storesCount')\">Stores Count <svg\r\n [ngClass]=\"sortedColumn === 'storesCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n Total Tango AI Files\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Audit Completed \r\n </th>\r\n <th class=\"text-start\">\r\n Tango Score \r\n </th>\r\n <th class=\"text-start\">\r\n Trust Score \r\n </th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.RMName ? obj?.RMName:'--'}}</td>\r\n <td>{{obj?.clusterCount ? obj?.clusterCount:'--'}}</td>\r\n <td>{{obj?.storesCount ? obj?.storesCount:'--'}}</td>\r\n <td>{{obj?.totalFiles ?? '--'}}</td>\r\n <td>{{obj?.completedFiles ?? '--'}}</td>\r\n <td>{{obj.complianceScore ?? '--'}}\r\n \r\n</td>\r\n<td>\r\n {{ obj?.trustScore ?? '--' }}\r\n</td>\r\n <td class=\"cursor-pointer\" (click)=\"typeVal('cluster',obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <table *ngIf=\"keyType ==='cluster'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n \r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('clusterName')\"> Clusters Name <svg\r\n [ngClass]=\"sortedColumn === 'clusterName' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'clusterName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('storesCount')\">Stores Count <svg\r\n [ngClass]=\"sortedColumn === 'storesCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n Total Tango AI Files\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Audit Completed\r\n </th>\r\n <th class=\"text-start\">\r\n Tango Score\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Score\r\n </th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.clusterName ? obj?.clusterName:'--'}}</td>\r\n <td>{{obj?.storesCount ? obj?.storesCount:'--'}}</td>\r\n <td>{{obj?.totalFiles ?? '--'}}</td>\r\n <td>{{obj?.completedFiles ?? '--'}}</td>\r\n <td>\r\n {{ obj?.complianceScore ?? '--' }}\r\n</td>\r\n<td>\r\n {{ obj?.trustScore ?? '--' }}\r\n</td>\r\n <td class=\"cursor-pointer\" (click)=\"typeVal('store',obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n </div>\r\n </div>\r\n <div class=\"card-footer\" *ngIf=\"!noData && !loading\">\r\n <lib-pagination [itemsPerPage]=\"pageSize\" [currentPage]=\"offset\" [totalItems]=\"totalItems\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n</div>\r\n</section>\r\n\r\n\r\n<section *ngIf=\"eyeView\" class=\"container-fluid new1 mt-4\">\r\n<div class=\"card p-5\">\r\n <div class=\"d-flex align-items-center\">\r\n <div (click)=\"backNavigation()\" class=\"btn btn-am btn-outline p-3\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15.8332 9.99984H4.1665M4.1665 9.99984L9.99984 15.8332M4.1665 9.99984L9.99984 4.1665\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </div>\r\n <span *ngIf=\"currentAuditType !== 'remote'\" class=\"ms-3 badge badge-light-default\">{{auditDetails?.optumId}}</span> \r\n <span *ngIf=\"currentAuditType === 'remote'\" class=\"ms-3 badge badge-light-default\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M10 10.5V9.5C10 8.96957 9.78929 8.46086 9.41421 8.08579C9.03914 7.71071 8.53043 7.5 8 7.5H4C3.46957 7.5 2.96086 7.71071 2.58579 8.08579C2.21071 8.46086 2 8.96957 2 9.5V10.5M8 3.5C8 4.60457 7.10457 5.5 6 5.5C4.89543 5.5 4 4.60457 4 3.5C4 2.39543 4.89543 1.5 6 1.5C7.10457 1.5 8 2.39543 8 3.5Z\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>{{auditDetails?.displayName ? auditDetails?.displayName:'--'}}</span> \r\n <span class=\"d-flex ms-1 align-items-center\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"\" opacity=\"0.1\"></rect>\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"\" stroke-width=\"6\"></rect>\r\n <path d=\"M15.6799 18.8039L15.6267 18.8871C15.0686 19.8741 15.6644 21.1215 16.7361 21.2646C16.8331 21.2765 16.9235 21.2828 17.0118 21.2828C17.5899 21.2828 18.1011 21.0348 18.4574 20.648L19.0107 20.0474L19.5621 20.6498C19.9141 21.0342 20.4241 21.2828 21.0061 21.2828C21.5856 21.2828 22.0985 21.0338 22.4502 20.6498L23.0033 20.0455L23.5565 20.6498C23.9081 21.0338 24.4211 21.2828 25.0005 21.2828C25.58 21.2828 26.0929 21.0338 26.4445 20.6498L26.9977 20.0455L27.5509 20.6498C27.9025 21.0338 28.4155 21.2828 28.9949 21.2828C29.0803 21.2828 29.1733 21.2765 29.2697 21.2647C30.3649 21.1154 30.9627 19.8012 30.324 18.8044C30.324 18.8043 30.324 18.8043 30.3239 18.8042L28.5658 16.0628L28.5658 16.0628L28.5648 16.0614C28.5496 16.0375 28.5121 16.012 28.465 16.012H17.5356C17.4884 16.012 17.4509 16.0375 17.4357 16.0614L17.4351 16.0623L15.6799 18.8039ZM28.6514 23.7372V26.8691V27.6191H27.9014H18.0992H17.3492V26.8691V23.7376C17.239 23.7458 17.1274 23.7501 17.0148 23.7501C16.9725 23.7501 16.9305 23.7494 16.8888 23.7482V26.8691V28.8036C16.8888 29.4471 17.4227 29.9882 18.0992 29.9882H27.9014C28.5779 29.9882 29.1118 29.4471 29.1118 28.8036V26.8691V23.7484C29.072 23.7495 29.032 23.7501 28.9918 23.7501C28.8774 23.7501 28.7639 23.7457 28.6514 23.7372Z\" stroke=\"#000000\" stroke-width=\"1.5\"></path></svg> \r\n <span class=\"ms-1 sub-title\"> {{auditDetails.storeName}}</span>\r\n </span>\r\n\r\n \r\n <!-- displayName -->\r\n <div *ngIf=\"currentAuditType !== 'remote'\" class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M5.25021 6.50028C5.91329 6.50028 6.54921 6.23689 7.01807 5.76807C7.48694 5.29924 7.75035 4.66337 7.75035 4.00035C7.75035 3.33732 7.48694 2.70146 7.01807 2.23263C6.54921 1.7638 5.91329 1.50042 5.25021 1.50042C4.58713 1.50042 3.95121 1.7638 3.48234 2.23263C3.01348 2.70146 2.75007 3.33732 2.75007 4.00035C2.75007 4.66337 3.01348 5.29924 3.48234 5.76807C3.95121 6.23689 4.58713 6.50028 5.25021 6.50028ZM5.25021 5.25031C4.91867 5.25031 4.60071 5.11862 4.36628 4.88421C4.13184 4.64979 4.00014 4.33186 4.00014 4.00035C4.00014 3.66884 4.13184 3.3509 4.36628 3.11649C4.60071 2.88207 4.91867 2.75038 5.25021 2.75038C5.58175 2.75038 5.89971 2.88207 6.13414 3.11649C6.36857 3.3509 6.50028 3.66884 6.50028 4.00035C6.50028 4.33186 6.36857 4.64979 6.13414 4.88421C5.89971 5.11862 5.58175 5.25031 5.25021 5.25031ZM1.5 8.79188C1.5 7.9869 2.15337 7.33359 2.95841 7.33359H7.542C8.34705 7.33359 9.00042 7.9869 9.00042 8.79188V12.7501C9.00042 13.7446 8.60531 14.6984 7.90201 15.4017C7.1987 16.1049 6.24483 16.5 5.25021 16.5C4.25559 16.5 3.30171 16.1049 2.59841 15.4017C1.89511 14.6984 1.5 13.7446 1.5 12.7501V8.79188ZM2.95841 8.58355C2.90316 8.58355 2.85016 8.6055 2.81109 8.64457C2.77202 8.68364 2.75007 8.73663 2.75007 8.79188V12.7501C2.75007 13.4131 3.01348 14.049 3.48234 14.5178C3.95121 14.9867 4.58713 15.25 5.25021 15.25C5.91329 15.25 6.54921 14.9867 7.01807 14.5178C7.48694 14.049 7.75035 13.4131 7.75035 12.7501V8.79188C7.75035 8.73663 7.7284 8.68364 7.68932 8.64457C7.65025 8.6055 7.59726 8.58355 7.542 8.58355H2.95841ZM7.77285 6.17862C8.15328 6.39267 8.58313 6.5034 9.01963 6.49978C9.45614 6.49616 9.8841 6.37832 10.2609 6.15799C10.6378 5.93766 10.9503 5.62252 11.1675 5.24391C11.3848 4.8653 11.499 4.43642 11.499 3.99993C11.499 3.56344 11.3848 3.13456 11.1675 2.75595C10.9503 2.37734 10.6378 2.0622 10.2609 1.84187C9.8841 1.62154 9.45614 1.50371 9.01963 1.50009C8.58313 1.49647 8.15328 1.60719 7.77285 1.82124C8.04536 2.13623 8.25954 2.50289 8.39955 2.90454C8.58991 2.80026 8.80415 2.74733 9.02118 2.75097C9.23821 2.75462 9.45055 2.81471 9.63731 2.92533C9.82406 3.03594 9.97879 3.19328 10.0863 3.38185C10.1937 3.57042 10.2503 3.78372 10.2503 4.00076C10.2503 4.21781 10.1937 4.43111 10.0863 4.61968C9.97879 4.80825 9.82406 4.96558 9.63731 5.0762C9.45055 5.18682 9.23821 5.24691 9.02118 5.25055C8.80415 5.2542 8.58991 5.20127 8.39955 5.09698C8.26074 5.49382 8.0481 5.86082 7.77285 6.17862ZM8.05036 16.3783C8.35483 16.4583 8.67151 16.4989 9.00042 16.5C9.99503 16.5 10.9489 16.1049 11.6522 15.4017C12.3555 14.6984 12.7506 13.7446 12.7506 12.7501V8.79188C12.7506 8.40512 12.597 8.03419 12.3235 7.76071C12.05 7.48723 11.679 7.33359 11.2922 7.33359H9.30877C9.59462 7.67941 9.78046 8.11107 9.8238 8.58355H11.2905C11.3458 8.58355 11.3988 8.6055 11.4379 8.64457C11.4769 8.68364 11.4989 8.73663 11.4989 8.79188V12.7501C11.4989 13.3968 11.2483 14.0184 10.7996 14.4843C10.351 14.9501 9.73925 15.224 9.09292 15.2484C8.81041 15.6817 8.45872 16.0633 8.05036 16.3783ZM11.5222 6.17862C11.9027 6.39267 12.3325 6.5034 12.769 6.49978C13.2055 6.49616 13.6335 6.37832 14.0103 6.15799C14.3871 5.93766 14.6997 5.62252 14.9169 5.24391C15.1341 4.8653 15.2484 4.43642 15.2484 3.99993C15.2484 3.56344 15.1341 3.13456 14.9169 2.75595C14.6997 2.37734 14.3871 2.0622 14.0103 1.84187C13.6335 1.62154 13.2055 1.50371 12.769 1.50009C12.3325 1.49647 11.9027 1.60719 11.5222 1.82124C11.7947 2.13623 12.0089 2.50289 12.1489 2.90454C12.3393 2.80026 12.5535 2.74733 12.7706 2.75097C12.9876 2.75462 13.1999 2.81471 13.3867 2.92533C13.5734 3.03594 13.7282 3.19328 13.8356 3.38185C13.9431 3.57042 13.9996 3.78372 13.9996 4.00076C13.9996 4.21781 13.9431 4.43111 13.8356 4.61968C13.7282 4.80825 13.5734 4.96558 13.3867 5.0762C13.1999 5.18682 12.9876 5.24691 12.7706 5.25055C12.5535 5.2542 12.3393 5.20127 12.1489 5.09698C12.0101 5.49382 11.7975 5.86082 11.5222 6.17862ZM11.7997 16.3783C12.1042 16.4583 12.4209 16.4989 12.7498 16.5C13.7444 16.5 14.6983 16.1049 15.4016 15.4017C16.1049 14.6984 16.5 13.7446 16.5 12.7501V8.79188C16.5 8.40526 16.3465 8.03447 16.0731 7.76101C15.7998 7.48755 15.4291 7.33381 15.0424 7.33359H13.059C13.3448 7.67941 13.5315 8.11107 13.574 8.58355H15.0408C15.096 8.58355 15.149 8.6055 15.1881 8.64457C15.2271 8.68364 15.2491 8.73663 15.2491 8.79188V12.7501C15.2491 13.3968 14.9985 14.0184 14.5498 14.4843C14.1012 14.9501 13.4895 15.224 12.8431 15.2484C12.5606 15.6817 12.2081 16.0633 11.7997 16.3783Z\"\r\n fill=\"#667085\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.queueId}}</span>\r\n </div>\r\n <div *ngIf=\"currentAuditType === 'remote'\" class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M5.25021 6.50028C5.91329 6.50028 6.54921 6.23689 7.01807 5.76807C7.48694 5.29924 7.75035 4.66337 7.75035 4.00035C7.75035 3.33732 7.48694 2.70146 7.01807 2.23263C6.54921 1.7638 5.91329 1.50042 5.25021 1.50042C4.58713 1.50042 3.95121 1.7638 3.48234 2.23263C3.01348 2.70146 2.75007 3.33732 2.75007 4.00035C2.75007 4.66337 3.01348 5.29924 3.48234 5.76807C3.95121 6.23689 4.58713 6.50028 5.25021 6.50028ZM5.25021 5.25031C4.91867 5.25031 4.60071 5.11862 4.36628 4.88421C4.13184 4.64979 4.00014 4.33186 4.00014 4.00035C4.00014 3.66884 4.13184 3.3509 4.36628 3.11649C4.60071 2.88207 4.91867 2.75038 5.25021 2.75038C5.58175 2.75038 5.89971 2.88207 6.13414 3.11649C6.36857 3.3509 6.50028 3.66884 6.50028 4.00035C6.50028 4.33186 6.36857 4.64979 6.13414 4.88421C5.89971 5.11862 5.58175 5.25031 5.25021 5.25031ZM1.5 8.79188C1.5 7.9869 2.15337 7.33359 2.95841 7.33359H7.542C8.34705 7.33359 9.00042 7.9869 9.00042 8.79188V12.7501C9.00042 13.7446 8.60531 14.6984 7.90201 15.4017C7.1987 16.1049 6.24483 16.5 5.25021 16.5C4.25559 16.5 3.30171 16.1049 2.59841 15.4017C1.89511 14.6984 1.5 13.7446 1.5 12.7501V8.79188ZM2.95841 8.58355C2.90316 8.58355 2.85016 8.6055 2.81109 8.64457C2.77202 8.68364 2.75007 8.73663 2.75007 8.79188V12.7501C2.75007 13.4131 3.01348 14.049 3.48234 14.5178C3.95121 14.9867 4.58713 15.25 5.25021 15.25C5.91329 15.25 6.54921 14.9867 7.01807 14.5178C7.48694 14.049 7.75035 13.4131 7.75035 12.7501V8.79188C7.75035 8.73663 7.7284 8.68364 7.68932 8.64457C7.65025 8.6055 7.59726 8.58355 7.542 8.58355H2.95841ZM7.77285 6.17862C8.15328 6.39267 8.58313 6.5034 9.01963 6.49978C9.45614 6.49616 9.8841 6.37832 10.2609 6.15799C10.6378 5.93766 10.9503 5.62252 11.1675 5.24391C11.3848 4.8653 11.499 4.43642 11.499 3.99993C11.499 3.56344 11.3848 3.13456 11.1675 2.75595C10.9503 2.37734 10.6378 2.0622 10.2609 1.84187C9.8841 1.62154 9.45614 1.50371 9.01963 1.50009C8.58313 1.49647 8.15328 1.60719 7.77285 1.82124C8.04536 2.13623 8.25954 2.50289 8.39955 2.90454C8.58991 2.80026 8.80415 2.74733 9.02118 2.75097C9.23821 2.75462 9.45055 2.81471 9.63731 2.92533C9.82406 3.03594 9.97879 3.19328 10.0863 3.38185C10.1937 3.57042 10.2503 3.78372 10.2503 4.00076C10.2503 4.21781 10.1937 4.43111 10.0863 4.61968C9.97879 4.80825 9.82406 4.96558 9.63731 5.0762C9.45055 5.18682 9.23821 5.24691 9.02118 5.25055C8.80415 5.2542 8.58991 5.20127 8.39955 5.09698C8.26074 5.49382 8.0481 5.86082 7.77285 6.17862ZM8.05036 16.3783C8.35483 16.4583 8.67151 16.4989 9.00042 16.5C9.99503 16.5 10.9489 16.1049 11.6522 15.4017C12.3555 14.6984 12.7506 13.7446 12.7506 12.7501V8.79188C12.7506 8.40512 12.597 8.03419 12.3235 7.76071C12.05 7.48723 11.679 7.33359 11.2922 7.33359H9.30877C9.59462 7.67941 9.78046 8.11107 9.8238 8.58355H11.2905C11.3458 8.58355 11.3988 8.6055 11.4379 8.64457C11.4769 8.68364 11.4989 8.73663 11.4989 8.79188V12.7501C11.4989 13.3968 11.2483 14.0184 10.7996 14.4843C10.351 14.9501 9.73925 15.224 9.09292 15.2484C8.81041 15.6817 8.45872 16.0633 8.05036 16.3783ZM11.5222 6.17862C11.9027 6.39267 12.3325 6.5034 12.769 6.49978C13.2055 6.49616 13.6335 6.37832 14.0103 6.15799C14.3871 5.93766 14.6997 5.62252 14.9169 5.24391C15.1341 4.8653 15.2484 4.43642 15.2484 3.99993C15.2484 3.56344 15.1341 3.13456 14.9169 2.75595C14.6997 2.37734 14.3871 2.0622 14.0103 1.84187C13.6335 1.62154 13.2055 1.50371 12.769 1.50009C12.3325 1.49647 11.9027 1.60719 11.5222 1.82124C11.7947 2.13623 12.0089 2.50289 12.1489 2.90454C12.3393 2.80026 12.5535 2.74733 12.7706 2.75097C12.9876 2.75462 13.1999 2.81471 13.3867 2.92533C13.5734 3.03594 13.7282 3.19328 13.8356 3.38185C13.9431 3.57042 13.9996 3.78372 13.9996 4.00076C13.9996 4.21781 13.9431 4.43111 13.8356 4.61968C13.7282 4.80825 13.5734 4.96558 13.3867 5.0762C13.1999 5.18682 12.9876 5.24691 12.7706 5.25055C12.5535 5.2542 12.3393 5.20127 12.1489 5.09698C12.0101 5.49382 11.7975 5.86082 11.5222 6.17862ZM11.7997 16.3783C12.1042 16.4583 12.4209 16.4989 12.7498 16.5C13.7444 16.5 14.6983 16.1049 15.4016 15.4017C16.1049 14.6984 16.5 13.7446 16.5 12.7501V8.79188C16.5 8.40526 16.3465 8.03447 16.0731 7.76101C15.7998 7.48755 15.4291 7.33381 15.0424 7.33359H13.059C13.3448 7.67941 13.5315 8.11107 13.574 8.58355H15.0408C15.096 8.58355 15.149 8.6055 15.1881 8.64457C15.2271 8.68364 15.2491 8.73663 15.2491 8.79188V12.7501C15.2491 13.3968 14.9985 14.0184 14.5498 14.4843C14.1012 14.9501 13.4895 15.224 12.8431 15.2484C12.5606 15.6817 12.2081 16.0633 11.7997 16.3783Z\"\r\n fill=\"#667085\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.engagementId ?auditDetails?.engagementId:'--'}}</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" 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\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{currentAuditType | titlecase}} Eye Test</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" 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\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.fileDate | date: 'dd/MM/YYYY'}}</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_166_55019)\">\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\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_166_55019\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.testStartTime}} {{auditDetails?.testStartTime?.split(':')[0]>12?'PM':'AM'}} - {{auditDetails?.testEndTime}} {{auditDetails?.testEndTime?.split(':')[0]>12?'PM':'AM'}}\r\n ({{auditDetails?.testDuration}} Mins)</span>\r\n </div>\r\n <span class=\"ms-3 badge badge-light-primary\">{{auditDetails?.visitorsType | titlecase}}</span>\r\n <div *ngIf=\"['Yet-to-Audit'].includes(auditDetails?.auditStatus)\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-primary\" style=\"font-size: 14px;\">\r\n Yet to Audit\r\n </div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Audited'\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-success\" style=\"font-size: 14px;\">\r\n Audited\r\n </div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Audited' || auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Re-Audited'\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-warning\" style=\"font-size: 14px;\">\r\n Re-Audited\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"row mt-3\">\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 text-center header-card\">\r\n AI Verified Steps <span><svg ngbTooltip=\"Number of steps detected and validated automatically without manual review.\" placement=\"right\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" \r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.coveredStepsAI?auditDetails?.coveredStepsAI:0}}/{{auditDetails?.totalSteps ? auditDetails?.totalSteps:'--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 text-center header-card\">\r\n Human Verified Steps <span><svg ngbTooltip=\"Number of steps that required human validation to ensure compliance and accuracy.\" placement=\"right\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.auditedSteps?auditDetails?.auditedSteps:0}}/{{auditDetails?.totalSteps ? auditDetails?.totalSteps:'--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 header-card\">\r\n AI Compliance Score <span><svg ngbTooltip=\"Measures the percentage of steps AI flagged as compliant without human intervention.\" placement=\"left\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.complianceScore ?auditDetails?.complianceScore : 0}}%</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 header-card\">\r\n AI Trust Score <span><svg ngbTooltip=\"This score reflects how often AI predictions were accepted without manual overrides.\" placement=\"left\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.trustScore ? auditDetails?.trustScore:'--'}}%</span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"row mt-3\">\r\n <div [ngClass]=\"eyeTestType ==='fake' ? 'col-md-12' : 'col-md-6'\" class=\"col-sm-6\">\r\n <div class=\"card h-500px px-5\">\r\n <div class=\"card-header p-0 border-0\">\r\n <span class=\"card-title m-0 fw-bolder bg-none\">Preview Eye Test</span>\r\n </div>\r\n <div class=\"card-body px-0 position-relative\">\r\n <div class=\"video-position w-100\">\r\n <video class=\"w-100 rounded-3 h-auto\" controls\r\n [src]=\"auditDetails?.filePath\"></video>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestType !=='fake'\" class=\"col-sm-6\">\r\n <div class=\"card h-500px px-5 overflow-scroll\">\r\n <div class=\"card-header mb-3 p-0 border-0 d-flex justify-content-between align-items-center\">\r\n <div class=\"\">\r\n <span class=\"card-title m-0 fw-bolder bg-none\">Step-wise Breakdown</span>\r\n \r\n \r\n <div class=\"d-flex sub-title mt-2\" *ngIf=\"auditDetails?.lastAuditedDetails?.auditedBy\">\r\n <span *ngIf=\"currentAuditType === 'remote'\"> <span *ngIf=\"auditDetails?.spokenLanguage\"> <span *ngIf=\"!takeAudit\" class=\"badge badge-light-info mt-0 me-2\">Language Spoken: {{auditDetails?.spokenLanguage}}</span></span></span> <span class=\"mt-1\">Recently Audited By : </span>\r\n <span class=\"ms-2 mt-1\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\"\r\n height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M13.3337 14V12.6667C13.3337 11.9594 13.0527 11.2811 12.5526 10.781C12.0525 10.281 11.3742 10 10.667 10H5.33366C4.62641 10 3.94814 10.281 3.44804 10.781C2.94794 11.2811 2.66699 11.9594 2.66699 12.6667V14M10.667 4.66667C10.667 6.13943 9.47308 7.33333 8.00033 7.33333C6.52757 7.33333 5.33366 6.13943 5.33366 4.66667C5.33366 3.19391 6.52757 2 8.00033 2C9.47308 2 10.667 3.19391 10.667 4.66667Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span >{{auditDetails?.lastAuditedDetails?.auditedBy}}</span>\r\n <span class=\"ms-2 mt-1\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\"\r\n height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_152_29431)\">\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_152_29431\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>{{auditDetails?.lastAuditedDetails?.completionTime}}\r\n {{auditDetails?.lastAuditedDetails?.timeZone}}</span>\r\n </div>\r\n \r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"takeAudit && currentAuditType === 'remote'\" class=\"d-flex align-items-end me-2\">\r\n <select [(ngModel)]=\"spokenLanguage\" class=\"form-select form-select-sm\">\r\n <option selected disabled >Language Spoken <span style=\"color:red\">*</span></option>\r\n <option value=\"English\">English</option>\r\n <option value=\"Hindi\">Hindi</option>\r\n </select></div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Yet-to-Audit' && !takeAudit\" (click)=\"startAudit('audit')\"\r\n class=\"text-white ms-3 px-3 py-2 fw-semibold rounded-2 cursor-pointer bg-primary\"\r\n style=\"font-size: 14px;\">\r\n Start Audit\r\n </div>\r\n \r\n <div *ngIf=\"['Audited','Re-Audit','Yet-to-Audit'].includes(auditDetails?.auditStatus)&&auditDetails?.auditType === 'Re-Audit' && !takeAudit||auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Audited' ||auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Re-Audited'&& !takeAudit \"\r\n (click)=\"startAudit('Re-Audit')\" class=\"btn btn-sm py-2 btn-warning\">Re-Audit</div>\r\n <div *ngIf=\"takeAudit\" class=\"d-flex\">\r\n <button class=\"btn btn-sm btn-outline\" [disabled]=\"disablecancel\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn ms-2 btn-sm btn-success\" [disabled]=\"disablecancel\" (click)=\"onsubmit()\">Submit</button>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body mt-1 px-0\">\r\n <div *ngIf=\"!takeAudit && stepWiseProcess?.length\" class=\"table-responsive border border-1 rounded-3\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n Step-by-step Process\r\n </th>\r\n <th *ngIf=\"currentAuditType === 'remote'\" class=\"text-start\">\r\n Predicted Transcript\r\n </th>\r\n <th class=\"text-start\">\r\n AI Verified\r\n </th>\r\n <th class=\"text-start\">\r\n Human Audited\r\n </th>\r\n <th class=\"text-start\">\r\n Reason for Error\r\n </th>\r\n <th class=\"text-start\">\r\n Noticed Time Range\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of stepWiseProcess;let i=index\">\r\n <td>\r\n <div class=\"d-flex align-items-start\">\r\n <!-- <div class=\"w-40px h-40px d-flex justify-content-center text-center me-3\">\r\n <img class=\"w-100 rounded-5\" [src]=\"data?.imageUrl\">\r\n </div> -->\r\n {{data.processName}}\r\n </div>\r\n </td>\r\n <td *ngIf=\"currentAuditType ==='remote'\" class=\"text-capitalize\">\r\n <div class=\"text-primary1 text-decoration-underline cursor-pointer\"\r\n [ngbTooltip]=\"data?.predictedTranscript ? tooltipContent : ''\"\r\n placement='bottom'>{{data?.predictedTranscript?data?.predictedTranscript:\"N/A\"}}</div>\r\n\r\n <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"min-w-500px\">{{data?.predictedTranscript?data?.predictedTranscript:\"N/A\"}}</span>\r\n </div>\r\n </ng-template>\r\n\r\n </td>\r\n <td class=\"text-capitalize\"><span\r\n [ngClass]=\"data.AIStatus ? 'badge badge-light-success' : 'badge badge-light-danger'\">{{data.AIStatus\r\n ? 'pass' : 'fail'}}</span></td>\r\n <td class=\"text-capitalize\">\r\n <span \r\n [ngClass]=\"data?.auditedStatus === true ? 'badge badge-light-success' : (data?.auditedStatus === false ? 'badge badge-light-danger' : '')\">\r\n {{ data?.auditedStatus === true ? 'pass' : (data?.auditedStatus === false ? 'fail' : 'N/A') }}\r\n </span>\r\n \r\n </td>\r\n <td *ngIf=\"data.AIStatus !== data.auditedStatus || data.auditedStatus === null || data.auditedStatus === undefined || data.auditedStatus === ''; else EqualBlock\">\r\n <!-- {{ data?.reason || 'N/A' }} -->\r\n <span *ngIf=\"data.reason !=='others'\">{{data.reason || 'N/A'}}</span><span *ngIf=\"data.reason ==='others'\">{{data.otherReason || 'N/A'}}</span>\r\n </td>\r\n <ng-template #EqualBlock>\r\n <td>N/A</td>\r\n </ng-template>\r\n <td>{{data?.startTime}} - {{data?.endTime}}</td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <div *ngIf=\"stepWiseProcess?.length && takeAudit&&auditDetails?.auditStatus==='Yet-to-Audit'||auditDetails?.auditStatus==='In-Progress'\">\r\n <div *ngFor=\"let process of stepWiseProcess; let i=index ;let last=last\"\r\n class=\"border border-1 rounded-3 mb-3\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n Step-{{i+1 | number}}\r\n </th>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n AI Verified\r\n </th>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n Human Audited\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td class=\"w-200px\">\r\n <!-- <div class=\"d-flex align-items-start\"> -->\r\n <!-- <div class=\"w-40px h-40px d-flex justify-content-center text-center me-3\">\r\n <img class=\"w-100 rounded-5\" [src]=\"process.imageUrl\">\r\n </div> -->\r\n {{process.processName}}\r\n <!-- </div> -->\r\n </td>\r\n <td><span *ngIf=\"process.AIStatus\" class=\"badge badge-light-success text-capitalize\">Pass</span>\r\n <span *ngIf=\"!process.AIStatus\" class=\"badge badge-light-danger text-capitalize\">Fail</span>\r\n </td>\r\n <td>\r\n <div class=\"d-flex justify-content-start\">\r\n <div (click)=\"selectHumanVerified(i,true)\"\r\n [ngClass]=\"process?.auditedStatus ? 'text-white btn-success' : 'text-success bg-white border border-success'\"\r\n class=\"btn btn-sm rounded-5\"><span><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"16\"\r\n viewBox=\"0 0 17 16\" fill=\"none\">\r\n <path d=\"M14.1667 4L6.83333 11.3333L3.5 8\"\r\n [attr.stroke]=\"process?.auditedStatus ? 'white' : '#17C653'\"\r\n stroke-width=\"1.25\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span><span class=\"ms-2\">Pass</span></div>\r\n\r\n <div (click)=\"selectHumanVerified(i,false)\"\r\n [ngClass]=\"process?.auditedStatus===false ? 'text-white bg-danger' : 'text-danger bg-white border border-danger'\"\r\n class=\"ms-3 px-5 py-2 fw-semibold rounded-5 cursor-pointer rounded-5\">\r\n <span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"16\"\r\n viewBox=\"0 0 17 16\" fill=\"none\">\r\n <path d=\"M12.6665 4L4.6665 12M4.6665 4L12.6665 12\"\r\n [attr.stroke]=\"process?.auditedStatus===false ? 'white' : '#F8285A'\"\r\n stroke-width=\"1.25\" stroke-linecap=\"rowund\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span><span class=\"ms-2\">Fail</span></div>\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <div *ngIf=\"currentAuditType === 'remote' && process?.predictedTranscript\" class=\"w-100\">\r\n <div class=\"bg-light-primary text-primary p-3\">\r\n Predicted Transcript\r\n </div>\r\n <div class=\"row col-sm-12 p-5\">\r\n <div class=\"text-primary text-decoration-underline cursor-pointer\"\r\n [ngbTooltip]=\"process?.predictedTranscript ? tooltipContent : ''\"\r\n placement='bottom'>\r\n {{process?.predictedTranscript}}\r\n </div>\r\n <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"min-w-500px\">{{process?.predictedTranscript}}</span>\r\n </div>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div *ngIf=\"process?.auditedStatus !== undefined && process?.auditedStatus !== '' && process?.auditedStatus !== process?.AIStatus\" class=\"w-100\">\r\n <div class=\"bg-light-primary text-primary p-3\">\r\n Reason & Time Stamp\r\n </div>\r\n <div class=\"row col-sm-12 p-5\">\r\n <div class=\"col-sm-6 col-md-6\">\r\n <div>\r\n <div (click)=\"toggleDropdown(i,'reason')\" class=\"custom-dropdown\">\r\n <div class=\"d-flex justify-content-between\">\r\n <span class=\"text-select\">\r\n {{ process?.reason ? process?.reason : 'Select Reason' }}\r\n </span>\r\n <span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n \r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\" *ngIf=\"dropdownOpen[i]?.reason\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"item my-2 minutes-scroll\">\r\n <ul *ngFor=\"let item of dropdownList\" class=\"list-unstyled\">\r\n <li [ngClass]=\"process?.reason === item?.key ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n (click)=\"selectReason(i, item?.key, 'reason')\">\r\n {{ item?.item }}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <!-- Custom Input for \"Others\" -->\r\n <div *ngIf=\"process?.reason === 'others'\" class=\"mt-2\">\r\n <input \r\n type=\"text\" \r\n [(ngModel)]=\"process.otherReason\" \r\n placeholder=\"Enter your reason\" \r\n class=\"form-control form-control-sm\" />\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"col-sm-3\">\r\n <div class=\"w-100\">\r\n <div (click)=\"toggleDropdown(i,'startTime')\" class=\"custom-dropdown\">\r\n <label class=\"label fw-semibold bg-white px-2\">Start</label>\r\n <div class=\"text-select\">{{process?.startTime ? process?.startTime\r\n :'MM:SS'}}</div>\r\n\r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\"\r\n *ngIf=\"dropdownOpen[i]?.startTime\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"scroll-section minutes-scroll \">\r\n <div *ngFor=\"let min of minutesList\"\r\n (click)=\"selectMinute(i,min,'startTime')\"\r\n [class.selected]=\"min === selectedMinutes\">\r\n {{ min }}\r\n </div>\r\n </div>\r\n <!-- Seconds List -->\r\n <div class=\"scroll-section seconds-scroll\">\r\n <div *ngFor=\"let sec of secondsList\"\r\n (click)=\"selectSecond(i,sec,'startTime')\"\r\n [class.selected]=\"sec === selectedSeconds\">\r\n {{ sec }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"w-100\">\r\n <div (click)=\"toggleDropdown(i,'endTime')\" class=\"custom-dropdown\">\r\n <label class=\"label fw-semibold bg-white px-2\">End</label>\r\n <div class=\"text-select\"><span>{{process.endTime ? process.endTime :\r\n 'MM:SS'}}</span></div>\r\n\r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\"\r\n *ngIf=\"dropdownOpen[i]?.endTime\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"scroll-section minutes-scroll\">\r\n <div *ngFor=\"let min of minutesList\"\r\n [class.selected]=\"min === selectedMinutes\"\r\n [class.disabled]=\"getSecondsFromTime(min + ':' + selectedSeconds) <= getSecondsFromTime(process.startTime)\"\r\n (click)=\"\r\n getSecondsFromTime(min + ':' + selectedSeconds) > getSecondsFromTime(process.startTime)\r\n && selectMinute(i,min,'endTime')\">\r\n {{ min }}\r\n </div>\r\n \r\n </div>\r\n <!-- Seconds List -->\r\n <div class=\"scroll-section seconds-scroll\">\r\n <div *ngFor=\"let sec of secondsList\"\r\n [class.selected]=\"sec === selectedSeconds\"\r\n [class.disabled]=\"getSecondsFromTime(selectedMinutes + ':' + sec) <= getSecondsFromTime(process.startTime)\"\r\n (click)=\"\r\n getSecondsFromTime(selectedMinutes + ':' + sec) > getSecondsFromTime(process.startTime)\r\n && selectSecond(i,sec,'endTime')\">\r\n {{ sec }}\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!stepWiseProcess?.length\">\r\n <div *ngIf=\"(tableLoading | async) === 'loading'\"\r\n class=\"card 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 <div *ngIf=\"(tableLoading | async) === 'loaded'\" class=\"row mt-2\">\r\n <div *ngIf=\"noData\" class=\"col-lg-12\">\r\n <div class=\"card-body my-8 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=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the test</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"card mt-3 p-2\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"title-text mb-2\">History</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-body py-0 px-3\">\r\n <div class=\"table-responsive border border-1 rounded-3\" *ngIf=\"historyData?.length\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">Audited By</th>\r\n <th class=\"text-start\" >Audited Date</th>\r\n <th class=\"text-start\" >Time Stamp</th>\r\n <th class=\"text-start\" >View Logs</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of historyData\">\r\n <td>{{item.userName}}</td>\r\n <td>{{item.Date}}</td>\r\n <td>{{item.Time}} IST</td>\r\n <td (click)=\"viewHistoryModel(item)\" class=\"cursor-pointer\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"16\"\r\n viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n\r\n <div *ngIf=\"!historyData?.length\">\r\n <div *ngIf=\"(historytableLoading | async) === 'loading'\"\r\n class=\"card 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\r\n <div *ngIf=\"(historytableLoading | async) === 'loaded'\" class=\"row mt-2\">\r\n <div class=\"col-lg-12\">\r\n <div class=\"card-body my-8 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=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the test</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<ng-template #viewHistory let-model>\r\n <div class=\"p-5 ts700px scroll\">\r\n\r\n\r\n <div class=\"card-body py-0 \">\r\n <div class=\"my-2 d-flex\">\r\n<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"46\"\r\n height=\"46\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M28 22V28L32 30M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span\r\n class=\"ms-3 pt-2 fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Audit\r\n History</span>\r\n </div>\r\n <div class=\"table-responsive\" *ngIf=\"historyData?.length\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">Step-by-Step Process</th>\r\n <th class=\"text-start\">Status changed from</th>\r\n <th class=\"text-start\">Noted Time Range</th>\r\n <th class=\"text-start\">Reason for Error</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of viewHistoryData\">\r\n <td>{{item.processName}}</td>\r\n <td>\r\n <span *ngIf=\"item.AIStatus\" class=\"badge badge-light-success me-2\">Pass</span>\r\n <span *ngIf=\"!item.AIStatus\" class=\"badge badge-light-danger me-2\">Fail</span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"31\" height=\"8\" viewBox=\"0 0 31 8\"\r\n fill=\"none\">\r\n <path\r\n d=\"M30.3536 4.35355C30.5488 4.15829 30.5488 3.84171 30.3536 3.64645L27.1716 0.464466C26.9763 0.269204 26.6597 0.269204 26.4645 0.464466C26.2692 0.659728 26.2692 0.976311 26.4645 1.17157L29.2929 4L26.4645 6.82843C26.2692 7.02369 26.2692 7.34027 26.4645 7.53553C26.6597 7.7308 26.9763 7.7308 27.1716 7.53553L30.3536 4.35355ZM0 4.5H30V3.5H0V4.5Z\"\r\n fill=\"#D0D5DD\" />\r\n </svg>\r\n <span *ngIf=\"item.auditedStatus\" class=\"badge badge-light-success ms-2\">Pass</span>\r\n <span *ngIf=\"!item.auditedStatus\" class=\"badge badge-light-danger ms-2\">Fail</span>\r\n </td>\r\n <td ><span class=\"badge badge-light-success\" *ngIf=\"item.startTime\">Noted Time Range : <span class=\"text-dark1\">{{item.startTime ? item.startTime:'--'}} - {{item.endTime}}</span></span></td>\r\n <td class=\"engage-text\"><span *ngIf=\"item.reason !=='others'\">{{item.reason}}</span><span *ngIf=\"item.reason ==='others'\">{{item.otherReason}}</span></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #viewCancel let-model>\r\n <div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEF0C7\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FFFAEB\" stroke-width=\"8\"/>\r\n <path d=\"M27.9988 24V28M27.9988 32H28.0088M26.2888 18.86L17.8188 33C17.6442 33.3024 17.5518 33.6453 17.5508 33.9945C17.5498 34.3437 17.6403 34.6871 17.8132 34.9905C17.9862 35.2939 18.2355 35.5467 18.5365 35.7238C18.8375 35.9009 19.1796 35.9961 19.5288 36H36.4688C36.818 35.9961 37.1601 35.9009 37.4611 35.7238C37.7621 35.5467 38.0114 35.2939 38.1844 34.9905C38.3573 34.6871 38.4478 34.3437 38.4468 33.9945C38.4458 33.6453 38.3534 33.3024 38.1788 33L29.7088 18.86C29.5305 18.5661 29.2795 18.3231 28.98 18.1544C28.6805 17.9858 28.3425 17.8972 27.9988 17.8972C27.6551 17.8972 27.3171 17.9858 27.0176 18.1544C26.7181 18.3231 26.4671 18.5661 26.2888 18.86Z\" stroke=\"#DC6803\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Are you sure?</a>\r\n <span class=\"sub-title fw-normal mt-2\">Would you like to cancel this?</span>\r\n \r\n <div class=\"mt-5 w-100\">\r\n \r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"OnCancel()\">No</button>\r\n <button id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onYes()\">Yes</button>\r\n \r\n </div>\r\n \r\n </div>\r\n \r\n </div>\r\n </div>\r\n</ng-template>\r\n</section>", styles: [":host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.shown.drops-down-right{transform-origin:0 0;width:560px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;right:-475px!important;left:unset!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.card-title{font-size:1.15rem!important}.select-wrapper{position:relative;display:inline-block;width:100%}.placeholder-overlay{position:absolute;color:var(--Gray-500, #667085);font-family:Inter;font-size:16px!important;font-style:normal;font-weight:400;top:10px;left:15px;pointer-events:none;font-size:1.1rem;z-index:1}table th,table td{height:44px!important;padding:12px 24px!important;gap:12px;align-self:stretch}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:18px}table td{color:var(--Gray-900, #667085);font-size:14px!important;font-weight:500!important;line-height:20px}.bottom-border td{border-bottom:1px solid var(--Gray-200, #EAECF0)!important}.rotate{rotate:180deg;transition:1s}.engage-text{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-transform:capitalize}.dashed{border-radius:4px;border:1px dashed var(--Error-500, #F04438)!important;background:var(--Error-25, #FFFBFA)}.dashed-desc{color:var(--Error-600, #3F4254)!important;font-size:14px;font-weight:600;line-height:24px}.card-header,.header{color:var(--Gray-900, #101828);font-size:20px!important;font-style:normal;font-weight:700;line-height:30px}.sub-header{color:var(--Gray-700, #344054);font-size:14px!important;font-style:normal;font-weight:600;line-height:20px}.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}.text-value{color:var(--Black, #101828);font-size:24px;font-weight:600;line-height:32px}.text-sub{color:var(--Error-600, #667085)!important;font-size:16px;font-weight:600;line-height:18px}.test-sub1{color:var(--Gray-800, #1D2939);font-size:11px;font-weight:400;line-height:18px}.new1 .header-card{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;color:var(--Black, #101828);font-size:18px;line-height:32px}.new1 .text-card{color:var(--Black, #101828);font-size:24px;line-height:32px}.new1 .bg-light-primary{border-bottom:1px solid var(--Primary-100, #DAF1FF)!important;background:var(--Primary-25, #F6FCFF)!important}.new1 .sub-title{color:var(--Gray-500, #667085);font-size:12px;font-weight:500;line-height:18px}.new1 .video-position{position:absolute;top:50%;transform:translateY(-50%)}.new1 .btn-success{border:1px solid var(--Success-700, #027A48)!important;background:var(--Success-700, #027A48)!important;box-shadow:0 1px 2px #1018280d!important}.new1 .btn.btn-success:hover:not(.btn-active),.new1 .btn.btn-success:active:not(.btn-active){border:1px solid var(--Success-700, #027A48)!important;background:var(--Success-700, #027A48)!important;box-shadow:0 1px 2px #1018280d!important}.new1 table tr{vertical-align:middle}.new1 table tr td{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:500;line-height:20px}.new1 .custom-dropdown{position:relative;width:100%;padding:10px 16px;cursor:pointer;border-radius:8px;font-size:16px;font-weight:400;line-height:20px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--Gray-50, #F9FAFB);box-shadow:0 1px 2px #1018280d}.new1 .dropdown-content{position:absolute;z-index:1;top:100%;left:0;border-radius:6px;width:100%;background:#fff;box-shadow:0 4px 6px #0000001a;display:flex}.new1 .dropdown-content1{position:absolute;z-index:1;bottom:100%;left:0;border-radius:6px;width:100%;background:#fff;box-shadow:0 4px 6px #0000001a;display:flex}.new1 .scroll-container{display:flex;width:100%}.new1 .scroll-container .item{width:100%;text-align:start}.new1 .scroll-container .items:hover,.new1 .scroll-container .tems.focus,.new1 .scroll-container .items.active{background:var(--Gray-50, #F9FAFB)}.new1 .label{position:absolute;top:-25%;color:var(--Gray-700, #344054);font-size:12px;line-height:18px}.new1 .scroll-section{width:50%;height:200px;overflow-y:auto;text-align:center;border-right:1px solid #ddd}.new1 .scroll-section:last-child{border-right:none}.new1 .scroll-section div{padding:8px;cursor:pointer}.new1 .scroll-section div.selected{background:#007bff;color:#fff}.new1 .bg-primary{border-radius:8px;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d}.new1 .bg-danger{background:var(--Primary-500, #D92D20)!important}.new1 .text-primary{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:500!important;line-height:18px!important}.new1 .text-primary1{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:500!important;line-height:18px!important;text-overflow:ellipsis;max-width:200px;overflow:hidden}.new1 .text-select{color:var(--Gray-500, #667085)!important;font-size:14.56px!important;font-weight:400;line-height:21.84px!important}.new1 .custom-tooltip-content{font-size:12px!important;text-align:left!important}.new1 ::ng-deep .tooltip-inner{max-width:500px!important;white-space:normal}.new1 .test-dark1{color:var(--Success-700, #027A48)!important;text-align:center;font-size:12px!important;font-weight:500!important;line-height:18px}.new1 .engage-text{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-transform:capitalize}.new1 .disabled{pointer-events:none;opacity:.4;cursor:not-allowed}.new1 .h-auto{height:400px!important;object-fit:fill}@media (min-width: 1920px) and (max-width: 2119px){.new1 .h-500px{height:600px!important}.new1 .h-auto{height:400px!important;object-fit:fill}}@media (min-width: 1720px) and (max-width: 1900px){.new1 .h-auto{height:400px!important;object-fit:fill}}@media (min-width: 2120px) and (max-width: 2800px){.new1 .h-auto{height:520px!important;object-fit:fill}}@media (min-width: 1330px) and (max-width: 1500px){.new1 .h-auto{height:370px!important;object-fit:fill}}.new1 .ts700px{min-height:auto!important;max-height:700px!important}\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: "component", type: i3.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i8$1.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }, { kind: "directive", type: i1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: ReactiveSelectComponent, selector: "lib-reactive-select", inputs: ["idField", "nameField", "label", "data"], outputs: ["itemChange"] }, { kind: "component", type: CustomSelectComponent, selector: "lib-stores-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "component", type: GroupSelectComponent, selector: "lib-group-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "component", type: SelectDropComponent, selector: "lib-select-drop", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.DecimalPipe, name: "number" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i6.DatePipe, name: "date" }] });
24013
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: EyeTestComponent, selector: "lib-eye-test", viewQueries: [{ propertyName: "tooltipContent", first: true, predicate: ["tooltipContent"], descendants: true }, { propertyName: "viewHistory", first: true, predicate: ["viewHistory"], descendants: true }, { propertyName: "viewCancel", first: true, predicate: ["viewCancel"], descendants: true }, { propertyName: "videoPlayer", first: true, predicate: ["videoPlayer"], descendants: true }], ngImport: i0, template: "<section *ngIf=\"!eyeView\" class=\"container-fluid\">\r\n<div class=\"card mb-2\">\r\n <div *ngIf=\"loading1\" 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>\r\n <form *ngIf=\"!loading1\" [formGroup]=\"eyeTestForm\">\r\n <div class=\"row\">\r\n <div class=\"col-md-12 mt-7 mb-3\">\r\n <div class=\"row px-3\">\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-2 mb-4'\" class=\"col-1 mb-4\" style=\"z-index: 33 !important;\" >\r\n <lib-reactive-select formControlName=\"dateType\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"dateType\" (itemChange)=\"dateTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-3 mb-4' : 'col-2 mb-4'\">\r\n <div class=\"position-relative\">\r\n <span style=\"top: 20%;\" class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-10 z-2\" style=\"min-width: 150px !important;\" type=\"text\"\r\n matInput ngxDaterangepickerMd [drops]=\"'down'\" [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"false\" autocomplete=\"off\"\r\n [(ngModel)]=\"selectedDateRange\" [ngModelOptions]=\"{standalone: true}\"\r\n (datesUpdated)=\"datechange($event)\" (click)=\"resetValidation()\"\r\n (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\" [autoApply]=\"true\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-2 mb-4'\" class=\"col-2 mb-4\">\r\n <lib-reactive-select formControlName=\"type\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"type\"\r\n (itemChange)=\"typeChange($event)\"></lib-reactive-select>\r\n </div>\r\n \r\n <!-- </div>\r\n </div> -->\r\n <!-- *ngIf=\"users?.role ==='superadmin'\" -->\r\n <div class=\"col-md-3\">\r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('RmList')?.value?.length)\">\r\n Select RM\r\n </div>\r\n <lib-group-select [items]=\"RmList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userName'\" (selected)=\"onRmSelect($event)\" [selectedValues]=\"eyeTestForm.get('RmList')?.value\">\r\n </lib-group-select>\r\n </div>\r\n \r\n \r\n </div>\r\n <!-- *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\" -->\r\n <div class=\"col-md-3\">\r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('ClusterList')?.value?.length)\">\r\n Select cluster\r\n </div>\r\n <lib-group-select [items]=\"ClusterList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'clusterName'\"\r\n [idField]=\"'clusterName'\" (selected)=\"ongroupSelect($event)\"\r\n [selectedValues]=\"eyeTestForm.get('ClusterList')?.value\">\r\n </lib-group-select>\r\n </div>\r\n </div>\r\n \r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-3 mb-4' : 'col-2 mb-4'\" >\r\n \r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('storeList')?.value?.length)\">\r\n Select Stores\r\n </div>\r\n <lib-stores-select [items]=\"storeList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'storeName'\"\r\n [idField]=\"'storeId'\" (selected)=\"onStoreSelect($event)\"\r\n [selectedValues]=\"eyeTestForm.get('storeList')?.value\"></lib-stores-select>\r\n \r\n </div>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2' : 'col-2'\">\r\n <div class=\"select-wrapper mb-4\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('complianceScore')?.value?.length)\">\r\n Select Score\r\n </div>\r\n <lib-select-drop [items]=\"typePercentageArray\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'label'\"\r\n [idField]=\"'value'\" (selected)=\"typePercentageChange($event)\"\r\n [selectedValues]=\"eyeTestForm.get('complianceScore')?.value\">\r\n </lib-select-drop>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-1 mb-4\">\r\n <lib-reactive-select formControlName=\"auditType\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"auditType\"\r\n (itemChange)=\"auditTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2' : 'col-2'\">\r\n <div class=\"select-wrapper mb-4\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('auditStatus')?.value?.length)\">\r\n Audit Status\r\n </div>\r\n <lib-select-drop [items]=\"auditStatusArray\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'label'\"\r\n [idField]=\"'value'\" (selected)=\"typeAuditStatusChange($event)\"\r\n [selectedValues]=\"eyeTestForm.get('auditStatus')?.value\">\r\n </lib-select-drop>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-md-2\">\r\n <div class=\"mb-4\">\r\n <lib-reactive-select formControlName=\"nearAddition\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"nearAdditionArray\" (itemChange)=\"nearAdditionChange($event)\"></lib-reactive-select>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-md-2\">\r\n <div class=\"mb-4\">\r\n <lib-reactive-select formControlName=\"category\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"categoryArray\" (itemChange)=\"categoryTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n </div>\r\n <div \r\n *ngIf=\"users?.role\" \r\n class=\"text-end\"\r\n [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-1 mb-4'\"\r\n>\r\n<!-- [ngClass]=\"getApplyButtonClass(users?.role, eyeTestForm.get('type')?.value)\" -->\r\n\r\n <a (click)=\"onSubmit();\" type=\"submit\" class=\"btn btn-sm btn-primary py-3 \">\r\n <span>Apply</span>\r\n </a>\r\n\r\n</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </form>\r\n <div *ngIf=\"showEyeTest\" class=\"ms-6 mb-3\">\r\n\r\n <h3 class=\"card-title dashed w-100 row\">\r\n <span class=\"col-10 title-text py-3\"><span class=\"mx-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\"\r\n viewBox=\"0 0 32 32\" fill=\"none\">\r\n <rect width=\"32\" height=\"32\" rx=\"16\" fill=\"#FEE4E2\" />\r\n <g clip-path=\"url(#clip0_235_24234)\">\r\n <path\r\n d=\"M16 13.3335V16.0002M16 18.6668H16.0067M22.6667 16.0002C22.6667 19.6821 19.6819 22.6668 16 22.6668C12.3181 22.6668 9.33337 19.6821 9.33337 16.0002C9.33337 12.3183 12.3181 9.3335 16 9.3335C19.6819 9.3335 22.6667 12.3183 22.6667 16.0002Z\"\r\n stroke=\"#D92D20\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_235_24234\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\" transform=\"translate(8 8)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span><span class=\"dashed-desc\">Eye test video preview is available for 30 days. Audit data\r\n remains accessible, but videos will not be retained beyond this period.</span></span>\r\n <span class=\"col-2 pt-2 text-end cursor-pointer\" (click)=\"closeEyeTest()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\">\r\n <path d=\"M25 15L15 25M15 15L25 25\" stroke=\"#667085\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n </h3>\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<!-- <div class=\"card my-3\">\r\n <div class=\"card-header border-0 py-1\">\r\n \r\n </div>\r\n</div> -->\r\n\r\n<div class=\"row\">\r\n <div *ngIf=\"users?.role ==='superadmin' && keyType ==='rm'\" class=\"col\">\r\n <div class=\"card p-2\">\r\n <div class=\"card-header ellipse1 min-h-55px py-1 px-3 d-flex justify-content-between align-items-center\">\r\n <h5 class=\"card-title my-0\">Regional Managers</h5>\r\n <span class=\"text-value\">{{RmListData ?? '--'}}</span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card mt-5 p-2\">\r\n <div class=\"card-header ellipse1 min-h-55px py-1 px-3 d-flex justify-content-between align-items-center\">\r\n <h5 class=\"card-title my-0\">Clusters</h5>\r\n <span class=\"text-value\">{{groups?.length ?? '--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"users?.role ==='superadmin' && keyType !=='rm' || users?.role ==='admin'\" class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Clusters</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ groups?.length ?? '-' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Total Tango AI Files</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.totalFiles ?? '-' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Trust Audit Completed</h5>\r\n </div>\r\n <div class=\"card-body py-3 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.completedFiles ?? '-' }}</span>\r\n\r\n </div>\r\n <div class=\"card-footer py-0 border-0 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-sub\">{{ (eyeTestCardData?.completedRatio ?? '-') + '%' }} <span\r\n class=\"test-sub\">Completed</span></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Tango Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.tangoScore ?? '-' }}</span>\r\n </div>\r\n <div class=\"card-footer pe-0 ps-3 py-0 border-0 d-flex justify-content-center align-items-center\">\r\n <span>\r\n <svg *ngIf=\"eyeTestCardData?.trend\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\">\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\" stroke=\"#039855\" stroke-width=\"1.5\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <svg *ngIf=\"!eyeTestCardData?.trend\" xmlns=\"http://www.w3.org/2000/svg\" width=\"13\" height=\"12\" viewBox=\"0 0 13 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_760_9776)\">\r\n <path d=\"M11.575 9L6.82495 4.25L4.32495 6.75L0.574951 3M11.575 9H8.57495M11.575 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_760_9776\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0.0749512)\" />\r\n </clipPath>\r\n </defs>\r\n </svg> \r\n <span class=\"text-sub ms-2\">{{ eyeTestCardData?.tangoScoreTrend !== null \r\n ? (getAbsValue(eyeTestCardData.tangoScoreTrend) | number:'1.0-0':'en-US') + '%' \r\n : '-' }}\r\n <span\r\n class=\"test-sub1\">vs previous week</span></span></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Trust Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ (eyeTestCardData?.trustScore && eyeTestCardData?.trustScore !== 'NA' \r\n ? eyeTestCardData.trustScore + '%' \r\n : 'NA') }}</span>\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Human Audited Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ (eyeTestCardData?.humanScore && eyeTestCardData?.humanScore !== 'NA' \r\n ? eyeTestCardData.humanScore \r\n : 'NA') }}</span>\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n \r\n</div>\r\n\r\n\r\n<div class=\"card mt-3\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span *ngIf=\"users?.role === 'superadmin' && keyType ==='rm'\" class=\"title-text mb-2\">\r\n Audit Summary\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary\">{{ totalItems }} Total</span>\r\n </span>\r\n\r\n <!-- Admin + cluster present \u2192 RM Summary -->\r\n <div class=\"d-flex\">\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='cluster' && users?.role === 'superadmin'\" (click)=\"typeVal1('rm','')\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" x=\"0\" y=\"0\" width=\"44\" height=\"44\" filterUnits=\"userSpaceOnUse\"\r\n 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"users?.role === 'admin' && keyType ==='cluster' || users?.role === 'superadmin' && keyType ==='cluster'\" class=\"title-text my-4 mb-2\">\r\n RM Summary\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary text-capitalize\">{{ eyeTestData[0]?.RMName ? eyeTestData[0]?.RMName : '' }}</span>\r\n </span>\r\n </div>\r\n\r\n <!-- All other cases \u2192 Eye Test -->\r\n <div class=\"d-flex \">\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='store' && (users?.role === 'superadmin')\"\r\n (click)=\"typeVal1('cluster',this.rmEmail)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='store' && (users?.role === 'admin')\"\r\n (click)=\"typeVal1('cluster',this.groups)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"!(users?.role === 'superadmin' && keyType ==='rm') && !(users?.role === 'superadmin' && keyType ==='cluster') \r\n && !(users?.role === 'admin' && keyType ==='cluster')\" class=\"title-text my-4 mb-2\">\r\n Eye Test\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary\">{{ totalItems }} Total</span>\r\n </span>\r\n </div>\r\n <span *ngIf=\"users?.role ==='superadmin' && keyType ==='rm'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n <span *ngIf=\"users?.role ==='admin' && keyType ==='cluster'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n <span *ngIf=\"users?.role ==='user' && keyType ==='store'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" 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\"></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 <input (change)=\"searchData()\" [(ngModel)]=\"searchValue\" type=\"text\" class=\"form-control ps-14 me-2\" autocomplete=\"off\"\r\n [placeholder]=\"\r\n keyType === 'rm'\r\n ? 'Search by RMName'\r\n : keyType === 'cluster'\r\n ? 'Search by Cluster'\r\n : 'Search'\r\n \" />\r\n\r\n\r\n <span class=\"cursor-pointer\" *ngIf=\"users?.role ==='superadmin'\" (click)=\"settingsView()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"45\" height=\"46\"\r\n viewBox=\"0 0 45 46\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_760_9988)\">\r\n <rect x=\"2.71973\" y=\"1.98047\" width=\"40.04\" height=\"40.04\" rx=\"7.28\" fill=\"white\" />\r\n <rect x=\"3.17473\" y=\"2.43547\" width=\"39.13\" height=\"39.13\" rx=\"6.825\" stroke=\"#D0D5DD\"\r\n stroke-width=\"0.91\" />\r\n <g clip-path=\"url(#clip0_760_9988)\">\r\n <path\r\n d=\"M22.7396 24.2749C23.9961 24.2749 25.0146 23.2563 25.0146 21.9999C25.0146 20.7434 23.9961 19.7249 22.7396 19.7249C21.4832 19.7249 20.4646 20.7434 20.4646 21.9999C20.4646 23.2563 21.4832 24.2749 22.7396 24.2749Z\"\r\n stroke=\"#344054\" stroke-width=\"1.5197\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M28.3513 24.2749C28.2503 24.5036 28.2202 24.7573 28.2648 25.0033C28.3094 25.2493 28.4267 25.4763 28.6015 25.655L28.647 25.7005C28.788 25.8414 28.8999 26.0087 28.9762 26.1928C29.0526 26.3769 29.0919 26.5743 29.0919 26.7736C29.0919 26.9729 29.0526 27.1703 28.9762 27.3544C28.8999 27.5385 28.788 27.7058 28.647 27.8466C28.5062 27.9876 28.3389 28.0995 28.1548 28.1758C27.9707 28.2522 27.7733 28.2914 27.574 28.2914C27.3747 28.2914 27.1773 28.2522 26.9932 28.1758C26.8091 28.0995 26.6418 27.9876 26.5009 27.8466L26.4554 27.8011C26.2767 27.6263 26.0497 27.509 25.8037 27.4644C25.5577 27.4198 25.304 27.4499 25.0753 27.5509C24.851 27.647 24.6597 27.8066 24.525 28.0101C24.3902 28.2135 24.3179 28.4519 24.3169 28.696V28.8249C24.3169 29.2271 24.1572 29.6129 23.8727 29.8973C23.5883 30.1817 23.2025 30.3415 22.8003 30.3415C22.398 30.3415 22.0123 30.1817 21.7278 29.8973C21.4434 29.6129 21.2836 29.2271 21.2836 28.8249V28.7566C21.2777 28.5056 21.1965 28.2622 21.0504 28.058C20.9044 27.8538 20.7003 27.6982 20.4646 27.6115C20.2359 27.5106 19.9822 27.4805 19.7362 27.5251C19.4902 27.5697 19.2632 27.687 19.0844 27.8618L19.0389 27.9073C18.8981 28.0483 18.7308 28.1602 18.5467 28.2365C18.3626 28.3128 18.1652 28.3521 17.9659 28.3521C17.7666 28.3521 17.5692 28.3128 17.3851 28.2365C17.201 28.1602 17.0337 28.0483 16.8929 27.9073C16.7519 27.7664 16.64 27.5992 16.5637 27.415C16.4873 27.2309 16.448 27.0336 16.448 26.8342C16.448 26.6349 16.4873 26.4376 16.5637 26.2535C16.64 26.0693 16.7519 25.9021 16.8929 25.7612L16.9384 25.7157C17.1132 25.537 17.2305 25.31 17.2751 25.064C17.3197 24.818 17.2896 24.5643 17.1886 24.3355C17.0925 24.1112 16.9329 23.92 16.7294 23.7852C16.526 23.6505 16.2876 23.5782 16.0435 23.5772H15.9146C15.5124 23.5772 15.1266 23.4174 14.8422 23.133C14.5577 22.8486 14.3979 22.4628 14.3979 22.0605C14.3979 21.6583 14.5577 21.2725 14.8422 20.9881C15.1266 20.7037 15.5124 20.5439 15.9146 20.5439H15.9829C16.2339 20.538 16.4773 20.4568 16.6815 20.3107C16.8857 20.1646 17.0413 19.9605 17.1279 19.7249C17.2289 19.4961 17.259 19.2424 17.2144 18.9964C17.1698 18.7504 17.0525 18.5234 16.8777 18.3447L16.8322 18.2992C16.6912 18.1583 16.5793 17.9911 16.503 17.807C16.4267 17.6228 16.3874 17.4255 16.3874 17.2262C16.3874 17.0268 16.4267 16.8295 16.503 16.6454C16.5793 16.4612 16.6912 16.294 16.8322 16.1531C16.9731 16.0121 17.1403 15.9002 17.3244 15.8239C17.5086 15.7476 17.7059 15.7083 17.9052 15.7083C18.1046 15.7083 18.3019 15.7476 18.486 15.8239C18.6702 15.9002 18.8374 16.0121 18.9783 16.1531L19.0238 16.1986C19.2025 16.3734 19.4295 16.4907 19.6755 16.5353C19.9215 16.5799 20.1752 16.5498 20.4039 16.4489H20.4646C20.6889 16.3527 20.8802 16.1931 21.0149 15.9897C21.1497 15.7862 21.222 15.5478 21.2229 15.3038V15.1749C21.2229 14.7726 21.3827 14.3869 21.6672 14.1024C21.9516 13.818 22.3374 13.6582 22.7396 13.6582C23.1419 13.6582 23.5276 13.818 23.8121 14.1024C24.0965 14.3869 24.2563 14.7726 24.2563 15.1749V15.2431C24.2573 15.4871 24.3296 15.7256 24.4643 15.929C24.599 16.1325 24.7903 16.2921 25.0146 16.3882C25.2433 16.4891 25.4971 16.5193 25.7431 16.4747C25.9891 16.4301 26.2161 16.3128 26.3948 16.138L26.4403 16.0925C26.5811 15.9514 26.7484 15.8396 26.9325 15.7632C27.1167 15.6869 27.314 15.6476 27.5133 15.6476C27.7126 15.6476 27.91 15.6869 28.0941 15.7632C28.2782 15.8396 28.4455 15.9514 28.5864 16.0925C28.7274 16.2333 28.8392 16.4006 28.9156 16.5847C28.9919 16.7688 29.0312 16.9662 29.0312 17.1655C29.0312 17.3648 28.9919 17.5622 28.9156 17.7463C28.8392 17.9304 28.7274 18.0977 28.5864 18.2385L28.5409 18.284C28.366 18.4628 28.2488 18.6898 28.2042 18.9358C28.1596 19.1818 28.1897 19.4355 28.2906 19.6642V19.7249C28.3867 19.9492 28.5464 20.1404 28.7498 20.2752C28.9533 20.4099 29.1917 20.4822 29.4357 20.4832H29.5646C29.9669 20.4832 30.3526 20.643 30.6371 20.9274C30.9215 21.2119 31.0813 21.5976 31.0813 21.9999C31.0813 22.4021 30.9215 22.7879 30.6371 23.0723C30.3526 23.3567 29.9669 23.5165 29.5646 23.5165H29.4964C29.2523 23.5175 29.0139 23.5898 28.8105 23.7246C28.607 23.8593 28.4474 24.0506 28.3513 24.2749Z\"\r\n stroke=\"#344054\" stroke-width=\"1.5197\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_760_9988\" x=\"0.719727\" y=\"0.980469\" width=\"44.04\" height=\"44.04\"\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_760_9988\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_760_9988\"\r\n result=\"shape\" />\r\n </filter>\r\n <clipPath id=\"clip0_760_9988\">\r\n <rect width=\"18.2\" height=\"18.2\" fill=\"white\"\r\n transform=\"translate(13.6396 12.9004)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n\r\n <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"19\" height=\"20\" viewBox=\"0 0 19 20\" fill=\"none\">\r\n <path d=\"M7.53369 12.8441H15.0241L13.5568 14.3172L14.3587 15.1191L17.2024 12.2754L14.3587 9.43164L13.5568 10.2336L15.0241 11.7066H7.53369V12.8441Z\" fill=\"black\"/>\r\n <path d=\"M12.6526 8.8631V6.5881C12.653 6.51325 12.6387 6.43904 12.6104 6.36975C12.5821 6.30045 12.5404 6.23743 12.4877 6.18428L8.5064 2.20303C8.45326 2.15032 8.39023 2.10862 8.32094 2.08031C8.25164 2.05201 8.17744 2.03766 8.10259 2.0381H2.41509C2.1134 2.0381 1.82408 2.15794 1.61075 2.37126C1.39743 2.58458 1.27759 2.87391 1.27759 3.1756V16.8256C1.27759 17.1273 1.39743 17.4166 1.61075 17.6299C1.82408 17.8433 2.1134 17.9631 2.41509 17.9631H11.5151C11.8168 17.9631 12.1061 17.8433 12.3194 17.6299C12.5327 17.4166 12.6526 17.1273 12.6526 16.8256V15.6881H11.5151V16.8256H2.41509V3.1756H6.96509V6.5881C6.96509 6.88978 7.08493 7.17911 7.29826 7.39243C7.51158 7.60575 7.80091 7.7256 8.10259 7.7256H11.5151V8.8631H12.6526ZM8.10259 6.5881V3.40878L11.2819 6.5881H8.10259Z\" fill=\"black\"/>\r\n</svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"loading\" 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 <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata-table\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this eye test table</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!noData && !loading\" class=\"card-body\">\r\n <div class=\"table-responsive\">\r\n <table *ngIf=\"keyType ==='store'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('date')\"> Date <svg\r\n [ngClass]=\"sortedColumn === 'date' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'date' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('auditedDate')\">Audited Date <svg\r\n [ngClass]=\"sortedColumn === 'auditedDate' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'auditedDate' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th *ngIf=\"users?.role ==='superadmin'\" class=\"text-start\">\r\n RM Name\r\n </th>\r\n <th *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\" class=\"text-start\">\r\n Cluster Name\r\n </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name <svg\r\n [ngClass]=\"sortedColumn === 'storeName' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storeName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID <svg\r\n [ngClass]=\"sortedColumn === 'storeId' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'storeId' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th *ngIf=\"this.typeValue ==='remote'\" class=\"text-start\">Engagement ID</th>\r\n <th class=\"text-start\">Optom ID</th>\r\n <th class=\"text-start\">Optom Email ID</th>\r\n <th *ngIf=\"this.typeValue ==='remote'\" class=\"text-start\">Optom Name</th>\r\n <th *ngIf=\"this.typeValue !=='remote'\" class=\"text-start\">Queue ID</th>\r\n <th *ngIf=\"this.typeValue !=='remote'\" class=\"text-start\">Power Types</th>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('ComplianceScore')\">Tango Score <svg\r\n [ngClass]=\"sortedColumn === 'ComplianceScore' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'ComplianceScore' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> \r\n </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('coveredStepsAI')\">Steps Covered By AI <svg\r\n [ngClass]=\"sortedColumn === 'coveredStepsAI' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'coveredStepsAI' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('trustScore')\">Trust Score <svg\r\n [ngClass]=\"sortedColumn === 'trustScore' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'trustScore' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n\r\n<th><span class=\"cursor-pointer\" (click)=\"onSort('auditedSteps')\">Steps Covered By Human <svg\r\n [ngClass]=\"sortedColumn === 'auditedSteps' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'auditedSteps' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th>Human Audited Score</th>\r\n\r\n \r\n\r\n <th *ngIf=\"this.typeValue !=='remote'\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('visitorsType')\">Visitor Type <svg\r\n [ngClass]=\"sortedColumn === 'visitorsType' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'visitorsType' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th class=\"text-start\">Test Duration</th>\r\n <th class=\"text-start\" *ngIf=\"this.typeValue !=='remote'\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('comment')\">Eye Test Status <svg\r\n [ngClass]=\"sortedColumn === 'comment' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'comment' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th class=\"text-start\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('subComment')\">Comments <svg\r\n [ngClass]=\"sortedColumn === 'subComment' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'subComment' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('auditStatus')\">Audit Status <svg\r\n [ngClass]=\"sortedColumn === 'auditStatus' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'auditStatus' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th class=\"text-start\">Audited By</th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.date | date:'dd MMM, yyyy'}}</td>\r\n <td>{{obj?.auditedDate}}</td>\r\n <td *ngIf=\"users?.role === 'superadmin'\">\r\n <ng-container *ngIf=\"obj?.RMName\">\r\n <!-- Split and show the first value -->\r\n {{ obj.RMName.split(',')[0] }}\r\n\r\n <!-- Show +N badge if more values exist -->\r\n <span *ngIf=\"obj.RMName.split(',').length > 1\" class=\"badge badge-light-default ms-2\">\r\n +{{ obj.RMName.split(',').length - 1 }}\r\n </span>\r\n </ng-container>\r\n</td>\r\n\r\n <td *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\">\r\n <ng-container *ngIf=\"obj?.clusterName\">\r\n {{ obj.clusterName.split(',')[0] }}\r\n <span *ngIf=\"obj.clusterName.split(',').length > 1\" class=\"badge badge-light-default ms-2\">\r\n +{{ obj.clusterName.split(',').length - 1 }}\r\n </span>\r\n </ng-container>\r\n \r\n \r\n </td>\r\n <td>{{obj?.storeName}}</td>\r\n <td>{{obj?.storeId}}</td>\r\n <td *ngIf=\"this.typeValue ==='remote'\" class=\"engage-text\">{{obj?.engagementId}}</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\">{{obj?.optumId ? obj?.optumId :''}}\r\n <td *ngIf=\"this.typeValue ==='remote'\">{{obj?.optm_userId ? obj?.optm_userId :''}}\r\n <td *ngIf=\"this.typeValue !=='remote'\">{{obj?.salesmanEmailId ? obj?.salesmanEmailId :''}}\r\n <td *ngIf=\"this.typeValue =='remote'\">{{obj?.userEmail ? obj?.userEmail :''}}\r\n <td *ngIf=\"this.typeValue ==='remote'\">{{obj?.displayName ? obj?.displayName :''}}\r\n </td>\r\n <td *ngIf=\"this.typeValue !=='remote'\" class=\"engage-text\">{{obj?.queueId ?\r\n obj?.queueId:''}}</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\" >{{obj?.nearAddition ?\r\n obj?.nearAddition == \"true\"? \"With Near Addition\" :\"Without Near Addition\":'--'}}</td>\r\n <td>\r\n {{ obj?.complianceScore ?? '--' }}\r\n</td>\r\n<td>{{obj?.coveredStepsAI ? obj?.coveredStepsAI:'--'}}</td>\r\n <td>{{obj?.trustScore ?? '--'}}</td>\r\n <td>{{obj?.auditedSteps ? obj?.auditedSteps:'--'}}</td>\r\n <td>{{obj?.humanComplianceScore ? obj?.humanComplianceScore :'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"this.typeValue !=='remote'\">{{obj?.visitorsType ?\r\n obj?.visitorsType:'--'}}</td>\r\n <td>{{obj?.min ? obj?.min :'0'}} mins {{obj?.sec ?\r\n obj?.sec:'0'}} secs</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\">\r\n <span \r\n class=\"badge\" \r\n [ngClass]=\"obj?.comment ? 'badge-light-danger' : 'badge-light-success'\">\r\n {{ obj?.comment ? 'Fake' : 'Genuine' }}\r\n </span>\r\n</td>\r\n <td>{{obj?.subComment ? obj?.subComment:'--'}}</td>\r\n <td><span class=\"badge badge-light-primary\"\r\n *ngIf=\"obj?.auditStatus ==='Yet-to-Audit'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-warning\"\r\n *ngIf=\"obj?.auditStatus ==='Re-Audited'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-success\"\r\n *ngIf=\"obj?.auditStatus ==='Audited'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-info\"\r\n *ngIf=\"obj?.auditStatus ==='In-Progress'\">{{obj?.auditStatus}}</span>\r\n </td>\r\n <td>{{obj?.auditedBy?obj?.auditedBy:\"-\"}}</td>\r\n <td class=\"cursor-pointer\" (click)=\"eyeTestView(obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <table *ngIf=\"keyType ==='rm'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('RMName')\"> RM Name <svg\r\n [ngClass]=\"sortedColumn === 'RMName' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'RMName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('clusterCount')\"> Clusters Count <svg\r\n [ngClass]=\"sortedColumn === 'clusterCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'clusterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('storesCount')\">Stores Count <svg\r\n [ngClass]=\"sortedColumn === 'storesCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n Total Tango AI Files\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Audit Completed \r\n </th>\r\n <th class=\"text-start\">\r\n Tango Score \r\n </th>\r\n <th class=\"text-start\">\r\n Trust Score \r\n </th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.RMName ? obj?.RMName:'--'}}</td>\r\n <td>{{obj?.clusterCount ? obj?.clusterCount:'--'}}</td>\r\n <td>{{obj?.storesCount ? obj?.storesCount:'--'}}</td>\r\n <td>{{obj?.totalFiles ?? '--'}}</td>\r\n <td>{{obj?.completedFiles ?? '--'}}</td>\r\n <td>{{obj.complianceScore ?? '--'}}\r\n \r\n</td>\r\n<td>\r\n {{ obj?.trustScore ?? '--' }}\r\n</td>\r\n <td class=\"cursor-pointer\" (click)=\"typeVal('cluster',obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <table *ngIf=\"keyType ==='cluster'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n \r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('clusterName')\"> Clusters Name <svg\r\n [ngClass]=\"sortedColumn === 'clusterName' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'clusterName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('storesCount')\">Stores Count <svg\r\n [ngClass]=\"sortedColumn === 'storesCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n Total Tango AI Files\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Audit Completed\r\n </th>\r\n <th class=\"text-start\">\r\n Tango Score\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Score\r\n </th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.clusterName ? obj?.clusterName:'--'}}</td>\r\n <td>{{obj?.storesCount ? obj?.storesCount:'--'}}</td>\r\n <td>{{obj?.totalFiles ?? '--'}}</td>\r\n <td>{{obj?.completedFiles ?? '--'}}</td>\r\n <td>\r\n {{ obj?.complianceScore ?? '--' }}\r\n</td>\r\n<td>\r\n {{ obj?.trustScore ?? '--' }}\r\n</td>\r\n <td class=\"cursor-pointer\" (click)=\"typeVal('store',obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n </div>\r\n </div>\r\n <div class=\"card-footer\" *ngIf=\"!noData && !loading\">\r\n <lib-pagination [itemsPerPage]=\"pageSize\" [currentPage]=\"offset\" [totalItems]=\"totalItems\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n</div>\r\n</section>\r\n\r\n\r\n<section *ngIf=\"eyeView\" class=\"container-fluid new1 mt-4\">\r\n<div class=\"card p-5\">\r\n <div class=\"d-flex align-items-center\">\r\n <div (click)=\"backNavigation()\" class=\"btn btn-am btn-outline p-3\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15.8332 9.99984H4.1665M4.1665 9.99984L9.99984 15.8332M4.1665 9.99984L9.99984 4.1665\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </div>\r\n <span *ngIf=\"currentAuditType !== 'remote'\" class=\"ms-3 badge badge-light-default\">{{auditDetails?.optumId}}</span> \r\n <span *ngIf=\"currentAuditType === 'remote'\" class=\"ms-3 badge badge-light-default\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M10 10.5V9.5C10 8.96957 9.78929 8.46086 9.41421 8.08579C9.03914 7.71071 8.53043 7.5 8 7.5H4C3.46957 7.5 2.96086 7.71071 2.58579 8.08579C2.21071 8.46086 2 8.96957 2 9.5V10.5M8 3.5C8 4.60457 7.10457 5.5 6 5.5C4.89543 5.5 4 4.60457 4 3.5C4 2.39543 4.89543 1.5 6 1.5C7.10457 1.5 8 2.39543 8 3.5Z\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>{{auditDetails?.displayName ? auditDetails?.displayName:'--'}}</span> \r\n <span class=\"d-flex ms-1 align-items-center\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"\" opacity=\"0.1\"></rect>\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"\" stroke-width=\"6\"></rect>\r\n <path d=\"M15.6799 18.8039L15.6267 18.8871C15.0686 19.8741 15.6644 21.1215 16.7361 21.2646C16.8331 21.2765 16.9235 21.2828 17.0118 21.2828C17.5899 21.2828 18.1011 21.0348 18.4574 20.648L19.0107 20.0474L19.5621 20.6498C19.9141 21.0342 20.4241 21.2828 21.0061 21.2828C21.5856 21.2828 22.0985 21.0338 22.4502 20.6498L23.0033 20.0455L23.5565 20.6498C23.9081 21.0338 24.4211 21.2828 25.0005 21.2828C25.58 21.2828 26.0929 21.0338 26.4445 20.6498L26.9977 20.0455L27.5509 20.6498C27.9025 21.0338 28.4155 21.2828 28.9949 21.2828C29.0803 21.2828 29.1733 21.2765 29.2697 21.2647C30.3649 21.1154 30.9627 19.8012 30.324 18.8044C30.324 18.8043 30.324 18.8043 30.3239 18.8042L28.5658 16.0628L28.5658 16.0628L28.5648 16.0614C28.5496 16.0375 28.5121 16.012 28.465 16.012H17.5356C17.4884 16.012 17.4509 16.0375 17.4357 16.0614L17.4351 16.0623L15.6799 18.8039ZM28.6514 23.7372V26.8691V27.6191H27.9014H18.0992H17.3492V26.8691V23.7376C17.239 23.7458 17.1274 23.7501 17.0148 23.7501C16.9725 23.7501 16.9305 23.7494 16.8888 23.7482V26.8691V28.8036C16.8888 29.4471 17.4227 29.9882 18.0992 29.9882H27.9014C28.5779 29.9882 29.1118 29.4471 29.1118 28.8036V26.8691V23.7484C29.072 23.7495 29.032 23.7501 28.9918 23.7501C28.8774 23.7501 28.7639 23.7457 28.6514 23.7372Z\" stroke=\"#000000\" stroke-width=\"1.5\"></path></svg> \r\n <span class=\"ms-1 sub-title\"> {{auditDetails.storeName}}</span>\r\n </span>\r\n\r\n \r\n <!-- displayName -->\r\n <div *ngIf=\"currentAuditType !== 'remote'\" class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M5.25021 6.50028C5.91329 6.50028 6.54921 6.23689 7.01807 5.76807C7.48694 5.29924 7.75035 4.66337 7.75035 4.00035C7.75035 3.33732 7.48694 2.70146 7.01807 2.23263C6.54921 1.7638 5.91329 1.50042 5.25021 1.50042C4.58713 1.50042 3.95121 1.7638 3.48234 2.23263C3.01348 2.70146 2.75007 3.33732 2.75007 4.00035C2.75007 4.66337 3.01348 5.29924 3.48234 5.76807C3.95121 6.23689 4.58713 6.50028 5.25021 6.50028ZM5.25021 5.25031C4.91867 5.25031 4.60071 5.11862 4.36628 4.88421C4.13184 4.64979 4.00014 4.33186 4.00014 4.00035C4.00014 3.66884 4.13184 3.3509 4.36628 3.11649C4.60071 2.88207 4.91867 2.75038 5.25021 2.75038C5.58175 2.75038 5.89971 2.88207 6.13414 3.11649C6.36857 3.3509 6.50028 3.66884 6.50028 4.00035C6.50028 4.33186 6.36857 4.64979 6.13414 4.88421C5.89971 5.11862 5.58175 5.25031 5.25021 5.25031ZM1.5 8.79188C1.5 7.9869 2.15337 7.33359 2.95841 7.33359H7.542C8.34705 7.33359 9.00042 7.9869 9.00042 8.79188V12.7501C9.00042 13.7446 8.60531 14.6984 7.90201 15.4017C7.1987 16.1049 6.24483 16.5 5.25021 16.5C4.25559 16.5 3.30171 16.1049 2.59841 15.4017C1.89511 14.6984 1.5 13.7446 1.5 12.7501V8.79188ZM2.95841 8.58355C2.90316 8.58355 2.85016 8.6055 2.81109 8.64457C2.77202 8.68364 2.75007 8.73663 2.75007 8.79188V12.7501C2.75007 13.4131 3.01348 14.049 3.48234 14.5178C3.95121 14.9867 4.58713 15.25 5.25021 15.25C5.91329 15.25 6.54921 14.9867 7.01807 14.5178C7.48694 14.049 7.75035 13.4131 7.75035 12.7501V8.79188C7.75035 8.73663 7.7284 8.68364 7.68932 8.64457C7.65025 8.6055 7.59726 8.58355 7.542 8.58355H2.95841ZM7.77285 6.17862C8.15328 6.39267 8.58313 6.5034 9.01963 6.49978C9.45614 6.49616 9.8841 6.37832 10.2609 6.15799C10.6378 5.93766 10.9503 5.62252 11.1675 5.24391C11.3848 4.8653 11.499 4.43642 11.499 3.99993C11.499 3.56344 11.3848 3.13456 11.1675 2.75595C10.9503 2.37734 10.6378 2.0622 10.2609 1.84187C9.8841 1.62154 9.45614 1.50371 9.01963 1.50009C8.58313 1.49647 8.15328 1.60719 7.77285 1.82124C8.04536 2.13623 8.25954 2.50289 8.39955 2.90454C8.58991 2.80026 8.80415 2.74733 9.02118 2.75097C9.23821 2.75462 9.45055 2.81471 9.63731 2.92533C9.82406 3.03594 9.97879 3.19328 10.0863 3.38185C10.1937 3.57042 10.2503 3.78372 10.2503 4.00076C10.2503 4.21781 10.1937 4.43111 10.0863 4.61968C9.97879 4.80825 9.82406 4.96558 9.63731 5.0762C9.45055 5.18682 9.23821 5.24691 9.02118 5.25055C8.80415 5.2542 8.58991 5.20127 8.39955 5.09698C8.26074 5.49382 8.0481 5.86082 7.77285 6.17862ZM8.05036 16.3783C8.35483 16.4583 8.67151 16.4989 9.00042 16.5C9.99503 16.5 10.9489 16.1049 11.6522 15.4017C12.3555 14.6984 12.7506 13.7446 12.7506 12.7501V8.79188C12.7506 8.40512 12.597 8.03419 12.3235 7.76071C12.05 7.48723 11.679 7.33359 11.2922 7.33359H9.30877C9.59462 7.67941 9.78046 8.11107 9.8238 8.58355H11.2905C11.3458 8.58355 11.3988 8.6055 11.4379 8.64457C11.4769 8.68364 11.4989 8.73663 11.4989 8.79188V12.7501C11.4989 13.3968 11.2483 14.0184 10.7996 14.4843C10.351 14.9501 9.73925 15.224 9.09292 15.2484C8.81041 15.6817 8.45872 16.0633 8.05036 16.3783ZM11.5222 6.17862C11.9027 6.39267 12.3325 6.5034 12.769 6.49978C13.2055 6.49616 13.6335 6.37832 14.0103 6.15799C14.3871 5.93766 14.6997 5.62252 14.9169 5.24391C15.1341 4.8653 15.2484 4.43642 15.2484 3.99993C15.2484 3.56344 15.1341 3.13456 14.9169 2.75595C14.6997 2.37734 14.3871 2.0622 14.0103 1.84187C13.6335 1.62154 13.2055 1.50371 12.769 1.50009C12.3325 1.49647 11.9027 1.60719 11.5222 1.82124C11.7947 2.13623 12.0089 2.50289 12.1489 2.90454C12.3393 2.80026 12.5535 2.74733 12.7706 2.75097C12.9876 2.75462 13.1999 2.81471 13.3867 2.92533C13.5734 3.03594 13.7282 3.19328 13.8356 3.38185C13.9431 3.57042 13.9996 3.78372 13.9996 4.00076C13.9996 4.21781 13.9431 4.43111 13.8356 4.61968C13.7282 4.80825 13.5734 4.96558 13.3867 5.0762C13.1999 5.18682 12.9876 5.24691 12.7706 5.25055C12.5535 5.2542 12.3393 5.20127 12.1489 5.09698C12.0101 5.49382 11.7975 5.86082 11.5222 6.17862ZM11.7997 16.3783C12.1042 16.4583 12.4209 16.4989 12.7498 16.5C13.7444 16.5 14.6983 16.1049 15.4016 15.4017C16.1049 14.6984 16.5 13.7446 16.5 12.7501V8.79188C16.5 8.40526 16.3465 8.03447 16.0731 7.76101C15.7998 7.48755 15.4291 7.33381 15.0424 7.33359H13.059C13.3448 7.67941 13.5315 8.11107 13.574 8.58355H15.0408C15.096 8.58355 15.149 8.6055 15.1881 8.64457C15.2271 8.68364 15.2491 8.73663 15.2491 8.79188V12.7501C15.2491 13.3968 14.9985 14.0184 14.5498 14.4843C14.1012 14.9501 13.4895 15.224 12.8431 15.2484C12.5606 15.6817 12.2081 16.0633 11.7997 16.3783Z\"\r\n fill=\"#667085\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.queueId}}</span>\r\n </div>\r\n <div *ngIf=\"currentAuditType === 'remote'\" class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M5.25021 6.50028C5.91329 6.50028 6.54921 6.23689 7.01807 5.76807C7.48694 5.29924 7.75035 4.66337 7.75035 4.00035C7.75035 3.33732 7.48694 2.70146 7.01807 2.23263C6.54921 1.7638 5.91329 1.50042 5.25021 1.50042C4.58713 1.50042 3.95121 1.7638 3.48234 2.23263C3.01348 2.70146 2.75007 3.33732 2.75007 4.00035C2.75007 4.66337 3.01348 5.29924 3.48234 5.76807C3.95121 6.23689 4.58713 6.50028 5.25021 6.50028ZM5.25021 5.25031C4.91867 5.25031 4.60071 5.11862 4.36628 4.88421C4.13184 4.64979 4.00014 4.33186 4.00014 4.00035C4.00014 3.66884 4.13184 3.3509 4.36628 3.11649C4.60071 2.88207 4.91867 2.75038 5.25021 2.75038C5.58175 2.75038 5.89971 2.88207 6.13414 3.11649C6.36857 3.3509 6.50028 3.66884 6.50028 4.00035C6.50028 4.33186 6.36857 4.64979 6.13414 4.88421C5.89971 5.11862 5.58175 5.25031 5.25021 5.25031ZM1.5 8.79188C1.5 7.9869 2.15337 7.33359 2.95841 7.33359H7.542C8.34705 7.33359 9.00042 7.9869 9.00042 8.79188V12.7501C9.00042 13.7446 8.60531 14.6984 7.90201 15.4017C7.1987 16.1049 6.24483 16.5 5.25021 16.5C4.25559 16.5 3.30171 16.1049 2.59841 15.4017C1.89511 14.6984 1.5 13.7446 1.5 12.7501V8.79188ZM2.95841 8.58355C2.90316 8.58355 2.85016 8.6055 2.81109 8.64457C2.77202 8.68364 2.75007 8.73663 2.75007 8.79188V12.7501C2.75007 13.4131 3.01348 14.049 3.48234 14.5178C3.95121 14.9867 4.58713 15.25 5.25021 15.25C5.91329 15.25 6.54921 14.9867 7.01807 14.5178C7.48694 14.049 7.75035 13.4131 7.75035 12.7501V8.79188C7.75035 8.73663 7.7284 8.68364 7.68932 8.64457C7.65025 8.6055 7.59726 8.58355 7.542 8.58355H2.95841ZM7.77285 6.17862C8.15328 6.39267 8.58313 6.5034 9.01963 6.49978C9.45614 6.49616 9.8841 6.37832 10.2609 6.15799C10.6378 5.93766 10.9503 5.62252 11.1675 5.24391C11.3848 4.8653 11.499 4.43642 11.499 3.99993C11.499 3.56344 11.3848 3.13456 11.1675 2.75595C10.9503 2.37734 10.6378 2.0622 10.2609 1.84187C9.8841 1.62154 9.45614 1.50371 9.01963 1.50009C8.58313 1.49647 8.15328 1.60719 7.77285 1.82124C8.04536 2.13623 8.25954 2.50289 8.39955 2.90454C8.58991 2.80026 8.80415 2.74733 9.02118 2.75097C9.23821 2.75462 9.45055 2.81471 9.63731 2.92533C9.82406 3.03594 9.97879 3.19328 10.0863 3.38185C10.1937 3.57042 10.2503 3.78372 10.2503 4.00076C10.2503 4.21781 10.1937 4.43111 10.0863 4.61968C9.97879 4.80825 9.82406 4.96558 9.63731 5.0762C9.45055 5.18682 9.23821 5.24691 9.02118 5.25055C8.80415 5.2542 8.58991 5.20127 8.39955 5.09698C8.26074 5.49382 8.0481 5.86082 7.77285 6.17862ZM8.05036 16.3783C8.35483 16.4583 8.67151 16.4989 9.00042 16.5C9.99503 16.5 10.9489 16.1049 11.6522 15.4017C12.3555 14.6984 12.7506 13.7446 12.7506 12.7501V8.79188C12.7506 8.40512 12.597 8.03419 12.3235 7.76071C12.05 7.48723 11.679 7.33359 11.2922 7.33359H9.30877C9.59462 7.67941 9.78046 8.11107 9.8238 8.58355H11.2905C11.3458 8.58355 11.3988 8.6055 11.4379 8.64457C11.4769 8.68364 11.4989 8.73663 11.4989 8.79188V12.7501C11.4989 13.3968 11.2483 14.0184 10.7996 14.4843C10.351 14.9501 9.73925 15.224 9.09292 15.2484C8.81041 15.6817 8.45872 16.0633 8.05036 16.3783ZM11.5222 6.17862C11.9027 6.39267 12.3325 6.5034 12.769 6.49978C13.2055 6.49616 13.6335 6.37832 14.0103 6.15799C14.3871 5.93766 14.6997 5.62252 14.9169 5.24391C15.1341 4.8653 15.2484 4.43642 15.2484 3.99993C15.2484 3.56344 15.1341 3.13456 14.9169 2.75595C14.6997 2.37734 14.3871 2.0622 14.0103 1.84187C13.6335 1.62154 13.2055 1.50371 12.769 1.50009C12.3325 1.49647 11.9027 1.60719 11.5222 1.82124C11.7947 2.13623 12.0089 2.50289 12.1489 2.90454C12.3393 2.80026 12.5535 2.74733 12.7706 2.75097C12.9876 2.75462 13.1999 2.81471 13.3867 2.92533C13.5734 3.03594 13.7282 3.19328 13.8356 3.38185C13.9431 3.57042 13.9996 3.78372 13.9996 4.00076C13.9996 4.21781 13.9431 4.43111 13.8356 4.61968C13.7282 4.80825 13.5734 4.96558 13.3867 5.0762C13.1999 5.18682 12.9876 5.24691 12.7706 5.25055C12.5535 5.2542 12.3393 5.20127 12.1489 5.09698C12.0101 5.49382 11.7975 5.86082 11.5222 6.17862ZM11.7997 16.3783C12.1042 16.4583 12.4209 16.4989 12.7498 16.5C13.7444 16.5 14.6983 16.1049 15.4016 15.4017C16.1049 14.6984 16.5 13.7446 16.5 12.7501V8.79188C16.5 8.40526 16.3465 8.03447 16.0731 7.76101C15.7998 7.48755 15.4291 7.33381 15.0424 7.33359H13.059C13.3448 7.67941 13.5315 8.11107 13.574 8.58355H15.0408C15.096 8.58355 15.149 8.6055 15.1881 8.64457C15.2271 8.68364 15.2491 8.73663 15.2491 8.79188V12.7501C15.2491 13.3968 14.9985 14.0184 14.5498 14.4843C14.1012 14.9501 13.4895 15.224 12.8431 15.2484C12.5606 15.6817 12.2081 16.0633 11.7997 16.3783Z\"\r\n fill=\"#667085\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.engagementId ?auditDetails?.engagementId:'--'}}</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" 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\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{currentAuditType | titlecase}} Eye Test</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" 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\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.fileDate | date: 'dd/MM/YYYY'}}</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_166_55019)\">\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\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_166_55019\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.testStartTime}} {{auditDetails?.testStartTime?.split(':')[0]>12?'PM':'AM'}} - {{auditDetails?.testEndTime}} {{auditDetails?.testEndTime?.split(':')[0]>12?'PM':'AM'}}\r\n ({{auditDetails?.testDuration}} Mins)</span>\r\n </div>\r\n <span class=\"ms-3 badge badge-light-primary\">{{auditDetails?.visitorsType | titlecase}}</span>\r\n <div *ngIf=\"['Yet-to-Audit'].includes(auditDetails?.auditStatus)\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-primary\" style=\"font-size: 14px;\">\r\n Yet to Audit\r\n </div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Audited'\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-success\" style=\"font-size: 14px;\">\r\n Audited\r\n </div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Audited' || auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Re-Audited'\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-warning\" style=\"font-size: 14px;\">\r\n Re-Audited\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"row mt-3\">\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 text-center header-card\">\r\n AI Verified Steps <span><svg ngbTooltip=\"Number of steps detected and validated automatically without manual review.\" placement=\"right\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" \r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.coveredStepsAI?auditDetails?.coveredStepsAI:0}}/{{auditDetails?.totalSteps ? auditDetails?.totalSteps:'--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 text-center header-card\">\r\n Human Verified Steps <span><svg ngbTooltip=\"Number of steps that required human validation to ensure compliance and accuracy.\" placement=\"right\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.auditedSteps?auditDetails?.auditedSteps:0}}/{{auditDetails?.totalSteps ? auditDetails?.totalSteps:'--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 header-card\">\r\n AI Compliance Score <span><svg ngbTooltip=\"Measures the percentage of steps AI flagged as compliant without human intervention.\" placement=\"left\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.complianceScore ?auditDetails?.complianceScore : 0}}%</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 header-card\">\r\n AI Trust Score <span><svg ngbTooltip=\"This score reflects how often AI predictions were accepted without manual overrides.\" placement=\"left\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.trustScore ? auditDetails?.trustScore:'--'}}%</span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"row mt-3\">\r\n <div [ngClass]=\"eyeTestType ==='fake' ? 'col-md-12' : 'col-md-6'\" class=\"col-sm-6\">\r\n <div class=\"card h-500px px-5\">\r\n <div class=\"card-header p-0 border-0\">\r\n <span class=\"card-title m-0 fw-bolder bg-none\">Preview Eye Test</span>\r\n </div>\r\n <div class=\"card-body px-0 position-relative\">\r\n <div class=\"video-position w-100\">\r\n <video class=\"w-100 rounded-3 h-auto\" controls\r\n [src]=\"auditDetails?.filePath\"></video>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestType !=='fake'\" class=\"col-sm-6\">\r\n <div class=\"card h-500px px-5 overflow-scroll\">\r\n <div class=\"card-header mb-3 p-0 border-0 d-flex justify-content-between align-items-center\">\r\n <div class=\"\">\r\n <span class=\"card-title m-0 fw-bolder bg-none\">Step-wise Breakdown</span>\r\n \r\n \r\n <div class=\"d-flex sub-title mt-2\" *ngIf=\"auditDetails?.lastAuditedDetails?.auditedBy\">\r\n <span *ngIf=\"currentAuditType === 'remote'\"> <span *ngIf=\"auditDetails?.spokenLanguage\"> <span *ngIf=\"!takeAudit\" class=\"badge badge-light-info mt-0 me-2\">Language Spoken: {{auditDetails?.spokenLanguage}}</span></span></span> <span class=\"mt-1\">Recently Audited By : </span>\r\n <span class=\"ms-2 mt-1\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\"\r\n height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M13.3337 14V12.6667C13.3337 11.9594 13.0527 11.2811 12.5526 10.781C12.0525 10.281 11.3742 10 10.667 10H5.33366C4.62641 10 3.94814 10.281 3.44804 10.781C2.94794 11.2811 2.66699 11.9594 2.66699 12.6667V14M10.667 4.66667C10.667 6.13943 9.47308 7.33333 8.00033 7.33333C6.52757 7.33333 5.33366 6.13943 5.33366 4.66667C5.33366 3.19391 6.52757 2 8.00033 2C9.47308 2 10.667 3.19391 10.667 4.66667Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span >{{auditDetails?.lastAuditedDetails?.auditedBy}}</span>\r\n <span class=\"ms-2 mt-1\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\"\r\n height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_152_29431)\">\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_152_29431\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>{{auditDetails?.lastAuditedDetails?.completionTime}}\r\n {{auditDetails?.lastAuditedDetails?.timeZone}}</span>\r\n </div>\r\n \r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"takeAudit && currentAuditType === 'remote'\" class=\"d-flex align-items-end me-2\">\r\n <select [(ngModel)]=\"spokenLanguage\" class=\"form-select form-select-sm\">\r\n <option selected disabled >Language Spoken <span style=\"color:red\">*</span></option>\r\n <option value=\"English\">English</option>\r\n <option value=\"Hindi\">Hindi</option>\r\n </select></div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Yet-to-Audit' && !takeAudit\" (click)=\"startAudit('audit')\"\r\n class=\"text-white ms-3 px-3 py-2 fw-semibold rounded-2 cursor-pointer bg-primary\"\r\n style=\"font-size: 14px;\">\r\n Start Audit\r\n </div>\r\n \r\n <div *ngIf=\"['Audited','Re-Audit','Yet-to-Audit'].includes(auditDetails?.auditStatus)&&auditDetails?.auditType === 'Re-Audit' && !takeAudit||auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Audited' ||auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Re-Audited'&& !takeAudit \"\r\n (click)=\"startAudit('Re-Audit')\" class=\"btn btn-sm py-2 btn-warning\">Re-Audit</div>\r\n <div *ngIf=\"takeAudit\" class=\"d-flex\">\r\n <button class=\"btn btn-sm btn-outline\" [disabled]=\"disablecancel\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn ms-2 btn-sm btn-success\" [disabled]=\"disablecancel\" (click)=\"onsubmit()\">Submit</button>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body mt-1 px-0\">\r\n <div *ngIf=\"!takeAudit && stepWiseProcess?.length\" class=\"table-responsive border border-1 rounded-3\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n Step-by-step Process\r\n </th>\r\n <th *ngIf=\"currentAuditType === 'remote'\" class=\"text-start\">\r\n Predicted Transcript\r\n </th>\r\n <th class=\"text-start\">\r\n AI Verified\r\n </th>\r\n <th class=\"text-start\">\r\n Human Audited\r\n </th>\r\n <th class=\"text-start\">\r\n Reason for Error\r\n </th>\r\n <th class=\"text-start\">\r\n Noticed Time Range\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of stepWiseProcess;let i=index\">\r\n <td>\r\n <div class=\"d-flex align-items-start\">\r\n <!-- <div class=\"w-40px h-40px d-flex justify-content-center text-center me-3\">\r\n <img class=\"w-100 rounded-5\" [src]=\"data?.imageUrl\">\r\n </div> -->\r\n {{data.processName}}\r\n </div>\r\n </td>\r\n <td *ngIf=\"currentAuditType ==='remote'\" class=\"text-capitalize\">\r\n <div class=\"text-primary1 text-decoration-underline cursor-pointer\"\r\n [ngbTooltip]=\"data?.predictedTranscript ? tooltipContent : ''\"\r\n placement='bottom'>{{data?.predictedTranscript?data?.predictedTranscript:\"N/A\"}}</div>\r\n\r\n <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"min-w-500px\">{{data?.predictedTranscript?data?.predictedTranscript:\"N/A\"}}</span>\r\n </div>\r\n </ng-template>\r\n\r\n </td>\r\n <td class=\"text-capitalize\"><span\r\n [ngClass]=\"data.AIStatus ? 'badge badge-light-success' : 'badge badge-light-danger'\">{{data.AIStatus\r\n ? 'pass' : 'fail'}}</span></td>\r\n <td class=\"text-capitalize\">\r\n <span \r\n [ngClass]=\"data?.auditedStatus === true ? 'badge badge-light-success' : (data?.auditedStatus === false ? 'badge badge-light-danger' : '')\">\r\n {{ data?.auditedStatus === true ? 'pass' : (data?.auditedStatus === false ? 'fail' : 'N/A') }}\r\n </span>\r\n \r\n </td>\r\n <td *ngIf=\"data.AIStatus !== data.auditedStatus || data.auditedStatus === null || data.auditedStatus === undefined || data.auditedStatus === ''; else EqualBlock\">\r\n <!-- {{ data?.reason || 'N/A' }} -->\r\n <span *ngIf=\"data.reason !=='others'\">{{data.reason || 'N/A'}}</span><span *ngIf=\"data.reason ==='others'\">{{data.otherReason || 'N/A'}}</span>\r\n </td>\r\n <ng-template #EqualBlock>\r\n <td>N/A</td>\r\n </ng-template>\r\n <td>{{data?.startTime}} - {{data?.endTime}}</td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <div *ngIf=\"stepWiseProcess?.length && takeAudit&&auditDetails?.auditStatus==='Yet-to-Audit'||auditDetails?.auditStatus==='In-Progress'\">\r\n <div *ngFor=\"let process of stepWiseProcess; let i=index ;let last=last\"\r\n class=\"border border-1 rounded-3 mb-3\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n Step-{{i+1 | number}}\r\n </th>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n AI Verified\r\n </th>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n Human Audited\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td class=\"w-200px\">\r\n <!-- <div class=\"d-flex align-items-start\"> -->\r\n <!-- <div class=\"w-40px h-40px d-flex justify-content-center text-center me-3\">\r\n <img class=\"w-100 rounded-5\" [src]=\"process.imageUrl\">\r\n </div> -->\r\n {{process.processName}}\r\n <!-- </div> -->\r\n </td>\r\n <td><span *ngIf=\"process.AIStatus\" class=\"badge badge-light-success text-capitalize\">Pass</span>\r\n <span *ngIf=\"!process.AIStatus\" class=\"badge badge-light-danger text-capitalize\">Fail</span>\r\n </td>\r\n <td>\r\n <div class=\"d-flex justify-content-start\">\r\n <div (click)=\"selectHumanVerified(i,true)\"\r\n [ngClass]=\"process?.auditedStatus ? 'text-white btn-success' : 'text-success bg-white border border-success'\"\r\n class=\"btn btn-sm rounded-5\"><span><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"16\"\r\n viewBox=\"0 0 17 16\" fill=\"none\">\r\n <path d=\"M14.1667 4L6.83333 11.3333L3.5 8\"\r\n [attr.stroke]=\"process?.auditedStatus ? 'white' : '#17C653'\"\r\n stroke-width=\"1.25\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span><span class=\"ms-2\">Pass</span></div>\r\n\r\n <div (click)=\"selectHumanVerified(i,false)\"\r\n [ngClass]=\"process?.auditedStatus===false ? 'text-white bg-danger' : 'text-danger bg-white border border-danger'\"\r\n class=\"ms-3 px-5 py-2 fw-semibold rounded-5 cursor-pointer rounded-5\">\r\n <span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"16\"\r\n viewBox=\"0 0 17 16\" fill=\"none\">\r\n <path d=\"M12.6665 4L4.6665 12M4.6665 4L12.6665 12\"\r\n [attr.stroke]=\"process?.auditedStatus===false ? 'white' : '#F8285A'\"\r\n stroke-width=\"1.25\" stroke-linecap=\"rowund\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span><span class=\"ms-2\">Fail</span></div>\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <div *ngIf=\"currentAuditType === 'remote' && process?.predictedTranscript\" class=\"w-100\">\r\n <div class=\"bg-light-primary text-primary p-3\">\r\n Predicted Transcript\r\n </div>\r\n <div class=\"row col-sm-12 p-5\">\r\n <div class=\"text-primary text-decoration-underline cursor-pointer\"\r\n [ngbTooltip]=\"process?.predictedTranscript ? tooltipContent : ''\"\r\n placement='bottom'>\r\n {{process?.predictedTranscript}}\r\n </div>\r\n <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"min-w-500px\">{{process?.predictedTranscript}}</span>\r\n </div>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div *ngIf=\"process?.auditedStatus !== undefined && process?.auditedStatus !== '' && process?.auditedStatus !== process?.AIStatus\" class=\"w-100\">\r\n <div class=\"bg-light-primary text-primary p-3\">\r\n Reason & Time Stamp\r\n </div>\r\n <div class=\"row col-sm-12 p-5\">\r\n <div class=\"col-sm-6 col-md-6\">\r\n <div>\r\n <div (click)=\"toggleDropdown(i,'reason')\" class=\"custom-dropdown\">\r\n <div class=\"d-flex justify-content-between\">\r\n <span class=\"text-select\">\r\n {{ process?.reason ? process?.reason : 'Select Reason' }}\r\n </span>\r\n <span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n \r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\" *ngIf=\"dropdownOpen[i]?.reason\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"item my-2 minutes-scroll\">\r\n <ul *ngFor=\"let item of dropdownList\" class=\"list-unstyled\">\r\n <li [ngClass]=\"process?.reason === item?.key ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n (click)=\"selectReason(i, item?.key, 'reason')\">\r\n {{ item?.item }}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <!-- Custom Input for \"Others\" -->\r\n <div *ngIf=\"process?.reason === 'others'\" class=\"mt-2\">\r\n <input \r\n type=\"text\" \r\n [(ngModel)]=\"process.otherReason\" \r\n placeholder=\"Enter your reason\" \r\n class=\"form-control form-control-sm\" />\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"col-sm-3\">\r\n <div class=\"w-100\">\r\n <div (click)=\"toggleDropdown(i,'startTime')\" class=\"custom-dropdown\">\r\n <label class=\"label fw-semibold bg-white px-2\">Start</label>\r\n <div class=\"text-select\">{{process?.startTime ? process?.startTime\r\n :'MM:SS'}}</div>\r\n\r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\"\r\n *ngIf=\"dropdownOpen[i]?.startTime\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"scroll-section minutes-scroll \">\r\n <div *ngFor=\"let min of minutesList\"\r\n (click)=\"selectMinute(i,min,'startTime')\"\r\n [class.selected]=\"min === selectedMinutes\">\r\n {{ min }}\r\n </div>\r\n </div>\r\n <!-- Seconds List -->\r\n <div class=\"scroll-section seconds-scroll\">\r\n <div *ngFor=\"let sec of secondsList\"\r\n (click)=\"selectSecond(i,sec,'startTime')\"\r\n [class.selected]=\"sec === selectedSeconds\">\r\n {{ sec }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"w-100\">\r\n <div (click)=\"toggleDropdown(i,'endTime')\" class=\"custom-dropdown\">\r\n <label class=\"label fw-semibold bg-white px-2\">End</label>\r\n <div class=\"text-select\"><span>{{process.endTime ? process.endTime :\r\n 'MM:SS'}}</span></div>\r\n\r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\"\r\n *ngIf=\"dropdownOpen[i]?.endTime\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"scroll-section minutes-scroll\">\r\n <div *ngFor=\"let min of minutesList\"\r\n [class.selected]=\"min === selectedMinutes\"\r\n [class.disabled]=\"getSecondsFromTime(min + ':' + selectedSeconds) <= getSecondsFromTime(process.startTime)\"\r\n (click)=\"\r\n getSecondsFromTime(min + ':' + selectedSeconds) > getSecondsFromTime(process.startTime)\r\n && selectMinute(i,min,'endTime')\">\r\n {{ min }}\r\n </div>\r\n \r\n </div>\r\n <!-- Seconds List -->\r\n <div class=\"scroll-section seconds-scroll\">\r\n <div *ngFor=\"let sec of secondsList\"\r\n [class.selected]=\"sec === selectedSeconds\"\r\n [class.disabled]=\"getSecondsFromTime(selectedMinutes + ':' + sec) <= getSecondsFromTime(process.startTime)\"\r\n (click)=\"\r\n getSecondsFromTime(selectedMinutes + ':' + sec) > getSecondsFromTime(process.startTime)\r\n && selectSecond(i,sec,'endTime')\">\r\n {{ sec }}\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!stepWiseProcess?.length\">\r\n <div *ngIf=\"(tableLoading | async) === 'loading'\"\r\n class=\"card 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 <div *ngIf=\"(tableLoading | async) === 'loaded'\" class=\"row mt-2\">\r\n <div *ngIf=\"noData\" class=\"col-lg-12\">\r\n <div class=\"card-body my-8 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=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the test</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"card mt-3 p-2\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"title-text mb-2\">History</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-body py-0 px-3\">\r\n <div class=\"table-responsive border border-1 rounded-3\" *ngIf=\"historyData?.length\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">Audited By</th>\r\n <th class=\"text-start\" >Audited Date</th>\r\n <th class=\"text-start\" >Time Stamp</th>\r\n <th class=\"text-start\" >View Logs</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of historyData\">\r\n <td>{{item.userName}}</td>\r\n <td>{{item.Date}}</td>\r\n <td>{{item.Time}} IST</td>\r\n <td (click)=\"viewHistoryModel(item)\" class=\"cursor-pointer\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"16\"\r\n viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n\r\n <div *ngIf=\"!historyData?.length\">\r\n <div *ngIf=\"(historytableLoading | async) === 'loading'\"\r\n class=\"card 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\r\n <div *ngIf=\"(historytableLoading | async) === 'loaded'\" class=\"row mt-2\">\r\n <div class=\"col-lg-12\">\r\n <div class=\"card-body my-8 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=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the test</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<ng-template #viewHistory let-model>\r\n <div class=\"p-5 ts700px scroll\">\r\n\r\n\r\n <div class=\"card-body py-0 \">\r\n <div class=\"my-2 d-flex\">\r\n<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"46\"\r\n height=\"46\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M28 22V28L32 30M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span\r\n class=\"ms-3 pt-2 fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Audit\r\n History</span>\r\n </div>\r\n <div class=\"table-responsive\" *ngIf=\"historyData?.length\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">Step-by-Step Process</th>\r\n <th class=\"text-start\">Status changed from</th>\r\n <th class=\"text-start\">Noted Time Range</th>\r\n <th class=\"text-start\">Reason for Error</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of viewHistoryData\">\r\n <td>{{item.processName}}</td>\r\n <td>\r\n <span *ngIf=\"item.AIStatus\" class=\"badge badge-light-success me-2\">Pass</span>\r\n <span *ngIf=\"!item.AIStatus\" class=\"badge badge-light-danger me-2\">Fail</span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"31\" height=\"8\" viewBox=\"0 0 31 8\"\r\n fill=\"none\">\r\n <path\r\n d=\"M30.3536 4.35355C30.5488 4.15829 30.5488 3.84171 30.3536 3.64645L27.1716 0.464466C26.9763 0.269204 26.6597 0.269204 26.4645 0.464466C26.2692 0.659728 26.2692 0.976311 26.4645 1.17157L29.2929 4L26.4645 6.82843C26.2692 7.02369 26.2692 7.34027 26.4645 7.53553C26.6597 7.7308 26.9763 7.7308 27.1716 7.53553L30.3536 4.35355ZM0 4.5H30V3.5H0V4.5Z\"\r\n fill=\"#D0D5DD\" />\r\n </svg>\r\n <span *ngIf=\"item.auditedStatus\" class=\"badge badge-light-success ms-2\">Pass</span>\r\n <span *ngIf=\"!item.auditedStatus\" class=\"badge badge-light-danger ms-2\">Fail</span>\r\n </td>\r\n <td ><span class=\"badge badge-light-success\" *ngIf=\"item.startTime\">Noted Time Range : <span class=\"text-dark1\">{{item.startTime ? item.startTime:'--'}} - {{item.endTime}}</span></span></td>\r\n <td class=\"engage-text\"><span *ngIf=\"item.reason !=='others'\">{{item.reason}}</span><span *ngIf=\"item.reason ==='others'\">{{item.otherReason}}</span></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #viewCancel let-model>\r\n <div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEF0C7\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FFFAEB\" stroke-width=\"8\"/>\r\n <path d=\"M27.9988 24V28M27.9988 32H28.0088M26.2888 18.86L17.8188 33C17.6442 33.3024 17.5518 33.6453 17.5508 33.9945C17.5498 34.3437 17.6403 34.6871 17.8132 34.9905C17.9862 35.2939 18.2355 35.5467 18.5365 35.7238C18.8375 35.9009 19.1796 35.9961 19.5288 36H36.4688C36.818 35.9961 37.1601 35.9009 37.4611 35.7238C37.7621 35.5467 38.0114 35.2939 38.1844 34.9905C38.3573 34.6871 38.4478 34.3437 38.4468 33.9945C38.4458 33.6453 38.3534 33.3024 38.1788 33L29.7088 18.86C29.5305 18.5661 29.2795 18.3231 28.98 18.1544C28.6805 17.9858 28.3425 17.8972 27.9988 17.8972C27.6551 17.8972 27.3171 17.9858 27.0176 18.1544C26.7181 18.3231 26.4671 18.5661 26.2888 18.86Z\" stroke=\"#DC6803\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Are you sure?</a>\r\n <span class=\"sub-title fw-normal mt-2\">Would you like to cancel this?</span>\r\n \r\n <div class=\"mt-5 w-100\">\r\n \r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"OnCancel()\">No</button>\r\n <button id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onYes()\">Yes</button>\r\n \r\n </div>\r\n \r\n </div>\r\n \r\n </div>\r\n </div>\r\n</ng-template>\r\n</section>", styles: [":host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.shown.drops-down-right{transform-origin:0 0;width:560px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;right:-475px!important;left:unset!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.card-title{font-size:1.15rem!important}.select-wrapper{position:relative;display:inline-block;width:100%}.placeholder-overlay{position:absolute;color:var(--Gray-500, #667085);font-family:Inter;font-size:16px!important;font-style:normal;font-weight:400;top:10px;left:15px;pointer-events:none;font-size:1.1rem;z-index:1}table th,table td{height:44px!important;padding:12px 24px!important;gap:12px;align-self:stretch}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:18px}table td{color:var(--Gray-900, #667085);font-size:14px!important;font-weight:500!important;line-height:20px}.bottom-border td{border-bottom:1px solid var(--Gray-200, #EAECF0)!important}.rotate{rotate:180deg;transition:1s}.engage-text{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-transform:capitalize}.dashed{border-radius:4px;border:1px dashed var(--Error-500, #F04438)!important;background:var(--Error-25, #FFFBFA)}.dashed-desc{color:var(--Error-600, #3F4254)!important;font-size:14px;font-weight:600;line-height:24px}.card-header,.header{color:var(--Gray-900, #101828);font-size:20px!important;font-style:normal;font-weight:700;line-height:30px}.sub-header{color:var(--Gray-700, #344054);font-size:14px!important;font-style:normal;font-weight:600;line-height:20px}.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}.text-value{color:var(--Black, #101828);font-size:24px;font-weight:600;line-height:32px}.text-sub{color:var(--Error-600, #667085)!important;font-size:16px;font-weight:600;line-height:18px}.test-sub1{color:var(--Gray-800, #1D2939);font-size:11px;font-weight:400;line-height:18px}.new1 .header-card{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;color:var(--Black, #101828);font-size:18px;line-height:32px}.new1 .text-card{color:var(--Black, #101828);font-size:24px;line-height:32px}.new1 .bg-light-primary{border-bottom:1px solid var(--Primary-100, #DAF1FF)!important;background:var(--Primary-25, #F6FCFF)!important}.new1 .sub-title{color:var(--Gray-500, #667085);font-size:12px;font-weight:500;line-height:18px}.new1 .video-position{position:absolute;top:50%;transform:translateY(-50%)}.new1 .btn-success{border:1px solid var(--Success-700, #027A48)!important;background:var(--Success-700, #027A48)!important;box-shadow:0 1px 2px #1018280d!important}.new1 .btn.btn-success:hover:not(.btn-active),.new1 .btn.btn-success:active:not(.btn-active){border:1px solid var(--Success-700, #027A48)!important;background:var(--Success-700, #027A48)!important;box-shadow:0 1px 2px #1018280d!important}.new1 table tr{vertical-align:middle}.new1 table tr td{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:500;line-height:20px}.new1 .custom-dropdown{position:relative;width:100%;padding:10px 16px;cursor:pointer;border-radius:8px;font-size:16px;font-weight:400;line-height:20px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--Gray-50, #F9FAFB);box-shadow:0 1px 2px #1018280d}.new1 .dropdown-content{position:absolute;z-index:1;top:100%;left:0;border-radius:6px;width:100%;background:#fff;box-shadow:0 4px 6px #0000001a;display:flex}.new1 .dropdown-content1{position:absolute;z-index:1;bottom:100%;left:0;border-radius:6px;width:100%;background:#fff;box-shadow:0 4px 6px #0000001a;display:flex}.new1 .scroll-container{display:flex;width:100%}.new1 .scroll-container .item{width:100%;text-align:start}.new1 .scroll-container .items:hover,.new1 .scroll-container .tems.focus,.new1 .scroll-container .items.active{background:var(--Gray-50, #F9FAFB)}.new1 .label{position:absolute;top:-25%;color:var(--Gray-700, #344054);font-size:12px;line-height:18px}.new1 .scroll-section{width:50%;height:200px;overflow-y:auto;text-align:center;border-right:1px solid #ddd}.new1 .scroll-section:last-child{border-right:none}.new1 .scroll-section div{padding:8px;cursor:pointer}.new1 .scroll-section div.selected{background:#007bff;color:#fff}.new1 .bg-primary{border-radius:8px;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d}.new1 .bg-danger{background:var(--Primary-500, #D92D20)!important}.new1 .text-primary{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:500!important;line-height:18px!important}.new1 .text-primary1{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:500!important;line-height:18px!important;text-overflow:ellipsis;max-width:200px;overflow:hidden}.new1 .text-select{color:var(--Gray-500, #667085)!important;font-size:14.56px!important;font-weight:400;line-height:21.84px!important}.new1 .custom-tooltip-content{font-size:12px!important;text-align:left!important}.new1 ::ng-deep .tooltip-inner{max-width:500px!important;white-space:normal}.new1 .test-dark1{color:var(--Success-700, #027A48)!important;text-align:center;font-size:12px!important;font-weight:500!important;line-height:18px}.new1 .engage-text{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-transform:capitalize}.new1 .disabled{pointer-events:none;opacity:.4;cursor:not-allowed}.new1 .h-auto{height:400px!important;object-fit:fill}@media (min-width: 1920px) and (max-width: 2119px){.new1 .h-500px{height:600px!important}.new1 .h-auto{height:400px!important;object-fit:fill}}@media (min-width: 1720px) and (max-width: 1900px){.new1 .h-auto{height:400px!important;object-fit:fill}}@media (min-width: 2120px) and (max-width: 2800px){.new1 .h-auto{height:520px!important;object-fit:fill}}@media (min-width: 1330px) and (max-width: 1500px){.new1 .h-auto{height:370px!important;object-fit:fill}}.new1 .ts700px{min-height:auto!important;max-height:700px!important}\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: "component", type: i3.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i8$1.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }, { kind: "directive", type: i1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: ReactiveSelectComponent, selector: "lib-reactive-select", inputs: ["idField", "nameField", "label", "data"], outputs: ["itemChange"] }, { kind: "component", type: CustomSelectComponent, selector: "lib-stores-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "component", type: GroupSelectComponent, selector: "lib-group-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "component", type: SelectDropComponent, selector: "lib-select-drop", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.DecimalPipe, name: "number" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i6.DatePipe, name: "date" }] });
24014
24014
  }
24015
24015
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EyeTestComponent, decorators: [{
24016
24016
  type: Component,
24017
- args: [{ selector: "lib-eye-test", template: "<section *ngIf=\"!eyeView\" class=\"container-fluid\">\r\n<div class=\"card mb-2\">\r\n <div *ngIf=\"loading1\" 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>\r\n <form *ngIf=\"!loading1\" [formGroup]=\"eyeTestForm\">\r\n <div class=\"row\">\r\n <div class=\"col-md-12 mt-7 mb-3\">\r\n <div class=\"row px-3\">\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-2 mb-4'\" class=\"col-1 mb-4\">\r\n <lib-reactive-select formControlName=\"dateType\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"dateType\" (itemChange)=\"dateTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-3 mb-4' : 'col-2 mb-4'\">\r\n <div class=\"position-relative\">\r\n <span style=\"top: 20%;\" class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-10 z-2\" style=\"min-width: 210px !important;\" type=\"text\"\r\n matInput ngxDaterangepickerMd [drops]=\"'down'\" [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"false\" autocomplete=\"off\"\r\n [(ngModel)]=\"selectedDateRange\" [ngModelOptions]=\"{standalone: true}\"\r\n (datesUpdated)=\"datechange($event)\" (click)=\"resetValidation()\"\r\n (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\" [autoApply]=\"true\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-2 mb-4'\" class=\"col-2 mb-4\">\r\n <lib-reactive-select formControlName=\"type\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"type\"\r\n (itemChange)=\"typeChange($event)\"></lib-reactive-select>\r\n </div>\r\n \r\n <!-- </div>\r\n </div> -->\r\n <!-- *ngIf=\"users?.role ==='superadmin'\" -->\r\n <div class=\"col-md-3\">\r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('RmList')?.value?.length)\">\r\n Select RM\r\n </div>\r\n <lib-group-select [items]=\"RmList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userName'\" (selected)=\"onRmSelect($event)\" [selectedValues]=\"eyeTestForm.get('RmList')?.value\">\r\n </lib-group-select>\r\n </div>\r\n \r\n \r\n </div>\r\n <!-- *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\" -->\r\n <div class=\"col-md-3\">\r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('ClusterList')?.value?.length)\">\r\n Select cluster\r\n </div>\r\n <lib-group-select [items]=\"ClusterList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'clusterName'\"\r\n [idField]=\"'clusterName'\" (selected)=\"ongroupSelect($event)\"\r\n [selectedValues]=\"eyeTestForm.get('ClusterList')?.value\">\r\n </lib-group-select>\r\n </div>\r\n </div>\r\n \r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-3 mb-4' : 'col-2 mb-4'\">\r\n \r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('storeList')?.value?.length)\">\r\n Select Stores\r\n </div>\r\n <lib-stores-select [items]=\"storeList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'storeName'\"\r\n [idField]=\"'storeId'\" (selected)=\"onStoreSelect($event)\"\r\n [selectedValues]=\"eyeTestForm.get('storeList')?.value\"></lib-stores-select>\r\n \r\n </div>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2' : 'col-2'\">\r\n <div class=\"select-wrapper mb-4\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('complianceScore')?.value?.length)\">\r\n Select Score\r\n </div>\r\n <lib-select-drop [items]=\"typePercentageArray\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'label'\"\r\n [idField]=\"'value'\" (selected)=\"typePercentageChange($event)\"\r\n [selectedValues]=\"eyeTestForm.get('complianceScore')?.value\">\r\n </lib-select-drop>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-1 mb-4\">\r\n <lib-reactive-select formControlName=\"auditType\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"auditType\"\r\n (itemChange)=\"auditTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2' : 'col-2'\">\r\n <div class=\"select-wrapper mb-4\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('auditStatus')?.value?.length)\">\r\n Audit Status\r\n </div>\r\n <lib-select-drop [items]=\"auditStatusArray\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'label'\"\r\n [idField]=\"'value'\" (selected)=\"typeAuditStatusChange($event)\"\r\n [selectedValues]=\"eyeTestForm.get('auditStatus')?.value\">\r\n </lib-select-drop>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-md-2\">\r\n <div class=\"mb-4\">\r\n <lib-reactive-select formControlName=\"nearAddition\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"nearAdditionArray\" (itemChange)=\"nearAdditionChange($event)\"></lib-reactive-select>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-md-2\">\r\n <div class=\"mb-4\">\r\n <lib-reactive-select formControlName=\"category\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"categoryArray\" (itemChange)=\"categoryTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n </div>\r\n <div \r\n *ngIf=\"users?.role\" \r\n class=\"text-end\"\r\n [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-1 mb-4'\"\r\n>\r\n<!-- [ngClass]=\"getApplyButtonClass(users?.role, eyeTestForm.get('type')?.value)\" -->\r\n\r\n <a (click)=\"onSubmit();\" type=\"submit\" class=\"btn btn-sm btn-primary py-3 \">\r\n <span>Apply</span>\r\n </a>\r\n\r\n</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </form>\r\n <div *ngIf=\"showEyeTest\" class=\"ms-6 mb-3\">\r\n\r\n <h3 class=\"card-title dashed w-100 row\">\r\n <span class=\"col-10 title-text py-3\"><span class=\"mx-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\"\r\n viewBox=\"0 0 32 32\" fill=\"none\">\r\n <rect width=\"32\" height=\"32\" rx=\"16\" fill=\"#FEE4E2\" />\r\n <g clip-path=\"url(#clip0_235_24234)\">\r\n <path\r\n d=\"M16 13.3335V16.0002M16 18.6668H16.0067M22.6667 16.0002C22.6667 19.6821 19.6819 22.6668 16 22.6668C12.3181 22.6668 9.33337 19.6821 9.33337 16.0002C9.33337 12.3183 12.3181 9.3335 16 9.3335C19.6819 9.3335 22.6667 12.3183 22.6667 16.0002Z\"\r\n stroke=\"#D92D20\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_235_24234\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\" transform=\"translate(8 8)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span><span class=\"dashed-desc\">Eye test video preview is available for 30 days. Audit data\r\n remains accessible, but videos will not be retained beyond this period.</span></span>\r\n <span class=\"col-2 pt-2 text-end cursor-pointer\" (click)=\"closeEyeTest()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\">\r\n <path d=\"M25 15L15 25M15 15L25 25\" stroke=\"#667085\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n </h3>\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<!-- <div class=\"card my-3\">\r\n <div class=\"card-header border-0 py-1\">\r\n \r\n </div>\r\n</div> -->\r\n\r\n<div class=\"row\">\r\n <div *ngIf=\"users?.role ==='superadmin' && keyType ==='rm'\" class=\"col\">\r\n <div class=\"card p-2\">\r\n <div class=\"card-header ellipse1 min-h-55px py-1 px-3 d-flex justify-content-between align-items-center\">\r\n <h5 class=\"card-title my-0\">Regional Managers</h5>\r\n <span class=\"text-value\">{{RmListData ?? '--'}}</span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card mt-5 p-2\">\r\n <div class=\"card-header ellipse1 min-h-55px py-1 px-3 d-flex justify-content-between align-items-center\">\r\n <h5 class=\"card-title my-0\">Clusters</h5>\r\n <span class=\"text-value\">{{groups?.length ?? '--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"users?.role ==='superadmin' && keyType !=='rm' || users?.role ==='admin'\" class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Clusters</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ groups?.length ?? '-' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Total Tango AI Files</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.totalFiles ?? '-' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Trust Audit Completed</h5>\r\n </div>\r\n <div class=\"card-body py-3 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.completedFiles ?? '-' }}</span>\r\n\r\n </div>\r\n <div class=\"card-footer py-0 border-0 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-sub\">{{ (eyeTestCardData?.completedRatio ?? '-') + '%' }} <span\r\n class=\"test-sub\">Completed</span></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Tango Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.tangoScore ?? '-' }}</span>\r\n </div>\r\n <div class=\"card-footer pe-0 ps-3 py-0 border-0 d-flex justify-content-center align-items-center\">\r\n <span>\r\n <svg *ngIf=\"eyeTestCardData?.trend\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\">\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\" stroke=\"#039855\" stroke-width=\"1.5\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <svg *ngIf=\"!eyeTestCardData?.trend\" xmlns=\"http://www.w3.org/2000/svg\" width=\"13\" height=\"12\" viewBox=\"0 0 13 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_760_9776)\">\r\n <path d=\"M11.575 9L6.82495 4.25L4.32495 6.75L0.574951 3M11.575 9H8.57495M11.575 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_760_9776\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0.0749512)\" />\r\n </clipPath>\r\n </defs>\r\n </svg> \r\n <span class=\"text-sub ms-2\">{{ eyeTestCardData?.tangoScoreTrend !== null \r\n ? (getAbsValue(eyeTestCardData.tangoScoreTrend) | number:'1.0-0':'en-US') + '%' \r\n : '-' }}\r\n <span\r\n class=\"test-sub1\">vs previous week</span></span></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Trust Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ (eyeTestCardData?.trustScore && eyeTestCardData?.trustScore !== 'NA' \r\n ? eyeTestCardData.trustScore + '%' \r\n : 'NA') }}</span>\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Human Audited Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ (eyeTestCardData?.humanScore && eyeTestCardData?.humanScore !== 'NA' \r\n ? eyeTestCardData.humanScore \r\n : 'NA') }}</span>\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n \r\n</div>\r\n\r\n\r\n<div class=\"card mt-3\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span *ngIf=\"users?.role === 'superadmin' && keyType ==='rm'\" class=\"title-text mb-2\">\r\n Audit Summary\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary\">{{ totalItems }} Total</span>\r\n </span>\r\n\r\n <!-- Admin + cluster present \u2192 RM Summary -->\r\n <div class=\"d-flex\">\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='cluster' && users?.role === 'superadmin'\" (click)=\"typeVal1('rm','')\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" x=\"0\" y=\"0\" width=\"44\" height=\"44\" filterUnits=\"userSpaceOnUse\"\r\n 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"users?.role === 'admin' && keyType ==='cluster' || users?.role === 'superadmin' && keyType ==='cluster'\" class=\"title-text my-4 mb-2\">\r\n RM Summary\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary text-capitalize\">{{ eyeTestData[0]?.RMName ? eyeTestData[0]?.RMName : '' }}</span>\r\n </span>\r\n </div>\r\n\r\n <!-- All other cases \u2192 Eye Test -->\r\n <div class=\"d-flex \">\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='store' && (users?.role === 'superadmin')\"\r\n (click)=\"typeVal1('cluster',this.rmEmail)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='store' && (users?.role === 'admin')\"\r\n (click)=\"typeVal1('cluster',this.groups)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"!(users?.role === 'superadmin' && keyType ==='rm') && !(users?.role === 'superadmin' && keyType ==='cluster') \r\n && !(users?.role === 'admin' && keyType ==='cluster')\" class=\"title-text my-4 mb-2\">\r\n Eye Test\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary\">{{ totalItems }} Total</span>\r\n </span>\r\n </div>\r\n <span *ngIf=\"users?.role ==='superadmin' && keyType ==='rm'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n <span *ngIf=\"users?.role ==='admin' && keyType ==='cluster'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n <span *ngIf=\"users?.role ==='user' && keyType ==='store'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" 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\"></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 <input (change)=\"searchData()\" [(ngModel)]=\"searchValue\" type=\"text\" class=\"form-control ps-14 me-2\" autocomplete=\"off\"\r\n [placeholder]=\"\r\n keyType === 'rm'\r\n ? 'Search by RMName'\r\n : keyType === 'cluster'\r\n ? 'Search by Cluster'\r\n : 'Search'\r\n \" />\r\n\r\n\r\n <span class=\"cursor-pointer\" *ngIf=\"users?.role ==='superadmin'\" (click)=\"settingsView()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"45\" height=\"46\"\r\n viewBox=\"0 0 45 46\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_760_9988)\">\r\n <rect x=\"2.71973\" y=\"1.98047\" width=\"40.04\" height=\"40.04\" rx=\"7.28\" fill=\"white\" />\r\n <rect x=\"3.17473\" y=\"2.43547\" width=\"39.13\" height=\"39.13\" rx=\"6.825\" stroke=\"#D0D5DD\"\r\n stroke-width=\"0.91\" />\r\n <g clip-path=\"url(#clip0_760_9988)\">\r\n <path\r\n d=\"M22.7396 24.2749C23.9961 24.2749 25.0146 23.2563 25.0146 21.9999C25.0146 20.7434 23.9961 19.7249 22.7396 19.7249C21.4832 19.7249 20.4646 20.7434 20.4646 21.9999C20.4646 23.2563 21.4832 24.2749 22.7396 24.2749Z\"\r\n stroke=\"#344054\" stroke-width=\"1.5197\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M28.3513 24.2749C28.2503 24.5036 28.2202 24.7573 28.2648 25.0033C28.3094 25.2493 28.4267 25.4763 28.6015 25.655L28.647 25.7005C28.788 25.8414 28.8999 26.0087 28.9762 26.1928C29.0526 26.3769 29.0919 26.5743 29.0919 26.7736C29.0919 26.9729 29.0526 27.1703 28.9762 27.3544C28.8999 27.5385 28.788 27.7058 28.647 27.8466C28.5062 27.9876 28.3389 28.0995 28.1548 28.1758C27.9707 28.2522 27.7733 28.2914 27.574 28.2914C27.3747 28.2914 27.1773 28.2522 26.9932 28.1758C26.8091 28.0995 26.6418 27.9876 26.5009 27.8466L26.4554 27.8011C26.2767 27.6263 26.0497 27.509 25.8037 27.4644C25.5577 27.4198 25.304 27.4499 25.0753 27.5509C24.851 27.647 24.6597 27.8066 24.525 28.0101C24.3902 28.2135 24.3179 28.4519 24.3169 28.696V28.8249C24.3169 29.2271 24.1572 29.6129 23.8727 29.8973C23.5883 30.1817 23.2025 30.3415 22.8003 30.3415C22.398 30.3415 22.0123 30.1817 21.7278 29.8973C21.4434 29.6129 21.2836 29.2271 21.2836 28.8249V28.7566C21.2777 28.5056 21.1965 28.2622 21.0504 28.058C20.9044 27.8538 20.7003 27.6982 20.4646 27.6115C20.2359 27.5106 19.9822 27.4805 19.7362 27.5251C19.4902 27.5697 19.2632 27.687 19.0844 27.8618L19.0389 27.9073C18.8981 28.0483 18.7308 28.1602 18.5467 28.2365C18.3626 28.3128 18.1652 28.3521 17.9659 28.3521C17.7666 28.3521 17.5692 28.3128 17.3851 28.2365C17.201 28.1602 17.0337 28.0483 16.8929 27.9073C16.7519 27.7664 16.64 27.5992 16.5637 27.415C16.4873 27.2309 16.448 27.0336 16.448 26.8342C16.448 26.6349 16.4873 26.4376 16.5637 26.2535C16.64 26.0693 16.7519 25.9021 16.8929 25.7612L16.9384 25.7157C17.1132 25.537 17.2305 25.31 17.2751 25.064C17.3197 24.818 17.2896 24.5643 17.1886 24.3355C17.0925 24.1112 16.9329 23.92 16.7294 23.7852C16.526 23.6505 16.2876 23.5782 16.0435 23.5772H15.9146C15.5124 23.5772 15.1266 23.4174 14.8422 23.133C14.5577 22.8486 14.3979 22.4628 14.3979 22.0605C14.3979 21.6583 14.5577 21.2725 14.8422 20.9881C15.1266 20.7037 15.5124 20.5439 15.9146 20.5439H15.9829C16.2339 20.538 16.4773 20.4568 16.6815 20.3107C16.8857 20.1646 17.0413 19.9605 17.1279 19.7249C17.2289 19.4961 17.259 19.2424 17.2144 18.9964C17.1698 18.7504 17.0525 18.5234 16.8777 18.3447L16.8322 18.2992C16.6912 18.1583 16.5793 17.9911 16.503 17.807C16.4267 17.6228 16.3874 17.4255 16.3874 17.2262C16.3874 17.0268 16.4267 16.8295 16.503 16.6454C16.5793 16.4612 16.6912 16.294 16.8322 16.1531C16.9731 16.0121 17.1403 15.9002 17.3244 15.8239C17.5086 15.7476 17.7059 15.7083 17.9052 15.7083C18.1046 15.7083 18.3019 15.7476 18.486 15.8239C18.6702 15.9002 18.8374 16.0121 18.9783 16.1531L19.0238 16.1986C19.2025 16.3734 19.4295 16.4907 19.6755 16.5353C19.9215 16.5799 20.1752 16.5498 20.4039 16.4489H20.4646C20.6889 16.3527 20.8802 16.1931 21.0149 15.9897C21.1497 15.7862 21.222 15.5478 21.2229 15.3038V15.1749C21.2229 14.7726 21.3827 14.3869 21.6672 14.1024C21.9516 13.818 22.3374 13.6582 22.7396 13.6582C23.1419 13.6582 23.5276 13.818 23.8121 14.1024C24.0965 14.3869 24.2563 14.7726 24.2563 15.1749V15.2431C24.2573 15.4871 24.3296 15.7256 24.4643 15.929C24.599 16.1325 24.7903 16.2921 25.0146 16.3882C25.2433 16.4891 25.4971 16.5193 25.7431 16.4747C25.9891 16.4301 26.2161 16.3128 26.3948 16.138L26.4403 16.0925C26.5811 15.9514 26.7484 15.8396 26.9325 15.7632C27.1167 15.6869 27.314 15.6476 27.5133 15.6476C27.7126 15.6476 27.91 15.6869 28.0941 15.7632C28.2782 15.8396 28.4455 15.9514 28.5864 16.0925C28.7274 16.2333 28.8392 16.4006 28.9156 16.5847C28.9919 16.7688 29.0312 16.9662 29.0312 17.1655C29.0312 17.3648 28.9919 17.5622 28.9156 17.7463C28.8392 17.9304 28.7274 18.0977 28.5864 18.2385L28.5409 18.284C28.366 18.4628 28.2488 18.6898 28.2042 18.9358C28.1596 19.1818 28.1897 19.4355 28.2906 19.6642V19.7249C28.3867 19.9492 28.5464 20.1404 28.7498 20.2752C28.9533 20.4099 29.1917 20.4822 29.4357 20.4832H29.5646C29.9669 20.4832 30.3526 20.643 30.6371 20.9274C30.9215 21.2119 31.0813 21.5976 31.0813 21.9999C31.0813 22.4021 30.9215 22.7879 30.6371 23.0723C30.3526 23.3567 29.9669 23.5165 29.5646 23.5165H29.4964C29.2523 23.5175 29.0139 23.5898 28.8105 23.7246C28.607 23.8593 28.4474 24.0506 28.3513 24.2749Z\"\r\n stroke=\"#344054\" stroke-width=\"1.5197\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_760_9988\" x=\"0.719727\" y=\"0.980469\" width=\"44.04\" height=\"44.04\"\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_760_9988\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_760_9988\"\r\n result=\"shape\" />\r\n </filter>\r\n <clipPath id=\"clip0_760_9988\">\r\n <rect width=\"18.2\" height=\"18.2\" fill=\"white\"\r\n transform=\"translate(13.6396 12.9004)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n\r\n <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"19\" height=\"20\" viewBox=\"0 0 19 20\" fill=\"none\">\r\n <path d=\"M7.53369 12.8441H15.0241L13.5568 14.3172L14.3587 15.1191L17.2024 12.2754L14.3587 9.43164L13.5568 10.2336L15.0241 11.7066H7.53369V12.8441Z\" fill=\"black\"/>\r\n <path d=\"M12.6526 8.8631V6.5881C12.653 6.51325 12.6387 6.43904 12.6104 6.36975C12.5821 6.30045 12.5404 6.23743 12.4877 6.18428L8.5064 2.20303C8.45326 2.15032 8.39023 2.10862 8.32094 2.08031C8.25164 2.05201 8.17744 2.03766 8.10259 2.0381H2.41509C2.1134 2.0381 1.82408 2.15794 1.61075 2.37126C1.39743 2.58458 1.27759 2.87391 1.27759 3.1756V16.8256C1.27759 17.1273 1.39743 17.4166 1.61075 17.6299C1.82408 17.8433 2.1134 17.9631 2.41509 17.9631H11.5151C11.8168 17.9631 12.1061 17.8433 12.3194 17.6299C12.5327 17.4166 12.6526 17.1273 12.6526 16.8256V15.6881H11.5151V16.8256H2.41509V3.1756H6.96509V6.5881C6.96509 6.88978 7.08493 7.17911 7.29826 7.39243C7.51158 7.60575 7.80091 7.7256 8.10259 7.7256H11.5151V8.8631H12.6526ZM8.10259 6.5881V3.40878L11.2819 6.5881H8.10259Z\" fill=\"black\"/>\r\n</svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"loading\" 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 <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata-table\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this eye test table</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!noData && !loading\" class=\"card-body\">\r\n <div class=\"table-responsive\">\r\n <table *ngIf=\"keyType ==='store'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('date')\"> Date <svg\r\n [ngClass]=\"sortedColumn === 'date' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'date' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('auditedDate')\">Audited Date <svg\r\n [ngClass]=\"sortedColumn === 'auditedDate' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'auditedDate' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th *ngIf=\"users?.role ==='superadmin'\" class=\"text-start\">\r\n RM Name\r\n </th>\r\n <th *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\" class=\"text-start\">\r\n Cluster Name\r\n </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name <svg\r\n [ngClass]=\"sortedColumn === 'storeName' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storeName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID <svg\r\n [ngClass]=\"sortedColumn === 'storeId' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'storeId' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th *ngIf=\"this.typeValue ==='remote'\" class=\"text-start\">Engagement ID</th>\r\n <th class=\"text-start\">Optom ID</th>\r\n <th class=\"text-start\">Optom Email ID</th>\r\n <th *ngIf=\"this.typeValue ==='remote'\" class=\"text-start\">Optom Name</th>\r\n <th *ngIf=\"this.typeValue !=='remote'\" class=\"text-start\">Queue ID</th>\r\n <th *ngIf=\"this.typeValue !=='remote'\" class=\"text-start\">Power Types</th>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('ComplianceScore')\">Tango Score <svg\r\n [ngClass]=\"sortedColumn === 'ComplianceScore' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'ComplianceScore' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> \r\n </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('coveredStepsAI')\">Steps Covered By AI <svg\r\n [ngClass]=\"sortedColumn === 'coveredStepsAI' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'coveredStepsAI' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('trustScore')\">Trust Score <svg\r\n [ngClass]=\"sortedColumn === 'trustScore' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'trustScore' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n\r\n<th><span class=\"cursor-pointer\" (click)=\"onSort('auditedSteps')\">Steps Covered By Human <svg\r\n [ngClass]=\"sortedColumn === 'auditedSteps' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'auditedSteps' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th>Human Audited Score</th>\r\n\r\n \r\n\r\n <th *ngIf=\"this.typeValue !=='remote'\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('visitorsType')\">Visitor Type <svg\r\n [ngClass]=\"sortedColumn === 'visitorsType' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'visitorsType' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th class=\"text-start\">Test Duration</th>\r\n <th class=\"text-start\" *ngIf=\"this.typeValue !=='remote'\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('comment')\">Eye Test Status <svg\r\n [ngClass]=\"sortedColumn === 'comment' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'comment' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th class=\"text-start\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('subComment')\">Comments <svg\r\n [ngClass]=\"sortedColumn === 'subComment' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'subComment' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('auditStatus')\">Audit Status <svg\r\n [ngClass]=\"sortedColumn === 'auditStatus' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'auditStatus' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th class=\"text-start\">Audited By</th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.date | date:'dd MMM, yyyy'}}</td>\r\n <td>{{obj?.auditedDate}}</td>\r\n <td *ngIf=\"users?.role === 'superadmin'\">\r\n <ng-container *ngIf=\"obj?.RMName\">\r\n <!-- Split and show the first value -->\r\n {{ obj.RMName.split(',')[0] }}\r\n\r\n <!-- Show +N badge if more values exist -->\r\n <span *ngIf=\"obj.RMName.split(',').length > 1\" class=\"badge badge-light-default ms-2\">\r\n +{{ obj.RMName.split(',').length - 1 }}\r\n </span>\r\n </ng-container>\r\n</td>\r\n\r\n <td *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\">\r\n <ng-container *ngIf=\"obj?.clusterName\">\r\n {{ obj.clusterName.split(',')[0] }}\r\n <span *ngIf=\"obj.clusterName.split(',').length > 1\" class=\"badge badge-light-default ms-2\">\r\n +{{ obj.clusterName.split(',').length - 1 }}\r\n </span>\r\n </ng-container>\r\n \r\n \r\n </td>\r\n <td>{{obj?.storeName}}</td>\r\n <td>{{obj?.storeId}}</td>\r\n <td *ngIf=\"this.typeValue ==='remote'\" class=\"engage-text\">{{obj?.engagementId}}</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\">{{obj?.optumId ? obj?.optumId :''}}\r\n <td *ngIf=\"this.typeValue ==='remote'\">{{obj?.optm_userId ? obj?.optm_userId :''}}\r\n <td *ngIf=\"this.typeValue !=='remote'\">{{obj?.salesmanEmailId ? obj?.salesmanEmailId :''}}\r\n <td *ngIf=\"this.typeValue =='remote'\">{{obj?.userEmail ? obj?.userEmail :''}}\r\n <td *ngIf=\"this.typeValue ==='remote'\">{{obj?.displayName ? obj?.displayName :''}}\r\n </td>\r\n <td *ngIf=\"this.typeValue !=='remote'\" class=\"engage-text\">{{obj?.queueId ?\r\n obj?.queueId:''}}</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\" >{{obj?.nearAddition ?\r\n obj?.nearAddition == \"true\"? \"With Near Addition\" :\"Without Near Addition\":'--'}}</td>\r\n <td>\r\n {{ obj?.complianceScore ?? '--' }}\r\n</td>\r\n<td>{{obj?.coveredStepsAI ? obj?.coveredStepsAI:'--'}}</td>\r\n <td>{{obj?.trustScore ?? '--'}}</td>\r\n <td>{{obj?.auditedSteps ? obj?.auditedSteps:'--'}}</td>\r\n <td>{{obj?.humanComplianceScore ? obj?.humanComplianceScore :'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"this.typeValue !=='remote'\">{{obj?.visitorsType ?\r\n obj?.visitorsType:'--'}}</td>\r\n <td>{{obj?.min ? obj?.min :'0'}} mins {{obj?.sec ?\r\n obj?.sec:'0'}} secs</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\">\r\n <span \r\n class=\"badge\" \r\n [ngClass]=\"obj?.comment ? 'badge-light-danger' : 'badge-light-success'\">\r\n {{ obj?.comment ? 'Fake' : 'Genuine' }}\r\n </span>\r\n</td>\r\n <td>{{obj?.subComment ? obj?.subComment:'--'}}</td>\r\n <td><span class=\"badge badge-light-primary\"\r\n *ngIf=\"obj?.auditStatus ==='Yet-to-Audit'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-warning\"\r\n *ngIf=\"obj?.auditStatus ==='Re-Audited'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-success\"\r\n *ngIf=\"obj?.auditStatus ==='Audited'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-info\"\r\n *ngIf=\"obj?.auditStatus ==='In-Progress'\">{{obj?.auditStatus}}</span>\r\n </td>\r\n <td>{{obj?.auditedBy?obj?.auditedBy:\"-\"}}</td>\r\n <td class=\"cursor-pointer\" (click)=\"eyeTestView(obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <table *ngIf=\"keyType ==='rm'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('RMName')\"> RM Name <svg\r\n [ngClass]=\"sortedColumn === 'RMName' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'RMName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('clusterCount')\"> Clusters Count <svg\r\n [ngClass]=\"sortedColumn === 'clusterCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'clusterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('storesCount')\">Stores Count <svg\r\n [ngClass]=\"sortedColumn === 'storesCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n Total Tango AI Files\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Audit Completed \r\n </th>\r\n <th class=\"text-start\">\r\n Tango Score \r\n </th>\r\n <th class=\"text-start\">\r\n Trust Score \r\n </th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.RMName ? obj?.RMName:'--'}}</td>\r\n <td>{{obj?.clusterCount ? obj?.clusterCount:'--'}}</td>\r\n <td>{{obj?.storesCount ? obj?.storesCount:'--'}}</td>\r\n <td>{{obj?.totalFiles ?? '--'}}</td>\r\n <td>{{obj?.completedFiles ?? '--'}}</td>\r\n <td>{{obj.complianceScore ?? '--'}}\r\n \r\n</td>\r\n<td>\r\n {{ obj?.trustScore ?? '--' }}\r\n</td>\r\n <td class=\"cursor-pointer\" (click)=\"typeVal('cluster',obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <table *ngIf=\"keyType ==='cluster'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n \r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('clusterName')\"> Clusters Name <svg\r\n [ngClass]=\"sortedColumn === 'clusterName' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'clusterName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('storesCount')\">Stores Count <svg\r\n [ngClass]=\"sortedColumn === 'storesCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n Total Tango AI Files\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Audit Completed\r\n </th>\r\n <th class=\"text-start\">\r\n Tango Score\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Score\r\n </th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.clusterName ? obj?.clusterName:'--'}}</td>\r\n <td>{{obj?.storesCount ? obj?.storesCount:'--'}}</td>\r\n <td>{{obj?.totalFiles ?? '--'}}</td>\r\n <td>{{obj?.completedFiles ?? '--'}}</td>\r\n <td>\r\n {{ obj?.complianceScore ?? '--' }}\r\n</td>\r\n<td>\r\n {{ obj?.trustScore ?? '--' }}\r\n</td>\r\n <td class=\"cursor-pointer\" (click)=\"typeVal('store',obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n </div>\r\n </div>\r\n <div class=\"card-footer\" *ngIf=\"!noData && !loading\">\r\n <lib-pagination [itemsPerPage]=\"pageSize\" [currentPage]=\"offset\" [totalItems]=\"totalItems\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n</div>\r\n</section>\r\n\r\n\r\n<section *ngIf=\"eyeView\" class=\"container-fluid new1 mt-4\">\r\n<div class=\"card p-5\">\r\n <div class=\"d-flex align-items-center\">\r\n <div (click)=\"backNavigation()\" class=\"btn btn-am btn-outline p-3\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15.8332 9.99984H4.1665M4.1665 9.99984L9.99984 15.8332M4.1665 9.99984L9.99984 4.1665\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </div>\r\n <span *ngIf=\"currentAuditType !== 'remote'\" class=\"ms-3 badge badge-light-default\">{{auditDetails?.optumId}}</span> \r\n <span *ngIf=\"currentAuditType === 'remote'\" class=\"ms-3 badge badge-light-default\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M10 10.5V9.5C10 8.96957 9.78929 8.46086 9.41421 8.08579C9.03914 7.71071 8.53043 7.5 8 7.5H4C3.46957 7.5 2.96086 7.71071 2.58579 8.08579C2.21071 8.46086 2 8.96957 2 9.5V10.5M8 3.5C8 4.60457 7.10457 5.5 6 5.5C4.89543 5.5 4 4.60457 4 3.5C4 2.39543 4.89543 1.5 6 1.5C7.10457 1.5 8 2.39543 8 3.5Z\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>{{auditDetails?.displayName ? auditDetails?.displayName:'--'}}</span> \r\n <span class=\"d-flex ms-1 align-items-center\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"\" opacity=\"0.1\"></rect>\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"\" stroke-width=\"6\"></rect>\r\n <path d=\"M15.6799 18.8039L15.6267 18.8871C15.0686 19.8741 15.6644 21.1215 16.7361 21.2646C16.8331 21.2765 16.9235 21.2828 17.0118 21.2828C17.5899 21.2828 18.1011 21.0348 18.4574 20.648L19.0107 20.0474L19.5621 20.6498C19.9141 21.0342 20.4241 21.2828 21.0061 21.2828C21.5856 21.2828 22.0985 21.0338 22.4502 20.6498L23.0033 20.0455L23.5565 20.6498C23.9081 21.0338 24.4211 21.2828 25.0005 21.2828C25.58 21.2828 26.0929 21.0338 26.4445 20.6498L26.9977 20.0455L27.5509 20.6498C27.9025 21.0338 28.4155 21.2828 28.9949 21.2828C29.0803 21.2828 29.1733 21.2765 29.2697 21.2647C30.3649 21.1154 30.9627 19.8012 30.324 18.8044C30.324 18.8043 30.324 18.8043 30.3239 18.8042L28.5658 16.0628L28.5658 16.0628L28.5648 16.0614C28.5496 16.0375 28.5121 16.012 28.465 16.012H17.5356C17.4884 16.012 17.4509 16.0375 17.4357 16.0614L17.4351 16.0623L15.6799 18.8039ZM28.6514 23.7372V26.8691V27.6191H27.9014H18.0992H17.3492V26.8691V23.7376C17.239 23.7458 17.1274 23.7501 17.0148 23.7501C16.9725 23.7501 16.9305 23.7494 16.8888 23.7482V26.8691V28.8036C16.8888 29.4471 17.4227 29.9882 18.0992 29.9882H27.9014C28.5779 29.9882 29.1118 29.4471 29.1118 28.8036V26.8691V23.7484C29.072 23.7495 29.032 23.7501 28.9918 23.7501C28.8774 23.7501 28.7639 23.7457 28.6514 23.7372Z\" stroke=\"#000000\" stroke-width=\"1.5\"></path></svg> \r\n <span class=\"ms-1 sub-title\"> {{auditDetails.storeName}}</span>\r\n </span>\r\n\r\n \r\n <!-- displayName -->\r\n <div *ngIf=\"currentAuditType !== 'remote'\" class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M5.25021 6.50028C5.91329 6.50028 6.54921 6.23689 7.01807 5.76807C7.48694 5.29924 7.75035 4.66337 7.75035 4.00035C7.75035 3.33732 7.48694 2.70146 7.01807 2.23263C6.54921 1.7638 5.91329 1.50042 5.25021 1.50042C4.58713 1.50042 3.95121 1.7638 3.48234 2.23263C3.01348 2.70146 2.75007 3.33732 2.75007 4.00035C2.75007 4.66337 3.01348 5.29924 3.48234 5.76807C3.95121 6.23689 4.58713 6.50028 5.25021 6.50028ZM5.25021 5.25031C4.91867 5.25031 4.60071 5.11862 4.36628 4.88421C4.13184 4.64979 4.00014 4.33186 4.00014 4.00035C4.00014 3.66884 4.13184 3.3509 4.36628 3.11649C4.60071 2.88207 4.91867 2.75038 5.25021 2.75038C5.58175 2.75038 5.89971 2.88207 6.13414 3.11649C6.36857 3.3509 6.50028 3.66884 6.50028 4.00035C6.50028 4.33186 6.36857 4.64979 6.13414 4.88421C5.89971 5.11862 5.58175 5.25031 5.25021 5.25031ZM1.5 8.79188C1.5 7.9869 2.15337 7.33359 2.95841 7.33359H7.542C8.34705 7.33359 9.00042 7.9869 9.00042 8.79188V12.7501C9.00042 13.7446 8.60531 14.6984 7.90201 15.4017C7.1987 16.1049 6.24483 16.5 5.25021 16.5C4.25559 16.5 3.30171 16.1049 2.59841 15.4017C1.89511 14.6984 1.5 13.7446 1.5 12.7501V8.79188ZM2.95841 8.58355C2.90316 8.58355 2.85016 8.6055 2.81109 8.64457C2.77202 8.68364 2.75007 8.73663 2.75007 8.79188V12.7501C2.75007 13.4131 3.01348 14.049 3.48234 14.5178C3.95121 14.9867 4.58713 15.25 5.25021 15.25C5.91329 15.25 6.54921 14.9867 7.01807 14.5178C7.48694 14.049 7.75035 13.4131 7.75035 12.7501V8.79188C7.75035 8.73663 7.7284 8.68364 7.68932 8.64457C7.65025 8.6055 7.59726 8.58355 7.542 8.58355H2.95841ZM7.77285 6.17862C8.15328 6.39267 8.58313 6.5034 9.01963 6.49978C9.45614 6.49616 9.8841 6.37832 10.2609 6.15799C10.6378 5.93766 10.9503 5.62252 11.1675 5.24391C11.3848 4.8653 11.499 4.43642 11.499 3.99993C11.499 3.56344 11.3848 3.13456 11.1675 2.75595C10.9503 2.37734 10.6378 2.0622 10.2609 1.84187C9.8841 1.62154 9.45614 1.50371 9.01963 1.50009C8.58313 1.49647 8.15328 1.60719 7.77285 1.82124C8.04536 2.13623 8.25954 2.50289 8.39955 2.90454C8.58991 2.80026 8.80415 2.74733 9.02118 2.75097C9.23821 2.75462 9.45055 2.81471 9.63731 2.92533C9.82406 3.03594 9.97879 3.19328 10.0863 3.38185C10.1937 3.57042 10.2503 3.78372 10.2503 4.00076C10.2503 4.21781 10.1937 4.43111 10.0863 4.61968C9.97879 4.80825 9.82406 4.96558 9.63731 5.0762C9.45055 5.18682 9.23821 5.24691 9.02118 5.25055C8.80415 5.2542 8.58991 5.20127 8.39955 5.09698C8.26074 5.49382 8.0481 5.86082 7.77285 6.17862ZM8.05036 16.3783C8.35483 16.4583 8.67151 16.4989 9.00042 16.5C9.99503 16.5 10.9489 16.1049 11.6522 15.4017C12.3555 14.6984 12.7506 13.7446 12.7506 12.7501V8.79188C12.7506 8.40512 12.597 8.03419 12.3235 7.76071C12.05 7.48723 11.679 7.33359 11.2922 7.33359H9.30877C9.59462 7.67941 9.78046 8.11107 9.8238 8.58355H11.2905C11.3458 8.58355 11.3988 8.6055 11.4379 8.64457C11.4769 8.68364 11.4989 8.73663 11.4989 8.79188V12.7501C11.4989 13.3968 11.2483 14.0184 10.7996 14.4843C10.351 14.9501 9.73925 15.224 9.09292 15.2484C8.81041 15.6817 8.45872 16.0633 8.05036 16.3783ZM11.5222 6.17862C11.9027 6.39267 12.3325 6.5034 12.769 6.49978C13.2055 6.49616 13.6335 6.37832 14.0103 6.15799C14.3871 5.93766 14.6997 5.62252 14.9169 5.24391C15.1341 4.8653 15.2484 4.43642 15.2484 3.99993C15.2484 3.56344 15.1341 3.13456 14.9169 2.75595C14.6997 2.37734 14.3871 2.0622 14.0103 1.84187C13.6335 1.62154 13.2055 1.50371 12.769 1.50009C12.3325 1.49647 11.9027 1.60719 11.5222 1.82124C11.7947 2.13623 12.0089 2.50289 12.1489 2.90454C12.3393 2.80026 12.5535 2.74733 12.7706 2.75097C12.9876 2.75462 13.1999 2.81471 13.3867 2.92533C13.5734 3.03594 13.7282 3.19328 13.8356 3.38185C13.9431 3.57042 13.9996 3.78372 13.9996 4.00076C13.9996 4.21781 13.9431 4.43111 13.8356 4.61968C13.7282 4.80825 13.5734 4.96558 13.3867 5.0762C13.1999 5.18682 12.9876 5.24691 12.7706 5.25055C12.5535 5.2542 12.3393 5.20127 12.1489 5.09698C12.0101 5.49382 11.7975 5.86082 11.5222 6.17862ZM11.7997 16.3783C12.1042 16.4583 12.4209 16.4989 12.7498 16.5C13.7444 16.5 14.6983 16.1049 15.4016 15.4017C16.1049 14.6984 16.5 13.7446 16.5 12.7501V8.79188C16.5 8.40526 16.3465 8.03447 16.0731 7.76101C15.7998 7.48755 15.4291 7.33381 15.0424 7.33359H13.059C13.3448 7.67941 13.5315 8.11107 13.574 8.58355H15.0408C15.096 8.58355 15.149 8.6055 15.1881 8.64457C15.2271 8.68364 15.2491 8.73663 15.2491 8.79188V12.7501C15.2491 13.3968 14.9985 14.0184 14.5498 14.4843C14.1012 14.9501 13.4895 15.224 12.8431 15.2484C12.5606 15.6817 12.2081 16.0633 11.7997 16.3783Z\"\r\n fill=\"#667085\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.queueId}}</span>\r\n </div>\r\n <div *ngIf=\"currentAuditType === 'remote'\" class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M5.25021 6.50028C5.91329 6.50028 6.54921 6.23689 7.01807 5.76807C7.48694 5.29924 7.75035 4.66337 7.75035 4.00035C7.75035 3.33732 7.48694 2.70146 7.01807 2.23263C6.54921 1.7638 5.91329 1.50042 5.25021 1.50042C4.58713 1.50042 3.95121 1.7638 3.48234 2.23263C3.01348 2.70146 2.75007 3.33732 2.75007 4.00035C2.75007 4.66337 3.01348 5.29924 3.48234 5.76807C3.95121 6.23689 4.58713 6.50028 5.25021 6.50028ZM5.25021 5.25031C4.91867 5.25031 4.60071 5.11862 4.36628 4.88421C4.13184 4.64979 4.00014 4.33186 4.00014 4.00035C4.00014 3.66884 4.13184 3.3509 4.36628 3.11649C4.60071 2.88207 4.91867 2.75038 5.25021 2.75038C5.58175 2.75038 5.89971 2.88207 6.13414 3.11649C6.36857 3.3509 6.50028 3.66884 6.50028 4.00035C6.50028 4.33186 6.36857 4.64979 6.13414 4.88421C5.89971 5.11862 5.58175 5.25031 5.25021 5.25031ZM1.5 8.79188C1.5 7.9869 2.15337 7.33359 2.95841 7.33359H7.542C8.34705 7.33359 9.00042 7.9869 9.00042 8.79188V12.7501C9.00042 13.7446 8.60531 14.6984 7.90201 15.4017C7.1987 16.1049 6.24483 16.5 5.25021 16.5C4.25559 16.5 3.30171 16.1049 2.59841 15.4017C1.89511 14.6984 1.5 13.7446 1.5 12.7501V8.79188ZM2.95841 8.58355C2.90316 8.58355 2.85016 8.6055 2.81109 8.64457C2.77202 8.68364 2.75007 8.73663 2.75007 8.79188V12.7501C2.75007 13.4131 3.01348 14.049 3.48234 14.5178C3.95121 14.9867 4.58713 15.25 5.25021 15.25C5.91329 15.25 6.54921 14.9867 7.01807 14.5178C7.48694 14.049 7.75035 13.4131 7.75035 12.7501V8.79188C7.75035 8.73663 7.7284 8.68364 7.68932 8.64457C7.65025 8.6055 7.59726 8.58355 7.542 8.58355H2.95841ZM7.77285 6.17862C8.15328 6.39267 8.58313 6.5034 9.01963 6.49978C9.45614 6.49616 9.8841 6.37832 10.2609 6.15799C10.6378 5.93766 10.9503 5.62252 11.1675 5.24391C11.3848 4.8653 11.499 4.43642 11.499 3.99993C11.499 3.56344 11.3848 3.13456 11.1675 2.75595C10.9503 2.37734 10.6378 2.0622 10.2609 1.84187C9.8841 1.62154 9.45614 1.50371 9.01963 1.50009C8.58313 1.49647 8.15328 1.60719 7.77285 1.82124C8.04536 2.13623 8.25954 2.50289 8.39955 2.90454C8.58991 2.80026 8.80415 2.74733 9.02118 2.75097C9.23821 2.75462 9.45055 2.81471 9.63731 2.92533C9.82406 3.03594 9.97879 3.19328 10.0863 3.38185C10.1937 3.57042 10.2503 3.78372 10.2503 4.00076C10.2503 4.21781 10.1937 4.43111 10.0863 4.61968C9.97879 4.80825 9.82406 4.96558 9.63731 5.0762C9.45055 5.18682 9.23821 5.24691 9.02118 5.25055C8.80415 5.2542 8.58991 5.20127 8.39955 5.09698C8.26074 5.49382 8.0481 5.86082 7.77285 6.17862ZM8.05036 16.3783C8.35483 16.4583 8.67151 16.4989 9.00042 16.5C9.99503 16.5 10.9489 16.1049 11.6522 15.4017C12.3555 14.6984 12.7506 13.7446 12.7506 12.7501V8.79188C12.7506 8.40512 12.597 8.03419 12.3235 7.76071C12.05 7.48723 11.679 7.33359 11.2922 7.33359H9.30877C9.59462 7.67941 9.78046 8.11107 9.8238 8.58355H11.2905C11.3458 8.58355 11.3988 8.6055 11.4379 8.64457C11.4769 8.68364 11.4989 8.73663 11.4989 8.79188V12.7501C11.4989 13.3968 11.2483 14.0184 10.7996 14.4843C10.351 14.9501 9.73925 15.224 9.09292 15.2484C8.81041 15.6817 8.45872 16.0633 8.05036 16.3783ZM11.5222 6.17862C11.9027 6.39267 12.3325 6.5034 12.769 6.49978C13.2055 6.49616 13.6335 6.37832 14.0103 6.15799C14.3871 5.93766 14.6997 5.62252 14.9169 5.24391C15.1341 4.8653 15.2484 4.43642 15.2484 3.99993C15.2484 3.56344 15.1341 3.13456 14.9169 2.75595C14.6997 2.37734 14.3871 2.0622 14.0103 1.84187C13.6335 1.62154 13.2055 1.50371 12.769 1.50009C12.3325 1.49647 11.9027 1.60719 11.5222 1.82124C11.7947 2.13623 12.0089 2.50289 12.1489 2.90454C12.3393 2.80026 12.5535 2.74733 12.7706 2.75097C12.9876 2.75462 13.1999 2.81471 13.3867 2.92533C13.5734 3.03594 13.7282 3.19328 13.8356 3.38185C13.9431 3.57042 13.9996 3.78372 13.9996 4.00076C13.9996 4.21781 13.9431 4.43111 13.8356 4.61968C13.7282 4.80825 13.5734 4.96558 13.3867 5.0762C13.1999 5.18682 12.9876 5.24691 12.7706 5.25055C12.5535 5.2542 12.3393 5.20127 12.1489 5.09698C12.0101 5.49382 11.7975 5.86082 11.5222 6.17862ZM11.7997 16.3783C12.1042 16.4583 12.4209 16.4989 12.7498 16.5C13.7444 16.5 14.6983 16.1049 15.4016 15.4017C16.1049 14.6984 16.5 13.7446 16.5 12.7501V8.79188C16.5 8.40526 16.3465 8.03447 16.0731 7.76101C15.7998 7.48755 15.4291 7.33381 15.0424 7.33359H13.059C13.3448 7.67941 13.5315 8.11107 13.574 8.58355H15.0408C15.096 8.58355 15.149 8.6055 15.1881 8.64457C15.2271 8.68364 15.2491 8.73663 15.2491 8.79188V12.7501C15.2491 13.3968 14.9985 14.0184 14.5498 14.4843C14.1012 14.9501 13.4895 15.224 12.8431 15.2484C12.5606 15.6817 12.2081 16.0633 11.7997 16.3783Z\"\r\n fill=\"#667085\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.engagementId ?auditDetails?.engagementId:'--'}}</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" 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\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{currentAuditType | titlecase}} Eye Test</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" 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\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.fileDate | date: 'dd/MM/YYYY'}}</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_166_55019)\">\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\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_166_55019\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.testStartTime}} {{auditDetails?.testStartTime?.split(':')[0]>12?'PM':'AM'}} - {{auditDetails?.testEndTime}} {{auditDetails?.testEndTime?.split(':')[0]>12?'PM':'AM'}}\r\n ({{auditDetails?.testDuration}} Mins)</span>\r\n </div>\r\n <span class=\"ms-3 badge badge-light-primary\">{{auditDetails?.visitorsType | titlecase}}</span>\r\n <div *ngIf=\"['Yet-to-Audit'].includes(auditDetails?.auditStatus)\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-primary\" style=\"font-size: 14px;\">\r\n Yet to Audit\r\n </div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Audited'\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-success\" style=\"font-size: 14px;\">\r\n Audited\r\n </div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Audited' || auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Re-Audited'\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-warning\" style=\"font-size: 14px;\">\r\n Re-Audited\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"row mt-3\">\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 text-center header-card\">\r\n AI Verified Steps <span><svg ngbTooltip=\"Number of steps detected and validated automatically without manual review.\" placement=\"right\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" \r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.coveredStepsAI?auditDetails?.coveredStepsAI:0}}/{{auditDetails?.totalSteps ? auditDetails?.totalSteps:'--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 text-center header-card\">\r\n Human Verified Steps <span><svg ngbTooltip=\"Number of steps that required human validation to ensure compliance and accuracy.\" placement=\"right\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.auditedSteps?auditDetails?.auditedSteps:0}}/{{auditDetails?.totalSteps ? auditDetails?.totalSteps:'--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 header-card\">\r\n AI Compliance Score <span><svg ngbTooltip=\"Measures the percentage of steps AI flagged as compliant without human intervention.\" placement=\"left\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.complianceScore ?auditDetails?.complianceScore : 0}}%</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 header-card\">\r\n AI Trust Score <span><svg ngbTooltip=\"This score reflects how often AI predictions were accepted without manual overrides.\" placement=\"left\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.trustScore ? auditDetails?.trustScore:'--'}}%</span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"row mt-3\">\r\n <div [ngClass]=\"eyeTestType ==='fake' ? 'col-md-12' : 'col-md-6'\" class=\"col-sm-6\">\r\n <div class=\"card h-500px px-5\">\r\n <div class=\"card-header p-0 border-0\">\r\n <span class=\"card-title m-0 fw-bolder bg-none\">Preview Eye Test</span>\r\n </div>\r\n <div class=\"card-body px-0 position-relative\">\r\n <div class=\"video-position w-100\">\r\n <video class=\"w-100 rounded-3 h-auto\" controls\r\n [src]=\"auditDetails?.filePath\"></video>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestType !=='fake'\" class=\"col-sm-6\">\r\n <div class=\"card h-500px px-5 overflow-scroll\">\r\n <div class=\"card-header mb-3 p-0 border-0 d-flex justify-content-between align-items-center\">\r\n <div class=\"\">\r\n <span class=\"card-title m-0 fw-bolder bg-none\">Step-wise Breakdown</span>\r\n \r\n \r\n <div class=\"d-flex sub-title mt-2\" *ngIf=\"auditDetails?.lastAuditedDetails?.auditedBy\">\r\n <span *ngIf=\"currentAuditType === 'remote'\"> <span *ngIf=\"auditDetails?.spokenLanguage\"> <span *ngIf=\"!takeAudit\" class=\"badge badge-light-info mt-0 me-2\">Language Spoken: {{auditDetails?.spokenLanguage}}</span></span></span> <span class=\"mt-1\">Recently Audited By : </span>\r\n <span class=\"ms-2 mt-1\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\"\r\n height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M13.3337 14V12.6667C13.3337 11.9594 13.0527 11.2811 12.5526 10.781C12.0525 10.281 11.3742 10 10.667 10H5.33366C4.62641 10 3.94814 10.281 3.44804 10.781C2.94794 11.2811 2.66699 11.9594 2.66699 12.6667V14M10.667 4.66667C10.667 6.13943 9.47308 7.33333 8.00033 7.33333C6.52757 7.33333 5.33366 6.13943 5.33366 4.66667C5.33366 3.19391 6.52757 2 8.00033 2C9.47308 2 10.667 3.19391 10.667 4.66667Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span >{{auditDetails?.lastAuditedDetails?.auditedBy}}</span>\r\n <span class=\"ms-2 mt-1\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\"\r\n height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_152_29431)\">\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_152_29431\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>{{auditDetails?.lastAuditedDetails?.completionTime}}\r\n {{auditDetails?.lastAuditedDetails?.timeZone}}</span>\r\n </div>\r\n \r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"takeAudit && currentAuditType === 'remote'\" class=\"d-flex align-items-end me-2\">\r\n <select [(ngModel)]=\"spokenLanguage\" class=\"form-select form-select-sm\">\r\n <option selected disabled >Language Spoken <span style=\"color:red\">*</span></option>\r\n <option value=\"English\">English</option>\r\n <option value=\"Hindi\">Hindi</option>\r\n </select></div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Yet-to-Audit' && !takeAudit\" (click)=\"startAudit('audit')\"\r\n class=\"text-white ms-3 px-3 py-2 fw-semibold rounded-2 cursor-pointer bg-primary\"\r\n style=\"font-size: 14px;\">\r\n Start Audit\r\n </div>\r\n \r\n <div *ngIf=\"['Audited','Re-Audit','Yet-to-Audit'].includes(auditDetails?.auditStatus)&&auditDetails?.auditType === 'Re-Audit' && !takeAudit||auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Audited' ||auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Re-Audited'&& !takeAudit \"\r\n (click)=\"startAudit('Re-Audit')\" class=\"btn btn-sm py-2 btn-warning\">Re-Audit</div>\r\n <div *ngIf=\"takeAudit\" class=\"d-flex\">\r\n <button class=\"btn btn-sm btn-outline\" [disabled]=\"disablecancel\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn ms-2 btn-sm btn-success\" [disabled]=\"disablecancel\" (click)=\"onsubmit()\">Submit</button>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body mt-1 px-0\">\r\n <div *ngIf=\"!takeAudit && stepWiseProcess?.length\" class=\"table-responsive border border-1 rounded-3\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n Step-by-step Process\r\n </th>\r\n <th *ngIf=\"currentAuditType === 'remote'\" class=\"text-start\">\r\n Predicted Transcript\r\n </th>\r\n <th class=\"text-start\">\r\n AI Verified\r\n </th>\r\n <th class=\"text-start\">\r\n Human Audited\r\n </th>\r\n <th class=\"text-start\">\r\n Reason for Error\r\n </th>\r\n <th class=\"text-start\">\r\n Noticed Time Range\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of stepWiseProcess;let i=index\">\r\n <td>\r\n <div class=\"d-flex align-items-start\">\r\n <!-- <div class=\"w-40px h-40px d-flex justify-content-center text-center me-3\">\r\n <img class=\"w-100 rounded-5\" [src]=\"data?.imageUrl\">\r\n </div> -->\r\n {{data.processName}}\r\n </div>\r\n </td>\r\n <td *ngIf=\"currentAuditType ==='remote'\" class=\"text-capitalize\">\r\n <div class=\"text-primary1 text-decoration-underline cursor-pointer\"\r\n [ngbTooltip]=\"data?.predictedTranscript ? tooltipContent : ''\"\r\n placement='bottom'>{{data?.predictedTranscript?data?.predictedTranscript:\"N/A\"}}</div>\r\n\r\n <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"min-w-500px\">{{data?.predictedTranscript?data?.predictedTranscript:\"N/A\"}}</span>\r\n </div>\r\n </ng-template>\r\n\r\n </td>\r\n <td class=\"text-capitalize\"><span\r\n [ngClass]=\"data.AIStatus ? 'badge badge-light-success' : 'badge badge-light-danger'\">{{data.AIStatus\r\n ? 'pass' : 'fail'}}</span></td>\r\n <td class=\"text-capitalize\">\r\n <span \r\n [ngClass]=\"data?.auditedStatus === true ? 'badge badge-light-success' : (data?.auditedStatus === false ? 'badge badge-light-danger' : '')\">\r\n {{ data?.auditedStatus === true ? 'pass' : (data?.auditedStatus === false ? 'fail' : 'N/A') }}\r\n </span>\r\n \r\n </td>\r\n <td *ngIf=\"data.AIStatus !== data.auditedStatus || data.auditedStatus === null || data.auditedStatus === undefined || data.auditedStatus === ''; else EqualBlock\">\r\n <!-- {{ data?.reason || 'N/A' }} -->\r\n <span *ngIf=\"data.reason !=='others'\">{{data.reason || 'N/A'}}</span><span *ngIf=\"data.reason ==='others'\">{{data.otherReason || 'N/A'}}</span>\r\n </td>\r\n <ng-template #EqualBlock>\r\n <td>N/A</td>\r\n </ng-template>\r\n <td>{{data?.startTime}} - {{data?.endTime}}</td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <div *ngIf=\"stepWiseProcess?.length && takeAudit&&auditDetails?.auditStatus==='Yet-to-Audit'||auditDetails?.auditStatus==='In-Progress'\">\r\n <div *ngFor=\"let process of stepWiseProcess; let i=index ;let last=last\"\r\n class=\"border border-1 rounded-3 mb-3\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n Step-{{i+1 | number}}\r\n </th>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n AI Verified\r\n </th>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n Human Audited\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td class=\"w-200px\">\r\n <!-- <div class=\"d-flex align-items-start\"> -->\r\n <!-- <div class=\"w-40px h-40px d-flex justify-content-center text-center me-3\">\r\n <img class=\"w-100 rounded-5\" [src]=\"process.imageUrl\">\r\n </div> -->\r\n {{process.processName}}\r\n <!-- </div> -->\r\n </td>\r\n <td><span *ngIf=\"process.AIStatus\" class=\"badge badge-light-success text-capitalize\">Pass</span>\r\n <span *ngIf=\"!process.AIStatus\" class=\"badge badge-light-danger text-capitalize\">Fail</span>\r\n </td>\r\n <td>\r\n <div class=\"d-flex justify-content-start\">\r\n <div (click)=\"selectHumanVerified(i,true)\"\r\n [ngClass]=\"process?.auditedStatus ? 'text-white btn-success' : 'text-success bg-white border border-success'\"\r\n class=\"btn btn-sm rounded-5\"><span><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"16\"\r\n viewBox=\"0 0 17 16\" fill=\"none\">\r\n <path d=\"M14.1667 4L6.83333 11.3333L3.5 8\"\r\n [attr.stroke]=\"process?.auditedStatus ? 'white' : '#17C653'\"\r\n stroke-width=\"1.25\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span><span class=\"ms-2\">Pass</span></div>\r\n\r\n <div (click)=\"selectHumanVerified(i,false)\"\r\n [ngClass]=\"process?.auditedStatus===false ? 'text-white bg-danger' : 'text-danger bg-white border border-danger'\"\r\n class=\"ms-3 px-5 py-2 fw-semibold rounded-5 cursor-pointer rounded-5\">\r\n <span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"16\"\r\n viewBox=\"0 0 17 16\" fill=\"none\">\r\n <path d=\"M12.6665 4L4.6665 12M4.6665 4L12.6665 12\"\r\n [attr.stroke]=\"process?.auditedStatus===false ? 'white' : '#F8285A'\"\r\n stroke-width=\"1.25\" stroke-linecap=\"rowund\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span><span class=\"ms-2\">Fail</span></div>\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <div *ngIf=\"currentAuditType === 'remote' && process?.predictedTranscript\" class=\"w-100\">\r\n <div class=\"bg-light-primary text-primary p-3\">\r\n Predicted Transcript\r\n </div>\r\n <div class=\"row col-sm-12 p-5\">\r\n <div class=\"text-primary text-decoration-underline cursor-pointer\"\r\n [ngbTooltip]=\"process?.predictedTranscript ? tooltipContent : ''\"\r\n placement='bottom'>\r\n {{process?.predictedTranscript}}\r\n </div>\r\n <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"min-w-500px\">{{process?.predictedTranscript}}</span>\r\n </div>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div *ngIf=\"process?.auditedStatus !== undefined && process?.auditedStatus !== '' && process?.auditedStatus !== process?.AIStatus\" class=\"w-100\">\r\n <div class=\"bg-light-primary text-primary p-3\">\r\n Reason & Time Stamp\r\n </div>\r\n <div class=\"row col-sm-12 p-5\">\r\n <div class=\"col-sm-6 col-md-6\">\r\n <div>\r\n <div (click)=\"toggleDropdown(i,'reason')\" class=\"custom-dropdown\">\r\n <div class=\"d-flex justify-content-between\">\r\n <span class=\"text-select\">\r\n {{ process?.reason ? process?.reason : 'Select Reason' }}\r\n </span>\r\n <span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n \r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\" *ngIf=\"dropdownOpen[i]?.reason\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"item my-2 minutes-scroll\">\r\n <ul *ngFor=\"let item of dropdownList\" class=\"list-unstyled\">\r\n <li [ngClass]=\"process?.reason === item?.key ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n (click)=\"selectReason(i, item?.key, 'reason')\">\r\n {{ item?.item }}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <!-- Custom Input for \"Others\" -->\r\n <div *ngIf=\"process?.reason === 'others'\" class=\"mt-2\">\r\n <input \r\n type=\"text\" \r\n [(ngModel)]=\"process.otherReason\" \r\n placeholder=\"Enter your reason\" \r\n class=\"form-control form-control-sm\" />\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"col-sm-3\">\r\n <div class=\"w-100\">\r\n <div (click)=\"toggleDropdown(i,'startTime')\" class=\"custom-dropdown\">\r\n <label class=\"label fw-semibold bg-white px-2\">Start</label>\r\n <div class=\"text-select\">{{process?.startTime ? process?.startTime\r\n :'MM:SS'}}</div>\r\n\r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\"\r\n *ngIf=\"dropdownOpen[i]?.startTime\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"scroll-section minutes-scroll \">\r\n <div *ngFor=\"let min of minutesList\"\r\n (click)=\"selectMinute(i,min,'startTime')\"\r\n [class.selected]=\"min === selectedMinutes\">\r\n {{ min }}\r\n </div>\r\n </div>\r\n <!-- Seconds List -->\r\n <div class=\"scroll-section seconds-scroll\">\r\n <div *ngFor=\"let sec of secondsList\"\r\n (click)=\"selectSecond(i,sec,'startTime')\"\r\n [class.selected]=\"sec === selectedSeconds\">\r\n {{ sec }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"w-100\">\r\n <div (click)=\"toggleDropdown(i,'endTime')\" class=\"custom-dropdown\">\r\n <label class=\"label fw-semibold bg-white px-2\">End</label>\r\n <div class=\"text-select\"><span>{{process.endTime ? process.endTime :\r\n 'MM:SS'}}</span></div>\r\n\r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\"\r\n *ngIf=\"dropdownOpen[i]?.endTime\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"scroll-section minutes-scroll\">\r\n <div *ngFor=\"let min of minutesList\"\r\n [class.selected]=\"min === selectedMinutes\"\r\n [class.disabled]=\"getSecondsFromTime(min + ':' + selectedSeconds) <= getSecondsFromTime(process.startTime)\"\r\n (click)=\"\r\n getSecondsFromTime(min + ':' + selectedSeconds) > getSecondsFromTime(process.startTime)\r\n && selectMinute(i,min,'endTime')\">\r\n {{ min }}\r\n </div>\r\n \r\n </div>\r\n <!-- Seconds List -->\r\n <div class=\"scroll-section seconds-scroll\">\r\n <div *ngFor=\"let sec of secondsList\"\r\n [class.selected]=\"sec === selectedSeconds\"\r\n [class.disabled]=\"getSecondsFromTime(selectedMinutes + ':' + sec) <= getSecondsFromTime(process.startTime)\"\r\n (click)=\"\r\n getSecondsFromTime(selectedMinutes + ':' + sec) > getSecondsFromTime(process.startTime)\r\n && selectSecond(i,sec,'endTime')\">\r\n {{ sec }}\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!stepWiseProcess?.length\">\r\n <div *ngIf=\"(tableLoading | async) === 'loading'\"\r\n class=\"card 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 <div *ngIf=\"(tableLoading | async) === 'loaded'\" class=\"row mt-2\">\r\n <div *ngIf=\"noData\" class=\"col-lg-12\">\r\n <div class=\"card-body my-8 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=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the test</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"card mt-3 p-2\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"title-text mb-2\">History</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-body py-0 px-3\">\r\n <div class=\"table-responsive border border-1 rounded-3\" *ngIf=\"historyData?.length\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">Audited By</th>\r\n <th class=\"text-start\" >Audited Date</th>\r\n <th class=\"text-start\" >Time Stamp</th>\r\n <th class=\"text-start\" >View Logs</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of historyData\">\r\n <td>{{item.userName}}</td>\r\n <td>{{item.Date}}</td>\r\n <td>{{item.Time}} IST</td>\r\n <td (click)=\"viewHistoryModel(item)\" class=\"cursor-pointer\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"16\"\r\n viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n\r\n <div *ngIf=\"!historyData?.length\">\r\n <div *ngIf=\"(historytableLoading | async) === 'loading'\"\r\n class=\"card 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\r\n <div *ngIf=\"(historytableLoading | async) === 'loaded'\" class=\"row mt-2\">\r\n <div class=\"col-lg-12\">\r\n <div class=\"card-body my-8 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=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the test</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<ng-template #viewHistory let-model>\r\n <div class=\"p-5 ts700px scroll\">\r\n\r\n\r\n <div class=\"card-body py-0 \">\r\n <div class=\"my-2 d-flex\">\r\n<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"46\"\r\n height=\"46\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M28 22V28L32 30M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span\r\n class=\"ms-3 pt-2 fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Audit\r\n History</span>\r\n </div>\r\n <div class=\"table-responsive\" *ngIf=\"historyData?.length\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">Step-by-Step Process</th>\r\n <th class=\"text-start\">Status changed from</th>\r\n <th class=\"text-start\">Noted Time Range</th>\r\n <th class=\"text-start\">Reason for Error</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of viewHistoryData\">\r\n <td>{{item.processName}}</td>\r\n <td>\r\n <span *ngIf=\"item.AIStatus\" class=\"badge badge-light-success me-2\">Pass</span>\r\n <span *ngIf=\"!item.AIStatus\" class=\"badge badge-light-danger me-2\">Fail</span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"31\" height=\"8\" viewBox=\"0 0 31 8\"\r\n fill=\"none\">\r\n <path\r\n d=\"M30.3536 4.35355C30.5488 4.15829 30.5488 3.84171 30.3536 3.64645L27.1716 0.464466C26.9763 0.269204 26.6597 0.269204 26.4645 0.464466C26.2692 0.659728 26.2692 0.976311 26.4645 1.17157L29.2929 4L26.4645 6.82843C26.2692 7.02369 26.2692 7.34027 26.4645 7.53553C26.6597 7.7308 26.9763 7.7308 27.1716 7.53553L30.3536 4.35355ZM0 4.5H30V3.5H0V4.5Z\"\r\n fill=\"#D0D5DD\" />\r\n </svg>\r\n <span *ngIf=\"item.auditedStatus\" class=\"badge badge-light-success ms-2\">Pass</span>\r\n <span *ngIf=\"!item.auditedStatus\" class=\"badge badge-light-danger ms-2\">Fail</span>\r\n </td>\r\n <td ><span class=\"badge badge-light-success\" *ngIf=\"item.startTime\">Noted Time Range : <span class=\"text-dark1\">{{item.startTime ? item.startTime:'--'}} - {{item.endTime}}</span></span></td>\r\n <td class=\"engage-text\"><span *ngIf=\"item.reason !=='others'\">{{item.reason}}</span><span *ngIf=\"item.reason ==='others'\">{{item.otherReason}}</span></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #viewCancel let-model>\r\n <div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEF0C7\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FFFAEB\" stroke-width=\"8\"/>\r\n <path d=\"M27.9988 24V28M27.9988 32H28.0088M26.2888 18.86L17.8188 33C17.6442 33.3024 17.5518 33.6453 17.5508 33.9945C17.5498 34.3437 17.6403 34.6871 17.8132 34.9905C17.9862 35.2939 18.2355 35.5467 18.5365 35.7238C18.8375 35.9009 19.1796 35.9961 19.5288 36H36.4688C36.818 35.9961 37.1601 35.9009 37.4611 35.7238C37.7621 35.5467 38.0114 35.2939 38.1844 34.9905C38.3573 34.6871 38.4478 34.3437 38.4468 33.9945C38.4458 33.6453 38.3534 33.3024 38.1788 33L29.7088 18.86C29.5305 18.5661 29.2795 18.3231 28.98 18.1544C28.6805 17.9858 28.3425 17.8972 27.9988 17.8972C27.6551 17.8972 27.3171 17.9858 27.0176 18.1544C26.7181 18.3231 26.4671 18.5661 26.2888 18.86Z\" stroke=\"#DC6803\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Are you sure?</a>\r\n <span class=\"sub-title fw-normal mt-2\">Would you like to cancel this?</span>\r\n \r\n <div class=\"mt-5 w-100\">\r\n \r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"OnCancel()\">No</button>\r\n <button id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onYes()\">Yes</button>\r\n \r\n </div>\r\n \r\n </div>\r\n \r\n </div>\r\n </div>\r\n</ng-template>\r\n</section>", styles: [":host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.shown.drops-down-right{transform-origin:0 0;width:560px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;right:-475px!important;left:unset!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.card-title{font-size:1.15rem!important}.select-wrapper{position:relative;display:inline-block;width:100%}.placeholder-overlay{position:absolute;color:var(--Gray-500, #667085);font-family:Inter;font-size:16px!important;font-style:normal;font-weight:400;top:10px;left:15px;pointer-events:none;font-size:1.1rem;z-index:1}table th,table td{height:44px!important;padding:12px 24px!important;gap:12px;align-self:stretch}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:18px}table td{color:var(--Gray-900, #667085);font-size:14px!important;font-weight:500!important;line-height:20px}.bottom-border td{border-bottom:1px solid var(--Gray-200, #EAECF0)!important}.rotate{rotate:180deg;transition:1s}.engage-text{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-transform:capitalize}.dashed{border-radius:4px;border:1px dashed var(--Error-500, #F04438)!important;background:var(--Error-25, #FFFBFA)}.dashed-desc{color:var(--Error-600, #3F4254)!important;font-size:14px;font-weight:600;line-height:24px}.card-header,.header{color:var(--Gray-900, #101828);font-size:20px!important;font-style:normal;font-weight:700;line-height:30px}.sub-header{color:var(--Gray-700, #344054);font-size:14px!important;font-style:normal;font-weight:600;line-height:20px}.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}.text-value{color:var(--Black, #101828);font-size:24px;font-weight:600;line-height:32px}.text-sub{color:var(--Error-600, #667085)!important;font-size:16px;font-weight:600;line-height:18px}.test-sub1{color:var(--Gray-800, #1D2939);font-size:11px;font-weight:400;line-height:18px}.new1 .header-card{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;color:var(--Black, #101828);font-size:18px;line-height:32px}.new1 .text-card{color:var(--Black, #101828);font-size:24px;line-height:32px}.new1 .bg-light-primary{border-bottom:1px solid var(--Primary-100, #DAF1FF)!important;background:var(--Primary-25, #F6FCFF)!important}.new1 .sub-title{color:var(--Gray-500, #667085);font-size:12px;font-weight:500;line-height:18px}.new1 .video-position{position:absolute;top:50%;transform:translateY(-50%)}.new1 .btn-success{border:1px solid var(--Success-700, #027A48)!important;background:var(--Success-700, #027A48)!important;box-shadow:0 1px 2px #1018280d!important}.new1 .btn.btn-success:hover:not(.btn-active),.new1 .btn.btn-success:active:not(.btn-active){border:1px solid var(--Success-700, #027A48)!important;background:var(--Success-700, #027A48)!important;box-shadow:0 1px 2px #1018280d!important}.new1 table tr{vertical-align:middle}.new1 table tr td{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:500;line-height:20px}.new1 .custom-dropdown{position:relative;width:100%;padding:10px 16px;cursor:pointer;border-radius:8px;font-size:16px;font-weight:400;line-height:20px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--Gray-50, #F9FAFB);box-shadow:0 1px 2px #1018280d}.new1 .dropdown-content{position:absolute;z-index:1;top:100%;left:0;border-radius:6px;width:100%;background:#fff;box-shadow:0 4px 6px #0000001a;display:flex}.new1 .dropdown-content1{position:absolute;z-index:1;bottom:100%;left:0;border-radius:6px;width:100%;background:#fff;box-shadow:0 4px 6px #0000001a;display:flex}.new1 .scroll-container{display:flex;width:100%}.new1 .scroll-container .item{width:100%;text-align:start}.new1 .scroll-container .items:hover,.new1 .scroll-container .tems.focus,.new1 .scroll-container .items.active{background:var(--Gray-50, #F9FAFB)}.new1 .label{position:absolute;top:-25%;color:var(--Gray-700, #344054);font-size:12px;line-height:18px}.new1 .scroll-section{width:50%;height:200px;overflow-y:auto;text-align:center;border-right:1px solid #ddd}.new1 .scroll-section:last-child{border-right:none}.new1 .scroll-section div{padding:8px;cursor:pointer}.new1 .scroll-section div.selected{background:#007bff;color:#fff}.new1 .bg-primary{border-radius:8px;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d}.new1 .bg-danger{background:var(--Primary-500, #D92D20)!important}.new1 .text-primary{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:500!important;line-height:18px!important}.new1 .text-primary1{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:500!important;line-height:18px!important;text-overflow:ellipsis;max-width:200px;overflow:hidden}.new1 .text-select{color:var(--Gray-500, #667085)!important;font-size:14.56px!important;font-weight:400;line-height:21.84px!important}.new1 .custom-tooltip-content{font-size:12px!important;text-align:left!important}.new1 ::ng-deep .tooltip-inner{max-width:500px!important;white-space:normal}.new1 .test-dark1{color:var(--Success-700, #027A48)!important;text-align:center;font-size:12px!important;font-weight:500!important;line-height:18px}.new1 .engage-text{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-transform:capitalize}.new1 .disabled{pointer-events:none;opacity:.4;cursor:not-allowed}.new1 .h-auto{height:400px!important;object-fit:fill}@media (min-width: 1920px) and (max-width: 2119px){.new1 .h-500px{height:600px!important}.new1 .h-auto{height:400px!important;object-fit:fill}}@media (min-width: 1720px) and (max-width: 1900px){.new1 .h-auto{height:400px!important;object-fit:fill}}@media (min-width: 2120px) and (max-width: 2800px){.new1 .h-auto{height:520px!important;object-fit:fill}}@media (min-width: 1330px) and (max-width: 1500px){.new1 .h-auto{height:370px!important;object-fit:fill}}.new1 .ts700px{min-height:auto!important;max-height:700px!important}\n"] }]
24017
+ args: [{ selector: "lib-eye-test", template: "<section *ngIf=\"!eyeView\" class=\"container-fluid\">\r\n<div class=\"card mb-2\">\r\n <div *ngIf=\"loading1\" 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>\r\n <form *ngIf=\"!loading1\" [formGroup]=\"eyeTestForm\">\r\n <div class=\"row\">\r\n <div class=\"col-md-12 mt-7 mb-3\">\r\n <div class=\"row px-3\">\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-2 mb-4'\" class=\"col-1 mb-4\" style=\"z-index: 33 !important;\" >\r\n <lib-reactive-select formControlName=\"dateType\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"dateType\" (itemChange)=\"dateTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-3 mb-4' : 'col-2 mb-4'\">\r\n <div class=\"position-relative\">\r\n <span style=\"top: 20%;\" class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-10 z-2\" style=\"min-width: 150px !important;\" type=\"text\"\r\n matInput ngxDaterangepickerMd [drops]=\"'down'\" [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"false\" autocomplete=\"off\"\r\n [(ngModel)]=\"selectedDateRange\" [ngModelOptions]=\"{standalone: true}\"\r\n (datesUpdated)=\"datechange($event)\" (click)=\"resetValidation()\"\r\n (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\" [autoApply]=\"true\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-2 mb-4'\" class=\"col-2 mb-4\">\r\n <lib-reactive-select formControlName=\"type\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"type\"\r\n (itemChange)=\"typeChange($event)\"></lib-reactive-select>\r\n </div>\r\n \r\n <!-- </div>\r\n </div> -->\r\n <!-- *ngIf=\"users?.role ==='superadmin'\" -->\r\n <div class=\"col-md-3\">\r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('RmList')?.value?.length)\">\r\n Select RM\r\n </div>\r\n <lib-group-select [items]=\"RmList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userName'\" (selected)=\"onRmSelect($event)\" [selectedValues]=\"eyeTestForm.get('RmList')?.value\">\r\n </lib-group-select>\r\n </div>\r\n \r\n \r\n </div>\r\n <!-- *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\" -->\r\n <div class=\"col-md-3\">\r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('ClusterList')?.value?.length)\">\r\n Select cluster\r\n </div>\r\n <lib-group-select [items]=\"ClusterList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'clusterName'\"\r\n [idField]=\"'clusterName'\" (selected)=\"ongroupSelect($event)\"\r\n [selectedValues]=\"eyeTestForm.get('ClusterList')?.value\">\r\n </lib-group-select>\r\n </div>\r\n </div>\r\n \r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-3 mb-4' : 'col-2 mb-4'\" >\r\n \r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('storeList')?.value?.length)\">\r\n Select Stores\r\n </div>\r\n <lib-stores-select [items]=\"storeList\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'storeName'\"\r\n [idField]=\"'storeId'\" (selected)=\"onStoreSelect($event)\"\r\n [selectedValues]=\"eyeTestForm.get('storeList')?.value\"></lib-stores-select>\r\n \r\n </div>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2' : 'col-2'\">\r\n <div class=\"select-wrapper mb-4\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('complianceScore')?.value?.length)\">\r\n Select Score\r\n </div>\r\n <lib-select-drop [items]=\"typePercentageArray\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'label'\"\r\n [idField]=\"'value'\" (selected)=\"typePercentageChange($event)\"\r\n [selectedValues]=\"eyeTestForm.get('complianceScore')?.value\">\r\n </lib-select-drop>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-1 mb-4\">\r\n <lib-reactive-select formControlName=\"auditType\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"auditType\"\r\n (itemChange)=\"auditTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2' : 'col-2'\">\r\n <div class=\"select-wrapper mb-4\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(eyeTestForm.get('auditStatus')?.value?.length)\">\r\n Audit Status\r\n </div>\r\n <lib-select-drop [items]=\"auditStatusArray\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'label'\"\r\n [idField]=\"'value'\" (selected)=\"typeAuditStatusChange($event)\"\r\n [selectedValues]=\"eyeTestForm.get('auditStatus')?.value\">\r\n </lib-select-drop>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-md-2\">\r\n <div class=\"mb-4\">\r\n <lib-reactive-select formControlName=\"nearAddition\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"nearAdditionArray\" (itemChange)=\"nearAdditionChange($event)\"></lib-reactive-select>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestForm.get('type')?.value !=='remote'\" class=\"col-md-2\">\r\n <div class=\"mb-4\">\r\n <lib-reactive-select formControlName=\"category\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"categoryArray\" (itemChange)=\"categoryTypeChange($event)\"></lib-reactive-select>\r\n </div>\r\n </div>\r\n <div \r\n *ngIf=\"users?.role\" \r\n class=\"text-end\"\r\n [ngClass]=\"eyeTestForm.get('type')?.value ==='remote' ? 'col-2 mb-4' : 'col-1 mb-4'\"\r\n>\r\n<!-- [ngClass]=\"getApplyButtonClass(users?.role, eyeTestForm.get('type')?.value)\" -->\r\n\r\n <a (click)=\"onSubmit();\" type=\"submit\" class=\"btn btn-sm btn-primary py-3 \">\r\n <span>Apply</span>\r\n </a>\r\n\r\n</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </form>\r\n <div *ngIf=\"showEyeTest\" class=\"ms-6 mb-3\">\r\n\r\n <h3 class=\"card-title dashed w-100 row\">\r\n <span class=\"col-10 title-text py-3\"><span class=\"mx-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\"\r\n viewBox=\"0 0 32 32\" fill=\"none\">\r\n <rect width=\"32\" height=\"32\" rx=\"16\" fill=\"#FEE4E2\" />\r\n <g clip-path=\"url(#clip0_235_24234)\">\r\n <path\r\n d=\"M16 13.3335V16.0002M16 18.6668H16.0067M22.6667 16.0002C22.6667 19.6821 19.6819 22.6668 16 22.6668C12.3181 22.6668 9.33337 19.6821 9.33337 16.0002C9.33337 12.3183 12.3181 9.3335 16 9.3335C19.6819 9.3335 22.6667 12.3183 22.6667 16.0002Z\"\r\n stroke=\"#D92D20\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_235_24234\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\" transform=\"translate(8 8)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span><span class=\"dashed-desc\">Eye test video preview is available for 30 days. Audit data\r\n remains accessible, but videos will not be retained beyond this period.</span></span>\r\n <span class=\"col-2 pt-2 text-end cursor-pointer\" (click)=\"closeEyeTest()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\">\r\n <path d=\"M25 15L15 25M15 15L25 25\" stroke=\"#667085\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n </h3>\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<!-- <div class=\"card my-3\">\r\n <div class=\"card-header border-0 py-1\">\r\n \r\n </div>\r\n</div> -->\r\n\r\n<div class=\"row\">\r\n <div *ngIf=\"users?.role ==='superadmin' && keyType ==='rm'\" class=\"col\">\r\n <div class=\"card p-2\">\r\n <div class=\"card-header ellipse1 min-h-55px py-1 px-3 d-flex justify-content-between align-items-center\">\r\n <h5 class=\"card-title my-0\">Regional Managers</h5>\r\n <span class=\"text-value\">{{RmListData ?? '--'}}</span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card mt-5 p-2\">\r\n <div class=\"card-header ellipse1 min-h-55px py-1 px-3 d-flex justify-content-between align-items-center\">\r\n <h5 class=\"card-title my-0\">Clusters</h5>\r\n <span class=\"text-value\">{{groups?.length ?? '--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"users?.role ==='superadmin' && keyType !=='rm' || users?.role ==='admin'\" class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Clusters</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ groups?.length ?? '-' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Total Tango AI Files</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.totalFiles ?? '-' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Trust Audit Completed</h5>\r\n </div>\r\n <div class=\"card-body py-3 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.completedFiles ?? '-' }}</span>\r\n\r\n </div>\r\n <div class=\"card-footer py-0 border-0 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-sub\">{{ (eyeTestCardData?.completedRatio ?? '-') + '%' }} <span\r\n class=\"test-sub\">Completed</span></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Tango Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ eyeTestCardData?.tangoScore ?? '-' }}</span>\r\n </div>\r\n <div class=\"card-footer pe-0 ps-3 py-0 border-0 d-flex justify-content-center align-items-center\">\r\n <span>\r\n <svg *ngIf=\"eyeTestCardData?.trend\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n viewBox=\"0 0 12 12\" fill=\"none\">\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\" stroke=\"#039855\" stroke-width=\"1.5\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3216_118\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <svg *ngIf=\"!eyeTestCardData?.trend\" xmlns=\"http://www.w3.org/2000/svg\" width=\"13\" height=\"12\" viewBox=\"0 0 13 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_760_9776)\">\r\n <path d=\"M11.575 9L6.82495 4.25L4.32495 6.75L0.574951 3M11.575 9H8.57495M11.575 9V6\"\r\n stroke=\"#D92D20\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_760_9776\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0.0749512)\" />\r\n </clipPath>\r\n </defs>\r\n </svg> \r\n <span class=\"text-sub ms-2\">{{ eyeTestCardData?.tangoScoreTrend !== null \r\n ? (getAbsValue(eyeTestCardData.tangoScoreTrend) | number:'1.0-0':'en-US') + '%' \r\n : '-' }}\r\n <span\r\n class=\"test-sub1\">vs previous week</span></span></span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Trust Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ (eyeTestCardData?.trustScore && eyeTestCardData?.trustScore !== 'NA' \r\n ? eyeTestCardData.trustScore + '%' \r\n : 'NA') }}</span>\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n <div class=\"col\">\r\n <div class=\"card h-100 p-2\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-3 d-flex justify-content-center align-items-center\">\r\n <h5 class=\"card-title\">Human Audited Score</h5>\r\n </div>\r\n <div class=\"card-body py-7 d-flex justify-content-center align-items-center\">\r\n <span class=\"text-value\">{{ (eyeTestCardData?.humanScore && eyeTestCardData?.humanScore !== 'NA' \r\n ? eyeTestCardData.humanScore \r\n : 'NA') }}</span>\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n \r\n</div>\r\n\r\n\r\n<div class=\"card mt-3\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span *ngIf=\"users?.role === 'superadmin' && keyType ==='rm'\" class=\"title-text mb-2\">\r\n Audit Summary\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary\">{{ totalItems }} Total</span>\r\n </span>\r\n\r\n <!-- Admin + cluster present \u2192 RM Summary -->\r\n <div class=\"d-flex\">\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='cluster' && users?.role === 'superadmin'\" (click)=\"typeVal1('rm','')\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" x=\"0\" y=\"0\" width=\"44\" height=\"44\" filterUnits=\"userSpaceOnUse\"\r\n 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"users?.role === 'admin' && keyType ==='cluster' || users?.role === 'superadmin' && keyType ==='cluster'\" class=\"title-text my-4 mb-2\">\r\n RM Summary\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary text-capitalize\">{{ eyeTestData[0]?.RMName ? eyeTestData[0]?.RMName : '' }}</span>\r\n </span>\r\n </div>\r\n\r\n <!-- All other cases \u2192 Eye Test -->\r\n <div class=\"d-flex \">\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='store' && (users?.role === 'superadmin')\"\r\n (click)=\"typeVal1('cluster',this.rmEmail)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"me-2 cursor-pointer\" *ngIf=\"keyType ==='store' && (users?.role === 'admin')\"\r\n (click)=\"typeVal1('cluster',this.groups)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"44\" height=\"44\" viewBox=\"0 0 44 44\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_745_12128)\">\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.8334 21.0003H16.1667M16.1667 21.0003L22.0001 26.8337M16.1667 21.0003L22.0001 15.167\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_745_12128\" 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\" result=\"effect1_dropShadow_745_12128\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_745_12128\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"!(users?.role === 'superadmin' && keyType ==='rm') && !(users?.role === 'superadmin' && keyType ==='cluster') \r\n && !(users?.role === 'admin' && keyType ==='cluster')\" class=\"title-text my-4 mb-2\">\r\n Eye Test\r\n <span *ngIf=\"!loading\" class=\"badge badge-light-primary\">{{ totalItems }} Total</span>\r\n </span>\r\n </div>\r\n <span *ngIf=\"users?.role ==='superadmin' && keyType ==='rm'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n <span *ngIf=\"users?.role ==='admin' && keyType ==='cluster'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n <span *ngIf=\"users?.role ==='user' && keyType ==='store'\" class=\"text-sub my-2\">Based on {{ headDate | date: 'MMM d' }} - {{\r\n headDateEnd | date: 'MMM d, y' }}</span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" 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\"></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 <input (change)=\"searchData()\" [(ngModel)]=\"searchValue\" type=\"text\" class=\"form-control ps-14 me-2\" autocomplete=\"off\"\r\n [placeholder]=\"\r\n keyType === 'rm'\r\n ? 'Search by RMName'\r\n : keyType === 'cluster'\r\n ? 'Search by Cluster'\r\n : 'Search'\r\n \" />\r\n\r\n\r\n <span class=\"cursor-pointer\" *ngIf=\"users?.role ==='superadmin'\" (click)=\"settingsView()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"45\" height=\"46\"\r\n viewBox=\"0 0 45 46\" fill=\"none\">\r\n <g filter=\"url(#filter0_d_760_9988)\">\r\n <rect x=\"2.71973\" y=\"1.98047\" width=\"40.04\" height=\"40.04\" rx=\"7.28\" fill=\"white\" />\r\n <rect x=\"3.17473\" y=\"2.43547\" width=\"39.13\" height=\"39.13\" rx=\"6.825\" stroke=\"#D0D5DD\"\r\n stroke-width=\"0.91\" />\r\n <g clip-path=\"url(#clip0_760_9988)\">\r\n <path\r\n d=\"M22.7396 24.2749C23.9961 24.2749 25.0146 23.2563 25.0146 21.9999C25.0146 20.7434 23.9961 19.7249 22.7396 19.7249C21.4832 19.7249 20.4646 20.7434 20.4646 21.9999C20.4646 23.2563 21.4832 24.2749 22.7396 24.2749Z\"\r\n stroke=\"#344054\" stroke-width=\"1.5197\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M28.3513 24.2749C28.2503 24.5036 28.2202 24.7573 28.2648 25.0033C28.3094 25.2493 28.4267 25.4763 28.6015 25.655L28.647 25.7005C28.788 25.8414 28.8999 26.0087 28.9762 26.1928C29.0526 26.3769 29.0919 26.5743 29.0919 26.7736C29.0919 26.9729 29.0526 27.1703 28.9762 27.3544C28.8999 27.5385 28.788 27.7058 28.647 27.8466C28.5062 27.9876 28.3389 28.0995 28.1548 28.1758C27.9707 28.2522 27.7733 28.2914 27.574 28.2914C27.3747 28.2914 27.1773 28.2522 26.9932 28.1758C26.8091 28.0995 26.6418 27.9876 26.5009 27.8466L26.4554 27.8011C26.2767 27.6263 26.0497 27.509 25.8037 27.4644C25.5577 27.4198 25.304 27.4499 25.0753 27.5509C24.851 27.647 24.6597 27.8066 24.525 28.0101C24.3902 28.2135 24.3179 28.4519 24.3169 28.696V28.8249C24.3169 29.2271 24.1572 29.6129 23.8727 29.8973C23.5883 30.1817 23.2025 30.3415 22.8003 30.3415C22.398 30.3415 22.0123 30.1817 21.7278 29.8973C21.4434 29.6129 21.2836 29.2271 21.2836 28.8249V28.7566C21.2777 28.5056 21.1965 28.2622 21.0504 28.058C20.9044 27.8538 20.7003 27.6982 20.4646 27.6115C20.2359 27.5106 19.9822 27.4805 19.7362 27.5251C19.4902 27.5697 19.2632 27.687 19.0844 27.8618L19.0389 27.9073C18.8981 28.0483 18.7308 28.1602 18.5467 28.2365C18.3626 28.3128 18.1652 28.3521 17.9659 28.3521C17.7666 28.3521 17.5692 28.3128 17.3851 28.2365C17.201 28.1602 17.0337 28.0483 16.8929 27.9073C16.7519 27.7664 16.64 27.5992 16.5637 27.415C16.4873 27.2309 16.448 27.0336 16.448 26.8342C16.448 26.6349 16.4873 26.4376 16.5637 26.2535C16.64 26.0693 16.7519 25.9021 16.8929 25.7612L16.9384 25.7157C17.1132 25.537 17.2305 25.31 17.2751 25.064C17.3197 24.818 17.2896 24.5643 17.1886 24.3355C17.0925 24.1112 16.9329 23.92 16.7294 23.7852C16.526 23.6505 16.2876 23.5782 16.0435 23.5772H15.9146C15.5124 23.5772 15.1266 23.4174 14.8422 23.133C14.5577 22.8486 14.3979 22.4628 14.3979 22.0605C14.3979 21.6583 14.5577 21.2725 14.8422 20.9881C15.1266 20.7037 15.5124 20.5439 15.9146 20.5439H15.9829C16.2339 20.538 16.4773 20.4568 16.6815 20.3107C16.8857 20.1646 17.0413 19.9605 17.1279 19.7249C17.2289 19.4961 17.259 19.2424 17.2144 18.9964C17.1698 18.7504 17.0525 18.5234 16.8777 18.3447L16.8322 18.2992C16.6912 18.1583 16.5793 17.9911 16.503 17.807C16.4267 17.6228 16.3874 17.4255 16.3874 17.2262C16.3874 17.0268 16.4267 16.8295 16.503 16.6454C16.5793 16.4612 16.6912 16.294 16.8322 16.1531C16.9731 16.0121 17.1403 15.9002 17.3244 15.8239C17.5086 15.7476 17.7059 15.7083 17.9052 15.7083C18.1046 15.7083 18.3019 15.7476 18.486 15.8239C18.6702 15.9002 18.8374 16.0121 18.9783 16.1531L19.0238 16.1986C19.2025 16.3734 19.4295 16.4907 19.6755 16.5353C19.9215 16.5799 20.1752 16.5498 20.4039 16.4489H20.4646C20.6889 16.3527 20.8802 16.1931 21.0149 15.9897C21.1497 15.7862 21.222 15.5478 21.2229 15.3038V15.1749C21.2229 14.7726 21.3827 14.3869 21.6672 14.1024C21.9516 13.818 22.3374 13.6582 22.7396 13.6582C23.1419 13.6582 23.5276 13.818 23.8121 14.1024C24.0965 14.3869 24.2563 14.7726 24.2563 15.1749V15.2431C24.2573 15.4871 24.3296 15.7256 24.4643 15.929C24.599 16.1325 24.7903 16.2921 25.0146 16.3882C25.2433 16.4891 25.4971 16.5193 25.7431 16.4747C25.9891 16.4301 26.2161 16.3128 26.3948 16.138L26.4403 16.0925C26.5811 15.9514 26.7484 15.8396 26.9325 15.7632C27.1167 15.6869 27.314 15.6476 27.5133 15.6476C27.7126 15.6476 27.91 15.6869 28.0941 15.7632C28.2782 15.8396 28.4455 15.9514 28.5864 16.0925C28.7274 16.2333 28.8392 16.4006 28.9156 16.5847C28.9919 16.7688 29.0312 16.9662 29.0312 17.1655C29.0312 17.3648 28.9919 17.5622 28.9156 17.7463C28.8392 17.9304 28.7274 18.0977 28.5864 18.2385L28.5409 18.284C28.366 18.4628 28.2488 18.6898 28.2042 18.9358C28.1596 19.1818 28.1897 19.4355 28.2906 19.6642V19.7249C28.3867 19.9492 28.5464 20.1404 28.7498 20.2752C28.9533 20.4099 29.1917 20.4822 29.4357 20.4832H29.5646C29.9669 20.4832 30.3526 20.643 30.6371 20.9274C30.9215 21.2119 31.0813 21.5976 31.0813 21.9999C31.0813 22.4021 30.9215 22.7879 30.6371 23.0723C30.3526 23.3567 29.9669 23.5165 29.5646 23.5165H29.4964C29.2523 23.5175 29.0139 23.5898 28.8105 23.7246C28.607 23.8593 28.4474 24.0506 28.3513 24.2749Z\"\r\n stroke=\"#344054\" stroke-width=\"1.5197\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_760_9988\" x=\"0.719727\" y=\"0.980469\" width=\"44.04\" height=\"44.04\"\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_760_9988\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_760_9988\"\r\n result=\"shape\" />\r\n </filter>\r\n <clipPath id=\"clip0_760_9988\">\r\n <rect width=\"18.2\" height=\"18.2\" fill=\"white\"\r\n transform=\"translate(13.6396 12.9004)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n\r\n <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"19\" height=\"20\" viewBox=\"0 0 19 20\" fill=\"none\">\r\n <path d=\"M7.53369 12.8441H15.0241L13.5568 14.3172L14.3587 15.1191L17.2024 12.2754L14.3587 9.43164L13.5568 10.2336L15.0241 11.7066H7.53369V12.8441Z\" fill=\"black\"/>\r\n <path d=\"M12.6526 8.8631V6.5881C12.653 6.51325 12.6387 6.43904 12.6104 6.36975C12.5821 6.30045 12.5404 6.23743 12.4877 6.18428L8.5064 2.20303C8.45326 2.15032 8.39023 2.10862 8.32094 2.08031C8.25164 2.05201 8.17744 2.03766 8.10259 2.0381H2.41509C2.1134 2.0381 1.82408 2.15794 1.61075 2.37126C1.39743 2.58458 1.27759 2.87391 1.27759 3.1756V16.8256C1.27759 17.1273 1.39743 17.4166 1.61075 17.6299C1.82408 17.8433 2.1134 17.9631 2.41509 17.9631H11.5151C11.8168 17.9631 12.1061 17.8433 12.3194 17.6299C12.5327 17.4166 12.6526 17.1273 12.6526 16.8256V15.6881H11.5151V16.8256H2.41509V3.1756H6.96509V6.5881C6.96509 6.88978 7.08493 7.17911 7.29826 7.39243C7.51158 7.60575 7.80091 7.7256 8.10259 7.7256H11.5151V8.8631H12.6526ZM8.10259 6.5881V3.40878L11.2819 6.5881H8.10259Z\" fill=\"black\"/>\r\n</svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"loading\" 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 <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata-table\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this eye test table</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!noData && !loading\" class=\"card-body\">\r\n <div class=\"table-responsive\">\r\n <table *ngIf=\"keyType ==='store'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('date')\"> Date <svg\r\n [ngClass]=\"sortedColumn === 'date' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'date' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('auditedDate')\">Audited Date <svg\r\n [ngClass]=\"sortedColumn === 'auditedDate' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'auditedDate' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th *ngIf=\"users?.role ==='superadmin'\" class=\"text-start\">\r\n RM Name\r\n </th>\r\n <th *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\" class=\"text-start\">\r\n Cluster Name\r\n </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name <svg\r\n [ngClass]=\"sortedColumn === 'storeName' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storeName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID <svg\r\n [ngClass]=\"sortedColumn === 'storeId' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'storeId' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th *ngIf=\"this.typeValue ==='remote'\" class=\"text-start\">Engagement ID</th>\r\n <th class=\"text-start\">Optom ID</th>\r\n <th class=\"text-start\">Optom Email ID</th>\r\n <th *ngIf=\"this.typeValue ==='remote'\" class=\"text-start\">Optom Name</th>\r\n <th *ngIf=\"this.typeValue !=='remote'\" class=\"text-start\">Queue ID</th>\r\n <th *ngIf=\"this.typeValue !=='remote'\" class=\"text-start\">Power Types</th>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('ComplianceScore')\">Tango Score <svg\r\n [ngClass]=\"sortedColumn === 'ComplianceScore' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'ComplianceScore' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> \r\n </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('coveredStepsAI')\">Steps Covered By AI <svg\r\n [ngClass]=\"sortedColumn === 'coveredStepsAI' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'coveredStepsAI' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('trustScore')\">Trust Score <svg\r\n [ngClass]=\"sortedColumn === 'trustScore' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'trustScore' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n\r\n<th><span class=\"cursor-pointer\" (click)=\"onSort('auditedSteps')\">Steps Covered By Human <svg\r\n [ngClass]=\"sortedColumn === 'auditedSteps' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'auditedSteps' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th>Human Audited Score</th>\r\n\r\n \r\n\r\n <th *ngIf=\"this.typeValue !=='remote'\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('visitorsType')\">Visitor Type <svg\r\n [ngClass]=\"sortedColumn === 'visitorsType' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'visitorsType' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th class=\"text-start\">Test Duration</th>\r\n <th class=\"text-start\" *ngIf=\"this.typeValue !=='remote'\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('comment')\">Eye Test Status <svg\r\n [ngClass]=\"sortedColumn === 'comment' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'comment' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th class=\"text-start\"><span class=\"cursor-pointer\"\r\n (click)=\"onSort('subComment')\">Comments <svg\r\n [ngClass]=\"sortedColumn === 'subComment' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'subComment' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th><span class=\"cursor-pointer\" (click)=\"onSort('auditStatus')\">Audit Status <svg\r\n [ngClass]=\"sortedColumn === 'auditStatus' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'auditStatus' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th class=\"text-start\">Audited By</th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.date | date:'dd MMM, yyyy'}}</td>\r\n <td>{{obj?.auditedDate}}</td>\r\n <td *ngIf=\"users?.role === 'superadmin'\">\r\n <ng-container *ngIf=\"obj?.RMName\">\r\n <!-- Split and show the first value -->\r\n {{ obj.RMName.split(',')[0] }}\r\n\r\n <!-- Show +N badge if more values exist -->\r\n <span *ngIf=\"obj.RMName.split(',').length > 1\" class=\"badge badge-light-default ms-2\">\r\n +{{ obj.RMName.split(',').length - 1 }}\r\n </span>\r\n </ng-container>\r\n</td>\r\n\r\n <td *ngIf=\"users?.role ==='superadmin' || users?.role ==='admin'\">\r\n <ng-container *ngIf=\"obj?.clusterName\">\r\n {{ obj.clusterName.split(',')[0] }}\r\n <span *ngIf=\"obj.clusterName.split(',').length > 1\" class=\"badge badge-light-default ms-2\">\r\n +{{ obj.clusterName.split(',').length - 1 }}\r\n </span>\r\n </ng-container>\r\n \r\n \r\n </td>\r\n <td>{{obj?.storeName}}</td>\r\n <td>{{obj?.storeId}}</td>\r\n <td *ngIf=\"this.typeValue ==='remote'\" class=\"engage-text\">{{obj?.engagementId}}</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\">{{obj?.optumId ? obj?.optumId :''}}\r\n <td *ngIf=\"this.typeValue ==='remote'\">{{obj?.optm_userId ? obj?.optm_userId :''}}\r\n <td *ngIf=\"this.typeValue !=='remote'\">{{obj?.salesmanEmailId ? obj?.salesmanEmailId :''}}\r\n <td *ngIf=\"this.typeValue =='remote'\">{{obj?.userEmail ? obj?.userEmail :''}}\r\n <td *ngIf=\"this.typeValue ==='remote'\">{{obj?.displayName ? obj?.displayName :''}}\r\n </td>\r\n <td *ngIf=\"this.typeValue !=='remote'\" class=\"engage-text\">{{obj?.queueId ?\r\n obj?.queueId:''}}</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\" >{{obj?.nearAddition ?\r\n obj?.nearAddition == \"true\"? \"With Near Addition\" :\"Without Near Addition\":'--'}}</td>\r\n <td>\r\n {{ obj?.complianceScore ?? '--' }}\r\n</td>\r\n<td>{{obj?.coveredStepsAI ? obj?.coveredStepsAI:'--'}}</td>\r\n <td>{{obj?.trustScore ?? '--'}}</td>\r\n <td>{{obj?.auditedSteps ? obj?.auditedSteps:'--'}}</td>\r\n <td>{{obj?.humanComplianceScore ? obj?.humanComplianceScore :'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"this.typeValue !=='remote'\">{{obj?.visitorsType ?\r\n obj?.visitorsType:'--'}}</td>\r\n <td>{{obj?.min ? obj?.min :'0'}} mins {{obj?.sec ?\r\n obj?.sec:'0'}} secs</td>\r\n <td *ngIf=\"this.typeValue !=='remote'\">\r\n <span \r\n class=\"badge\" \r\n [ngClass]=\"obj?.comment ? 'badge-light-danger' : 'badge-light-success'\">\r\n {{ obj?.comment ? 'Fake' : 'Genuine' }}\r\n </span>\r\n</td>\r\n <td>{{obj?.subComment ? obj?.subComment:'--'}}</td>\r\n <td><span class=\"badge badge-light-primary\"\r\n *ngIf=\"obj?.auditStatus ==='Yet-to-Audit'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-warning\"\r\n *ngIf=\"obj?.auditStatus ==='Re-Audited'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-success\"\r\n *ngIf=\"obj?.auditStatus ==='Audited'\">{{obj?.auditStatus}}</span>\r\n <span class=\"badge badge-light-info\"\r\n *ngIf=\"obj?.auditStatus ==='In-Progress'\">{{obj?.auditStatus}}</span>\r\n </td>\r\n <td>{{obj?.auditedBy?obj?.auditedBy:\"-\"}}</td>\r\n <td class=\"cursor-pointer\" (click)=\"eyeTestView(obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <table *ngIf=\"keyType ==='rm'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('RMName')\"> RM Name <svg\r\n [ngClass]=\"sortedColumn === 'RMName' && sortOrder === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" 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]=\"sortedColumn === 'RMName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('clusterCount')\"> Clusters Count <svg\r\n [ngClass]=\"sortedColumn === 'clusterCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'clusterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('storesCount')\">Stores Count <svg\r\n [ngClass]=\"sortedColumn === 'storesCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n Total Tango AI Files\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Audit Completed \r\n </th>\r\n <th class=\"text-start\">\r\n Tango Score \r\n </th>\r\n <th class=\"text-start\">\r\n Trust Score \r\n </th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.RMName ? obj?.RMName:'--'}}</td>\r\n <td>{{obj?.clusterCount ? obj?.clusterCount:'--'}}</td>\r\n <td>{{obj?.storesCount ? obj?.storesCount:'--'}}</td>\r\n <td>{{obj?.totalFiles ?? '--'}}</td>\r\n <td>{{obj?.completedFiles ?? '--'}}</td>\r\n <td>{{obj.complianceScore ?? '--'}}\r\n \r\n</td>\r\n<td>\r\n {{ obj?.trustScore ?? '--' }}\r\n</td>\r\n <td class=\"cursor-pointer\" (click)=\"typeVal('cluster',obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <table *ngIf=\"keyType ==='cluster'\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n \r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('clusterName')\"> Clusters Name <svg\r\n [ngClass]=\"sortedColumn === 'clusterName' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'clusterName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n\r\n <th class=\"text-start\">\r\n <span class=\"cursor-pointer\" (click)=\"onSort('storesCount')\">Stores Count <svg\r\n [ngClass]=\"sortedColumn === 'storesCount' && sortOrder === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" 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]=\"sortedColumn === 'storesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"text-start\">\r\n Total Tango AI Files\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Audit Completed\r\n </th>\r\n <th class=\"text-start\">\r\n Tango Score\r\n </th>\r\n <th class=\"text-start\">\r\n Trust Score\r\n </th>\r\n <th class=\"text-start\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of eyeTestData; let i=index;\">\r\n <td>{{obj?.clusterName ? obj?.clusterName:'--'}}</td>\r\n <td>{{obj?.storesCount ? obj?.storesCount:'--'}}</td>\r\n <td>{{obj?.totalFiles ?? '--'}}</td>\r\n <td>{{obj?.completedFiles ?? '--'}}</td>\r\n <td>\r\n {{ obj?.complianceScore ?? '--' }}\r\n</td>\r\n<td>\r\n {{ obj?.trustScore ?? '--' }}\r\n</td>\r\n <td class=\"cursor-pointer\" (click)=\"typeVal('store',obj)\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n </div>\r\n </div>\r\n <div class=\"card-footer\" *ngIf=\"!noData && !loading\">\r\n <lib-pagination [itemsPerPage]=\"pageSize\" [currentPage]=\"offset\" [totalItems]=\"totalItems\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n</div>\r\n</section>\r\n\r\n\r\n<section *ngIf=\"eyeView\" class=\"container-fluid new1 mt-4\">\r\n<div class=\"card p-5\">\r\n <div class=\"d-flex align-items-center\">\r\n <div (click)=\"backNavigation()\" class=\"btn btn-am btn-outline p-3\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15.8332 9.99984H4.1665M4.1665 9.99984L9.99984 15.8332M4.1665 9.99984L9.99984 4.1665\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </div>\r\n <span *ngIf=\"currentAuditType !== 'remote'\" class=\"ms-3 badge badge-light-default\">{{auditDetails?.optumId}}</span> \r\n <span *ngIf=\"currentAuditType === 'remote'\" class=\"ms-3 badge badge-light-default\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M10 10.5V9.5C10 8.96957 9.78929 8.46086 9.41421 8.08579C9.03914 7.71071 8.53043 7.5 8 7.5H4C3.46957 7.5 2.96086 7.71071 2.58579 8.08579C2.21071 8.46086 2 8.96957 2 9.5V10.5M8 3.5C8 4.60457 7.10457 5.5 6 5.5C4.89543 5.5 4 4.60457 4 3.5C4 2.39543 4.89543 1.5 6 1.5C7.10457 1.5 8 2.39543 8 3.5Z\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>{{auditDetails?.displayName ? auditDetails?.displayName:'--'}}</span> \r\n <span class=\"d-flex ms-1 align-items-center\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"\" opacity=\"0.1\"></rect>\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"\" stroke-width=\"6\"></rect>\r\n <path d=\"M15.6799 18.8039L15.6267 18.8871C15.0686 19.8741 15.6644 21.1215 16.7361 21.2646C16.8331 21.2765 16.9235 21.2828 17.0118 21.2828C17.5899 21.2828 18.1011 21.0348 18.4574 20.648L19.0107 20.0474L19.5621 20.6498C19.9141 21.0342 20.4241 21.2828 21.0061 21.2828C21.5856 21.2828 22.0985 21.0338 22.4502 20.6498L23.0033 20.0455L23.5565 20.6498C23.9081 21.0338 24.4211 21.2828 25.0005 21.2828C25.58 21.2828 26.0929 21.0338 26.4445 20.6498L26.9977 20.0455L27.5509 20.6498C27.9025 21.0338 28.4155 21.2828 28.9949 21.2828C29.0803 21.2828 29.1733 21.2765 29.2697 21.2647C30.3649 21.1154 30.9627 19.8012 30.324 18.8044C30.324 18.8043 30.324 18.8043 30.3239 18.8042L28.5658 16.0628L28.5658 16.0628L28.5648 16.0614C28.5496 16.0375 28.5121 16.012 28.465 16.012H17.5356C17.4884 16.012 17.4509 16.0375 17.4357 16.0614L17.4351 16.0623L15.6799 18.8039ZM28.6514 23.7372V26.8691V27.6191H27.9014H18.0992H17.3492V26.8691V23.7376C17.239 23.7458 17.1274 23.7501 17.0148 23.7501C16.9725 23.7501 16.9305 23.7494 16.8888 23.7482V26.8691V28.8036C16.8888 29.4471 17.4227 29.9882 18.0992 29.9882H27.9014C28.5779 29.9882 29.1118 29.4471 29.1118 28.8036V26.8691V23.7484C29.072 23.7495 29.032 23.7501 28.9918 23.7501C28.8774 23.7501 28.7639 23.7457 28.6514 23.7372Z\" stroke=\"#000000\" stroke-width=\"1.5\"></path></svg> \r\n <span class=\"ms-1 sub-title\"> {{auditDetails.storeName}}</span>\r\n </span>\r\n\r\n \r\n <!-- displayName -->\r\n <div *ngIf=\"currentAuditType !== 'remote'\" class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M5.25021 6.50028C5.91329 6.50028 6.54921 6.23689 7.01807 5.76807C7.48694 5.29924 7.75035 4.66337 7.75035 4.00035C7.75035 3.33732 7.48694 2.70146 7.01807 2.23263C6.54921 1.7638 5.91329 1.50042 5.25021 1.50042C4.58713 1.50042 3.95121 1.7638 3.48234 2.23263C3.01348 2.70146 2.75007 3.33732 2.75007 4.00035C2.75007 4.66337 3.01348 5.29924 3.48234 5.76807C3.95121 6.23689 4.58713 6.50028 5.25021 6.50028ZM5.25021 5.25031C4.91867 5.25031 4.60071 5.11862 4.36628 4.88421C4.13184 4.64979 4.00014 4.33186 4.00014 4.00035C4.00014 3.66884 4.13184 3.3509 4.36628 3.11649C4.60071 2.88207 4.91867 2.75038 5.25021 2.75038C5.58175 2.75038 5.89971 2.88207 6.13414 3.11649C6.36857 3.3509 6.50028 3.66884 6.50028 4.00035C6.50028 4.33186 6.36857 4.64979 6.13414 4.88421C5.89971 5.11862 5.58175 5.25031 5.25021 5.25031ZM1.5 8.79188C1.5 7.9869 2.15337 7.33359 2.95841 7.33359H7.542C8.34705 7.33359 9.00042 7.9869 9.00042 8.79188V12.7501C9.00042 13.7446 8.60531 14.6984 7.90201 15.4017C7.1987 16.1049 6.24483 16.5 5.25021 16.5C4.25559 16.5 3.30171 16.1049 2.59841 15.4017C1.89511 14.6984 1.5 13.7446 1.5 12.7501V8.79188ZM2.95841 8.58355C2.90316 8.58355 2.85016 8.6055 2.81109 8.64457C2.77202 8.68364 2.75007 8.73663 2.75007 8.79188V12.7501C2.75007 13.4131 3.01348 14.049 3.48234 14.5178C3.95121 14.9867 4.58713 15.25 5.25021 15.25C5.91329 15.25 6.54921 14.9867 7.01807 14.5178C7.48694 14.049 7.75035 13.4131 7.75035 12.7501V8.79188C7.75035 8.73663 7.7284 8.68364 7.68932 8.64457C7.65025 8.6055 7.59726 8.58355 7.542 8.58355H2.95841ZM7.77285 6.17862C8.15328 6.39267 8.58313 6.5034 9.01963 6.49978C9.45614 6.49616 9.8841 6.37832 10.2609 6.15799C10.6378 5.93766 10.9503 5.62252 11.1675 5.24391C11.3848 4.8653 11.499 4.43642 11.499 3.99993C11.499 3.56344 11.3848 3.13456 11.1675 2.75595C10.9503 2.37734 10.6378 2.0622 10.2609 1.84187C9.8841 1.62154 9.45614 1.50371 9.01963 1.50009C8.58313 1.49647 8.15328 1.60719 7.77285 1.82124C8.04536 2.13623 8.25954 2.50289 8.39955 2.90454C8.58991 2.80026 8.80415 2.74733 9.02118 2.75097C9.23821 2.75462 9.45055 2.81471 9.63731 2.92533C9.82406 3.03594 9.97879 3.19328 10.0863 3.38185C10.1937 3.57042 10.2503 3.78372 10.2503 4.00076C10.2503 4.21781 10.1937 4.43111 10.0863 4.61968C9.97879 4.80825 9.82406 4.96558 9.63731 5.0762C9.45055 5.18682 9.23821 5.24691 9.02118 5.25055C8.80415 5.2542 8.58991 5.20127 8.39955 5.09698C8.26074 5.49382 8.0481 5.86082 7.77285 6.17862ZM8.05036 16.3783C8.35483 16.4583 8.67151 16.4989 9.00042 16.5C9.99503 16.5 10.9489 16.1049 11.6522 15.4017C12.3555 14.6984 12.7506 13.7446 12.7506 12.7501V8.79188C12.7506 8.40512 12.597 8.03419 12.3235 7.76071C12.05 7.48723 11.679 7.33359 11.2922 7.33359H9.30877C9.59462 7.67941 9.78046 8.11107 9.8238 8.58355H11.2905C11.3458 8.58355 11.3988 8.6055 11.4379 8.64457C11.4769 8.68364 11.4989 8.73663 11.4989 8.79188V12.7501C11.4989 13.3968 11.2483 14.0184 10.7996 14.4843C10.351 14.9501 9.73925 15.224 9.09292 15.2484C8.81041 15.6817 8.45872 16.0633 8.05036 16.3783ZM11.5222 6.17862C11.9027 6.39267 12.3325 6.5034 12.769 6.49978C13.2055 6.49616 13.6335 6.37832 14.0103 6.15799C14.3871 5.93766 14.6997 5.62252 14.9169 5.24391C15.1341 4.8653 15.2484 4.43642 15.2484 3.99993C15.2484 3.56344 15.1341 3.13456 14.9169 2.75595C14.6997 2.37734 14.3871 2.0622 14.0103 1.84187C13.6335 1.62154 13.2055 1.50371 12.769 1.50009C12.3325 1.49647 11.9027 1.60719 11.5222 1.82124C11.7947 2.13623 12.0089 2.50289 12.1489 2.90454C12.3393 2.80026 12.5535 2.74733 12.7706 2.75097C12.9876 2.75462 13.1999 2.81471 13.3867 2.92533C13.5734 3.03594 13.7282 3.19328 13.8356 3.38185C13.9431 3.57042 13.9996 3.78372 13.9996 4.00076C13.9996 4.21781 13.9431 4.43111 13.8356 4.61968C13.7282 4.80825 13.5734 4.96558 13.3867 5.0762C13.1999 5.18682 12.9876 5.24691 12.7706 5.25055C12.5535 5.2542 12.3393 5.20127 12.1489 5.09698C12.0101 5.49382 11.7975 5.86082 11.5222 6.17862ZM11.7997 16.3783C12.1042 16.4583 12.4209 16.4989 12.7498 16.5C13.7444 16.5 14.6983 16.1049 15.4016 15.4017C16.1049 14.6984 16.5 13.7446 16.5 12.7501V8.79188C16.5 8.40526 16.3465 8.03447 16.0731 7.76101C15.7998 7.48755 15.4291 7.33381 15.0424 7.33359H13.059C13.3448 7.67941 13.5315 8.11107 13.574 8.58355H15.0408C15.096 8.58355 15.149 8.6055 15.1881 8.64457C15.2271 8.68364 15.2491 8.73663 15.2491 8.79188V12.7501C15.2491 13.3968 14.9985 14.0184 14.5498 14.4843C14.1012 14.9501 13.4895 15.224 12.8431 15.2484C12.5606 15.6817 12.2081 16.0633 11.7997 16.3783Z\"\r\n fill=\"#667085\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.queueId}}</span>\r\n </div>\r\n <div *ngIf=\"currentAuditType === 'remote'\" class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M5.25021 6.50028C5.91329 6.50028 6.54921 6.23689 7.01807 5.76807C7.48694 5.29924 7.75035 4.66337 7.75035 4.00035C7.75035 3.33732 7.48694 2.70146 7.01807 2.23263C6.54921 1.7638 5.91329 1.50042 5.25021 1.50042C4.58713 1.50042 3.95121 1.7638 3.48234 2.23263C3.01348 2.70146 2.75007 3.33732 2.75007 4.00035C2.75007 4.66337 3.01348 5.29924 3.48234 5.76807C3.95121 6.23689 4.58713 6.50028 5.25021 6.50028ZM5.25021 5.25031C4.91867 5.25031 4.60071 5.11862 4.36628 4.88421C4.13184 4.64979 4.00014 4.33186 4.00014 4.00035C4.00014 3.66884 4.13184 3.3509 4.36628 3.11649C4.60071 2.88207 4.91867 2.75038 5.25021 2.75038C5.58175 2.75038 5.89971 2.88207 6.13414 3.11649C6.36857 3.3509 6.50028 3.66884 6.50028 4.00035C6.50028 4.33186 6.36857 4.64979 6.13414 4.88421C5.89971 5.11862 5.58175 5.25031 5.25021 5.25031ZM1.5 8.79188C1.5 7.9869 2.15337 7.33359 2.95841 7.33359H7.542C8.34705 7.33359 9.00042 7.9869 9.00042 8.79188V12.7501C9.00042 13.7446 8.60531 14.6984 7.90201 15.4017C7.1987 16.1049 6.24483 16.5 5.25021 16.5C4.25559 16.5 3.30171 16.1049 2.59841 15.4017C1.89511 14.6984 1.5 13.7446 1.5 12.7501V8.79188ZM2.95841 8.58355C2.90316 8.58355 2.85016 8.6055 2.81109 8.64457C2.77202 8.68364 2.75007 8.73663 2.75007 8.79188V12.7501C2.75007 13.4131 3.01348 14.049 3.48234 14.5178C3.95121 14.9867 4.58713 15.25 5.25021 15.25C5.91329 15.25 6.54921 14.9867 7.01807 14.5178C7.48694 14.049 7.75035 13.4131 7.75035 12.7501V8.79188C7.75035 8.73663 7.7284 8.68364 7.68932 8.64457C7.65025 8.6055 7.59726 8.58355 7.542 8.58355H2.95841ZM7.77285 6.17862C8.15328 6.39267 8.58313 6.5034 9.01963 6.49978C9.45614 6.49616 9.8841 6.37832 10.2609 6.15799C10.6378 5.93766 10.9503 5.62252 11.1675 5.24391C11.3848 4.8653 11.499 4.43642 11.499 3.99993C11.499 3.56344 11.3848 3.13456 11.1675 2.75595C10.9503 2.37734 10.6378 2.0622 10.2609 1.84187C9.8841 1.62154 9.45614 1.50371 9.01963 1.50009C8.58313 1.49647 8.15328 1.60719 7.77285 1.82124C8.04536 2.13623 8.25954 2.50289 8.39955 2.90454C8.58991 2.80026 8.80415 2.74733 9.02118 2.75097C9.23821 2.75462 9.45055 2.81471 9.63731 2.92533C9.82406 3.03594 9.97879 3.19328 10.0863 3.38185C10.1937 3.57042 10.2503 3.78372 10.2503 4.00076C10.2503 4.21781 10.1937 4.43111 10.0863 4.61968C9.97879 4.80825 9.82406 4.96558 9.63731 5.0762C9.45055 5.18682 9.23821 5.24691 9.02118 5.25055C8.80415 5.2542 8.58991 5.20127 8.39955 5.09698C8.26074 5.49382 8.0481 5.86082 7.77285 6.17862ZM8.05036 16.3783C8.35483 16.4583 8.67151 16.4989 9.00042 16.5C9.99503 16.5 10.9489 16.1049 11.6522 15.4017C12.3555 14.6984 12.7506 13.7446 12.7506 12.7501V8.79188C12.7506 8.40512 12.597 8.03419 12.3235 7.76071C12.05 7.48723 11.679 7.33359 11.2922 7.33359H9.30877C9.59462 7.67941 9.78046 8.11107 9.8238 8.58355H11.2905C11.3458 8.58355 11.3988 8.6055 11.4379 8.64457C11.4769 8.68364 11.4989 8.73663 11.4989 8.79188V12.7501C11.4989 13.3968 11.2483 14.0184 10.7996 14.4843C10.351 14.9501 9.73925 15.224 9.09292 15.2484C8.81041 15.6817 8.45872 16.0633 8.05036 16.3783ZM11.5222 6.17862C11.9027 6.39267 12.3325 6.5034 12.769 6.49978C13.2055 6.49616 13.6335 6.37832 14.0103 6.15799C14.3871 5.93766 14.6997 5.62252 14.9169 5.24391C15.1341 4.8653 15.2484 4.43642 15.2484 3.99993C15.2484 3.56344 15.1341 3.13456 14.9169 2.75595C14.6997 2.37734 14.3871 2.0622 14.0103 1.84187C13.6335 1.62154 13.2055 1.50371 12.769 1.50009C12.3325 1.49647 11.9027 1.60719 11.5222 1.82124C11.7947 2.13623 12.0089 2.50289 12.1489 2.90454C12.3393 2.80026 12.5535 2.74733 12.7706 2.75097C12.9876 2.75462 13.1999 2.81471 13.3867 2.92533C13.5734 3.03594 13.7282 3.19328 13.8356 3.38185C13.9431 3.57042 13.9996 3.78372 13.9996 4.00076C13.9996 4.21781 13.9431 4.43111 13.8356 4.61968C13.7282 4.80825 13.5734 4.96558 13.3867 5.0762C13.1999 5.18682 12.9876 5.24691 12.7706 5.25055C12.5535 5.2542 12.3393 5.20127 12.1489 5.09698C12.0101 5.49382 11.7975 5.86082 11.5222 6.17862ZM11.7997 16.3783C12.1042 16.4583 12.4209 16.4989 12.7498 16.5C13.7444 16.5 14.6983 16.1049 15.4016 15.4017C16.1049 14.6984 16.5 13.7446 16.5 12.7501V8.79188C16.5 8.40526 16.3465 8.03447 16.0731 7.76101C15.7998 7.48755 15.4291 7.33381 15.0424 7.33359H13.059C13.3448 7.67941 13.5315 8.11107 13.574 8.58355H15.0408C15.096 8.58355 15.149 8.6055 15.1881 8.64457C15.2271 8.68364 15.2491 8.73663 15.2491 8.79188V12.7501C15.2491 13.3968 14.9985 14.0184 14.5498 14.4843C14.1012 14.9501 13.4895 15.224 12.8431 15.2484C12.5606 15.6817 12.2081 16.0633 11.7997 16.3783Z\"\r\n fill=\"#667085\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.engagementId ?auditDetails?.engagementId:'--'}}</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" 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\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{currentAuditType | titlecase}} Eye Test</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" 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\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.fileDate | date: 'dd/MM/YYYY'}}</span>\r\n </div>\r\n <div class=\"d-flex ms-3 align-items-center\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_166_55019)\">\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\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_166_55019\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"ms-2 sub-title\">{{auditDetails?.testStartTime}} {{auditDetails?.testStartTime?.split(':')[0]>12?'PM':'AM'}} - {{auditDetails?.testEndTime}} {{auditDetails?.testEndTime?.split(':')[0]>12?'PM':'AM'}}\r\n ({{auditDetails?.testDuration}} Mins)</span>\r\n </div>\r\n <span class=\"ms-3 badge badge-light-primary\">{{auditDetails?.visitorsType | titlecase}}</span>\r\n <div *ngIf=\"['Yet-to-Audit'].includes(auditDetails?.auditStatus)\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-primary\" style=\"font-size: 14px;\">\r\n Yet to Audit\r\n </div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Audited'\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-success\" style=\"font-size: 14px;\">\r\n Audited\r\n </div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Audited' || auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Re-Audited'\"\r\n class=\"text-white ms-3 px-3 py-1 fw-semibold rounded-3 cursor-pointer bg-warning\" style=\"font-size: 14px;\">\r\n Re-Audited\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"row mt-3\">\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 text-center header-card\">\r\n AI Verified Steps <span><svg ngbTooltip=\"Number of steps detected and validated automatically without manual review.\" placement=\"right\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" \r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.coveredStepsAI?auditDetails?.coveredStepsAI:0}}/{{auditDetails?.totalSteps ? auditDetails?.totalSteps:'--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 text-center header-card\">\r\n Human Verified Steps <span><svg ngbTooltip=\"Number of steps that required human validation to ensure compliance and accuracy.\" placement=\"right\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.auditedSteps?auditDetails?.auditedSteps:0}}/{{auditDetails?.totalSteps ? auditDetails?.totalSteps:'--'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 header-card\">\r\n AI Compliance Score <span><svg ngbTooltip=\"Measures the percentage of steps AI flagged as compliant without human intervention.\" placement=\"left\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.complianceScore ?auditDetails?.complianceScore : 0}}%</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"card p-3 fw-bold text-center\">\r\n <div class=\"p-3 header-card\">\r\n AI Trust Score <span><svg ngbTooltip=\"This score reflects how often AI predictions were accepted without manual overrides.\" placement=\"left\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <g clip-path=\"url(#clip0_362_2979)\">\r\n <path\r\n d=\"M9.99984 13.3332V9.99984M9.99984 6.6665H10.0082M18.3332 9.99984C18.3332 14.6022 14.6022 18.3332 9.99984 18.3332C5.39746 18.3332 1.6665 14.6022 1.6665 9.99984C1.6665 5.39746 5.39746 1.6665 9.99984 1.6665C14.6022 1.6665 18.3332 5.39746 18.3332 9.99984Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_362_2979\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </div>\r\n <div class=\"p-5 text-card\">\r\n <span>{{auditDetails?.trustScore ? auditDetails?.trustScore:'--'}}%</span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"row mt-3\">\r\n <div [ngClass]=\"eyeTestType ==='fake' ? 'col-md-12' : 'col-md-6'\" class=\"col-sm-6\">\r\n <div class=\"card h-500px px-5\">\r\n <div class=\"card-header p-0 border-0\">\r\n <span class=\"card-title m-0 fw-bolder bg-none\">Preview Eye Test</span>\r\n </div>\r\n <div class=\"card-body px-0 position-relative\">\r\n <div class=\"video-position w-100\">\r\n <video class=\"w-100 rounded-3 h-auto\" controls\r\n [src]=\"auditDetails?.filePath\"></video>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"eyeTestType !=='fake'\" class=\"col-sm-6\">\r\n <div class=\"card h-500px px-5 overflow-scroll\">\r\n <div class=\"card-header mb-3 p-0 border-0 d-flex justify-content-between align-items-center\">\r\n <div class=\"\">\r\n <span class=\"card-title m-0 fw-bolder bg-none\">Step-wise Breakdown</span>\r\n \r\n \r\n <div class=\"d-flex sub-title mt-2\" *ngIf=\"auditDetails?.lastAuditedDetails?.auditedBy\">\r\n <span *ngIf=\"currentAuditType === 'remote'\"> <span *ngIf=\"auditDetails?.spokenLanguage\"> <span *ngIf=\"!takeAudit\" class=\"badge badge-light-info mt-0 me-2\">Language Spoken: {{auditDetails?.spokenLanguage}}</span></span></span> <span class=\"mt-1\">Recently Audited By : </span>\r\n <span class=\"ms-2 mt-1\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\"\r\n height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M13.3337 14V12.6667C13.3337 11.9594 13.0527 11.2811 12.5526 10.781C12.0525 10.281 11.3742 10 10.667 10H5.33366C4.62641 10 3.94814 10.281 3.44804 10.781C2.94794 11.2811 2.66699 11.9594 2.66699 12.6667V14M10.667 4.66667C10.667 6.13943 9.47308 7.33333 8.00033 7.33333C6.52757 7.33333 5.33366 6.13943 5.33366 4.66667C5.33366 3.19391 6.52757 2 8.00033 2C9.47308 2 10.667 3.19391 10.667 4.66667Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span >{{auditDetails?.lastAuditedDetails?.auditedBy}}</span>\r\n <span class=\"ms-2 mt-1\"><span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\"\r\n height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_152_29431)\">\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_152_29431\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>{{auditDetails?.lastAuditedDetails?.completionTime}}\r\n {{auditDetails?.lastAuditedDetails?.timeZone}}</span>\r\n </div>\r\n \r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"takeAudit && currentAuditType === 'remote'\" class=\"d-flex align-items-end me-2\">\r\n <select [(ngModel)]=\"spokenLanguage\" class=\"form-select form-select-sm\">\r\n <option selected disabled >Language Spoken <span style=\"color:red\">*</span></option>\r\n <option value=\"English\">English</option>\r\n <option value=\"Hindi\">Hindi</option>\r\n </select></div>\r\n <div *ngIf=\"auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Yet-to-Audit' && !takeAudit\" (click)=\"startAudit('audit')\"\r\n class=\"text-white ms-3 px-3 py-2 fw-semibold rounded-2 cursor-pointer bg-primary\"\r\n style=\"font-size: 14px;\">\r\n Start Audit\r\n </div>\r\n \r\n <div *ngIf=\"['Audited','Re-Audit','Yet-to-Audit'].includes(auditDetails?.auditStatus)&&auditDetails?.auditType === 'Re-Audit' && !takeAudit||auditDetails?.auditType === 'Audit'&&auditDetails?.auditStatus === 'Audited' ||auditDetails?.auditType === 'Re-Audit'&&auditDetails?.auditStatus === 'Re-Audited'&& !takeAudit \"\r\n (click)=\"startAudit('Re-Audit')\" class=\"btn btn-sm py-2 btn-warning\">Re-Audit</div>\r\n <div *ngIf=\"takeAudit\" class=\"d-flex\">\r\n <button class=\"btn btn-sm btn-outline\" [disabled]=\"disablecancel\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn ms-2 btn-sm btn-success\" [disabled]=\"disablecancel\" (click)=\"onsubmit()\">Submit</button>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body mt-1 px-0\">\r\n <div *ngIf=\"!takeAudit && stepWiseProcess?.length\" class=\"table-responsive border border-1 rounded-3\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">\r\n Step-by-step Process\r\n </th>\r\n <th *ngIf=\"currentAuditType === 'remote'\" class=\"text-start\">\r\n Predicted Transcript\r\n </th>\r\n <th class=\"text-start\">\r\n AI Verified\r\n </th>\r\n <th class=\"text-start\">\r\n Human Audited\r\n </th>\r\n <th class=\"text-start\">\r\n Reason for Error\r\n </th>\r\n <th class=\"text-start\">\r\n Noticed Time Range\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of stepWiseProcess;let i=index\">\r\n <td>\r\n <div class=\"d-flex align-items-start\">\r\n <!-- <div class=\"w-40px h-40px d-flex justify-content-center text-center me-3\">\r\n <img class=\"w-100 rounded-5\" [src]=\"data?.imageUrl\">\r\n </div> -->\r\n {{data.processName}}\r\n </div>\r\n </td>\r\n <td *ngIf=\"currentAuditType ==='remote'\" class=\"text-capitalize\">\r\n <div class=\"text-primary1 text-decoration-underline cursor-pointer\"\r\n [ngbTooltip]=\"data?.predictedTranscript ? tooltipContent : ''\"\r\n placement='bottom'>{{data?.predictedTranscript?data?.predictedTranscript:\"N/A\"}}</div>\r\n\r\n <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"min-w-500px\">{{data?.predictedTranscript?data?.predictedTranscript:\"N/A\"}}</span>\r\n </div>\r\n </ng-template>\r\n\r\n </td>\r\n <td class=\"text-capitalize\"><span\r\n [ngClass]=\"data.AIStatus ? 'badge badge-light-success' : 'badge badge-light-danger'\">{{data.AIStatus\r\n ? 'pass' : 'fail'}}</span></td>\r\n <td class=\"text-capitalize\">\r\n <span \r\n [ngClass]=\"data?.auditedStatus === true ? 'badge badge-light-success' : (data?.auditedStatus === false ? 'badge badge-light-danger' : '')\">\r\n {{ data?.auditedStatus === true ? 'pass' : (data?.auditedStatus === false ? 'fail' : 'N/A') }}\r\n </span>\r\n \r\n </td>\r\n <td *ngIf=\"data.AIStatus !== data.auditedStatus || data.auditedStatus === null || data.auditedStatus === undefined || data.auditedStatus === ''; else EqualBlock\">\r\n <!-- {{ data?.reason || 'N/A' }} -->\r\n <span *ngIf=\"data.reason !=='others'\">{{data.reason || 'N/A'}}</span><span *ngIf=\"data.reason ==='others'\">{{data.otherReason || 'N/A'}}</span>\r\n </td>\r\n <ng-template #EqualBlock>\r\n <td>N/A</td>\r\n </ng-template>\r\n <td>{{data?.startTime}} - {{data?.endTime}}</td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <div *ngIf=\"stepWiseProcess?.length && takeAudit&&auditDetails?.auditStatus==='Yet-to-Audit'||auditDetails?.auditStatus==='In-Progress'\">\r\n <div *ngFor=\"let process of stepWiseProcess; let i=index ;let last=last\"\r\n class=\"border border-1 rounded-3 mb-3\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n Step-{{i+1 | number}}\r\n </th>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n AI Verified\r\n </th>\r\n <th class=\"text-primary bg-light-primary text-start\">\r\n Human Audited\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td class=\"w-200px\">\r\n <!-- <div class=\"d-flex align-items-start\"> -->\r\n <!-- <div class=\"w-40px h-40px d-flex justify-content-center text-center me-3\">\r\n <img class=\"w-100 rounded-5\" [src]=\"process.imageUrl\">\r\n </div> -->\r\n {{process.processName}}\r\n <!-- </div> -->\r\n </td>\r\n <td><span *ngIf=\"process.AIStatus\" class=\"badge badge-light-success text-capitalize\">Pass</span>\r\n <span *ngIf=\"!process.AIStatus\" class=\"badge badge-light-danger text-capitalize\">Fail</span>\r\n </td>\r\n <td>\r\n <div class=\"d-flex justify-content-start\">\r\n <div (click)=\"selectHumanVerified(i,true)\"\r\n [ngClass]=\"process?.auditedStatus ? 'text-white btn-success' : 'text-success bg-white border border-success'\"\r\n class=\"btn btn-sm rounded-5\"><span><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"16\"\r\n viewBox=\"0 0 17 16\" fill=\"none\">\r\n <path d=\"M14.1667 4L6.83333 11.3333L3.5 8\"\r\n [attr.stroke]=\"process?.auditedStatus ? 'white' : '#17C653'\"\r\n stroke-width=\"1.25\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span><span class=\"ms-2\">Pass</span></div>\r\n\r\n <div (click)=\"selectHumanVerified(i,false)\"\r\n [ngClass]=\"process?.auditedStatus===false ? 'text-white bg-danger' : 'text-danger bg-white border border-danger'\"\r\n class=\"ms-3 px-5 py-2 fw-semibold rounded-5 cursor-pointer rounded-5\">\r\n <span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"16\"\r\n viewBox=\"0 0 17 16\" fill=\"none\">\r\n <path d=\"M12.6665 4L4.6665 12M4.6665 4L12.6665 12\"\r\n [attr.stroke]=\"process?.auditedStatus===false ? 'white' : '#F8285A'\"\r\n stroke-width=\"1.25\" stroke-linecap=\"rowund\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span><span class=\"ms-2\">Fail</span></div>\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <div *ngIf=\"currentAuditType === 'remote' && process?.predictedTranscript\" class=\"w-100\">\r\n <div class=\"bg-light-primary text-primary p-3\">\r\n Predicted Transcript\r\n </div>\r\n <div class=\"row col-sm-12 p-5\">\r\n <div class=\"text-primary text-decoration-underline cursor-pointer\"\r\n [ngbTooltip]=\"process?.predictedTranscript ? tooltipContent : ''\"\r\n placement='bottom'>\r\n {{process?.predictedTranscript}}\r\n </div>\r\n <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"min-w-500px\">{{process?.predictedTranscript}}</span>\r\n </div>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div *ngIf=\"process?.auditedStatus !== undefined && process?.auditedStatus !== '' && process?.auditedStatus !== process?.AIStatus\" class=\"w-100\">\r\n <div class=\"bg-light-primary text-primary p-3\">\r\n Reason & Time Stamp\r\n </div>\r\n <div class=\"row col-sm-12 p-5\">\r\n <div class=\"col-sm-6 col-md-6\">\r\n <div>\r\n <div (click)=\"toggleDropdown(i,'reason')\" class=\"custom-dropdown\">\r\n <div class=\"d-flex justify-content-between\">\r\n <span class=\"text-select\">\r\n {{ process?.reason ? process?.reason : 'Select Reason' }}\r\n </span>\r\n <span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n \r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\" *ngIf=\"dropdownOpen[i]?.reason\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"item my-2 minutes-scroll\">\r\n <ul *ngFor=\"let item of dropdownList\" class=\"list-unstyled\">\r\n <li [ngClass]=\"process?.reason === item?.key ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n (click)=\"selectReason(i, item?.key, 'reason')\">\r\n {{ item?.item }}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <!-- Custom Input for \"Others\" -->\r\n <div *ngIf=\"process?.reason === 'others'\" class=\"mt-2\">\r\n <input \r\n type=\"text\" \r\n [(ngModel)]=\"process.otherReason\" \r\n placeholder=\"Enter your reason\" \r\n class=\"form-control form-control-sm\" />\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"col-sm-3\">\r\n <div class=\"w-100\">\r\n <div (click)=\"toggleDropdown(i,'startTime')\" class=\"custom-dropdown\">\r\n <label class=\"label fw-semibold bg-white px-2\">Start</label>\r\n <div class=\"text-select\">{{process?.startTime ? process?.startTime\r\n :'MM:SS'}}</div>\r\n\r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\"\r\n *ngIf=\"dropdownOpen[i]?.startTime\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"scroll-section minutes-scroll \">\r\n <div *ngFor=\"let min of minutesList\"\r\n (click)=\"selectMinute(i,min,'startTime')\"\r\n [class.selected]=\"min === selectedMinutes\">\r\n {{ min }}\r\n </div>\r\n </div>\r\n <!-- Seconds List -->\r\n <div class=\"scroll-section seconds-scroll\">\r\n <div *ngFor=\"let sec of secondsList\"\r\n (click)=\"selectSecond(i,sec,'startTime')\"\r\n [class.selected]=\"sec === selectedSeconds\">\r\n {{ sec }}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-3\">\r\n <div class=\"w-100\">\r\n <div (click)=\"toggleDropdown(i,'endTime')\" class=\"custom-dropdown\">\r\n <label class=\"label fw-semibold bg-white px-2\">End</label>\r\n <div class=\"text-select\"><span>{{process.endTime ? process.endTime :\r\n 'MM:SS'}}</span></div>\r\n\r\n <div [ngClass]=\"last ? 'dropdown-content1' : 'dropdown-content'\"\r\n *ngIf=\"dropdownOpen[i]?.endTime\">\r\n <div class=\"scroll-container\">\r\n <!-- Minutes List -->\r\n <div class=\"scroll-section minutes-scroll\">\r\n <div *ngFor=\"let min of minutesList\"\r\n [class.selected]=\"min === selectedMinutes\"\r\n [class.disabled]=\"getSecondsFromTime(min + ':' + selectedSeconds) <= getSecondsFromTime(process.startTime)\"\r\n (click)=\"\r\n getSecondsFromTime(min + ':' + selectedSeconds) > getSecondsFromTime(process.startTime)\r\n && selectMinute(i,min,'endTime')\">\r\n {{ min }}\r\n </div>\r\n \r\n </div>\r\n <!-- Seconds List -->\r\n <div class=\"scroll-section seconds-scroll\">\r\n <div *ngFor=\"let sec of secondsList\"\r\n [class.selected]=\"sec === selectedSeconds\"\r\n [class.disabled]=\"getSecondsFromTime(selectedMinutes + ':' + sec) <= getSecondsFromTime(process.startTime)\"\r\n (click)=\"\r\n getSecondsFromTime(selectedMinutes + ':' + sec) > getSecondsFromTime(process.startTime)\r\n && selectSecond(i,sec,'endTime')\">\r\n {{ sec }}\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!stepWiseProcess?.length\">\r\n <div *ngIf=\"(tableLoading | async) === 'loading'\"\r\n class=\"card 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 <div *ngIf=\"(tableLoading | async) === 'loaded'\" class=\"row mt-2\">\r\n <div *ngIf=\"noData\" class=\"col-lg-12\">\r\n <div class=\"card-body my-8 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=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the test</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"card mt-3 p-2\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"title-text mb-2\">History</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-body py-0 px-3\">\r\n <div class=\"table-responsive border border-1 rounded-3\" *ngIf=\"historyData?.length\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">Audited By</th>\r\n <th class=\"text-start\" >Audited Date</th>\r\n <th class=\"text-start\" >Time Stamp</th>\r\n <th class=\"text-start\" >View Logs</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of historyData\">\r\n <td>{{item.userName}}</td>\r\n <td>{{item.Date}}</td>\r\n <td>{{item.Time}} IST</td>\r\n <td (click)=\"viewHistoryModel(item)\" class=\"cursor-pointer\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"16\"\r\n viewBox=\"0 0 20 16\" fill=\"none\">\r\n <path\r\n d=\"M0.833496 8.00016C0.833496 8.00016 4.16683 1.3335 10.0002 1.3335C15.8335 1.3335 19.1668 8.00016 19.1668 8.00016C19.1668 8.00016 15.8335 14.6668 10.0002 14.6668C4.16683 14.6668 0.833496 8.00016 0.833496 8.00016Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.0002 10.5002C11.3809 10.5002 12.5002 9.38087 12.5002 8.00016C12.5002 6.61945 11.3809 5.50016 10.0002 5.50016C8.61945 5.50016 7.50016 6.61945 7.50016 8.00016C7.50016 9.38087 8.61945 10.5002 10.0002 10.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n\r\n <div *ngIf=\"!historyData?.length\">\r\n <div *ngIf=\"(historytableLoading | async) === 'loading'\"\r\n class=\"card 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\r\n <div *ngIf=\"(historytableLoading | async) === 'loaded'\" class=\"row mt-2\">\r\n <div class=\"col-lg-12\">\r\n <div class=\"card-body my-8 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=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the test</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<ng-template #viewHistory let-model>\r\n <div class=\"p-5 ts700px scroll\">\r\n\r\n\r\n <div class=\"card-body py-0 \">\r\n <div class=\"my-2 d-flex\">\r\n<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"46\"\r\n height=\"46\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M28 22V28L32 30M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span\r\n class=\"ms-3 pt-2 fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Audit\r\n History</span>\r\n </div>\r\n <div class=\"table-responsive\" *ngIf=\"historyData?.length\">\r\n <table class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-start\">Step-by-Step Process</th>\r\n <th class=\"text-start\">Status changed from</th>\r\n <th class=\"text-start\">Noted Time Range</th>\r\n <th class=\"text-start\">Reason for Error</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of viewHistoryData\">\r\n <td>{{item.processName}}</td>\r\n <td>\r\n <span *ngIf=\"item.AIStatus\" class=\"badge badge-light-success me-2\">Pass</span>\r\n <span *ngIf=\"!item.AIStatus\" class=\"badge badge-light-danger me-2\">Fail</span>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"31\" height=\"8\" viewBox=\"0 0 31 8\"\r\n fill=\"none\">\r\n <path\r\n d=\"M30.3536 4.35355C30.5488 4.15829 30.5488 3.84171 30.3536 3.64645L27.1716 0.464466C26.9763 0.269204 26.6597 0.269204 26.4645 0.464466C26.2692 0.659728 26.2692 0.976311 26.4645 1.17157L29.2929 4L26.4645 6.82843C26.2692 7.02369 26.2692 7.34027 26.4645 7.53553C26.6597 7.7308 26.9763 7.7308 27.1716 7.53553L30.3536 4.35355ZM0 4.5H30V3.5H0V4.5Z\"\r\n fill=\"#D0D5DD\" />\r\n </svg>\r\n <span *ngIf=\"item.auditedStatus\" class=\"badge badge-light-success ms-2\">Pass</span>\r\n <span *ngIf=\"!item.auditedStatus\" class=\"badge badge-light-danger ms-2\">Fail</span>\r\n </td>\r\n <td ><span class=\"badge badge-light-success\" *ngIf=\"item.startTime\">Noted Time Range : <span class=\"text-dark1\">{{item.startTime ? item.startTime:'--'}} - {{item.endTime}}</span></span></td>\r\n <td class=\"engage-text\"><span *ngIf=\"item.reason !=='others'\">{{item.reason}}</span><span *ngIf=\"item.reason ==='others'\">{{item.otherReason}}</span></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #viewCancel let-model>\r\n <div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEF0C7\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FFFAEB\" stroke-width=\"8\"/>\r\n <path d=\"M27.9988 24V28M27.9988 32H28.0088M26.2888 18.86L17.8188 33C17.6442 33.3024 17.5518 33.6453 17.5508 33.9945C17.5498 34.3437 17.6403 34.6871 17.8132 34.9905C17.9862 35.2939 18.2355 35.5467 18.5365 35.7238C18.8375 35.9009 19.1796 35.9961 19.5288 36H36.4688C36.818 35.9961 37.1601 35.9009 37.4611 35.7238C37.7621 35.5467 38.0114 35.2939 38.1844 34.9905C38.3573 34.6871 38.4478 34.3437 38.4468 33.9945C38.4458 33.6453 38.3534 33.3024 38.1788 33L29.7088 18.86C29.5305 18.5661 29.2795 18.3231 28.98 18.1544C28.6805 17.9858 28.3425 17.8972 27.9988 17.8972C27.6551 17.8972 27.3171 17.9858 27.0176 18.1544C26.7181 18.3231 26.4671 18.5661 26.2888 18.86Z\" stroke=\"#DC6803\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Are you sure?</a>\r\n <span class=\"sub-title fw-normal mt-2\">Would you like to cancel this?</span>\r\n \r\n <div class=\"mt-5 w-100\">\r\n \r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"OnCancel()\">No</button>\r\n <button id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onYes()\">Yes</button>\r\n \r\n </div>\r\n \r\n </div>\r\n \r\n </div>\r\n </div>\r\n</ng-template>\r\n</section>", styles: [":host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.shown.drops-down-right{transform-origin:0 0;width:560px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;right:-475px!important;left:unset!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.card-title{font-size:1.15rem!important}.select-wrapper{position:relative;display:inline-block;width:100%}.placeholder-overlay{position:absolute;color:var(--Gray-500, #667085);font-family:Inter;font-size:16px!important;font-style:normal;font-weight:400;top:10px;left:15px;pointer-events:none;font-size:1.1rem;z-index:1}table th,table td{height:44px!important;padding:12px 24px!important;gap:12px;align-self:stretch}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:18px}table td{color:var(--Gray-900, #667085);font-size:14px!important;font-weight:500!important;line-height:20px}.bottom-border td{border-bottom:1px solid var(--Gray-200, #EAECF0)!important}.rotate{rotate:180deg;transition:1s}.engage-text{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-transform:capitalize}.dashed{border-radius:4px;border:1px dashed var(--Error-500, #F04438)!important;background:var(--Error-25, #FFFBFA)}.dashed-desc{color:var(--Error-600, #3F4254)!important;font-size:14px;font-weight:600;line-height:24px}.card-header,.header{color:var(--Gray-900, #101828);font-size:20px!important;font-style:normal;font-weight:700;line-height:30px}.sub-header{color:var(--Gray-700, #344054);font-size:14px!important;font-style:normal;font-weight:600;line-height:20px}.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}.text-value{color:var(--Black, #101828);font-size:24px;font-weight:600;line-height:32px}.text-sub{color:var(--Error-600, #667085)!important;font-size:16px;font-weight:600;line-height:18px}.test-sub1{color:var(--Gray-800, #1D2939);font-size:11px;font-weight:400;line-height:18px}.new1 .header-card{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;color:var(--Black, #101828);font-size:18px;line-height:32px}.new1 .text-card{color:var(--Black, #101828);font-size:24px;line-height:32px}.new1 .bg-light-primary{border-bottom:1px solid var(--Primary-100, #DAF1FF)!important;background:var(--Primary-25, #F6FCFF)!important}.new1 .sub-title{color:var(--Gray-500, #667085);font-size:12px;font-weight:500;line-height:18px}.new1 .video-position{position:absolute;top:50%;transform:translateY(-50%)}.new1 .btn-success{border:1px solid var(--Success-700, #027A48)!important;background:var(--Success-700, #027A48)!important;box-shadow:0 1px 2px #1018280d!important}.new1 .btn.btn-success:hover:not(.btn-active),.new1 .btn.btn-success:active:not(.btn-active){border:1px solid var(--Success-700, #027A48)!important;background:var(--Success-700, #027A48)!important;box-shadow:0 1px 2px #1018280d!important}.new1 table tr{vertical-align:middle}.new1 table tr td{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:500;line-height:20px}.new1 .custom-dropdown{position:relative;width:100%;padding:10px 16px;cursor:pointer;border-radius:8px;font-size:16px;font-weight:400;line-height:20px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--Gray-50, #F9FAFB);box-shadow:0 1px 2px #1018280d}.new1 .dropdown-content{position:absolute;z-index:1;top:100%;left:0;border-radius:6px;width:100%;background:#fff;box-shadow:0 4px 6px #0000001a;display:flex}.new1 .dropdown-content1{position:absolute;z-index:1;bottom:100%;left:0;border-radius:6px;width:100%;background:#fff;box-shadow:0 4px 6px #0000001a;display:flex}.new1 .scroll-container{display:flex;width:100%}.new1 .scroll-container .item{width:100%;text-align:start}.new1 .scroll-container .items:hover,.new1 .scroll-container .tems.focus,.new1 .scroll-container .items.active{background:var(--Gray-50, #F9FAFB)}.new1 .label{position:absolute;top:-25%;color:var(--Gray-700, #344054);font-size:12px;line-height:18px}.new1 .scroll-section{width:50%;height:200px;overflow-y:auto;text-align:center;border-right:1px solid #ddd}.new1 .scroll-section:last-child{border-right:none}.new1 .scroll-section div{padding:8px;cursor:pointer}.new1 .scroll-section div.selected{background:#007bff;color:#fff}.new1 .bg-primary{border-radius:8px;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d}.new1 .bg-danger{background:var(--Primary-500, #D92D20)!important}.new1 .text-primary{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:500!important;line-height:18px!important}.new1 .text-primary1{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:500!important;line-height:18px!important;text-overflow:ellipsis;max-width:200px;overflow:hidden}.new1 .text-select{color:var(--Gray-500, #667085)!important;font-size:14.56px!important;font-weight:400;line-height:21.84px!important}.new1 .custom-tooltip-content{font-size:12px!important;text-align:left!important}.new1 ::ng-deep .tooltip-inner{max-width:500px!important;white-space:normal}.new1 .test-dark1{color:var(--Success-700, #027A48)!important;text-align:center;font-size:12px!important;font-weight:500!important;line-height:18px}.new1 .engage-text{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:none;text-decoration-thickness:auto;text-underline-offset:auto;text-underline-position:from-font;text-transform:capitalize}.new1 .disabled{pointer-events:none;opacity:.4;cursor:not-allowed}.new1 .h-auto{height:400px!important;object-fit:fill}@media (min-width: 1920px) and (max-width: 2119px){.new1 .h-500px{height:600px!important}.new1 .h-auto{height:400px!important;object-fit:fill}}@media (min-width: 1720px) and (max-width: 1900px){.new1 .h-auto{height:400px!important;object-fit:fill}}@media (min-width: 2120px) and (max-width: 2800px){.new1 .h-auto{height:520px!important;object-fit:fill}}@media (min-width: 1330px) and (max-width: 1500px){.new1 .h-auto{height:370px!important;object-fit:fill}}.new1 .ts700px{min-height:auto!important;max-height:700px!important}\n"] }]
24018
24018
  }], ctorParameters: () => [{ type: i2$1.PageInfoService }, { type: i1$1.FormBuilder }, { type: TraxService }, { type: EyeTestAuditService }, { type: i1$3.Router }, { type: i0.ChangeDetectorRef }, { type: i2$1.GlobalStateService }, { type: i3.ToastService }, { type: i1.NgbModal }, { type: i1$3.ActivatedRoute }], propDecorators: { tooltipContent: [{
24019
24019
  type: ViewChild,
24020
24020
  args: ['tooltipContent']