tango-app-ui-ticket-user 3.0.14-dev → 3.0.16-dev
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/components/edge-cameraview/edge-cameraview.component.mjs +7 -5
- package/esm2022/lib/components/edgeapp-log/edgeapp-log.component.mjs +19 -5
- package/esm2022/lib/components/infratickets/infratickets.component.mjs +5 -5
- package/esm2022/lib/components/installation/installation.component.mjs +4 -4
- package/esm2022/lib/components/store-activity/store-activity.component.mjs +3 -3
- package/esm2022/lib/components/store-info/store-info.component.mjs +21 -5
- package/esm2022/lib/components/tickets/tickets.component.mjs +20 -16
- package/fesm2022/tango-app-ui-ticket-user.mjs +71 -36
- package/fesm2022/tango-app-ui-ticket-user.mjs.map +1 -1
- package/lib/components/edge-cameraview/edge-cameraview.component.d.ts +1 -0
- package/lib/components/edgeapp-log/edgeapp-log.component.d.ts +2 -0
- package/lib/components/infratickets/infratickets.component.d.ts +1 -1
- package/lib/components/store-info/store-info.component.d.ts +2 -0
- package/package.json +1 -1
|
@@ -519,8 +519,8 @@ class InfraticketsComponent {
|
|
|
519
519
|
event.stopPropagation();
|
|
520
520
|
this.dropDown = !this.dropDown;
|
|
521
521
|
}
|
|
522
|
-
userValue(
|
|
523
|
-
this.userData =
|
|
522
|
+
userValue(data) {
|
|
523
|
+
this.userData = data;
|
|
524
524
|
if (this.userData == 'History') {
|
|
525
525
|
this.workHistory();
|
|
526
526
|
this.storeFilters();
|
|
@@ -609,11 +609,11 @@ class InfraticketsComponent {
|
|
|
609
609
|
});
|
|
610
610
|
}
|
|
611
611
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: InfraticketsComponent, deps: [{ token: i2.ActivatedRoute }, { token: i2.Router }, { token: i0.ChangeDetectorRef }, { token: DataService }, { token: i3.ToastService }, { token: TicketsService }, { token: DataService }, { token: i4.GlobalStateService }, { token: ExcelService }], target: i0.ɵɵFactoryTarget.Component });
|
|
612
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: InfraticketsComponent, selector: "lib-infratickets", host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "\r\n<div class=\"card\">\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=\"card-label mb-2\">{{type | titlecase}} Tickets</span>\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div *ngIf=\"userData ==='Workspace'\" 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 type=\"text\" class=\"form-control ps-14 me-2\" \r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchWorkspace\" (change)=\"searchTickets()\"/>\r\n \r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-200px position-absolute top-50px end-0\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"this.selectedIssue === item ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(item)\">{{item}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && (!noData.open || !noData.inprogress || !noData.closed)\" (click)=\"exportData()\" class=\"btn btn-outline p-3 border border-gray ms-2 me-2\" type=\"button\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></button>\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isEdit\" type=\"button\" (click)=\"takeTicket()\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><span class=\"ms-2 text-white\">Take Ticket</span> </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"userData ==='History'\" 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 type=\"text\" class=\"form-control ps-14 me-2\" \r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchHistory\" (change)=\"searchHistoryTable()\" />\r\n \r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"receiveData($event)\" ></lib-filters>\r\n\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !historyNodata\" (click)=\"ExportHistoryasXlsx()\" class=\"btn btn-outline p-3 border border-gray ms-2 me-2 text-nowrap\" type=\"button\"><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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span> Export\r\n </button>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card-body py-2\">\r\n <div class=\"d-flex overflow-auto h-55px\">\r\n <ul (click)=\"userValue($event)\" class=\"nav nav-stretch nav-line-tabs nav-line-tabs-2x border-transparent fs-5 fw-bolder flex-nowrap\">\r\n <li class=\"nav-item cursor-pointer\"><a [ngClass]=\"userData ==='Workspace' ? 'active' :''\"\r\n class=\"nav-link text-active-primary me-6\">Workspace</a>\r\n </li>\r\n <li class=\"nav-item cursor-pointer\"><a [ngClass]=\"userData ==='History' ? 'active' :''\"\r\n class=\"nav-link text-active-primary me-6\">History</a></li>\r\n </ul>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"userData ==='Workspace'\" class=\"card-body\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Open</span><span *ngIf=\"statusOpen?.length > 0 && !loading.open && !noData.open\" class=\"rounded-5 ms-3 px-1 border border-gray bg-badge\">{{statusOpen?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!loading.open && !noData.open\">\r\n <div *ngFor=\"let open of statusOpen; let index = index\">\r\n <div [ngClass]=\"open.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(open)\">\r\n <div *ngIf=\"open.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{open?.storeId ? open?.storeId :'--'}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>{{open?.Date ? open?.Date : '--'}}\r\n </div>\r\n <span *ngIf=\"open?.infraIssue\" class=\"badge badge-light-warning\">{{open?.infraIssue ? open?.infraIssue :'--'}}</span>\r\n <span *ngIf=\"type ==='installation'\" class=\"badge badge-light-primary\">{{open?.installationStatus ? open?.installationStatus :'--'}}</span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div *ngIf=\"open?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'open')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{open?.ticketId ? open?.ticketId : '--'}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"open?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"open?.issueStatus !== 'notidentified'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!open.isOpen\" (click)=\"selectView($event,index,'open')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!open.isOpen && open?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusOpen?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center\"> \r\n <img class=\"mx-auto mb-2\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-2 fw-bold\">No Open Tickets </span>\r\n <button class=\"w-100 btn btn-primary mt-5\" (click)=\"takeTicket()\">Take Ticket</button>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.open\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.open\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto mb-2\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Open Tickets </span>\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isEdit\" class=\"w-100 btn btn-primary mt-5\" (click)=\"takeTicket()\">Take Ticket</button>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Inprogress</span><span *ngIf=\"statusInprogress?.length > 0 && !loading.inprogress && !noData.inprogress\" class=\"rounded-5 ms-3 px-1 border border-gray bg-badge\">{{statusInprogress?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!loading.inprogress && !noData.inprogress\">\r\n <div *ngFor=\"let inprogress of statusInprogress; let index = index\">\r\n <div [ngClass]=\"inprogress.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(inprogress)\">\r\n <div *ngIf=\"inprogress?.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{inprogress?.storeId}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg> {{inprogress?.Date}}\r\n </div>\r\n <span *ngIf=\"inprogress?.infraIssue\" class=\"badge badge-light-warning\">{{inprogress?.infraIssue}}</span>\r\n <span *ngIf=\"type ==='installation' && inprogress?.infraIssue!==''\" class=\"badge badge-light-primary text-capitalize ms-3\">{{inprogress?.installationStatus ? inprogress?.installationStatus :'--'}}</span>\r\n </div>\r\n </div>\r\n <div class=\" d-flex\">\r\n <div *ngIf=\"inprogress?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'inprogress')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{inprogress?.ticketId}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"inprogress?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span class=\"ms-3\" *ngIf=\"inprogress?.issueStatus !== 'notidentified'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!inprogress.isOpen\" (click)=\"selectView($event,index,'inprogress')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!inprogress.isOpen && inprogress?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusInprogress?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center mx-auto\"> \r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-2 fw-bold\">No In-Progress Tickets </span>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.inprogress\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.inprogress\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No In-Progress Tickets </span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\" (click)=\"selectTicket()\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Closed</span><span *ngIf=\"statusClosed?.length > 0 && !noData.closed && !loading.closed\" class=\"rounded-5 ms-3 px-1 border border-gray border-gray bg-badge\">{{statusClosed?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!noData.closed && !loading.closed\">\r\n <div *ngFor=\"let closed of statusClosed; let index = index\">\r\n <div [ngClass]=\"closed.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(closed)\">\r\n <div *ngIf=\"closed?.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{closed?.storeId}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg> {{closed?.Date}}\r\n </div>\r\n <span *ngIf=\"closed?.infraIssue\" [ngClass]=\"closed?.infraIssue === 'Live'? 'badge badge-light-success':''\" class=\"badge badge-light-warning\"> {{closed?.infraIssue}} </span>\r\n </div>\r\n </div>\r\n <div class=\" d-flex\">\r\n <div *ngIf=\"closed?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'closed')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{closed.ticketId}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"closed?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"closed?.issueStatus !== 'notidentified'\" class=\"ms-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!closed.isOpen\" (click)=\"selectView($event,index,'closed')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!closed.isOpen && closed?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusClosed?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center mx-auto\"> \r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Closed Tickets</span>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.closed\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.closed\">\r\n <div class=\"row rowbody\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Closed Tickets </span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div> \r\n</div>\r\n<div *ngIf=\"userData === 'History'\" class=\"card-body\">\r\n <div *ngIf=\"!historyLoading && !historyNodata\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th><div (click)=\"sortData('issueDate')\">\r\n Created on\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== 1 || sortColumName !== 'issueDate' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n <th><div (click)=\"sortData('ticketId')\">\r\n Ticket ID\r\n <span *ngIf=\"sortColumName === 'ticketId' && sortBy !== 1 || sortColumName !== 'ticketId' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'ticketId' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('clientName')\">\r\n Client Info\r\n <span *ngIf=\"sortColumName === 'clientName' && sortBy !== 1 || sortColumName !== 'clientName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'clientName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('storeName')\"></div>\r\n Store Info\r\n <span *ngIf=\"sortColumName === 'storeName' && sortBy !== 1 || sortColumName !== 'storeName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </th>\r\n <th><div (click)=\"sortData('issueDate')\">\r\n Issue Identified on\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== 1 || sortColumName !== 'issueDate'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('issueClosedDate')\">\r\n Closed on\r\n <span *ngIf=\"sortColumName === 'issueClosedDate' && sortBy !== 1 || sortColumName !== 'issueClosedDate'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueClosedDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('infraIssue')\">Issue Type\r\n <span *ngIf=\"sortColumName === 'infraIssue' && sortBy !== 1 || sortColumName !== 'infraIssue'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'infraIssue' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span></div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let history of workHistoryTable ; let i = index\">\r\n <td>{{history?.issueDate|customDateFormat}}</td>\r\n <td>{{history?.ticketId ? history?.ticketId :'--'}}</td>\r\n <td>\r\n <div class=\"d-grid ms-3\">\r\n <span>{{history?.clientName ? history?.clientName : '--'}}</span>\r\n <span class=\"textSub mt-1\">ID : {{history?.clientId ? history?.clientId :'--'}}</span>\r\n </div>\r\n </td>\r\n <td>\r\n <div class=\"d-grid ms-3\">\r\n <span class=\"text-primary mb-1\">{{history?.storeName ? history?.storeName :'--'}}</span>\r\n <span class=\"textSub\">ID : {{history?.storeId ? history?.storeId :'--'}}</span>\r\n </div>\r\n </td>\r\n <td>{{history?.issueDate |customDateFormat: '--'}}</td>\r\n <td>{{history?.issueClosedDate|customDateFormat}}</td>\r\n <td>{{history?.infraIssue ? history?.infraIssue :'--'}}</td>\r\n </tr>\r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\"\r\n [totalItems]=\"workHistoryTable.count\" [paginationSizes]=\"[10,20,30]\" [pageSize]=\"limit\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div> \r\n <ng-container *ngIf=\"historyLoading && !historyNodata\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"historyNodata && !historyLoading\">\r\n <div 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-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n\r\n", styles: [".rowbody{background:var(--Gray-50, #F9FAFB)}.issuecard{border-radius:8px;border:1px solid var(--Gray-100, #F2F4F7);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:14px 12px}.issuecard label{color:var(--Black, #101828);font-size:16px;line-height:24px}.issuecard.active{background:var(--Primary-25, #F6FCFF);box-shadow:0 2px 4px -2px #1018280f,0 4px 8px -2px #1018281a}.fw-bold-700{font-weight:700!important}.fw-bold-400{font-weight:400!important}.profile{width:24px;height:24px;overflow:hidden;border-radius:200px}.msgprofile{width:48px!important;height:48px!important;border-radius:200px;overflow:hidden}.timingtext{color:var(--Gray-500, #667085);font-size:12px;line-height:18px}.bg-badge{background-color:#776f6f29!important}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.textSub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.taketicket{color:var(--Gray-500, #667085);font-size:16px;line-height:24px}tr{vertical-align:middle!important}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.img-src{width:25%}.mh-60vh{height:40vh!important}.min-height-60vh{min-height:50vh!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: "directive", type: i6$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: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i3.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.CustomDateFormatPipe, name: "customDateFormat" }] });
|
|
612
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: InfraticketsComponent, selector: "lib-infratickets", host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "\r\n<div class=\"card\">\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=\"card-label mb-2\">{{type | titlecase}} Tickets</span>\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div *ngIf=\"userData ==='Workspace'\" 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 type=\"text\" class=\"form-control ps-14 me-2\" \r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchWorkspace\" (change)=\"searchTickets()\"/>\r\n \r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-200px position-absolute top-50px end-0\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"this.selectedIssue === item ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(item)\">{{item}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && (!noData.open || !noData.inprogress || !noData.closed)\" (click)=\"exportData()\" class=\"btn btn-outline p-3 border border-gray ms-2 me-2\" type=\"button\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></button>\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isEdit\" type=\"button\" (click)=\"takeTicket()\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><span class=\"ms-2 text-white\">Take Ticket</span> </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"userData ==='History'\" 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 type=\"text\" class=\"form-control ps-14 me-2\" \r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchHistory\" (change)=\"searchHistoryTable()\" />\r\n \r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"receiveData($event)\" ></lib-filters>\r\n\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !historyNodata\" (click)=\"ExportHistoryasXlsx()\" class=\"btn btn-outline p-3 border border-gray ms-2 me-2 text-nowrap\" type=\"button\"><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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span> Export\r\n </button>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card-body py-2\">\r\n <div class=\"d-flex overflow-auto h-55px\">\r\n <ul class=\"nav nav-stretch nav-line-tabs nav-line-tabs-2x border-transparent fs-5 fw-bolder flex-nowrap\">\r\n <li (click)=\"userValue('Workspace')\" class=\"nav-item cursor-pointer\"><a [ngClass]=\"userData ==='Workspace' ? 'active' :''\"\r\n class=\"nav-link text-active-primary me-6\">Workspace</a>\r\n </li>\r\n <li (click)=\"userValue('History')\" class=\"nav-item cursor-pointer\"><a [ngClass]=\"userData ==='History' ? 'active' :''\"\r\n class=\"nav-link text-active-primary me-6\">History</a></li>\r\n </ul>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"userData ==='Workspace'\" class=\"card-body\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Open</span><span *ngIf=\"statusOpen?.length > 0 && !loading.open && !noData.open\" class=\"rounded-5 ms-3 px-1 border border-gray bg-badge\">{{statusOpen?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!loading.open && !noData.open\">\r\n <div *ngFor=\"let open of statusOpen; let index = index\">\r\n <div [ngClass]=\"open.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(open)\">\r\n <div *ngIf=\"open.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{open?.storeId ? open?.storeId :'--'}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>{{open?.Date ? open?.Date : '--'}}\r\n </div>\r\n <span *ngIf=\"open?.infraIssue\" class=\"badge badge-light-warning\">{{open?.infraIssue ? open?.infraIssue :'--'}}</span>\r\n <span *ngIf=\"type ==='installation'\" class=\"badge badge-light-primary\">{{open?.installationStatus ? open?.installationStatus :'--'}}</span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div *ngIf=\"open?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'open')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{open?.ticketId ? open?.ticketId : '--'}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"open?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"open?.issueStatus !== 'notidentified'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!open.isOpen\" (click)=\"selectView($event,index,'open')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!open.isOpen && open?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusOpen?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center\"> \r\n <img class=\"mx-auto mb-2\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-2 fw-bold\">No Open Tickets </span>\r\n <button class=\"w-100 btn btn-primary mt-5\" (click)=\"takeTicket()\">Take Ticket</button>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.open\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.open\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto mb-2\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Open Tickets </span>\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isEdit\" class=\"w-100 btn btn-primary mt-5\" (click)=\"takeTicket()\">Take Ticket</button>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Inprogress</span><span *ngIf=\"statusInprogress?.length > 0 && !loading.inprogress && !noData.inprogress\" class=\"rounded-5 ms-3 px-1 border border-gray bg-badge\">{{statusInprogress?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!loading.inprogress && !noData.inprogress\">\r\n <div *ngFor=\"let inprogress of statusInprogress; let index = index\">\r\n <div [ngClass]=\"inprogress.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(inprogress)\">\r\n <div *ngIf=\"inprogress?.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{inprogress?.storeId}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg> {{inprogress?.Date}}\r\n </div>\r\n <span *ngIf=\"inprogress?.infraIssue\" class=\"badge badge-light-warning\">{{inprogress?.infraIssue}}</span>\r\n <span *ngIf=\"type ==='installation' && inprogress?.infraIssue!==''\" class=\"badge badge-light-primary text-capitalize ms-3\">{{inprogress?.installationStatus ? inprogress?.installationStatus :'--'}}</span>\r\n </div>\r\n </div>\r\n <div class=\" d-flex\">\r\n <div *ngIf=\"inprogress?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'inprogress')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{inprogress?.ticketId}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"inprogress?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span class=\"ms-3\" *ngIf=\"inprogress?.issueStatus !== 'notidentified'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!inprogress.isOpen\" (click)=\"selectView($event,index,'inprogress')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!inprogress.isOpen && inprogress?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusInprogress?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center mx-auto\"> \r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-2 fw-bold\">No In-Progress Tickets </span>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.inprogress\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.inprogress\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No In-Progress Tickets </span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\" (click)=\"selectTicket()\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Closed</span><span *ngIf=\"statusClosed?.length > 0 && !noData.closed && !loading.closed\" class=\"rounded-5 ms-3 px-1 border border-gray border-gray bg-badge\">{{statusClosed?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!noData.closed && !loading.closed\">\r\n <div *ngFor=\"let closed of statusClosed; let index = index\">\r\n <div [ngClass]=\"closed.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(closed)\">\r\n <div *ngIf=\"closed?.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{closed?.storeId}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg> {{closed?.Date}}\r\n </div>\r\n <span *ngIf=\"closed?.infraIssue\" [ngClass]=\"closed?.infraIssue === 'Live'? 'badge badge-light-success':''\" class=\"badge badge-light-warning\"> {{closed?.infraIssue}} </span>\r\n </div>\r\n </div>\r\n <div class=\" d-flex\">\r\n <div *ngIf=\"closed?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'closed')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{closed.ticketId}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"closed?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"closed?.issueStatus !== 'notidentified'\" class=\"ms-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!closed.isOpen\" (click)=\"selectView($event,index,'closed')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!closed.isOpen && closed?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusClosed?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center mx-auto\"> \r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Closed Tickets</span>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.closed\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.closed\">\r\n <div class=\"row rowbody\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Closed Tickets </span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div> \r\n</div>\r\n<div *ngIf=\"userData === 'History'\" class=\"card-body\">\r\n <div *ngIf=\"!historyLoading && !historyNodata\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th><div (click)=\"sortData('issueDate')\">\r\n Created on\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== 1 || sortColumName !== 'issueDate' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n <th><div (click)=\"sortData('ticketId')\">\r\n Ticket ID\r\n <span *ngIf=\"sortColumName === 'ticketId' && sortBy !== 1 || sortColumName !== 'ticketId' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'ticketId' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('clientName')\">\r\n Client Info\r\n <span *ngIf=\"sortColumName === 'clientName' && sortBy !== 1 || sortColumName !== 'clientName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'clientName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('storeName')\"></div>\r\n Store Info\r\n <span *ngIf=\"sortColumName === 'storeName' && sortBy !== 1 || sortColumName !== 'storeName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </th>\r\n <th><div (click)=\"sortData('issueDate')\">\r\n Issue Identified on\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== 1 || sortColumName !== 'issueDate'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('issueClosedDate')\">\r\n Closed on\r\n <span *ngIf=\"sortColumName === 'issueClosedDate' && sortBy !== 1 || sortColumName !== 'issueClosedDate'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueClosedDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('infraIssue')\">Issue Type\r\n <span *ngIf=\"sortColumName === 'infraIssue' && sortBy !== 1 || sortColumName !== 'infraIssue'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'infraIssue' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span></div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let history of workHistoryTable ; let i = index\">\r\n <td>{{history?.issueDate|customDateFormat}}</td>\r\n <td>{{history?.ticketId ? history?.ticketId :'--'}}</td>\r\n <td>\r\n <div class=\"d-grid ms-3\">\r\n <span>{{history?.clientName ? history?.clientName : '--'}}</span>\r\n <span class=\"textSub mt-1\">ID : {{history?.clientId ? history?.clientId :'--'}}</span>\r\n </div>\r\n </td>\r\n <td>\r\n <div class=\"d-grid ms-3\">\r\n <span class=\"text-primary mb-1\">{{history?.storeName ? history?.storeName :'--'}}</span>\r\n <span class=\"textSub\">ID : {{history?.storeId ? history?.storeId :'--'}}</span>\r\n </div>\r\n </td>\r\n <td>{{history?.issueDate |customDateFormat: '--'}}</td>\r\n <td>{{history?.issueClosedDate|customDateFormat}}</td>\r\n <td>{{history?.infraIssue ? history?.infraIssue :'--'}}</td>\r\n </tr>\r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\"\r\n [totalItems]=\"workHistoryTable.count\" [paginationSizes]=\"[10,20,30]\" [pageSize]=\"limit\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div> \r\n <ng-container *ngIf=\"historyLoading && !historyNodata\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"historyNodata && !historyLoading\">\r\n <div 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-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n\r\n", styles: [".rowbody{background:var(--Gray-50, #F9FAFB)}.issuecard{border-radius:8px;border:1px solid var(--Gray-100, #F2F4F7);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:14px 12px}.issuecard label{color:var(--Black, #101828);font-size:16px;line-height:24px}.issuecard.active{background:var(--Primary-25, #F6FCFF);box-shadow:0 2px 4px -2px #1018280f,0 4px 8px -2px #1018281a}.fw-bold-700{font-weight:700!important}.fw-bold-400{font-weight:400!important}.profile{width:24px;height:24px;overflow:hidden;border-radius:200px}.msgprofile{width:48px!important;height:48px!important;border-radius:200px;overflow:hidden}.timingtext{color:var(--Gray-500, #667085);font-size:12px;line-height:18px}.bg-badge{background-color:#776f6f29!important}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.textSub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.taketicket{color:var(--Gray-500, #667085);font-size:16px;line-height:24px}tr{vertical-align:middle!important}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.img-src{width:25%}.mh-60vh{height:40vh!important}.min-height-60vh{min-height:50vh!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: "directive", type: i6$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: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i3.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.CustomDateFormatPipe, name: "customDateFormat" }] });
|
|
613
613
|
}
|
|
614
614
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: InfraticketsComponent, decorators: [{
|
|
615
615
|
type: Component,
|
|
616
|
-
args: [{ selector: 'lib-infratickets', template: "\r\n<div class=\"card\">\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=\"card-label mb-2\">{{type | titlecase}} Tickets</span>\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div *ngIf=\"userData ==='Workspace'\" 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 type=\"text\" class=\"form-control ps-14 me-2\" \r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchWorkspace\" (change)=\"searchTickets()\"/>\r\n \r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-200px position-absolute top-50px end-0\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"this.selectedIssue === item ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(item)\">{{item}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && (!noData.open || !noData.inprogress || !noData.closed)\" (click)=\"exportData()\" class=\"btn btn-outline p-3 border border-gray ms-2 me-2\" type=\"button\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></button>\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isEdit\" type=\"button\" (click)=\"takeTicket()\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><span class=\"ms-2 text-white\">Take Ticket</span> </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"userData ==='History'\" 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 type=\"text\" class=\"form-control ps-14 me-2\" \r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchHistory\" (change)=\"searchHistoryTable()\" />\r\n \r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"receiveData($event)\" ></lib-filters>\r\n\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !historyNodata\" (click)=\"ExportHistoryasXlsx()\" class=\"btn btn-outline p-3 border border-gray ms-2 me-2 text-nowrap\" type=\"button\"><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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span> Export\r\n </button>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card-body py-2\">\r\n <div class=\"d-flex overflow-auto h-55px\">\r\n <ul (click)=\"userValue($event)\" class=\"nav nav-stretch nav-line-tabs nav-line-tabs-2x border-transparent fs-5 fw-bolder flex-nowrap\">\r\n <li class=\"nav-item cursor-pointer\"><a [ngClass]=\"userData ==='Workspace' ? 'active' :''\"\r\n class=\"nav-link text-active-primary me-6\">Workspace</a>\r\n </li>\r\n <li class=\"nav-item cursor-pointer\"><a [ngClass]=\"userData ==='History' ? 'active' :''\"\r\n class=\"nav-link text-active-primary me-6\">History</a></li>\r\n </ul>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"userData ==='Workspace'\" class=\"card-body\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Open</span><span *ngIf=\"statusOpen?.length > 0 && !loading.open && !noData.open\" class=\"rounded-5 ms-3 px-1 border border-gray bg-badge\">{{statusOpen?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!loading.open && !noData.open\">\r\n <div *ngFor=\"let open of statusOpen; let index = index\">\r\n <div [ngClass]=\"open.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(open)\">\r\n <div *ngIf=\"open.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{open?.storeId ? open?.storeId :'--'}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>{{open?.Date ? open?.Date : '--'}}\r\n </div>\r\n <span *ngIf=\"open?.infraIssue\" class=\"badge badge-light-warning\">{{open?.infraIssue ? open?.infraIssue :'--'}}</span>\r\n <span *ngIf=\"type ==='installation'\" class=\"badge badge-light-primary\">{{open?.installationStatus ? open?.installationStatus :'--'}}</span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div *ngIf=\"open?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'open')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{open?.ticketId ? open?.ticketId : '--'}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"open?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"open?.issueStatus !== 'notidentified'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!open.isOpen\" (click)=\"selectView($event,index,'open')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!open.isOpen && open?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusOpen?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center\"> \r\n <img class=\"mx-auto mb-2\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-2 fw-bold\">No Open Tickets </span>\r\n <button class=\"w-100 btn btn-primary mt-5\" (click)=\"takeTicket()\">Take Ticket</button>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.open\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.open\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto mb-2\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Open Tickets </span>\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isEdit\" class=\"w-100 btn btn-primary mt-5\" (click)=\"takeTicket()\">Take Ticket</button>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Inprogress</span><span *ngIf=\"statusInprogress?.length > 0 && !loading.inprogress && !noData.inprogress\" class=\"rounded-5 ms-3 px-1 border border-gray bg-badge\">{{statusInprogress?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!loading.inprogress && !noData.inprogress\">\r\n <div *ngFor=\"let inprogress of statusInprogress; let index = index\">\r\n <div [ngClass]=\"inprogress.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(inprogress)\">\r\n <div *ngIf=\"inprogress?.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{inprogress?.storeId}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg> {{inprogress?.Date}}\r\n </div>\r\n <span *ngIf=\"inprogress?.infraIssue\" class=\"badge badge-light-warning\">{{inprogress?.infraIssue}}</span>\r\n <span *ngIf=\"type ==='installation' && inprogress?.infraIssue!==''\" class=\"badge badge-light-primary text-capitalize ms-3\">{{inprogress?.installationStatus ? inprogress?.installationStatus :'--'}}</span>\r\n </div>\r\n </div>\r\n <div class=\" d-flex\">\r\n <div *ngIf=\"inprogress?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'inprogress')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{inprogress?.ticketId}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"inprogress?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span class=\"ms-3\" *ngIf=\"inprogress?.issueStatus !== 'notidentified'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!inprogress.isOpen\" (click)=\"selectView($event,index,'inprogress')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!inprogress.isOpen && inprogress?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusInprogress?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center mx-auto\"> \r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-2 fw-bold\">No In-Progress Tickets </span>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.inprogress\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.inprogress\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No In-Progress Tickets </span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\" (click)=\"selectTicket()\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Closed</span><span *ngIf=\"statusClosed?.length > 0 && !noData.closed && !loading.closed\" class=\"rounded-5 ms-3 px-1 border border-gray border-gray bg-badge\">{{statusClosed?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!noData.closed && !loading.closed\">\r\n <div *ngFor=\"let closed of statusClosed; let index = index\">\r\n <div [ngClass]=\"closed.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(closed)\">\r\n <div *ngIf=\"closed?.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{closed?.storeId}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg> {{closed?.Date}}\r\n </div>\r\n <span *ngIf=\"closed?.infraIssue\" [ngClass]=\"closed?.infraIssue === 'Live'? 'badge badge-light-success':''\" class=\"badge badge-light-warning\"> {{closed?.infraIssue}} </span>\r\n </div>\r\n </div>\r\n <div class=\" d-flex\">\r\n <div *ngIf=\"closed?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'closed')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{closed.ticketId}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"closed?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"closed?.issueStatus !== 'notidentified'\" class=\"ms-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!closed.isOpen\" (click)=\"selectView($event,index,'closed')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!closed.isOpen && closed?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusClosed?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center mx-auto\"> \r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Closed Tickets</span>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.closed\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.closed\">\r\n <div class=\"row rowbody\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Closed Tickets </span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div> \r\n</div>\r\n<div *ngIf=\"userData === 'History'\" class=\"card-body\">\r\n <div *ngIf=\"!historyLoading && !historyNodata\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th><div (click)=\"sortData('issueDate')\">\r\n Created on\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== 1 || sortColumName !== 'issueDate' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n <th><div (click)=\"sortData('ticketId')\">\r\n Ticket ID\r\n <span *ngIf=\"sortColumName === 'ticketId' && sortBy !== 1 || sortColumName !== 'ticketId' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'ticketId' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('clientName')\">\r\n Client Info\r\n <span *ngIf=\"sortColumName === 'clientName' && sortBy !== 1 || sortColumName !== 'clientName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'clientName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('storeName')\"></div>\r\n Store Info\r\n <span *ngIf=\"sortColumName === 'storeName' && sortBy !== 1 || sortColumName !== 'storeName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </th>\r\n <th><div (click)=\"sortData('issueDate')\">\r\n Issue Identified on\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== 1 || sortColumName !== 'issueDate'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('issueClosedDate')\">\r\n Closed on\r\n <span *ngIf=\"sortColumName === 'issueClosedDate' && sortBy !== 1 || sortColumName !== 'issueClosedDate'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueClosedDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('infraIssue')\">Issue Type\r\n <span *ngIf=\"sortColumName === 'infraIssue' && sortBy !== 1 || sortColumName !== 'infraIssue'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'infraIssue' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span></div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let history of workHistoryTable ; let i = index\">\r\n <td>{{history?.issueDate|customDateFormat}}</td>\r\n <td>{{history?.ticketId ? history?.ticketId :'--'}}</td>\r\n <td>\r\n <div class=\"d-grid ms-3\">\r\n <span>{{history?.clientName ? history?.clientName : '--'}}</span>\r\n <span class=\"textSub mt-1\">ID : {{history?.clientId ? history?.clientId :'--'}}</span>\r\n </div>\r\n </td>\r\n <td>\r\n <div class=\"d-grid ms-3\">\r\n <span class=\"text-primary mb-1\">{{history?.storeName ? history?.storeName :'--'}}</span>\r\n <span class=\"textSub\">ID : {{history?.storeId ? history?.storeId :'--'}}</span>\r\n </div>\r\n </td>\r\n <td>{{history?.issueDate |customDateFormat: '--'}}</td>\r\n <td>{{history?.issueClosedDate|customDateFormat}}</td>\r\n <td>{{history?.infraIssue ? history?.infraIssue :'--'}}</td>\r\n </tr>\r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\"\r\n [totalItems]=\"workHistoryTable.count\" [paginationSizes]=\"[10,20,30]\" [pageSize]=\"limit\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div> \r\n <ng-container *ngIf=\"historyLoading && !historyNodata\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"historyNodata && !historyLoading\">\r\n <div 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-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n\r\n", styles: [".rowbody{background:var(--Gray-50, #F9FAFB)}.issuecard{border-radius:8px;border:1px solid var(--Gray-100, #F2F4F7);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:14px 12px}.issuecard label{color:var(--Black, #101828);font-size:16px;line-height:24px}.issuecard.active{background:var(--Primary-25, #F6FCFF);box-shadow:0 2px 4px -2px #1018280f,0 4px 8px -2px #1018281a}.fw-bold-700{font-weight:700!important}.fw-bold-400{font-weight:400!important}.profile{width:24px;height:24px;overflow:hidden;border-radius:200px}.msgprofile{width:48px!important;height:48px!important;border-radius:200px;overflow:hidden}.timingtext{color:var(--Gray-500, #667085);font-size:12px;line-height:18px}.bg-badge{background-color:#776f6f29!important}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.textSub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.taketicket{color:var(--Gray-500, #667085);font-size:16px;line-height:24px}tr{vertical-align:middle!important}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.img-src{width:25%}.mh-60vh{height:40vh!important}.min-height-60vh{min-height:50vh!important}\n"] }]
|
|
616
|
+
args: [{ selector: 'lib-infratickets', template: "\r\n<div class=\"card\">\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=\"card-label mb-2\">{{type | titlecase}} Tickets</span>\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div *ngIf=\"userData ==='Workspace'\" 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 type=\"text\" class=\"form-control ps-14 me-2\" \r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchWorkspace\" (change)=\"searchTickets()\"/>\r\n \r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-200px position-absolute top-50px end-0\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"this.selectedIssue === item ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(item)\">{{item}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && (!noData.open || !noData.inprogress || !noData.closed)\" (click)=\"exportData()\" class=\"btn btn-outline p-3 border border-gray ms-2 me-2\" type=\"button\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></button>\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isEdit\" type=\"button\" (click)=\"takeTicket()\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><span class=\"ms-2 text-white\">Take Ticket</span> </button>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"userData ==='History'\" 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 type=\"text\" class=\"form-control ps-14 me-2\" \r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchHistory\" (change)=\"searchHistoryTable()\" />\r\n \r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"receiveData($event)\" ></lib-filters>\r\n\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !historyNodata\" (click)=\"ExportHistoryasXlsx()\" class=\"btn btn-outline p-3 border border-gray ms-2 me-2 text-nowrap\" type=\"button\"><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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span> Export\r\n </button>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card-body py-2\">\r\n <div class=\"d-flex overflow-auto h-55px\">\r\n <ul class=\"nav nav-stretch nav-line-tabs nav-line-tabs-2x border-transparent fs-5 fw-bolder flex-nowrap\">\r\n <li (click)=\"userValue('Workspace')\" class=\"nav-item cursor-pointer\"><a [ngClass]=\"userData ==='Workspace' ? 'active' :''\"\r\n class=\"nav-link text-active-primary me-6\">Workspace</a>\r\n </li>\r\n <li (click)=\"userValue('History')\" class=\"nav-item cursor-pointer\"><a [ngClass]=\"userData ==='History' ? 'active' :''\"\r\n class=\"nav-link text-active-primary me-6\">History</a></li>\r\n </ul>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"userData ==='Workspace'\" class=\"card-body\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Open</span><span *ngIf=\"statusOpen?.length > 0 && !loading.open && !noData.open\" class=\"rounded-5 ms-3 px-1 border border-gray bg-badge\">{{statusOpen?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!loading.open && !noData.open\">\r\n <div *ngFor=\"let open of statusOpen; let index = index\">\r\n <div [ngClass]=\"open.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(open)\">\r\n <div *ngIf=\"open.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{open?.storeId ? open?.storeId :'--'}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>{{open?.Date ? open?.Date : '--'}}\r\n </div>\r\n <span *ngIf=\"open?.infraIssue\" class=\"badge badge-light-warning\">{{open?.infraIssue ? open?.infraIssue :'--'}}</span>\r\n <span *ngIf=\"type ==='installation'\" class=\"badge badge-light-primary\">{{open?.installationStatus ? open?.installationStatus :'--'}}</span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div *ngIf=\"open?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'open')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{open?.ticketId ? open?.ticketId : '--'}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"open?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"open?.issueStatus !== 'notidentified'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!open.isOpen\" (click)=\"selectView($event,index,'open')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!open.isOpen && open?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusOpen?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center\"> \r\n <img class=\"mx-auto mb-2\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-2 fw-bold\">No Open Tickets </span>\r\n <button class=\"w-100 btn btn-primary mt-5\" (click)=\"takeTicket()\">Take Ticket</button>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.open\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.open\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto mb-2\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Open Tickets </span>\r\n <button *ngIf=\"(gs.userAccess | async)?.manage_tickets_isEdit\" class=\"w-100 btn btn-primary mt-5\" (click)=\"takeTicket()\">Take Ticket</button>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Inprogress</span><span *ngIf=\"statusInprogress?.length > 0 && !loading.inprogress && !noData.inprogress\" class=\"rounded-5 ms-3 px-1 border border-gray bg-badge\">{{statusInprogress?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!loading.inprogress && !noData.inprogress\">\r\n <div *ngFor=\"let inprogress of statusInprogress; let index = index\">\r\n <div [ngClass]=\"inprogress.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(inprogress)\">\r\n <div *ngIf=\"inprogress?.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{inprogress?.storeId}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg> {{inprogress?.Date}}\r\n </div>\r\n <span *ngIf=\"inprogress?.infraIssue\" class=\"badge badge-light-warning\">{{inprogress?.infraIssue}}</span>\r\n <span *ngIf=\"type ==='installation' && inprogress?.infraIssue!==''\" class=\"badge badge-light-primary text-capitalize ms-3\">{{inprogress?.installationStatus ? inprogress?.installationStatus :'--'}}</span>\r\n </div>\r\n </div>\r\n <div class=\" d-flex\">\r\n <div *ngIf=\"inprogress?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'inprogress')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{inprogress?.ticketId}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"inprogress?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span class=\"ms-3\" *ngIf=\"inprogress?.issueStatus !== 'notidentified'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!inprogress.isOpen\" (click)=\"selectView($event,index,'inprogress')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!inprogress.isOpen && inprogress?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusInprogress?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center mx-auto\"> \r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-2 fw-bold\">No In-Progress Tickets </span>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.inprogress\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.inprogress\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No In-Progress Tickets </span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"w-100 h-100 rounded-2 overflow-hidden\" (click)=\"selectTicket()\">\r\n <div class=\"badge-light-default px-3 py-4\">\r\n <span>Closed</span><span *ngIf=\"statusClosed?.length > 0 && !noData.closed && !loading.closed\" class=\"rounded-5 ms-3 px-1 border border-gray border-gray bg-badge\">{{statusClosed?.length}}</span>\r\n </div>\r\n <div class=\"rowbody h-100 px-4 py-3\">\r\n <div *ngIf=\"!noData.closed && !loading.closed\">\r\n <div *ngFor=\"let closed of statusClosed; let index = index\">\r\n <div [ngClass]=\"closed.isOpen ? 'active':''\" class=\"issuecard cursor-pointer w-100 mb-5\" (click)=\"routetoTicket(closed)\">\r\n <div *ngIf=\"closed?.isOpen\" class=\"d-flex justify-content-between\">\r\n <div class=\"mb-5\">\r\n <label class=\"fw-semibold\">{{closed?.storeId}}</label><br>\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"badge badge-light-default me-3\">\r\n <svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3732_60277)\">\r\n <path d=\"M8 1V3M4 1V3M1.5 5H10.5M2.5 2H9.5C10.0523 2 10.5 2.44772 10.5 3V10C10.5 10.5523 10.0523 11 9.5 11H2.5C1.94772 11 1.5 10.5523 1.5 10V3C1.5 2.44772 1.94772 2 2.5 2Z\" stroke=\"#667085\" stroke-width=\"1.1\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3732_60277\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg> {{closed?.Date}}\r\n </div>\r\n <span *ngIf=\"closed?.infraIssue\" [ngClass]=\"closed?.infraIssue === 'Live'? 'badge badge-light-success':''\" class=\"badge badge-light-warning\"> {{closed?.infraIssue}} </span>\r\n </div>\r\n </div>\r\n <div class=\" d-flex\">\r\n <div *ngIf=\"closed?.notification\" class=\"profile d-flex align-items-centre justify-content-centre me-3\">\r\n <img src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <span (click)=\"selectView($event,index,'closed')\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between text-center align-items-center\"> \r\n <div class=\"d-flex justify-content-between\" > \r\n <span class=\" d-flex align-items-center\"><svg class=\"me-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" fill=\"#667085\"/>\r\n <path d=\"M10.7966 1.42752C10.6541 1.29681 10.4667 1.22617 10.2733 1.23037C10.08 1.23456 9.8958 1.31325 9.75911 1.45002L1.48911 9.72002C1.41938 9.78968 1.36406 9.87239 1.32632 9.96344C1.28857 10.0545 1.26915 10.1521 1.26915 10.2506C1.26915 10.3492 1.28857 10.4468 1.32632 10.5379C1.36406 10.6289 1.41938 10.7116 1.48911 10.7813L2.64661 11.9388C2.65632 11.9418 2.66647 11.943 2.67661 11.9425C2.71411 11.9425 2.76411 11.9288 2.81161 11.8975C3.26845 11.5927 3.8168 11.4557 4.36331 11.5097C4.90983 11.5637 5.42073 11.8055 5.80905 12.1938C6.19738 12.5822 6.43913 13.0931 6.49316 13.6396C6.54718 14.1861 6.41014 14.7344 6.10536 15.1913C6.07792 15.2311 6.06231 15.2779 6.06036 15.3263C6.06036 15.3425 6.06286 15.3513 6.06411 15.355L7.19411 16.4863C7.26512 16.5574 7.34971 16.6136 7.44285 16.6514C7.53599 16.6892 7.63579 16.7079 7.7363 16.7064C7.83682 16.7049 7.936 16.6832 8.02796 16.6426C8.11992 16.602 8.20278 16.5433 8.27161 16.47L16.5204 7.70502C16.5883 7.63267 16.6412 7.54755 16.676 7.4546C16.7108 7.36165 16.7268 7.26272 16.7231 7.16354C16.7193 7.06436 16.696 6.96691 16.6543 6.87683C16.6126 6.78675 16.5535 6.70583 16.4804 6.63877L15.3729 5.62252H15.3691C15.3514 5.61902 15.3331 5.61902 15.3154 5.62252C15.2448 5.63722 15.1806 5.67348 15.1316 5.72627C14.9227 5.96305 14.6687 6.15579 14.3845 6.29323C14.1002 6.43067 13.7914 6.51005 13.4761 6.52673C13.1608 6.54341 12.8453 6.49704 12.5481 6.39035C12.251 6.28366 11.978 6.11879 11.7453 5.90537C11.5126 5.69195 11.3248 5.43428 11.1929 5.14742C11.061 4.86055 10.9876 4.55027 10.977 4.2347C10.9664 3.91913 11.0188 3.60462 11.1312 3.30956C11.2436 3.01449 11.4137 2.74481 11.6316 2.51627C11.6797 2.46264 11.7098 2.39535 11.7179 2.32377C11.7201 2.30488 11.7184 2.28572 11.7129 2.26752L10.7966 1.42752ZM9.05286 0.742522C9.37176 0.423638 9.80145 0.240174 10.2523 0.230393C10.7032 0.220611 11.1404 0.385268 11.4729 0.690022L12.3891 1.53127C12.6629 1.78127 12.7391 2.12252 12.7141 2.41377C12.6879 2.70127 12.5616 2.98252 12.3666 3.19377C12.2446 3.3269 12.1499 3.48276 12.0881 3.65246C12.0263 3.82216 11.9985 4.00237 12.0064 4.18281C12.0142 4.36325 12.0575 4.54037 12.1338 4.70407C12.2101 4.86778 12.3179 5.01485 12.451 5.1369C12.5841 5.25894 12.74 5.35358 12.9097 5.41539C13.0794 5.4772 13.2596 5.50498 13.44 5.49714C13.6205 5.48931 13.7976 5.44601 13.9613 5.36972C14.125 5.29344 14.2721 5.18565 14.3941 5.05252C14.5879 4.84002 14.8566 4.69002 15.1404 4.63877C15.3004 4.60665 15.4656 4.61218 15.6231 4.65492C15.7806 4.69765 15.926 4.77643 16.0479 4.88502L17.1566 5.90127C17.3273 6.0579 17.4652 6.24687 17.5623 6.4572C17.6594 6.66754 17.7138 6.89507 17.7223 7.12658C17.7308 7.35809 17.6932 7.58899 17.6118 7.80587C17.5303 8.02276 17.4066 8.22131 17.2479 8.39002L9.00036 17.155C8.83975 17.3257 8.64649 17.4624 8.43206 17.5569C8.21763 17.6515 7.98638 17.702 7.75205 17.7055C7.51771 17.709 7.28506 17.6654 7.0679 17.5773C6.85074 17.4892 6.65349 17.3583 6.48786 17.1925L5.35786 16.0625C4.92411 15.6288 5.02911 15.0038 5.27411 14.6375C5.44988 14.3731 5.52871 14.0559 5.4972 13.74C5.46569 13.424 5.32579 13.1287 5.10125 12.9041C4.87672 12.6796 4.58139 12.5397 4.26542 12.5082C3.94945 12.4767 3.63231 12.5555 3.36786 12.7313C2.99911 12.975 2.37536 13.08 1.94161 12.645L0.784111 11.4875C0.621589 11.325 0.492669 11.1321 0.404712 10.9198C0.316755 10.7074 0.271484 10.4798 0.271484 10.25C0.271484 10.0202 0.316755 9.79262 0.404712 9.58029C0.492669 9.36795 0.621589 9.17503 0.784111 9.01252L9.05286 0.742522Z\" stroke=\"#667085\"/>\r\n </svg> {{closed.ticketId}} </span>\r\n </div>\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <span *ngIf=\"closed?.ticketType === 'refreshticket'\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"14\" viewBox=\"0 0 17 14\" fill=\"none\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.94602 4.98881L2.66602 6.33881L2.00602 6.07881L0.666016 2.83881L1.58602 2.45881L2.39602 4.40881C2.93977 3.04801 3.92872 1.91169 5.20145 1.18532C6.47419 0.458951 7.95554 0.185426 9.40375 0.409387C10.852 0.633349 12.1815 1.34157 13.1754 2.41846C14.1692 3.49535 14.7687 4.87732 14.876 6.33881H13.876C13.7616 5.09008 13.2224 3.91836 12.3484 3.01919C11.4743 2.12003 10.3184 1.54781 9.0734 1.39804C7.82842 1.24826 6.56973 1.53 5.50739 2.19622C4.44505 2.86244 3.64332 3.87284 3.23602 5.05881L5.55602 4.05881L5.94602 4.98881ZM14.806 7.66881L16.146 10.8988L15.226 11.3388L14.406 9.33881C13.858 10.7049 12.8618 11.8442 11.581 12.5696C10.3001 13.295 8.81077 13.5634 7.35728 13.3309C5.9038 13.0983 4.57255 12.3786 3.582 11.2898C2.59145 10.2009 2.00046 8.80775 1.90602 7.33881H2.90602V6.83881C2.90882 8.12627 3.36402 9.3718 4.19203 10.3577C5.02005 11.3436 6.16821 12.0071 7.43584 12.2322C8.70346 12.4574 10.0099 12.2299 11.1268 11.5895C12.2437 10.9491 13.1 9.93655 13.546 8.72881L11.296 9.65881L10.906 8.73881L14.156 7.38881L14.806 7.66881Z\" fill=\"#98A2B3\"/>\r\n <path d=\"M8.40625 7.54004C8.95853 7.54004 9.40625 7.09232 9.40625 6.54004C9.40625 5.98775 8.95853 5.54004 8.40625 5.54004C7.85397 5.54004 7.40625 5.98775 7.40625 6.54004C7.40625 7.09232 7.85397 7.54004 8.40625 7.54004Z\" fill=\"#98A2B3\"/>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"closed?.issueStatus !== 'notidentified'\" class=\"ms-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3827_12061)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.20065 10.3333H9.15621V12.3333H7.20065V10.3333ZM9.15621 4.33327H7.20065V9.33326H9.15621V4.33327ZM10.6229 5.83327L9.6451 6.83327L12.0895 9.33326L16.0007 4.83327L15.0229 3.83327L12.0895 7.33326L10.6229 5.83327ZM8.17843 14.0333C6.70108 14.0306 5.28499 13.4292 4.24034 12.3608C3.1957 11.2925 2.60768 9.84418 2.6051 8.33326C2.6051 5.19327 5.10821 2.63327 8.17843 2.63327C9.96776 2.63327 11.5518 3.51327 12.5784 4.83327L13.478 3.91327C12.8395 3.10534 12.0319 2.45415 11.1147 2.00765C10.1976 1.56115 9.19419 1.3307 8.17843 1.33327C4.40421 1.33327 1.33398 4.47327 1.33398 8.33326C1.33398 12.1933 4.40421 15.3333 8.17843 15.3333C11.9527 15.3333 15.0229 12.1933 15.0229 8.33326L13.5367 9.85326C12.8913 12.2633 10.7402 14.0433 8.17843 14.0433V14.0333Z\" fill=\"#98A2B3\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3827_12061\">\r\n <rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"!closed.isOpen\" (click)=\"selectView($event,index,'closed')\" class=\"ms-3\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M13.166 2.5H18.166M18.166 2.5V7.5M18.166 2.5L12.3327 8.33333M8.16602 17.5H3.16602M3.16602 17.5V12.5M3.16602 17.5L8.99935 11.6667\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <div *ngIf=\"!closed.isOpen && closed?.notification\" class=\"profile d-flex align-items-centre justify-content-centre ms-3\">\r\n <img class=\"\" src=\"./assets/tango/Images/Bellnotification.png\" alt=\"\">\r\n </div>\r\n <!-- <img *ngIf=\"cardView\" class=\"profile ms-3\" src=\"./assets/tango/Images/gropmodal.png\" alt=\"\"> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"statusClosed?.length === 0 || !noData && !loading\" class=\"w-100 mt-10 mb-10 mh-60vh d-grid text-center mx-auto\"> \r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Closed Tickets</span>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading?.closed\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData?.closed\">\r\n <div class=\"row rowbody\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body mh-60vh d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"mx-auto\" src=\"./assets/tango/Images/taketicket.svg\">\r\n <span class=\"taketicket mt-5 fw-bold\">No Closed Tickets </span>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container> \r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div> \r\n</div>\r\n<div *ngIf=\"userData === 'History'\" class=\"card-body\">\r\n <div *ngIf=\"!historyLoading && !historyNodata\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th><div (click)=\"sortData('issueDate')\">\r\n Created on\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== 1 || sortColumName !== 'issueDate' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n <th><div (click)=\"sortData('ticketId')\">\r\n Ticket ID\r\n <span *ngIf=\"sortColumName === 'ticketId' && sortBy !== 1 || sortColumName !== 'ticketId' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'ticketId' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('clientName')\">\r\n Client Info\r\n <span *ngIf=\"sortColumName === 'clientName' && sortBy !== 1 || sortColumName !== 'clientName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'clientName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('storeName')\"></div>\r\n Store Info\r\n <span *ngIf=\"sortColumName === 'storeName' && sortBy !== 1 || sortColumName !== 'storeName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </th>\r\n <th><div (click)=\"sortData('issueDate')\">\r\n Issue Identified on\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== 1 || sortColumName !== 'issueDate'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('issueClosedDate')\">\r\n Closed on\r\n <span *ngIf=\"sortColumName === 'issueClosedDate' && sortBy !== 1 || sortColumName !== 'issueClosedDate'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'issueClosedDate' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th><div (click)=\"sortData('infraIssue')\">Issue Type\r\n <span *ngIf=\"sortColumName === 'infraIssue' && sortBy !== 1 || sortColumName !== 'infraIssue'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumName === 'infraIssue' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span></div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let history of workHistoryTable ; let i = index\">\r\n <td>{{history?.issueDate|customDateFormat}}</td>\r\n <td>{{history?.ticketId ? history?.ticketId :'--'}}</td>\r\n <td>\r\n <div class=\"d-grid ms-3\">\r\n <span>{{history?.clientName ? history?.clientName : '--'}}</span>\r\n <span class=\"textSub mt-1\">ID : {{history?.clientId ? history?.clientId :'--'}}</span>\r\n </div>\r\n </td>\r\n <td>\r\n <div class=\"d-grid ms-3\">\r\n <span class=\"text-primary mb-1\">{{history?.storeName ? history?.storeName :'--'}}</span>\r\n <span class=\"textSub\">ID : {{history?.storeId ? history?.storeId :'--'}}</span>\r\n </div>\r\n </td>\r\n <td>{{history?.issueDate |customDateFormat: '--'}}</td>\r\n <td>{{history?.issueClosedDate|customDateFormat}}</td>\r\n <td>{{history?.infraIssue ? history?.infraIssue :'--'}}</td>\r\n </tr>\r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\"\r\n [totalItems]=\"workHistoryTable.count\" [paginationSizes]=\"[10,20,30]\" [pageSize]=\"limit\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div> \r\n <ng-container *ngIf=\"historyLoading && !historyNodata\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"historyNodata && !historyLoading\">\r\n <div 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-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n\r\n", styles: [".rowbody{background:var(--Gray-50, #F9FAFB)}.issuecard{border-radius:8px;border:1px solid var(--Gray-100, #F2F4F7);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:14px 12px}.issuecard label{color:var(--Black, #101828);font-size:16px;line-height:24px}.issuecard.active{background:var(--Primary-25, #F6FCFF);box-shadow:0 2px 4px -2px #1018280f,0 4px 8px -2px #1018281a}.fw-bold-700{font-weight:700!important}.fw-bold-400{font-weight:400!important}.profile{width:24px;height:24px;overflow:hidden;border-radius:200px}.msgprofile{width:48px!important;height:48px!important;border-radius:200px;overflow:hidden}.timingtext{color:var(--Gray-500, #667085);font-size:12px;line-height:18px}.bg-badge{background-color:#776f6f29!important}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.textSub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.taketicket{color:var(--Gray-500, #667085);font-size:16px;line-height:24px}tr{vertical-align:middle!important}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.img-src{width:25%}.mh-60vh{height:40vh!important}.min-height-60vh{min-height:50vh!important}\n"] }]
|
|
617
617
|
}], ctorParameters: () => [{ type: i2.ActivatedRoute }, { type: i2.Router }, { type: i0.ChangeDetectorRef }, { type: DataService }, { type: i3.ToastService }, { type: TicketsService }, { type: DataService }, { type: i4.GlobalStateService }, { type: ExcelService }], propDecorators: { onClick: [{
|
|
618
618
|
type: HostListener,
|
|
619
619
|
args: ['document:click', ['$event']]
|
|
@@ -940,6 +940,7 @@ class EdgeCameraviewComponent {
|
|
|
940
940
|
currentDate;
|
|
941
941
|
value;
|
|
942
942
|
CameraDetails;
|
|
943
|
+
destroy$ = new Subject();
|
|
943
944
|
constructor(infraService, cd) {
|
|
944
945
|
this.infraService = infraService;
|
|
945
946
|
this.cd = cd;
|
|
@@ -954,10 +955,10 @@ class EdgeCameraviewComponent {
|
|
|
954
955
|
this.noData = false;
|
|
955
956
|
let obj = {
|
|
956
957
|
storeId: this.value?.storeId,
|
|
957
|
-
from: this.value?.startTime
|
|
958
|
-
to: this.value?.endTime
|
|
958
|
+
from: this.value?.startTime,
|
|
959
|
+
to: this.value?.endTime
|
|
959
960
|
};
|
|
960
|
-
this.infraService.viewedgeAppLog(obj).subscribe({
|
|
961
|
+
this.infraService.viewedgeAppLog(obj).pipe(takeUntil(this.destroy$)).subscribe({
|
|
961
962
|
next: (res) => {
|
|
962
963
|
if (res && res?.code == 200) {
|
|
963
964
|
this.viewEdgeAppLogList = res?.data;
|
|
@@ -973,7 +974,7 @@ class EdgeCameraviewComponent {
|
|
|
973
974
|
storeId: this.value?.storeId
|
|
974
975
|
// storeId:"201-129"
|
|
975
976
|
};
|
|
976
|
-
this.infraService.getCameraImages(data).subscribe({
|
|
977
|
+
this.infraService.getCameraImages(data).pipe(takeUntil(this.destroy$)).subscribe({
|
|
977
978
|
next: (res) => {
|
|
978
979
|
if (res && res.code == 200) {
|
|
979
980
|
this.CameraDetails = res?.data;
|
|
@@ -1020,6 +1021,7 @@ class EdgeappLogComponent {
|
|
|
1020
1021
|
selectedDate;
|
|
1021
1022
|
ticketId;
|
|
1022
1023
|
ticketInfo;
|
|
1024
|
+
isCustomDate;
|
|
1023
1025
|
constructor(modalService, infraService, cd, dataservice, gs, route) {
|
|
1024
1026
|
this.modalService = modalService;
|
|
1025
1027
|
this.infraService = infraService;
|
|
@@ -1031,6 +1033,10 @@ class EdgeappLogComponent {
|
|
|
1031
1033
|
console.log('route.snapshot', this.ticketId);
|
|
1032
1034
|
}
|
|
1033
1035
|
ngOnInit() {
|
|
1036
|
+
this.isCustomDate = (m) => {
|
|
1037
|
+
const isValidDate = m > this.dayjs();
|
|
1038
|
+
return isValidDate ? 'invalid-date' : false;
|
|
1039
|
+
};
|
|
1034
1040
|
this.selectedDateRange.startDate = this.dayjs().utc().format('DD-MM-YYYY');
|
|
1035
1041
|
this.selectedDate = this.dayjs().utc().format('YYYY-MM-DD');
|
|
1036
1042
|
this.getEdgeAppLogTable();
|
|
@@ -1107,21 +1113,30 @@ class EdgeappLogComponent {
|
|
|
1107
1113
|
let obj = {
|
|
1108
1114
|
storeName: this.ticketInfo?.storeName,
|
|
1109
1115
|
storeId: this.storeId,
|
|
1110
|
-
startTime: data.startTime,
|
|
1111
|
-
endTime: data.endTime
|
|
1116
|
+
startTime: dayjs(`1991-01-01 ${data.startTime}`, 'YYYY-MM-DD hh:mm A').format("HH:mm"),
|
|
1117
|
+
endTime: dayjs(`1991-01-01 ${data.endTime}`, 'YYYY-MM-DD hh:mm A').format("HH:mm")
|
|
1112
1118
|
};
|
|
1119
|
+
console.log(obj);
|
|
1113
1120
|
const modalRef = this.modalService.open(EdgeCameraviewComponent, {
|
|
1114
1121
|
centered: true,
|
|
1115
1122
|
size: 'lg',
|
|
1116
1123
|
});
|
|
1117
1124
|
modalRef.componentInstance.value = obj;
|
|
1118
1125
|
}
|
|
1126
|
+
onStartDateChange(event) {
|
|
1127
|
+
if (this.dayjs(event.startDate).isValid()) {
|
|
1128
|
+
this.isCustomDate = (m) => {
|
|
1129
|
+
const isValidDate = m > this.dayjs() || m > this.dayjs(event.startDate.add(90, "days"));
|
|
1130
|
+
return isValidDate ? "invalid-date" : false;
|
|
1131
|
+
};
|
|
1132
|
+
}
|
|
1133
|
+
}
|
|
1119
1134
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EdgeappLogComponent, deps: [{ token: i1$1.NgbModal }, { token: TicketsService }, { token: i0.ChangeDetectorRef }, { token: DataService }, { token: i4.GlobalStateService }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
1120
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: EdgeappLogComponent, selector: "lib-edgeapp-log", inputs: { storeId: "storeId" }, ngImport: i0, template: "<div class=\"card\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title\"> \r\n <div class=\"badge-light-primary text-primary rounded-2 px-5 py-3\">Edge App Logs</div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !noData\" class=\"btn btn-default btn-outline\" (click)=\"edgeAppExportasXlsx()\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M17.5 12.5264V15.8597C17.5 16.3017 17.3244 16.7257 17.0118 17.0382C16.6993 17.3508 16.2754 17.5264 15.8333 17.5264H4.16667C3.72464 17.5264 3.30072 17.3508 2.98816 17.0382C2.67559 16.7257 2.5 16.3017 2.5 15.8597V12.5264M14.1667 6.69303L10 2.52637M10 2.52637L5.83333 6.69303M10 2.52637V12.5264\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span> Export\r\n </div>\r\n <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [singleDatePicker]=\"true\" [drops]=\"'down'\"\r\n [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div *ngIf=\"!loading && !noData\" class=\"table-responsive\">\r\n <table class=\"table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>Time Stamp</th>\r\n <th>Downtime</th>\r\n <th>Avg Internet Speed</th>\r\n <th>App Status</th>\r\n <th>Files Pushed</th>\r\n <th>Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of getEdgeAppLoveValue;let i=index;\">\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <span><img src='./assets/tango/Images/document.svg'></span>\r\n <div class=\"d-grid ms-3\">\r\n <span>{{obj.startTime}} - {{obj.endTime}}</span>\r\n <span class=\"textSub mt-1\">{{obj.hourStatus}}</span>\r\n </div>\r\n </div>\r\n </td>\r\n <td>{{obj.downtime}} mins</td>\r\n <td>{{obj.Internetspeed ? obj.Internetspeed:'--'}}</td>\r\n <td><span class=\"badge badge-light-success text-success\">{{obj.AppStatus ? obj.AppStatus :'--'}}</span></td>\r\n <td>{{obj.files_pushed ? obj.files_pushed:'--'}}</td>\r\n <td><span (click)=\"openCameraView(obj)\" class=\"cursor-pointer\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4652_11479)\">\r\n <path d=\"M0.833984 10.0265C0.833984 10.0265 4.16732 3.35986 10.0007 3.35986C15.834 3.35986 19.1673 10.0265 19.1673 10.0265C19.1673 10.0265 15.834 16.6932 10.0007 16.6932C4.16732 16.6932 0.833984 10.0265 0.833984 10.0265Z\" stroke=\"#475467\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n <path d=\"M10.0007 12.5265C11.3814 12.5265 12.5006 11.4072 12.5006 10.0265C12.5006 8.64582 11.3814 7.52653 10.0007 7.52653C8.61994 7.52653 7.50065 8.64582 7.50065 10.0265C7.50065 11.4072 8.61994 12.5265 10.0007 12.5265Z\" stroke=\"#475467\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4652_11479\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span></td>\r\n </tr>\r\n \r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <ng-container *ngIf=\"loading\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\r\n <div 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-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", styles: [".textSub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}tr{vertical-align:middle!important}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}\n"], dependencies: [{ kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6$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: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.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: "pipe", type: i6.AsyncPipe, name: "async" }] });
|
|
1135
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: EdgeappLogComponent, selector: "lib-edgeapp-log", inputs: { storeId: "storeId" }, ngImport: i0, template: "<div class=\"card\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title\"> \r\n <div class=\"badge-light-primary text-primary rounded-2 px-5 py-3\">Edge App Logs</div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !noData\" class=\"btn btn-default btn-outline\" (click)=\"edgeAppExportasXlsx()\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M17.5 12.5264V15.8597C17.5 16.3017 17.3244 16.7257 17.0118 17.0382C16.6993 17.3508 16.2754 17.5264 15.8333 17.5264H4.16667C3.72464 17.5264 3.30072 17.3508 2.98816 17.0382C2.67559 16.7257 2.5 16.3017 2.5 15.8597V12.5264M14.1667 6.69303L10 2.52637M10 2.52637L5.83333 6.69303M10 2.52637V12.5264\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span> Export\r\n </div>\r\n <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [singleDatePicker]=\"true\" [drops]=\"'down'\"\r\n [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div *ngIf=\"!loading && !noData\" class=\"table-responsive\">\r\n <table class=\"table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>Time Stamp</th>\r\n <th>Downtime</th>\r\n <th>Avg Internet Speed</th>\r\n <th>App Status</th>\r\n <th>Files Pushed</th>\r\n <th>Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of getEdgeAppLoveValue;let i=index;\">\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <span><img src='./assets/tango/Images/document.svg'></span>\r\n <div class=\"d-grid ms-3\">\r\n <span>{{obj.startTime}} - {{obj.endTime}}</span>\r\n <span class=\"textSub mt-1\">{{obj.hourStatus}}</span>\r\n </div>\r\n </div>\r\n </td>\r\n <td>{{obj.downtime}} mins</td>\r\n <td>{{obj.Internetspeed ? obj.Internetspeed:'--'}}</td>\r\n <td><span class=\"badge badge-light-success text-success\">{{obj.AppStatus ? obj.AppStatus :'--'}}</span></td>\r\n <td>{{obj.files_pushed ? obj.files_pushed:'--'}}</td>\r\n <td><span (click)=\"openCameraView(obj)\" class=\"cursor-pointer\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4652_11479)\">\r\n <path d=\"M0.833984 10.0265C0.833984 10.0265 4.16732 3.35986 10.0007 3.35986C15.834 3.35986 19.1673 10.0265 19.1673 10.0265C19.1673 10.0265 15.834 16.6932 10.0007 16.6932C4.16732 16.6932 0.833984 10.0265 0.833984 10.0265Z\" stroke=\"#475467\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n <path d=\"M10.0007 12.5265C11.3814 12.5265 12.5006 11.4072 12.5006 10.0265C12.5006 8.64582 11.3814 7.52653 10.0007 7.52653C8.61994 7.52653 7.50065 8.64582 7.50065 10.0265C7.50065 11.4072 8.61994 12.5265 10.0007 12.5265Z\" stroke=\"#475467\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4652_11479\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span></td>\r\n </tr>\r\n \r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <ng-container *ngIf=\"loading\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\r\n <div 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-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", styles: [".textSub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}tr{vertical-align:middle!important}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}\n"], dependencies: [{ kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6$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: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.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: "pipe", type: i6.AsyncPipe, name: "async" }] });
|
|
1121
1136
|
}
|
|
1122
1137
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EdgeappLogComponent, decorators: [{
|
|
1123
1138
|
type: Component,
|
|
1124
|
-
args: [{ selector: 'lib-edgeapp-log', template: "<div class=\"card\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title\"> \r\n <div class=\"badge-light-primary text-primary rounded-2 px-5 py-3\">Edge App Logs</div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !noData\" class=\"btn btn-default btn-outline\" (click)=\"edgeAppExportasXlsx()\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M17.5 12.5264V15.8597C17.5 16.3017 17.3244 16.7257 17.0118 17.0382C16.6993 17.3508 16.2754 17.5264 15.8333 17.5264H4.16667C3.72464 17.5264 3.30072 17.3508 2.98816 17.0382C2.67559 16.7257 2.5 16.3017 2.5 15.8597V12.5264M14.1667 6.69303L10 2.52637M10 2.52637L5.83333 6.69303M10 2.52637V12.5264\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span> Export\r\n </div>\r\n <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [singleDatePicker]=\"true\" [drops]=\"'down'\"\r\n [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div *ngIf=\"!loading && !noData\" class=\"table-responsive\">\r\n <table class=\"table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>Time Stamp</th>\r\n <th>Downtime</th>\r\n <th>Avg Internet Speed</th>\r\n <th>App Status</th>\r\n <th>Files Pushed</th>\r\n <th>Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of getEdgeAppLoveValue;let i=index;\">\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <span><img src='./assets/tango/Images/document.svg'></span>\r\n <div class=\"d-grid ms-3\">\r\n <span>{{obj.startTime}} - {{obj.endTime}}</span>\r\n <span class=\"textSub mt-1\">{{obj.hourStatus}}</span>\r\n </div>\r\n </div>\r\n </td>\r\n <td>{{obj.downtime}} mins</td>\r\n <td>{{obj.Internetspeed ? obj.Internetspeed:'--'}}</td>\r\n <td><span class=\"badge badge-light-success text-success\">{{obj.AppStatus ? obj.AppStatus :'--'}}</span></td>\r\n <td>{{obj.files_pushed ? obj.files_pushed:'--'}}</td>\r\n <td><span (click)=\"openCameraView(obj)\" class=\"cursor-pointer\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4652_11479)\">\r\n <path d=\"M0.833984 10.0265C0.833984 10.0265 4.16732 3.35986 10.0007 3.35986C15.834 3.35986 19.1673 10.0265 19.1673 10.0265C19.1673 10.0265 15.834 16.6932 10.0007 16.6932C4.16732 16.6932 0.833984 10.0265 0.833984 10.0265Z\" stroke=\"#475467\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n <path d=\"M10.0007 12.5265C11.3814 12.5265 12.5006 11.4072 12.5006 10.0265C12.5006 8.64582 11.3814 7.52653 10.0007 7.52653C8.61994 7.52653 7.50065 8.64582 7.50065 10.0265C7.50065 11.4072 8.61994 12.5265 10.0007 12.5265Z\" stroke=\"#475467\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4652_11479\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span></td>\r\n </tr>\r\n \r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <ng-container *ngIf=\"loading\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\r\n <div 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-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", styles: [".textSub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}tr{vertical-align:middle!important}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}\n"] }]
|
|
1139
|
+
args: [{ selector: 'lib-edgeapp-log', template: "<div class=\"card\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title\"> \r\n <div class=\"badge-light-primary text-primary rounded-2 px-5 py-3\">Edge App Logs</div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !noData\" class=\"btn btn-default btn-outline\" (click)=\"edgeAppExportasXlsx()\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M17.5 12.5264V15.8597C17.5 16.3017 17.3244 16.7257 17.0118 17.0382C16.6993 17.3508 16.2754 17.5264 15.8333 17.5264H4.16667C3.72464 17.5264 3.30072 17.3508 2.98816 17.0382C2.67559 16.7257 2.5 16.3017 2.5 15.8597V12.5264M14.1667 6.69303L10 2.52637M10 2.52637L5.83333 6.69303M10 2.52637V12.5264\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span> Export\r\n </div>\r\n <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [singleDatePicker]=\"true\" [drops]=\"'down'\"\r\n [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div *ngIf=\"!loading && !noData\" class=\"table-responsive\">\r\n <table class=\"table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>Time Stamp</th>\r\n <th>Downtime</th>\r\n <th>Avg Internet Speed</th>\r\n <th>App Status</th>\r\n <th>Files Pushed</th>\r\n <th>Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of getEdgeAppLoveValue;let i=index;\">\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <span><img src='./assets/tango/Images/document.svg'></span>\r\n <div class=\"d-grid ms-3\">\r\n <span>{{obj.startTime}} - {{obj.endTime}}</span>\r\n <span class=\"textSub mt-1\">{{obj.hourStatus}}</span>\r\n </div>\r\n </div>\r\n </td>\r\n <td>{{obj.downtime}} mins</td>\r\n <td>{{obj.Internetspeed ? obj.Internetspeed:'--'}}</td>\r\n <td><span class=\"badge badge-light-success text-success\">{{obj.AppStatus ? obj.AppStatus :'--'}}</span></td>\r\n <td>{{obj.files_pushed ? obj.files_pushed:'--'}}</td>\r\n <td><span (click)=\"openCameraView(obj)\" class=\"cursor-pointer\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4652_11479)\">\r\n <path d=\"M0.833984 10.0265C0.833984 10.0265 4.16732 3.35986 10.0007 3.35986C15.834 3.35986 19.1673 10.0265 19.1673 10.0265C19.1673 10.0265 15.834 16.6932 10.0007 16.6932C4.16732 16.6932 0.833984 10.0265 0.833984 10.0265Z\" stroke=\"#475467\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n <path d=\"M10.0007 12.5265C11.3814 12.5265 12.5006 11.4072 12.5006 10.0265C12.5006 8.64582 11.3814 7.52653 10.0007 7.52653C8.61994 7.52653 7.50065 8.64582 7.50065 10.0265C7.50065 11.4072 8.61994 12.5265 10.0007 12.5265Z\" stroke=\"#475467\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4652_11479\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></span></td>\r\n </tr>\r\n \r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <ng-container *ngIf=\"loading\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\r\n <div 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-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", styles: [".textSub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}tr{vertical-align:middle!important}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}\n"] }]
|
|
1125
1140
|
}], ctorParameters: () => [{ type: i1$1.NgbModal }, { type: TicketsService }, { type: i0.ChangeDetectorRef }, { type: DataService }, { type: i4.GlobalStateService }, { type: i2.ActivatedRoute }], propDecorators: { storeId: [{
|
|
1126
1141
|
type: Input
|
|
1127
1142
|
}] } });
|
|
@@ -1337,11 +1352,11 @@ class StoreActivityComponent {
|
|
|
1337
1352
|
});
|
|
1338
1353
|
}
|
|
1339
1354
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: StoreActivityComponent, deps: [{ token: TicketsService }, { token: DataService }, { token: i0.ChangeDetectorRef }, { token: i4.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1340
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: StoreActivityComponent, selector: "lib-store-activity", inputs: { storeId: "storeId" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"card\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title flex-column\">\r\n <span class=\"card-label\">\r\n Activity\r\n </span>\r\n <span class=\"text-sub\">\r\n An overview of the store issues and the downtime for {{headerFilter?.date?.startDate|customDateFormat}}\r\n - {{headerFilter?.date?.endDate|customDateFormat}}\r\n </span>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M5 10.0264H15M2.5 5.02637H17.5M7.5 15.0264H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-200px position-absolute top-50px end-0 z-1\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"this.filteredIssue === item ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(item)\">\r\n {{item}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !noData\" class=\"btn btn-default btn-outline\" (click)=\"exportStoreListasXlsx()\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5264V15.8597C17.5 16.3017 17.3244 16.7257 17.0118 17.0382C16.6993 17.3508 16.2754 17.5264 15.8333 17.5264H4.16667C3.72464 17.5264 3.30072 17.3508 2.98816 17.0382C2.67559 16.7257 2.5 16.3017 2.5 15.8597V12.5264M14.1667 6.69303L10 2.52637M10 2.52637L5.83333 6.69303M10 2.52637V12.5264\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> Export\r\n </div>\r\n <!-- <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div> -->\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"d-flex\">\r\n <div *ngFor=\"let issue of ticketCard\" class=\"card card-view p-5 me-5\">\r\n <span class=\"title fw-bold\">{{issue.count}}</span>\r\n <span class=\"sub-title fw-semibold\">{{issue.name}}</span>\r\n </div>\r\n </div>\r\n <div class=\"rounded-3 border border-gray border-1 mt-5\">\r\n <div *ngIf=\"!loading && !noData\" class=\"row p-5\">\r\n <div class=\"col-sm-6\">\r\n <div *ngFor=\"let data of storeTicket;let index = index\" class=\"issuecard w-100 mb-4 cursor-pointer\"\r\n (click)=\"ShowTicket(index,data?.ticketId)\" [ngClass]=\"selectCard === index ? 'active' : ''\">\r\n <div class=\"maincard-label fw-bold d-flex justify-content-between mb-5\">\r\n <span>\r\n <img src='./assets/tango/Images/ticket.svg'>\r\n <span class=\"mx-2\">{{data?.ticketId}}</span>\r\n </span>\r\n <span class=\"badge text-success\"\r\n [ngClass]=\"data.status === 'closed' ? 'badge-light-success' :(data.status === 'inprogress' ? 'badge-light-primary':'badge-light-warning')\">{{data.status | titlecase}}</span>\r\n </div>\r\n <div *ngIf=\"data.issueStatus === 'notidentified'\" class=\"mb-5 contenttext\">\r\n We have not received data from your store. We are currently investigating the issue.\r\n </div>\r\n <div *ngIf=\"data.issueStatus ==='identified'\" class=\"mb-5 contenttext\">Store is currently\r\n encountering a <span class=\"fw-bold-700\">{{data.primaryIssue}}</span> which is\r\n <span *ngFor=\"let secondary of data.secondaryIssue; let last = last\"\r\n class=\"fw-bold-700\">{{secondary?.name}}<ng-container *ngIf=\"!last\"> ,</ng-container>\r\n </span>.\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"profile d-flex align-items-centre justify-content-centre\">\r\n <img src=\"./assets/tango/Images/userProfile.svg\" alt=\"\">\r\n </div>\r\n <div class=\"d-flex justify-content-between\">\r\n <span class=\"contenttext px-3\"><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=\"M14 10C14 10.3536 13.8595 10.6928 13.6095 10.9428C13.3594 11.1929 13.0203 11.3333 12.6667 11.3333H4.66667L2 14V3.33333C2 2.97971 2.14048 2.64057 2.39052 2.39052C2.64057 2.14048 2.97971 2 3.33333 2H12.6667C13.0203 2 13.3594 2.14048 13.6095 2.39052C13.8595 2.64057 14 2.97971 14 3.33333V10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data.comments}} comments</span>\r\n <span class=\"contenttext px-3\"><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=\"M10.6667 1.33398V4.00065M5.33333 1.33398V4.00065M2 6.66732H14M3.33333 2.66732H12.6667C13.403 2.66732 14 3.26427 14 4.00065V13.334C14 14.0704 13.403 14.6673 12.6667 14.6673H3.33333C2.59695 14.6673 2 14.0704 2 13.334V4.00065C2 3.26427 2.59695 2.66732 3.33333 2.66732Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data.Date}}</span>\r\n <span *ngIf=\"data.status === 'closed'\" class=\"contenttext px-3\"><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=\"M10.6667 1.33398V4.00065M5.33333 1.33398V4.00065M2 6.66732H14M3.33333 2.66732H12.6667C13.403 2.66732 14 3.26427 14 4.00065V13.334C14 14.0704 13.403 14.6673 12.6667 14.6673H3.33333C2.59695 14.6673 2 14.0704 2 13.334V4.00065C2 3.26427 2.59695 2.66732 3.33333 2.66732Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data?.issueClosedDate | date:'dd-MM-yyyy' }}</span> \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"maincard-label fw-bold d-flex justify-content-between mb-5\">\r\n <span><img class=\"mx-2\" src='./assets/tango/Images/ticket.svg'> {{ticketInfo?.ticketId}}</span>\r\n <span [ngClass]=\"ticketInfo.status === 'closed' ? 'badge-light-success' :(ticketInfo.status === 'inprogress' ? 'badge-light-primary':'badge-light-warning')\" class=\"badge badge-light-primary\">{{ticketInfo?.status | titlecase}}</span>\r\n </div>\r\n <div *ngFor=\"let obj of viewTicketData;let i=index\" class=\"\">\r\n <!-- User code start -->\r\n <div *ngIf=\"obj.actionBy === 'User'\" class=\"d-flex mb-5 ms-5\">\r\n <div *ngIf=\"obj.actionType !=='statusChange'\"\r\n class=\"d-flex flex-column justify-content-center align-items-center pe-3\">\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <img class=\"msgprofile\"\r\n src=\"./assets/tango/Images/userProfile.svg\">\r\n </div>\r\n <div class=\"p-0 h-100 mt-3 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n <div class=\"py-3 pt-0\">\r\n <div *ngIf=\"obj.actionType !=='statusChange'\">\r\n <div class=\"d-flex mb-3\">\r\n <span class=\"headingtext fw-bold text-capitalize\">{{obj?.IdentifiedBy?obj?.IdentifiedBy:\"Tango\"}}</span>\r\n <span class=\"timingtext px-3 pt-1 fw-bold-400\">{{obj?.timeStamp}}</span>\r\n </div>\r\n <span class=\"profile-label font-bold-400\">User has replied</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType === 'statusCheckReply'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Issue has been <b><span\r\n *ngIf=\"obj.statusCheckReply==='No'\">not</span> resolved.</b>\r\n\r\n </div>\r\n <div class=\"textupdates fw-bold-400\" *ngIf=\"obj.statusCheckReply==='No'\"> It takes\r\n {{obj?.hibernationDays}} more days to resolve.</div>\r\n </div>\r\n <!-- <div *ngIf=\"\" class=\"\">\r\n <span class=\"investigation fw-bold-400\">Are all CCTV cameras functioning\r\n properly?</span>\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 1</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 2</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 3</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"textupdates fw-bold-400 mt-5\">\r\n The above camera streaming are not working due <span class=\"fw-bold-700\">power\r\n issue</span> to the camera.\r\n </div>\r\n </div> -->\r\n <div *ngIf=\"obj.actionType ==='issueUpdate'\">\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"textupdates fw-semibold mt-3\">\r\n We're currently encountering an <span\r\n class=\"fw-bold-700\">{{res.primaryIssue}}</span>\r\n </div>\r\n <div *ngIf=\"res.primaryIssue ==='Camera Issues'\">\r\n <div *ngIf=\"notworkingCamaralist && notworkingCamaralist?.length\" class=\"row\">\r\n <div *ngFor=\"let item of notworkingCamaralist\" class=\"col-sm-3 my-5\">\r\n <div *ngIf=\"item?.thumbnailImage\" class=\"rounded-3 overflow-hidden mt-2\">\r\n <span class=\"camera fw-bold\">{{item.cameraName}}</span>\r\n <img [src]=\"item?.thumbnailImage\" style=\"height:180px\">\r\n </div>\r\n </div>\r\n <div class=\"textupdates fw-bold-400 mt-3 me-2\">The above camera streaming are not working due\r\n <span class=\"textupdates fw-bold-700 mt-3\" *ngFor=\"let issue of res?.secondaryIssue; let last = last\">{{issue?.name}} <ng-container *ngIf=\"!last\"> ,</ng-container></span> to the Camera</div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"res?.secondaryIssue && res?.secondaryIssue?.length\" class=\"mt-3\">\r\n <div class=\"investigation fw-bold-400\">The following are the relevant\r\n problem\r\n facing</div>\r\n <ul class=\"timingtext fw-bold-400 mt-3\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"selectedIssue === ''\" class=\"profile-label fw-semibold mt-2\">\r\n Kindly choose the option below that corresponds to the issue you are experiencing in\r\n the\r\n store.\r\n </div>\r\n </div>\r\n </div>\r\n <!-- User code end -->\r\n <!-- Tango code start -->\r\n <div *ngIf=\"obj.actionBy === 'Tango'\" class=\"d-flex mb-5 ms-5\">\r\n <div class=\"d-flex flex-column justify-content-center align-items-center pe-3\">\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <div class=\"symbol symbol-35px symbol-circle\" *ngIf=\"obj?.IdentifiedBy&&obj?.IdentifiedBy!==''&&obj?.IdentifiedBy!=='Tango'\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{obj?.IdentifiedBy?.slice(0,2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <img *ngIf=\"!obj?.IdentifiedBy||obj?.IdentifiedBy===''||obj?.IdentifiedBy==='Tango'\" class=\"msgprofile\" src=\"./assets/tango/Images/tangoprofile.png\">\r\n </div>\r\n <div class=\"p-0 h-100 mt-3 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n \r\n <div class=\"py-3 pt-0\">\r\n <div class=\"d-flex mb-3\">\r\n <span class=\"headingtext fw-bold text-capitalize\">{{obj?.IdentifiedBy?obj?.IdentifiedBy:\"Tango\"}}</span>\r\n <span class=\"timingtext fw-bold-400 px-3 pt-1\">{{obj?.timeStamp}}</span>\r\n </div>\r\n <div class=\"mb-3\">\r\n <span class=\"profile-label fw-bold-400\">tango has replied to the\r\n issue</span>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'dataRecived'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Data Received\r\n </div>\r\n </div>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'comment'\">\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">{{obj?.comment}}</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType === 'statusCheckMonitor'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Thank you for the update. We\u2019ll get\r\n back after the buffer time you provided.\r\n </div>\r\n </div>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'statusChange'\">\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">Updated the status</span><span\r\n class=\"timingtext fw-semibold text-primary\">Open -> Inprogress</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType ==='issueUpdate'\">\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">\r\n We're currently encountering an <span\r\n class=\"fw-bold-700\">{{res.primaryIssue}}</span>\r\n </div>\r\n <div *ngIf=\"res.primaryIssue ==='Camera Issues'\">\r\n <div class=\"row my-5\">\r\n <div *ngFor=\"let item of notworkingCamaralist\" class=\"col-sm-3\">\r\n <div class=\"rounded-3 overflow-hidden mt-2\">\r\n <span class=\"camera fw-bold\">{{item.cameraName}}</span>\r\n <img [src]=\"item?.thumbnailImage\" style=\"height:180px\">\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"textupdates fw-bold-400 mt-3 me-2\">The above camera streaming are not working due</span>\r\n <span class=\"textupdates fw-bold-700 mt-3\" *ngFor=\"let issue of res?.secondaryIssue; let last = last\">{{issue?.name}} <ng-container *ngIf=\"!last\"> ,</ng-container></span> <span class=\"textupdates fw-bold-400 mt-3\">to the Camera</span>\r\n \r\n </div>\r\n <div class=\"mt-3\">\r\n <div class=\"investigation fw-bold-400 mb-3\">The following are the relevant\r\n problem\r\n facing</div>\r\n <div class=\"mb-5\"> \r\n <ul class=\"timingtext fw-bold-400 mb-0\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">{{obj?.comment}}</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType ==='stepsToResolve'\" class=\"mt-3\">\r\n <span class=\"textupdates fw-bold-400\">Please follow the below steps to resolve\r\n the above issue</span>\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"mt-5\">\r\n <span class=\"headingtext fw-semibold mb-1\">{{res.primaryIssue}}</span>\r\n <ul class=\"timingtext fw-bold-400 mb-0\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <!-- defaultInfra start -->\r\n <div *ngIf=\"obj.actionType ==='defaultInfra'\" class=\"contenttext fw-bold-400\">We have\r\n not\r\n received data from your store. We are currently investigating the issue</div>\r\n <!-- defaultInfra end -->\r\n\r\n\r\n\r\n\r\n\r\n </div>\r\n </div>\r\n <!-- Tango code end -->\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading\">\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\r\n <div 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-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>", styles: [".card-label{font-size:16px!important;line-height:24px!important}.card-view{width:19%}.card-view .title{color:var(--Gray-900, #101828);font-size:20px;line-height:30px}.card-view .sub-title{color:var(--Gray-700, #344054);font-size:14px;line-height:20px}.issuecard{width:240px;border-radius:10px;border:1px solid var(--Gray-200, #EAECF0);padding:16px}.issuecard label{color:var(--Black, #101828);font-size:14px;line-height:20px}.issuecard.active,.card-view.active{border:none!important;background:var(--Primary-25, #F6FCFF);box-shadow:0 0 0 4px #e9f7ff}.contenttext{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.maincard-content{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD)}.maincard-label{color:var(--Gray-900, #101828);font-size:16px;line-height:24px}.profile{width:24px;height:24px;overflow:hidden;border-radius:200px}.fw-bold-700{font-weight:700!important}.fw-bold-400{font-weight:400!important}.msgprofile{width:48px!important;height:48px!important;border-radius:200px;overflow:hidden}.timingtext{color:var(--Gray-500, #667085);font-size:14px;line-height:18px}.profile-label{font-size:16px;color:var(--Gray-500, #667085);line-height:24px}.w-45{width:49%}.textupdates{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.textupdates1{color:var(--Gray-700, #344054);font-size:14px;line-height:24px}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!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 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}: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}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.img-src{width:25%!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: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i6.DatePipe, name: "date" }, { kind: "pipe", type: i3.CustomDateFormatPipe, name: "customDateFormat" }] });
|
|
1355
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: StoreActivityComponent, selector: "lib-store-activity", inputs: { storeId: "storeId" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"card\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title flex-column\">\r\n <span class=\"card-label\">\r\n Activity\r\n </span>\r\n <span class=\"text-sub\">\r\n An overview of the store issues and the downtime for {{headerFilter?.date?.startDate|customDateFormat}}\r\n - {{headerFilter?.date?.endDate|customDateFormat}}\r\n </span>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M5 10.0264H15M2.5 5.02637H17.5M7.5 15.0264H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-200px position-absolute top-50px end-0 z-1\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"this.filteredIssue === item ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(item)\">\r\n {{item}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !noData\" class=\"btn btn-default btn-outline\" (click)=\"exportStoreListasXlsx()\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5264V15.8597C17.5 16.3017 17.3244 16.7257 17.0118 17.0382C16.6993 17.3508 16.2754 17.5264 15.8333 17.5264H4.16667C3.72464 17.5264 3.30072 17.3508 2.98816 17.0382C2.67559 16.7257 2.5 16.3017 2.5 15.8597V12.5264M14.1667 6.69303L10 2.52637M10 2.52637L5.83333 6.69303M10 2.52637V12.5264\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> Export\r\n </div>\r\n <!-- <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div> -->\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"d-flex\">\r\n <div *ngFor=\"let issue of ticketCard\" class=\"card card-view p-5 me-5\">\r\n <span class=\"title fw-bold\">{{issue.count}}</span>\r\n <span class=\"sub-title fw-semibold\">{{issue.name}}</span>\r\n </div>\r\n </div>\r\n <div class=\"rounded-3 border border-gray border-1 mt-5\">\r\n <div *ngIf=\"!loading && !noData\" class=\"row p-5\">\r\n <div class=\"col-sm-6\">\r\n <div *ngFor=\"let data of storeTicket;let index = index\" class=\"issuecard w-100 mb-4 cursor-pointer\"\r\n (click)=\"ShowTicket(index,data?.ticketId)\" [ngClass]=\"selectCard === index ? 'active' : ''\">\r\n <div class=\"maincard-label fw-bold d-flex justify-content-between mb-5\">\r\n <span>\r\n <img src='./assets/tango/Images/ticket.svg'>\r\n <span class=\"mx-2\">{{data?.ticketId}}</span>\r\n </span>\r\n <span class=\"badge text-success\"\r\n [ngClass]=\"data.status === 'closed' ? 'badge-light-success' :(data.status === 'inprogress' ? 'badge-light-primary':'badge-light-warning')\">{{data.status | titlecase}}</span>\r\n </div>\r\n <div *ngIf=\"data.issueStatus === 'notidentified'\" class=\"mb-5 contenttext\">\r\n We have not received data from your store. We are currently investigating the issue.\r\n </div>\r\n <div *ngIf=\"data.issueStatus ==='identified'\" class=\"mb-5 contenttext\">Store is currently\r\n encountering a <span class=\"fw-bold-700\">{{data.primaryIssue}}</span> which is\r\n <span *ngFor=\"let secondary of data.secondaryIssue; let last = last\"\r\n class=\"fw-bold-700\">{{secondary?.name}}<ng-container *ngIf=\"!last\"> ,</ng-container>\r\n </span>.\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"profile d-flex align-items-centre justify-content-centre\">\r\n <img src=\"./assets/tango/Images/userProfile.svg\" alt=\"\">\r\n </div>\r\n <div class=\"d-flex justify-content-between\">\r\n <span class=\"contenttext px-3\"><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=\"M14 10C14 10.3536 13.8595 10.6928 13.6095 10.9428C13.3594 11.1929 13.0203 11.3333 12.6667 11.3333H4.66667L2 14V3.33333C2 2.97971 2.14048 2.64057 2.39052 2.39052C2.64057 2.14048 2.97971 2 3.33333 2H12.6667C13.0203 2 13.3594 2.14048 13.6095 2.39052C13.8595 2.64057 14 2.97971 14 3.33333V10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data.comments}} comments</span>\r\n <span class=\"contenttext px-3\"><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=\"M10.6667 1.33398V4.00065M5.33333 1.33398V4.00065M2 6.66732H14M3.33333 2.66732H12.6667C13.403 2.66732 14 3.26427 14 4.00065V13.334C14 14.0704 13.403 14.6673 12.6667 14.6673H3.33333C2.59695 14.6673 2 14.0704 2 13.334V4.00065C2 3.26427 2.59695 2.66732 3.33333 2.66732Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data.Date}}</span>\r\n <span *ngIf=\"data.status === 'closed'\" class=\"contenttext px-3\"><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=\"M10.6667 1.33398V4.00065M5.33333 1.33398V4.00065M2 6.66732H14M3.33333 2.66732H12.6667C13.403 2.66732 14 3.26427 14 4.00065V13.334C14 14.0704 13.403 14.6673 12.6667 14.6673H3.33333C2.59695 14.6673 2 14.0704 2 13.334V4.00065C2 3.26427 2.59695 2.66732 3.33333 2.66732Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data?.issueClosedDate | date:'dd-MM-yyyy' }}</span> \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"maincard-label fw-bold d-flex justify-content-between mb-5\">\r\n <span><img class=\"mx-2\" src='./assets/tango/Images/ticket.svg'> {{ticketInfo?.ticketId}}</span>\r\n <span [ngClass]=\"ticketInfo?.status === 'closed' ? 'badge-light-success' :(ticketInfo?.status === 'inprogress' ? 'badge-light-primary':'badge-light-warning')\" class=\"badge badge-light-primary\">{{ticketInfo?.status | titlecase}}</span>\r\n </div>\r\n <div *ngFor=\"let obj of viewTicketData;let i=index\" class=\"\">\r\n <!-- User code start -->\r\n <div *ngIf=\"obj.actionBy === 'User'\" class=\"d-flex mb-5 ms-5\">\r\n <div *ngIf=\"obj.actionType !=='statusChange'\"\r\n class=\"d-flex flex-column justify-content-center align-items-center pe-3\">\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <img class=\"msgprofile\"\r\n src=\"./assets/tango/Images/userProfile.svg\">\r\n </div>\r\n <div class=\"p-0 h-100 mt-3 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n <div class=\"py-3 pt-0\">\r\n <div *ngIf=\"obj.actionType !=='statusChange'\">\r\n <div class=\"d-flex mb-3\">\r\n <span class=\"headingtext fw-bold text-capitalize\">{{obj?.IdentifiedBy?obj?.IdentifiedBy:\"Tango\"}}</span>\r\n <span class=\"timingtext px-3 pt-1 fw-bold-400\">{{obj?.timeStamp}}</span>\r\n </div>\r\n <span class=\"profile-label font-bold-400\">User has replied</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType === 'statusCheckReply'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Issue has been <b><span\r\n *ngIf=\"obj.statusCheckReply==='No'\">not</span> resolved.</b>\r\n\r\n </div>\r\n <div class=\"textupdates fw-bold-400\" *ngIf=\"obj.statusCheckReply==='No'\"> It takes\r\n {{obj?.hibernationDays}} more days to resolve.</div>\r\n </div>\r\n <!-- <div *ngIf=\"\" class=\"\">\r\n <span class=\"investigation fw-bold-400\">Are all CCTV cameras functioning\r\n properly?</span>\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 1</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 2</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 3</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"textupdates fw-bold-400 mt-5\">\r\n The above camera streaming are not working due <span class=\"fw-bold-700\">power\r\n issue</span> to the camera.\r\n </div>\r\n </div> -->\r\n <div *ngIf=\"obj.actionType ==='issueUpdate'\">\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"textupdates fw-semibold mt-3\">\r\n We're currently encountering an <span\r\n class=\"fw-bold-700\">{{res.primaryIssue}}</span>\r\n </div>\r\n <div *ngIf=\"res.primaryIssue ==='Camera Issues'\">\r\n <div *ngIf=\"notworkingCamaralist && notworkingCamaralist?.length\" class=\"row\">\r\n <div *ngFor=\"let item of notworkingCamaralist\" class=\"col-sm-3 my-5\">\r\n <div *ngIf=\"item?.thumbnailImage\" class=\"rounded-3 overflow-hidden mt-2\">\r\n <span class=\"camera fw-bold\">{{item.cameraName}}</span>\r\n <img [src]=\"item?.thumbnailImage\" style=\"height:180px\">\r\n </div>\r\n </div>\r\n <div class=\"textupdates fw-bold-400 mt-3 me-2\">The above camera streaming are not working due\r\n <span class=\"textupdates fw-bold-700 mt-3\" *ngFor=\"let issue of res?.secondaryIssue; let last = last\">{{issue?.name}} <ng-container *ngIf=\"!last\"> ,</ng-container></span> to the Camera</div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"res?.secondaryIssue && res?.secondaryIssue?.length\" class=\"mt-3\">\r\n <div class=\"investigation fw-bold-400\">The following are the relevant\r\n problem\r\n facing</div>\r\n <ul class=\"timingtext fw-bold-400 mt-3\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"selectedIssue === ''\" class=\"profile-label fw-semibold mt-2\">\r\n Kindly choose the option below that corresponds to the issue you are experiencing in\r\n the\r\n store.\r\n </div>\r\n </div>\r\n </div>\r\n <!-- User code end -->\r\n <!-- Tango code start -->\r\n <div *ngIf=\"obj.actionBy === 'Tango'\" class=\"d-flex mb-5 ms-5\">\r\n <div class=\"d-flex flex-column justify-content-center align-items-center pe-3\">\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <div class=\"symbol symbol-35px symbol-circle\" *ngIf=\"obj?.IdentifiedBy&&obj?.IdentifiedBy!==''&&obj?.IdentifiedBy!=='Tango'\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{obj?.IdentifiedBy?.slice(0,2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <img *ngIf=\"!obj?.IdentifiedBy||obj?.IdentifiedBy===''||obj?.IdentifiedBy==='Tango'\" class=\"msgprofile\" src=\"./assets/tango/Images/tangoprofile.png\">\r\n </div>\r\n <div class=\"p-0 h-100 mt-3 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n \r\n <div class=\"py-3 pt-0\">\r\n <div class=\"d-flex mb-3\">\r\n <span class=\"headingtext fw-bold text-capitalize\">{{obj?.IdentifiedBy?obj?.IdentifiedBy:\"Tango\"}}</span>\r\n <span class=\"timingtext fw-bold-400 px-3 pt-1\">{{obj?.timeStamp}}</span>\r\n </div>\r\n <div class=\"mb-3\">\r\n <span class=\"profile-label fw-bold-400\">tango has replied to the\r\n issue</span>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'dataRecived'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Data Received\r\n </div>\r\n </div>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'comment'\">\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">{{obj?.comment}}</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType === 'statusCheckMonitor'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Thank you for the update. We\u2019ll get\r\n back after the buffer time you provided.\r\n </div>\r\n </div>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'statusChange'\">\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">Updated the status</span><span\r\n class=\"timingtext fw-semibold text-primary\">Open -> Inprogress</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType ==='issueUpdate'\">\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">\r\n We're currently encountering an <span\r\n class=\"fw-bold-700\">{{res.primaryIssue}}</span>\r\n </div>\r\n <div *ngIf=\"res.primaryIssue ==='Camera Issues'\">\r\n <div class=\"row my-5\">\r\n <div *ngFor=\"let item of notworkingCamaralist\" class=\"col-sm-3\">\r\n <div class=\"rounded-3 overflow-hidden mt-2\">\r\n <span class=\"camera fw-bold\">{{item.cameraName}}</span>\r\n <img [src]=\"item?.thumbnailImage\" style=\"height:180px\">\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"textupdates fw-bold-400 mt-3 me-2\">The above camera streaming are not working due</span>\r\n <span class=\"textupdates fw-bold-700 mt-3\" *ngFor=\"let issue of res?.secondaryIssue; let last = last\">{{issue?.name}} <ng-container *ngIf=\"!last\"> ,</ng-container></span> <span class=\"textupdates fw-bold-400 mt-3\">to the Camera</span>\r\n \r\n </div>\r\n <div class=\"mt-3\">\r\n <div class=\"investigation fw-bold-400 mb-3\">The following are the relevant\r\n problem\r\n facing</div>\r\n <div class=\"mb-5\"> \r\n <ul class=\"timingtext fw-bold-400 mb-0\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">{{obj?.comment}}</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType ==='stepsToResolve'\" class=\"mt-3\">\r\n <span class=\"textupdates fw-bold-400\">Please follow the below steps to resolve\r\n the above issue</span>\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"mt-5\">\r\n <span class=\"headingtext fw-semibold mb-1\">{{res.primaryIssue}}</span>\r\n <ul class=\"timingtext fw-bold-400 mb-0\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <!-- defaultInfra start -->\r\n <div *ngIf=\"obj.actionType ==='defaultInfra'\" class=\"contenttext fw-bold-400\">We have\r\n not\r\n received data from your store. We are currently investigating the issue</div>\r\n <!-- defaultInfra end -->\r\n\r\n\r\n\r\n\r\n\r\n </div>\r\n </div>\r\n <!-- Tango code end -->\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading\">\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\r\n <div 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-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>", styles: [".card-label{font-size:16px!important;line-height:24px!important}.card-view{width:19%}.card-view .title{color:var(--Gray-900, #101828);font-size:20px;line-height:30px}.card-view .sub-title{color:var(--Gray-700, #344054);font-size:14px;line-height:20px}.issuecard{width:240px;border-radius:10px;border:1px solid var(--Gray-200, #EAECF0);padding:16px}.issuecard label{color:var(--Black, #101828);font-size:14px;line-height:20px}.issuecard.active,.card-view.active{border:none!important;background:var(--Primary-25, #F6FCFF);box-shadow:0 0 0 4px #e9f7ff}.contenttext{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.maincard-content{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD)}.maincard-label{color:var(--Gray-900, #101828);font-size:16px;line-height:24px}.profile{width:24px;height:24px;overflow:hidden;border-radius:200px}.fw-bold-700{font-weight:700!important}.fw-bold-400{font-weight:400!important}.msgprofile{width:48px!important;height:48px!important;border-radius:200px;overflow:hidden}.timingtext{color:var(--Gray-500, #667085);font-size:14px;line-height:18px}.profile-label{font-size:16px;color:var(--Gray-500, #667085);line-height:24px}.w-45{width:49%}.textupdates{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.textupdates1{color:var(--Gray-700, #344054);font-size:14px;line-height:24px}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!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 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}: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}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.img-src{width:25%!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: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i6.DatePipe, name: "date" }, { kind: "pipe", type: i3.CustomDateFormatPipe, name: "customDateFormat" }] });
|
|
1341
1356
|
}
|
|
1342
1357
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: StoreActivityComponent, decorators: [{
|
|
1343
1358
|
type: Component,
|
|
1344
|
-
args: [{ selector: 'lib-store-activity', template: "<div class=\"card\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title flex-column\">\r\n <span class=\"card-label\">\r\n Activity\r\n </span>\r\n <span class=\"text-sub\">\r\n An overview of the store issues and the downtime for {{headerFilter?.date?.startDate|customDateFormat}}\r\n - {{headerFilter?.date?.endDate|customDateFormat}}\r\n </span>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M5 10.0264H15M2.5 5.02637H17.5M7.5 15.0264H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-200px position-absolute top-50px end-0 z-1\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"this.filteredIssue === item ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(item)\">\r\n {{item}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !noData\" class=\"btn btn-default btn-outline\" (click)=\"exportStoreListasXlsx()\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5264V15.8597C17.5 16.3017 17.3244 16.7257 17.0118 17.0382C16.6993 17.3508 16.2754 17.5264 15.8333 17.5264H4.16667C3.72464 17.5264 3.30072 17.3508 2.98816 17.0382C2.67559 16.7257 2.5 16.3017 2.5 15.8597V12.5264M14.1667 6.69303L10 2.52637M10 2.52637L5.83333 6.69303M10 2.52637V12.5264\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> Export\r\n </div>\r\n <!-- <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div> -->\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"d-flex\">\r\n <div *ngFor=\"let issue of ticketCard\" class=\"card card-view p-5 me-5\">\r\n <span class=\"title fw-bold\">{{issue.count}}</span>\r\n <span class=\"sub-title fw-semibold\">{{issue.name}}</span>\r\n </div>\r\n </div>\r\n <div class=\"rounded-3 border border-gray border-1 mt-5\">\r\n <div *ngIf=\"!loading && !noData\" class=\"row p-5\">\r\n <div class=\"col-sm-6\">\r\n <div *ngFor=\"let data of storeTicket;let index = index\" class=\"issuecard w-100 mb-4 cursor-pointer\"\r\n (click)=\"ShowTicket(index,data?.ticketId)\" [ngClass]=\"selectCard === index ? 'active' : ''\">\r\n <div class=\"maincard-label fw-bold d-flex justify-content-between mb-5\">\r\n <span>\r\n <img src='./assets/tango/Images/ticket.svg'>\r\n <span class=\"mx-2\">{{data?.ticketId}}</span>\r\n </span>\r\n <span class=\"badge text-success\"\r\n [ngClass]=\"data.status === 'closed' ? 'badge-light-success' :(data.status === 'inprogress' ? 'badge-light-primary':'badge-light-warning')\">{{data.status | titlecase}}</span>\r\n </div>\r\n <div *ngIf=\"data.issueStatus === 'notidentified'\" class=\"mb-5 contenttext\">\r\n We have not received data from your store. We are currently investigating the issue.\r\n </div>\r\n <div *ngIf=\"data.issueStatus ==='identified'\" class=\"mb-5 contenttext\">Store is currently\r\n encountering a <span class=\"fw-bold-700\">{{data.primaryIssue}}</span> which is\r\n <span *ngFor=\"let secondary of data.secondaryIssue; let last = last\"\r\n class=\"fw-bold-700\">{{secondary?.name}}<ng-container *ngIf=\"!last\"> ,</ng-container>\r\n </span>.\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"profile d-flex align-items-centre justify-content-centre\">\r\n <img src=\"./assets/tango/Images/userProfile.svg\" alt=\"\">\r\n </div>\r\n <div class=\"d-flex justify-content-between\">\r\n <span class=\"contenttext px-3\"><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=\"M14 10C14 10.3536 13.8595 10.6928 13.6095 10.9428C13.3594 11.1929 13.0203 11.3333 12.6667 11.3333H4.66667L2 14V3.33333C2 2.97971 2.14048 2.64057 2.39052 2.39052C2.64057 2.14048 2.97971 2 3.33333 2H12.6667C13.0203 2 13.3594 2.14048 13.6095 2.39052C13.8595 2.64057 14 2.97971 14 3.33333V10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data.comments}} comments</span>\r\n <span class=\"contenttext px-3\"><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=\"M10.6667 1.33398V4.00065M5.33333 1.33398V4.00065M2 6.66732H14M3.33333 2.66732H12.6667C13.403 2.66732 14 3.26427 14 4.00065V13.334C14 14.0704 13.403 14.6673 12.6667 14.6673H3.33333C2.59695 14.6673 2 14.0704 2 13.334V4.00065C2 3.26427 2.59695 2.66732 3.33333 2.66732Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data.Date}}</span>\r\n <span *ngIf=\"data.status === 'closed'\" class=\"contenttext px-3\"><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=\"M10.6667 1.33398V4.00065M5.33333 1.33398V4.00065M2 6.66732H14M3.33333 2.66732H12.6667C13.403 2.66732 14 3.26427 14 4.00065V13.334C14 14.0704 13.403 14.6673 12.6667 14.6673H3.33333C2.59695 14.6673 2 14.0704 2 13.334V4.00065C2 3.26427 2.59695 2.66732 3.33333 2.66732Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data?.issueClosedDate | date:'dd-MM-yyyy' }}</span> \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"maincard-label fw-bold d-flex justify-content-between mb-5\">\r\n <span><img class=\"mx-2\" src='./assets/tango/Images/ticket.svg'> {{ticketInfo?.ticketId}}</span>\r\n <span [ngClass]=\"ticketInfo.status === 'closed' ? 'badge-light-success' :(ticketInfo.status === 'inprogress' ? 'badge-light-primary':'badge-light-warning')\" class=\"badge badge-light-primary\">{{ticketInfo?.status | titlecase}}</span>\r\n </div>\r\n <div *ngFor=\"let obj of viewTicketData;let i=index\" class=\"\">\r\n <!-- User code start -->\r\n <div *ngIf=\"obj.actionBy === 'User'\" class=\"d-flex mb-5 ms-5\">\r\n <div *ngIf=\"obj.actionType !=='statusChange'\"\r\n class=\"d-flex flex-column justify-content-center align-items-center pe-3\">\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <img class=\"msgprofile\"\r\n src=\"./assets/tango/Images/userProfile.svg\">\r\n </div>\r\n <div class=\"p-0 h-100 mt-3 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n <div class=\"py-3 pt-0\">\r\n <div *ngIf=\"obj.actionType !=='statusChange'\">\r\n <div class=\"d-flex mb-3\">\r\n <span class=\"headingtext fw-bold text-capitalize\">{{obj?.IdentifiedBy?obj?.IdentifiedBy:\"Tango\"}}</span>\r\n <span class=\"timingtext px-3 pt-1 fw-bold-400\">{{obj?.timeStamp}}</span>\r\n </div>\r\n <span class=\"profile-label font-bold-400\">User has replied</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType === 'statusCheckReply'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Issue has been <b><span\r\n *ngIf=\"obj.statusCheckReply==='No'\">not</span> resolved.</b>\r\n\r\n </div>\r\n <div class=\"textupdates fw-bold-400\" *ngIf=\"obj.statusCheckReply==='No'\"> It takes\r\n {{obj?.hibernationDays}} more days to resolve.</div>\r\n </div>\r\n <!-- <div *ngIf=\"\" class=\"\">\r\n <span class=\"investigation fw-bold-400\">Are all CCTV cameras functioning\r\n properly?</span>\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 1</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 2</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 3</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"textupdates fw-bold-400 mt-5\">\r\n The above camera streaming are not working due <span class=\"fw-bold-700\">power\r\n issue</span> to the camera.\r\n </div>\r\n </div> -->\r\n <div *ngIf=\"obj.actionType ==='issueUpdate'\">\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"textupdates fw-semibold mt-3\">\r\n We're currently encountering an <span\r\n class=\"fw-bold-700\">{{res.primaryIssue}}</span>\r\n </div>\r\n <div *ngIf=\"res.primaryIssue ==='Camera Issues'\">\r\n <div *ngIf=\"notworkingCamaralist && notworkingCamaralist?.length\" class=\"row\">\r\n <div *ngFor=\"let item of notworkingCamaralist\" class=\"col-sm-3 my-5\">\r\n <div *ngIf=\"item?.thumbnailImage\" class=\"rounded-3 overflow-hidden mt-2\">\r\n <span class=\"camera fw-bold\">{{item.cameraName}}</span>\r\n <img [src]=\"item?.thumbnailImage\" style=\"height:180px\">\r\n </div>\r\n </div>\r\n <div class=\"textupdates fw-bold-400 mt-3 me-2\">The above camera streaming are not working due\r\n <span class=\"textupdates fw-bold-700 mt-3\" *ngFor=\"let issue of res?.secondaryIssue; let last = last\">{{issue?.name}} <ng-container *ngIf=\"!last\"> ,</ng-container></span> to the Camera</div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"res?.secondaryIssue && res?.secondaryIssue?.length\" class=\"mt-3\">\r\n <div class=\"investigation fw-bold-400\">The following are the relevant\r\n problem\r\n facing</div>\r\n <ul class=\"timingtext fw-bold-400 mt-3\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"selectedIssue === ''\" class=\"profile-label fw-semibold mt-2\">\r\n Kindly choose the option below that corresponds to the issue you are experiencing in\r\n the\r\n store.\r\n </div>\r\n </div>\r\n </div>\r\n <!-- User code end -->\r\n <!-- Tango code start -->\r\n <div *ngIf=\"obj.actionBy === 'Tango'\" class=\"d-flex mb-5 ms-5\">\r\n <div class=\"d-flex flex-column justify-content-center align-items-center pe-3\">\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <div class=\"symbol symbol-35px symbol-circle\" *ngIf=\"obj?.IdentifiedBy&&obj?.IdentifiedBy!==''&&obj?.IdentifiedBy!=='Tango'\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{obj?.IdentifiedBy?.slice(0,2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <img *ngIf=\"!obj?.IdentifiedBy||obj?.IdentifiedBy===''||obj?.IdentifiedBy==='Tango'\" class=\"msgprofile\" src=\"./assets/tango/Images/tangoprofile.png\">\r\n </div>\r\n <div class=\"p-0 h-100 mt-3 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n \r\n <div class=\"py-3 pt-0\">\r\n <div class=\"d-flex mb-3\">\r\n <span class=\"headingtext fw-bold text-capitalize\">{{obj?.IdentifiedBy?obj?.IdentifiedBy:\"Tango\"}}</span>\r\n <span class=\"timingtext fw-bold-400 px-3 pt-1\">{{obj?.timeStamp}}</span>\r\n </div>\r\n <div class=\"mb-3\">\r\n <span class=\"profile-label fw-bold-400\">tango has replied to the\r\n issue</span>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'dataRecived'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Data Received\r\n </div>\r\n </div>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'comment'\">\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">{{obj?.comment}}</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType === 'statusCheckMonitor'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Thank you for the update. We\u2019ll get\r\n back after the buffer time you provided.\r\n </div>\r\n </div>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'statusChange'\">\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">Updated the status</span><span\r\n class=\"timingtext fw-semibold text-primary\">Open -> Inprogress</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType ==='issueUpdate'\">\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">\r\n We're currently encountering an <span\r\n class=\"fw-bold-700\">{{res.primaryIssue}}</span>\r\n </div>\r\n <div *ngIf=\"res.primaryIssue ==='Camera Issues'\">\r\n <div class=\"row my-5\">\r\n <div *ngFor=\"let item of notworkingCamaralist\" class=\"col-sm-3\">\r\n <div class=\"rounded-3 overflow-hidden mt-2\">\r\n <span class=\"camera fw-bold\">{{item.cameraName}}</span>\r\n <img [src]=\"item?.thumbnailImage\" style=\"height:180px\">\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"textupdates fw-bold-400 mt-3 me-2\">The above camera streaming are not working due</span>\r\n <span class=\"textupdates fw-bold-700 mt-3\" *ngFor=\"let issue of res?.secondaryIssue; let last = last\">{{issue?.name}} <ng-container *ngIf=\"!last\"> ,</ng-container></span> <span class=\"textupdates fw-bold-400 mt-3\">to the Camera</span>\r\n \r\n </div>\r\n <div class=\"mt-3\">\r\n <div class=\"investigation fw-bold-400 mb-3\">The following are the relevant\r\n problem\r\n facing</div>\r\n <div class=\"mb-5\"> \r\n <ul class=\"timingtext fw-bold-400 mb-0\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">{{obj?.comment}}</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType ==='stepsToResolve'\" class=\"mt-3\">\r\n <span class=\"textupdates fw-bold-400\">Please follow the below steps to resolve\r\n the above issue</span>\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"mt-5\">\r\n <span class=\"headingtext fw-semibold mb-1\">{{res.primaryIssue}}</span>\r\n <ul class=\"timingtext fw-bold-400 mb-0\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <!-- defaultInfra start -->\r\n <div *ngIf=\"obj.actionType ==='defaultInfra'\" class=\"contenttext fw-bold-400\">We have\r\n not\r\n received data from your store. We are currently investigating the issue</div>\r\n <!-- defaultInfra end -->\r\n\r\n\r\n\r\n\r\n\r\n </div>\r\n </div>\r\n <!-- Tango code end -->\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading\">\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\r\n <div 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-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>", styles: [".card-label{font-size:16px!important;line-height:24px!important}.card-view{width:19%}.card-view .title{color:var(--Gray-900, #101828);font-size:20px;line-height:30px}.card-view .sub-title{color:var(--Gray-700, #344054);font-size:14px;line-height:20px}.issuecard{width:240px;border-radius:10px;border:1px solid var(--Gray-200, #EAECF0);padding:16px}.issuecard label{color:var(--Black, #101828);font-size:14px;line-height:20px}.issuecard.active,.card-view.active{border:none!important;background:var(--Primary-25, #F6FCFF);box-shadow:0 0 0 4px #e9f7ff}.contenttext{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.maincard-content{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD)}.maincard-label{color:var(--Gray-900, #101828);font-size:16px;line-height:24px}.profile{width:24px;height:24px;overflow:hidden;border-radius:200px}.fw-bold-700{font-weight:700!important}.fw-bold-400{font-weight:400!important}.msgprofile{width:48px!important;height:48px!important;border-radius:200px;overflow:hidden}.timingtext{color:var(--Gray-500, #667085);font-size:14px;line-height:18px}.profile-label{font-size:16px;color:var(--Gray-500, #667085);line-height:24px}.w-45{width:49%}.textupdates{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.textupdates1{color:var(--Gray-700, #344054);font-size:14px;line-height:24px}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!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 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}: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}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.img-src{width:25%!important}\n"] }]
|
|
1359
|
+
args: [{ selector: 'lib-store-activity', template: "<div class=\"card\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title flex-column\">\r\n <span class=\"card-label\">\r\n Activity\r\n </span>\r\n <span class=\"text-sub\">\r\n An overview of the store issues and the downtime for {{headerFilter?.date?.startDate|customDateFormat}}\r\n - {{headerFilter?.date?.endDate|customDateFormat}}\r\n </span>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M5 10.0264H15M2.5 5.02637H17.5M7.5 15.0264H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-200px position-absolute top-50px end-0 z-1\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"this.filteredIssue === item ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(item)\">\r\n {{item}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_tickets_isDownload && !noData\" class=\"btn btn-default btn-outline\" (click)=\"exportStoreListasXlsx()\">\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5264V15.8597C17.5 16.3017 17.3244 16.7257 17.0118 17.0382C16.6993 17.3508 16.2754 17.5264 15.8333 17.5264H4.16667C3.72464 17.5264 3.30072 17.3508 2.98816 17.0382C2.67559 16.7257 2.5 16.3017 2.5 15.8597V12.5264M14.1667 6.69303L10 2.52637M10 2.52637L5.83333 6.69303M10 2.52637V12.5264\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span> Export\r\n </div>\r\n <!-- <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div> -->\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"d-flex\">\r\n <div *ngFor=\"let issue of ticketCard\" class=\"card card-view p-5 me-5\">\r\n <span class=\"title fw-bold\">{{issue.count}}</span>\r\n <span class=\"sub-title fw-semibold\">{{issue.name}}</span>\r\n </div>\r\n </div>\r\n <div class=\"rounded-3 border border-gray border-1 mt-5\">\r\n <div *ngIf=\"!loading && !noData\" class=\"row p-5\">\r\n <div class=\"col-sm-6\">\r\n <div *ngFor=\"let data of storeTicket;let index = index\" class=\"issuecard w-100 mb-4 cursor-pointer\"\r\n (click)=\"ShowTicket(index,data?.ticketId)\" [ngClass]=\"selectCard === index ? 'active' : ''\">\r\n <div class=\"maincard-label fw-bold d-flex justify-content-between mb-5\">\r\n <span>\r\n <img src='./assets/tango/Images/ticket.svg'>\r\n <span class=\"mx-2\">{{data?.ticketId}}</span>\r\n </span>\r\n <span class=\"badge text-success\"\r\n [ngClass]=\"data.status === 'closed' ? 'badge-light-success' :(data.status === 'inprogress' ? 'badge-light-primary':'badge-light-warning')\">{{data.status | titlecase}}</span>\r\n </div>\r\n <div *ngIf=\"data.issueStatus === 'notidentified'\" class=\"mb-5 contenttext\">\r\n We have not received data from your store. We are currently investigating the issue.\r\n </div>\r\n <div *ngIf=\"data.issueStatus ==='identified'\" class=\"mb-5 contenttext\">Store is currently\r\n encountering a <span class=\"fw-bold-700\">{{data.primaryIssue}}</span> which is\r\n <span *ngFor=\"let secondary of data.secondaryIssue; let last = last\"\r\n class=\"fw-bold-700\">{{secondary?.name}}<ng-container *ngIf=\"!last\"> ,</ng-container>\r\n </span>.\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"profile d-flex align-items-centre justify-content-centre\">\r\n <img src=\"./assets/tango/Images/userProfile.svg\" alt=\"\">\r\n </div>\r\n <div class=\"d-flex justify-content-between\">\r\n <span class=\"contenttext px-3\"><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=\"M14 10C14 10.3536 13.8595 10.6928 13.6095 10.9428C13.3594 11.1929 13.0203 11.3333 12.6667 11.3333H4.66667L2 14V3.33333C2 2.97971 2.14048 2.64057 2.39052 2.39052C2.64057 2.14048 2.97971 2 3.33333 2H12.6667C13.0203 2 13.3594 2.14048 13.6095 2.39052C13.8595 2.64057 14 2.97971 14 3.33333V10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data.comments}} comments</span>\r\n <span class=\"contenttext px-3\"><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=\"M10.6667 1.33398V4.00065M5.33333 1.33398V4.00065M2 6.66732H14M3.33333 2.66732H12.6667C13.403 2.66732 14 3.26427 14 4.00065V13.334C14 14.0704 13.403 14.6673 12.6667 14.6673H3.33333C2.59695 14.6673 2 14.0704 2 13.334V4.00065C2 3.26427 2.59695 2.66732 3.33333 2.66732Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data.Date}}</span>\r\n <span *ngIf=\"data.status === 'closed'\" class=\"contenttext px-3\"><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=\"M10.6667 1.33398V4.00065M5.33333 1.33398V4.00065M2 6.66732H14M3.33333 2.66732H12.6667C13.403 2.66732 14 3.26427 14 4.00065V13.334C14 14.0704 13.403 14.6673 12.6667 14.6673H3.33333C2.59695 14.6673 2 14.0704 2 13.334V4.00065C2 3.26427 2.59695 2.66732 3.33333 2.66732Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg> {{data?.issueClosedDate | date:'dd-MM-yyyy' }}</span> \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"maincard-label fw-bold d-flex justify-content-between mb-5\">\r\n <span><img class=\"mx-2\" src='./assets/tango/Images/ticket.svg'> {{ticketInfo?.ticketId}}</span>\r\n <span [ngClass]=\"ticketInfo?.status === 'closed' ? 'badge-light-success' :(ticketInfo?.status === 'inprogress' ? 'badge-light-primary':'badge-light-warning')\" class=\"badge badge-light-primary\">{{ticketInfo?.status | titlecase}}</span>\r\n </div>\r\n <div *ngFor=\"let obj of viewTicketData;let i=index\" class=\"\">\r\n <!-- User code start -->\r\n <div *ngIf=\"obj.actionBy === 'User'\" class=\"d-flex mb-5 ms-5\">\r\n <div *ngIf=\"obj.actionType !=='statusChange'\"\r\n class=\"d-flex flex-column justify-content-center align-items-center pe-3\">\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <img class=\"msgprofile\"\r\n src=\"./assets/tango/Images/userProfile.svg\">\r\n </div>\r\n <div class=\"p-0 h-100 mt-3 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n <div class=\"py-3 pt-0\">\r\n <div *ngIf=\"obj.actionType !=='statusChange'\">\r\n <div class=\"d-flex mb-3\">\r\n <span class=\"headingtext fw-bold text-capitalize\">{{obj?.IdentifiedBy?obj?.IdentifiedBy:\"Tango\"}}</span>\r\n <span class=\"timingtext px-3 pt-1 fw-bold-400\">{{obj?.timeStamp}}</span>\r\n </div>\r\n <span class=\"profile-label font-bold-400\">User has replied</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType === 'statusCheckReply'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Issue has been <b><span\r\n *ngIf=\"obj.statusCheckReply==='No'\">not</span> resolved.</b>\r\n\r\n </div>\r\n <div class=\"textupdates fw-bold-400\" *ngIf=\"obj.statusCheckReply==='No'\"> It takes\r\n {{obj?.hibernationDays}} more days to resolve.</div>\r\n </div>\r\n <!-- <div *ngIf=\"\" class=\"\">\r\n <span class=\"investigation fw-bold-400\">Are all CCTV cameras functioning\r\n properly?</span>\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 1</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 2</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <span class=\"\">Camera 3</span>\r\n <div\r\n class=\"d-flex align-items-centre justify-content-centre rounded-3 overflow-hidden\">\r\n <img class=\"w-100\"\r\n src='https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D'>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"textupdates fw-bold-400 mt-5\">\r\n The above camera streaming are not working due <span class=\"fw-bold-700\">power\r\n issue</span> to the camera.\r\n </div>\r\n </div> -->\r\n <div *ngIf=\"obj.actionType ==='issueUpdate'\">\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"textupdates fw-semibold mt-3\">\r\n We're currently encountering an <span\r\n class=\"fw-bold-700\">{{res.primaryIssue}}</span>\r\n </div>\r\n <div *ngIf=\"res.primaryIssue ==='Camera Issues'\">\r\n <div *ngIf=\"notworkingCamaralist && notworkingCamaralist?.length\" class=\"row\">\r\n <div *ngFor=\"let item of notworkingCamaralist\" class=\"col-sm-3 my-5\">\r\n <div *ngIf=\"item?.thumbnailImage\" class=\"rounded-3 overflow-hidden mt-2\">\r\n <span class=\"camera fw-bold\">{{item.cameraName}}</span>\r\n <img [src]=\"item?.thumbnailImage\" style=\"height:180px\">\r\n </div>\r\n </div>\r\n <div class=\"textupdates fw-bold-400 mt-3 me-2\">The above camera streaming are not working due\r\n <span class=\"textupdates fw-bold-700 mt-3\" *ngFor=\"let issue of res?.secondaryIssue; let last = last\">{{issue?.name}} <ng-container *ngIf=\"!last\"> ,</ng-container></span> to the Camera</div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"res?.secondaryIssue && res?.secondaryIssue?.length\" class=\"mt-3\">\r\n <div class=\"investigation fw-bold-400\">The following are the relevant\r\n problem\r\n facing</div>\r\n <ul class=\"timingtext fw-bold-400 mt-3\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"selectedIssue === ''\" class=\"profile-label fw-semibold mt-2\">\r\n Kindly choose the option below that corresponds to the issue you are experiencing in\r\n the\r\n store.\r\n </div>\r\n </div>\r\n </div>\r\n <!-- User code end -->\r\n <!-- Tango code start -->\r\n <div *ngIf=\"obj.actionBy === 'Tango'\" class=\"d-flex mb-5 ms-5\">\r\n <div class=\"d-flex flex-column justify-content-center align-items-center pe-3\">\r\n <div class=\"d-flex align-items-centre justify-content-centre\">\r\n <div class=\"symbol symbol-35px symbol-circle\" *ngIf=\"obj?.IdentifiedBy&&obj?.IdentifiedBy!==''&&obj?.IdentifiedBy!=='Tango'\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{obj?.IdentifiedBy?.slice(0,2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <img *ngIf=\"!obj?.IdentifiedBy||obj?.IdentifiedBy===''||obj?.IdentifiedBy==='Tango'\" class=\"msgprofile\" src=\"./assets/tango/Images/tangoprofile.png\">\r\n </div>\r\n <div class=\"p-0 h-100 mt-3 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n \r\n <div class=\"py-3 pt-0\">\r\n <div class=\"d-flex mb-3\">\r\n <span class=\"headingtext fw-bold text-capitalize\">{{obj?.IdentifiedBy?obj?.IdentifiedBy:\"Tango\"}}</span>\r\n <span class=\"timingtext fw-bold-400 px-3 pt-1\">{{obj?.timeStamp}}</span>\r\n </div>\r\n <div class=\"mb-3\">\r\n <span class=\"profile-label fw-bold-400\">tango has replied to the\r\n issue</span>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'dataRecived'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Data Received\r\n </div>\r\n </div>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'comment'\">\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">{{obj?.comment}}</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType === 'statusCheckMonitor'\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">Thank you for the update. We\u2019ll get\r\n back after the buffer time you provided.\r\n </div>\r\n </div>\r\n <div class=\"mt-2\" *ngIf=\"obj.actionType === 'statusChange'\">\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">Updated the status</span><span\r\n class=\"timingtext fw-semibold text-primary\">Open -> Inprogress</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType ==='issueUpdate'\">\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"textupdates fw-bold-400 mt-3\">\r\n We're currently encountering an <span\r\n class=\"fw-bold-700\">{{res.primaryIssue}}</span>\r\n </div>\r\n <div *ngIf=\"res.primaryIssue ==='Camera Issues'\">\r\n <div class=\"row my-5\">\r\n <div *ngFor=\"let item of notworkingCamaralist\" class=\"col-sm-3\">\r\n <div class=\"rounded-3 overflow-hidden mt-2\">\r\n <span class=\"camera fw-bold\">{{item.cameraName}}</span>\r\n <img [src]=\"item?.thumbnailImage\" style=\"height:180px\">\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"textupdates fw-bold-400 mt-3 me-2\">The above camera streaming are not working due</span>\r\n <span class=\"textupdates fw-bold-700 mt-3\" *ngFor=\"let issue of res?.secondaryIssue; let last = last\">{{issue?.name}} <ng-container *ngIf=\"!last\"> ,</ng-container></span> <span class=\"textupdates fw-bold-400 mt-3\">to the Camera</span>\r\n \r\n </div>\r\n <div class=\"mt-3\">\r\n <div class=\"investigation fw-bold-400 mb-3\">The following are the relevant\r\n problem\r\n facing</div>\r\n <div class=\"mb-5\"> \r\n <ul class=\"timingtext fw-bold-400 mb-0\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"timingtext pe-3 pt-1 fw-bold-400\">{{obj?.comment}}</span>\r\n </div>\r\n <div *ngIf=\"obj.actionType ==='stepsToResolve'\" class=\"mt-3\">\r\n <span class=\"textupdates fw-bold-400\">Please follow the below steps to resolve\r\n the above issue</span>\r\n <div *ngFor=\"let res of obj?.reasons\">\r\n <div class=\"mt-5\">\r\n <span class=\"headingtext fw-semibold mb-1\">{{res.primaryIssue}}</span>\r\n <ul class=\"timingtext fw-bold-400 mb-0\"\r\n *ngFor=\"let secIssues of res?.secondaryIssue\">\r\n <li>{{secIssues.name}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <!-- defaultInfra start -->\r\n <div *ngIf=\"obj.actionType ==='defaultInfra'\" class=\"contenttext fw-bold-400\">We have\r\n not\r\n received data from your store. We are currently investigating the issue</div>\r\n <!-- defaultInfra end -->\r\n\r\n\r\n\r\n\r\n\r\n </div>\r\n </div>\r\n <!-- Tango code end -->\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading\">\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\r\n <div 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-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>", styles: [".card-label{font-size:16px!important;line-height:24px!important}.card-view{width:19%}.card-view .title{color:var(--Gray-900, #101828);font-size:20px;line-height:30px}.card-view .sub-title{color:var(--Gray-700, #344054);font-size:14px;line-height:20px}.issuecard{width:240px;border-radius:10px;border:1px solid var(--Gray-200, #EAECF0);padding:16px}.issuecard label{color:var(--Black, #101828);font-size:14px;line-height:20px}.issuecard.active,.card-view.active{border:none!important;background:var(--Primary-25, #F6FCFF);box-shadow:0 0 0 4px #e9f7ff}.contenttext{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.maincard-content{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD)}.maincard-label{color:var(--Gray-900, #101828);font-size:16px;line-height:24px}.profile{width:24px;height:24px;overflow:hidden;border-radius:200px}.fw-bold-700{font-weight:700!important}.fw-bold-400{font-weight:400!important}.msgprofile{width:48px!important;height:48px!important;border-radius:200px;overflow:hidden}.timingtext{color:var(--Gray-500, #667085);font-size:14px;line-height:18px}.profile-label{font-size:16px;color:var(--Gray-500, #667085);line-height:24px}.w-45{width:49%}.textupdates{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.textupdates1{color:var(--Gray-700, #344054);font-size:14px;line-height:24px}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!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 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}: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}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.img-src{width:25%!important}\n"] }]
|
|
1345
1360
|
}], ctorParameters: () => [{ type: TicketsService }, { type: DataService }, { type: i0.ChangeDetectorRef }, { type: i4.GlobalStateService }], propDecorators: { storeId: [{
|
|
1346
1361
|
type: Input
|
|
1347
1362
|
}], onClick: [{
|
|
@@ -1822,11 +1837,16 @@ class StoreInfoComponent {
|
|
|
1822
1837
|
cameraImages;
|
|
1823
1838
|
selectedDate;
|
|
1824
1839
|
totalDownTime = 0;
|
|
1840
|
+
isCustomDate;
|
|
1825
1841
|
constructor(service, cd) {
|
|
1826
1842
|
this.service = service;
|
|
1827
1843
|
this.cd = cd;
|
|
1828
1844
|
}
|
|
1829
1845
|
ngOnInit() {
|
|
1846
|
+
this.isCustomDate = (m) => {
|
|
1847
|
+
const isValidDate = m > this.dayjs();
|
|
1848
|
+
return isValidDate ? 'invalid-date' : false;
|
|
1849
|
+
};
|
|
1830
1850
|
this.selectedDateRange.startDate = this.dayjs().utc().format('DD-MM-YYYY');
|
|
1831
1851
|
this.selectedDate = this.dayjs().utc().format('YYYY-MM-DD');
|
|
1832
1852
|
this.getCameraImages();
|
|
@@ -1884,8 +1904,11 @@ class StoreInfoComponent {
|
|
|
1884
1904
|
this.service.edgeAppLogTable(data).subscribe({
|
|
1885
1905
|
next: (res) => {
|
|
1886
1906
|
this.DowmTimeArray = res.data;
|
|
1907
|
+
this.totalDownTime = 0;
|
|
1887
1908
|
this.DowmTimeArray.forEach((item) => {
|
|
1888
|
-
|
|
1909
|
+
if (item?.downtime != '') {
|
|
1910
|
+
this.totalDownTime += item.downtime;
|
|
1911
|
+
}
|
|
1889
1912
|
});
|
|
1890
1913
|
this.cd.detectChanges();
|
|
1891
1914
|
}
|
|
@@ -1911,7 +1934,7 @@ class StoreInfoComponent {
|
|
|
1911
1934
|
if (this.DowmTimeArray?.length && this.DowmTimeArray.filter((x) => x.hour == parseInt(time[0]) && x.downtime > 0 && x.downtime >= parseInt(time[1])).length) {
|
|
1912
1935
|
return 'negative';
|
|
1913
1936
|
}
|
|
1914
|
-
else if (this.DowmTimeArray?.length && this.DowmTimeArray.filter((x) => x.hour == parseInt(time[0]) && (this.selectedDate < date || (this.selectedDate == date && (x.hour < nowHour || (nowHour == x.hour && nowminutes >= parseInt(time[1])))))).length) {
|
|
1937
|
+
else if (this.DowmTimeArray?.length && this.DowmTimeArray.filter((x) => x.hour == parseInt(time[0]) && x.downtime != '' && (this.selectedDate < date || (this.selectedDate == date && (x.hour < nowHour || (nowHour == x.hour && nowminutes >= parseInt(time[1])))))).length) {
|
|
1915
1938
|
return 'positive';
|
|
1916
1939
|
}
|
|
1917
1940
|
else {
|
|
@@ -2000,12 +2023,20 @@ class StoreInfoComponent {
|
|
|
2000
2023
|
hour = time.time24Hour.split(':')[1] == '00' ? time.timeString12HourOnly : false;
|
|
2001
2024
|
return hour;
|
|
2002
2025
|
}
|
|
2026
|
+
onStartDateChange(event) {
|
|
2027
|
+
if (this.dayjs(event.startDate).isValid()) {
|
|
2028
|
+
this.isCustomDate = (m) => {
|
|
2029
|
+
const isValidDate = m > this.dayjs() || m > this.dayjs(event.startDate.add(90, "days"));
|
|
2030
|
+
return isValidDate ? "invalid-date" : false;
|
|
2031
|
+
};
|
|
2032
|
+
}
|
|
2033
|
+
}
|
|
2003
2034
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: StoreInfoComponent, deps: [{ token: TicketsService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2004
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: StoreInfoComponent, selector: "lib-store-info", inputs: { storeId: "storeId" }, ngImport: i0, template: "<div class=\"card\">\r\n <div class=\"card-body\">\r\n <div class=\"\">\r\n <div class=\"d-flex align-items-center\">\r\n <span class=\"title\">Store Info</span>\r\n </div>\r\n <span class=\"fw-bold-400 subTitle\">An overview of the store issues and the downtime for {{selectedDate | customDateFormat }}</span>\r\n </div>\r\n <div class=\"my-5 timeRange fw-semibold\">Total : {{totalDownTime}} mins Downtime </div>\r\n <div class=\" mt-2 mx-2\" *ngIf=\"timeSeries?.length\">\r\n <div class=\"flex-container d-flex justify-content-between\">\r\n <span *ngFor=\"let time of timeSeries;let Index=index\" class=\"svg-container\">\r\n <!-- normal -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'normal'\"\r\n class=\"timeItem my-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"53\"\r\n viewBox=\"0 0 4 53\" fill=\"none\">\r\n <path d=\"M2.08032 2.5L2.08032 50.5\" stroke=\"#D0D5DD\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n\r\n <!-- Present hour for live -->\r\n <!-- <svg *ngIf=\"time.activeHr\" class=\"timeItem my-2\" xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"12\" height=\"53\" viewBox=\"0 0 4 53\" fill=\"none\">\r\n <path d=\"M2.08032 2.5L2.08032 50.5\" stroke=\"#00A3FF\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg> -->\r\n\r\n <!-- positive -->\r\n <!-- (mouseenter)=\"showDialogBox(time,Index)\" -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'positive'\"\r\n class=\"timeItem\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"68\" viewBox=\"0 0 5 68\"\r\n fill=\"none\">\r\n <path d=\"M2.40015 2.5L2.40014 66.5\" stroke=\"#039855\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n\r\n <!-- negative -->\r\n <!-- (mouseenter)=\"showDialogBox(time,Index)\" -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'negative'\"\r\n class=\"timeItem\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"68\" viewBox=\"0 0 5 68\"\r\n fill=\"none\">\r\n <path d=\"M2.48682 2L2.48682 66\" stroke=\"#D92D20\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n <div class=\"dialog-box\" [ngStyle]=\"getStyle()\" *ngIf=\"showIncidentPop && showIncidentPopIndex === Index\">\r\n <!-- (mouseleave)=\"hideDialogBox()\" -->\r\n <!-- -ve -->\r\n <ng-container *ngIf=\"showIncidentOptions.neg\">\r\n <svg width=\"65\" height=\"64\" viewBox=\"0 0 65 64\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_dd_5752_36075)\">\r\n <rect x=\"4.82642\" y=\"4.32617\" width=\"55.3473\" height=\"55.3473\"\r\n rx=\"7.90676\" fill=\"#FEF3F2\" />\r\n <path\r\n d=\"M29.9446 25.5987C30.2221 25.8761 30.2221 26.3259 29.9446 26.6033L27.1032 29.4448C26.8257 29.7222 26.376 29.7222 26.0985 29.4448L24.6778 28.0241C24.4004 27.7466 24.4004 27.2969 24.6778 27.0194C24.9552 26.742 25.405 26.742 25.6824 27.0194L26.6008 27.9379L28.94 25.5987C29.2175 25.3213 29.6672 25.3213 29.9446 25.5987Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M29.9446 32.7026C30.2221 32.9801 30.2221 33.4299 29.9446 33.7074L27.1032 36.5489C26.8257 36.8262 26.376 36.8262 26.0985 36.5489L24.6778 35.1281C24.4004 34.8507 24.4004 34.4008 24.6778 34.1234C24.9552 33.846 25.405 33.846 25.6824 34.1234L26.6008 35.0419L28.94 32.7026C29.2175 32.4253 29.6672 32.4253 29.9446 32.7026Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M31.5735 27.5219C31.5735 27.1296 31.8916 26.8115 32.2839 26.8115H36.5461C36.9384 26.8115 37.2565 27.1296 37.2565 27.5219C37.2565 27.9142 36.9384 28.2323 36.5461 28.2323H32.2839C31.8916 28.2323 31.5735 27.9142 31.5735 27.5219Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M25.18 21.1284C23.2184 21.1284 21.6282 22.7186 21.6282 24.6803V37.467C21.6282 39.4286 23.2184 41.0189 25.18 41.0189H31.0047C30.7746 40.5688 30.5869 40.0934 30.4468 39.5981H25.18C24.0031 39.5981 23.0489 38.6439 23.0489 37.467V24.6803C23.0489 23.5033 24.0031 22.5492 25.18 22.5492H37.9668C39.1437 22.5492 40.0979 23.5033 40.0979 24.6803V29.947C40.5931 30.0871 41.0685 30.2749 41.5186 30.5049V24.6803C41.5186 22.7186 39.9284 21.1284 37.9668 21.1284H25.18Z\"\r\n fill=\"#F04438\" />\r\n <circle cx=\"37.936\" cy=\"37.436\" r=\"6.42424\" fill=\"#F04438\" />\r\n <path\r\n d=\"M38.7415 35.5265V40.5581H37.6777V36.5363H37.6482L36.496 37.2586V36.3152L37.7416 35.5265H38.7415Z\"\r\n fill=\"white\" />\r\n <rect x=\"5.32059\" y=\"4.82034\" width=\"54.359\" height=\"54.359\"\r\n rx=\"7.41259\" stroke=\"#FEF3F2\" stroke-width=\"0.988345\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_5752_36075\" x=\"0.826416\" y=\"0.326172\"\r\n width=\"63.3474\" height=\"63.3472\" 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\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"dilate\" in=\"SourceAlpha\"\r\n result=\"effect1_dropShadow_5752_36075\" />\r\n <feOffset />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.997059 0 0 0 0 0.892745 0 0 0 0 0.885294 0 0 0 1 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_5752_36075\" />\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\"\r\n 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=\"effect1_dropShadow_5752_36075\"\r\n result=\"effect2_dropShadow_5752_36075\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\"\r\n in2=\"effect2_dropShadow_5752_36075\" result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div class=\"text-primary supporting-text\" style=\"cursor: pointer;\" (click)=\"scrollTo_mobdetectionsection(time?.incidents[0]?.category);\">Click to view details</div>\r\n </div> -->\r\n </ng-container>\r\n \r\n <!-- +ve -->\r\n <ng-container *ngIf=\"showIncidentOptions.pos\">\r\n <svg width=\"57\" height=\"57\" viewBox=\"0 0 57 57\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4.5\" y=\"4.83691\" width=\"48\" height=\"48\" rx=\"24\"\r\n fill=\"#D1FADF\" />\r\n <path\r\n d=\"M38.5 27.917V28.837C38.4988 30.9934 37.8005 33.0917 36.5093 34.8188C35.2182 36.546 33.4033 37.8095 31.3354 38.4209C29.2674 39.0323 27.0573 38.9589 25.0345 38.2116C23.0117 37.4643 21.2847 36.0831 20.111 34.2741C18.9373 32.4651 18.3798 30.3251 18.5217 28.1733C18.6636 26.0216 19.4972 23.9733 20.8983 22.3341C22.2994 20.6948 24.1928 19.5524 26.2962 19.0772C28.3996 18.6019 30.6003 18.8194 32.57 19.697M38.5 20.837L28.5 30.847L25.5 27.847\"\r\n stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <rect x=\"4.5\" y=\"4.83691\" width=\"48\" height=\"48\" rx=\"24\"\r\n stroke=\"#ECFDF3\" stroke-width=\"8\" />\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div class=\"supporting-text text-primary\" style=\"cursor: pointer;\"\r\n (click)=\"scrollTo_Submituser();\">Submitted by\r\n {{time?.incidents[0]?.userName}}</div>\r\n </div> -->\r\n </ng-container>\r\n \r\n <!-- store op -->\r\n <ng-container *ngIf=\"showIncidentOptions.storeop\">\r\n <svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_dd_5752_36067)\">\r\n <rect x=\"4.32642\" y=\"4\" width=\"55.3473\" height=\"55.3473\"\r\n rx=\"7.90676\" fill=\"#EAF8FF\" />\r\n <path\r\n d=\"M29.4449 25.272C29.7223 25.5495 29.7223 25.9992 29.4449 26.2766L26.6034 29.1181C26.326 29.3956 25.8762 29.3956 25.5988 29.1181L24.178 27.6974C23.9006 27.42 23.9006 26.9702 24.178 26.6928C24.4555 26.4154 24.9052 26.4154 25.1827 26.6928L26.1011 27.6112L28.4403 25.272C28.7177 24.9946 29.1675 24.9946 29.4449 25.272Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M29.4449 32.376C29.7223 32.6534 29.7223 33.1032 29.4449 33.3807L26.6034 36.2222C26.326 36.4995 25.8762 36.4995 25.5988 36.2222L24.178 34.8015C23.9006 34.524 23.9006 34.0742 24.178 33.7967C24.4555 33.5194 24.9052 33.5194 25.1827 33.7967L26.1011 34.7152L28.4403 32.376C28.7177 32.0986 29.1675 32.0986 29.4449 32.376Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M31.0737 27.1952C31.0737 26.8029 31.3918 26.4849 31.7841 26.4849H36.0463C36.4386 26.4849 36.7567 26.8029 36.7567 27.1952C36.7567 27.5876 36.4386 27.9056 36.0463 27.9056H31.7841C31.3918 27.9056 31.0737 27.5876 31.0737 27.1952Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M24.6803 20.8018C22.7186 20.8018 21.1284 22.392 21.1284 24.3536V37.1403C21.1284 39.102 22.7186 40.6922 24.6803 40.6922H30.5049C30.2749 40.2421 30.0871 39.7667 29.947 39.2715H24.6803C23.5033 39.2715 22.5492 38.3173 22.5492 37.1403V24.3536C22.5492 23.1766 23.5033 22.2225 24.6803 22.2225H37.467C38.6439 22.2225 39.5981 23.1766 39.5981 24.3536V29.6204C40.0934 29.7605 40.5688 29.9482 41.0189 30.1783V24.3536C41.0189 22.392 39.4286 20.8018 37.467 20.8018H24.6803Z\"\r\n fill=\"#009BF3\" />\r\n <circle cx=\"37.436\" cy=\"37.1098\" r=\"6.42424\" fill=\"#009BF3\" />\r\n <path\r\n d=\"M38.2417 35.2004V40.2319H37.1779V36.2101H37.1485L35.9962 36.9324V35.989L37.2418 35.2004H38.2417Z\"\r\n fill=\"white\" />\r\n <rect x=\"4.82059\" y=\"4.49417\" width=\"54.359\" height=\"54.359\"\r\n rx=\"7.41259\" stroke=\"#EAF8FF\" stroke-width=\"0.988345\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_5752_36067\" x=\"0.326416\" y=\"0\"\r\n width=\"63.3474\" height=\"63.3472\" 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\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"dilate\" in=\"SourceAlpha\"\r\n result=\"effect1_dropShadow_5752_36067\" />\r\n <feOffset />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.83637 0 0 0 0 0.938377 0 0 0 0 0.996667 0 0 0 1 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_5752_36067\" />\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\"\r\n 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=\"effect1_dropShadow_5752_36067\"\r\n result=\"effect2_dropShadow_5752_36067\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\"\r\n in2=\"effect2_dropShadow_5752_36067\" result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div *ngIf=\"time?.incidents[0]?.type == 'positive'\"\r\n class=\"supporting-text\">On time opening/closing</div>\r\n <div *ngIf=\"time?.incidents[0]?.type == 'negative'\"\r\n class=\"supporting-text\">Store Open/Close Delayed?Early</div>\r\n </div> -->\r\n </ng-container>\r\n </div>\r\n </span>\r\n </div>\r\n <div class=\"flex-container d-flex justify-content-between\">\r\n <span *ngFor=\"let time of timeSeries;let i=index;\">\r\n <span class=\"hourText\" *ngIf=\"showHours(time)\">{{showHours(time)}}</span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"card mt-5\">\r\n <div class=\"card-header\">\r\n <div class=\"card-title\">\r\n <div class=\"card-body p-0 \">\r\n <div class=\"d-flex align-items-center\">\r\n <span class=\"title\">Camera Info</span>\r\n </div>\r\n <span class=\"fw-bold-400 subTitle\">An overview of the store issues and the downtime for {{selectedDate|customDateFormat }}</span>\r\n </div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [singleDatePicker]=\"true\" [drops]=\"'down'\"\r\n [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"row mt-7\">\r\n <div class=\"col-sm-6\">\r\n <div *ngIf=\"totalImageUrl?.length && !loading && !noData\">\r\n <div class=\"d-flex align-items-center\"><div *ngIf=\"selectedUrl?.cameraNumber || imageUrl[0]?.cameraNumber\" [ngClass]=\"((selectedUrl?.isActivated && selectedUrl?.isUp) || (imageUrl[0]?.isActivated && imageUrl[0]?.isUp))?'bg-danger':'bg-success'\" class=\"w-10px h-10px border-0 rounded-3 me-2\"></div>\r\n <span class=\"camera-title\">{{selectedUrl?.cameraNumber ? selectedUrl?.cameraNumber : imageUrl[0]?.cameraNumber}}</span> <span *ngIf=\"selectedUrl?.cameraName\" class=\"badge badge-light-primary text-primary ms-2\">\r\n {{selectedUrl?.cameraName ? selectedUrl?.cameraName : imageUrl[0]?.cameraName}}\r\n </span></div>\r\n <div class=\"rounded-2 w-100 mh-350px overflow-hidden mt-5\">\r\n <img *ngIf=\"selectedUrl?.thumbnailImage !== null || selectedUrl?.thumbnailImage !== '' || imageUrl[0]?.thumbnailImage !== ''\" class=\"w-100 mh-350px\" [src]=\"selectedUrl?.thumbnailImage ? selectedUrl?.thumbnailImage : imageUrl[0]?.thumbnailImage\">\r\n\r\n <div *ngIf=\"selectedUrl?.thumbnailImage === null || selectedUrl?.thumbnailImage === '' || imageUrl[0]?.thumbnailImage === ''\" class=\"w-100 h-300px rounded-2 overflow-hidden Nopreview align-content-center\">\r\n <div class=\"previewTitle text-center mb-5\">\r\n Preview not available\r\n </div>\r\n <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"row mt-3 position-relative\">\r\n <div *ngFor=\"let url of imageUrl; let i = index\" class=\"col-sm-4\" (click)=\"selectedImg(url)\">\r\n <img *ngIf=\"url?.thumbnailImage !== null || url?.thumbnailImage !== ''\" class=\"w-100 rounded-2 mh-100px\" [src]=\"url?.thumbnailImage\">\r\n <div *ngIf=\"url?.thumbnailImage === null || url?.thumbnailImage === ''\" class=\"w-100 rounded-2 h-100px Nopreview align-content-center\">\r\n <div class=\"previewTitle text-center fs-4 mb-2\">\r\n Preview not available\r\n </div>\r\n <!-- <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div> -->\r\n </div>\r\n </div>\r\n <div *ngIf=\"showPrev\" (click)=\"prevImages()\" class=\"w-35px h-35px bg-light-primary rounded-5 cursor-pointer d-flex align-items-center align-items-center position-absolute left-0 ms-5 mt-2 top-25\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M12.5 15.0264L7.5 10.0264L12.5 5.02637\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div>\r\n <div *ngIf=\"showNext && totalImageUrl.length > 3\" (click)=\"nextImages()\" class=\"w-35px h-35px bg-light-primary rounded-5 cursor-pointer d-flex align-items-center align-items-center position-absolute end-0 me-5 mt-2 top-25\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M7.5 15.0264L12.5 10.0264L7.5 5.02637\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData || !totalImageUrl?.length\">\r\n <div 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-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"mt-10\">\r\n <div class=\"d-flex align-items-center\" *ngIf=\"anglechangeData?.anglechange\">\r\n <span class=\"camera-actual fw-bold\">Camera Angle</span>\r\n <div class=\"ms-3\">\r\n <span class=\"badge badge-light-danger text-danger\"> <input class=\"w-10px h-10px border-0 rounded-2 bg-danger me-2\">Changed</span>\r\n </div>\r\n </div>\r\n <div class=\"row mt-5\">\r\n <img class=\"w-100 mh-150px\" [src]=\"anglechangeData?.angleChangeImage\">\r\n <!-- <div class=\"col-sm-6\">\r\n <div class=\"w-100 rounded-3 overflow-hidden\">\r\n <img class=\"w-100 mh-150px\" src=\"https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"w-100 rounded-3 overflow-hidden\">\r\n <img class=\"w-100 mh-150px\" src=\"https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"row p-0\" *ngIf=\"anglechangeData?.anglechange\">\r\n <div class=\"col-md-6 m-0 pe-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6 m-0 ps-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"w-100 mt-10 table-responsive\" *ngIf=\"this.anglechangeData?.resolution\">\r\n <table class=\"w-100 table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>Instances</th>\r\n <th>Expected</th>\r\n <th>Actual</th>\r\n <th>Results</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td><span class=\"subTitle fw-semibold\"> Camera Resolution </span></td>\r\n <td>1080 x 900</td>\r\n <td>{{this.anglechangeData?.resolution}}</td>\r\n <td>\r\n <span class=\"badge badge-light-success text-success px-1\" *ngIf=\"resolutiontype\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_18201)\">\r\n <path d=\"M11 5.5663V6.0263C10.9994 7.10451 10.6503 8.15364 10.0047 9.01721C9.35908 9.88079 8.45164 10.5125 7.41768 10.8182C6.38372 11.124 5.27863 11.0872 4.26724 10.7136C3.25584 10.3399 2.39233 9.64935 1.80548 8.74483C1.21863 7.84032 0.939896 6.77033 1.01084 5.69446C1.08178 4.61858 1.4986 3.59446 2.19914 2.77484C2.89968 1.95521 3.84639 1.38399 4.89809 1.14637C5.9498 0.908754 7.05013 1.01747 8.035 1.4563M11 2.0263L6 7.0313L4.5 5.5313\" stroke=\"#12B76A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_18201\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"badge badge-light-danger text-danger px-1\" *ngIf=\"!resolutiontype\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_2326)\">\r\n <path d=\"M6 8.02637V6.02637M6 4.02637H6.005M11 6.02637C11 8.78779 8.76142 11.0264 6 11.0264C3.23858 11.0264 1 8.78779 1 6.02637C1 3.26494 3.23858 1.02637 6 1.02637C8.76142 1.02637 11 3.26494 11 6.02637Z\" stroke=\"#F04438\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_2326\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span></td>\r\n </tr>\r\n <!-- <tr>\r\n <td><span class=\"subTitle fw-semibold\">Downtime</span></td>\r\n <td>200mins</td>\r\n <td>140mins</td>\r\n <td><span class=\"badge badge-light-success text-success px-1\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_18201)\">\r\n <path d=\"M11 5.5663V6.0263C10.9994 7.10451 10.6503 8.15364 10.0047 9.01721C9.35908 9.88079 8.45164 10.5125 7.41768 10.8182C6.38372 11.124 5.27863 11.0872 4.26724 10.7136C3.25584 10.3399 2.39233 9.64935 1.80548 8.74483C1.21863 7.84032 0.939896 6.77033 1.01084 5.69446C1.08178 4.61858 1.4986 3.59446 2.19914 2.77484C2.89968 1.95521 3.84639 1.38399 4.89809 1.14637C5.9498 0.908754 7.05013 1.01747 8.035 1.4563M11 2.0263L6 7.0313L4.5 5.5313\" stroke=\"#12B76A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_18201\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span></td>\r\n </tr> -->\r\n </tbody>\r\n </table>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n</div>\r\n\r\n<div class=\"mt-5\">\r\n <lib-edgeapp-log [storeId] = \"storeId\"></lib-edgeapp-log>\r\n</div>\r\n<div class=\"mt-5\">\r\n <lib-store-activity [storeId]=\"storeId\"></lib-store-activity>\r\n</div>", styles: [".fw-bold-400{font-weight:400}.subTitle{color:var(--Gray-500, #667085);font-size:14px;line-height:20px}.timeRange{color:var(--Black, #101828);font-size:16px;line-height:24px}tr td{padding-top:15px!important;padding-bottom:15px!important}.camera-title{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.camera-actual{color:var(--Gray-700, #344054);font-size:16px;font-weight:600;line-height:24px}.actualspan{color:var(--Black, #101828);font-size:12px;font-weight:400;line-height:18px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!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 .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}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.Nopreview{border:1px solid var(--Gray-500, #667085);background:var(--Gray-100, #F2F4F7);color:var(--Gray-500, #667085)}.Nopreview .previewTitle{font-size:20px;font-weight:700;line-height:20px}.Nopreview .previewsubTitle{text-align:center;font-size:12px;line-height:18px}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i6$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: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.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: "component", type: EdgeappLogComponent, selector: "lib-edgeapp-log", inputs: ["storeId"] }, { kind: "component", type: StoreActivityComponent, selector: "lib-store-activity", inputs: ["storeId"] }, { kind: "pipe", type: i3.CustomDateFormatPipe, name: "customDateFormat" }] });
|
|
2035
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: StoreInfoComponent, selector: "lib-store-info", inputs: { storeId: "storeId" }, ngImport: i0, template: "<div class=\"card\">\r\n <div class=\"card-body\">\r\n <div class=\"\">\r\n <div class=\"d-flex align-items-center\">\r\n <span class=\"title\">Store Info</span>\r\n </div>\r\n <span class=\"fw-bold-400 subTitle\">An overview of the store issues and the downtime for {{selectedDate | customDateFormat }}</span>\r\n </div>\r\n <div class=\"my-5 timeRange fw-semibold\">Total : {{totalDownTime}} mins Downtime </div>\r\n <div class=\" mt-2 mx-2\" *ngIf=\"timeSeries?.length\">\r\n <div class=\"flex-container d-flex justify-content-between\">\r\n <span *ngFor=\"let time of timeSeries;let Index=index\" class=\"svg-container\">\r\n <!-- normal -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'normal'\"\r\n class=\"timeItem my-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"53\"\r\n viewBox=\"0 0 4 53\" fill=\"none\">\r\n <path d=\"M2.08032 2.5L2.08032 50.5\" stroke=\"#D0D5DD\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n\r\n <!-- Present hour for live -->\r\n <!-- <svg *ngIf=\"time.activeHr\" class=\"timeItem my-2\" xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"12\" height=\"53\" viewBox=\"0 0 4 53\" fill=\"none\">\r\n <path d=\"M2.08032 2.5L2.08032 50.5\" stroke=\"#00A3FF\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg> -->\r\n\r\n <!-- positive -->\r\n <!-- (mouseenter)=\"showDialogBox(time,Index)\" -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'positive'\"\r\n class=\"timeItem\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"68\" viewBox=\"0 0 5 68\"\r\n fill=\"none\">\r\n <path d=\"M2.40015 2.5L2.40014 66.5\" stroke=\"#039855\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n\r\n <!-- negative -->\r\n <!-- (mouseenter)=\"showDialogBox(time,Index)\" -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'negative'\"\r\n class=\"timeItem\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"68\" viewBox=\"0 0 5 68\"\r\n fill=\"none\">\r\n <path d=\"M2.48682 2L2.48682 66\" stroke=\"#D92D20\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n <div class=\"dialog-box\" [ngStyle]=\"getStyle()\" *ngIf=\"showIncidentPop && showIncidentPopIndex === Index\">\r\n <!-- (mouseleave)=\"hideDialogBox()\" -->\r\n <!-- -ve -->\r\n <ng-container *ngIf=\"showIncidentOptions.neg\">\r\n <svg width=\"65\" height=\"64\" viewBox=\"0 0 65 64\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_dd_5752_36075)\">\r\n <rect x=\"4.82642\" y=\"4.32617\" width=\"55.3473\" height=\"55.3473\"\r\n rx=\"7.90676\" fill=\"#FEF3F2\" />\r\n <path\r\n d=\"M29.9446 25.5987C30.2221 25.8761 30.2221 26.3259 29.9446 26.6033L27.1032 29.4448C26.8257 29.7222 26.376 29.7222 26.0985 29.4448L24.6778 28.0241C24.4004 27.7466 24.4004 27.2969 24.6778 27.0194C24.9552 26.742 25.405 26.742 25.6824 27.0194L26.6008 27.9379L28.94 25.5987C29.2175 25.3213 29.6672 25.3213 29.9446 25.5987Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M29.9446 32.7026C30.2221 32.9801 30.2221 33.4299 29.9446 33.7074L27.1032 36.5489C26.8257 36.8262 26.376 36.8262 26.0985 36.5489L24.6778 35.1281C24.4004 34.8507 24.4004 34.4008 24.6778 34.1234C24.9552 33.846 25.405 33.846 25.6824 34.1234L26.6008 35.0419L28.94 32.7026C29.2175 32.4253 29.6672 32.4253 29.9446 32.7026Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M31.5735 27.5219C31.5735 27.1296 31.8916 26.8115 32.2839 26.8115H36.5461C36.9384 26.8115 37.2565 27.1296 37.2565 27.5219C37.2565 27.9142 36.9384 28.2323 36.5461 28.2323H32.2839C31.8916 28.2323 31.5735 27.9142 31.5735 27.5219Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M25.18 21.1284C23.2184 21.1284 21.6282 22.7186 21.6282 24.6803V37.467C21.6282 39.4286 23.2184 41.0189 25.18 41.0189H31.0047C30.7746 40.5688 30.5869 40.0934 30.4468 39.5981H25.18C24.0031 39.5981 23.0489 38.6439 23.0489 37.467V24.6803C23.0489 23.5033 24.0031 22.5492 25.18 22.5492H37.9668C39.1437 22.5492 40.0979 23.5033 40.0979 24.6803V29.947C40.5931 30.0871 41.0685 30.2749 41.5186 30.5049V24.6803C41.5186 22.7186 39.9284 21.1284 37.9668 21.1284H25.18Z\"\r\n fill=\"#F04438\" />\r\n <circle cx=\"37.936\" cy=\"37.436\" r=\"6.42424\" fill=\"#F04438\" />\r\n <path\r\n d=\"M38.7415 35.5265V40.5581H37.6777V36.5363H37.6482L36.496 37.2586V36.3152L37.7416 35.5265H38.7415Z\"\r\n fill=\"white\" />\r\n <rect x=\"5.32059\" y=\"4.82034\" width=\"54.359\" height=\"54.359\"\r\n rx=\"7.41259\" stroke=\"#FEF3F2\" stroke-width=\"0.988345\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_5752_36075\" x=\"0.826416\" y=\"0.326172\"\r\n width=\"63.3474\" height=\"63.3472\" 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\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"dilate\" in=\"SourceAlpha\"\r\n result=\"effect1_dropShadow_5752_36075\" />\r\n <feOffset />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.997059 0 0 0 0 0.892745 0 0 0 0 0.885294 0 0 0 1 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_5752_36075\" />\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\"\r\n 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=\"effect1_dropShadow_5752_36075\"\r\n result=\"effect2_dropShadow_5752_36075\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\"\r\n in2=\"effect2_dropShadow_5752_36075\" result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div class=\"text-primary supporting-text\" style=\"cursor: pointer;\" (click)=\"scrollTo_mobdetectionsection(time?.incidents[0]?.category);\">Click to view details</div>\r\n </div> -->\r\n </ng-container>\r\n \r\n <!-- +ve -->\r\n <ng-container *ngIf=\"showIncidentOptions.pos\">\r\n <svg width=\"57\" height=\"57\" viewBox=\"0 0 57 57\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4.5\" y=\"4.83691\" width=\"48\" height=\"48\" rx=\"24\"\r\n fill=\"#D1FADF\" />\r\n <path\r\n d=\"M38.5 27.917V28.837C38.4988 30.9934 37.8005 33.0917 36.5093 34.8188C35.2182 36.546 33.4033 37.8095 31.3354 38.4209C29.2674 39.0323 27.0573 38.9589 25.0345 38.2116C23.0117 37.4643 21.2847 36.0831 20.111 34.2741C18.9373 32.4651 18.3798 30.3251 18.5217 28.1733C18.6636 26.0216 19.4972 23.9733 20.8983 22.3341C22.2994 20.6948 24.1928 19.5524 26.2962 19.0772C28.3996 18.6019 30.6003 18.8194 32.57 19.697M38.5 20.837L28.5 30.847L25.5 27.847\"\r\n stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <rect x=\"4.5\" y=\"4.83691\" width=\"48\" height=\"48\" rx=\"24\"\r\n stroke=\"#ECFDF3\" stroke-width=\"8\" />\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div class=\"supporting-text text-primary\" style=\"cursor: pointer;\"\r\n (click)=\"scrollTo_Submituser();\">Submitted by\r\n {{time?.incidents[0]?.userName}}</div>\r\n </div> -->\r\n </ng-container>\r\n \r\n <!-- store op -->\r\n <ng-container *ngIf=\"showIncidentOptions.storeop\">\r\n <svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_dd_5752_36067)\">\r\n <rect x=\"4.32642\" y=\"4\" width=\"55.3473\" height=\"55.3473\"\r\n rx=\"7.90676\" fill=\"#EAF8FF\" />\r\n <path\r\n d=\"M29.4449 25.272C29.7223 25.5495 29.7223 25.9992 29.4449 26.2766L26.6034 29.1181C26.326 29.3956 25.8762 29.3956 25.5988 29.1181L24.178 27.6974C23.9006 27.42 23.9006 26.9702 24.178 26.6928C24.4555 26.4154 24.9052 26.4154 25.1827 26.6928L26.1011 27.6112L28.4403 25.272C28.7177 24.9946 29.1675 24.9946 29.4449 25.272Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M29.4449 32.376C29.7223 32.6534 29.7223 33.1032 29.4449 33.3807L26.6034 36.2222C26.326 36.4995 25.8762 36.4995 25.5988 36.2222L24.178 34.8015C23.9006 34.524 23.9006 34.0742 24.178 33.7967C24.4555 33.5194 24.9052 33.5194 25.1827 33.7967L26.1011 34.7152L28.4403 32.376C28.7177 32.0986 29.1675 32.0986 29.4449 32.376Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M31.0737 27.1952C31.0737 26.8029 31.3918 26.4849 31.7841 26.4849H36.0463C36.4386 26.4849 36.7567 26.8029 36.7567 27.1952C36.7567 27.5876 36.4386 27.9056 36.0463 27.9056H31.7841C31.3918 27.9056 31.0737 27.5876 31.0737 27.1952Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M24.6803 20.8018C22.7186 20.8018 21.1284 22.392 21.1284 24.3536V37.1403C21.1284 39.102 22.7186 40.6922 24.6803 40.6922H30.5049C30.2749 40.2421 30.0871 39.7667 29.947 39.2715H24.6803C23.5033 39.2715 22.5492 38.3173 22.5492 37.1403V24.3536C22.5492 23.1766 23.5033 22.2225 24.6803 22.2225H37.467C38.6439 22.2225 39.5981 23.1766 39.5981 24.3536V29.6204C40.0934 29.7605 40.5688 29.9482 41.0189 30.1783V24.3536C41.0189 22.392 39.4286 20.8018 37.467 20.8018H24.6803Z\"\r\n fill=\"#009BF3\" />\r\n <circle cx=\"37.436\" cy=\"37.1098\" r=\"6.42424\" fill=\"#009BF3\" />\r\n <path\r\n d=\"M38.2417 35.2004V40.2319H37.1779V36.2101H37.1485L35.9962 36.9324V35.989L37.2418 35.2004H38.2417Z\"\r\n fill=\"white\" />\r\n <rect x=\"4.82059\" y=\"4.49417\" width=\"54.359\" height=\"54.359\"\r\n rx=\"7.41259\" stroke=\"#EAF8FF\" stroke-width=\"0.988345\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_5752_36067\" x=\"0.326416\" y=\"0\"\r\n width=\"63.3474\" height=\"63.3472\" 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\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"dilate\" in=\"SourceAlpha\"\r\n result=\"effect1_dropShadow_5752_36067\" />\r\n <feOffset />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.83637 0 0 0 0 0.938377 0 0 0 0 0.996667 0 0 0 1 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_5752_36067\" />\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\"\r\n 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=\"effect1_dropShadow_5752_36067\"\r\n result=\"effect2_dropShadow_5752_36067\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\"\r\n in2=\"effect2_dropShadow_5752_36067\" result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div *ngIf=\"time?.incidents[0]?.type == 'positive'\"\r\n class=\"supporting-text\">On time opening/closing</div>\r\n <div *ngIf=\"time?.incidents[0]?.type == 'negative'\"\r\n class=\"supporting-text\">Store Open/Close Delayed?Early</div>\r\n </div> -->\r\n </ng-container>\r\n </div>\r\n </span>\r\n </div>\r\n <div class=\"flex-container d-flex justify-content-between\">\r\n <span *ngFor=\"let time of timeSeries;let i=index;\">\r\n <span class=\"hourText\" *ngIf=\"showHours(time)\">{{showHours(time)}}</span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"card mt-5\">\r\n <div class=\"card-header\">\r\n <div class=\"card-title\">\r\n <div class=\"card-body p-0 \">\r\n <div class=\"d-flex align-items-center\">\r\n <span class=\"title\">Camera Info</span>\r\n </div>\r\n <span class=\"fw-bold-400 subTitle\">An overview of the store issues and the downtime for {{selectedDate|customDateFormat }}</span>\r\n </div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [singleDatePicker]=\"true\" [drops]=\"'down'\"\r\n [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"row mt-7\">\r\n <div class=\"col-sm-6\">\r\n <div *ngIf=\"totalImageUrl?.length && !loading && !noData\">\r\n <div class=\"d-flex align-items-center\"><div *ngIf=\"selectedUrl?.cameraNumber || imageUrl[0]?.cameraNumber\" [ngClass]=\"((selectedUrl?.isActivated && selectedUrl?.isUp) || (imageUrl[0]?.isActivated && imageUrl[0]?.isUp))?'bg-danger':'bg-success'\" class=\"w-10px h-10px border-0 rounded-3 me-2\"></div>\r\n <span class=\"camera-title\">{{selectedUrl?.cameraNumber ? selectedUrl?.cameraNumber : imageUrl[0]?.cameraNumber}}</span> <span *ngIf=\"selectedUrl?.cameraName\" class=\"badge badge-light-primary text-primary ms-2\">\r\n {{selectedUrl?.cameraName ? selectedUrl?.cameraName : imageUrl[0]?.cameraName}}\r\n </span></div>\r\n <div class=\"rounded-2 w-100 mh-350px overflow-hidden mt-5\">\r\n <img *ngIf=\"selectedUrl?.thumbnailImage !== null && selectedUrl?.thumbnailImage !== '' || imageUrl[0]?.thumbnailImage !== ''\" class=\"w-100 mh-350px\" [src]=\"selectedUrl?.thumbnailImage ? selectedUrl?.thumbnailImage : imageUrl[0]?.thumbnailImage\">\r\n\r\n <div *ngIf=\"selectedUrl?.thumbnailImage === null || selectedUrl?.thumbnailImage === '' || imageUrl[0]?.thumbnailImage === ''\" class=\"w-100 h-300px rounded-2 overflow-hidden Nopreview align-content-center\">\r\n <div class=\"previewTitle text-center mb-5\">\r\n Preview not available\r\n </div>\r\n <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"row mt-3 position-relative\">\r\n <div *ngFor=\"let url of imageUrl; let i = index\" class=\"col-sm-4\" (click)=\"selectedImg(url)\">\r\n <img *ngIf=\"url?.thumbnailImage !== null || url?.thumbnailImage !== ''\" class=\"w-100 rounded-2 mh-100px\" [src]=\"url?.thumbnailImage\">\r\n <div *ngIf=\"url?.thumbnailImage === null || url?.thumbnailImage === ''\" class=\"w-100 rounded-2 h-100px Nopreview align-content-center\">\r\n <div class=\"previewTitle text-center fs-4 mb-2\">\r\n Preview not available\r\n </div>\r\n <!-- <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div> -->\r\n </div>\r\n </div>\r\n <div *ngIf=\"showPrev\" (click)=\"prevImages()\" class=\"w-35px h-35px bg-light-primary rounded-5 cursor-pointer d-flex align-items-center align-items-center position-absolute left-0 ms-5 mt-2 top-25\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M12.5 15.0264L7.5 10.0264L12.5 5.02637\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div>\r\n <div *ngIf=\"showNext && totalImageUrl.length > 3\" (click)=\"nextImages()\" class=\"w-35px h-35px bg-light-primary rounded-5 cursor-pointer d-flex align-items-center align-items-center position-absolute end-0 me-5 mt-2 top-25\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M7.5 15.0264L12.5 10.0264L7.5 5.02637\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"(noData || !totalImageUrl?.length) && (anglechangeData?.anglechange && this.anglechangeData?.resolution) || (noData || !totalImageUrl?.length) && (anglechangeData?.anglechange || this.anglechangeData?.resolution)\">\r\n <div 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-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"mt-10\">\r\n <div class=\"d-flex align-items-center\" *ngIf=\"anglechangeData?.anglechange\">\r\n <span class=\"camera-actual fw-bold\">Camera Angle</span>\r\n <div class=\"ms-3\">\r\n <span class=\"badge badge-light-danger text-danger\"> <input class=\"w-10px h-10px border-0 rounded-2 bg-danger me-2\">Changed</span>\r\n </div>\r\n </div>\r\n <div class=\"row mt-5\">\r\n <img class=\"w-100 mh-150px\" [src]=\"anglechangeData?.angleChangeImage\">\r\n <!-- <div class=\"col-sm-6\">\r\n <div class=\"w-100 rounded-3 overflow-hidden\">\r\n <img class=\"w-100 mh-150px\" src=\"https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"w-100 rounded-3 overflow-hidden\">\r\n <img class=\"w-100 mh-150px\" src=\"https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"row p-0\" *ngIf=\"anglechangeData?.anglechange\">\r\n <div class=\"col-md-6 m-0 pe-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6 m-0 ps-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"w-100 mt-10 table-responsive\" *ngIf=\"this.anglechangeData?.resolution\">\r\n <table class=\"w-100 table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>Instances</th>\r\n <th>Expected</th>\r\n <th>Actual</th>\r\n <th>Results</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td><span class=\"subTitle fw-semibold\"> Camera Resolution </span></td>\r\n <td>1080 x 900</td>\r\n <td>{{this.anglechangeData?.resolution}}</td>\r\n <td>\r\n <span class=\"badge badge-light-success text-success px-1\" *ngIf=\"resolutiontype\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_18201)\">\r\n <path d=\"M11 5.5663V6.0263C10.9994 7.10451 10.6503 8.15364 10.0047 9.01721C9.35908 9.88079 8.45164 10.5125 7.41768 10.8182C6.38372 11.124 5.27863 11.0872 4.26724 10.7136C3.25584 10.3399 2.39233 9.64935 1.80548 8.74483C1.21863 7.84032 0.939896 6.77033 1.01084 5.69446C1.08178 4.61858 1.4986 3.59446 2.19914 2.77484C2.89968 1.95521 3.84639 1.38399 4.89809 1.14637C5.9498 0.908754 7.05013 1.01747 8.035 1.4563M11 2.0263L6 7.0313L4.5 5.5313\" stroke=\"#12B76A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_18201\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"badge badge-light-danger text-danger px-1\" *ngIf=\"!resolutiontype\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_2326)\">\r\n <path d=\"M6 8.02637V6.02637M6 4.02637H6.005M11 6.02637C11 8.78779 8.76142 11.0264 6 11.0264C3.23858 11.0264 1 8.78779 1 6.02637C1 3.26494 3.23858 1.02637 6 1.02637C8.76142 1.02637 11 3.26494 11 6.02637Z\" stroke=\"#F04438\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_2326\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span></td>\r\n </tr>\r\n <!-- <tr>\r\n <td><span class=\"subTitle fw-semibold\">Downtime</span></td>\r\n <td>200mins</td>\r\n <td>140mins</td>\r\n <td><span class=\"badge badge-light-success text-success px-1\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_18201)\">\r\n <path d=\"M11 5.5663V6.0263C10.9994 7.10451 10.6503 8.15364 10.0047 9.01721C9.35908 9.88079 8.45164 10.5125 7.41768 10.8182C6.38372 11.124 5.27863 11.0872 4.26724 10.7136C3.25584 10.3399 2.39233 9.64935 1.80548 8.74483C1.21863 7.84032 0.939896 6.77033 1.01084 5.69446C1.08178 4.61858 1.4986 3.59446 2.19914 2.77484C2.89968 1.95521 3.84639 1.38399 4.89809 1.14637C5.9498 0.908754 7.05013 1.01747 8.035 1.4563M11 2.0263L6 7.0313L4.5 5.5313\" stroke=\"#12B76A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_18201\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span></td>\r\n </tr> -->\r\n </tbody>\r\n </table>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"noData && !totalImageUrl?.length && !anglechangeData?.anglechange && !this.anglechangeData?.resolution\">\r\n <div 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-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n\r\n </div>\r\n\r\n</div>\r\n\r\n<div class=\"mt-5\">\r\n <lib-edgeapp-log [storeId] = \"storeId\"></lib-edgeapp-log>\r\n</div>\r\n<div class=\"mt-5\">\r\n <lib-store-activity [storeId]=\"storeId\"></lib-store-activity>\r\n</div>", styles: [".fw-bold-400{font-weight:400}.subTitle{color:var(--Gray-500, #667085);font-size:14px;line-height:20px}.timeRange{color:var(--Black, #101828);font-size:16px;line-height:24px}tr td{padding-top:15px!important;padding-bottom:15px!important}.camera-title{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.camera-actual{color:var(--Gray-700, #344054);font-size:16px;font-weight:600;line-height:24px}.actualspan{color:var(--Black, #101828);font-size:12px;font-weight:400;line-height:18px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!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 .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}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.Nopreview{border:1px solid var(--Gray-500, #667085);background:var(--Gray-100, #F2F4F7);color:var(--Gray-500, #667085)}.Nopreview .previewTitle{font-size:20px;font-weight:700;line-height:20px}.Nopreview .previewsubTitle{text-align:center;font-size:12px;line-height:18px}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i6$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: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i8.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: "component", type: EdgeappLogComponent, selector: "lib-edgeapp-log", inputs: ["storeId"] }, { kind: "component", type: StoreActivityComponent, selector: "lib-store-activity", inputs: ["storeId"] }, { kind: "pipe", type: i3.CustomDateFormatPipe, name: "customDateFormat" }] });
|
|
2005
2036
|
}
|
|
2006
2037
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: StoreInfoComponent, decorators: [{
|
|
2007
2038
|
type: Component,
|
|
2008
|
-
args: [{ selector: 'lib-store-info', template: "<div class=\"card\">\r\n <div class=\"card-body\">\r\n <div class=\"\">\r\n <div class=\"d-flex align-items-center\">\r\n <span class=\"title\">Store Info</span>\r\n </div>\r\n <span class=\"fw-bold-400 subTitle\">An overview of the store issues and the downtime for {{selectedDate | customDateFormat }}</span>\r\n </div>\r\n <div class=\"my-5 timeRange fw-semibold\">Total : {{totalDownTime}} mins Downtime </div>\r\n <div class=\" mt-2 mx-2\" *ngIf=\"timeSeries?.length\">\r\n <div class=\"flex-container d-flex justify-content-between\">\r\n <span *ngFor=\"let time of timeSeries;let Index=index\" class=\"svg-container\">\r\n <!-- normal -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'normal'\"\r\n class=\"timeItem my-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"53\"\r\n viewBox=\"0 0 4 53\" fill=\"none\">\r\n <path d=\"M2.08032 2.5L2.08032 50.5\" stroke=\"#D0D5DD\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n\r\n <!-- Present hour for live -->\r\n <!-- <svg *ngIf=\"time.activeHr\" class=\"timeItem my-2\" xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"12\" height=\"53\" viewBox=\"0 0 4 53\" fill=\"none\">\r\n <path d=\"M2.08032 2.5L2.08032 50.5\" stroke=\"#00A3FF\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg> -->\r\n\r\n <!-- positive -->\r\n <!-- (mouseenter)=\"showDialogBox(time,Index)\" -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'positive'\"\r\n class=\"timeItem\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"68\" viewBox=\"0 0 5 68\"\r\n fill=\"none\">\r\n <path d=\"M2.40015 2.5L2.40014 66.5\" stroke=\"#039855\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n\r\n <!-- negative -->\r\n <!-- (mouseenter)=\"showDialogBox(time,Index)\" -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'negative'\"\r\n class=\"timeItem\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"68\" viewBox=\"0 0 5 68\"\r\n fill=\"none\">\r\n <path d=\"M2.48682 2L2.48682 66\" stroke=\"#D92D20\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n <div class=\"dialog-box\" [ngStyle]=\"getStyle()\" *ngIf=\"showIncidentPop && showIncidentPopIndex === Index\">\r\n <!-- (mouseleave)=\"hideDialogBox()\" -->\r\n <!-- -ve -->\r\n <ng-container *ngIf=\"showIncidentOptions.neg\">\r\n <svg width=\"65\" height=\"64\" viewBox=\"0 0 65 64\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_dd_5752_36075)\">\r\n <rect x=\"4.82642\" y=\"4.32617\" width=\"55.3473\" height=\"55.3473\"\r\n rx=\"7.90676\" fill=\"#FEF3F2\" />\r\n <path\r\n d=\"M29.9446 25.5987C30.2221 25.8761 30.2221 26.3259 29.9446 26.6033L27.1032 29.4448C26.8257 29.7222 26.376 29.7222 26.0985 29.4448L24.6778 28.0241C24.4004 27.7466 24.4004 27.2969 24.6778 27.0194C24.9552 26.742 25.405 26.742 25.6824 27.0194L26.6008 27.9379L28.94 25.5987C29.2175 25.3213 29.6672 25.3213 29.9446 25.5987Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M29.9446 32.7026C30.2221 32.9801 30.2221 33.4299 29.9446 33.7074L27.1032 36.5489C26.8257 36.8262 26.376 36.8262 26.0985 36.5489L24.6778 35.1281C24.4004 34.8507 24.4004 34.4008 24.6778 34.1234C24.9552 33.846 25.405 33.846 25.6824 34.1234L26.6008 35.0419L28.94 32.7026C29.2175 32.4253 29.6672 32.4253 29.9446 32.7026Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M31.5735 27.5219C31.5735 27.1296 31.8916 26.8115 32.2839 26.8115H36.5461C36.9384 26.8115 37.2565 27.1296 37.2565 27.5219C37.2565 27.9142 36.9384 28.2323 36.5461 28.2323H32.2839C31.8916 28.2323 31.5735 27.9142 31.5735 27.5219Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M25.18 21.1284C23.2184 21.1284 21.6282 22.7186 21.6282 24.6803V37.467C21.6282 39.4286 23.2184 41.0189 25.18 41.0189H31.0047C30.7746 40.5688 30.5869 40.0934 30.4468 39.5981H25.18C24.0031 39.5981 23.0489 38.6439 23.0489 37.467V24.6803C23.0489 23.5033 24.0031 22.5492 25.18 22.5492H37.9668C39.1437 22.5492 40.0979 23.5033 40.0979 24.6803V29.947C40.5931 30.0871 41.0685 30.2749 41.5186 30.5049V24.6803C41.5186 22.7186 39.9284 21.1284 37.9668 21.1284H25.18Z\"\r\n fill=\"#F04438\" />\r\n <circle cx=\"37.936\" cy=\"37.436\" r=\"6.42424\" fill=\"#F04438\" />\r\n <path\r\n d=\"M38.7415 35.5265V40.5581H37.6777V36.5363H37.6482L36.496 37.2586V36.3152L37.7416 35.5265H38.7415Z\"\r\n fill=\"white\" />\r\n <rect x=\"5.32059\" y=\"4.82034\" width=\"54.359\" height=\"54.359\"\r\n rx=\"7.41259\" stroke=\"#FEF3F2\" stroke-width=\"0.988345\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_5752_36075\" x=\"0.826416\" y=\"0.326172\"\r\n width=\"63.3474\" height=\"63.3472\" 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\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"dilate\" in=\"SourceAlpha\"\r\n result=\"effect1_dropShadow_5752_36075\" />\r\n <feOffset />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.997059 0 0 0 0 0.892745 0 0 0 0 0.885294 0 0 0 1 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_5752_36075\" />\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\"\r\n 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=\"effect1_dropShadow_5752_36075\"\r\n result=\"effect2_dropShadow_5752_36075\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\"\r\n in2=\"effect2_dropShadow_5752_36075\" result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div class=\"text-primary supporting-text\" style=\"cursor: pointer;\" (click)=\"scrollTo_mobdetectionsection(time?.incidents[0]?.category);\">Click to view details</div>\r\n </div> -->\r\n </ng-container>\r\n \r\n <!-- +ve -->\r\n <ng-container *ngIf=\"showIncidentOptions.pos\">\r\n <svg width=\"57\" height=\"57\" viewBox=\"0 0 57 57\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4.5\" y=\"4.83691\" width=\"48\" height=\"48\" rx=\"24\"\r\n fill=\"#D1FADF\" />\r\n <path\r\n d=\"M38.5 27.917V28.837C38.4988 30.9934 37.8005 33.0917 36.5093 34.8188C35.2182 36.546 33.4033 37.8095 31.3354 38.4209C29.2674 39.0323 27.0573 38.9589 25.0345 38.2116C23.0117 37.4643 21.2847 36.0831 20.111 34.2741C18.9373 32.4651 18.3798 30.3251 18.5217 28.1733C18.6636 26.0216 19.4972 23.9733 20.8983 22.3341C22.2994 20.6948 24.1928 19.5524 26.2962 19.0772C28.3996 18.6019 30.6003 18.8194 32.57 19.697M38.5 20.837L28.5 30.847L25.5 27.847\"\r\n stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <rect x=\"4.5\" y=\"4.83691\" width=\"48\" height=\"48\" rx=\"24\"\r\n stroke=\"#ECFDF3\" stroke-width=\"8\" />\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div class=\"supporting-text text-primary\" style=\"cursor: pointer;\"\r\n (click)=\"scrollTo_Submituser();\">Submitted by\r\n {{time?.incidents[0]?.userName}}</div>\r\n </div> -->\r\n </ng-container>\r\n \r\n <!-- store op -->\r\n <ng-container *ngIf=\"showIncidentOptions.storeop\">\r\n <svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_dd_5752_36067)\">\r\n <rect x=\"4.32642\" y=\"4\" width=\"55.3473\" height=\"55.3473\"\r\n rx=\"7.90676\" fill=\"#EAF8FF\" />\r\n <path\r\n d=\"M29.4449 25.272C29.7223 25.5495 29.7223 25.9992 29.4449 26.2766L26.6034 29.1181C26.326 29.3956 25.8762 29.3956 25.5988 29.1181L24.178 27.6974C23.9006 27.42 23.9006 26.9702 24.178 26.6928C24.4555 26.4154 24.9052 26.4154 25.1827 26.6928L26.1011 27.6112L28.4403 25.272C28.7177 24.9946 29.1675 24.9946 29.4449 25.272Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M29.4449 32.376C29.7223 32.6534 29.7223 33.1032 29.4449 33.3807L26.6034 36.2222C26.326 36.4995 25.8762 36.4995 25.5988 36.2222L24.178 34.8015C23.9006 34.524 23.9006 34.0742 24.178 33.7967C24.4555 33.5194 24.9052 33.5194 25.1827 33.7967L26.1011 34.7152L28.4403 32.376C28.7177 32.0986 29.1675 32.0986 29.4449 32.376Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M31.0737 27.1952C31.0737 26.8029 31.3918 26.4849 31.7841 26.4849H36.0463C36.4386 26.4849 36.7567 26.8029 36.7567 27.1952C36.7567 27.5876 36.4386 27.9056 36.0463 27.9056H31.7841C31.3918 27.9056 31.0737 27.5876 31.0737 27.1952Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M24.6803 20.8018C22.7186 20.8018 21.1284 22.392 21.1284 24.3536V37.1403C21.1284 39.102 22.7186 40.6922 24.6803 40.6922H30.5049C30.2749 40.2421 30.0871 39.7667 29.947 39.2715H24.6803C23.5033 39.2715 22.5492 38.3173 22.5492 37.1403V24.3536C22.5492 23.1766 23.5033 22.2225 24.6803 22.2225H37.467C38.6439 22.2225 39.5981 23.1766 39.5981 24.3536V29.6204C40.0934 29.7605 40.5688 29.9482 41.0189 30.1783V24.3536C41.0189 22.392 39.4286 20.8018 37.467 20.8018H24.6803Z\"\r\n fill=\"#009BF3\" />\r\n <circle cx=\"37.436\" cy=\"37.1098\" r=\"6.42424\" fill=\"#009BF3\" />\r\n <path\r\n d=\"M38.2417 35.2004V40.2319H37.1779V36.2101H37.1485L35.9962 36.9324V35.989L37.2418 35.2004H38.2417Z\"\r\n fill=\"white\" />\r\n <rect x=\"4.82059\" y=\"4.49417\" width=\"54.359\" height=\"54.359\"\r\n rx=\"7.41259\" stroke=\"#EAF8FF\" stroke-width=\"0.988345\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_5752_36067\" x=\"0.326416\" y=\"0\"\r\n width=\"63.3474\" height=\"63.3472\" 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\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"dilate\" in=\"SourceAlpha\"\r\n result=\"effect1_dropShadow_5752_36067\" />\r\n <feOffset />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.83637 0 0 0 0 0.938377 0 0 0 0 0.996667 0 0 0 1 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_5752_36067\" />\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\"\r\n 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=\"effect1_dropShadow_5752_36067\"\r\n result=\"effect2_dropShadow_5752_36067\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\"\r\n in2=\"effect2_dropShadow_5752_36067\" result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div *ngIf=\"time?.incidents[0]?.type == 'positive'\"\r\n class=\"supporting-text\">On time opening/closing</div>\r\n <div *ngIf=\"time?.incidents[0]?.type == 'negative'\"\r\n class=\"supporting-text\">Store Open/Close Delayed?Early</div>\r\n </div> -->\r\n </ng-container>\r\n </div>\r\n </span>\r\n </div>\r\n <div class=\"flex-container d-flex justify-content-between\">\r\n <span *ngFor=\"let time of timeSeries;let i=index;\">\r\n <span class=\"hourText\" *ngIf=\"showHours(time)\">{{showHours(time)}}</span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"card mt-5\">\r\n <div class=\"card-header\">\r\n <div class=\"card-title\">\r\n <div class=\"card-body p-0 \">\r\n <div class=\"d-flex align-items-center\">\r\n <span class=\"title\">Camera Info</span>\r\n </div>\r\n <span class=\"fw-bold-400 subTitle\">An overview of the store issues and the downtime for {{selectedDate|customDateFormat }}</span>\r\n </div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [singleDatePicker]=\"true\" [drops]=\"'down'\"\r\n [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"row mt-7\">\r\n <div class=\"col-sm-6\">\r\n <div *ngIf=\"totalImageUrl?.length && !loading && !noData\">\r\n <div class=\"d-flex align-items-center\"><div *ngIf=\"selectedUrl?.cameraNumber || imageUrl[0]?.cameraNumber\" [ngClass]=\"((selectedUrl?.isActivated && selectedUrl?.isUp) || (imageUrl[0]?.isActivated && imageUrl[0]?.isUp))?'bg-danger':'bg-success'\" class=\"w-10px h-10px border-0 rounded-3 me-2\"></div>\r\n <span class=\"camera-title\">{{selectedUrl?.cameraNumber ? selectedUrl?.cameraNumber : imageUrl[0]?.cameraNumber}}</span> <span *ngIf=\"selectedUrl?.cameraName\" class=\"badge badge-light-primary text-primary ms-2\">\r\n {{selectedUrl?.cameraName ? selectedUrl?.cameraName : imageUrl[0]?.cameraName}}\r\n </span></div>\r\n <div class=\"rounded-2 w-100 mh-350px overflow-hidden mt-5\">\r\n <img *ngIf=\"selectedUrl?.thumbnailImage !== null || selectedUrl?.thumbnailImage !== '' || imageUrl[0]?.thumbnailImage !== ''\" class=\"w-100 mh-350px\" [src]=\"selectedUrl?.thumbnailImage ? selectedUrl?.thumbnailImage : imageUrl[0]?.thumbnailImage\">\r\n\r\n <div *ngIf=\"selectedUrl?.thumbnailImage === null || selectedUrl?.thumbnailImage === '' || imageUrl[0]?.thumbnailImage === ''\" class=\"w-100 h-300px rounded-2 overflow-hidden Nopreview align-content-center\">\r\n <div class=\"previewTitle text-center mb-5\">\r\n Preview not available\r\n </div>\r\n <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"row mt-3 position-relative\">\r\n <div *ngFor=\"let url of imageUrl; let i = index\" class=\"col-sm-4\" (click)=\"selectedImg(url)\">\r\n <img *ngIf=\"url?.thumbnailImage !== null || url?.thumbnailImage !== ''\" class=\"w-100 rounded-2 mh-100px\" [src]=\"url?.thumbnailImage\">\r\n <div *ngIf=\"url?.thumbnailImage === null || url?.thumbnailImage === ''\" class=\"w-100 rounded-2 h-100px Nopreview align-content-center\">\r\n <div class=\"previewTitle text-center fs-4 mb-2\">\r\n Preview not available\r\n </div>\r\n <!-- <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div> -->\r\n </div>\r\n </div>\r\n <div *ngIf=\"showPrev\" (click)=\"prevImages()\" class=\"w-35px h-35px bg-light-primary rounded-5 cursor-pointer d-flex align-items-center align-items-center position-absolute left-0 ms-5 mt-2 top-25\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M12.5 15.0264L7.5 10.0264L12.5 5.02637\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div>\r\n <div *ngIf=\"showNext && totalImageUrl.length > 3\" (click)=\"nextImages()\" class=\"w-35px h-35px bg-light-primary rounded-5 cursor-pointer d-flex align-items-center align-items-center position-absolute end-0 me-5 mt-2 top-25\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M7.5 15.0264L12.5 10.0264L7.5 5.02637\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData || !totalImageUrl?.length\">\r\n <div 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-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"mt-10\">\r\n <div class=\"d-flex align-items-center\" *ngIf=\"anglechangeData?.anglechange\">\r\n <span class=\"camera-actual fw-bold\">Camera Angle</span>\r\n <div class=\"ms-3\">\r\n <span class=\"badge badge-light-danger text-danger\"> <input class=\"w-10px h-10px border-0 rounded-2 bg-danger me-2\">Changed</span>\r\n </div>\r\n </div>\r\n <div class=\"row mt-5\">\r\n <img class=\"w-100 mh-150px\" [src]=\"anglechangeData?.angleChangeImage\">\r\n <!-- <div class=\"col-sm-6\">\r\n <div class=\"w-100 rounded-3 overflow-hidden\">\r\n <img class=\"w-100 mh-150px\" src=\"https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"w-100 rounded-3 overflow-hidden\">\r\n <img class=\"w-100 mh-150px\" src=\"https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"row p-0\" *ngIf=\"anglechangeData?.anglechange\">\r\n <div class=\"col-md-6 m-0 pe-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6 m-0 ps-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"w-100 mt-10 table-responsive\" *ngIf=\"this.anglechangeData?.resolution\">\r\n <table class=\"w-100 table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>Instances</th>\r\n <th>Expected</th>\r\n <th>Actual</th>\r\n <th>Results</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td><span class=\"subTitle fw-semibold\"> Camera Resolution </span></td>\r\n <td>1080 x 900</td>\r\n <td>{{this.anglechangeData?.resolution}}</td>\r\n <td>\r\n <span class=\"badge badge-light-success text-success px-1\" *ngIf=\"resolutiontype\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_18201)\">\r\n <path d=\"M11 5.5663V6.0263C10.9994 7.10451 10.6503 8.15364 10.0047 9.01721C9.35908 9.88079 8.45164 10.5125 7.41768 10.8182C6.38372 11.124 5.27863 11.0872 4.26724 10.7136C3.25584 10.3399 2.39233 9.64935 1.80548 8.74483C1.21863 7.84032 0.939896 6.77033 1.01084 5.69446C1.08178 4.61858 1.4986 3.59446 2.19914 2.77484C2.89968 1.95521 3.84639 1.38399 4.89809 1.14637C5.9498 0.908754 7.05013 1.01747 8.035 1.4563M11 2.0263L6 7.0313L4.5 5.5313\" stroke=\"#12B76A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_18201\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"badge badge-light-danger text-danger px-1\" *ngIf=\"!resolutiontype\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_2326)\">\r\n <path d=\"M6 8.02637V6.02637M6 4.02637H6.005M11 6.02637C11 8.78779 8.76142 11.0264 6 11.0264C3.23858 11.0264 1 8.78779 1 6.02637C1 3.26494 3.23858 1.02637 6 1.02637C8.76142 1.02637 11 3.26494 11 6.02637Z\" stroke=\"#F04438\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_2326\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span></td>\r\n </tr>\r\n <!-- <tr>\r\n <td><span class=\"subTitle fw-semibold\">Downtime</span></td>\r\n <td>200mins</td>\r\n <td>140mins</td>\r\n <td><span class=\"badge badge-light-success text-success px-1\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_18201)\">\r\n <path d=\"M11 5.5663V6.0263C10.9994 7.10451 10.6503 8.15364 10.0047 9.01721C9.35908 9.88079 8.45164 10.5125 7.41768 10.8182C6.38372 11.124 5.27863 11.0872 4.26724 10.7136C3.25584 10.3399 2.39233 9.64935 1.80548 8.74483C1.21863 7.84032 0.939896 6.77033 1.01084 5.69446C1.08178 4.61858 1.4986 3.59446 2.19914 2.77484C2.89968 1.95521 3.84639 1.38399 4.89809 1.14637C5.9498 0.908754 7.05013 1.01747 8.035 1.4563M11 2.0263L6 7.0313L4.5 5.5313\" stroke=\"#12B76A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_18201\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span></td>\r\n </tr> -->\r\n </tbody>\r\n </table>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n</div>\r\n\r\n<div class=\"mt-5\">\r\n <lib-edgeapp-log [storeId] = \"storeId\"></lib-edgeapp-log>\r\n</div>\r\n<div class=\"mt-5\">\r\n <lib-store-activity [storeId]=\"storeId\"></lib-store-activity>\r\n</div>", styles: [".fw-bold-400{font-weight:400}.subTitle{color:var(--Gray-500, #667085);font-size:14px;line-height:20px}.timeRange{color:var(--Black, #101828);font-size:16px;line-height:24px}tr td{padding-top:15px!important;padding-bottom:15px!important}.camera-title{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.camera-actual{color:var(--Gray-700, #344054);font-size:16px;font-weight:600;line-height:24px}.actualspan{color:var(--Black, #101828);font-size:12px;font-weight:400;line-height:18px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!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 .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}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.Nopreview{border:1px solid var(--Gray-500, #667085);background:var(--Gray-100, #F2F4F7);color:var(--Gray-500, #667085)}.Nopreview .previewTitle{font-size:20px;font-weight:700;line-height:20px}.Nopreview .previewsubTitle{text-align:center;font-size:12px;line-height:18px}\n"] }]
|
|
2039
|
+
args: [{ selector: 'lib-store-info', template: "<div class=\"card\">\r\n <div class=\"card-body\">\r\n <div class=\"\">\r\n <div class=\"d-flex align-items-center\">\r\n <span class=\"title\">Store Info</span>\r\n </div>\r\n <span class=\"fw-bold-400 subTitle\">An overview of the store issues and the downtime for {{selectedDate | customDateFormat }}</span>\r\n </div>\r\n <div class=\"my-5 timeRange fw-semibold\">Total : {{totalDownTime}} mins Downtime </div>\r\n <div class=\" mt-2 mx-2\" *ngIf=\"timeSeries?.length\">\r\n <div class=\"flex-container d-flex justify-content-between\">\r\n <span *ngFor=\"let time of timeSeries;let Index=index\" class=\"svg-container\">\r\n <!-- normal -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'normal'\"\r\n class=\"timeItem my-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"53\"\r\n viewBox=\"0 0 4 53\" fill=\"none\">\r\n <path d=\"M2.08032 2.5L2.08032 50.5\" stroke=\"#D0D5DD\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n\r\n <!-- Present hour for live -->\r\n <!-- <svg *ngIf=\"time.activeHr\" class=\"timeItem my-2\" xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"12\" height=\"53\" viewBox=\"0 0 4 53\" fill=\"none\">\r\n <path d=\"M2.08032 2.5L2.08032 50.5\" stroke=\"#00A3FF\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg> -->\r\n\r\n <!-- positive -->\r\n <!-- (mouseenter)=\"showDialogBox(time,Index)\" -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'positive'\"\r\n class=\"timeItem\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"68\" viewBox=\"0 0 5 68\"\r\n fill=\"none\">\r\n <path d=\"M2.40015 2.5L2.40014 66.5\" stroke=\"#039855\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n\r\n <!-- negative -->\r\n <!-- (mouseenter)=\"showDialogBox(time,Index)\" -->\r\n <svg *ngIf=\"showIncidentType(time?.time24Hour,Index) === 'negative'\"\r\n class=\"timeItem\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"68\" viewBox=\"0 0 5 68\"\r\n fill=\"none\">\r\n <path d=\"M2.48682 2L2.48682 66\" stroke=\"#D92D20\" stroke-width=\"4.5\"\r\n stroke-linecap=\"round\" />\r\n </svg>\r\n <div class=\"dialog-box\" [ngStyle]=\"getStyle()\" *ngIf=\"showIncidentPop && showIncidentPopIndex === Index\">\r\n <!-- (mouseleave)=\"hideDialogBox()\" -->\r\n <!-- -ve -->\r\n <ng-container *ngIf=\"showIncidentOptions.neg\">\r\n <svg width=\"65\" height=\"64\" viewBox=\"0 0 65 64\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_dd_5752_36075)\">\r\n <rect x=\"4.82642\" y=\"4.32617\" width=\"55.3473\" height=\"55.3473\"\r\n rx=\"7.90676\" fill=\"#FEF3F2\" />\r\n <path\r\n d=\"M29.9446 25.5987C30.2221 25.8761 30.2221 26.3259 29.9446 26.6033L27.1032 29.4448C26.8257 29.7222 26.376 29.7222 26.0985 29.4448L24.6778 28.0241C24.4004 27.7466 24.4004 27.2969 24.6778 27.0194C24.9552 26.742 25.405 26.742 25.6824 27.0194L26.6008 27.9379L28.94 25.5987C29.2175 25.3213 29.6672 25.3213 29.9446 25.5987Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M29.9446 32.7026C30.2221 32.9801 30.2221 33.4299 29.9446 33.7074L27.1032 36.5489C26.8257 36.8262 26.376 36.8262 26.0985 36.5489L24.6778 35.1281C24.4004 34.8507 24.4004 34.4008 24.6778 34.1234C24.9552 33.846 25.405 33.846 25.6824 34.1234L26.6008 35.0419L28.94 32.7026C29.2175 32.4253 29.6672 32.4253 29.9446 32.7026Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M31.5735 27.5219C31.5735 27.1296 31.8916 26.8115 32.2839 26.8115H36.5461C36.9384 26.8115 37.2565 27.1296 37.2565 27.5219C37.2565 27.9142 36.9384 28.2323 36.5461 28.2323H32.2839C31.8916 28.2323 31.5735 27.9142 31.5735 27.5219Z\"\r\n fill=\"#F04438\" />\r\n <path\r\n d=\"M25.18 21.1284C23.2184 21.1284 21.6282 22.7186 21.6282 24.6803V37.467C21.6282 39.4286 23.2184 41.0189 25.18 41.0189H31.0047C30.7746 40.5688 30.5869 40.0934 30.4468 39.5981H25.18C24.0031 39.5981 23.0489 38.6439 23.0489 37.467V24.6803C23.0489 23.5033 24.0031 22.5492 25.18 22.5492H37.9668C39.1437 22.5492 40.0979 23.5033 40.0979 24.6803V29.947C40.5931 30.0871 41.0685 30.2749 41.5186 30.5049V24.6803C41.5186 22.7186 39.9284 21.1284 37.9668 21.1284H25.18Z\"\r\n fill=\"#F04438\" />\r\n <circle cx=\"37.936\" cy=\"37.436\" r=\"6.42424\" fill=\"#F04438\" />\r\n <path\r\n d=\"M38.7415 35.5265V40.5581H37.6777V36.5363H37.6482L36.496 37.2586V36.3152L37.7416 35.5265H38.7415Z\"\r\n fill=\"white\" />\r\n <rect x=\"5.32059\" y=\"4.82034\" width=\"54.359\" height=\"54.359\"\r\n rx=\"7.41259\" stroke=\"#FEF3F2\" stroke-width=\"0.988345\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_5752_36075\" x=\"0.826416\" y=\"0.326172\"\r\n width=\"63.3474\" height=\"63.3472\" 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\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"dilate\" in=\"SourceAlpha\"\r\n result=\"effect1_dropShadow_5752_36075\" />\r\n <feOffset />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.997059 0 0 0 0 0.892745 0 0 0 0 0.885294 0 0 0 1 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_5752_36075\" />\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\"\r\n 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=\"effect1_dropShadow_5752_36075\"\r\n result=\"effect2_dropShadow_5752_36075\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\"\r\n in2=\"effect2_dropShadow_5752_36075\" result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div class=\"text-primary supporting-text\" style=\"cursor: pointer;\" (click)=\"scrollTo_mobdetectionsection(time?.incidents[0]?.category);\">Click to view details</div>\r\n </div> -->\r\n </ng-container>\r\n \r\n <!-- +ve -->\r\n <ng-container *ngIf=\"showIncidentOptions.pos\">\r\n <svg width=\"57\" height=\"57\" viewBox=\"0 0 57 57\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4.5\" y=\"4.83691\" width=\"48\" height=\"48\" rx=\"24\"\r\n fill=\"#D1FADF\" />\r\n <path\r\n d=\"M38.5 27.917V28.837C38.4988 30.9934 37.8005 33.0917 36.5093 34.8188C35.2182 36.546 33.4033 37.8095 31.3354 38.4209C29.2674 39.0323 27.0573 38.9589 25.0345 38.2116C23.0117 37.4643 21.2847 36.0831 20.111 34.2741C18.9373 32.4651 18.3798 30.3251 18.5217 28.1733C18.6636 26.0216 19.4972 23.9733 20.8983 22.3341C22.2994 20.6948 24.1928 19.5524 26.2962 19.0772C28.3996 18.6019 30.6003 18.8194 32.57 19.697M38.5 20.837L28.5 30.847L25.5 27.847\"\r\n stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <rect x=\"4.5\" y=\"4.83691\" width=\"48\" height=\"48\" rx=\"24\"\r\n stroke=\"#ECFDF3\" stroke-width=\"8\" />\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div class=\"supporting-text text-primary\" style=\"cursor: pointer;\"\r\n (click)=\"scrollTo_Submituser();\">Submitted by\r\n {{time?.incidents[0]?.userName}}</div>\r\n </div> -->\r\n </ng-container>\r\n \r\n <!-- store op -->\r\n <ng-container *ngIf=\"showIncidentOptions.storeop\">\r\n <svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_dd_5752_36067)\">\r\n <rect x=\"4.32642\" y=\"4\" width=\"55.3473\" height=\"55.3473\"\r\n rx=\"7.90676\" fill=\"#EAF8FF\" />\r\n <path\r\n d=\"M29.4449 25.272C29.7223 25.5495 29.7223 25.9992 29.4449 26.2766L26.6034 29.1181C26.326 29.3956 25.8762 29.3956 25.5988 29.1181L24.178 27.6974C23.9006 27.42 23.9006 26.9702 24.178 26.6928C24.4555 26.4154 24.9052 26.4154 25.1827 26.6928L26.1011 27.6112L28.4403 25.272C28.7177 24.9946 29.1675 24.9946 29.4449 25.272Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M29.4449 32.376C29.7223 32.6534 29.7223 33.1032 29.4449 33.3807L26.6034 36.2222C26.326 36.4995 25.8762 36.4995 25.5988 36.2222L24.178 34.8015C23.9006 34.524 23.9006 34.0742 24.178 33.7967C24.4555 33.5194 24.9052 33.5194 25.1827 33.7967L26.1011 34.7152L28.4403 32.376C28.7177 32.0986 29.1675 32.0986 29.4449 32.376Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M31.0737 27.1952C31.0737 26.8029 31.3918 26.4849 31.7841 26.4849H36.0463C36.4386 26.4849 36.7567 26.8029 36.7567 27.1952C36.7567 27.5876 36.4386 27.9056 36.0463 27.9056H31.7841C31.3918 27.9056 31.0737 27.5876 31.0737 27.1952Z\"\r\n fill=\"#009BF3\" />\r\n <path\r\n d=\"M24.6803 20.8018C22.7186 20.8018 21.1284 22.392 21.1284 24.3536V37.1403C21.1284 39.102 22.7186 40.6922 24.6803 40.6922H30.5049C30.2749 40.2421 30.0871 39.7667 29.947 39.2715H24.6803C23.5033 39.2715 22.5492 38.3173 22.5492 37.1403V24.3536C22.5492 23.1766 23.5033 22.2225 24.6803 22.2225H37.467C38.6439 22.2225 39.5981 23.1766 39.5981 24.3536V29.6204C40.0934 29.7605 40.5688 29.9482 41.0189 30.1783V24.3536C41.0189 22.392 39.4286 20.8018 37.467 20.8018H24.6803Z\"\r\n fill=\"#009BF3\" />\r\n <circle cx=\"37.436\" cy=\"37.1098\" r=\"6.42424\" fill=\"#009BF3\" />\r\n <path\r\n d=\"M38.2417 35.2004V40.2319H37.1779V36.2101H37.1485L35.9962 36.9324V35.989L37.2418 35.2004H38.2417Z\"\r\n fill=\"white\" />\r\n <rect x=\"4.82059\" y=\"4.49417\" width=\"54.359\" height=\"54.359\"\r\n rx=\"7.41259\" stroke=\"#EAF8FF\" stroke-width=\"0.988345\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_5752_36067\" x=\"0.326416\" y=\"0\"\r\n width=\"63.3474\" height=\"63.3472\" 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\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"dilate\" in=\"SourceAlpha\"\r\n result=\"effect1_dropShadow_5752_36067\" />\r\n <feOffset />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.83637 0 0 0 0 0.938377 0 0 0 0 0.996667 0 0 0 1 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\"\r\n result=\"effect1_dropShadow_5752_36067\" />\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\"\r\n 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=\"effect1_dropShadow_5752_36067\"\r\n result=\"effect2_dropShadow_5752_36067\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\"\r\n in2=\"effect2_dropShadow_5752_36067\" result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg>\r\n <!-- <div class=\"d-flex justify-content-center flex-column\">\r\n <div class=\"fw-bold\">{{displayCategory(time?.incidents[0]?.category,time?.incidents[0]?.type)}} :\r\n {{time?.time12Hour}}</div>\r\n <div *ngIf=\"time?.incidents[0]?.type == 'positive'\"\r\n class=\"supporting-text\">On time opening/closing</div>\r\n <div *ngIf=\"time?.incidents[0]?.type == 'negative'\"\r\n class=\"supporting-text\">Store Open/Close Delayed?Early</div>\r\n </div> -->\r\n </ng-container>\r\n </div>\r\n </span>\r\n </div>\r\n <div class=\"flex-container d-flex justify-content-between\">\r\n <span *ngFor=\"let time of timeSeries;let i=index;\">\r\n <span class=\"hourText\" *ngIf=\"showHours(time)\">{{showHours(time)}}</span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"card mt-5\">\r\n <div class=\"card-header\">\r\n <div class=\"card-title\">\r\n <div class=\"card-body p-0 \">\r\n <div class=\"d-flex align-items-center\">\r\n <span class=\"title\">Camera Info</span>\r\n </div>\r\n <span class=\"fw-bold-400 subTitle\">An overview of the store issues and the downtime for {{selectedDate|customDateFormat }}</span>\r\n </div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex align-items-center position-relative my-1 ms-3\">\r\n <span 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\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [singleDatePicker]=\"true\" [drops]=\"'down'\"\r\n [opens]=\"'right'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"row mt-7\">\r\n <div class=\"col-sm-6\">\r\n <div *ngIf=\"totalImageUrl?.length && !loading && !noData\">\r\n <div class=\"d-flex align-items-center\"><div *ngIf=\"selectedUrl?.cameraNumber || imageUrl[0]?.cameraNumber\" [ngClass]=\"((selectedUrl?.isActivated && selectedUrl?.isUp) || (imageUrl[0]?.isActivated && imageUrl[0]?.isUp))?'bg-danger':'bg-success'\" class=\"w-10px h-10px border-0 rounded-3 me-2\"></div>\r\n <span class=\"camera-title\">{{selectedUrl?.cameraNumber ? selectedUrl?.cameraNumber : imageUrl[0]?.cameraNumber}}</span> <span *ngIf=\"selectedUrl?.cameraName\" class=\"badge badge-light-primary text-primary ms-2\">\r\n {{selectedUrl?.cameraName ? selectedUrl?.cameraName : imageUrl[0]?.cameraName}}\r\n </span></div>\r\n <div class=\"rounded-2 w-100 mh-350px overflow-hidden mt-5\">\r\n <img *ngIf=\"selectedUrl?.thumbnailImage !== null && selectedUrl?.thumbnailImage !== '' || imageUrl[0]?.thumbnailImage !== ''\" class=\"w-100 mh-350px\" [src]=\"selectedUrl?.thumbnailImage ? selectedUrl?.thumbnailImage : imageUrl[0]?.thumbnailImage\">\r\n\r\n <div *ngIf=\"selectedUrl?.thumbnailImage === null || selectedUrl?.thumbnailImage === '' || imageUrl[0]?.thumbnailImage === ''\" class=\"w-100 h-300px rounded-2 overflow-hidden Nopreview align-content-center\">\r\n <div class=\"previewTitle text-center mb-5\">\r\n Preview not available\r\n </div>\r\n <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"row mt-3 position-relative\">\r\n <div *ngFor=\"let url of imageUrl; let i = index\" class=\"col-sm-4\" (click)=\"selectedImg(url)\">\r\n <img *ngIf=\"url?.thumbnailImage !== null || url?.thumbnailImage !== ''\" class=\"w-100 rounded-2 mh-100px\" [src]=\"url?.thumbnailImage\">\r\n <div *ngIf=\"url?.thumbnailImage === null || url?.thumbnailImage === ''\" class=\"w-100 rounded-2 h-100px Nopreview align-content-center\">\r\n <div class=\"previewTitle text-center fs-4 mb-2\">\r\n Preview not available\r\n </div>\r\n <!-- <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div> -->\r\n </div>\r\n </div>\r\n <div *ngIf=\"showPrev\" (click)=\"prevImages()\" class=\"w-35px h-35px bg-light-primary rounded-5 cursor-pointer d-flex align-items-center align-items-center position-absolute left-0 ms-5 mt-2 top-25\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M12.5 15.0264L7.5 10.0264L12.5 5.02637\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div>\r\n <div *ngIf=\"showNext && totalImageUrl.length > 3\" (click)=\"nextImages()\" class=\"w-35px h-35px bg-light-primary rounded-5 cursor-pointer d-flex align-items-center align-items-center position-absolute end-0 me-5 mt-2 top-25\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"21\" viewBox=\"0 0 20 21\" fill=\"none\">\r\n <path d=\"M7.5 15.0264L12.5 10.0264L7.5 5.02637\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"loading\" >\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"(noData || !totalImageUrl?.length) && (anglechangeData?.anglechange && this.anglechangeData?.resolution) || (noData || !totalImageUrl?.length) && (anglechangeData?.anglechange || this.anglechangeData?.resolution)\">\r\n <div 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-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"mt-10\">\r\n <div class=\"d-flex align-items-center\" *ngIf=\"anglechangeData?.anglechange\">\r\n <span class=\"camera-actual fw-bold\">Camera Angle</span>\r\n <div class=\"ms-3\">\r\n <span class=\"badge badge-light-danger text-danger\"> <input class=\"w-10px h-10px border-0 rounded-2 bg-danger me-2\">Changed</span>\r\n </div>\r\n </div>\r\n <div class=\"row mt-5\">\r\n <img class=\"w-100 mh-150px\" [src]=\"anglechangeData?.angleChangeImage\">\r\n <!-- <div class=\"col-sm-6\">\r\n <div class=\"w-100 rounded-3 overflow-hidden\">\r\n <img class=\"w-100 mh-150px\" src=\"https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-6\">\r\n <div class=\"w-100 rounded-3 overflow-hidden\">\r\n <img class=\"w-100 mh-150px\" src=\"https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=500&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8c3RvcmV8ZW58MHx8MHx8fDA%3D\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"row p-0\" *ngIf=\"anglechangeData?.anglechange\">\r\n <div class=\"col-md-6 m-0 pe-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6 m-0 ps-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"w-100 mt-10 table-responsive\" *ngIf=\"this.anglechangeData?.resolution\">\r\n <table class=\"w-100 table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>Instances</th>\r\n <th>Expected</th>\r\n <th>Actual</th>\r\n <th>Results</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td><span class=\"subTitle fw-semibold\"> Camera Resolution </span></td>\r\n <td>1080 x 900</td>\r\n <td>{{this.anglechangeData?.resolution}}</td>\r\n <td>\r\n <span class=\"badge badge-light-success text-success px-1\" *ngIf=\"resolutiontype\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_18201)\">\r\n <path d=\"M11 5.5663V6.0263C10.9994 7.10451 10.6503 8.15364 10.0047 9.01721C9.35908 9.88079 8.45164 10.5125 7.41768 10.8182C6.38372 11.124 5.27863 11.0872 4.26724 10.7136C3.25584 10.3399 2.39233 9.64935 1.80548 8.74483C1.21863 7.84032 0.939896 6.77033 1.01084 5.69446C1.08178 4.61858 1.4986 3.59446 2.19914 2.77484C2.89968 1.95521 3.84639 1.38399 4.89809 1.14637C5.9498 0.908754 7.05013 1.01747 8.035 1.4563M11 2.0263L6 7.0313L4.5 5.5313\" stroke=\"#12B76A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_18201\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"badge badge-light-danger text-danger px-1\" *ngIf=\"!resolutiontype\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_2326)\">\r\n <path d=\"M6 8.02637V6.02637M6 4.02637H6.005M11 6.02637C11 8.78779 8.76142 11.0264 6 11.0264C3.23858 11.0264 1 8.78779 1 6.02637C1 3.26494 3.23858 1.02637 6 1.02637C8.76142 1.02637 11 3.26494 11 6.02637Z\" stroke=\"#F04438\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_2326\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span></td>\r\n </tr>\r\n <!-- <tr>\r\n <td><span class=\"subTitle fw-semibold\">Downtime</span></td>\r\n <td>200mins</td>\r\n <td>140mins</td>\r\n <td><span class=\"badge badge-light-success text-success px-1\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"13\" viewBox=\"0 0 12 13\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_4623_18201)\">\r\n <path d=\"M11 5.5663V6.0263C10.9994 7.10451 10.6503 8.15364 10.0047 9.01721C9.35908 9.88079 8.45164 10.5125 7.41768 10.8182C6.38372 11.124 5.27863 11.0872 4.26724 10.7136C3.25584 10.3399 2.39233 9.64935 1.80548 8.74483C1.21863 7.84032 0.939896 6.77033 1.01084 5.69446C1.08178 4.61858 1.4986 3.59446 2.19914 2.77484C2.89968 1.95521 3.84639 1.38399 4.89809 1.14637C5.9498 0.908754 7.05013 1.01747 8.035 1.4563M11 2.0263L6 7.0313L4.5 5.5313\" stroke=\"#12B76A\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4623_18201\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(0 0.0263672)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span></td>\r\n </tr> -->\r\n </tbody>\r\n </table>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"noData && !totalImageUrl?.length && !anglechangeData?.anglechange && !this.anglechangeData?.resolution\">\r\n <div 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-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n\r\n </div>\r\n\r\n</div>\r\n\r\n<div class=\"mt-5\">\r\n <lib-edgeapp-log [storeId] = \"storeId\"></lib-edgeapp-log>\r\n</div>\r\n<div class=\"mt-5\">\r\n <lib-store-activity [storeId]=\"storeId\"></lib-store-activity>\r\n</div>", styles: [".fw-bold-400{font-weight:400}.subTitle{color:var(--Gray-500, #667085);font-size:14px;line-height:20px}.timeRange{color:var(--Black, #101828);font-size:16px;line-height:24px}tr td{padding-top:15px!important;padding-bottom:15px!important}.camera-title{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.camera-actual{color:var(--Gray-700, #344054);font-size:16px;font-weight:600;line-height:24px}.actualspan{color:var(--Black, #101828);font-size:12px;font-weight:400;line-height:18px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!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 .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}.loader .title{width:65%}.loader .link{width:85%}.loader .description{width:95%}.loader .shimmer{padding:15px;width:95%;height:120px;margin:10px auto;background:#fff}.loader .shimmer .image-card{height:90px;width:90px;float:right;border-radius:8px}.loader .stroke{height:15px;background:#777;margin-top:20px}.loader .wrapper{width:0px;animation:fullView .5s forwards linear}@keyframes fullView{to{width:100%}}.loader .animate{animation:shimmer 3s;animation-iteration-count:infinite;background:linear-gradient(to right,#e6e6e6 5%,#ccc 25%,#e6e6e6 35%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.Nopreview{border:1px solid var(--Gray-500, #667085);background:var(--Gray-100, #F2F4F7);color:var(--Gray-500, #667085)}.Nopreview .previewTitle{font-size:20px;font-weight:700;line-height:20px}.Nopreview .previewsubTitle{text-align:center;font-size:12px;line-height:18px}\n"] }]
|
|
2009
2040
|
}], ctorParameters: () => [{ type: TicketsService }, { type: i0.ChangeDetectorRef }], propDecorators: { storeId: [{
|
|
2010
2041
|
type: Input
|
|
2011
2042
|
}] } });
|
|
@@ -2269,19 +2300,21 @@ class TicketsComponent {
|
|
|
2269
2300
|
});
|
|
2270
2301
|
}
|
|
2271
2302
|
secondaryReason(value) {
|
|
2272
|
-
|
|
2273
|
-
|
|
2274
|
-
|
|
2275
|
-
|
|
2276
|
-
|
|
2277
|
-
|
|
2278
|
-
|
|
2279
|
-
|
|
2280
|
-
|
|
2281
|
-
|
|
2282
|
-
|
|
2283
|
-
|
|
2284
|
-
|
|
2303
|
+
if (value) {
|
|
2304
|
+
let params = { "primaryIssue": value };
|
|
2305
|
+
this.service.secondaryReason(params).pipe(takeUntil(this.destroy$)).subscribe({
|
|
2306
|
+
next: (res) => {
|
|
2307
|
+
if (res && res.code == 200) {
|
|
2308
|
+
this.secondaryIssues = res.data.result;
|
|
2309
|
+
}
|
|
2310
|
+
this.cd.detectChanges();
|
|
2311
|
+
},
|
|
2312
|
+
error(err) {
|
|
2313
|
+
},
|
|
2314
|
+
complete: () => {
|
|
2315
|
+
},
|
|
2316
|
+
});
|
|
2317
|
+
}
|
|
2285
2318
|
}
|
|
2286
2319
|
updateTicket() {
|
|
2287
2320
|
let data = [];
|
|
@@ -2301,10 +2334,10 @@ class TicketsComponent {
|
|
|
2301
2334
|
data = this.secondaryIssues.filter((item) => item.checked).map((item) => item.name);
|
|
2302
2335
|
}
|
|
2303
2336
|
}
|
|
2304
|
-
if (this.ticketInfo?.ticketDetails.issueStatus === 'notidentified' && data.length == 0 || this.ticketInfo?.ticketDetails?.refreshTicketStatus === 'notidentified' && data.length == 0) {
|
|
2337
|
+
if (this.ticketInfo?.ticketDetails.issueStatus === 'notidentified' && data.length == 0 || this.ticketInfo?.ticketDetails.ticketType == 'refreshticket' && this.ticketInfo?.ticketDetails?.refreshTicketStatus === 'notidentified' && data.length == 0) {
|
|
2305
2338
|
return this.toastService.getErrorToast("Please Select Issues");
|
|
2306
2339
|
}
|
|
2307
|
-
else if (this.ticketInfo?.ticketDetails.issueStatus === 'identified' && this.comments == '' || this.ticketInfo?.ticketDetails?.refreshTicketStatus === 'identified' && this.comments == 0) {
|
|
2340
|
+
else if (this.ticketInfo?.ticketDetails.issueStatus === 'identified' && this.comments == '' || this.ticketInfo?.ticketDetails.ticketType == 'refreshticket' && this.ticketInfo?.ticketDetails?.refreshTicketStatus === 'identified' && this.comments == 0) {
|
|
2308
2341
|
return this.toastService.getErrorToast("Please Enter Comments");
|
|
2309
2342
|
}
|
|
2310
2343
|
let ticketDetails = {
|
|
@@ -2318,6 +2351,8 @@ class TicketsComponent {
|
|
|
2318
2351
|
next: (res) => {
|
|
2319
2352
|
if (res && res.code == 200) {
|
|
2320
2353
|
this.comments = '';
|
|
2354
|
+
this.selectedIssue = '';
|
|
2355
|
+
this.secondaryIssues = [];
|
|
2321
2356
|
// this.state.issueStatus = this.selectedIssue;
|
|
2322
2357
|
this.toastService.getSuccessToast(res.message);
|
|
2323
2358
|
this.viewTicket(false);
|
|
@@ -2752,7 +2787,7 @@ class InstallationComponent {
|
|
|
2752
2787
|
this.showform = false;
|
|
2753
2788
|
this.prerequestFailed = false;
|
|
2754
2789
|
let data;
|
|
2755
|
-
if (this.secondaryIssues && this.secondaryIssues
|
|
2790
|
+
if (this.secondaryIssues && this.secondaryIssues?.length > 0) {
|
|
2756
2791
|
if (this.selectedIssue == 'Others') {
|
|
2757
2792
|
if (this.selectedOption === 'Application Issues') {
|
|
2758
2793
|
this.selectedIssue = 'Application Issues';
|
|
@@ -2768,10 +2803,10 @@ class InstallationComponent {
|
|
|
2768
2803
|
data = this.secondaryIssues.filter((item) => item.checked).map((item) => item.name);
|
|
2769
2804
|
}
|
|
2770
2805
|
}
|
|
2771
|
-
if (this.ticketInfo?.ticketDetails.issueStatus === 'notidentified' && data.length == 0 || this.ticketInfo?.ticketDetails?.refreshTicketStatus === 'notidentified' && data.length == 0) {
|
|
2806
|
+
if (this.ticketInfo?.ticketDetails.issueStatus === 'notidentified' && data && data.length == 0 || this.ticketInfo?.ticketDetails.ticketType == 'refreshticket' && this.ticketInfo?.ticketDetails?.refreshTicketStatus === 'notidentified' && data && data.length == 0) {
|
|
2772
2807
|
return this.toastService.getErrorToast("Please Select Issues");
|
|
2773
2808
|
}
|
|
2774
|
-
else if (this.ticketInfo?.ticketDetails.issueStatus === 'identified' && this.comments == '' || this.ticketInfo?.ticketDetails?.refreshTicketStatus === 'identified' && this.comments == 0) {
|
|
2809
|
+
else if (this.ticketInfo?.ticketDetails.issueStatus === 'identified' && this.comments == '' || this.ticketInfo?.ticketDetails.ticketType == 'refreshticket' && this.ticketInfo?.ticketDetails?.refreshTicketStatus === 'identified' && this.comments == 0) {
|
|
2775
2810
|
return this.toastService.getErrorToast("Please Enter Comments");
|
|
2776
2811
|
}
|
|
2777
2812
|
let ticketDetails = {
|