tango-app-ui-manage-tickets 3.3.0-beta.9 → 3.7.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/esm2022/lib/components/footfall-dic/footfall-dic.component.mjs +853 -0
  2. package/esm2022/lib/components/group-select/group-select.component.mjs +155 -0
  3. package/esm2022/lib/components/reactive-select/reactive-select.component.mjs +108 -0
  4. package/esm2022/lib/components/tango-manage-tickets/tango-manage-tickets.component.mjs +4 -3
  5. package/esm2022/lib/components/tickets/tickets.component.mjs +39 -4
  6. package/esm2022/lib/services/ticket.service.mjs +58 -1
  7. package/esm2022/lib/tango-manage-tickets.module.mjs +16 -4
  8. package/fesm2022/tango-app-ui-manage-tickets.mjs +1227 -34
  9. package/fesm2022/tango-app-ui-manage-tickets.mjs.map +1 -1
  10. package/lib/components/footfall-dic/footfall-dic.component.d.ts +127 -0
  11. package/lib/components/group-select/group-select.component.d.ts +33 -0
  12. package/lib/components/reactive-select/reactive-select.component.d.ts +32 -0
  13. package/lib/components/tickets/tickets.component.d.ts +1 -0
  14. package/lib/services/ticket.service.d.ts +12 -1
  15. package/lib/tango-manage-tickets.module.d.ts +8 -5
  16. package/package.json +1 -1
package/fesm2022/tango-app-ui-manage-tickets.mjs CHANGED
@@ -1,15 +1,16 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Injectable, Component, Input, HostListener, ViewChild, NgModule } from '@angular/core';
3
- import * as i6 from '@angular/common';
2
+ import { Injectable, Component, Input, HostListener, ViewChild, forwardRef, EventEmitter, Output, NgModule } from '@angular/core';
3
+ import * as i6$1 from '@angular/common';
4
4
  import { CommonModule } from '@angular/common';
5
- import * as i2$1 from '@angular/router';
5
+ import * as i2 from '@angular/router';
6
6
  import { RouterModule } from '@angular/router';
7
- import { Subject, takeUntil } from 'rxjs';
8
- import * as i2 from 'tango-app-ui-global';
7
+ import { BehaviorSubject, Subject, takeUntil } from 'rxjs';
8
+ import * as i1$1 from 'tango-app-ui-global';
9
9
  import * as i1 from '@angular/common/http';
10
- import * as i7 from '@angular/forms';
11
- import { FormControl, FormsModule } from '@angular/forms';
12
- import * as i1$1 from '@ng-bootstrap/ng-bootstrap';
10
+ import { HttpParams } from '@angular/common/http';
11
+ import * as i6 from '@angular/forms';
12
+ import { FormControl, NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
13
+ import * as i1$2 from '@ng-bootstrap/ng-bootstrap';
13
14
  import * as i4 from 'tango-app-ui-shared';
14
15
  import { CommonSharedModule } from 'tango-app-ui-shared';
15
16
  import * as FileSaver from 'file-saver';
@@ -25,6 +26,10 @@ class TicketService {
25
26
  auditApiUrl;
26
27
  auditmetricApiUrl;
27
28
  zoneauditApiUrl;
29
+ footfallDirapiUrl;
30
+ footfallCDN;
31
+ trafficApiUrl;
32
+ dropDownTrigger = new BehaviorSubject(null);
28
33
  constructor(http, gs) {
29
34
  this.http = http;
30
35
  this.gs = gs;
@@ -35,6 +40,9 @@ class TicketService {
35
40
  this.auditmetricApiUrl = env.auditmetricApiUrl;
36
41
  this.auditApiUrl = env.auditApiUrl;
37
42
  this.zoneauditApiUrl = env.zoneauditApiUrl;
43
+ this.footfallDirapiUrl = env.footfallDirapiUrl;
44
+ this.footfallCDN = env.footfallCDN;
45
+ this.trafficApiUrl = env.trafficApiUrl;
38
46
  }
39
47
  });
40
48
  }
@@ -104,7 +112,55 @@ class TicketService {
104
112
  ExportAuditImagesasxlsx(data) {
105
113
  return this.http.get(`${this.auditApiUrl}/audit-images?fileDate=${data?.fileDate}&storeId=${data?.storeId}&imageType=${data?.imageType}&export=${data?.export}&zoneName=${data?.zoneName}&moduleType=${data?.moduleType}`, { responseType: 'arraybuffer' });
106
114
  }
107
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TicketService, deps: [{ token: i1.HttpClient }, { token: i2.GlobalStateService }], target: i0.ɵɵFactoryTarget.Injectable });
115
+ getTicketSummaryApi(client, fromDate, toDate) {
116
+ return this.http.get(`${this.footfallDirapiUrl}/ticket-summary?clientId=${client}&fromDate=${fromDate}&toDate=${toDate}`);
117
+ }
118
+ getTicketListApi(client, fromDate, toDate, searchvalue, limit, offset, isExport, sortBy, sortOrder) {
119
+ return this.http.get(`${this.footfallDirapiUrl}/ticket-list?clientId=${client}&fromDate=${fromDate}&toDate=${toDate}&searchValue=${searchvalue}&limit=${limit}&offset=${offset}&isExport=${isExport}&sortBy=${sortBy}&sortOrder=${sortOrder}`);
120
+ }
121
+ getTicketListExportApi(client, fromDate, toDate, searchvalue, limit, offset, isExport, sortBy, sortOrder) {
122
+ return this.http.get(`${this.footfallDirapiUrl}/ticket-list?clientId=${client}&fromDate=${fromDate}&toDate=${toDate}&searchValue=${searchvalue}&limit=${limit}&offset=${offset}&isExport=${isExport}&sortBy=${sortBy}&sortOrder=${sortOrder}`, { responseType: 'arraybuffer' });
123
+ }
124
+ getTicketsApi(store, fromDate, toDate, revopsType, status, action, offset, limit) {
125
+ let params = new HttpParams()
126
+ .set('storeId', store)
127
+ .set('fromDate', fromDate)
128
+ .set('toDate', toDate)
129
+ .set('offset', offset)
130
+ .set('limit', limit);
131
+ if (revopsType) {
132
+ params = params.set('revopsType', revopsType);
133
+ }
134
+ if (status) {
135
+ params = params.set('status', status);
136
+ }
137
+ if (action) {
138
+ params = params.set('action', action);
139
+ }
140
+ return this.http.get(`${this.footfallDirapiUrl}/get-tickets`, { params });
141
+ }
142
+ getTaggedStoresApi(client, fromDate, toDate, searchValue, clusters) {
143
+ let params = new HttpParams()
144
+ .set('clientId', client)
145
+ .set('fromDate', fromDate)
146
+ .set('toDate', toDate); // Add searchValue as an empty string if not provided
147
+ // Only add 'clusters' if it's not null, undefined, or an empty array/string
148
+ if (searchValue) {
149
+ params = params.set('searchValue', searchValue);
150
+ }
151
+ if (clusters && clusters.length > 0) {
152
+ params = params.set('clusters', clusters);
153
+ }
154
+ return this.http.get(`${this.footfallDirapiUrl}/get-tagged-stores`, { params });
155
+ }
156
+ getUpdateStatusApi(data) {
157
+ const url = `${this.footfallDirapiUrl}/update-status`;
158
+ return this.http.put(url, data);
159
+ }
160
+ getclusters(data) {
161
+ return this.http.post(`${this.trafficApiUrl}/headercluster_v2`, data);
162
+ }
163
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TicketService, deps: [{ token: i1.HttpClient }, { token: i1$1.GlobalStateService }], target: i0.ɵɵFactoryTarget.Injectable });
108
164
  static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TicketService, providedIn: 'root' });
109
165
  }
110
166
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TicketService, decorators: [{
@@ -112,7 +168,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
112
168
  args: [{
113
169
  providedIn: 'root'
114
170
  }]
115
- }], ctorParameters: () => [{ type: i1.HttpClient }, { type: i2.GlobalStateService }] });
171
+ }], ctorParameters: () => [{ type: i1.HttpClient }, { type: i1$1.GlobalStateService }] });
116
172
 
117
173
  class AddCsmModalComponent {
118
174
  activeModal;
@@ -194,13 +250,13 @@ class AddCsmModalComponent {
194
250
  cancel() {
195
251
  this.activeModal.close("submit");
196
252
  }
197
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddCsmModalComponent, deps: [{ token: i1$1.NgbActiveModal }, { token: i2.GlobalStateService }, { token: TicketService }, { token: i4.ToastService }], target: i0.ɵɵFactoryTarget.Component });
253
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddCsmModalComponent, deps: [{ token: i1$2.NgbActiveModal }, { token: i1$1.GlobalStateService }, { token: TicketService }, { token: i4.ToastService }], target: i0.ɵɵFactoryTarget.Component });
198
254
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: AddCsmModalComponent, selector: "lib-add-csm-modal", inputs: { ticketId: "ticketId" }, ngImport: i0, template: "<div class=\"card py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\"/>\r\n <path d=\"M32 37V35C32 33.9391 31.5786 32.9217 30.8284 32.1716C30.0783 31.4214 29.0609 31 28 31H21C19.9391 31 18.9217 31.4214 18.1716 32.1716C17.4214 32.9217 17 33.9391 17 35V37M36 24V30M39 27H33M28.5 23C28.5 25.2091 26.7091 27 24.5 27C22.2909 27 20.5 25.2091 20.5 23C20.5 20.7909 22.2909 19 24.5 19C26.7091 19 28.5 20.7909 28.5 23Z\" stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Assign Ticket</a>\r\n <p class=\"text-sub\">Assign the ticket to a particular user</p>\r\n <div class=\"mt-5 w-100\">\r\n <!-- <lib-reactive-select [formControl]=\"csmSelectInput\" [idField]=\"'email'\" [nameField]=\"'userName'\" [data]=\"csmUserList\" ></lib-reactive-select> -->\r\n\r\n <!-- <select [formControl]=\"csmSelectInput\" class=\"form-select border-val my-3\">\r\n <option [value]=\"user.email\" *ngFor=\"let user of csmUserList\">{{user.userName}}</option>\r\n </select> -->\r\n\r\n <lib-select [items]=\"userList\" [multi]=\"false\" [searchField]=\"'userName'\" [idField]=\"'_id'\"\r\n (selected)=\"onCsmSelect($event)\" ></lib-select>\r\n\r\n <div class=\"d-flex my-7\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" [disabled]=\"!csmSelectInput.value\" (click)=\"assignCsm()\">Submit</button>\r\n </div>\r\n \r\n </div>\r\n\r\n </div>\r\n</div>", styles: ["::ng-deep .modal-content{border-radius:12px!important;overflow:unset!important}::ng-deep ngb-modal-window .component-host-scrollable{overflow:unset!important}.text-sub{color:var(--Gray-500, #667085)!important;font-size:14px;font-weight:400;line-height:20px}\n"], dependencies: [{ kind: "component", type: i4.CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }] });
199
255
  }
200
256
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddCsmModalComponent, decorators: [{
201
257
  type: Component,
202
258
  args: [{ selector: "lib-add-csm-modal", template: "<div class=\"card py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\"/>\r\n <path d=\"M32 37V35C32 33.9391 31.5786 32.9217 30.8284 32.1716C30.0783 31.4214 29.0609 31 28 31H21C19.9391 31 18.9217 31.4214 18.1716 32.1716C17.4214 32.9217 17 33.9391 17 35V37M36 24V30M39 27H33M28.5 23C28.5 25.2091 26.7091 27 24.5 27C22.2909 27 20.5 25.2091 20.5 23C20.5 20.7909 22.2909 19 24.5 19C26.7091 19 28.5 20.7909 28.5 23Z\" stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Assign Ticket</a>\r\n <p class=\"text-sub\">Assign the ticket to a particular user</p>\r\n <div class=\"mt-5 w-100\">\r\n <!-- <lib-reactive-select [formControl]=\"csmSelectInput\" [idField]=\"'email'\" [nameField]=\"'userName'\" [data]=\"csmUserList\" ></lib-reactive-select> -->\r\n\r\n <!-- <select [formControl]=\"csmSelectInput\" class=\"form-select border-val my-3\">\r\n <option [value]=\"user.email\" *ngFor=\"let user of csmUserList\">{{user.userName}}</option>\r\n </select> -->\r\n\r\n <lib-select [items]=\"userList\" [multi]=\"false\" [searchField]=\"'userName'\" [idField]=\"'_id'\"\r\n (selected)=\"onCsmSelect($event)\" ></lib-select>\r\n\r\n <div class=\"d-flex my-7\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" [disabled]=\"!csmSelectInput.value\" (click)=\"assignCsm()\">Submit</button>\r\n </div>\r\n \r\n </div>\r\n\r\n </div>\r\n</div>", styles: ["::ng-deep .modal-content{border-radius:12px!important;overflow:unset!important}::ng-deep ngb-modal-window .component-host-scrollable{overflow:unset!important}.text-sub{color:var(--Gray-500, #667085)!important;font-size:14px;font-weight:400;line-height:20px}\n"] }]
203
- }], ctorParameters: () => [{ type: i1$1.NgbActiveModal }, { type: i2.GlobalStateService }, { type: TicketService }, { type: i4.ToastService }], propDecorators: { ticketId: [{
259
+ }], ctorParameters: () => [{ type: i1$2.NgbActiveModal }, { type: i1$1.GlobalStateService }, { type: TicketService }, { type: i4.ToastService }], propDecorators: { ticketId: [{
204
260
  type: Input
205
261
  }] } });
206
262
 
@@ -245,13 +301,13 @@ class CommentModelComponent {
245
301
  complete: () => { },
246
302
  });
247
303
  }
248
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CommentModelComponent, deps: [{ token: i1$1.NgbActiveModal }, { token: TicketService }, { token: i4.ToastService }], target: i0.ɵɵFactoryTarget.Component });
249
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CommentModelComponent, selector: "lib-comment-model", inputs: { ticketId: "ticketId" }, ngImport: i0, template: "<div class=\"card py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\"/>\r\n <path d=\"M37 31C37 31.5304 36.7893 32.0391 36.4142 32.4142C36.0391 32.7893 35.5304 33 35 33H23L19 37V21C19 20.4696 19.2107 19.9609 19.5858 19.5858C19.9609 19.2107 20.4696 19 21 19H35C35.5304 19 36.0391 19.2107 36.4142 19.5858C36.7893 19.9609 37 20.4696 37 21V31Z\" stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Comment</a>\r\n <p class=\"text-sub\">Add comment for the ticket</p>\r\n <div class=\"w-100\">\r\n <label class=\"label my-2\">Comments</label>\r\n <textarea class=\"form-control\" [(ngModel)]=\"comment\" rows=\"4\" type=\"text\"></textarea>\r\n\r\n <div class=\"d-flex my-7\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" (click)=\"commentSubmit()\">Submit</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["::ng-deep .modal-content{border-radius:12px!important;overflow:unset!important}::ng-deep ngb-modal-window .component-host-scrollable{overflow:unset!important}.text-sub{color:var(--Gray-500, #667085)!important;font-size:14px;font-weight:400;line-height:20px}.label{color:var(--Gray-700, #344054)!important;font-size:14px;font-weight:500;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i7.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: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
304
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CommentModelComponent, deps: [{ token: i1$2.NgbActiveModal }, { token: TicketService }, { token: i4.ToastService }], target: i0.ɵɵFactoryTarget.Component });
305
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CommentModelComponent, selector: "lib-comment-model", inputs: { ticketId: "ticketId" }, ngImport: i0, template: "<div class=\"card py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\"/>\r\n <path d=\"M37 31C37 31.5304 36.7893 32.0391 36.4142 32.4142C36.0391 32.7893 35.5304 33 35 33H23L19 37V21C19 20.4696 19.2107 19.9609 19.5858 19.5858C19.9609 19.2107 20.4696 19 21 19H35C35.5304 19 36.0391 19.2107 36.4142 19.5858C36.7893 19.9609 37 20.4696 37 21V31Z\" stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Comment</a>\r\n <p class=\"text-sub\">Add comment for the ticket</p>\r\n <div class=\"w-100\">\r\n <label class=\"label my-2\">Comments</label>\r\n <textarea class=\"form-control\" [(ngModel)]=\"comment\" rows=\"4\" type=\"text\"></textarea>\r\n\r\n <div class=\"d-flex my-7\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" (click)=\"commentSubmit()\">Submit</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["::ng-deep .modal-content{border-radius:12px!important;overflow:unset!important}::ng-deep ngb-modal-window .component-host-scrollable{overflow:unset!important}.text-sub{color:var(--Gray-500, #667085)!important;font-size:14px;font-weight:400;line-height:20px}.label{color:var(--Gray-700, #344054)!important;font-size:14px;font-weight:500;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i6.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
250
306
  }
251
307
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CommentModelComponent, decorators: [{
252
308
  type: Component,
253
309
  args: [{ selector: 'lib-comment-model', template: "<div class=\"card py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\"/>\r\n <path d=\"M37 31C37 31.5304 36.7893 32.0391 36.4142 32.4142C36.0391 32.7893 35.5304 33 35 33H23L19 37V21C19 20.4696 19.2107 19.9609 19.5858 19.5858C19.9609 19.2107 20.4696 19 21 19H35C35.5304 19 36.0391 19.2107 36.4142 19.5858C36.7893 19.9609 37 20.4696 37 21V31Z\" stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Comment</a>\r\n <p class=\"text-sub\">Add comment for the ticket</p>\r\n <div class=\"w-100\">\r\n <label class=\"label my-2\">Comments</label>\r\n <textarea class=\"form-control\" [(ngModel)]=\"comment\" rows=\"4\" type=\"text\"></textarea>\r\n\r\n <div class=\"d-flex my-7\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" (click)=\"commentSubmit()\">Submit</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["::ng-deep .modal-content{border-radius:12px!important;overflow:unset!important}::ng-deep ngb-modal-window .component-host-scrollable{overflow:unset!important}.text-sub{color:var(--Gray-500, #667085)!important;font-size:14px;font-weight:400;line-height:20px}.label{color:var(--Gray-700, #344054)!important;font-size:14px;font-weight:500;line-height:20px}\n"] }]
254
- }], ctorParameters: () => [{ type: i1$1.NgbActiveModal }, { type: TicketService }, { type: i4.ToastService }], propDecorators: { ticketId: [{
310
+ }], ctorParameters: () => [{ type: i1$2.NgbActiveModal }, { type: TicketService }, { type: i4.ToastService }], propDecorators: { ticketId: [{
255
311
  type: Input
256
312
  }] } });
257
313
 
@@ -394,7 +450,7 @@ class TicketsComponent {
394
450
  ];
395
451
  }
396
452
  else {
397
- this.typeName = "Resloved By";
453
+ this.typeName = "Resolved By";
398
454
  if (this.users.userType === "tango" && this.type === 'infra') {
399
455
  this.statusType = [
400
456
  { text: "Open", id: "open" },
@@ -648,6 +704,9 @@ class TicketsComponent {
648
704
  }
649
705
  }
650
706
  selectedTabs(type) {
707
+ this.currentPage = 1;
708
+ this.offset = 1;
709
+ this.limit = 10;
651
710
  if (this.type === 'dataMismatch') {
652
711
  this.selectedTab = type.name.replace(/\s+/g, '').toLocaleLowerCase();
653
712
  this.currentPage = 1;
@@ -833,6 +892,12 @@ class TicketsComponent {
833
892
  else {
834
893
  this.tableListArray = res.data.result;
835
894
  this.totalItems = res.data?.count;
895
+ if (this.totalItems < 10) {
896
+ this.paginationSizes = [this.totalItems];
897
+ }
898
+ else {
899
+ this.paginationSizes = [10, 20, 30];
900
+ }
836
901
  this.loading = false;
837
902
  this.noData = false;
838
903
  this.selectAll = false;
@@ -868,6 +933,12 @@ class TicketsComponent {
868
933
  else {
869
934
  this.tableListArray = res.data.result;
870
935
  this.totalItems = res.data?.count;
936
+ if (this.totalItems < 10) {
937
+ this.paginationSizes = [this.totalItems];
938
+ }
939
+ else {
940
+ this.paginationSizes = [10, 20, 30];
941
+ }
871
942
  this.loading = false;
872
943
  this.noData = false;
873
944
  this.selectAll = false;
@@ -897,6 +968,12 @@ class TicketsComponent {
897
968
  this.listArray = res?.data?.response;
898
969
  this.tableListArray = res?.data?.result;
899
970
  this.totalItems = res.data?.count;
971
+ if (this.totalItems < 10) {
972
+ this.paginationSizes = [this.totalItems];
973
+ }
974
+ else {
975
+ this.paginationSizes = [10, 20, 30];
976
+ }
900
977
  this.loading = false;
901
978
  this.noData = false;
902
979
  }
@@ -928,6 +1005,12 @@ class TicketsComponent {
928
1005
  else {
929
1006
  this.tableListArray = res?.data?.result;
930
1007
  this.totalItems = res.data?.count;
1008
+ if (this.totalItems < 10) {
1009
+ this.paginationSizes = [this.totalItems];
1010
+ }
1011
+ else {
1012
+ this.paginationSizes = [10, 20, 30];
1013
+ }
931
1014
  this.loading = false;
932
1015
  this.noData = false;
933
1016
  this.selectAll = false;
@@ -1033,13 +1116,21 @@ class TicketsComponent {
1033
1116
  this.gs.dataRangeValue.next(data);
1034
1117
  this.router.navigate(['/manage/users']);
1035
1118
  }
1036
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TicketsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i2$1.Router }, { token: i2$1.ActivatedRoute }, { token: i2.GlobalStateService }, { token: i1$1.NgbModal }, { token: TicketService }, { token: ExcelService }], target: i0.ɵɵFactoryTarget.Component });
1037
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TicketsComponent, selector: "lib-tickets", ngImport: i0, template: "<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 *ngIf=\"type !=='dataMismatch' && type !== 'mat'\" class=\"card-label mb-2\">{{type | titlecase}}</span>\r\n <span *ngIf=\"type ==='dataMismatch'\" class=\"card-label mb-2\">Data Mismatch</span>\r\n <span *ngIf=\"type ==='mat'\" class=\"card-label mb-2\">Employee Mat</span>\r\n\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"!assignTicket\" 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\" placeholder=\"Search\" autocomplete=\"off\"\r\n (change)=\"searchData()\" [(ngModel)]=\"searchValue\" />\r\n <lib-filters *ngIf=\"users.userType === 'tango' && userList?.length || users.userType === 'client' && storeList?.length\" [dataObject]=\"dataObject\"\r\n (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button type=\"button\" *ngIf=\"!noData&&!loading\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Export</span>\r\n </button>\r\n </div>\r\n </div>\r\n <div *ngIf=\"assignTicket\" class=\"d-flex\">\r\n <button type=\"button\" (click)=\"addAssignTicket()\"\r\n class=\"btn mx-2 btn-primary rounded-3 text-nowrap border-val\">\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=\"M9.99984 4.1665V15.8332M4.1665 9.99984H15.8332\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2 text-white\">Assign Ticket</span>\r\n </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card-body\">\r\n\r\n\r\n <ul *ngIf=\"!loading && listArray?.length && type !== 'mat' && type !== 'dataMismatch'\" class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" *ngFor=\"let obj of listArray.slice().reverse()\" (click)=\"selectedTabs(obj)\">\r\n <a [ngClass]=\"{'active': selectedTab === obj.name}\" class=\"nav-link cursor-pointer no-border me-2\">\r\n {{obj.name | titlecase}} <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === obj.name ? 'text-border-priamry' : 'text-border'\">{{obj.count}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <ul *ngIf=\"!loading && listArray?.length && type === 'dataMismatch'\" class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" *ngFor=\"let obj of listArray.slice().reverse()\" (click)=\"selectedTabs(obj)\">\r\n <a [ngClass]=\"selectedTab === transformName(obj.name) ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n {{obj.name | titlecase}} <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === transformName(obj.name) ? 'text-border-priamry' : 'text-border'\">{{obj.count}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"table-responsive mt-5\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" >\r\n \r\n <input *ngIf=\"this.users.userType ==='tango'\"\r\n class=\"form-check-input cursor-pointer me-4\" type=\"checkbox\" [(ngModel)]=\"selectAll\"\r\n (click)=\"selectAllStore($event)\"> <span class=\"cursor-pointer\" (click)=\"onSort('ticketId')\"> Ticket ID <svg\r\n [ngClass]=\"sortedColumn === 'ticketId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'ticketId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span> \r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type !=='dataMismatch'\" (click)=\"onSort('issueDate')\"> Created Date\r\n <svg [ngClass]=\"sortedColumn === 'issueDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='infra'\" (click)=\"onSort('createdAt')\"> Created Time\r\n <svg [ngClass]=\"sortedColumn === 'createdAt' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'createdAt' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='infra'\" (click)=\"onSort('issueClosedDate')\"> Closed Time\r\n <svg [ngClass]=\"sortedColumn === 'issueClosedDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueClosedDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('createdAt')\"> Created Date\r\n <svg [ngClass]=\"sortedColumn === 'createdAt' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'createdAt' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" ><span (click)=\"onSort('issueDate')\">Issue Date\r\n <svg [ngClass]=\"sortedColumn === 'issueDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"cursor-pointer\" (click)=\"onSort('clientName')\">Brand Name<svg\r\n [ngClass]=\"sortedColumn === 'clientName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'clientName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"cursor-pointer\" (click)=\"onSort('clientId')\">Brand ID<svg\r\n [ngClass]=\"sortedColumn === 'clientId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'clientId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name<svg\r\n [ngClass]=\"sortedColumn === 'storeName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'storeName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID<svg\r\n [ngClass]=\"sortedColumn === 'storeId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'storeId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"this.users.userType ==='tango' && (type ==='infra'||type ==='dataMismatch'||type ==='mat')\" (click)=\"onSort('userName')\">Resolved By<svg [ngClass]=\"sortedColumn === 'userName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'userName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"this.users.userType ==='tango' && type ==='installation'\" (click)=\"onSort('userName')\">Installed By<svg [ngClass]=\"sortedColumn === 'userName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'userName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('issueType')\">Issue Type\r\n <svg [ngClass]=\"sortedColumn === 'issueType' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueType' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('type')\">Query Type\r\n <svg [ngClass]=\"sortedColumn === 'type' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'type' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('reportedFootfall')\">Reported Footfall\r\n <svg [ngClass]=\"sortedColumn === 'reportedFootfall' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'reportedFootfall' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('mappedCount')\">Unique Images\r\n <svg [ngClass]=\"sortedColumn === 'mappedCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'mappedCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('successPercentage')\">Success Percentage\r\n <svg [ngClass]=\"sortedColumn === 'successPercentage' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'successPercentage' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='installation'\" (click)=\"onSort('status')\">Deployed Status<svg\r\n [ngClass]=\"sortedColumn === 'status' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type ==='dataMismatch' ||type ==='mat'|| type ==='infra'\" class=\"cursor-pointer\" (click)=\"onSort('status')\">Status<svg\r\n [ngClass]=\"sortedColumn === 'status' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type !== 'mat' && type !== 'dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('primaryIssue')\">Primary Issues<svg\r\n [ngClass]=\"sortedColumn === 'primaryIssue' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'primaryIssue' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type !== 'mat' && type !== 'dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('secondaryIssue')\">Secondary Issues<svg\r\n [ngClass]=\"sortedColumn === 'secondaryIssue' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'secondaryIssue' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type!=='installation'\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of tableListArray\">\r\n <td>\r\n <input *ngIf=\"this.users.userType ==='tango'\" class=\"form-check-input cursor-pointer me-4 mt-3\" type=\"checkbox\" [(ngModel)]=\"obj.checked\"\r\n (change)=\"updateCheck($event,obj?.ticketId)\">\r\n <span *ngIf=\"type === 'dataMismatch' || type === 'mat' || type === 'infra'\"\r\n class=\"txt-light-primary cursor-pointer\" (click)=\"tickets(type,obj.clientId,obj.storeId,obj.clientName)\">\r\n {{obj.ticketId}}\r\n </span>\r\n <span *ngIf=\"type === 'installation'\">\r\n {{obj.ticketId}}\r\n </span>\r\n </td>\r\n <td *ngIf=\"type === 'dataMismatch'\">\r\n {{obj?.createdAt |\r\n date: 'dd MMM, yyyy'}}</td>\r\n <td *ngIf=\"type === 'dataMismatch'\">\r\n {{obj?.issueDate |\r\n date: 'dd MMM, yyyy'}}</td>\r\n <td *ngIf=\"type !== 'dataMismatch'\">\r\n {{obj?.createdAt |\r\n date: 'dd MMM, yyyy'}}\r\n </td>\r\n <td *ngIf=\"type === 'infra'\">\r\n {{obj?.createdAt |\r\n date: 'hh:mm a' | uppercase}}\r\n </td>\r\n <td *ngIf=\"type === 'infra'\">\r\n {{obj?.issueClosedDate?(obj?.issueClosedDate |\r\n date: 'hh:mm a' | uppercase):\"--\"}}\r\n </td>\r\n <td *ngIf=\"this.users.userType ==='tango'\">\r\n <div class=\"table-title cursor-pointer\" (click)=\"clientTickets(obj.clientId,obj.storeId,obj.clientName)\">\r\n <span class=\"txt-light-primary\">\r\n {{obj.clientName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"this.users.userType ==='tango'\">{{obj.clientId}}\r\n </td>\r\n <td>\r\n <div class=\"table-title cursor-pointer\" (click)=\"storeTickets(obj.clientId,obj.storeId,obj.clientName)\">\r\n <span class=\"txt-light-primary\">\r\n {{obj.storeName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td>{{obj.storeId}}\r\n </td>\r\n \r\n <td *ngIf=\"this.users.userType ==='tango'\">\r\n <div class=\"table-title cursor-pointer\" >\r\n <span >\r\n {{obj.userName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"type ==='dataMismatch' && obj.issueType ==='lowcount'\" >Low Count</td>\r\n <td *ngIf=\"type ==='dataMismatch' && obj.issueType ==='highcount'\">High Count</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.type ? obj?.type:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.reportedFootfall ? obj?.reportedFootfall:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.mappedCount ? obj?.mappedCount:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.successPercentage ? obj?.successPercentage:'--'}}</td>\r\n <td *ngIf=\"type==='installation'\">\r\n <span *ngIf=\"obj.installationStatus ==='paired' || obj.installationStatus ==='onboarded'\"\r\n class=\"badge badge-light-primary mx-4\">{{obj.installationStatus | titlecase}}</span>\r\n <span *ngIf=\"obj.installationStatus ==='live'\" class=\"badge badge-light-success mx-4\">Live</span>\r\n <span *ngIf=\"obj.installationStatus ==='installationfailed'\"\r\n class=\"badge badge-light-warning mx-4\">Installationfailed</span>\r\n <span *ngIf=\"obj.installationStatus ==='deployed'\"\r\n class=\"badge badge-light-success mx-4 text-capitalize\">deployed</span>\r\n </td>\r\n <td *ngIf=\"type==='infra' || type==='mat' || type==='dataMismatch'\">\r\n <span *ngIf=\"obj.status ==='open'\" class=\"badge badge-light-danger\">Open</span>\r\n <span *ngIf=\"obj.status ==='closed'\" class=\"badge badge-light-success\">Closed</span>\r\n <span *ngIf=\"obj.status ==='inprogress'\" class=\"badge badge-light-primary\">In\r\n Progress</span>\r\n </td>\r\n <td *ngIf=\"type==='installation' || type==='infra'\">\r\n <div>\r\n <span *ngIf=\"obj.primaryIssue !=='-'\">{{obj.primaryIssue ? obj.primaryIssue :'Issue not identified'}}</span>\r\n <span *ngIf=\"obj.primaryIssue ==='-'\">Issue not identified</span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"type==='installation' || type==='infra'\">\r\n <span *ngIf=\"obj.secondaryIssue\">{{obj.secondaryIssue}}</span>\r\n </td>\r\n <td *ngIf=\"type==='infra' || type ==='dataMismatch'\">\r\n <span class=\"mx-2 cursor-pointer\" *ngIf=\"this.users.userType ==='tango'\" (click)=\"commentModal(obj)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M17.6431 12.5C17.6431 12.942 17.4675 13.366 17.1549 13.6785C16.8423 13.9911 16.4184 14.1667 15.9764 14.1667H5.9764L2.64307 17.5V4.16667C2.64307 3.72464 2.81866 3.30072 3.13122 2.98816C3.44378 2.67559 3.86771 2.5 4.30973 2.5H15.9764C16.4184 2.5 16.8423 2.67559 17.1549 2.98816C17.4675 3.30072 17.6431 3.72464 17.6431 4.16667V12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"mx-2 cursor-pointer\" (click)=\"tickets(type,obj.clientId,obj.storeId,obj.clientName)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_10640_18061)\">\r\n <path\r\n d=\"M0.976562 10C0.976562 10 4.3099 3.33337 10.1432 3.33337C15.9766 3.33337 19.3099 10 19.3099 10C19.3099 10 15.9766 16.6667 10.1432 16.6667C4.3099 16.6667 0.976562 10 0.976562 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.1432 12.5C11.5239 12.5 12.6432 11.3808 12.6432 10C12.6432 8.61933 11.5239 7.50004 10.1432 7.50004C8.76252 7.50004 7.64323 8.61933 7.64323 10C7.64323 11.3808 8.76252 12.5 10.1432 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_10640_18061\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.143066)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </td>\r\n <td *ngIf=\"type === 'mat'\">\r\n <span class=\"mx-2 cursor-pointer\" (click)=\"routeToMat(obj.storeId,obj.clientId,obj.clientName)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_10640_18061)\">\r\n <path\r\n d=\"M0.976562 10C0.976562 10 4.3099 3.33337 10.1432 3.33337C15.9766 3.33337 19.3099 10 19.3099 10C19.3099 10 15.9766 16.6667 10.1432 16.6667C4.3099 16.6667 0.976562 10 0.976562 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.1432 12.5C11.5239 12.5 12.6432 11.3808 12.6432 10C12.6432 8.61933 11.5239 7.50004 10.1432 7.50004C8.76252 7.50004 7.64323 8.61933 7.64323 10C7.64323 11.3808 8.76252 12.5 10.1432 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_10640_18061\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.143066)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span> \r\n \r\n </td>\r\n \r\n \r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"pageSize\" [currentPage]=\"currentPage\" [totalItems]=\"totalItems\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n </div>\r\n</div>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.text-border{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;color:var(--Gray-700, #344054);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important}.text-border-priamry{border-radius:16px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-700, #009BF3);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}.text-sub{color:var(--Gray-500, #667085)!important;font-family:Inter;font-size:14px!important;font-weight:400!important;line-height:20px}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}td{vertical-align:middle;line-height:35px!important}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}.txt-light-primary{color:#009bf3!important}input[type=checkbox]{width:16px!important;height:16px!important;margin:0 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.img-src{width:25%;height:20%}.rotate{rotate:180deg;transition:1s}.viewbutton{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);box-shadow:0 1px 2px #1018280d;padding:10px 16px;justify-content:center;align-items:center;gap:10px;color:var(--Gray-700, #344054);font-family:Inter;font-size:12px;font-weight:600}.horizontal-scroll{overflow-x:auto;overflow-y:hidden;white-space:nowrap}\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: i7.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: i7.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { 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" }] });
1119
+ setpageSize() {
1120
+ if (this.totalItems < 10) {
1121
+ return this.totalItems;
1122
+ }
1123
+ else {
1124
+ return this.pageSize;
1125
+ }
1126
+ }
1127
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TicketsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i2.Router }, { token: i2.ActivatedRoute }, { token: i1$1.GlobalStateService }, { token: i1$2.NgbModal }, { token: TicketService }, { token: ExcelService }], target: i0.ɵɵFactoryTarget.Component });
1128
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TicketsComponent, selector: "lib-tickets", ngImport: i0, template: "<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 *ngIf=\"type !=='dataMismatch' && type !== 'mat'\" class=\"card-label mb-2\">{{type | titlecase}}</span>\r\n <span *ngIf=\"type ==='dataMismatch'\" class=\"card-label mb-2\">Data Mismatch</span>\r\n <span *ngIf=\"type ==='mat'\" class=\"card-label mb-2\">Employee Mat</span>\r\n\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"!assignTicket\" 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\" placeholder=\"Search\" autocomplete=\"off\"\r\n (change)=\"searchData()\" [(ngModel)]=\"searchValue\" />\r\n <lib-filters *ngIf=\"users.userType === 'tango' && userList?.length || users.userType === 'client' && storeList?.length\" [dataObject]=\"dataObject\"\r\n (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button type=\"button\" *ngIf=\"!noData&&!loading\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Export</span>\r\n </button>\r\n </div>\r\n </div>\r\n <div *ngIf=\"assignTicket\" class=\"d-flex\">\r\n <button type=\"button\" (click)=\"addAssignTicket()\"\r\n class=\"btn mx-2 btn-primary rounded-3 text-nowrap border-val\">\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=\"M9.99984 4.1665V15.8332M4.1665 9.99984H15.8332\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2 text-white\">Assign Ticket</span>\r\n </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card-body\">\r\n\r\n\r\n <ul *ngIf=\"!loading && listArray?.length && type !== 'mat' && type !== 'dataMismatch'\" class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" *ngFor=\"let obj of listArray.slice().reverse()\" (click)=\"selectedTabs(obj)\">\r\n <a [ngClass]=\"{'active': selectedTab === obj.name}\" class=\"nav-link cursor-pointer no-border me-2\">\r\n {{obj.name | titlecase}} <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === obj.name ? 'text-border-priamry' : 'text-border'\">{{obj.count}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <ul *ngIf=\"!loading && listArray?.length && type === 'dataMismatch'\" class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" *ngFor=\"let obj of listArray.slice().reverse()\" (click)=\"selectedTabs(obj)\">\r\n <a [ngClass]=\"selectedTab === transformName(obj.name) ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n {{obj.name | titlecase}} <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === transformName(obj.name) ? 'text-border-priamry' : 'text-border'\">{{obj.count}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"table-responsive mt-5\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" >\r\n \r\n <input *ngIf=\"this.users.userType ==='tango'\"\r\n class=\"form-check-input cursor-pointer me-4\" type=\"checkbox\" [(ngModel)]=\"selectAll\"\r\n (click)=\"selectAllStore($event)\"> <span class=\"cursor-pointer\" (click)=\"onSort('ticketId')\"> Ticket ID <svg\r\n [ngClass]=\"sortedColumn === 'ticketId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'ticketId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span> \r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type !=='dataMismatch'\" (click)=\"onSort('issueDate')\"> Created Date\r\n <svg [ngClass]=\"sortedColumn === 'issueDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='infra'\" (click)=\"onSort('createdAt')\"> Created Time\r\n <svg [ngClass]=\"sortedColumn === 'createdAt' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'createdAt' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='infra'\" (click)=\"onSort('issueClosedDate')\"> Closed Time\r\n <svg [ngClass]=\"sortedColumn === 'issueClosedDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueClosedDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('createdAt')\"> Created Date\r\n <svg [ngClass]=\"sortedColumn === 'createdAt' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'createdAt' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" ><span (click)=\"onSort('issueDate')\">Issue Date\r\n <svg [ngClass]=\"sortedColumn === 'issueDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"cursor-pointer\" (click)=\"onSort('clientName')\">Brand Name<svg\r\n [ngClass]=\"sortedColumn === 'clientName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'clientName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"cursor-pointer\" (click)=\"onSort('clientId')\">Brand ID<svg\r\n [ngClass]=\"sortedColumn === 'clientId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'clientId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name<svg\r\n [ngClass]=\"sortedColumn === 'storeName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'storeName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID<svg\r\n [ngClass]=\"sortedColumn === 'storeId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'storeId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"this.users.userType ==='tango' && (type ==='infra'||type ==='dataMismatch'||type ==='mat')\" (click)=\"onSort('userName')\">Resolved By<svg [ngClass]=\"sortedColumn === 'userName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'userName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"this.users.userType ==='tango' && type ==='installation'\" (click)=\"onSort('userName')\">Installed By<svg [ngClass]=\"sortedColumn === 'userName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'userName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('issueType')\">Issue Type\r\n <svg [ngClass]=\"sortedColumn === 'issueType' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueType' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('type')\">Query Type\r\n <svg [ngClass]=\"sortedColumn === 'type' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'type' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('reportedFootfall')\">Reported Footfall\r\n <svg [ngClass]=\"sortedColumn === 'reportedFootfall' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'reportedFootfall' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('mappedCount')\">Unique Images\r\n <svg [ngClass]=\"sortedColumn === 'mappedCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'mappedCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('successPercentage')\">Success Percentage\r\n <svg [ngClass]=\"sortedColumn === 'successPercentage' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'successPercentage' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='installation'\" (click)=\"onSort('status')\">Deployed Status<svg\r\n [ngClass]=\"sortedColumn === 'status' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type ==='dataMismatch' ||type ==='mat'|| type ==='infra'\" class=\"cursor-pointer\" (click)=\"onSort('status')\">Status<svg\r\n [ngClass]=\"sortedColumn === 'status' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n<!-- added config and total downtime as per the prioduct team requirement -->\r\n <th>Configured Ticket Time\r\n </th> \r\n\r\n <th >Total Downtime\r\n </th>\r\n<!-- -->\r\n\r\n <th *ngIf=\"type !== 'mat' && type !== 'dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('primaryIssue')\">Primary Issues<svg\r\n [ngClass]=\"sortedColumn === 'primaryIssue' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'primaryIssue' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type !== 'mat' && type !== 'dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('secondaryIssue')\">Secondary Issues<svg\r\n [ngClass]=\"sortedColumn === 'secondaryIssue' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'secondaryIssue' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type!=='installation'\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of tableListArray\">\r\n <td>\r\n <input *ngIf=\"this.users.userType ==='tango'\" class=\"form-check-input cursor-pointer me-4 mt-3\" type=\"checkbox\" [(ngModel)]=\"obj.checked\"\r\n (change)=\"updateCheck($event,obj?.ticketId)\">\r\n <span *ngIf=\"type === 'dataMismatch' || type === 'mat' || type === 'infra'\"\r\n class=\"txt-light-primary cursor-pointer\" (click)=\"tickets(type,obj.clientId,obj.storeId,obj.clientName)\">\r\n {{obj.ticketId}}\r\n </span>\r\n <span *ngIf=\"type === 'installation'\">\r\n {{obj.ticketId}}\r\n </span>\r\n </td>\r\n <td *ngIf=\"type === 'dataMismatch'\">\r\n {{obj?.createdAt |\r\n date: 'dd MMM, yyyy'}}</td>\r\n <td *ngIf=\"type === 'dataMismatch'\">\r\n {{obj?.issueDate |\r\n date: 'dd MMM, yyyy'}}</td>\r\n <td *ngIf=\"type !== 'dataMismatch'\">\r\n {{obj?.createdAt |\r\n date: 'dd MMM, yyyy'}}\r\n </td>\r\n <td *ngIf=\"type === 'infra'\">\r\n {{obj?.createdAt |\r\n date: 'hh:mm a' | uppercase}}\r\n </td>\r\n <td *ngIf=\"type === 'infra'\">\r\n {{obj?.issueClosedDate?(obj?.issueClosedDate |\r\n date: 'hh:mm a' | uppercase):\"--\"}}\r\n </td>\r\n <td *ngIf=\"this.users.userType ==='tango'\">\r\n <div class=\"table-title cursor-pointer\" (click)=\"clientTickets(obj.clientId,obj.storeId,obj.clientName)\">\r\n <span class=\"txt-light-primary\">\r\n {{obj.clientName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"this.users.userType ==='tango'\">{{obj.clientId}}\r\n </td>\r\n <td>\r\n <div class=\"table-title cursor-pointer\" (click)=\"storeTickets(obj.clientId,obj.storeId,obj.clientName)\">\r\n <span class=\"txt-light-primary\">\r\n {{obj.storeName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td>{{obj.storeId}}\r\n </td>\r\n \r\n <td *ngIf=\"this.users.userType ==='tango'\">\r\n <div class=\"table-title cursor-pointer\" >\r\n <span >\r\n {{obj.userName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"type ==='dataMismatch' && obj.issueType ==='lowcount'\" >Low Count</td>\r\n <td *ngIf=\"type ==='dataMismatch' && obj.issueType ==='highcount'\">High Count</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.type ? obj?.type:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.reportedFootfall ? obj?.reportedFootfall:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.mappedCount ? obj?.mappedCount:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.successPercentage ? obj?.successPercentage:'--'}}</td>\r\n <td *ngIf=\"type==='installation'\">\r\n <span *ngIf=\"obj.installationStatus ==='paired' || obj.installationStatus ==='onboarded'\"\r\n class=\"badge badge-light-primary mx-4\">{{obj.installationStatus | titlecase}}</span>\r\n <span *ngIf=\"obj.installationStatus ==='live'\" class=\"badge badge-light-success mx-4\">Live</span>\r\n <span *ngIf=\"obj.installationStatus ==='installationfailed'\"\r\n class=\"badge badge-light-warning mx-4\">Installationfailed</span>\r\n <span *ngIf=\"obj.installationStatus ==='deployed'\"\r\n class=\"badge badge-light-success mx-4 text-capitalize\">deployed</span>\r\n </td>\r\n <td *ngIf=\"type==='infra' || type==='mat' || type==='dataMismatch'\">\r\n <span *ngIf=\"obj.status ==='open'\" class=\"badge badge-light-danger\">Open</span>\r\n <span *ngIf=\"obj.status ==='closed'\" class=\"badge badge-light-success\">Closed</span>\r\n <span *ngIf=\"obj.status ==='inprogress'\" class=\"badge badge-light-primary\">In\r\n Progress</span>\r\n </td>\r\n <td *ngIf=\"type==='infra'\">\r\n{{obj.configuredDownTime?obj.configuredDownTime*60:0 || 0 }} {{obj.configuredDownTime > 1? 'mins' : 'min'}} \r\n </td>\r\n <td *ngIf=\"type==='infra'\"> \r\n{{obj.totalDownTime || 0 }} {{obj.totalDownTime > 1? 'mins' : 'min'}} \r\n </td>\r\n <td *ngIf=\"type==='installation' || type==='infra'\">\r\n <div>\r\n <span *ngIf=\"obj.primaryIssue !=='-'\">{{obj.primaryIssue ? obj.primaryIssue :'Issue not identified'}}</span>\r\n <span *ngIf=\"obj.primaryIssue ==='-'\">Issue not identified</span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"type==='installation' || type==='infra'\">\r\n <span *ngIf=\"obj.secondaryIssue\">{{obj.secondaryIssue}}</span>\r\n </td>\r\n <td *ngIf=\"type==='infra' || type ==='dataMismatch'\">\r\n <span class=\"mx-2 cursor-pointer\" *ngIf=\"this.users.userType ==='tango'\" (click)=\"commentModal(obj)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M17.6431 12.5C17.6431 12.942 17.4675 13.366 17.1549 13.6785C16.8423 13.9911 16.4184 14.1667 15.9764 14.1667H5.9764L2.64307 17.5V4.16667C2.64307 3.72464 2.81866 3.30072 3.13122 2.98816C3.44378 2.67559 3.86771 2.5 4.30973 2.5H15.9764C16.4184 2.5 16.8423 2.67559 17.1549 2.98816C17.4675 3.30072 17.6431 3.72464 17.6431 4.16667V12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"mx-2 cursor-pointer\" (click)=\"tickets(type,obj.clientId,obj.storeId,obj.clientName)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_10640_18061)\">\r\n <path\r\n d=\"M0.976562 10C0.976562 10 4.3099 3.33337 10.1432 3.33337C15.9766 3.33337 19.3099 10 19.3099 10C19.3099 10 15.9766 16.6667 10.1432 16.6667C4.3099 16.6667 0.976562 10 0.976562 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.1432 12.5C11.5239 12.5 12.6432 11.3808 12.6432 10C12.6432 8.61933 11.5239 7.50004 10.1432 7.50004C8.76252 7.50004 7.64323 8.61933 7.64323 10C7.64323 11.3808 8.76252 12.5 10.1432 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_10640_18061\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.143066)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </td>\r\n <td *ngIf=\"type === 'mat'\">\r\n <span class=\"mx-2 cursor-pointer\" (click)=\"routeToMat(obj.storeId,obj.clientId,obj.clientName)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_10640_18061)\">\r\n <path\r\n d=\"M0.976562 10C0.976562 10 4.3099 3.33337 10.1432 3.33337C15.9766 3.33337 19.3099 10 19.3099 10C19.3099 10 15.9766 16.6667 10.1432 16.6667C4.3099 16.6667 0.976562 10 0.976562 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.1432 12.5C11.5239 12.5 12.6432 11.3808 12.6432 10C12.6432 8.61933 11.5239 7.50004 10.1432 7.50004C8.76252 7.50004 7.64323 8.61933 7.64323 10C7.64323 11.3808 8.76252 12.5 10.1432 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_10640_18061\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.143066)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span> \r\n \r\n </td>\r\n \r\n \r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"pageSize\" [currentPage]=\"currentPage\" [totalItems]=\"totalItems\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"setpageSize()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n </div>\r\n</div>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.text-border{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;color:var(--Gray-700, #344054);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important}.text-border-priamry{border-radius:16px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-700, #009BF3);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}.text-sub{color:var(--Gray-500, #667085)!important;font-family:Inter;font-size:14px!important;font-weight:400!important;line-height:20px}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}td{vertical-align:middle;line-height:35px!important}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}.txt-light-primary{color:#009bf3!important}input[type=checkbox]{width:16px!important;height:16px!important;margin:0 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.img-src{width:25%;height:20%}.rotate{rotate:180deg;transition:1s}.viewbutton{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);box-shadow:0 1px 2px #1018280d;padding:10px 16px;justify-content:center;align-items:center;gap:10px;color:var(--Gray-700, #344054);font-family:Inter;font-size:12px;font-weight:600}.horizontal-scroll{overflow-x:auto;overflow-y:hidden;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i6$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "pipe", type: i6$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i6$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i6$1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i6$1.DatePipe, name: "date" }] });
1038
1129
  }
1039
1130
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TicketsComponent, decorators: [{
1040
1131
  type: Component,
1041
- args: [{ selector: "lib-tickets", template: "<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 *ngIf=\"type !=='dataMismatch' && type !== 'mat'\" class=\"card-label mb-2\">{{type | titlecase}}</span>\r\n <span *ngIf=\"type ==='dataMismatch'\" class=\"card-label mb-2\">Data Mismatch</span>\r\n <span *ngIf=\"type ==='mat'\" class=\"card-label mb-2\">Employee Mat</span>\r\n\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"!assignTicket\" 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\" placeholder=\"Search\" autocomplete=\"off\"\r\n (change)=\"searchData()\" [(ngModel)]=\"searchValue\" />\r\n <lib-filters *ngIf=\"users.userType === 'tango' && userList?.length || users.userType === 'client' && storeList?.length\" [dataObject]=\"dataObject\"\r\n (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button type=\"button\" *ngIf=\"!noData&&!loading\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Export</span>\r\n </button>\r\n </div>\r\n </div>\r\n <div *ngIf=\"assignTicket\" class=\"d-flex\">\r\n <button type=\"button\" (click)=\"addAssignTicket()\"\r\n class=\"btn mx-2 btn-primary rounded-3 text-nowrap border-val\">\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=\"M9.99984 4.1665V15.8332M4.1665 9.99984H15.8332\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2 text-white\">Assign Ticket</span>\r\n </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card-body\">\r\n\r\n\r\n <ul *ngIf=\"!loading && listArray?.length && type !== 'mat' && type !== 'dataMismatch'\" class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" *ngFor=\"let obj of listArray.slice().reverse()\" (click)=\"selectedTabs(obj)\">\r\n <a [ngClass]=\"{'active': selectedTab === obj.name}\" class=\"nav-link cursor-pointer no-border me-2\">\r\n {{obj.name | titlecase}} <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === obj.name ? 'text-border-priamry' : 'text-border'\">{{obj.count}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <ul *ngIf=\"!loading && listArray?.length && type === 'dataMismatch'\" class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" *ngFor=\"let obj of listArray.slice().reverse()\" (click)=\"selectedTabs(obj)\">\r\n <a [ngClass]=\"selectedTab === transformName(obj.name) ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n {{obj.name | titlecase}} <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === transformName(obj.name) ? 'text-border-priamry' : 'text-border'\">{{obj.count}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"table-responsive mt-5\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" >\r\n \r\n <input *ngIf=\"this.users.userType ==='tango'\"\r\n class=\"form-check-input cursor-pointer me-4\" type=\"checkbox\" [(ngModel)]=\"selectAll\"\r\n (click)=\"selectAllStore($event)\"> <span class=\"cursor-pointer\" (click)=\"onSort('ticketId')\"> Ticket ID <svg\r\n [ngClass]=\"sortedColumn === 'ticketId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'ticketId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span> \r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type !=='dataMismatch'\" (click)=\"onSort('issueDate')\"> Created Date\r\n <svg [ngClass]=\"sortedColumn === 'issueDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='infra'\" (click)=\"onSort('createdAt')\"> Created Time\r\n <svg [ngClass]=\"sortedColumn === 'createdAt' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'createdAt' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='infra'\" (click)=\"onSort('issueClosedDate')\"> Closed Time\r\n <svg [ngClass]=\"sortedColumn === 'issueClosedDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueClosedDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('createdAt')\"> Created Date\r\n <svg [ngClass]=\"sortedColumn === 'createdAt' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'createdAt' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" ><span (click)=\"onSort('issueDate')\">Issue Date\r\n <svg [ngClass]=\"sortedColumn === 'issueDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"cursor-pointer\" (click)=\"onSort('clientName')\">Brand Name<svg\r\n [ngClass]=\"sortedColumn === 'clientName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'clientName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"cursor-pointer\" (click)=\"onSort('clientId')\">Brand ID<svg\r\n [ngClass]=\"sortedColumn === 'clientId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'clientId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name<svg\r\n [ngClass]=\"sortedColumn === 'storeName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'storeName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID<svg\r\n [ngClass]=\"sortedColumn === 'storeId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'storeId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"this.users.userType ==='tango' && (type ==='infra'||type ==='dataMismatch'||type ==='mat')\" (click)=\"onSort('userName')\">Resolved By<svg [ngClass]=\"sortedColumn === 'userName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'userName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"this.users.userType ==='tango' && type ==='installation'\" (click)=\"onSort('userName')\">Installed By<svg [ngClass]=\"sortedColumn === 'userName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'userName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('issueType')\">Issue Type\r\n <svg [ngClass]=\"sortedColumn === 'issueType' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueType' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('type')\">Query Type\r\n <svg [ngClass]=\"sortedColumn === 'type' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'type' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('reportedFootfall')\">Reported Footfall\r\n <svg [ngClass]=\"sortedColumn === 'reportedFootfall' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'reportedFootfall' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('mappedCount')\">Unique Images\r\n <svg [ngClass]=\"sortedColumn === 'mappedCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'mappedCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('successPercentage')\">Success Percentage\r\n <svg [ngClass]=\"sortedColumn === 'successPercentage' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'successPercentage' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='installation'\" (click)=\"onSort('status')\">Deployed Status<svg\r\n [ngClass]=\"sortedColumn === 'status' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type ==='dataMismatch' ||type ==='mat'|| type ==='infra'\" class=\"cursor-pointer\" (click)=\"onSort('status')\">Status<svg\r\n [ngClass]=\"sortedColumn === 'status' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type !== 'mat' && type !== 'dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('primaryIssue')\">Primary Issues<svg\r\n [ngClass]=\"sortedColumn === 'primaryIssue' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'primaryIssue' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type !== 'mat' && type !== 'dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('secondaryIssue')\">Secondary Issues<svg\r\n [ngClass]=\"sortedColumn === 'secondaryIssue' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'secondaryIssue' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type!=='installation'\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of tableListArray\">\r\n <td>\r\n <input *ngIf=\"this.users.userType ==='tango'\" class=\"form-check-input cursor-pointer me-4 mt-3\" type=\"checkbox\" [(ngModel)]=\"obj.checked\"\r\n (change)=\"updateCheck($event,obj?.ticketId)\">\r\n <span *ngIf=\"type === 'dataMismatch' || type === 'mat' || type === 'infra'\"\r\n class=\"txt-light-primary cursor-pointer\" (click)=\"tickets(type,obj.clientId,obj.storeId,obj.clientName)\">\r\n {{obj.ticketId}}\r\n </span>\r\n <span *ngIf=\"type === 'installation'\">\r\n {{obj.ticketId}}\r\n </span>\r\n </td>\r\n <td *ngIf=\"type === 'dataMismatch'\">\r\n {{obj?.createdAt |\r\n date: 'dd MMM, yyyy'}}</td>\r\n <td *ngIf=\"type === 'dataMismatch'\">\r\n {{obj?.issueDate |\r\n date: 'dd MMM, yyyy'}}</td>\r\n <td *ngIf=\"type !== 'dataMismatch'\">\r\n {{obj?.createdAt |\r\n date: 'dd MMM, yyyy'}}\r\n </td>\r\n <td *ngIf=\"type === 'infra'\">\r\n {{obj?.createdAt |\r\n date: 'hh:mm a' | uppercase}}\r\n </td>\r\n <td *ngIf=\"type === 'infra'\">\r\n {{obj?.issueClosedDate?(obj?.issueClosedDate |\r\n date: 'hh:mm a' | uppercase):\"--\"}}\r\n </td>\r\n <td *ngIf=\"this.users.userType ==='tango'\">\r\n <div class=\"table-title cursor-pointer\" (click)=\"clientTickets(obj.clientId,obj.storeId,obj.clientName)\">\r\n <span class=\"txt-light-primary\">\r\n {{obj.clientName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"this.users.userType ==='tango'\">{{obj.clientId}}\r\n </td>\r\n <td>\r\n <div class=\"table-title cursor-pointer\" (click)=\"storeTickets(obj.clientId,obj.storeId,obj.clientName)\">\r\n <span class=\"txt-light-primary\">\r\n {{obj.storeName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td>{{obj.storeId}}\r\n </td>\r\n \r\n <td *ngIf=\"this.users.userType ==='tango'\">\r\n <div class=\"table-title cursor-pointer\" >\r\n <span >\r\n {{obj.userName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"type ==='dataMismatch' && obj.issueType ==='lowcount'\" >Low Count</td>\r\n <td *ngIf=\"type ==='dataMismatch' && obj.issueType ==='highcount'\">High Count</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.type ? obj?.type:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.reportedFootfall ? obj?.reportedFootfall:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.mappedCount ? obj?.mappedCount:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.successPercentage ? obj?.successPercentage:'--'}}</td>\r\n <td *ngIf=\"type==='installation'\">\r\n <span *ngIf=\"obj.installationStatus ==='paired' || obj.installationStatus ==='onboarded'\"\r\n class=\"badge badge-light-primary mx-4\">{{obj.installationStatus | titlecase}}</span>\r\n <span *ngIf=\"obj.installationStatus ==='live'\" class=\"badge badge-light-success mx-4\">Live</span>\r\n <span *ngIf=\"obj.installationStatus ==='installationfailed'\"\r\n class=\"badge badge-light-warning mx-4\">Installationfailed</span>\r\n <span *ngIf=\"obj.installationStatus ==='deployed'\"\r\n class=\"badge badge-light-success mx-4 text-capitalize\">deployed</span>\r\n </td>\r\n <td *ngIf=\"type==='infra' || type==='mat' || type==='dataMismatch'\">\r\n <span *ngIf=\"obj.status ==='open'\" class=\"badge badge-light-danger\">Open</span>\r\n <span *ngIf=\"obj.status ==='closed'\" class=\"badge badge-light-success\">Closed</span>\r\n <span *ngIf=\"obj.status ==='inprogress'\" class=\"badge badge-light-primary\">In\r\n Progress</span>\r\n </td>\r\n <td *ngIf=\"type==='installation' || type==='infra'\">\r\n <div>\r\n <span *ngIf=\"obj.primaryIssue !=='-'\">{{obj.primaryIssue ? obj.primaryIssue :'Issue not identified'}}</span>\r\n <span *ngIf=\"obj.primaryIssue ==='-'\">Issue not identified</span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"type==='installation' || type==='infra'\">\r\n <span *ngIf=\"obj.secondaryIssue\">{{obj.secondaryIssue}}</span>\r\n </td>\r\n <td *ngIf=\"type==='infra' || type ==='dataMismatch'\">\r\n <span class=\"mx-2 cursor-pointer\" *ngIf=\"this.users.userType ==='tango'\" (click)=\"commentModal(obj)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M17.6431 12.5C17.6431 12.942 17.4675 13.366 17.1549 13.6785C16.8423 13.9911 16.4184 14.1667 15.9764 14.1667H5.9764L2.64307 17.5V4.16667C2.64307 3.72464 2.81866 3.30072 3.13122 2.98816C3.44378 2.67559 3.86771 2.5 4.30973 2.5H15.9764C16.4184 2.5 16.8423 2.67559 17.1549 2.98816C17.4675 3.30072 17.6431 3.72464 17.6431 4.16667V12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"mx-2 cursor-pointer\" (click)=\"tickets(type,obj.clientId,obj.storeId,obj.clientName)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_10640_18061)\">\r\n <path\r\n d=\"M0.976562 10C0.976562 10 4.3099 3.33337 10.1432 3.33337C15.9766 3.33337 19.3099 10 19.3099 10C19.3099 10 15.9766 16.6667 10.1432 16.6667C4.3099 16.6667 0.976562 10 0.976562 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.1432 12.5C11.5239 12.5 12.6432 11.3808 12.6432 10C12.6432 8.61933 11.5239 7.50004 10.1432 7.50004C8.76252 7.50004 7.64323 8.61933 7.64323 10C7.64323 11.3808 8.76252 12.5 10.1432 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_10640_18061\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.143066)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </td>\r\n <td *ngIf=\"type === 'mat'\">\r\n <span class=\"mx-2 cursor-pointer\" (click)=\"routeToMat(obj.storeId,obj.clientId,obj.clientName)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_10640_18061)\">\r\n <path\r\n d=\"M0.976562 10C0.976562 10 4.3099 3.33337 10.1432 3.33337C15.9766 3.33337 19.3099 10 19.3099 10C19.3099 10 15.9766 16.6667 10.1432 16.6667C4.3099 16.6667 0.976562 10 0.976562 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.1432 12.5C11.5239 12.5 12.6432 11.3808 12.6432 10C12.6432 8.61933 11.5239 7.50004 10.1432 7.50004C8.76252 7.50004 7.64323 8.61933 7.64323 10C7.64323 11.3808 8.76252 12.5 10.1432 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_10640_18061\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.143066)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span> \r\n \r\n </td>\r\n \r\n \r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"pageSize\" [currentPage]=\"currentPage\" [totalItems]=\"totalItems\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n </div>\r\n</div>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.text-border{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;color:var(--Gray-700, #344054);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important}.text-border-priamry{border-radius:16px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-700, #009BF3);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}.text-sub{color:var(--Gray-500, #667085)!important;font-family:Inter;font-size:14px!important;font-weight:400!important;line-height:20px}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}td{vertical-align:middle;line-height:35px!important}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}.txt-light-primary{color:#009bf3!important}input[type=checkbox]{width:16px!important;height:16px!important;margin:0 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.img-src{width:25%;height:20%}.rotate{rotate:180deg;transition:1s}.viewbutton{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);box-shadow:0 1px 2px #1018280d;padding:10px 16px;justify-content:center;align-items:center;gap:10px;color:var(--Gray-700, #344054);font-family:Inter;font-size:12px;font-weight:600}.horizontal-scroll{overflow-x:auto;overflow-y:hidden;white-space:nowrap}\n"] }]
1042
- }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i2$1.Router }, { type: i2$1.ActivatedRoute }, { type: i2.GlobalStateService }, { type: i1$1.NgbModal }, { type: TicketService }, { type: ExcelService }] });
1132
+ args: [{ selector: "lib-tickets", template: "<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 *ngIf=\"type !=='dataMismatch' && type !== 'mat'\" class=\"card-label mb-2\">{{type | titlecase}}</span>\r\n <span *ngIf=\"type ==='dataMismatch'\" class=\"card-label mb-2\">Data Mismatch</span>\r\n <span *ngIf=\"type ==='mat'\" class=\"card-label mb-2\">Employee Mat</span>\r\n\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div *ngIf=\"!assignTicket\" 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\" placeholder=\"Search\" autocomplete=\"off\"\r\n (change)=\"searchData()\" [(ngModel)]=\"searchValue\" />\r\n <lib-filters *ngIf=\"users.userType === 'tango' && userList?.length || users.userType === 'client' && storeList?.length\" [dataObject]=\"dataObject\"\r\n (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button type=\"button\" *ngIf=\"!noData&&!loading\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Export</span>\r\n </button>\r\n </div>\r\n </div>\r\n <div *ngIf=\"assignTicket\" class=\"d-flex\">\r\n <button type=\"button\" (click)=\"addAssignTicket()\"\r\n class=\"btn mx-2 btn-primary rounded-3 text-nowrap border-val\">\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=\"M9.99984 4.1665V15.8332M4.1665 9.99984H15.8332\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2 text-white\">Assign Ticket</span>\r\n </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"card-body\">\r\n\r\n\r\n <ul *ngIf=\"!loading && listArray?.length && type !== 'mat' && type !== 'dataMismatch'\" class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" *ngFor=\"let obj of listArray.slice().reverse()\" (click)=\"selectedTabs(obj)\">\r\n <a [ngClass]=\"{'active': selectedTab === obj.name}\" class=\"nav-link cursor-pointer no-border me-2\">\r\n {{obj.name | titlecase}} <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === obj.name ? 'text-border-priamry' : 'text-border'\">{{obj.count}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <ul *ngIf=\"!loading && listArray?.length && type === 'dataMismatch'\" class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" *ngFor=\"let obj of listArray.slice().reverse()\" (click)=\"selectedTabs(obj)\">\r\n <a [ngClass]=\"selectedTab === transformName(obj.name) ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n {{obj.name | titlecase}} <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === transformName(obj.name) ? 'text-border-priamry' : 'text-border'\">{{obj.count}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"table-responsive mt-5\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" >\r\n \r\n <input *ngIf=\"this.users.userType ==='tango'\"\r\n class=\"form-check-input cursor-pointer me-4\" type=\"checkbox\" [(ngModel)]=\"selectAll\"\r\n (click)=\"selectAllStore($event)\"> <span class=\"cursor-pointer\" (click)=\"onSort('ticketId')\"> Ticket ID <svg\r\n [ngClass]=\"sortedColumn === 'ticketId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'ticketId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span> \r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type !=='dataMismatch'\" (click)=\"onSort('issueDate')\"> Created Date\r\n <svg [ngClass]=\"sortedColumn === 'issueDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='infra'\" (click)=\"onSort('createdAt')\"> Created Time\r\n <svg [ngClass]=\"sortedColumn === 'createdAt' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'createdAt' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='infra'\" (click)=\"onSort('issueClosedDate')\"> Closed Time\r\n <svg [ngClass]=\"sortedColumn === 'issueClosedDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueClosedDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('createdAt')\"> Created Date\r\n <svg [ngClass]=\"sortedColumn === 'createdAt' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'createdAt' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" ><span (click)=\"onSort('issueDate')\">Issue Date\r\n <svg [ngClass]=\"sortedColumn === 'issueDate' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueDate' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"cursor-pointer\" (click)=\"onSort('clientName')\">Brand Name<svg\r\n [ngClass]=\"sortedColumn === 'clientName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'clientName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"cursor-pointer\" (click)=\"onSort('clientId')\">Brand ID<svg\r\n [ngClass]=\"sortedColumn === 'clientId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'clientId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name<svg\r\n [ngClass]=\"sortedColumn === 'storeName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'storeName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID<svg\r\n [ngClass]=\"sortedColumn === 'storeId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'storeId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"this.users.userType ==='tango' && (type ==='infra'||type ==='dataMismatch'||type ==='mat')\" (click)=\"onSort('userName')\">Resolved By<svg [ngClass]=\"sortedColumn === 'userName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'userName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" *ngIf=\"this.users.userType ==='tango' && type ==='installation'\" (click)=\"onSort('userName')\">Installed By<svg [ngClass]=\"sortedColumn === 'userName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'userName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('issueType')\">Issue Type\r\n <svg [ngClass]=\"sortedColumn === 'issueType' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'issueType' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('type')\">Query Type\r\n <svg [ngClass]=\"sortedColumn === 'type' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'type' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('reportedFootfall')\">Reported Footfall\r\n <svg [ngClass]=\"sortedColumn === 'reportedFootfall' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'reportedFootfall' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('mappedCount')\">Unique Images\r\n <svg [ngClass]=\"sortedColumn === 'mappedCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'mappedCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th *ngIf=\"type ==='dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('successPercentage')\">Success Percentage\r\n <svg [ngClass]=\"sortedColumn === 'successPercentage' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'successPercentage' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" *ngIf=\"type ==='installation'\" (click)=\"onSort('status')\">Deployed Status<svg\r\n [ngClass]=\"sortedColumn === 'status' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type ==='dataMismatch' ||type ==='mat'|| type ==='infra'\" class=\"cursor-pointer\" (click)=\"onSort('status')\">Status<svg\r\n [ngClass]=\"sortedColumn === 'status' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n<!-- added config and total downtime as per the prioduct team requirement -->\r\n <th>Configured Ticket Time\r\n </th> \r\n\r\n <th >Total Downtime\r\n </th>\r\n<!-- -->\r\n\r\n <th *ngIf=\"type !== 'mat' && type !== 'dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('primaryIssue')\">Primary Issues<svg\r\n [ngClass]=\"sortedColumn === 'primaryIssue' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'primaryIssue' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type !== 'mat' && type !== 'dataMismatch'\" class=\"cursor-pointer\" (click)=\"onSort('secondaryIssue')\">Secondary Issues<svg\r\n [ngClass]=\"sortedColumn === 'secondaryIssue' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'secondaryIssue' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th *ngIf=\"type!=='installation'\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let obj of tableListArray\">\r\n <td>\r\n <input *ngIf=\"this.users.userType ==='tango'\" class=\"form-check-input cursor-pointer me-4 mt-3\" type=\"checkbox\" [(ngModel)]=\"obj.checked\"\r\n (change)=\"updateCheck($event,obj?.ticketId)\">\r\n <span *ngIf=\"type === 'dataMismatch' || type === 'mat' || type === 'infra'\"\r\n class=\"txt-light-primary cursor-pointer\" (click)=\"tickets(type,obj.clientId,obj.storeId,obj.clientName)\">\r\n {{obj.ticketId}}\r\n </span>\r\n <span *ngIf=\"type === 'installation'\">\r\n {{obj.ticketId}}\r\n </span>\r\n </td>\r\n <td *ngIf=\"type === 'dataMismatch'\">\r\n {{obj?.createdAt |\r\n date: 'dd MMM, yyyy'}}</td>\r\n <td *ngIf=\"type === 'dataMismatch'\">\r\n {{obj?.issueDate |\r\n date: 'dd MMM, yyyy'}}</td>\r\n <td *ngIf=\"type !== 'dataMismatch'\">\r\n {{obj?.createdAt |\r\n date: 'dd MMM, yyyy'}}\r\n </td>\r\n <td *ngIf=\"type === 'infra'\">\r\n {{obj?.createdAt |\r\n date: 'hh:mm a' | uppercase}}\r\n </td>\r\n <td *ngIf=\"type === 'infra'\">\r\n {{obj?.issueClosedDate?(obj?.issueClosedDate |\r\n date: 'hh:mm a' | uppercase):\"--\"}}\r\n </td>\r\n <td *ngIf=\"this.users.userType ==='tango'\">\r\n <div class=\"table-title cursor-pointer\" (click)=\"clientTickets(obj.clientId,obj.storeId,obj.clientName)\">\r\n <span class=\"txt-light-primary\">\r\n {{obj.clientName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"this.users.userType ==='tango'\">{{obj.clientId}}\r\n </td>\r\n <td>\r\n <div class=\"table-title cursor-pointer\" (click)=\"storeTickets(obj.clientId,obj.storeId,obj.clientName)\">\r\n <span class=\"txt-light-primary\">\r\n {{obj.storeName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td>{{obj.storeId}}\r\n </td>\r\n \r\n <td *ngIf=\"this.users.userType ==='tango'\">\r\n <div class=\"table-title cursor-pointer\" >\r\n <span >\r\n {{obj.userName}}\r\n </span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"type ==='dataMismatch' && obj.issueType ==='lowcount'\" >Low Count</td>\r\n <td *ngIf=\"type ==='dataMismatch' && obj.issueType ==='highcount'\">High Count</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.type ? obj?.type:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.reportedFootfall ? obj?.reportedFootfall:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.mappedCount ? obj?.mappedCount:'--'}}</td>\r\n <td class=\"text-capitalize\" *ngIf=\"type ==='dataMismatch'\">{{obj?.successPercentage ? obj?.successPercentage:'--'}}</td>\r\n <td *ngIf=\"type==='installation'\">\r\n <span *ngIf=\"obj.installationStatus ==='paired' || obj.installationStatus ==='onboarded'\"\r\n class=\"badge badge-light-primary mx-4\">{{obj.installationStatus | titlecase}}</span>\r\n <span *ngIf=\"obj.installationStatus ==='live'\" class=\"badge badge-light-success mx-4\">Live</span>\r\n <span *ngIf=\"obj.installationStatus ==='installationfailed'\"\r\n class=\"badge badge-light-warning mx-4\">Installationfailed</span>\r\n <span *ngIf=\"obj.installationStatus ==='deployed'\"\r\n class=\"badge badge-light-success mx-4 text-capitalize\">deployed</span>\r\n </td>\r\n <td *ngIf=\"type==='infra' || type==='mat' || type==='dataMismatch'\">\r\n <span *ngIf=\"obj.status ==='open'\" class=\"badge badge-light-danger\">Open</span>\r\n <span *ngIf=\"obj.status ==='closed'\" class=\"badge badge-light-success\">Closed</span>\r\n <span *ngIf=\"obj.status ==='inprogress'\" class=\"badge badge-light-primary\">In\r\n Progress</span>\r\n </td>\r\n <td *ngIf=\"type==='infra'\">\r\n{{obj.configuredDownTime?obj.configuredDownTime*60:0 || 0 }} {{obj.configuredDownTime > 1? 'mins' : 'min'}} \r\n </td>\r\n <td *ngIf=\"type==='infra'\"> \r\n{{obj.totalDownTime || 0 }} {{obj.totalDownTime > 1? 'mins' : 'min'}} \r\n </td>\r\n <td *ngIf=\"type==='installation' || type==='infra'\">\r\n <div>\r\n <span *ngIf=\"obj.primaryIssue !=='-'\">{{obj.primaryIssue ? obj.primaryIssue :'Issue not identified'}}</span>\r\n <span *ngIf=\"obj.primaryIssue ==='-'\">Issue not identified</span>\r\n </div>\r\n </td>\r\n <td *ngIf=\"type==='installation' || type==='infra'\">\r\n <span *ngIf=\"obj.secondaryIssue\">{{obj.secondaryIssue}}</span>\r\n </td>\r\n <td *ngIf=\"type==='infra' || type ==='dataMismatch'\">\r\n <span class=\"mx-2 cursor-pointer\" *ngIf=\"this.users.userType ==='tango'\" (click)=\"commentModal(obj)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M17.6431 12.5C17.6431 12.942 17.4675 13.366 17.1549 13.6785C16.8423 13.9911 16.4184 14.1667 15.9764 14.1667H5.9764L2.64307 17.5V4.16667C2.64307 3.72464 2.81866 3.30072 3.13122 2.98816C3.44378 2.67559 3.86771 2.5 4.30973 2.5H15.9764C16.4184 2.5 16.8423 2.67559 17.1549 2.98816C17.4675 3.30072 17.6431 3.72464 17.6431 4.16667V12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"mx-2 cursor-pointer\" (click)=\"tickets(type,obj.clientId,obj.storeId,obj.clientName)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_10640_18061)\">\r\n <path\r\n d=\"M0.976562 10C0.976562 10 4.3099 3.33337 10.1432 3.33337C15.9766 3.33337 19.3099 10 19.3099 10C19.3099 10 15.9766 16.6667 10.1432 16.6667C4.3099 16.6667 0.976562 10 0.976562 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.1432 12.5C11.5239 12.5 12.6432 11.3808 12.6432 10C12.6432 8.61933 11.5239 7.50004 10.1432 7.50004C8.76252 7.50004 7.64323 8.61933 7.64323 10C7.64323 11.3808 8.76252 12.5 10.1432 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_10640_18061\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.143066)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n </td>\r\n <td *ngIf=\"type === 'mat'\">\r\n <span class=\"mx-2 cursor-pointer\" (click)=\"routeToMat(obj.storeId,obj.clientId,obj.clientName)\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_10640_18061)\">\r\n <path\r\n d=\"M0.976562 10C0.976562 10 4.3099 3.33337 10.1432 3.33337C15.9766 3.33337 19.3099 10 19.3099 10C19.3099 10 15.9766 16.6667 10.1432 16.6667C4.3099 16.6667 0.976562 10 0.976562 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.1432 12.5C11.5239 12.5 12.6432 11.3808 12.6432 10C12.6432 8.61933 11.5239 7.50004 10.1432 7.50004C8.76252 7.50004 7.64323 8.61933 7.64323 10C7.64323 11.3808 8.76252 12.5 10.1432 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_10640_18061\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.143066)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span> \r\n \r\n </td>\r\n \r\n \r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"pageSize\" [currentPage]=\"currentPage\" [totalItems]=\"totalItems\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"setpageSize()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n </div>\r\n</div>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.text-border{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;color:var(--Gray-700, #344054);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important}.text-border-priamry{border-radius:16px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-700, #009BF3);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}.text-sub{color:var(--Gray-500, #667085)!important;font-family:Inter;font-size:14px!important;font-weight:400!important;line-height:20px}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}td{vertical-align:middle;line-height:35px!important}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}.txt-light-primary{color:#009bf3!important}input[type=checkbox]{width:16px!important;height:16px!important;margin:0 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.img-src{width:25%;height:20%}.rotate{rotate:180deg;transition:1s}.viewbutton{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);box-shadow:0 1px 2px #1018280d;padding:10px 16px;justify-content:center;align-items:center;gap:10px;color:var(--Gray-700, #344054);font-family:Inter;font-size:12px;font-weight:600}.horizontal-scroll{overflow-x:auto;overflow-y:hidden;white-space:nowrap}\n"] }]
1133
+ }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i2.Router }, { type: i2.ActivatedRoute }, { type: i1$1.GlobalStateService }, { type: i1$2.NgbModal }, { type: TicketService }, { type: ExcelService }] });
1043
1134
 
1044
1135
  class ReTriggerComponent {
1045
1136
  activeModal;
@@ -1116,13 +1207,13 @@ class ReTriggerComponent {
1116
1207
  this.selectedData === 'To User' ? data.userId = this.userId.userId : '';
1117
1208
  this.activeModal.close(data);
1118
1209
  }
1119
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ReTriggerComponent, deps: [{ token: i1$1.NgbActiveModal }, { token: TicketService }], target: i0.ɵɵFactoryTarget.Component });
1120
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ReTriggerComponent, selector: "lib-retrigger", inputs: { reTrigerData: "reTrigerData" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"card\">\r\n \r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title d-grid\">\r\n <div class=\"card-title\">Re-trigger File</div>\r\n <div class=\"text-sub\">Re-trigger the file to a queue or other users</div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"\">\r\n <label class=\"label\">Push Form</label>\r\n <div class=\"position-relative w-100 mt-3 mb-5\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\">\r\n {{selectedItem}}\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-100 position-absolute top-50px end-0\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"selectedItem === item ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n (click)=\"selectItem(item)\">{{item}}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-5 cursor-pointer d-flex mb-5\">\r\n <div *ngFor=\"let data of standardData\" (click)=\"selectRadio(data)\" class=\"d-flex align-items-center me-20\">\r\n <input [checked]=\"selectedData === data\" type=\"radio\" class=\"radio\">\r\n <span class=\"ms-3 standard\">{{data}}</span>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedData === 'To User'\" class=\"w-100 mb-5\">\r\n <label for=\"infraDownTime\" class=\"label mb-3\">Select User<span class=\"alert-required\"></span></label>\r\n <lib-select [items]=\"userList\" [multi]=\"false\" [searchField]=\"'userName'\" [idField]=\"'userId'\"\r\n (selected)=\"onReportSelect($event)\" [selectedValues]=\"[userId]\"></lib-select>\r\n </div>\r\n <div>\r\n <label class=\"label mb-3\">Comments</label>\r\n <textarea class=\"form-control\" [(ngModel)]=\"Comment\"></textarea>\r\n </div>\r\n <div class=\"d-flex mt-5\">\r\n <button class=\"btn btn-outline w-100 me-2\" (click)=\"activeModal.dismiss()\">Cancel</button>\r\n <button *ngIf=\"selectedData === 'To User'\" class=\"btn btn-primary w-100 ms-2\" [disabled]=\"!userId || !Comment\" (click)=\"closeModal()\">Submit</button>\r\n <button *ngIf=\"selectedData === 'To Queue'\" class=\"btn btn-primary w-100 ms-2\" [disabled]=\"!Comment\" (click)=\"closeModal()\">Submit</button>\r\n </div>\r\n </div>\r\n</div>", styles: [".label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.standard{color:var(--Gray-700, #344054);font-size:16px;font-weight:500;line-height:24px}.radio{width:16px!important;height:16px!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: i7.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: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }] });
1210
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ReTriggerComponent, deps: [{ token: i1$2.NgbActiveModal }, { token: TicketService }], target: i0.ɵɵFactoryTarget.Component });
1211
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ReTriggerComponent, selector: "lib-retrigger", inputs: { reTrigerData: "reTrigerData" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"card\">\r\n \r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title d-grid\">\r\n <div class=\"card-title\">Re-trigger File</div>\r\n <div class=\"text-sub\">Re-trigger the file to a queue or other users</div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"\">\r\n <label class=\"label\">Push Form</label>\r\n <div class=\"position-relative w-100 mt-3 mb-5\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\">\r\n {{selectedItem}}\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-100 position-absolute top-50px end-0\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"selectedItem === item ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n (click)=\"selectItem(item)\">{{item}}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-5 cursor-pointer d-flex mb-5\">\r\n <div *ngFor=\"let data of standardData\" (click)=\"selectRadio(data)\" class=\"d-flex align-items-center me-20\">\r\n <input [checked]=\"selectedData === data\" type=\"radio\" class=\"radio\">\r\n <span class=\"ms-3 standard\">{{data}}</span>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedData === 'To User'\" class=\"w-100 mb-5\">\r\n <label for=\"infraDownTime\" class=\"label mb-3\">Select User<span class=\"alert-required\"></span></label>\r\n <lib-select [items]=\"userList\" [multi]=\"false\" [searchField]=\"'userName'\" [idField]=\"'userId'\"\r\n (selected)=\"onReportSelect($event)\" [selectedValues]=\"[userId]\"></lib-select>\r\n </div>\r\n <div>\r\n <label class=\"label mb-3\">Comments</label>\r\n <textarea class=\"form-control\" [(ngModel)]=\"Comment\"></textarea>\r\n </div>\r\n <div class=\"d-flex mt-5\">\r\n <button class=\"btn btn-outline w-100 me-2\" (click)=\"activeModal.dismiss()\">Cancel</button>\r\n <button *ngIf=\"selectedData === 'To User'\" class=\"btn btn-primary w-100 ms-2\" [disabled]=\"!userId || !Comment\" (click)=\"closeModal()\">Submit</button>\r\n <button *ngIf=\"selectedData === 'To Queue'\" class=\"btn btn-primary w-100 ms-2\" [disabled]=\"!Comment\" (click)=\"closeModal()\">Submit</button>\r\n </div>\r\n </div>\r\n</div>", styles: [".label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.standard{color:var(--Gray-700, #344054);font-size:16px;font-weight:500;line-height:24px}.radio{width:16px!important;height:16px!important}\n"], dependencies: [{ kind: "directive", type: i6$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }] });
1121
1212
  }
1122
1213
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ReTriggerComponent, decorators: [{
1123
1214
  type: Component,
1124
1215
  args: [{ selector: 'lib-retrigger', template: "<div class=\"card\">\r\n \r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title d-grid\">\r\n <div class=\"card-title\">Re-trigger File</div>\r\n <div class=\"text-sub\">Re-trigger the file to a queue or other users</div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"\">\r\n <label class=\"label\">Push Form</label>\r\n <div class=\"position-relative w-100 mt-3 mb-5\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\">\r\n {{selectedItem}}\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"dropDown\" class=\"card py-1 w-100 position-absolute top-50px end-0\">\r\n <ul *ngFor=\"let item of dropdownItems\" class=\"list-unstyled\">\r\n <li [ngClass]=\"selectedItem === item ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n (click)=\"selectItem(item)\">{{item}}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-5 cursor-pointer d-flex mb-5\">\r\n <div *ngFor=\"let data of standardData\" (click)=\"selectRadio(data)\" class=\"d-flex align-items-center me-20\">\r\n <input [checked]=\"selectedData === data\" type=\"radio\" class=\"radio\">\r\n <span class=\"ms-3 standard\">{{data}}</span>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedData === 'To User'\" class=\"w-100 mb-5\">\r\n <label for=\"infraDownTime\" class=\"label mb-3\">Select User<span class=\"alert-required\"></span></label>\r\n <lib-select [items]=\"userList\" [multi]=\"false\" [searchField]=\"'userName'\" [idField]=\"'userId'\"\r\n (selected)=\"onReportSelect($event)\" [selectedValues]=\"[userId]\"></lib-select>\r\n </div>\r\n <div>\r\n <label class=\"label mb-3\">Comments</label>\r\n <textarea class=\"form-control\" [(ngModel)]=\"Comment\"></textarea>\r\n </div>\r\n <div class=\"d-flex mt-5\">\r\n <button class=\"btn btn-outline w-100 me-2\" (click)=\"activeModal.dismiss()\">Cancel</button>\r\n <button *ngIf=\"selectedData === 'To User'\" class=\"btn btn-primary w-100 ms-2\" [disabled]=\"!userId || !Comment\" (click)=\"closeModal()\">Submit</button>\r\n <button *ngIf=\"selectedData === 'To Queue'\" class=\"btn btn-primary w-100 ms-2\" [disabled]=\"!Comment\" (click)=\"closeModal()\">Submit</button>\r\n </div>\r\n </div>\r\n</div>", styles: [".label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.standard{color:var(--Gray-700, #344054);font-size:16px;font-weight:500;line-height:24px}.radio{width:16px!important;height:16px!important}\n"] }]
1125
- }], ctorParameters: () => [{ type: i1$1.NgbActiveModal }, { type: TicketService }], propDecorators: { reTrigerData: [{
1216
+ }], ctorParameters: () => [{ type: i1$2.NgbActiveModal }, { type: TicketService }], propDecorators: { reTrigerData: [{
1126
1217
  type: Input
1127
1218
  }], onClick: [{
1128
1219
  type: HostListener,
@@ -1202,7 +1293,7 @@ class CountComponent {
1202
1293
  });
1203
1294
  }
1204
1295
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CountComponent, deps: [{ token: TicketService }, { token: i4.ToastService }, { token: ExcelService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1205
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CountComponent, selector: "lib-count", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"card\">\r\n <div class=\"card-header\">\r\n <div class=\"card-title d-grid\">\r\n <div *ngIf=\"data?.type\" class=\"card-label\">{{data?.type | titlecase}} Count - {{data?.storeId}}</div>\r\n <div class=\"text-sub\">{{data?.fileDate | customDateFormat}}</div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <button *ngIf=\"!noData\" type=\"button\" (click)=\"exportTable()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"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>\r\n <span class=\"ms-2\">Export</span> </button>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"row mx-3\">\r\n <div class=\"col-md-12 item scroll-y\">\r\n <div class=\"item\" *ngFor=\"let images of auditImages;let i=index\" style=\"padding: 10px;\">\r\n <img class=\"mx-3 my-3 img\" [src]=\"images?.imgPath\">\r\n <div class=\"text-center m-0 fs-7 fw-bold\">{{images?.imgName}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\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 </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\r\n", styles: [".img{width:95px;height:200px}.item{position:relative;padding-top:20px;display:inline-block;max-height:595px}.scroll-y{overflow-y:auto!important;position:relative!important}\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: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i4.CustomDateFormatPipe, name: "customDateFormat" }] });
1296
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CountComponent, selector: "lib-count", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"card\">\r\n <div class=\"card-header\">\r\n <div class=\"card-title d-grid\">\r\n <div *ngIf=\"data?.type\" class=\"card-label\">{{data?.type | titlecase}} Count - {{data?.storeId}}</div>\r\n <div class=\"text-sub\">{{data?.fileDate | customDateFormat}}</div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <button *ngIf=\"!noData\" type=\"button\" (click)=\"exportTable()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"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>\r\n <span class=\"ms-2\">Export</span> </button>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div class=\"row mx-3\">\r\n <div class=\"col-md-12 item scroll-y\">\r\n <div class=\"item\" *ngFor=\"let images of auditImages;let i=index\" style=\"padding: 10px;\">\r\n <img class=\"mx-3 my-3 img\" [src]=\"images?.imgPath\">\r\n <div class=\"text-center m-0 fs-7 fw-bold\">{{images?.imgName}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\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 </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\r\n", styles: [".img{width:95px;height:200px}.item{position:relative;padding-top:20px;display:inline-block;max-height:595px}.scroll-y{overflow-y:auto!important;position:relative!important}\n"], dependencies: [{ kind: "directive", type: i6$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i6$1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i4.CustomDateFormatPipe, name: "customDateFormat" }] });
1206
1297
  }
1207
1298
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CountComponent, decorators: [{
1208
1299
  type: Component,
@@ -1484,17 +1575,1110 @@ class AuditMetricsComponent {
1484
1575
  this.sortBy *= -1;
1485
1576
  this.metricsList();
1486
1577
  }
1487
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuditMetricsComponent, deps: [{ token: i2.GlobalStateService }, { token: i1$1.NgbModal }, { token: TicketService }, { token: i4.ToastService }, { token: ExcelService }], target: i0.ɵɵFactoryTarget.Component });
1488
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: AuditMetricsComponent, selector: "lib-audit-metrics", viewQueries: [{ propertyName: "activitylog", first: true, predicate: ["activitylog"], descendants: true }], ngImport: i0, template: "<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\">Audit Metrics</span>\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" class=\"form-control ps-14 me-2\" placeholder=\"Search\" autocomplete=\"off\"\r\n (change)=\"searchData()\" [(ngModel)]=\"searchTerm\" />\r\n \r\n <lib-filters *ngIf=\"clientList\" [dataObject]=\"dataObject\" (appliedFilters)=\"receiveData($event)\"></lib-filters>\r\n\r\n <button type=\"button\" *ngIf=\"!noData&&!loading\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Export</span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" (click)=\"selectedTabs('all')\">\r\n <a [ngClass]=\"selectedTab === '' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n All <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === '' ? 'text-border-priamry' : 'text-border'\">{{totalCount?.totalauditCount ? totalCount?.totalauditCount : 0}}</span>\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" (click)=\"selectedTabs('Audit')\">\r\n <a [ngClass]=\"selectedTab === 'Audit' ? 'active' :''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n Audit <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === 'Audit' ? 'text-border-priamry' : 'text-border'\">{{totalCount?.auditCount ? totalCount?.auditCount : 0}}</span>\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" (click)=\"selectedTabs('ReAudit')\">\r\n <a [ngClass]=\"selectedTab === 'ReAudit' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n Re Audit <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === 'ReAudit' ? 'text-border-priamry' : 'text-border'\">{{totalCount?.reauditCount ? totalCount?.reauditCount : 0}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <div *ngIf=\"!loading && !noData\" class=\"mt-5\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th>File Date</th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('storeName')\">\r\n Store Name\r\n <span\r\n *ngIf=\"sortColumName === 'storeName' && sortBy !== 1 || sortColumName !== 'storeName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('storeId')\">\r\n Store Id\r\n <span\r\n *ngIf=\"sortColumName === 'storeId' && sortBy !== 1 || sortColumName !== 'storeId'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'storeId' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('userName')\">\r\n User Name\r\n <span\r\n *ngIf=\"sortColumName === 'userName' && sortBy !== 1 || sortColumName !== 'userName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'userName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('userEmail')\">\r\n User Email\r\n <span\r\n *ngIf=\"sortColumName === 'userEmail' && sortBy !== 1 || sortColumName !== 'userEmail'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'userEmail' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th>BC</th>\r\n <th>AC</th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('accuracy')\">\r\n Accuracy\r\n <span\r\n *ngIf=\"sortColumName === 'accuracy' && sortBy !== 1 || sortColumName !== 'accuracy'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'accuracy' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('timeSpent')\">\r\n TimeSpent\r\n <span\r\n *ngIf=\"sortColumName === 'timeSpent' && sortBy !== 1 || sortColumName !== 'timeSpent'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'timeSpent' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th>Audit Type</th>\r\n <th>Status</th>\r\n <th><span>Actions</span></th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of storesData\">\r\n <td>\r\n <div>{{ item?.fileDate ? item?.fileDate :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div>{{ item?.storeName ? item?.storeName :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div>{{item?.storeId ? item?.storeId : 'NA'}}</div>\r\n </td>\r\n <td>\r\n <div>{{ item?.userName ? item?.userName :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div>{{ item?.userEmail ? item?.userEmail :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <div [ngClass]=\"item?.beforeCount ? 'text-decoration-underline':''\" class=\"text-title text-primary cursor-pointer mb-1\" (click)=\"openBeforecount(item)\">\r\n {{ item?.beforeCount ?? '--' }}</div>\r\n </div>\r\n </td>\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <div [ngClass]=\"item?.afterCount ? 'text-decoration-underline':''\" class=\"text-title text-primary cursor-pointer mb-1\" (click)=\"openAftercount(item)\">\r\n {{ item?.afterCount ?? '--' }}</div>\r\n </div>\r\n </td>\r\n <td>\r\n <div>{{ item?.accuracy ?? '--' }}</div>\r\n </td>\r\n <td>{{ item?.timeSpent ? item?.timeSpent :'NA'}}</td>\r\n <td><span *ngIf=\"item?.auditType\" [ngClass]=\"item?.auditType === 'Audit' ? 'badge-light-success':'badge-light-warning'\" class=\"badge\">{{ item?.auditType }}</span></td>\r\n <td><span *ngIf=\"item?.status\" [ngClass]=\"statusBadge(item?.status)\" class=\"badge\">{{ item?.status | titlecase}}</span></td>\r\n <td><button class=\"btn btn-default btn-outline\" (click)=\"openView()\">View-Log</button>\r\n <button class=\"btn btn-default btn-outline ms-3\" [disabled]=\"item?.status === 'not_assign' || item?.status === 'assigned'\" (click)=\"openreTrigger(item)\">Re-Trigger</button></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\" [totalItems]=\"totalCount\"\r\n [paginationSizes]=\"pagination\" [pageSize]=\"setItemsperPage()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div> \r\n\r\n </div>\r\n</div>\r\n\r\n<ng-template #activitylog let-modal>\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <div class=\"card-title\">\r\n <span class=\"card-label\">Activity Log</span>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"cursor-pointer\" (click)=\"modal.dismiss()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15 5L5 15M5 5L15 15\" stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div> \r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div *ngFor=\"let log of activity\" class=\"d-flex mb-5 ms-5\">\r\n <div\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 class=\"symbol symbol-35px symbol-circle\">\r\n <span [ngClass]=\"log?.type === 'Audit' ? 'badge-light-success' : 'badge-light-primary'\" class=\"symbol-label badge-light-primary text-symbol\">\r\n <span [ngClass]=\"log?.type === 'Audit' ? 'text-success badge badge-light-success' : 'text-primary badge badge-light-primary'\" class=\"fs-4 fw-normal\">\r\n {{log?.type?.slice(0,1) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"p-0 h-100 mt-1 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n <div class=\"py-3 pt-0\">\r\n <div class=\"activity-title fw-semibold mt-2 d-flex mb-4\">\r\n <span>{{log?.type}} </span><span class=\"ms-5 list\"><li>Fasila</li></span>\r\n </div>\r\n <div class=\"date-time mb-4\">\r\n {{log?.FileDate}} | {{log?.Time}}\r\n </div>\r\n <div class=\"\"><span class=\"badge badge-light-default fw-semibold\">Before Count : {{log?.beforeCout}}</span>\r\n <span class=\"badge badge-light-default fw-semibold ms-3\">After Count : {{log?.AfterCount}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-template>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.text-border{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;color:var(--Gray-700, #344054);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important}.text-border-priamry{border-radius:16px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-700, #009BF3);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}tr{vertical-align:middle!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: i7.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: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "pipe", type: i6.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
1578
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuditMetricsComponent, deps: [{ token: i1$1.GlobalStateService }, { token: i1$2.NgbModal }, { token: TicketService }, { token: i4.ToastService }, { token: ExcelService }], target: i0.ɵɵFactoryTarget.Component });
1579
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: AuditMetricsComponent, selector: "lib-audit-metrics", viewQueries: [{ propertyName: "activitylog", first: true, predicate: ["activitylog"], descendants: true }], ngImport: i0, template: "<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\">Audit Metrics</span>\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" class=\"form-control ps-14 me-2\" placeholder=\"Search\" autocomplete=\"off\"\r\n (change)=\"searchData()\" [(ngModel)]=\"searchTerm\" />\r\n \r\n <lib-filters *ngIf=\"clientList\" [dataObject]=\"dataObject\" (appliedFilters)=\"receiveData($event)\"></lib-filters>\r\n\r\n <button type=\"button\" *ngIf=\"!noData&&!loading\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Export</span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" (click)=\"selectedTabs('all')\">\r\n <a [ngClass]=\"selectedTab === '' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n All <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === '' ? 'text-border-priamry' : 'text-border'\">{{totalCount?.totalauditCount ? totalCount?.totalauditCount : 0}}</span>\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" (click)=\"selectedTabs('Audit')\">\r\n <a [ngClass]=\"selectedTab === 'Audit' ? 'active' :''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n Audit <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === 'Audit' ? 'text-border-priamry' : 'text-border'\">{{totalCount?.auditCount ? totalCount?.auditCount : 0}}</span>\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" (click)=\"selectedTabs('ReAudit')\">\r\n <a [ngClass]=\"selectedTab === 'ReAudit' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n Re Audit <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === 'ReAudit' ? 'text-border-priamry' : 'text-border'\">{{totalCount?.reauditCount ? totalCount?.reauditCount : 0}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <div *ngIf=\"!loading && !noData\" class=\"mt-5\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th>File Date</th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('storeName')\">\r\n Store Name\r\n <span\r\n *ngIf=\"sortColumName === 'storeName' && sortBy !== 1 || sortColumName !== 'storeName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('storeId')\">\r\n Store Id\r\n <span\r\n *ngIf=\"sortColumName === 'storeId' && sortBy !== 1 || sortColumName !== 'storeId'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'storeId' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('userName')\">\r\n User Name\r\n <span\r\n *ngIf=\"sortColumName === 'userName' && sortBy !== 1 || sortColumName !== 'userName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'userName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('userEmail')\">\r\n User Email\r\n <span\r\n *ngIf=\"sortColumName === 'userEmail' && sortBy !== 1 || sortColumName !== 'userEmail'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'userEmail' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th>BC</th>\r\n <th>AC</th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('accuracy')\">\r\n Accuracy\r\n <span\r\n *ngIf=\"sortColumName === 'accuracy' && sortBy !== 1 || sortColumName !== 'accuracy'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'accuracy' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('timeSpent')\">\r\n TimeSpent\r\n <span\r\n *ngIf=\"sortColumName === 'timeSpent' && sortBy !== 1 || sortColumName !== 'timeSpent'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'timeSpent' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th>Audit Type</th>\r\n <th>Status</th>\r\n <th><span>Actions</span></th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of storesData\">\r\n <td>\r\n <div>{{ item?.fileDate ? item?.fileDate :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div>{{ item?.storeName ? item?.storeName :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div>{{item?.storeId ? item?.storeId : 'NA'}}</div>\r\n </td>\r\n <td>\r\n <div>{{ item?.userName ? item?.userName :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div>{{ item?.userEmail ? item?.userEmail :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <div [ngClass]=\"item?.beforeCount ? 'text-decoration-underline':''\" class=\"text-title text-primary cursor-pointer mb-1\" (click)=\"openBeforecount(item)\">\r\n {{ item?.beforeCount ?? '--' }}</div>\r\n </div>\r\n </td>\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <div [ngClass]=\"item?.afterCount ? 'text-decoration-underline':''\" class=\"text-title text-primary cursor-pointer mb-1\" (click)=\"openAftercount(item)\">\r\n {{ item?.afterCount ?? '--' }}</div>\r\n </div>\r\n </td>\r\n <td>\r\n <div>{{ item?.accuracy ?? '--' }}</div>\r\n </td>\r\n <td>{{ item?.timeSpent ? item?.timeSpent :'NA'}}</td>\r\n <td><span *ngIf=\"item?.auditType\" [ngClass]=\"item?.auditType === 'Audit' ? 'badge-light-success':'badge-light-warning'\" class=\"badge\">{{ item?.auditType }}</span></td>\r\n <td><span *ngIf=\"item?.status\" [ngClass]=\"statusBadge(item?.status)\" class=\"badge\">{{ item?.status | titlecase}}</span></td>\r\n <td><button class=\"btn btn-default btn-outline\" (click)=\"openView()\">View-Log</button>\r\n <button class=\"btn btn-default btn-outline ms-3\" [disabled]=\"item?.status === 'not_assign' || item?.status === 'assigned'\" (click)=\"openreTrigger(item)\">Re-Trigger</button></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\" [totalItems]=\"totalCount\"\r\n [paginationSizes]=\"pagination\" [pageSize]=\"setItemsperPage()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div> \r\n\r\n </div>\r\n</div>\r\n\r\n<ng-template #activitylog let-modal>\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <div class=\"card-title\">\r\n <span class=\"card-label\">Activity Log</span>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"cursor-pointer\" (click)=\"modal.dismiss()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15 5L5 15M5 5L15 15\" stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div> \r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div *ngFor=\"let log of activity\" class=\"d-flex mb-5 ms-5\">\r\n <div\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 class=\"symbol symbol-35px symbol-circle\">\r\n <span [ngClass]=\"log?.type === 'Audit' ? 'badge-light-success' : 'badge-light-primary'\" class=\"symbol-label badge-light-primary text-symbol\">\r\n <span [ngClass]=\"log?.type === 'Audit' ? 'text-success badge badge-light-success' : 'text-primary badge badge-light-primary'\" class=\"fs-4 fw-normal\">\r\n {{log?.type?.slice(0,1) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"p-0 h-100 mt-1 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n <div class=\"py-3 pt-0\">\r\n <div class=\"activity-title fw-semibold mt-2 d-flex mb-4\">\r\n <span>{{log?.type}} </span><span class=\"ms-5 list\"><li>Fasila</li></span>\r\n </div>\r\n <div class=\"date-time mb-4\">\r\n {{log?.FileDate}} | {{log?.Time}}\r\n </div>\r\n <div class=\"\"><span class=\"badge badge-light-default fw-semibold\">Before Count : {{log?.beforeCout}}</span>\r\n <span class=\"badge badge-light-default fw-semibold ms-3\">After Count : {{log?.AfterCount}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-template>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.text-border{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;color:var(--Gray-700, #344054);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important}.text-border-priamry{border-radius:16px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-700, #009BF3);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}tr{vertical-align:middle!important}\n"], dependencies: [{ kind: "directive", type: i6$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "pipe", type: i6$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i6$1.TitleCasePipe, name: "titlecase" }] });
1489
1580
  }
1490
1581
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuditMetricsComponent, decorators: [{
1491
1582
  type: Component,
1492
1583
  args: [{ selector: 'lib-audit-metrics', template: "<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\">Audit Metrics</span>\r\n <!-- <span class=\"text-sub mb-2\">Last updated 1 hour ago</span> -->\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" class=\"form-control ps-14 me-2\" placeholder=\"Search\" autocomplete=\"off\"\r\n (change)=\"searchData()\" [(ngModel)]=\"searchTerm\" />\r\n \r\n <lib-filters *ngIf=\"clientList\" [dataObject]=\"dataObject\" (appliedFilters)=\"receiveData($event)\"></lib-filters>\r\n\r\n <button type=\"button\" *ngIf=\"!noData&&!loading\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Export</span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap horizontal-scroll\">\r\n <li class=\"nav-item\" (click)=\"selectedTabs('all')\">\r\n <a [ngClass]=\"selectedTab === '' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n All <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === '' ? 'text-border-priamry' : 'text-border'\">{{totalCount?.totalauditCount ? totalCount?.totalauditCount : 0}}</span>\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" (click)=\"selectedTabs('Audit')\">\r\n <a [ngClass]=\"selectedTab === 'Audit' ? 'active' :''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n Audit <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === 'Audit' ? 'text-border-priamry' : 'text-border'\">{{totalCount?.auditCount ? totalCount?.auditCount : 0}}</span>\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" (click)=\"selectedTabs('ReAudit')\">\r\n <a [ngClass]=\"selectedTab === 'ReAudit' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-2\">\r\n Re Audit <span class=\"mx-2\"\r\n [ngClass]=\"selectedTab === 'ReAudit' ? 'text-border-priamry' : 'text-border'\">{{totalCount?.reauditCount ? totalCount?.reauditCount : 0}}</span>\r\n </a>\r\n </li>\r\n </ul>\r\n <div *ngIf=\"!loading && !noData\" class=\"mt-5\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th>File Date</th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('storeName')\">\r\n Store Name\r\n <span\r\n *ngIf=\"sortColumName === 'storeName' && sortBy !== 1 || sortColumName !== 'storeName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('storeId')\">\r\n Store Id\r\n <span\r\n *ngIf=\"sortColumName === 'storeId' && sortBy !== 1 || sortColumName !== 'storeId'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'storeId' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('userName')\">\r\n User Name\r\n <span\r\n *ngIf=\"sortColumName === 'userName' && sortBy !== 1 || sortColumName !== 'userName'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'userName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('userEmail')\">\r\n User Email\r\n <span\r\n *ngIf=\"sortColumName === 'userEmail' && sortBy !== 1 || sortColumName !== 'userEmail'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'userEmail' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th>BC</th>\r\n <th>AC</th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('accuracy')\">\r\n Accuracy\r\n <span\r\n *ngIf=\"sortColumName === 'accuracy' && sortBy !== 1 || sortColumName !== 'accuracy'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'accuracy' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('timeSpent')\">\r\n TimeSpent\r\n <span\r\n *ngIf=\"sortColumName === 'timeSpent' && sortBy !== 1 || sortColumName !== 'timeSpent'\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span\r\n *ngIf=\"sortColumName === 'timeSpent' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n 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\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n \r\n </div></th>\r\n <th>Audit Type</th>\r\n <th>Status</th>\r\n <th><span>Actions</span></th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of storesData\">\r\n <td>\r\n <div>{{ item?.fileDate ? item?.fileDate :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div>{{ item?.storeName ? item?.storeName :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div>{{item?.storeId ? item?.storeId : 'NA'}}</div>\r\n </td>\r\n <td>\r\n <div>{{ item?.userName ? item?.userName :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div>{{ item?.userEmail ? item?.userEmail :'NA' }}</div>\r\n </td>\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <div [ngClass]=\"item?.beforeCount ? 'text-decoration-underline':''\" class=\"text-title text-primary cursor-pointer mb-1\" (click)=\"openBeforecount(item)\">\r\n {{ item?.beforeCount ?? '--' }}</div>\r\n </div>\r\n </td>\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <div [ngClass]=\"item?.afterCount ? 'text-decoration-underline':''\" class=\"text-title text-primary cursor-pointer mb-1\" (click)=\"openAftercount(item)\">\r\n {{ item?.afterCount ?? '--' }}</div>\r\n </div>\r\n </td>\r\n <td>\r\n <div>{{ item?.accuracy ?? '--' }}</div>\r\n </td>\r\n <td>{{ item?.timeSpent ? item?.timeSpent :'NA'}}</td>\r\n <td><span *ngIf=\"item?.auditType\" [ngClass]=\"item?.auditType === 'Audit' ? 'badge-light-success':'badge-light-warning'\" class=\"badge\">{{ item?.auditType }}</span></td>\r\n <td><span *ngIf=\"item?.status\" [ngClass]=\"statusBadge(item?.status)\" class=\"badge\">{{ item?.status | titlecase}}</span></td>\r\n <td><button class=\"btn btn-default btn-outline\" (click)=\"openView()\">View-Log</button>\r\n <button class=\"btn btn-default btn-outline ms-3\" [disabled]=\"item?.status === 'not_assign' || item?.status === 'assigned'\" (click)=\"openreTrigger(item)\">Re-Trigger</button></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\" [totalItems]=\"totalCount\"\r\n [paginationSizes]=\"pagination\" [pageSize]=\"setItemsperPage()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src w-25\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div> \r\n\r\n </div>\r\n</div>\r\n\r\n<ng-template #activitylog let-modal>\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n <div class=\"card-title\">\r\n <span class=\"card-label\">Activity Log</span>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"cursor-pointer\" (click)=\"modal.dismiss()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15 5L5 15M5 5L15 15\" stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div> \r\n </div>\r\n </div>\r\n <div class=\"card-body\">\r\n <div *ngFor=\"let log of activity\" class=\"d-flex mb-5 ms-5\">\r\n <div\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 class=\"symbol symbol-35px symbol-circle\">\r\n <span [ngClass]=\"log?.type === 'Audit' ? 'badge-light-success' : 'badge-light-primary'\" class=\"symbol-label badge-light-primary text-symbol\">\r\n <span [ngClass]=\"log?.type === 'Audit' ? 'text-success badge badge-light-success' : 'text-primary badge badge-light-primary'\" class=\"fs-4 fw-normal\">\r\n {{log?.type?.slice(0,1) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"p-0 h-100 mt-1 border border-1 border-gray\" style=\"width:0px\"></div>\r\n </div>\r\n <div class=\"py-3 pt-0\">\r\n <div class=\"activity-title fw-semibold mt-2 d-flex mb-4\">\r\n <span>{{log?.type}} </span><span class=\"ms-5 list\"><li>Fasila</li></span>\r\n </div>\r\n <div class=\"date-time mb-4\">\r\n {{log?.FileDate}} | {{log?.Time}}\r\n </div>\r\n <div class=\"\"><span class=\"badge badge-light-default fw-semibold\">Before Count : {{log?.beforeCout}}</span>\r\n <span class=\"badge badge-light-default fw-semibold ms-3\">After Count : {{log?.AfterCount}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</ng-template>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.text-border{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;color:var(--Gray-700, #344054);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important}.text-border-priamry{border-radius:16px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-700, #009BF3);text-align:center;font-size:14px;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}tr{vertical-align:middle!important}\n"] }]
1493
- }], ctorParameters: () => [{ type: i2.GlobalStateService }, { type: i1$1.NgbModal }, { type: TicketService }, { type: i4.ToastService }, { type: ExcelService }], propDecorators: { activitylog: [{
1584
+ }], ctorParameters: () => [{ type: i1$1.GlobalStateService }, { type: i1$2.NgbModal }, { type: TicketService }, { type: i4.ToastService }, { type: ExcelService }], propDecorators: { activitylog: [{
1494
1585
  type: ViewChild,
1495
1586
  args: ['activitylog']
1496
1587
  }] } });
1497
1588
 
1589
+ const SELECT_CONTROL_VALUE_ACCESSOR = {
1590
+ provide: NG_VALUE_ACCESSOR,
1591
+ useExisting: forwardRef(() => ReactiveSelectComponent),
1592
+ multi: true,
1593
+ };
1594
+ class ReactiveSelectComponent {
1595
+ apiService;
1596
+ cd;
1597
+ onTouched;
1598
+ onChanged;
1599
+ isDisabled;
1600
+ idField;
1601
+ nameField;
1602
+ label;
1603
+ data;
1604
+ itemChange = new EventEmitter();
1605
+ isOpened = false;
1606
+ selected = null;
1607
+ selectedId;
1608
+ instanceId;
1609
+ constructor(apiService, cd) {
1610
+ this.apiService = apiService;
1611
+ this.cd = cd;
1612
+ }
1613
+ ngOnInit() {
1614
+ this.instanceId = crypto.randomUUID();
1615
+ this.apiService.dropDownTrigger.subscribe((e) => {
1616
+ if (e !== this.instanceId) {
1617
+ this.isOpened = false;
1618
+ this.cd.detectChanges();
1619
+ }
1620
+ });
1621
+ }
1622
+ writeValue(val) {
1623
+ this.selectedId = val;
1624
+ this.selected = this.data.filter((item) => item?.[this.idField] === val)[0];
1625
+ }
1626
+ registerOnChange(fn) {
1627
+ this.onChanged = fn;
1628
+ }
1629
+ registerOnTouched(fn) {
1630
+ this.onTouched = fn;
1631
+ }
1632
+ setDisabledState(isDisabled) {
1633
+ this.isDisabled = isDisabled;
1634
+ }
1635
+ onSelect(item) {
1636
+ this.onTouched();
1637
+ this.selected = item;
1638
+ this.selectedId = item?.[this.idField];
1639
+ this.isOpened = false;
1640
+ this.itemChange.next(this.selectedId);
1641
+ this.onChanged(this.selectedId);
1642
+ }
1643
+ onClick(event) {
1644
+ // console.log(this.isDisabled)
1645
+ if (!this.isDisabled) {
1646
+ const targetElement = event.target;
1647
+ if (!this.isComponentClicked(targetElement)) {
1648
+ this.isOpened = false;
1649
+ }
1650
+ }
1651
+ }
1652
+ isComponentClicked(targetElement) {
1653
+ const parentElement = targetElement.parentElement;
1654
+ if (parentElement) {
1655
+ const clickedOnComponent = parentElement.classList.contains('custom-select');
1656
+ if (clickedOnComponent) {
1657
+ return true;
1658
+ }
1659
+ else {
1660
+ return this.isComponentClicked(parentElement);
1661
+ }
1662
+ }
1663
+ return false;
1664
+ }
1665
+ openDropdown() {
1666
+ this.isOpened = !this.isOpened;
1667
+ this.apiService.dropDownTrigger.next(this.instanceId);
1668
+ }
1669
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ReactiveSelectComponent, deps: [{ token: TicketService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1670
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ReactiveSelectComponent, selector: "lib-reactive-select", inputs: { isDisabled: "isDisabled", idField: "idField", nameField: "nameField", label: "label", data: "data" }, outputs: { itemChange: "itemChange" }, host: { listeners: { "document:click": "onClick($event)" } }, providers: [SELECT_CONTROL_VALUE_ACCESSOR], ngImport: i0, template: "<div class=\"custom-select\">\r\n <div class=\"form-group\">\r\n <label *ngIf=\"label\" class=\"form-label\">{{label}}</label>\r\n <div class=\"position-relative\">\r\n <div (click)=\"openDropdown()\" [ngClass]=\"isDisabled ? 'disable' : ''\" class=\"form-select dropselect ellipse1\">\r\n {{selected?.[nameField]}}</div>\r\n <div *ngIf=\"isOpened\" class=\"card py-2 w-100 position-absolute end-0 z-1 drop-list\">\r\n <ul class=\"list-unstyled mb-2\">\r\n <li *ngFor=\"let item of data\" (click)=\"onSelect(item)\"\r\n [ngClass]=\"item?.[idField] === selected?.[idField] ? 'active' : ''\"\r\n class=\"text px-5 items cursor-pointer py-4 \">\r\n {{item?.[nameField]}}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".custom-select{min-width:200px}.custom-select .items:hover,.custom-select .tems.focus,.custom-select .items.active,.custom-select .camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.custom-select .drop-list{max-height:300px;overflow-y:scroll}.custom-select .dropselect{color:var(--Gray-500, #667085);font-family:Inter;font-size:16px;font-style:normal;font-weight:400;line-height:24px;height:45px!important;cursor:default;white-space:nowrap;overflow:hidden}.custom-select .text{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.custom-select .disable{pointer-events:none;background-color:#f9fafb!important}.ellipse1{min-width:auto;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.z-1{z-index:9!important}\n"], dependencies: [{ kind: "directive", type: i6$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
1671
+ }
1672
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ReactiveSelectComponent, decorators: [{
1673
+ type: Component,
1674
+ args: [{ selector: 'lib-reactive-select', providers: [SELECT_CONTROL_VALUE_ACCESSOR], template: "<div class=\"custom-select\">\r\n <div class=\"form-group\">\r\n <label *ngIf=\"label\" class=\"form-label\">{{label}}</label>\r\n <div class=\"position-relative\">\r\n <div (click)=\"openDropdown()\" [ngClass]=\"isDisabled ? 'disable' : ''\" class=\"form-select dropselect ellipse1\">\r\n {{selected?.[nameField]}}</div>\r\n <div *ngIf=\"isOpened\" class=\"card py-2 w-100 position-absolute end-0 z-1 drop-list\">\r\n <ul class=\"list-unstyled mb-2\">\r\n <li *ngFor=\"let item of data\" (click)=\"onSelect(item)\"\r\n [ngClass]=\"item?.[idField] === selected?.[idField] ? 'active' : ''\"\r\n class=\"text px-5 items cursor-pointer py-4 \">\r\n {{item?.[nameField]}}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".custom-select{min-width:200px}.custom-select .items:hover,.custom-select .tems.focus,.custom-select .items.active,.custom-select .camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.custom-select .drop-list{max-height:300px;overflow-y:scroll}.custom-select .dropselect{color:var(--Gray-500, #667085);font-family:Inter;font-size:16px;font-style:normal;font-weight:400;line-height:24px;height:45px!important;cursor:default;white-space:nowrap;overflow:hidden}.custom-select .text{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.custom-select .disable{pointer-events:none;background-color:#f9fafb!important}.ellipse1{min-width:auto;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.z-1{z-index:9!important}\n"] }]
1675
+ }], ctorParameters: () => [{ type: TicketService }, { type: i0.ChangeDetectorRef }], propDecorators: { isDisabled: [{
1676
+ type: Input
1677
+ }], idField: [{
1678
+ type: Input
1679
+ }], nameField: [{
1680
+ type: Input
1681
+ }], label: [{
1682
+ type: Input
1683
+ }], data: [{
1684
+ type: Input
1685
+ }], itemChange: [{
1686
+ type: Output
1687
+ }], onClick: [{
1688
+ type: HostListener,
1689
+ args: ['document:click', ['$event']]
1690
+ }] } });
1691
+
1692
+ class GroupSelectComponent {
1693
+ cd;
1694
+ authService;
1695
+ onClick(event) {
1696
+ const target = event.target;
1697
+ if (!target.closest('.dropdown')) {
1698
+ this.showDropdown = false;
1699
+ }
1700
+ }
1701
+ items;
1702
+ searchField;
1703
+ multi;
1704
+ idField;
1705
+ selectedValues = [];
1706
+ disabled;
1707
+ label;
1708
+ selected = new EventEmitter();
1709
+ filteredValues = [];
1710
+ showDropdown;
1711
+ searchValue;
1712
+ instanceId;
1713
+ constructor(cd, authService) {
1714
+ this.cd = cd;
1715
+ this.authService = authService;
1716
+ }
1717
+ ngOnInit() {
1718
+ this.instanceId = crypto.randomUUID();
1719
+ this.authService.dropDownTrigger.subscribe((e) => {
1720
+ if (e !== this.instanceId) {
1721
+ this.showDropdown = false;
1722
+ this.cd.detectChanges();
1723
+ }
1724
+ });
1725
+ }
1726
+ ngOnChanges(changes) {
1727
+ if (changes['items'] && this.items?.length) {
1728
+ this.initializeItems();
1729
+ }
1730
+ if (changes['selectedValues'] && Array.isArray(changes['selectedValues']?.currentValue) && changes['selectedValues']?.currentValue?.length > 0 && changes['selectedValues']?.currentValue[0]) {
1731
+ this.updateSelectedValues();
1732
+ }
1733
+ }
1734
+ initializeItems() {
1735
+ this.filteredValues = this.items.map((item) => ({ ...item }));
1736
+ this.updateSelectedValues();
1737
+ }
1738
+ updateSelectedValues() {
1739
+ this.selectedValues?.forEach((selectedItem) => {
1740
+ const item = this.filteredValues?.find((filteredItem) => filteredItem?.[this.idField] === selectedItem?.[this.idField]);
1741
+ if (item) {
1742
+ item.isSelected = true;
1743
+ }
1744
+ });
1745
+ }
1746
+ openDropdown(event) {
1747
+ this.authService.dropDownTrigger.next(this.instanceId);
1748
+ event.stopPropagation();
1749
+ this.showDropdown = !this.showDropdown;
1750
+ }
1751
+ onInput(event) {
1752
+ if (!event.target.value) {
1753
+ this.filteredValues = [...this.items];
1754
+ }
1755
+ else {
1756
+ const searchTerm = event.target.value.toLowerCase();
1757
+ this.filteredValues = this.items.filter((item) => item[this.searchField].toLowerCase().includes(searchTerm));
1758
+ }
1759
+ this.updateSelectedValues();
1760
+ this.cd.detectChanges();
1761
+ }
1762
+ onSelect(event, item) {
1763
+ if (this.multi) {
1764
+ if (event.currentTarget.checked) {
1765
+ this.selectedValues.push(item);
1766
+ }
1767
+ else {
1768
+ this.selectedValues = this.selectedValues.filter((elem) => elem[this.idField] !== item[this.idField]);
1769
+ }
1770
+ }
1771
+ else {
1772
+ this.selectedValues = [{ ...item }];
1773
+ this.filteredValues.forEach((element) => {
1774
+ if (element[this.idField] !== item[this.idField]) {
1775
+ element.isSelected = false;
1776
+ }
1777
+ });
1778
+ this.showDropdown = false;
1779
+ }
1780
+ const valuesToEmit = this.selectedValues.map((value) => {
1781
+ const selectedItem = { ...value };
1782
+ delete selectedItem.isSelected;
1783
+ return selectedItem;
1784
+ });
1785
+ this.cd.detectChanges();
1786
+ this.emitSelectedValues(valuesToEmit);
1787
+ }
1788
+ onSelectAll(event) {
1789
+ const selectAll = event.currentTarget.checked;
1790
+ this.filteredValues.forEach((item) => item.isSelected = selectAll);
1791
+ if (selectAll) {
1792
+ this.selectedValues = [...this.filteredValues];
1793
+ }
1794
+ else {
1795
+ this.selectedValues = [];
1796
+ }
1797
+ const valuesToEmit = this.selectedValues.map((value) => {
1798
+ const { isSelected, ...selectedItem } = value;
1799
+ return selectedItem;
1800
+ });
1801
+ this.cd.detectChanges();
1802
+ this.emitSelectedValues(valuesToEmit);
1803
+ }
1804
+ emitSelectedValues(values) {
1805
+ if (this.multi) {
1806
+ this.selected.emit(values);
1807
+ }
1808
+ else {
1809
+ this.selected.emit(values[0]);
1810
+ }
1811
+ }
1812
+ checkIfAllSelected() {
1813
+ return this.filteredValues.every((item) => item.isSelected);
1814
+ }
1815
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GroupSelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TicketService }], target: i0.ɵɵFactoryTarget.Component });
1816
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: GroupSelectComponent, selector: "lib-group-select", inputs: { items: "items", searchField: "searchField", multi: "multi", idField: "idField", selectedValues: "selectedValues", disabled: "disabled", label: "label" }, outputs: { selected: "selected" }, host: { listeners: { "document:click": "onClick($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"outer-container\">\r\n <div [ngClass]=\"disabled ? 'disable-input':''\" (click)=\"openDropdown($event)\" class=\"form-select\">\r\n <ng-container *ngIf=\"multi\" >\r\n <span *ngIf=\"selectedValues?.length\" class=\"select-value mx-2\"> <img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[0]?.[searchField]}}</span> \r\n <!-- <span *ngIf=\"selectedValues?.length > 1\" class=\"select-value mx-2\"><img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[1]?.[searchField]}}</span> -->\r\n <span class=\"select-value mx-2\" *ngIf=\"selectedValues?.length > 1\">+{{selectedValues?.length -1}}</span> {{label}} \r\n </ng-container>\r\n <ng-container *ngIf=\"!multi\" >\r\n {{selectedValues?.[0]?.[searchField]}}\r\n </ng-container>\r\n </div>\r\n <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n <div class=\"w-100 input-wrapper\">\r\n <input [(ngModel)]=\"searchValue\" placeholder=\"Search\" (input)=\"onInput($event)\" type=\"text\"> \r\n <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n <ul>\r\n <li *ngIf=\"multi && filteredValues?.length\">\r\n <label class=\"form-check\" [for]=\"instanceId\" >\r\n <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n [id]=\"instanceId\">\r\n <span class=\"form-check-label\" >\r\n Select All\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngFor=\"let item of filteredValues\" [ngClass]=\"item.isSelected && !multi ? 'selected' : ''\" >\r\n <label [for]=\"item[idField] + instanceId\" [ngClass]=\"multi ? '': 'ps-0'\" class=\"form-check\">\r\n <input [ngClass]=\"multi ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n [id]=\"item[idField] + instanceId\">\r\n <span class=\"form-check-label\" >\r\n {{item[searchField]}}\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngIf=\"!filteredValues?.length\" >\r\n <span class=\"d-flex align-items-center justify-content-center\" >No data found</span>\r\n </li>\r\n </ul> \r\n </div> \r\n \r\n</div>", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:42.5px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:auto;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul .selected{background:#f9fafb}.outer-container .input-container ul li{list-style:none;padding:10px 16px;cursor:pointer}.outer-container .input-container ul li label{cursor:pointer}.outer-container .input-container ul li:hover{background:#f9fafb}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.select-value{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;mix-blend-mode:multiply;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:4px 12px 4px 6px}\n"], dependencies: [{ kind: "directive", type: i6$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
1817
+ }
1818
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GroupSelectComponent, decorators: [{
1819
+ type: Component,
1820
+ args: [{ selector: 'lib-group-select', template: "<div class=\"outer-container\">\r\n <div [ngClass]=\"disabled ? 'disable-input':''\" (click)=\"openDropdown($event)\" class=\"form-select\">\r\n <ng-container *ngIf=\"multi\" >\r\n <span *ngIf=\"selectedValues?.length\" class=\"select-value mx-2\"> <img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[0]?.[searchField]}}</span> \r\n <!-- <span *ngIf=\"selectedValues?.length > 1\" class=\"select-value mx-2\"><img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[1]?.[searchField]}}</span> -->\r\n <span class=\"select-value mx-2\" *ngIf=\"selectedValues?.length > 1\">+{{selectedValues?.length -1}}</span> {{label}} \r\n </ng-container>\r\n <ng-container *ngIf=\"!multi\" >\r\n {{selectedValues?.[0]?.[searchField]}}\r\n </ng-container>\r\n </div>\r\n <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n <div class=\"w-100 input-wrapper\">\r\n <input [(ngModel)]=\"searchValue\" placeholder=\"Search\" (input)=\"onInput($event)\" type=\"text\"> \r\n <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n <ul>\r\n <li *ngIf=\"multi && filteredValues?.length\">\r\n <label class=\"form-check\" [for]=\"instanceId\" >\r\n <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n [id]=\"instanceId\">\r\n <span class=\"form-check-label\" >\r\n Select All\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngFor=\"let item of filteredValues\" [ngClass]=\"item.isSelected && !multi ? 'selected' : ''\" >\r\n <label [for]=\"item[idField] + instanceId\" [ngClass]=\"multi ? '': 'ps-0'\" class=\"form-check\">\r\n <input [ngClass]=\"multi ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n [id]=\"item[idField] + instanceId\">\r\n <span class=\"form-check-label\" >\r\n {{item[searchField]}}\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngIf=\"!filteredValues?.length\" >\r\n <span class=\"d-flex align-items-center justify-content-center\" >No data found</span>\r\n </li>\r\n </ul> \r\n </div> \r\n \r\n</div>", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:42.5px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:auto;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul .selected{background:#f9fafb}.outer-container .input-container ul li{list-style:none;padding:10px 16px;cursor:pointer}.outer-container .input-container ul li label{cursor:pointer}.outer-container .input-container ul li:hover{background:#f9fafb}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.select-value{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;mix-blend-mode:multiply;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:4px 12px 4px 6px}\n"] }]
1821
+ }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: TicketService }], propDecorators: { onClick: [{
1822
+ type: HostListener,
1823
+ args: ['document:click', ['$event']]
1824
+ }], items: [{
1825
+ type: Input
1826
+ }], searchField: [{
1827
+ type: Input
1828
+ }], multi: [{
1829
+ type: Input
1830
+ }], idField: [{
1831
+ type: Input
1832
+ }], selectedValues: [{
1833
+ type: Input
1834
+ }], disabled: [{
1835
+ type: Input
1836
+ }], label: [{
1837
+ type: Input
1838
+ }], selected: [{
1839
+ type: Output
1840
+ }] } });
1841
+
1842
+ class FootfallDicComponent {
1843
+ gs;
1844
+ ticketService;
1845
+ cd;
1846
+ toast;
1847
+ modalService;
1848
+ excelservice;
1849
+ fb;
1850
+ searchValue;
1851
+ loading = false;
1852
+ noData = false;
1853
+ sortedColumn = '';
1854
+ sortDirection = 1;
1855
+ footfallView = true;
1856
+ headerFilters;
1857
+ footfallList_req;
1858
+ form;
1859
+ selectedRevopsType;
1860
+ revopsTypeArray = [
1861
+ { value: "", label: "All" },
1862
+ { value: "duplicateImages", label: "Duplicates" },
1863
+ { value: "employee", label: "Employee/Staff" },
1864
+ { value: "houseKeeping", label: "House Keeping" },
1865
+ ];
1866
+ type = [
1867
+ { value: "open", label: "Open" },
1868
+ { value: "closed", label: "Closed" },
1869
+ ];
1870
+ // selectedStatus: FormControl;
1871
+ pendingArray = [
1872
+ { value: "", label: "All" },
1873
+ { value: "pending", label: "Pending" },
1874
+ { value: "approved", label: "Approved" },
1875
+ { value: "rejected", label: "Rejected" },
1876
+ ];
1877
+ actionStatus;
1878
+ filterForm;
1879
+ ticketData = {
1880
+ ticketName: "Footfall Directory",
1881
+ ticketId: "TE_INF_F5645G4534A24",
1882
+ storeName: "LKST98 | RK Salai, Mylapore, Chennai, Tamil Nadu, India",
1883
+ status: "Open",
1884
+ date: "04 Sep 2023",
1885
+ footfall: {
1886
+ total: 100,
1887
+ duplicates: 10,
1888
+ employee: 2,
1889
+ houseKeeping: 1,
1890
+ },
1891
+ duplicates: [
1892
+ { url: "assets/img1.jpg" },
1893
+ { url: "assets/img2.jpg" },
1894
+ { url: "assets/img3.jpg" },
1895
+ ],
1896
+ };
1897
+ selectedStores = [];
1898
+ allSelected = false;
1899
+ stores = [];
1900
+ destroy$ = new Subject();
1901
+ constructor(gs, ticketService, cd, toast, modalService, excelservice, fb) {
1902
+ this.gs = gs;
1903
+ this.ticketService = ticketService;
1904
+ this.cd = cd;
1905
+ this.toast = toast;
1906
+ this.modalService = modalService;
1907
+ this.excelservice = excelservice;
1908
+ this.fb = fb;
1909
+ }
1910
+ ngOnDestroy() {
1911
+ this.destroy$.next(true);
1912
+ this.destroy$.complete();
1913
+ }
1914
+ ngOnInit() {
1915
+ this.footfallView = true;
1916
+ this.selectedRevopsType = new FormControl('');
1917
+ this.filterForm = this.fb.group({
1918
+ selectedStatus: new FormControl('open'),
1919
+ actionStatus: new FormControl(''),
1920
+ ClusterList: new FormControl([]),
1921
+ });
1922
+ this.form = this.fb.group({
1923
+ selectedRevopsType: this.selectedRevopsType,
1924
+ });
1925
+ this.gs.dataRangeValue?.pipe(takeUntil(this.destroy$))?.subscribe({
1926
+ next: (data) => {
1927
+ if (data) {
1928
+ this.headerFilters = data;
1929
+ this.footfallList_req = {
1930
+ client: this.headerFilters.clients.toString(),
1931
+ fromDate: this.headerFilters?.date?.startDate,
1932
+ toDate: this.headerFilters?.date?.endDate,
1933
+ };
1934
+ this.getTicketSummary();
1935
+ this.getTicketList();
1936
+ this.getAllGroups();
1937
+ }
1938
+ },
1939
+ });
1940
+ }
1941
+ getFootfallSummaryData;
1942
+ getTicketSummary() {
1943
+ this.ticketService
1944
+ .getTicketSummaryApi(this.footfallList_req.client, this.footfallList_req.fromDate, this.footfallList_req.toDate)
1945
+ .pipe(takeUntil(this.destroy$))
1946
+ .subscribe({
1947
+ next: (res) => {
1948
+ if (res && res?.data && res?.data?.result) {
1949
+ this.getFootfallSummaryData = res?.data?.result;
1950
+ }
1951
+ else {
1952
+ this.getFootfallSummaryData = [];
1953
+ }
1954
+ },
1955
+ error: (err) => {
1956
+ this.getFootfallSummaryData = [];
1957
+ },
1958
+ complete: () => {
1959
+ this.getFootfallSummaryData.length === 0;
1960
+ },
1961
+ });
1962
+ this.cd.detectChanges();
1963
+ }
1964
+ offset = 0;
1965
+ limit = 10;
1966
+ isExport = false;
1967
+ footfallListData;
1968
+ totalItems;
1969
+ paginationSizes = [10, 20, 30];
1970
+ getTicketList() {
1971
+ this.loading = true;
1972
+ this.searchValue = this.searchValue?.trim() || '';
1973
+ this.offset = this.offset || 1;
1974
+ this.limit = this.limit || 10;
1975
+ this.isExport = false;
1976
+ this.ticketService
1977
+ .getTicketListApi(this.footfallList_req.client, this.footfallList_req.fromDate, this.footfallList_req.toDate, this.searchValue, this.limit, this.offset, this.isExport, this.sortedColumn, this.sortDirection)
1978
+ .pipe(takeUntil(this.destroy$))
1979
+ .subscribe({
1980
+ next: (res) => {
1981
+ if (res && res.code === 200) {
1982
+ this.noData = false;
1983
+ this.loading = false;
1984
+ this.footfallListData = res?.data?.result;
1985
+ this.totalItems = res?.data?.count;
1986
+ if (this.totalItems < 10) {
1987
+ this.paginationSizes = [this.totalItems];
1988
+ }
1989
+ else {
1990
+ this.paginationSizes = [10, 20, 30];
1991
+ }
1992
+ }
1993
+ else {
1994
+ this.noData = true;
1995
+ this.loading = false;
1996
+ this.footfallListData = [];
1997
+ }
1998
+ this.cd.detectChanges();
1999
+ },
2000
+ error: (err) => {
2001
+ this.noData = true;
2002
+ this.loading = false;
2003
+ },
2004
+ complete: () => {
2005
+ this.loading = false;
2006
+ },
2007
+ });
2008
+ }
2009
+ currentPage = 1;
2010
+ pageSize = 10;
2011
+ onPageChange(pageOffset) {
2012
+ this.currentPage = Number(pageOffset);
2013
+ this.offset = Number(pageOffset);
2014
+ this.limit = 10;
2015
+ this.getTicketList();
2016
+ }
2017
+ onPageSizeChange(pageSize) {
2018
+ this.pageSize = Number(pageSize);
2019
+ this.limit = Number(pageSize);
2020
+ this.currentPage = 1;
2021
+ this.offset = 1;
2022
+ this.getTicketList();
2023
+ }
2024
+ setpageSize() {
2025
+ if (this.totalItems < 10) {
2026
+ return this.totalItems;
2027
+ }
2028
+ else {
2029
+ return this.pageSize;
2030
+ }
2031
+ }
2032
+ searchData() {
2033
+ this.currentPage = 1;
2034
+ this.offset = 1;
2035
+ this.limit = 10;
2036
+ this.getTicketList();
2037
+ }
2038
+ exportXLSX() {
2039
+ this.searchValue = this.searchValue?.trim() || '';
2040
+ this.offset = 1;
2041
+ this.limit = 10000;
2042
+ this.isExport = true;
2043
+ this.ticketService
2044
+ .getTicketListExportApi(this.footfallList_req.client, this.footfallList_req.fromDate, this.footfallList_req.toDate, this.searchValue, this.limit, this.offset, this.isExport, this.sortedColumn, this.sortDirection)
2045
+ .pipe(takeUntil(this.destroy$))
2046
+ .subscribe({
2047
+ next: (res) => {
2048
+ this.excelservice.saveAsExcelFile(res, 'footfall directory ticket ');
2049
+ },
2050
+ error: (err) => {
2051
+ this.toast.getErrorToast('Error exporting data:' + err.error ? err.error : err.message);
2052
+ }
2053
+ });
2054
+ }
2055
+ onSort(column) {
2056
+ if (this.sortedColumn === column) {
2057
+ this.sortDirection = this.sortDirection === 1 ? -1 : 1;
2058
+ }
2059
+ else {
2060
+ this.sortedColumn = column;
2061
+ this.sortDirection = 1;
2062
+ }
2063
+ this.getTicketList();
2064
+ }
2065
+ storeCount;
2066
+ searchStoresData() {
2067
+ this.getStores();
2068
+ }
2069
+ StoresSearchValue = '';
2070
+ getStores() {
2071
+ this.ticketService.getTaggedStoresApi(this.footfallList_req.client, this.footfallList_req.fromDate, this.footfallList_req.toDate, this.StoresSearchValue, this.groups).pipe(takeUntil(this.destroy$))
2072
+ .subscribe({
2073
+ next: (res) => {
2074
+ if (res && res.code === 200) {
2075
+ this.stores = res?.data?.result;
2076
+ this.storeCount = res.data?.count || 0;
2077
+ }
2078
+ else {
2079
+ this.stores = [];
2080
+ this.storeCount = 0;
2081
+ }
2082
+ this.cd.detectChanges();
2083
+ },
2084
+ error: (err) => {
2085
+ this.stores = [];
2086
+ this.storeCount = 0;
2087
+ },
2088
+ complete: () => { },
2089
+ });
2090
+ }
2091
+ getTaggedStoresData;
2092
+ typeChange(event) {
2093
+ this.filterForm.get('selectedStatus')?.setValue(event || null);
2094
+ }
2095
+ pendingChange(event) {
2096
+ this.filterForm.get('actionStatus')?.setValue(event || null);
2097
+ }
2098
+ RevopsTypeChange(event) {
2099
+ const selectedType = event ?? '';
2100
+ this.footfalloffset = 1;
2101
+ if (selectedType === '')
2102
+ this.footfalllimit = 1;
2103
+ else
2104
+ this.footfalllimit = 250;
2105
+ this.form.get('selectedRevopsType')?.setValue(selectedType);
2106
+ this.allSelectValue = false;
2107
+ // Clear selected lists
2108
+ this.selectedEmployeeImagesList = [];
2109
+ this.selectedHousekeepingImagesList = [];
2110
+ this.selectedDuplicateImagesList = [];
2111
+ // Reset counts
2112
+ this.employeeACCount = '';
2113
+ this.houseKeepingACCount = '';
2114
+ this.duplicateACCount = '';
2115
+ this.dataStoreView();
2116
+ }
2117
+ footfalloffset = 1;
2118
+ footfalllimit = 1;
2119
+ footfallTicketsData = [];
2120
+ storeIdValue;
2121
+ dataReset() {
2122
+ this.selectedStores = [];
2123
+ this.allSelected = false;
2124
+ this.form.get('selectedRevopsType')?.setValue('');
2125
+ this.filterForm.get('selectedStatus')?.setValue('open');
2126
+ this.filterForm.get('actionStatus')?.setValue('pending');
2127
+ this.dataStoreView();
2128
+ }
2129
+ dataApply() {
2130
+ this.allSelectValue = false;
2131
+ this.dataStoreView();
2132
+ }
2133
+ imageUrl;
2134
+ dataIndexId;
2135
+ dateString;
2136
+ footfallNoData = false;
2137
+ footfallLoading = true;
2138
+ lastSelectedTicket = null;
2139
+ hasInitialStoreSynced = false;
2140
+ addStoreIfNotExists(store) {
2141
+ if (this.hasInitialStoreSynced)
2142
+ return;
2143
+ const storeId = store?.storeId;
2144
+ if (storeId && !this.selectedStores.includes(storeId)) {
2145
+ this.selectedStores.push(storeId);
2146
+ }
2147
+ this.hasInitialStoreSynced = true;
2148
+ this.allSelected = this.selectedStores.length === this.stores.length;
2149
+ }
2150
+ dataStoreView(data) {
2151
+ this.footfallTicketsData = [];
2152
+ this.footfallNoData = false;
2153
+ this.footfallLoading = true;
2154
+ const ticket = data?._source ? data : this.lastSelectedTicket;
2155
+ if (!ticket || !ticket._source) {
2156
+ this.footfallLoading = false;
2157
+ this.footfallNoData = true;
2158
+ this.toast.getErrorToast('No ticket data available');
2159
+ return;
2160
+ }
2161
+ this.lastSelectedTicket = ticket;
2162
+ this.addStoreIfNotExists(ticket._source);
2163
+ this.dataIndexId = ticket._id || '';
2164
+ this.dateString = ticket._source.dateString || '';
2165
+ this.imageUrl = this.ticketService?.footfallCDN;
2166
+ this.storeIdValue = this.selectedStores;
2167
+ const revopsType = this.form.get('selectedRevopsType')?.value;
2168
+ const selectedStatus = this.filterForm.get('selectedStatus')?.value;
2169
+ const actionStatus = this.filterForm.get('actionStatus')?.value;
2170
+ const storeId = this.storeIdValue;
2171
+ const fromDate = this.footfallList_req.fromDate;
2172
+ const toDate = this.footfallList_req.toDate;
2173
+ const offset = this.footfalloffset;
2174
+ const limit = revopsType === '' ? this.footfalllimit : this.footfalllimit = 250;
2175
+ this.ticketService
2176
+ .getTicketsApi(storeId, fromDate, toDate, revopsType, selectedStatus, actionStatus, offset, limit)
2177
+ .pipe(takeUntil(this.destroy$))
2178
+ .subscribe({
2179
+ next: (res) => {
2180
+ if (res && res.code === 200) {
2181
+ if (res?.data?.result?.length === 0) {
2182
+ this.footfallTicketsData = [];
2183
+ this.footfallView = true;
2184
+ this.footfallNoData = true;
2185
+ this.footfallLoading = false;
2186
+ this.toast.getErrorToast('No data found for the selected filters');
2187
+ }
2188
+ else {
2189
+ this.footfallTicketsData = res?.data?.result ?? [];
2190
+ this.totalItemsFootfall = res?.data?.count;
2191
+ this.paginationSizes = this.totalItemsFootfall < 1
2192
+ ? [this.totalItemsFootfall]
2193
+ : [1];
2194
+ this.footfallView = false;
2195
+ this.footfallNoData = false;
2196
+ this.footfallLoading = false;
2197
+ }
2198
+ }
2199
+ else {
2200
+ this.footfallTicketsData = [];
2201
+ this.footfallView = false;
2202
+ this.footfallNoData = true;
2203
+ this.footfallLoading = false;
2204
+ }
2205
+ },
2206
+ error: () => {
2207
+ this.footfallTicketsData = [];
2208
+ this.footfallView = false;
2209
+ this.footfallNoData = true;
2210
+ this.footfallLoading = false;
2211
+ },
2212
+ complete: () => {
2213
+ this.cd.detectChanges();
2214
+ },
2215
+ });
2216
+ }
2217
+ isCollapsed = false;
2218
+ toggleSidebar() {
2219
+ this.isCollapsed = !this.isCollapsed;
2220
+ }
2221
+ matchedType;
2222
+ matchedArray = [{ value: "all", label: "matched: All" }];
2223
+ onFilterApply() {
2224
+ this.dataStoreView();
2225
+ }
2226
+ pageSizeFootfall = 1;
2227
+ footfallcurrentPage = 1;
2228
+ onFootfallPageChange(pageOffset) {
2229
+ this.footfallcurrentPage = Number(pageOffset);
2230
+ this.footfalloffset = Number(pageOffset);
2231
+ this.footfalllimit = 1;
2232
+ this.dataStoreView();
2233
+ }
2234
+ onFootfallPageSizeChange(pageSize) {
2235
+ this.footfalllimit = Number(pageSize);
2236
+ this.pageSizeFootfall = Number(pageSize);
2237
+ this.footfallcurrentPage = 1;
2238
+ this.footfalloffset = 1;
2239
+ this.dataStoreView();
2240
+ }
2241
+ totalItemsFootfall;
2242
+ setFootfallpageSize() {
2243
+ if (this.totalItemsFootfall < 1) {
2244
+ return this.totalItemsFootfall;
2245
+ }
2246
+ else {
2247
+ return this.pageSizeFootfall;
2248
+ }
2249
+ }
2250
+ toggleStoreSelection(store) {
2251
+ const storeId = store?.storeId;
2252
+ if (!storeId)
2253
+ return;
2254
+ const index = this.selectedStores.indexOf(storeId);
2255
+ if (index > -1) {
2256
+ this.selectedStores.splice(index, 1);
2257
+ }
2258
+ else {
2259
+ this.selectedStores.push(storeId);
2260
+ }
2261
+ this.allSelected = this.selectedStores.length === this.stores.length;
2262
+ }
2263
+ toggleSelectAll() {
2264
+ const visibleStoreIds = this.filteredStores.map((s) => s.storeId);
2265
+ if (this.allSelected) {
2266
+ // Remove only the visible ones
2267
+ this.selectedStores = this.selectedStores.filter(id => !visibleStoreIds.includes(id));
2268
+ }
2269
+ else {
2270
+ // Add only those that are not already selected
2271
+ const newIds = visibleStoreIds.filter(id => !this.selectedStores.includes(id));
2272
+ this.selectedStores = [...this.selectedStores, ...newIds];
2273
+ }
2274
+ this.allSelected = this.selectedStores.length === this.stores.length;
2275
+ }
2276
+ isSelected(store) {
2277
+ return this.selectedStores.includes(store.storeId);
2278
+ }
2279
+ imgtoggleSelectAll() {
2280
+ this.allSelected = !this.allSelected;
2281
+ this.ticketData.duplicates.forEach((img) => {
2282
+ img.selected = this.allSelected;
2283
+ });
2284
+ }
2285
+ selectedImagesList = [];
2286
+ selectedDuplicateImagesList = [];
2287
+ selectedHousekeepingImagesList = [];
2288
+ selectedEmployeeImagesList = [];
2289
+ houseKeepingACCount;
2290
+ employeeACCount;
2291
+ duplicateACCount;
2292
+ cloneWithoutSelected(obj) {
2293
+ const { ...rest } = obj;
2294
+ return rest;
2295
+ }
2296
+ allSelectValue = false;
2297
+ cloneWithoutSelected1(data) {
2298
+ const { __parent, ...rest } = data;
2299
+ return { ...rest };
2300
+ }
2301
+ onImageCheckboxChange1(data, category, parentOriginal) {
2302
+ let selectedList;
2303
+ if (category === 'duplicate') {
2304
+ parentOriginal = parentOriginal || data.__parent;
2305
+ const existingOriginal = this.selectedDuplicateImagesList.find((item) => item.tempId === parentOriginal?.tempId);
2306
+ if (data.selected) {
2307
+ if (existingOriginal) {
2308
+ const alreadyExists = existingOriginal.data?.some((dup) => dup.tempId === data.tempId);
2309
+ if (!alreadyExists) {
2310
+ existingOriginal.data.push(this.cloneWithoutSelected1(data));
2311
+ }
2312
+ }
2313
+ else {
2314
+ this.selectedDuplicateImagesList.push({
2315
+ tempId: parentOriginal?.tempId,
2316
+ filePath: parentOriginal?.filePath,
2317
+ entryTime: parentOriginal?.entryTime,
2318
+ exitTime: parentOriginal?.exitTime,
2319
+ timeRange: parentOriginal?.timeRange,
2320
+ data: [this.cloneWithoutSelected1(data)],
2321
+ });
2322
+ }
2323
+ }
2324
+ else {
2325
+ if (existingOriginal) {
2326
+ existingOriginal.data = existingOriginal.data.filter((d) => d.tempId !== data.tempId);
2327
+ if (existingOriginal.data.length === 0) {
2328
+ this.selectedDuplicateImagesList = this.selectedDuplicateImagesList.filter((o) => o.tempId !== parentOriginal?.tempId);
2329
+ }
2330
+ }
2331
+ }
2332
+ this.duplicateACCount = this.selectedDuplicateImagesList.reduce((sum, orig) => sum + orig.data.length, 0);
2333
+ }
2334
+ if (category === 'employee') {
2335
+ selectedList = this.selectedEmployeeImagesList;
2336
+ }
2337
+ else if (category === 'housekeeping') {
2338
+ selectedList = this.selectedHousekeepingImagesList;
2339
+ }
2340
+ if (category !== 'duplicate') {
2341
+ if (data.selected) {
2342
+ const alreadyExists = selectedList.some((item) => item.tempId === data.tempId);
2343
+ if (!alreadyExists) {
2344
+ selectedList.push(data);
2345
+ }
2346
+ }
2347
+ else {
2348
+ const index = selectedList.findIndex((item) => item.tempId === data.tempId);
2349
+ if (index !== -1) {
2350
+ selectedList.splice(index, 1);
2351
+ }
2352
+ }
2353
+ this.employeeACCount = this.selectedEmployeeImagesList.length;
2354
+ this.houseKeepingACCount = this.selectedHousekeepingImagesList.length;
2355
+ }
2356
+ // 🔒 Disable other checkboxes if one type is selected
2357
+ const totalSelected = this.duplicateACCount + this.employeeACCount + this.houseKeepingACCount;
2358
+ if (totalSelected > 0) {
2359
+ this.checkedValue = false;
2360
+ }
2361
+ else {
2362
+ this.checkedValue = true;
2363
+ }
2364
+ this.cd.detectChanges(); // To update the template
2365
+ this.allSelectValue = this.areAllCheckboxesSelected();
2366
+ // console.log('✅ Counts:', {
2367
+ // duplicateACCount: this.duplicateACCount,
2368
+ // employeeACCount: this.employeeACCount,
2369
+ // houseKeepingACCount: this.houseKeepingACCount,
2370
+ // checkedValue: this.checkedValue,
2371
+ // });
2372
+ }
2373
+ selectAllValue() {
2374
+ this.allSelectValue = !this.allSelectValue;
2375
+ this.checkedValue = !this.allSelectValue;
2376
+ this.selectedEmployeeImagesList = [];
2377
+ this.selectedHousekeepingImagesList = [];
2378
+ this.selectedDuplicateImagesList = [];
2379
+ for (const ticket of this.footfallTicketsData) {
2380
+ const source = ticket._source;
2381
+ // ✅ Employee
2382
+ if (Array.isArray(source.employee)) {
2383
+ source.employee.forEach((img) => {
2384
+ img.selected = this.allSelectValue;
2385
+ if (this.allSelectValue && !this.selectedEmployeeImagesList.some(e => e.tempId === img.tempId)) {
2386
+ this.selectedEmployeeImagesList.push(img);
2387
+ }
2388
+ });
2389
+ }
2390
+ // ✅ Housekeeping
2391
+ if (Array.isArray(source.houseKeeping)) {
2392
+ source.houseKeeping.forEach((emp) => {
2393
+ emp.selected = this.allSelectValue;
2394
+ if (this.allSelectValue && !this.selectedHousekeepingImagesList.some(e => e.tempId === emp.tempId)) {
2395
+ this.selectedHousekeepingImagesList.push(emp);
2396
+ }
2397
+ });
2398
+ }
2399
+ // ✅ Duplicate
2400
+ if (Array.isArray(source.duplicateImages)) {
2401
+ source.duplicateImages.forEach((original) => {
2402
+ if (Array.isArray(original.data)) {
2403
+ original.data.forEach((dup) => {
2404
+ dup.selected = this.allSelectValue;
2405
+ dup.__parent = original; // ✅ Needed for uncheck
2406
+ });
2407
+ if (this.allSelectValue && original.data.length > 0) {
2408
+ const existing = this.selectedDuplicateImagesList.find((o) => o.tempId === original.tempId);
2409
+ if (!existing) {
2410
+ this.selectedDuplicateImagesList.push({
2411
+ tempId: original.tempId,
2412
+ filePath: original.filePath,
2413
+ entryTime: original.entryTime,
2414
+ exitTime: original.exitTime,
2415
+ timeRange: original.timeRange,
2416
+ data: original.data.map((d) => this.cloneWithoutSelected1(d)),
2417
+ });
2418
+ }
2419
+ }
2420
+ }
2421
+ });
2422
+ }
2423
+ }
2424
+ this.houseKeepingACCount = this.selectedHousekeepingImagesList.length;
2425
+ this.employeeACCount = this.selectedEmployeeImagesList.length;
2426
+ this.duplicateACCount = this.selectedDuplicateImagesList.reduce((sum, orig) => sum + orig.data.length, 0);
2427
+ }
2428
+ areAllCheckboxesSelected() {
2429
+ for (const ticket of this.footfallTicketsData) {
2430
+ const source = ticket._source;
2431
+ if (source.employee?.some((img) => !img.selected))
2432
+ return false;
2433
+ if (source.houseKeeping?.some((img) => !img.selected))
2434
+ return false;
2435
+ if (source.duplicateImages?.some((original) => original.data?.some((dup) => !dup.selected)))
2436
+ return false;
2437
+ }
2438
+ return true;
2439
+ }
2440
+ checkedValue = true;
2441
+ onImageCheckboxChange(data, category, parentOriginal) {
2442
+ let selectedList;
2443
+ switch (category) {
2444
+ case 'duplicate':
2445
+ // Ensure selectedDuplicateImagesList is an array of ORIGINALS with selected children
2446
+ const existingOriginal = this.selectedDuplicateImagesList.find((item) => item.tempId === parentOriginal?.tempId);
2447
+ if (data.selected) {
2448
+ if (existingOriginal) {
2449
+ const alreadyExists = existingOriginal.data?.some((dup) => dup.tempId === data.tempId);
2450
+ if (!alreadyExists) {
2451
+ existingOriginal.data.push(this.cloneWithoutSelected(data)); // ✅ no 'selected' key
2452
+ }
2453
+ }
2454
+ else {
2455
+ this.selectedDuplicateImagesList.push({
2456
+ tempId: parentOriginal?.tempId,
2457
+ filePath: parentOriginal?.filePath,
2458
+ entryTime: parentOriginal?.entryTime,
2459
+ exitTime: parentOriginal?.exitTime,
2460
+ timeRange: parentOriginal?.timeRange,
2461
+ data: [this.cloneWithoutSelected(data)], // ✅
2462
+ });
2463
+ }
2464
+ }
2465
+ else {
2466
+ // Remove from selected duplicates
2467
+ if (existingOriginal) {
2468
+ existingOriginal.data = existingOriginal.data.filter((d) => d.tempId !== data.tempId);
2469
+ // Remove the whole original if no duplicates are left
2470
+ if (existingOriginal.data.length === 0) {
2471
+ this.selectedDuplicateImagesList = this.selectedDuplicateImagesList.filter((o) => o.tempId !== parentOriginal?.tempId);
2472
+ }
2473
+ }
2474
+ }
2475
+ // Count only from selected duplicates
2476
+ this.duplicateACCount = this.selectedDuplicateImagesList.reduce((sum, orig) => sum + orig.data.length, 0);
2477
+ return;
2478
+ case 'housekeeping':
2479
+ selectedList = this.selectedHousekeepingImagesList;
2480
+ break;
2481
+ case 'employee':
2482
+ selectedList = this.selectedEmployeeImagesList;
2483
+ break;
2484
+ default:
2485
+ return;
2486
+ }
2487
+ // Unchanged logic for employee and housekeeping
2488
+ selectedList = selectedList || [];
2489
+ if (data.selected) {
2490
+ const alreadyExists = Array.isArray(selectedList) && selectedList.some((item) => item.tempId === data.tempId);
2491
+ if (!alreadyExists) {
2492
+ selectedList.push(data);
2493
+ }
2494
+ }
2495
+ else {
2496
+ const updated = Array.isArray(selectedList) ? selectedList.filter((item) => item.tempId !== data.tempId) : [];
2497
+ if (category === 'housekeeping') {
2498
+ this.selectedHousekeepingImagesList = updated;
2499
+ }
2500
+ else if (category === 'employee') {
2501
+ this.selectedEmployeeImagesList = updated;
2502
+ }
2503
+ }
2504
+ this.houseKeepingACCount = this.selectedHousekeepingImagesList?.length || 0;
2505
+ this.employeeACCount = this.selectedEmployeeImagesList.length || 0;
2506
+ }
2507
+ commentText;
2508
+ submitValue(status = 'approved', category = 'duplicate') {
2509
+ // Step 1: Validate based on current category
2510
+ let selectedList;
2511
+ switch (category) {
2512
+ case 'duplicate':
2513
+ selectedList = this.selectedDuplicateImagesList;
2514
+ break;
2515
+ case 'housekeeping':
2516
+ selectedList = this.selectedHousekeepingImagesList;
2517
+ break;
2518
+ case 'employee':
2519
+ selectedList = this.selectedEmployeeImagesList;
2520
+ break;
2521
+ default:
2522
+ return;
2523
+ }
2524
+ if (selectedList.length === 0) {
2525
+ this.toast.getErrorToast('Please select at least one image');
2526
+ return;
2527
+ }
2528
+ // Replace selected → isChecked before sending
2529
+ const transformedList = selectedList.map(item => {
2530
+ const { selected, ...rest } = item;
2531
+ return { ...rest, isChecked: true };
2532
+ });
2533
+ // Step 2: Build full payload
2534
+ const payload = [];
2535
+ for (const ticket of this.footfallTicketsData) {
2536
+ const source = ticket._source;
2537
+ const singlePayload = {
2538
+ _id: ticket._id,
2539
+ comments: this.commentText || '',
2540
+ dateString: source.dateString || this.dateString,
2541
+ employeeStatus: category === 'employee' ? status : 'pending',
2542
+ houseKeepingStatus: category === 'housekeeping' ? status : 'pending',
2543
+ duplicateStatus: category === 'duplicate' ? status : 'pending',
2544
+ };
2545
+ if (category === 'employee') {
2546
+ singlePayload.employee = transformedList;
2547
+ singlePayload.employeeACCount = this.employeeACCount ? this.employeeACCount : 0;
2548
+ }
2549
+ if (category === 'housekeeping') {
2550
+ singlePayload.houseKeeping = transformedList;
2551
+ singlePayload.houseKeepingACCount = this.houseKeepingACCount ? this.houseKeepingACCount : 0;
2552
+ }
2553
+ if (category === 'duplicate') {
2554
+ singlePayload.duplicateImages = transformedList;
2555
+ singlePayload.duplicateACCount = this.duplicateACCount ? this.duplicateACCount : 0;
2556
+ }
2557
+ payload.push(singlePayload);
2558
+ }
2559
+ // console.log('Payload to submit:', payload);
2560
+ // return
2561
+ // Step 3: Set status based on current category
2562
+ switch (category) {
2563
+ case 'duplicate':
2564
+ payload.forEach(item => item.duplicateStatus = status);
2565
+ break;
2566
+ case 'housekeeping':
2567
+ payload.forEach(item => item.houseKeepingStatus = status);
2568
+ break;
2569
+ case 'employee':
2570
+ payload.forEach(item => item.employeeStatus = status);
2571
+ break;
2572
+ }
2573
+ // Step 4: Submit the payload
2574
+ this.ticketService.getUpdateStatusApi({ data: payload })
2575
+ .pipe(takeUntil(this.destroy$))
2576
+ .subscribe({
2577
+ next: (res) => {
2578
+ if (res && res.code === 200) {
2579
+ this.toast.getSuccessToast(res?.message || 'Ticket updated successfully');
2580
+ this.allSelected = false;
2581
+ this.allSelectValue = false;
2582
+ this.dataStoreView();
2583
+ this.cancel();
2584
+ }
2585
+ else {
2586
+ this.toast.getErrorToast('Failed to update ticket');
2587
+ }
2588
+ },
2589
+ error: (err) => {
2590
+ const msg = err.error.error || err.error || err?.error?.message || err.message || 'Unknown error';
2591
+ this.toast.getErrorToast('Error updating ticket: ' + msg);
2592
+ this.allSelected = false;
2593
+ this.allSelectValue = false;
2594
+ }
2595
+ });
2596
+ }
2597
+ searchTerm = '';
2598
+ get filteredStores() {
2599
+ if (!this.searchTerm?.trim())
2600
+ return this.stores;
2601
+ const term = this.searchTerm.toLowerCase();
2602
+ return this.stores.filter(store => store?.storeName?.toLowerCase().includes(term));
2603
+ }
2604
+ onImageError(event) {
2605
+ event.target.src = 'assets/images/fallback-image.png'; // or any default image path
2606
+ }
2607
+ backToNavigation() {
2608
+ this.selectedStores = [];
2609
+ this.allSelected = false;
2610
+ this.allSelectValue = false;
2611
+ this.footfallView = true;
2612
+ this.getTicketSummary();
2613
+ this.getTicketList();
2614
+ }
2615
+ zoomPopup;
2616
+ popupvalue;
2617
+ popupType;
2618
+ popupOpen(type, value) {
2619
+ const modalRef = this.modalService.open(this.zoomPopup, { centered: true, size: 'md' });
2620
+ this.popupType = type;
2621
+ if (value === 'duplicateImages') {
2622
+ this.popupvalue = 'duplicate';
2623
+ }
2624
+ else {
2625
+ this.popupvalue = value;
2626
+ }
2627
+ }
2628
+ cancel() {
2629
+ this.modalService.dismissAll();
2630
+ this.allSelected = false;
2631
+ this.allSelectValue = false;
2632
+ // Clear all selected flags from the data
2633
+ for (const ticket of this.footfallTicketsData) {
2634
+ const source = ticket._source;
2635
+ source.employee?.forEach((img) => (img.selected = false));
2636
+ source.houseKeeping?.forEach((img) => (img.selected = false));
2637
+ source.duplicateImages?.forEach((original) => {
2638
+ original.data?.forEach((dup) => (dup.selected = false));
2639
+ });
2640
+ }
2641
+ // Clear selected lists
2642
+ this.selectedEmployeeImagesList = [];
2643
+ this.selectedHousekeepingImagesList = [];
2644
+ this.selectedDuplicateImagesList = [];
2645
+ // Reset counts
2646
+ this.employeeACCount = '';
2647
+ this.houseKeepingACCount = '';
2648
+ this.duplicateACCount = '';
2649
+ this.checkedValue = true;
2650
+ }
2651
+ ClusterList = [];
2652
+ getAllGroups() {
2653
+ this.ticketService.getclusters({ clientId: this.headerFilters.client, group: [], city: [] }).subscribe({
2654
+ next: (res) => {
2655
+ if (res && res.code == 200) {
2656
+ this.ClusterList = res?.data?.groupData;
2657
+ this.getStores();
2658
+ }
2659
+ else {
2660
+ this.ClusterList = [];
2661
+ }
2662
+ }
2663
+ });
2664
+ }
2665
+ groups = [];
2666
+ ongroupSelect(event) {
2667
+ this.filterForm.get('ClusterList')?.setValue(event);
2668
+ this.groups = event.map((el) => el.groupName);
2669
+ this.getStores();
2670
+ }
2671
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FootfallDicComponent, deps: [{ token: i1$1.GlobalStateService }, { token: TicketService }, { token: i0.ChangeDetectorRef }, { token: i4.ToastService }, { token: i1$2.NgbModal }, { token: ExcelService }, { token: i6.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
2672
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FootfallDicComponent, selector: "lib-footfall-dic", viewQueries: [{ propertyName: "zoomPopup", first: true, predicate: ["zoomPopup"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"footfallView\" class=\"row\">\r\n <div class=\"col-md-3 mb-3\">\r\n <div class=\"card\">\r\n <div class=\"card-header ellipse1 py-1 px-5\">\r\n <div class=\"my-0\">\r\n <h5 class=\"card-title\">{{ getFootfallSummaryData?.totalTickets !== null ?\r\n getFootfallSummaryData?.totalTickets : '--' }}</h5>\r\n <span class=\"sub-header\">Total tickets</span>\r\n </div>\r\n </div>\r\n <div class=\"card-body py-2 px-5\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-6 col-xl-9 col-md-6 my-3\">\r\n <h5 class=\"card-title\">{{ getFootfallSummaryData?.openTickets !== null ?\r\n getFootfallSummaryData?.openTickets : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Open</span>\r\n </div>\r\n <div class=\"col-lg-6 col-xl-3 col-md-6 my-3\">\r\n <h5 class=\"card-title\">{{ getFootfallSummaryData?.closedTickets !== null ?\r\n getFootfallSummaryData?.closedTickets : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Closed</span>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-md-9 mb-3\">\r\n <div class=\"card\">\r\n <div class=\"card-header ellipse1 py-1 px-5\">\r\n <div class=\"my-0\">\r\n <h5 class=\"card-title\">{{ getFootfallSummaryData?.noShopper !== null ?\r\n getFootfallSummaryData?.noShopper : '--' }}</h5>\r\n <div class=\"sub-header\">Non-Shoppers</div>\r\n </div>\r\n </div>\r\n <div class=\"card-body py-2 px-5\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-4 col-xl-5 col-md-4 my-3\">\r\n <h5 class=\"card-title\">{{ getFootfallSummaryData?.duplicateCount !== null ?\r\n getFootfallSummaryData?.duplicateCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Duplicates</span>\r\n </div>\r\n <div class=\"col-lg-4 col-xl-5 col-md-4 my-3 \">\r\n <h5 class=\"card-title \">{{ getFootfallSummaryData?.employeeCount !== null ?\r\n getFootfallSummaryData?.employeeCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header \">Employee/Staff</span>\r\n </div>\r\n <div class=\"col-lg-4 col-xl-2 col-md-4 my-3\">\r\n <h5 class=\"card-title \">{{ getFootfallSummaryData?.houseKeepingCount !== null ?\r\n getFootfallSummaryData?.houseKeepingCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Housekeeping</span>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"footfallView\" 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\">Ticket Info</span>\r\n <span class=\"text-sub mb-2\">Based on {{footfallList_req?.fromDate | date: 'dd MMM, yyyy'}} \u2013 {{footfallList_req?.toDate | date: 'dd MMM, yyyy'}} </span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" class=\"form-control ps-14 me-2\" placeholder=\"Search\" autocomplete=\"off\"\r\n (change)=\"searchData()\" [(ngModel)]=\"searchValue\" />\r\n <!-- <lib-filters [dataObject]=\"dataObject\"\r\n (appliedFilters)=\"applyFilters($event)\"></lib-filters> -->\r\n\r\n <button type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Export</span>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <div class=\"card-body mt-3 py-0 px-0\">\r\n\r\n\r\n\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Info<svg\r\n [ngClass]=\"sortedColumn === 'storeName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'storeName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('ticketId')\">Ticket ID<svg\r\n [ngClass]=\"sortedColumn === 'ticketId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'ticketId' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('dateString')\">Ticket raised on\r\n <svg [ngClass]=\"sortedColumn === 'dateString' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'dateString' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('footfallCount')\">Total footfalls\r\n <svg [ngClass]=\"sortedColumn === 'footfallCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'footfallCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('duplicateCount')\">Duplicates\r\n <svg [ngClass]=\"sortedColumn === 'duplicateCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'duplicateCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('employeeCount')\">Employee/Staff\r\n <svg [ngClass]=\"sortedColumn === 'employeeCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'employeeCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('houseKeepingCount')\">Housekeeping\r\n <svg [ngClass]=\"sortedColumn === 'houseKeepingCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'houseKeepingCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n\r\n <th>Revised footfalls\r\n \r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('status')\">Status<svg\r\n [ngClass]=\"sortedColumn === 'status' && sortDirection === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'status' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <!-- <th >Actions</th> -->\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let ticket of footfallListData\">\r\n <ng-container *ngIf=\"ticket?._source as source\">\r\n <td (click)=\"dataStoreView(ticket)\">\r\n <div class=\"text-primary cursor-pointer\">{{ source.storeName }}</div>\r\n <div class=\"text-gray-500 fs-7 mt-2\">ID : {{ source.storeId }}</div>\r\n </td>\r\n \r\n <td class=\"py-7\">{{ source.ticketId }}</td>\r\n <td class=\"py-7\">{{ source.dateString | date: 'dd MMM, yyyy' }}</td>\r\n <td class=\"py-7\">{{ source.footfallCount }}</td>\r\n <td class=\"py-7\">{{ source.duplicateCount }}</td>\r\n <td class=\"py-7\">{{ source.employeeCount }}</td>\r\n <td class=\"py-7\">{{ source.houseKeepingCount }}</td>\r\n <td class=\"py-7\">\r\n {{ source.footfallCount - (source.houseKeepingCount + source.employeeCount +\r\n source.duplicateCount) }}\r\n </td>\r\n \r\n <td class=\"py-7\">\r\n <span *ngIf=\"source.status === 'open' || source.status === 'closed'\" class=\"badge mx-2\" [ngClass]=\"{\r\n 'badge-light-primary': source.status === 'open',\r\n 'badge-light-default': source.status === 'closed'\r\n }\">\r\n {{ source.status | titlecase }}\r\n </span>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"pageSize\" [currentPage]=\"currentPage\" [totalItems]=\"totalItems\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"setpageSize()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n </div>\r\n\r\n</div>\r\n\r\n\r\n<div *ngIf=\"!footfallView\" class=\"card mt-2\">\r\n <form [formGroup]=\"filterForm\">\r\n <div class=\"row my-0\">\r\n <div class=\"col-lg-3 my-3\">\r\n <span class=\"ms-2 cursor-pointer\" (click)=\"backToNavigation()\" ><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"44\" viewBox=\"0 0 56 44\"\r\n fill=\"none\">\r\n <g filter=\"url(#filter0_d_887_4505)\">\r\n <rect x=\"2\" y=\"1\" width=\"52\" height=\"40\" rx=\"8\" fill=\"white\" />\r\n <rect x=\"2.5\" y=\"1.5\" width=\"51\" height=\"39\" rx=\"7.5\" stroke=\"#D0D5DD\" />\r\n <path d=\"M30.5 26L25.5 21L30.5 16\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_887_4505\" x=\"0\" y=\"0\" width=\"56\" height=\"44\" filterUnits=\"userSpaceOnUse\"\r\n color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\"\r\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\" />\r\n <feOffset dy=\"1\" />\r\n <feGaussianBlur stdDeviation=\"1\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_887_4505\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_887_4505\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg></span>\r\n <span class=\"card-title-foot ms-3\">Footfall Directory</span>\r\n </div>\r\n <div class=\"col-md-2 my-3\">\r\n \r\n <lib-reactive-select formControlName=\"selectedStatus\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"type\"\r\n (itemChange)=\"typeChange($event)\"></lib-reactive-select>\r\n \r\n\r\n </div>\r\n <div class=\"col-md-2 my-3\">\r\n \r\n <lib-reactive-select formControlName=\"actionStatus\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"pendingArray\"\r\n (itemChange)=\"pendingChange($event)\"></lib-reactive-select>\r\n \r\n </div>\r\n <div class=\"col-md-3 my-4\" >\r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(filterForm.get('ClusterList')?.value?.length)\">\r\n Select cluster\r\n </div>\r\n <lib-group-select [items]=\"ClusterList\" [disabled]=\"false\" [multi]=\"true\"\r\n [searchField]=\"'groupName'\" [idField]=\"'groupName'\" (selected)=\"ongroupSelect($event)\"\r\n [selectedValues]=\"filterForm.get('ClusterList')?.value\">\r\n </lib-group-select>\r\n </div>\r\n\r\n </div>\r\n <div class=\"col-md-2 my-4\">\r\n <div class=\"d-flex me-3\">\r\n <a (click)=\"onFilterApply()\" type=\"submit\" class=\"btn btn-sm btn-primary px-4 \"><span>Apply</span></a>\r\n </div>\r\n </div>\r\n </div>\r\n</form>\r\n</div>\r\n<div *ngIf=\"!footfallView\" class=\"row mt-3\">\r\n <div class=\"position-relative\" \r\n [ngClass]=\"isCollapsed ? 'd-none' : 'col-md-3'\" >\r\n <div class=\"card\">\r\n <div class=\"card-header border-0 pt-3 px-5\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"card-label mb-2\">Footfall Directory</span>\r\n <span class=\"text-sub mb-2\">Based on {{footfallList_req.fromDate | date: 'dd MMM, yyyy'}} \u2013 {{footfallList_req.toDate | date: 'dd MMM, yyyy'}} </span>\r\n </h3>\r\n </div>\r\n <span class=\"cursor-pointer\" (click)=\"toggleSidebar()\" style=\"position: absolute; top: 15px; right: -25px;\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"68\" height=\"68\" viewBox=\"0 0 68 68\" fill=\"none\">\r\n<g filter=\"url(#filter0_dd_778_34282)\">\r\n<rect x=\"12\" width=\"44\" height=\"44\" rx=\"22\" fill=\"white\"/>\r\n<path d=\"M33 27L28 22L33 17M40 27L35 22L40 17\" stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n</g>\r\n<defs>\r\n<filter id=\"filter0_dd_778_34282\" x=\"0\" y=\"0\" width=\"68\" height=\"68\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n<feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/>\r\n<feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/>\r\n<feMorphology radius=\"2\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_778_34282\"/>\r\n<feOffset dy=\"4\"/>\r\n<feGaussianBlur stdDeviation=\"3\"/>\r\n<feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\"/>\r\n<feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_778_34282\"/>\r\n<feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/>\r\n<feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_778_34282\"/>\r\n<feOffset dy=\"12\"/>\r\n<feGaussianBlur stdDeviation=\"8\"/>\r\n<feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\"/>\r\n<feBlend mode=\"normal\" in2=\"effect1_dropShadow_778_34282\" result=\"effect2_dropShadow_778_34282\"/>\r\n<feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_778_34282\" result=\"shape\"/>\r\n</filter>\r\n</defs>\r\n</svg>\r\n</span>\r\n <div class=\"text-end mt-10\">\r\n <button class=\"btn btn-outline w-25 me-3 btn-resize\" (click)=\"dataReset()\"> Reset </button>\r\n <button class=\"btn btn-primary w-25 me-5 btn-resize\" (click)=\"dataApply()\">Apply</button>\r\n </div>\r\n <div class=\"p-4 w-100 overflow-auto\">\r\n <input\r\n class=\"form-control form-control-sm mb-2 px-2 py-1 w-100\"\r\n type=\"text\"\r\n placeholder=\"Search\"\r\n [(ngModel)]=\"StoresSearchValue\"\r\n (change)=\"searchStoresData()\"\r\n/>\r\n\r\n <div class=\"mb-2 border-selectall\">\r\n <input type=\"checkbox\" [checked]=\"allSelected\" (change)=\"toggleSelectAll()\" />\r\n <label class=\"mt-2 font-semibold ms-2\">Select All {{storeCount}} Stores</label>\r\n </div>\r\n <ul class=\"list-unstyled ps-0\">\r\n <li *ngFor=\"let store of stores\" class=\"mb-5\">\r\n <input type=\"checkbox\" [checked]=\"isSelected(store)\" (change)=\"toggleStoreSelection(store)\" />\r\n {{ store?.storeName }}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <div [ngClass]=\"isCollapsed ? 'col-12' : 'col-md-9'\" >\r\n <div class=\"card\">\r\n\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <div *ngIf=\"selectedRevopsType?.value !== ''\" class=\"mb-2\">\r\n <input *ngIf=\"!footfallLoading && !footfallNoData\"\r\n type=\"checkbox\"\r\n [checked]=\"allSelectValue\"\r\n (change)=\"selectAllValue()\" />\r\n <label *ngIf=\"!footfallLoading && !footfallNoData\" class=\"mt-2 fs-6 font-semibold ms-2\">\r\n Select All (\r\n {{\r\n houseKeepingACCount > 0\r\n ? houseKeepingACCount\r\n : employeeACCount > 0\r\n ? employeeACCount\r\n : duplicateACCount > 0\r\n ? duplicateACCount\r\n : 0\r\n }}\r\n )\r\n</label>\r\n <!-- -->\r\n</div>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <form class=\"mx-4\" [formGroup]=\"form\">\r\n <lib-reactive-select formControlName=\"selectedRevopsType\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"revopsTypeArray\" (itemChange)=\"RevopsTypeChange($event)\"></lib-reactive-select>\r\n </form>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"selectedRevopsType?.value !== ''\" class=\"my-7 d-flex justify-content-end me-5\" role=\"group\">\r\n <button *ngIf=\"!footfallLoading && !footfallNoData\" [disabled]=\"checkedValue\" class=\"btn btn-outline me-1\" (click)=\"popupOpen('rejected',this.selectedRevopsType.value)\">Reject selection</button>\r\n <button *ngIf=\"!footfallLoading && !footfallNoData\" [disabled]=\"checkedValue\" class=\"btn btn-primary ms-1\" (click)=\"popupOpen('approved',this.selectedRevopsType.value)\">Approve selection</button>\r\n </div>\r\n <section *ngIf=\"selectedRevopsType?.value === ''\">\r\n <div *ngIf=\"!footfallLoading && !footfallNoData\" class=\"card-body mt-3 py-0\">\r\n\r\n <span class=\"cursor-pointer\" *ngIf=\"isCollapsed\" (click)=\"toggleSidebar()\" style=\"position: absolute; top: 15px; left: 0;\">\r\n <svg class=\"mt-2 ms-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M9.72714 12.6365L13.3635 9.00013L9.72714 5.36377M4.63623 12.6365L8.27259 9.00013L4.63623 5.36377\"\r\n stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <ng-container *ngFor=\"let ticket of footfallTicketsData\">\r\n <div *ngIf=\"ticket?._source as source\" class=\"row mb-6\">\r\n <div class=\"col-2 card-title-label my-2\">Ticket Name</div>\r\n <div class=\"col-1 font-bold my-2\">:</div>\r\n <div class=\"col-9 card-title-value my-2\">{{ source.ticketName ? (source.ticketName | titlecase) : '-' }}</div>\r\n <div class=\"col-2 card-title-label my-2\">Ticket ID</div>\r\n <div class=\"col-1 font-bold my-2\">:</div>\r\n <div class=\"col-9 card-title-value my-2\">{{ source.ticketId ? source.ticketId:'-' }}</div>\r\n <div class=\"col-2 card-title-label my-2\">Store Name</div>\r\n <div class=\"col-1 font-bold my-2\">:</div>\r\n <div class=\"col-9 card-title-value my-2\">{{ source.storeName ? source.storeName:'-' }}</div>\r\n <div class=\"col-2 card-title-label my-2\">Status</div>\r\n <div class=\"col-1 font-bold my-2\">:</div>\r\n <div class=\"col-3 my-2\"><span \r\n class=\"badge\" \r\n [ngClass]=\"{\r\n 'badge-light-primary': source.status === 'open',\r\n 'badge-secondary': source.status === 'closed',\r\n 'badge-light-warning': source.status === 'pending',\r\n 'badge-light-danger': source.status === 'rejected'\r\n }\">\r\n {{ source.status ? (source.status | titlecase) : '-' }}\r\n</span></div>\r\n \r\n <div class=\"col-2 card-title-label my-2\">Date</div>\r\n <div class=\"col-1 font-bold my-2\">:</div>\r\n <div class=\"col-3 card-title-value my-2\">{{ source.dateString ? (source.dateString | date: 'dd MMM, yyyy') :'- ' }}</div>\r\n </div>\r\n \r\n <div *ngIf=\"ticket?._source as source\" class=\"border-totalfootfall\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-5\">\r\n <div class=\"my-0\">\r\n <h5 class=\"card-title\">{{ source?.footfallCount !== null ?\r\n source?.footfallCount : '--' }} <span class=\"sub-header ms-2\">Total Footfall</span></h5>\r\n \r\n </div>\r\n </div>\r\n <div class=\"card-body py-2 px-5\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-3 col-xl-3 col-md-3 my-3\">\r\n <h5 class=\"card-title\">{{ source?.duplicateCount !== null ?\r\n source?.duplicateCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Duplicates</span>\r\n </div>\r\n <div class=\"col-lg-3 col-xl-3 col-md-3 my-3\">\r\n <h5 class=\"card-title\">{{ source?.employeeCount !== null ?\r\n source?.employeeCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Employee/Staff</span>\r\n </div>\r\n \r\n <div class=\"col-lg-3 col-xl-3 col-md-3 my-3\">\r\n <h5 class=\"card-title\">{{ source?.houseKeepingCount !== null ?\r\n source?.houseKeepingCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">House Keeping</span>\r\n </div>\r\n <div class=\"col-lg-3 col-xl-3 col-md-3 my-3 vl\">\r\n <h5 class=\"card-title\"> {{ \r\n (source.footfallCount || 0) - \r\n ((source.houseKeepingCount || 0) + \r\n (source.employeeCount || 0) + \r\n (source.duplicateCount || 0)) \r\n }}</h5>\r\n <span class=\"card-title-sub-header\">Actual footfall</span>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n \r\n \r\n <div *ngIf=\"ticket?._source as source\" class=\"my-4\">\r\n <h3 *ngIf=\"source?.duplicateImages?.length\" class=\"text-lg font-semibold mb-2\"> <span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_730_76157)\">\r\n <path\r\n d=\"M3.75 11.25H3C2.60218 11.25 2.22064 11.092 1.93934 10.8107C1.65804 10.5294 1.5 10.1478 1.5 9.75V3C1.5 2.60218 1.65804 2.22064 1.93934 1.93934C2.22064 1.65804 2.60218 1.5 3 1.5H9.75C10.1478 1.5 10.5294 1.65804 10.8107 1.93934C11.092 2.22064 11.25 2.60218 11.25 3V3.75M8.25 6.75H15C15.8284 6.75 16.5 7.42157 16.5 8.25V15C16.5 15.8284 15.8284 16.5 15 16.5H8.25C7.42157 16.5 6.75 15.8284 6.75 15V8.25C6.75 7.42157 7.42157 6.75 8.25 6.75Z\"\r\n stroke=\"#475467\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_730_76157\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>Duplicates</h3>\r\n \r\n \r\n <div *ngFor=\"let original of source.duplicateImages\" class=\"mb-4\">\r\n <div *ngIf=\"source?.duplicateImages?.length\" class=\"duplicate-head my-2\">Original image</div>\r\n <div class=\"row\">\r\n <div class=\"col-md-3 relative\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3\">\r\n \r\n <img [src]=\"imageUrl + original.filePath\" alt=\"\" class=\"w-100 rounded border\" />\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{ original.tempId }}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{ original.entryTime }}</div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"duplicate-head my-2\">Duplicates</div>\r\n <div class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of original.data\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n <input *ngIf=\"source.status ==='pending'\"\r\n type=\"checkbox\"\r\n [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n(change)=\"onImageCheckboxChange(img, 'duplicate', original)\"\r\n />\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{ img.tempId }}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{ img.entryTime }}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n \r\n <div *ngIf=\"source?.duplicateImages?.length\" class=\"my-7 d-flex justify-content-end\" role=\"group\">\r\n <button [disabled]=\"!duplicateACCount\" class=\"btn btn-outline me-1\" (click)=\"popupOpen('rejected','duplicate')\" >Reject</button>\r\n <button [disabled]=\"!duplicateACCount\" class=\"btn btn-primary ms-1\" (click)=\"popupOpen('approved','duplicate')\">Approve</button>\r\n </div>\r\n \r\n <div *ngIf=\"source?.employee?.length\" class=\"duplicate-head my-2\">Employee/Staff</div>\r\n <div class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of source.employee\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n \r\n <!-- Top-right Checkbox -->\r\n <input *ngIf=\"source.status ==='pending'\" type=\"checkbox\" [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n (change)=\"onImageCheckboxChange(img, 'employee')\" />\r\n \r\n \r\n <!-- Image -->\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n \r\n <!-- Details -->\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{img.tempId}}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{img.entryTime}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"source?.employee?.length\" class=\"my-7 d-flex justify-content-end\" role=\"group\">\r\n <button [disabled]=\"!employeeACCount\" class=\"btn btn-outline me-1\" (click)=\"popupOpen('rejected','employee')\" >Reject</button>\r\n <button [disabled]=\"!employeeACCount\" class=\"btn btn-primary ms-1\" (click)=\"popupOpen('approved','employee')\">Approve</button>\r\n </div>\r\n \r\n \r\n <div *ngIf=\"source?.houseKeeping?.length\" class=\"duplicate-head my-2\">House Keeping</div>\r\n <div class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of source.houseKeeping\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n \r\n <!-- Top-right Checkbox -->\r\n <input *ngIf=\"source.status ==='pending'\" type=\"checkbox\" [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n (change)=\"onImageCheckboxChange(img, 'housekeeping')\" />\r\n \r\n \r\n <!-- Image -->\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n \r\n <!-- Details -->\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{img.tempId}}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{img.entryTime}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"source?.houseKeeping?.length\" class=\"my-7 d-flex justify-content-end\" role=\"group\">\r\n <button [disabled]=\"!houseKeepingACCount\" class=\"btn btn-outline me-1\" (click)=\"popupOpen('reject','housekeeping')\" >Reject</button>\r\n <button [disabled]=\"!houseKeepingACCount\" class=\"btn btn-primary ms-1\" (click)=\"popupOpen('approved','housekeeping')\">Approve</button>\r\n </div>\r\n </div>\r\n \r\n </ng-container>\r\n <div *ngIf=\"!footfallLoading && !footfallNoData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"pageSizeFootfall\" [currentPage]=\"footfallcurrentPage\" [totalItems]=\"totalItemsFootfall\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"setFootfallpageSize()\" (pageChange)=\"onFootfallPageChange($event)\"\r\n (pageSizeChange)=\"onFootfallPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n \r\n </div>\r\n \r\n </section>\r\n <div *ngIf=\"footfallLoading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"footfallNoData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n \r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column \" style=\"margin: 64px;border-radius: 8px;\r\nbackground: var(--Gray-50, #F9FAFB);\">\r\n <svg class=\"my-5\" xmlns=\"http://www.w3.org/2000/svg\" width=\"94\" height=\"94\" viewBox=\"0 0 94 94\" fill=\"none\">\r\n <rect x=\"7\" y=\"7\" width=\"80\" height=\"80\" rx=\"40\" fill=\"#DAF1FF\" />\r\n <rect x=\"7\" y=\"7\" width=\"80\" height=\"80\" rx=\"40\" stroke=\"#EAF8FF\" stroke-width=\"13.3333\" />\r\n <g clip-path=\"url(#clip0_730_75095)\">\r\n <path\r\n d=\"M55.3327 62V58.6667C55.3327 56.8986 54.6303 55.2029 53.3801 53.9526C52.1298 52.7024 50.4341 52 48.666 52H35.3327C33.5646 52 31.8689 52.7024 30.6186 53.9526C29.3684 55.2029 28.666 56.8986 28.666 58.6667V62M65.3327 62V58.6667C65.3316 57.1895 64.8399 55.7546 63.935 54.5872C63.03 53.4198 61.7629 52.5859 60.3327 52.2167M53.666 32.2167C55.1 32.5838 56.3711 33.4178 57.2787 34.5872C58.1864 35.7565 58.6791 37.1947 58.6791 38.675C58.6791 40.1553 58.1864 41.5935 57.2787 42.7628C56.3711 43.9322 55.1 44.7662 53.666 45.1333M48.666 38.6667C48.666 42.3486 45.6812 45.3333 41.9993 45.3333C38.3174 45.3333 35.3327 42.3486 35.3327 38.6667C35.3327 34.9848 38.3174 32 41.9993 32C45.6812 32 48.666 34.9848 48.666 38.6667Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_730_75095\">\r\n <rect width=\"40\" height=\"40\" fill=\"white\" transform=\"translate(27 27)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <div class=\"nodata-title my-3\">No pending items</div>\r\n <div class=\"nodata-sub mb-3\">Looks like there is no action item required for <span\r\n *ngIf=\"selectedRevopsType?.value==='duplicateImages'\">duplicates</span><span\r\n *ngIf=\"selectedRevopsType?.value==='employee'\">employee/staff</span> <span\r\n *ngIf=\"selectedRevopsType?.value==='houseKeeping'\">houseKeeping</span></div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Card Body -->\r\n <div *ngIf=\"selectedRevopsType?.value !== ''\" class=\"card-body mt-3 py-0\">\r\n <span class=\"cursor-pointer\" *ngIf=\"isCollapsed\" (click)=\"toggleSidebar()\" style=\"position: absolute; top: 15px; left: 0;\">\r\n <svg class=\"mt-2 ms-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M9.72714 12.6365L13.3635 9.00013L9.72714 5.36377M4.63623 12.6365L8.27259 9.00013L4.63623 5.36377\"\r\n stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <ng-container *ngFor=\"let ticket of footfallTicketsData\">\r\n <div *ngIf=\"ticket?._source as source\" class=\"my-4\">\r\n <div *ngFor=\"let original of source.duplicateImages\" class=\"mb-4\">\r\n <div *ngIf=\"source?.duplicateImages?.length\" class=\"duplicate-head my-2\">Original image</div>\r\n <div class=\"row\">\r\n <!-- \u2705 Original Image -->\r\n <div class=\"col-md-3 relative\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3\">\r\n \r\n <img [src]=\"imageUrl + original.filePath\" alt=\"\" class=\"w-100 rounded border\" />\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{ original.tempId }}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{ original.entryTime }}</div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <!-- \uD83D\uDFE8 Duplicate Images (for this original) -->\r\n <div class=\"duplicate-head my-2\">Duplicates</div>\r\n <div class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of original.data\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n <input *ngIf=\"source.status ==='pending'\" type=\"checkbox\" [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n (change)=\"onImageCheckboxChange1(img, 'duplicate')\" />\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{ img.tempId }}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{ img.entryTime }}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"source?.employee?.length\" class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of source.employee\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n \r\n <!-- Top-right Checkbox -->\r\n <input *ngIf=\"source.status ==='pending'\" type=\"checkbox\" [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n (change)=\"onImageCheckboxChange1(img, 'employee')\" />\r\n \r\n \r\n <!-- Image -->\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n \r\n <!-- Details -->\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{img.tempId}}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{img.entryTime}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"source?.houseKeeping?.length\" class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of source.houseKeeping\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n \r\n <!-- Top-right Checkbox -->\r\n <input *ngIf=\"source.status ==='pending'\" type=\"checkbox\" [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n (change)=\"onImageCheckboxChange1(img, 'housekeeping')\" />\r\n \r\n \r\n <!-- Image -->\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n \r\n <!-- Details -->\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{img.tempId}}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{img.entryTime}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <!-- <div *ngIf=\"!footfallLoading && !footfallNoData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"pageSizeFootfall\" [currentPage]=\"footfallcurrentPage\"\r\n [totalItems]=\"totalItemsFootfall\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"setFootfallpageSize()\"\r\n (pageChange)=\"onFootfallPageChange($event)\"\r\n (pageSizeChange)=\"onFootfallPageSizeChange($event)\"></lib-pagination>\r\n </div> -->\r\n </div>\r\n </div>\r\n \r\n </div>\r\n</div>\r\n\r\n<ng-template #zoomPopup let-model>\r\n <div class=\"p-4 m-4\">\r\n <div class=\"modal-header border-0 p-0 w-100 flex-column align-items-start\">\r\n \r\n <!-- Heading -->\r\n <h5 class=\"modal-title mb-2\">\r\n {{ popupType === 'approved' ? 'Approve' : 'Reject' }} Selected Images\r\n </h5>\r\n\r\n <!-- Description -->\r\n <p class=\"mb-3\">\r\n You're about to {{ popupType === 'approved' ? 'approve' : 'reject' }} the following number of selected images.\r\n </p>\r\n\r\n <!-- Count Box -->\r\n <div class=\"border border-1 rounded p-3 w-50 mb-4\">\r\n <div *ngIf=\"popupvalue === 'employee'\" class=\"fw-semibold fs-5 mb-2\">\r\n {{ employeeACCount || '--' }}\r\n </div>\r\n <div *ngIf=\"popupvalue === 'housekeeping'\" class=\"fw-semibold fs-5 mb-2\">\r\n {{ houseKeepingACCount || '--' }}\r\n </div>\r\n <div *ngIf=\"popupvalue === 'duplicate'\" class=\"fw-semibold fs-5 mb-2\">\r\n {{ duplicateACCount || '--' }}\r\n </div>\r\n <div class=\"fw-semibold text-muted fs-6 mt-2\">\r\n {{ popupvalue | titlecase }}s\r\n </div>\r\n </div>\r\n\r\n <!-- Action Buttons -->\r\n <div class=\"w-100 d-flex justify-content-end\">\r\n <button class=\"btn btn-outline me-2\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary\" (click)=\"submitValue(popupType, popupvalue)\">\r\n {{ popupType === 'approved' ? 'Approve' : 'Reject' }}\r\n </button>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n", styles: [".card-header,.header{color:var(--Gray-900, #101828);font-size:20px!important;font-style:normal;font-weight:700;line-height:30px}.sub-header{color:var(--Gray-700, #344054);font-size:14px!important;font-style:normal;font-weight:600;line-height:20px}.ellipse1{border-radius:6px;border-bottom:2px solid var(--Gray-200, #EAECF0);background:radial-gradient(206.89% 107.47% at 16.16% 32.77%,#fff6,#45bbfe33),#f2f4f7;box-shadow:0 4px 10px #0000000d}.card-title-foot{color:var(--Gray-800, #1D2939)!important;font-size:18px;font-weight:600;line-height:28px}.card-title-label{color:var(--Gray-800, #1D2939)!important;font-size:16px;font-weight:600;line-height:28px}.card-title-value{color:var(--Gray-800, #1D2939)!important;font-size:16px;font-weight:400;line-height:28px}input[type=checkbox]{width:16px!important;height:16px!important;margin:7px 5px -2px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-600, #D0D5DD)!important;box-shadow:none;font-size:.5em;text-align:center;line-height:1em;background:#fff}input[type=checkbox]{outline:1px solid var(--primary-600, #00A3FF)!important;background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:3px;padding-top:10px;padding-right:0}.rotate{rotate:180deg;transition:1s}.border-selectall{border-radius:6px!important;border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--White, #FFF)!important;padding:8px 2px}.border-selectall1{border-radius:6px!important;background:var(--White, #FFF)!important;padding:8px 2px}.border-totalfootfall{border-radius:12px;padding:4px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF)}.vl{border-left:2px solid #000;height:50px}.duplicate-head{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.img-border{border-radius:5px!important;border:2px solid var(--Gray-300, #D0D5DD)}.desc-title{color:var(--Gray-900, #101828);font-size:8px;font-weight:500;line-height:14px}.desc-value{color:var(--Gray-900, #475467);font-size:7px;font-weight:500;line-height:14px}.img-border{overflow:hidden;position:relative}.btn-resize{font-size:13px!important;height:29px!important;line-height:11px!important;padding:1px!important}.absolute{top:5px;right:5px;z-index:2}.img-src{width:25%;height:20%}.backButtonright{border-radius:1000px!important;background:var(--text-primary, #FFF)!important;padding:12px!important;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808!important;box-shadow:0 8.727px 11.636px -2.909px #10182814,0 2.909px 4.364px -1.455px #10182808!important;position:absolute;top:30px;right:-10px;z-index:0}.backButtonleft{border-radius:1000px!important;background:#fff;padding:14px!important;border:var(--Gray-300, #D0D5DD);box-shadow:0 8.727px 11.636px -2.909px #10182814,0 2.909px 4.364px -1.455px #10182808;position:absolute;top:30px;left:-20px;z-index:5}.select-wrapper{position:relative;display:inline-block;width:100%}.placeholder-overlay{position:absolute;color:var(--Gray-500, #667085);font-family:Inter;font-size:16px!important;font-style:normal;font-weight:400;top:10px;left:15px;pointer-events:none;font-size:1.1rem;z-index:1}\n"], dependencies: [{ kind: "directive", type: i6$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: ReactiveSelectComponent, selector: "lib-reactive-select", inputs: ["isDisabled", "idField", "nameField", "label", "data"], outputs: ["itemChange"] }, { kind: "component", type: GroupSelectComponent, selector: "lib-group-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "pipe", type: i6$1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i6$1.DatePipe, name: "date" }] });
2673
+ }
2674
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FootfallDicComponent, decorators: [{
2675
+ type: Component,
2676
+ args: [{ selector: "lib-footfall-dic", template: "<div *ngIf=\"footfallView\" class=\"row\">\r\n <div class=\"col-md-3 mb-3\">\r\n <div class=\"card\">\r\n <div class=\"card-header ellipse1 py-1 px-5\">\r\n <div class=\"my-0\">\r\n <h5 class=\"card-title\">{{ getFootfallSummaryData?.totalTickets !== null ?\r\n getFootfallSummaryData?.totalTickets : '--' }}</h5>\r\n <span class=\"sub-header\">Total tickets</span>\r\n </div>\r\n </div>\r\n <div class=\"card-body py-2 px-5\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-6 col-xl-9 col-md-6 my-3\">\r\n <h5 class=\"card-title\">{{ getFootfallSummaryData?.openTickets !== null ?\r\n getFootfallSummaryData?.openTickets : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Open</span>\r\n </div>\r\n <div class=\"col-lg-6 col-xl-3 col-md-6 my-3\">\r\n <h5 class=\"card-title\">{{ getFootfallSummaryData?.closedTickets !== null ?\r\n getFootfallSummaryData?.closedTickets : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Closed</span>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-md-9 mb-3\">\r\n <div class=\"card\">\r\n <div class=\"card-header ellipse1 py-1 px-5\">\r\n <div class=\"my-0\">\r\n <h5 class=\"card-title\">{{ getFootfallSummaryData?.noShopper !== null ?\r\n getFootfallSummaryData?.noShopper : '--' }}</h5>\r\n <div class=\"sub-header\">Non-Shoppers</div>\r\n </div>\r\n </div>\r\n <div class=\"card-body py-2 px-5\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-4 col-xl-5 col-md-4 my-3\">\r\n <h5 class=\"card-title\">{{ getFootfallSummaryData?.duplicateCount !== null ?\r\n getFootfallSummaryData?.duplicateCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Duplicates</span>\r\n </div>\r\n <div class=\"col-lg-4 col-xl-5 col-md-4 my-3 \">\r\n <h5 class=\"card-title \">{{ getFootfallSummaryData?.employeeCount !== null ?\r\n getFootfallSummaryData?.employeeCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header \">Employee/Staff</span>\r\n </div>\r\n <div class=\"col-lg-4 col-xl-2 col-md-4 my-3\">\r\n <h5 class=\"card-title \">{{ getFootfallSummaryData?.houseKeepingCount !== null ?\r\n getFootfallSummaryData?.houseKeepingCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Housekeeping</span>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"footfallView\" 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\">Ticket Info</span>\r\n <span class=\"text-sub mb-2\">Based on {{footfallList_req?.fromDate | date: 'dd MMM, yyyy'}} \u2013 {{footfallList_req?.toDate | date: 'dd MMM, yyyy'}} </span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" class=\"form-control ps-14 me-2\" placeholder=\"Search\" autocomplete=\"off\"\r\n (change)=\"searchData()\" [(ngModel)]=\"searchValue\" />\r\n <!-- <lib-filters [dataObject]=\"dataObject\"\r\n (appliedFilters)=\"applyFilters($event)\"></lib-filters> -->\r\n\r\n <button type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\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=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Export</span>\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <div class=\"card-body mt-3 py-0 px-0\">\r\n\r\n\r\n\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Info<svg\r\n [ngClass]=\"sortedColumn === 'storeName' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'storeName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('ticketId')\">Ticket ID<svg\r\n [ngClass]=\"sortedColumn === 'ticketId' && sortDirection === 1 ? 'rotate' : ''\"\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'ticketId' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('dateString')\">Ticket raised on\r\n <svg [ngClass]=\"sortedColumn === 'dateString' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'dateString' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('footfallCount')\">Total footfalls\r\n <svg [ngClass]=\"sortedColumn === 'footfallCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'footfallCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('duplicateCount')\">Duplicates\r\n <svg [ngClass]=\"sortedColumn === 'duplicateCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'duplicateCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('employeeCount')\">Employee/Staff\r\n <svg [ngClass]=\"sortedColumn === 'employeeCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'employeeCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('houseKeepingCount')\">Housekeeping\r\n <svg [ngClass]=\"sortedColumn === 'houseKeepingCount' && sortDirection === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'houseKeepingCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n\r\n <th>Revised footfalls\r\n \r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('status')\">Status<svg\r\n [ngClass]=\"sortedColumn === 'status' && sortDirection === 1 ? 'rotate' : ''\" width=\"16\"\r\n height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortedColumn === 'status' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <!-- <th >Actions</th> -->\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let ticket of footfallListData\">\r\n <ng-container *ngIf=\"ticket?._source as source\">\r\n <td (click)=\"dataStoreView(ticket)\">\r\n <div class=\"text-primary cursor-pointer\">{{ source.storeName }}</div>\r\n <div class=\"text-gray-500 fs-7 mt-2\">ID : {{ source.storeId }}</div>\r\n </td>\r\n \r\n <td class=\"py-7\">{{ source.ticketId }}</td>\r\n <td class=\"py-7\">{{ source.dateString | date: 'dd MMM, yyyy' }}</td>\r\n <td class=\"py-7\">{{ source.footfallCount }}</td>\r\n <td class=\"py-7\">{{ source.duplicateCount }}</td>\r\n <td class=\"py-7\">{{ source.employeeCount }}</td>\r\n <td class=\"py-7\">{{ source.houseKeepingCount }}</td>\r\n <td class=\"py-7\">\r\n {{ source.footfallCount - (source.houseKeepingCount + source.employeeCount +\r\n source.duplicateCount) }}\r\n </td>\r\n \r\n <td class=\"py-7\">\r\n <span *ngIf=\"source.status === 'open' || source.status === 'closed'\" class=\"badge mx-2\" [ngClass]=\"{\r\n 'badge-light-primary': source.status === 'open',\r\n 'badge-light-default': source.status === 'closed'\r\n }\">\r\n {{ source.status | titlecase }}\r\n </span>\r\n </td>\r\n </ng-container>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"pageSize\" [currentPage]=\"currentPage\" [totalItems]=\"totalItems\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"setpageSize()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n </div>\r\n\r\n</div>\r\n\r\n\r\n<div *ngIf=\"!footfallView\" class=\"card mt-2\">\r\n <form [formGroup]=\"filterForm\">\r\n <div class=\"row my-0\">\r\n <div class=\"col-lg-3 my-3\">\r\n <span class=\"ms-2 cursor-pointer\" (click)=\"backToNavigation()\" ><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"44\" viewBox=\"0 0 56 44\"\r\n fill=\"none\">\r\n <g filter=\"url(#filter0_d_887_4505)\">\r\n <rect x=\"2\" y=\"1\" width=\"52\" height=\"40\" rx=\"8\" fill=\"white\" />\r\n <rect x=\"2.5\" y=\"1.5\" width=\"51\" height=\"39\" rx=\"7.5\" stroke=\"#D0D5DD\" />\r\n <path d=\"M30.5 26L25.5 21L30.5 16\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_887_4505\" x=\"0\" y=\"0\" width=\"56\" height=\"44\" filterUnits=\"userSpaceOnUse\"\r\n color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\"\r\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\" />\r\n <feOffset dy=\"1\" />\r\n <feGaussianBlur stdDeviation=\"1\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_887_4505\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_887_4505\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg></span>\r\n <span class=\"card-title-foot ms-3\">Footfall Directory</span>\r\n </div>\r\n <div class=\"col-md-2 my-3\">\r\n \r\n <lib-reactive-select formControlName=\"selectedStatus\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"type\"\r\n (itemChange)=\"typeChange($event)\"></lib-reactive-select>\r\n \r\n\r\n </div>\r\n <div class=\"col-md-2 my-3\">\r\n \r\n <lib-reactive-select formControlName=\"actionStatus\" [idField]=\"'value'\" [nameField]=\"'label'\" [data]=\"pendingArray\"\r\n (itemChange)=\"pendingChange($event)\"></lib-reactive-select>\r\n \r\n </div>\r\n <div class=\"col-md-3 my-4\" >\r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(filterForm.get('ClusterList')?.value?.length)\">\r\n Select cluster\r\n </div>\r\n <lib-group-select [items]=\"ClusterList\" [disabled]=\"false\" [multi]=\"true\"\r\n [searchField]=\"'groupName'\" [idField]=\"'groupName'\" (selected)=\"ongroupSelect($event)\"\r\n [selectedValues]=\"filterForm.get('ClusterList')?.value\">\r\n </lib-group-select>\r\n </div>\r\n\r\n </div>\r\n <div class=\"col-md-2 my-4\">\r\n <div class=\"d-flex me-3\">\r\n <a (click)=\"onFilterApply()\" type=\"submit\" class=\"btn btn-sm btn-primary px-4 \"><span>Apply</span></a>\r\n </div>\r\n </div>\r\n </div>\r\n</form>\r\n</div>\r\n<div *ngIf=\"!footfallView\" class=\"row mt-3\">\r\n <div class=\"position-relative\" \r\n [ngClass]=\"isCollapsed ? 'd-none' : 'col-md-3'\" >\r\n <div class=\"card\">\r\n <div class=\"card-header border-0 pt-3 px-5\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"card-label mb-2\">Footfall Directory</span>\r\n <span class=\"text-sub mb-2\">Based on {{footfallList_req.fromDate | date: 'dd MMM, yyyy'}} \u2013 {{footfallList_req.toDate | date: 'dd MMM, yyyy'}} </span>\r\n </h3>\r\n </div>\r\n <span class=\"cursor-pointer\" (click)=\"toggleSidebar()\" style=\"position: absolute; top: 15px; right: -25px;\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"68\" height=\"68\" viewBox=\"0 0 68 68\" fill=\"none\">\r\n<g filter=\"url(#filter0_dd_778_34282)\">\r\n<rect x=\"12\" width=\"44\" height=\"44\" rx=\"22\" fill=\"white\"/>\r\n<path d=\"M33 27L28 22L33 17M40 27L35 22L40 17\" stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n</g>\r\n<defs>\r\n<filter id=\"filter0_dd_778_34282\" x=\"0\" y=\"0\" width=\"68\" height=\"68\" filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n<feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\"/>\r\n<feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/>\r\n<feMorphology radius=\"2\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_778_34282\"/>\r\n<feOffset dy=\"4\"/>\r\n<feGaussianBlur stdDeviation=\"3\"/>\r\n<feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\"/>\r\n<feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_778_34282\"/>\r\n<feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\"/>\r\n<feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_778_34282\"/>\r\n<feOffset dy=\"12\"/>\r\n<feGaussianBlur stdDeviation=\"8\"/>\r\n<feColorMatrix type=\"matrix\" values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\"/>\r\n<feBlend mode=\"normal\" in2=\"effect1_dropShadow_778_34282\" result=\"effect2_dropShadow_778_34282\"/>\r\n<feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_778_34282\" result=\"shape\"/>\r\n</filter>\r\n</defs>\r\n</svg>\r\n</span>\r\n <div class=\"text-end mt-10\">\r\n <button class=\"btn btn-outline w-25 me-3 btn-resize\" (click)=\"dataReset()\"> Reset </button>\r\n <button class=\"btn btn-primary w-25 me-5 btn-resize\" (click)=\"dataApply()\">Apply</button>\r\n </div>\r\n <div class=\"p-4 w-100 overflow-auto\">\r\n <input\r\n class=\"form-control form-control-sm mb-2 px-2 py-1 w-100\"\r\n type=\"text\"\r\n placeholder=\"Search\"\r\n [(ngModel)]=\"StoresSearchValue\"\r\n (change)=\"searchStoresData()\"\r\n/>\r\n\r\n <div class=\"mb-2 border-selectall\">\r\n <input type=\"checkbox\" [checked]=\"allSelected\" (change)=\"toggleSelectAll()\" />\r\n <label class=\"mt-2 font-semibold ms-2\">Select All {{storeCount}} Stores</label>\r\n </div>\r\n <ul class=\"list-unstyled ps-0\">\r\n <li *ngFor=\"let store of stores\" class=\"mb-5\">\r\n <input type=\"checkbox\" [checked]=\"isSelected(store)\" (change)=\"toggleStoreSelection(store)\" />\r\n {{ store?.storeName }}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <div [ngClass]=\"isCollapsed ? 'col-12' : 'col-md-9'\" >\r\n <div class=\"card\">\r\n\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <div *ngIf=\"selectedRevopsType?.value !== ''\" class=\"mb-2\">\r\n <input *ngIf=\"!footfallLoading && !footfallNoData\"\r\n type=\"checkbox\"\r\n [checked]=\"allSelectValue\"\r\n (change)=\"selectAllValue()\" />\r\n <label *ngIf=\"!footfallLoading && !footfallNoData\" class=\"mt-2 fs-6 font-semibold ms-2\">\r\n Select All (\r\n {{\r\n houseKeepingACCount > 0\r\n ? houseKeepingACCount\r\n : employeeACCount > 0\r\n ? employeeACCount\r\n : duplicateACCount > 0\r\n ? duplicateACCount\r\n : 0\r\n }}\r\n )\r\n</label>\r\n <!-- -->\r\n</div>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <form class=\"mx-4\" [formGroup]=\"form\">\r\n <lib-reactive-select formControlName=\"selectedRevopsType\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"revopsTypeArray\" (itemChange)=\"RevopsTypeChange($event)\"></lib-reactive-select>\r\n </form>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"selectedRevopsType?.value !== ''\" class=\"my-7 d-flex justify-content-end me-5\" role=\"group\">\r\n <button *ngIf=\"!footfallLoading && !footfallNoData\" [disabled]=\"checkedValue\" class=\"btn btn-outline me-1\" (click)=\"popupOpen('rejected',this.selectedRevopsType.value)\">Reject selection</button>\r\n <button *ngIf=\"!footfallLoading && !footfallNoData\" [disabled]=\"checkedValue\" class=\"btn btn-primary ms-1\" (click)=\"popupOpen('approved',this.selectedRevopsType.value)\">Approve selection</button>\r\n </div>\r\n <section *ngIf=\"selectedRevopsType?.value === ''\">\r\n <div *ngIf=\"!footfallLoading && !footfallNoData\" class=\"card-body mt-3 py-0\">\r\n\r\n <span class=\"cursor-pointer\" *ngIf=\"isCollapsed\" (click)=\"toggleSidebar()\" style=\"position: absolute; top: 15px; left: 0;\">\r\n <svg class=\"mt-2 ms-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M9.72714 12.6365L13.3635 9.00013L9.72714 5.36377M4.63623 12.6365L8.27259 9.00013L4.63623 5.36377\"\r\n stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <ng-container *ngFor=\"let ticket of footfallTicketsData\">\r\n <div *ngIf=\"ticket?._source as source\" class=\"row mb-6\">\r\n <div class=\"col-2 card-title-label my-2\">Ticket Name</div>\r\n <div class=\"col-1 font-bold my-2\">:</div>\r\n <div class=\"col-9 card-title-value my-2\">{{ source.ticketName ? (source.ticketName | titlecase) : '-' }}</div>\r\n <div class=\"col-2 card-title-label my-2\">Ticket ID</div>\r\n <div class=\"col-1 font-bold my-2\">:</div>\r\n <div class=\"col-9 card-title-value my-2\">{{ source.ticketId ? source.ticketId:'-' }}</div>\r\n <div class=\"col-2 card-title-label my-2\">Store Name</div>\r\n <div class=\"col-1 font-bold my-2\">:</div>\r\n <div class=\"col-9 card-title-value my-2\">{{ source.storeName ? source.storeName:'-' }}</div>\r\n <div class=\"col-2 card-title-label my-2\">Status</div>\r\n <div class=\"col-1 font-bold my-2\">:</div>\r\n <div class=\"col-3 my-2\"><span \r\n class=\"badge\" \r\n [ngClass]=\"{\r\n 'badge-light-primary': source.status === 'open',\r\n 'badge-secondary': source.status === 'closed',\r\n 'badge-light-warning': source.status === 'pending',\r\n 'badge-light-danger': source.status === 'rejected'\r\n }\">\r\n {{ source.status ? (source.status | titlecase) : '-' }}\r\n</span></div>\r\n \r\n <div class=\"col-2 card-title-label my-2\">Date</div>\r\n <div class=\"col-1 font-bold my-2\">:</div>\r\n <div class=\"col-3 card-title-value my-2\">{{ source.dateString ? (source.dateString | date: 'dd MMM, yyyy') :'- ' }}</div>\r\n </div>\r\n \r\n <div *ngIf=\"ticket?._source as source\" class=\"border-totalfootfall\">\r\n <div class=\"card-header ellipse1 min-h-45px py-1 px-5\">\r\n <div class=\"my-0\">\r\n <h5 class=\"card-title\">{{ source?.footfallCount !== null ?\r\n source?.footfallCount : '--' }} <span class=\"sub-header ms-2\">Total Footfall</span></h5>\r\n \r\n </div>\r\n </div>\r\n <div class=\"card-body py-2 px-5\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-3 col-xl-3 col-md-3 my-3\">\r\n <h5 class=\"card-title\">{{ source?.duplicateCount !== null ?\r\n source?.duplicateCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Duplicates</span>\r\n </div>\r\n <div class=\"col-lg-3 col-xl-3 col-md-3 my-3\">\r\n <h5 class=\"card-title\">{{ source?.employeeCount !== null ?\r\n source?.employeeCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">Employee/Staff</span>\r\n </div>\r\n \r\n <div class=\"col-lg-3 col-xl-3 col-md-3 my-3\">\r\n <h5 class=\"card-title\">{{ source?.houseKeepingCount !== null ?\r\n source?.houseKeepingCount : '--' }}</h5>\r\n <span class=\"card-title-sub-header\">House Keeping</span>\r\n </div>\r\n <div class=\"col-lg-3 col-xl-3 col-md-3 my-3 vl\">\r\n <h5 class=\"card-title\"> {{ \r\n (source.footfallCount || 0) - \r\n ((source.houseKeepingCount || 0) + \r\n (source.employeeCount || 0) + \r\n (source.duplicateCount || 0)) \r\n }}</h5>\r\n <span class=\"card-title-sub-header\">Actual footfall</span>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n \r\n \r\n <div *ngIf=\"ticket?._source as source\" class=\"my-4\">\r\n <h3 *ngIf=\"source?.duplicateImages?.length\" class=\"text-lg font-semibold mb-2\"> <span class=\"me-2\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_730_76157)\">\r\n <path\r\n d=\"M3.75 11.25H3C2.60218 11.25 2.22064 11.092 1.93934 10.8107C1.65804 10.5294 1.5 10.1478 1.5 9.75V3C1.5 2.60218 1.65804 2.22064 1.93934 1.93934C2.22064 1.65804 2.60218 1.5 3 1.5H9.75C10.1478 1.5 10.5294 1.65804 10.8107 1.93934C11.092 2.22064 11.25 2.60218 11.25 3V3.75M8.25 6.75H15C15.8284 6.75 16.5 7.42157 16.5 8.25V15C16.5 15.8284 15.8284 16.5 15 16.5H8.25C7.42157 16.5 6.75 15.8284 6.75 15V8.25C6.75 7.42157 7.42157 6.75 8.25 6.75Z\"\r\n stroke=\"#475467\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_730_76157\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>Duplicates</h3>\r\n \r\n \r\n <div *ngFor=\"let original of source.duplicateImages\" class=\"mb-4\">\r\n <div *ngIf=\"source?.duplicateImages?.length\" class=\"duplicate-head my-2\">Original image</div>\r\n <div class=\"row\">\r\n <div class=\"col-md-3 relative\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3\">\r\n \r\n <img [src]=\"imageUrl + original.filePath\" alt=\"\" class=\"w-100 rounded border\" />\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{ original.tempId }}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{ original.entryTime }}</div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"duplicate-head my-2\">Duplicates</div>\r\n <div class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of original.data\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n <input *ngIf=\"source.status ==='pending'\"\r\n type=\"checkbox\"\r\n [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n(change)=\"onImageCheckboxChange(img, 'duplicate', original)\"\r\n />\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{ img.tempId }}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{ img.entryTime }}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n \r\n <div *ngIf=\"source?.duplicateImages?.length\" class=\"my-7 d-flex justify-content-end\" role=\"group\">\r\n <button [disabled]=\"!duplicateACCount\" class=\"btn btn-outline me-1\" (click)=\"popupOpen('rejected','duplicate')\" >Reject</button>\r\n <button [disabled]=\"!duplicateACCount\" class=\"btn btn-primary ms-1\" (click)=\"popupOpen('approved','duplicate')\">Approve</button>\r\n </div>\r\n \r\n <div *ngIf=\"source?.employee?.length\" class=\"duplicate-head my-2\">Employee/Staff</div>\r\n <div class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of source.employee\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n \r\n <!-- Top-right Checkbox -->\r\n <input *ngIf=\"source.status ==='pending'\" type=\"checkbox\" [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n (change)=\"onImageCheckboxChange(img, 'employee')\" />\r\n \r\n \r\n <!-- Image -->\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n \r\n <!-- Details -->\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{img.tempId}}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{img.entryTime}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"source?.employee?.length\" class=\"my-7 d-flex justify-content-end\" role=\"group\">\r\n <button [disabled]=\"!employeeACCount\" class=\"btn btn-outline me-1\" (click)=\"popupOpen('rejected','employee')\" >Reject</button>\r\n <button [disabled]=\"!employeeACCount\" class=\"btn btn-primary ms-1\" (click)=\"popupOpen('approved','employee')\">Approve</button>\r\n </div>\r\n \r\n \r\n <div *ngIf=\"source?.houseKeeping?.length\" class=\"duplicate-head my-2\">House Keeping</div>\r\n <div class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of source.houseKeeping\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n \r\n <!-- Top-right Checkbox -->\r\n <input *ngIf=\"source.status ==='pending'\" type=\"checkbox\" [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n (change)=\"onImageCheckboxChange(img, 'housekeeping')\" />\r\n \r\n \r\n <!-- Image -->\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n \r\n <!-- Details -->\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{img.tempId}}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{img.entryTime}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"source?.houseKeeping?.length\" class=\"my-7 d-flex justify-content-end\" role=\"group\">\r\n <button [disabled]=\"!houseKeepingACCount\" class=\"btn btn-outline me-1\" (click)=\"popupOpen('reject','housekeeping')\" >Reject</button>\r\n <button [disabled]=\"!houseKeepingACCount\" class=\"btn btn-primary ms-1\" (click)=\"popupOpen('approved','housekeeping')\">Approve</button>\r\n </div>\r\n </div>\r\n \r\n </ng-container>\r\n <div *ngIf=\"!footfallLoading && !footfallNoData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"pageSizeFootfall\" [currentPage]=\"footfallcurrentPage\" [totalItems]=\"totalItemsFootfall\"\r\n [paginationSizes]=\"paginationSizes\" [pageSize]=\"setFootfallpageSize()\" (pageChange)=\"onFootfallPageChange($event)\"\r\n (pageSizeChange)=\"onFootfallPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n \r\n </div>\r\n \r\n </section>\r\n <div *ngIf=\"footfallLoading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"footfallNoData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n \r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column \" style=\"margin: 64px;border-radius: 8px;\r\nbackground: var(--Gray-50, #F9FAFB);\">\r\n <svg class=\"my-5\" xmlns=\"http://www.w3.org/2000/svg\" width=\"94\" height=\"94\" viewBox=\"0 0 94 94\" fill=\"none\">\r\n <rect x=\"7\" y=\"7\" width=\"80\" height=\"80\" rx=\"40\" fill=\"#DAF1FF\" />\r\n <rect x=\"7\" y=\"7\" width=\"80\" height=\"80\" rx=\"40\" stroke=\"#EAF8FF\" stroke-width=\"13.3333\" />\r\n <g clip-path=\"url(#clip0_730_75095)\">\r\n <path\r\n d=\"M55.3327 62V58.6667C55.3327 56.8986 54.6303 55.2029 53.3801 53.9526C52.1298 52.7024 50.4341 52 48.666 52H35.3327C33.5646 52 31.8689 52.7024 30.6186 53.9526C29.3684 55.2029 28.666 56.8986 28.666 58.6667V62M65.3327 62V58.6667C65.3316 57.1895 64.8399 55.7546 63.935 54.5872C63.03 53.4198 61.7629 52.5859 60.3327 52.2167M53.666 32.2167C55.1 32.5838 56.3711 33.4178 57.2787 34.5872C58.1864 35.7565 58.6791 37.1947 58.6791 38.675C58.6791 40.1553 58.1864 41.5935 57.2787 42.7628C56.3711 43.9322 55.1 44.7662 53.666 45.1333M48.666 38.6667C48.666 42.3486 45.6812 45.3333 41.9993 45.3333C38.3174 45.3333 35.3327 42.3486 35.3327 38.6667C35.3327 34.9848 38.3174 32 41.9993 32C45.6812 32 48.666 34.9848 48.666 38.6667Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_730_75095\">\r\n <rect width=\"40\" height=\"40\" fill=\"white\" transform=\"translate(27 27)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <div class=\"nodata-title my-3\">No pending items</div>\r\n <div class=\"nodata-sub mb-3\">Looks like there is no action item required for <span\r\n *ngIf=\"selectedRevopsType?.value==='duplicateImages'\">duplicates</span><span\r\n *ngIf=\"selectedRevopsType?.value==='employee'\">employee/staff</span> <span\r\n *ngIf=\"selectedRevopsType?.value==='houseKeeping'\">houseKeeping</span></div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Card Body -->\r\n <div *ngIf=\"selectedRevopsType?.value !== ''\" class=\"card-body mt-3 py-0\">\r\n <span class=\"cursor-pointer\" *ngIf=\"isCollapsed\" (click)=\"toggleSidebar()\" style=\"position: absolute; top: 15px; left: 0;\">\r\n <svg class=\"mt-2 ms-2\" xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M9.72714 12.6365L13.3635 9.00013L9.72714 5.36377M4.63623 12.6365L8.27259 9.00013L4.63623 5.36377\"\r\n stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <ng-container *ngFor=\"let ticket of footfallTicketsData\">\r\n <div *ngIf=\"ticket?._source as source\" class=\"my-4\">\r\n <div *ngFor=\"let original of source.duplicateImages\" class=\"mb-4\">\r\n <div *ngIf=\"source?.duplicateImages?.length\" class=\"duplicate-head my-2\">Original image</div>\r\n <div class=\"row\">\r\n <!-- \u2705 Original Image -->\r\n <div class=\"col-md-3 relative\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3\">\r\n \r\n <img [src]=\"imageUrl + original.filePath\" alt=\"\" class=\"w-100 rounded border\" />\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{ original.tempId }}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{ original.entryTime }}</div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <!-- \uD83D\uDFE8 Duplicate Images (for this original) -->\r\n <div class=\"duplicate-head my-2\">Duplicates</div>\r\n <div class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of original.data\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n <input *ngIf=\"source.status ==='pending'\" type=\"checkbox\" [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n (change)=\"onImageCheckboxChange1(img, 'duplicate')\" />\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{ img.tempId }}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{ img.entryTime }}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"source?.employee?.length\" class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of source.employee\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n \r\n <!-- Top-right Checkbox -->\r\n <input *ngIf=\"source.status ==='pending'\" type=\"checkbox\" [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n (change)=\"onImageCheckboxChange1(img, 'employee')\" />\r\n \r\n \r\n <!-- Image -->\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n \r\n <!-- Details -->\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{img.tempId}}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{img.entryTime}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"source?.houseKeeping?.length\" class=\"row\">\r\n <div class=\"col-md-3 position-relative\" *ngFor=\"let img of source.houseKeeping\">\r\n <div class=\"pb-3 img-border border border-1 h-100 rounded-3 position-relative\">\r\n \r\n <!-- Top-right Checkbox -->\r\n <input *ngIf=\"source.status ==='pending'\" type=\"checkbox\" [(ngModel)]=\"img.selected\"\r\n class=\"position-absolute absolute form-check-input\"\r\n (change)=\"onImageCheckboxChange1(img, 'housekeeping')\" />\r\n \r\n \r\n <!-- Image -->\r\n <img [src]=\"imageUrl + img.filePath\" alt=\"\" class=\"w-100 mb-2 rounded border\" />\r\n \r\n <!-- Details -->\r\n <div class=\"desc-title ms-2 mt-2\">Temp ID: {{img.tempId}}</div>\r\n <div class=\"desc-value ms-2\">Entry Time: {{img.entryTime}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <!-- <div *ngIf=\"!footfallLoading && !footfallNoData\" class=\"my-3\">\r\n <lib-pagination [itemsPerPage]=\"pageSizeFootfall\" [currentPage]=\"footfallcurrentPage\"\r\n [totalItems]=\"totalItemsFootfall\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"setFootfallpageSize()\"\r\n (pageChange)=\"onFootfallPageChange($event)\"\r\n (pageSizeChange)=\"onFootfallPageSizeChange($event)\"></lib-pagination>\r\n </div> -->\r\n </div>\r\n </div>\r\n \r\n </div>\r\n</div>\r\n\r\n<ng-template #zoomPopup let-model>\r\n <div class=\"p-4 m-4\">\r\n <div class=\"modal-header border-0 p-0 w-100 flex-column align-items-start\">\r\n \r\n <!-- Heading -->\r\n <h5 class=\"modal-title mb-2\">\r\n {{ popupType === 'approved' ? 'Approve' : 'Reject' }} Selected Images\r\n </h5>\r\n\r\n <!-- Description -->\r\n <p class=\"mb-3\">\r\n You're about to {{ popupType === 'approved' ? 'approve' : 'reject' }} the following number of selected images.\r\n </p>\r\n\r\n <!-- Count Box -->\r\n <div class=\"border border-1 rounded p-3 w-50 mb-4\">\r\n <div *ngIf=\"popupvalue === 'employee'\" class=\"fw-semibold fs-5 mb-2\">\r\n {{ employeeACCount || '--' }}\r\n </div>\r\n <div *ngIf=\"popupvalue === 'housekeeping'\" class=\"fw-semibold fs-5 mb-2\">\r\n {{ houseKeepingACCount || '--' }}\r\n </div>\r\n <div *ngIf=\"popupvalue === 'duplicate'\" class=\"fw-semibold fs-5 mb-2\">\r\n {{ duplicateACCount || '--' }}\r\n </div>\r\n <div class=\"fw-semibold text-muted fs-6 mt-2\">\r\n {{ popupvalue | titlecase }}s\r\n </div>\r\n </div>\r\n\r\n <!-- Action Buttons -->\r\n <div class=\"w-100 d-flex justify-content-end\">\r\n <button class=\"btn btn-outline me-2\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary\" (click)=\"submitValue(popupType, popupvalue)\">\r\n {{ popupType === 'approved' ? 'Approve' : 'Reject' }}\r\n </button>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n", styles: [".card-header,.header{color:var(--Gray-900, #101828);font-size:20px!important;font-style:normal;font-weight:700;line-height:30px}.sub-header{color:var(--Gray-700, #344054);font-size:14px!important;font-style:normal;font-weight:600;line-height:20px}.ellipse1{border-radius:6px;border-bottom:2px solid var(--Gray-200, #EAECF0);background:radial-gradient(206.89% 107.47% at 16.16% 32.77%,#fff6,#45bbfe33),#f2f4f7;box-shadow:0 4px 10px #0000000d}.card-title-foot{color:var(--Gray-800, #1D2939)!important;font-size:18px;font-weight:600;line-height:28px}.card-title-label{color:var(--Gray-800, #1D2939)!important;font-size:16px;font-weight:600;line-height:28px}.card-title-value{color:var(--Gray-800, #1D2939)!important;font-size:16px;font-weight:400;line-height:28px}input[type=checkbox]{width:16px!important;height:16px!important;margin:7px 5px -2px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-600, #D0D5DD)!important;box-shadow:none;font-size:.5em;text-align:center;line-height:1em;background:#fff}input[type=checkbox]{outline:1px solid var(--primary-600, #00A3FF)!important;background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:3px;padding-top:10px;padding-right:0}.rotate{rotate:180deg;transition:1s}.border-selectall{border-radius:6px!important;border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--White, #FFF)!important;padding:8px 2px}.border-selectall1{border-radius:6px!important;background:var(--White, #FFF)!important;padding:8px 2px}.border-totalfootfall{border-radius:12px;padding:4px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF)}.vl{border-left:2px solid #000;height:50px}.duplicate-head{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.img-border{border-radius:5px!important;border:2px solid var(--Gray-300, #D0D5DD)}.desc-title{color:var(--Gray-900, #101828);font-size:8px;font-weight:500;line-height:14px}.desc-value{color:var(--Gray-900, #475467);font-size:7px;font-weight:500;line-height:14px}.img-border{overflow:hidden;position:relative}.btn-resize{font-size:13px!important;height:29px!important;line-height:11px!important;padding:1px!important}.absolute{top:5px;right:5px;z-index:2}.img-src{width:25%;height:20%}.backButtonright{border-radius:1000px!important;background:var(--text-primary, #FFF)!important;padding:12px!important;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808!important;box-shadow:0 8.727px 11.636px -2.909px #10182814,0 2.909px 4.364px -1.455px #10182808!important;position:absolute;top:30px;right:-10px;z-index:0}.backButtonleft{border-radius:1000px!important;background:#fff;padding:14px!important;border:var(--Gray-300, #D0D5DD);box-shadow:0 8.727px 11.636px -2.909px #10182814,0 2.909px 4.364px -1.455px #10182808;position:absolute;top:30px;left:-20px;z-index:5}.select-wrapper{position:relative;display:inline-block;width:100%}.placeholder-overlay{position:absolute;color:var(--Gray-500, #667085);font-family:Inter;font-size:16px!important;font-style:normal;font-weight:400;top:10px;left:15px;pointer-events:none;font-size:1.1rem;z-index:1}\n"] }]
2677
+ }], ctorParameters: () => [{ type: i1$1.GlobalStateService }, { type: TicketService }, { type: i0.ChangeDetectorRef }, { type: i4.ToastService }, { type: i1$2.NgbModal }, { type: ExcelService }, { type: i6.FormBuilder }], propDecorators: { zoomPopup: [{
2678
+ type: ViewChild,
2679
+ args: ['zoomPopup']
2680
+ }] } });
2681
+
1498
2682
  class TangoManageTicketsComponent {
1499
2683
  pageInfo;
1500
2684
  route;
@@ -1604,13 +2788,13 @@ class TangoManageTicketsComponent {
1604
2788
  }
1605
2789
  });
1606
2790
  }
1607
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsComponent, deps: [{ token: i2.PageInfoService }, { token: i2$1.ActivatedRoute }, { token: i2$1.Router }, { token: i2.GlobalStateService }, { token: TicketService }], target: i0.ɵɵFactoryTarget.Component });
1608
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TangoManageTicketsComponent, selector: "lib-tango-manage-tickets", ngImport: i0, template: "<div class=\"card mb-5 py-3 px-5\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap\">\r\n <li class=\"nav-item\">\r\n <a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'installation' }\" (click)=\"Selectedtabs('installation')\"\r\n [ngClass]=\"SelectedTab === 'installation' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-3\">\r\n Installation<span class=\"mx-2 \" [ngClass]=\"SelectedTab ==='installation' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.installationCount?ticketAllCount?.installationCount:0}}</span>\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" >\r\n <a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'infra' }\" (click)=\"Selectedtabs('infra')\"\r\n [ngClass]=\"SelectedTab === 'infra' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-3\">\r\n Infra<span class=\"mx-2\" [ngClass]=\"SelectedTab ==='infra' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.infraCount?ticketAllCount?.infraCount:0}}</span>\r\n </a>\r\n </li> \r\n <li class=\"nav-item\" [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'dataMismatch' }\" (click)=\"Selectedtabs('dataMismatch')\">\r\n <a [ngClass]=\"SelectedTab ==='dataMismatch' ? 'active' :''\" class=\"nav-link cursor-pointer me-3\">Data Mismatch\r\n <span class=\"mx-2\" [ngClass]=\"SelectedTab ==='dataMismatch' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.datamismatchCount? ticketAllCount?.datamismatchCount:0}}</span></a>\r\n </li>\r\n <!-- <li *ngIf=\"this.users.userType ==='tango'\" class=\"nav-item\" [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'audit' }\" (click)=\"Selectedtabs('audit')\"><a [ngClass]=\"SelectedTab ==='audit' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-3\">Audit</a>\r\n </li> -->\r\n <li *ngIf=\"this.users.userType ==='tango'\" class=\"nav-item\" (click)=\"Selectedtabs('mat')\"><a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'mat' }\" [ngClass]=\"SelectedTab ==='mat' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-3\">Employee Mat\r\n <span class=\"mx-2 \" [ngClass]=\"SelectedTab ==='mat' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.matCount ?ticketAllCount?.matCount:0}}</span></a>\r\n </li>\r\n </ul>\r\n</div>\r\n\r\n<lib-tickets *ngIf=\"SelectedTab !=='audit'\"></lib-tickets>\r\n<lib-audit-metrics *ngIf=\"SelectedTab ==='audit'\"></lib-audit-metrics>\r\n<router-outlet></router-outlet>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.badge-num-primary{border-radius:16px!important;background:var(--Primary-50, #EAF8FF)!important;color:var(--Primary-700, #009BF3)!important;text-align:center;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}.badge-num-muted{border-radius:16px!important;background:var(--Primary-50, #F2F4F7)!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i2$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TicketsComponent, selector: "lib-tickets" }, { kind: "component", type: AuditMetricsComponent, selector: "lib-audit-metrics" }] });
2791
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsComponent, deps: [{ token: i1$1.PageInfoService }, { token: i2.ActivatedRoute }, { token: i2.Router }, { token: i1$1.GlobalStateService }, { token: TicketService }], target: i0.ɵɵFactoryTarget.Component });
2792
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TangoManageTicketsComponent, selector: "lib-tango-manage-tickets", ngImport: i0, template: "<div class=\"card mb-5 py-3 px-5\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap\">\r\n <li class=\"nav-item\">\r\n <a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'installation' }\" (click)=\"Selectedtabs('installation')\"\r\n [ngClass]=\"SelectedTab === 'installation' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-3\">\r\n Installation<span class=\"mx-2 \" [ngClass]=\"SelectedTab ==='installation' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.installationCount?ticketAllCount?.installationCount:0}}</span>\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" >\r\n <a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'infra' }\" (click)=\"Selectedtabs('infra')\"\r\n [ngClass]=\"SelectedTab === 'infra' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-3\">\r\n Infra<span class=\"mx-2\" [ngClass]=\"SelectedTab ==='infra' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.infraCount?ticketAllCount?.infraCount:0}}</span>\r\n </a>\r\n </li> \r\n <li class=\"nav-item\" [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'dataMismatch' }\" (click)=\"Selectedtabs('dataMismatch')\">\r\n <a [ngClass]=\"SelectedTab ==='dataMismatch' ? 'active' :''\" class=\"nav-link cursor-pointer me-3\">Data Mismatch\r\n <span class=\"mx-2\" [ngClass]=\"SelectedTab ==='dataMismatch' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.datamismatchCount? ticketAllCount?.datamismatchCount:0}}</span></a>\r\n </li>\r\n <!-- <li *ngIf=\"this.users.userType ==='tango'\" class=\"nav-item\" [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'audit' }\" (click)=\"Selectedtabs('audit')\"><a [ngClass]=\"SelectedTab ==='audit' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-3\">Audit</a>\r\n </li> -->\r\n <li *ngIf=\"this.users.userType ==='tango'\" class=\"nav-item\" (click)=\"Selectedtabs('mat')\"><a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'mat' }\" [ngClass]=\"SelectedTab ==='mat' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-3\">Employee Mat\r\n <span class=\"mx-2 \" [ngClass]=\"SelectedTab ==='mat' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.matCount ?ticketAllCount?.matCount:0}}</span></a>\r\n </li>\r\n<li class=\"nav-item\" (click)=\"Selectedtabs('footfall')\"><a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'footfall' }\" [ngClass]=\"SelectedTab ==='footfall' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-3\">Footfall Directory\r\n </a>\r\n <!-- <span class=\"mx-2 \" [ngClass]=\"SelectedTab ==='footfall' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.matCount ?ticketAllCount?.matCount:0}}</span> -->\r\n </li>\r\n \r\n </ul>\r\n</div>\r\n<lib-footfall-dic *ngIf=\"SelectedTab ==='footfall'\"></lib-footfall-dic>\r\n<lib-tickets *ngIf=\"SelectedTab !=='audit' && SelectedTab !=='footfall'\"></lib-tickets>\r\n<lib-audit-metrics *ngIf=\"SelectedTab ==='audit'\"></lib-audit-metrics>\r\n<router-outlet></router-outlet>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.badge-num-primary{border-radius:16px!important;background:var(--Primary-50, #EAF8FF)!important;color:var(--Primary-700, #009BF3)!important;text-align:center;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}.badge-num-muted{border-radius:16px!important;background:var(--Primary-50, #F2F4F7)!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}\n"], dependencies: [{ kind: "directive", type: i6$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TicketsComponent, selector: "lib-tickets" }, { kind: "component", type: AuditMetricsComponent, selector: "lib-audit-metrics" }, { kind: "component", type: FootfallDicComponent, selector: "lib-footfall-dic" }] });
1609
2793
  }
1610
2794
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsComponent, decorators: [{
1611
2795
  type: Component,
1612
- args: [{ selector: 'lib-tango-manage-tickets', template: "<div class=\"card mb-5 py-3 px-5\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap\">\r\n <li class=\"nav-item\">\r\n <a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'installation' }\" (click)=\"Selectedtabs('installation')\"\r\n [ngClass]=\"SelectedTab === 'installation' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-3\">\r\n Installation<span class=\"mx-2 \" [ngClass]=\"SelectedTab ==='installation' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.installationCount?ticketAllCount?.installationCount:0}}</span>\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" >\r\n <a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'infra' }\" (click)=\"Selectedtabs('infra')\"\r\n [ngClass]=\"SelectedTab === 'infra' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-3\">\r\n Infra<span class=\"mx-2\" [ngClass]=\"SelectedTab ==='infra' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.infraCount?ticketAllCount?.infraCount:0}}</span>\r\n </a>\r\n </li> \r\n <li class=\"nav-item\" [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'dataMismatch' }\" (click)=\"Selectedtabs('dataMismatch')\">\r\n <a [ngClass]=\"SelectedTab ==='dataMismatch' ? 'active' :''\" class=\"nav-link cursor-pointer me-3\">Data Mismatch\r\n <span class=\"mx-2\" [ngClass]=\"SelectedTab ==='dataMismatch' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.datamismatchCount? ticketAllCount?.datamismatchCount:0}}</span></a>\r\n </li>\r\n <!-- <li *ngIf=\"this.users.userType ==='tango'\" class=\"nav-item\" [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'audit' }\" (click)=\"Selectedtabs('audit')\"><a [ngClass]=\"SelectedTab ==='audit' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-3\">Audit</a>\r\n </li> -->\r\n <li *ngIf=\"this.users.userType ==='tango'\" class=\"nav-item\" (click)=\"Selectedtabs('mat')\"><a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'mat' }\" [ngClass]=\"SelectedTab ==='mat' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-3\">Employee Mat\r\n <span class=\"mx-2 \" [ngClass]=\"SelectedTab ==='mat' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.matCount ?ticketAllCount?.matCount:0}}</span></a>\r\n </li>\r\n </ul>\r\n</div>\r\n\r\n<lib-tickets *ngIf=\"SelectedTab !=='audit'\"></lib-tickets>\r\n<lib-audit-metrics *ngIf=\"SelectedTab ==='audit'\"></lib-audit-metrics>\r\n<router-outlet></router-outlet>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.badge-num-primary{border-radius:16px!important;background:var(--Primary-50, #EAF8FF)!important;color:var(--Primary-700, #009BF3)!important;text-align:center;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}.badge-num-muted{border-radius:16px!important;background:var(--Primary-50, #F2F4F7)!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}\n"] }]
1613
- }], ctorParameters: () => [{ type: i2.PageInfoService }, { type: i2$1.ActivatedRoute }, { type: i2$1.Router }, { type: i2.GlobalStateService }, { type: TicketService }] });
2796
+ args: [{ selector: 'lib-tango-manage-tickets', template: "<div class=\"card mb-5 py-3 px-5\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap\">\r\n <li class=\"nav-item\">\r\n <a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'installation' }\" (click)=\"Selectedtabs('installation')\"\r\n [ngClass]=\"SelectedTab === 'installation' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-3\">\r\n Installation<span class=\"mx-2 \" [ngClass]=\"SelectedTab ==='installation' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.installationCount?ticketAllCount?.installationCount:0}}</span>\r\n </a>\r\n </li>\r\n <li class=\"nav-item\" >\r\n <a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'infra' }\" (click)=\"Selectedtabs('infra')\"\r\n [ngClass]=\"SelectedTab === 'infra' ? 'active' : ''\" class=\"nav-link cursor-pointer no-border me-3\">\r\n Infra<span class=\"mx-2\" [ngClass]=\"SelectedTab ==='infra' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.infraCount?ticketAllCount?.infraCount:0}}</span>\r\n </a>\r\n </li> \r\n <li class=\"nav-item\" [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'dataMismatch' }\" (click)=\"Selectedtabs('dataMismatch')\">\r\n <a [ngClass]=\"SelectedTab ==='dataMismatch' ? 'active' :''\" class=\"nav-link cursor-pointer me-3\">Data Mismatch\r\n <span class=\"mx-2\" [ngClass]=\"SelectedTab ==='dataMismatch' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.datamismatchCount? ticketAllCount?.datamismatchCount:0}}</span></a>\r\n </li>\r\n <!-- <li *ngIf=\"this.users.userType ==='tango'\" class=\"nav-item\" [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'audit' }\" (click)=\"Selectedtabs('audit')\"><a [ngClass]=\"SelectedTab ==='audit' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-3\">Audit</a>\r\n </li> -->\r\n <li *ngIf=\"this.users.userType ==='tango'\" class=\"nav-item\" (click)=\"Selectedtabs('mat')\"><a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'mat' }\" [ngClass]=\"SelectedTab ==='mat' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-3\">Employee Mat\r\n <span class=\"mx-2 \" [ngClass]=\"SelectedTab ==='mat' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.matCount ?ticketAllCount?.matCount:0}}</span></a>\r\n </li>\r\n<li class=\"nav-item\" (click)=\"Selectedtabs('footfall')\"><a [routerLink]=\"['/manage/tickets']\" [queryParams]=\"{ type: 'footfall' }\" [ngClass]=\"SelectedTab ==='footfall' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-3\">Footfall Directory\r\n </a>\r\n <!-- <span class=\"mx-2 \" [ngClass]=\"SelectedTab ==='footfall' ? 'badge-num-primary' :'badge-num-muted'\">{{ticketAllCount?.matCount ?ticketAllCount?.matCount:0}}</span> -->\r\n </li>\r\n \r\n </ul>\r\n</div>\r\n<lib-footfall-dic *ngIf=\"SelectedTab ==='footfall'\"></lib-footfall-dic>\r\n<lib-tickets *ngIf=\"SelectedTab !=='audit' && SelectedTab !=='footfall'\"></lib-tickets>\r\n<lib-audit-metrics *ngIf=\"SelectedTab ==='audit'\"></lib-audit-metrics>\r\n<router-outlet></router-outlet>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.badge-num-primary{border-radius:16px!important;background:var(--Primary-50, #EAF8FF)!important;color:var(--Primary-700, #009BF3)!important;text-align:center;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}.badge-num-muted{border-radius:16px!important;background:var(--Primary-50, #F2F4F7)!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}\n"] }]
2797
+ }], ctorParameters: () => [{ type: i1$1.PageInfoService }, { type: i2.ActivatedRoute }, { type: i2.Router }, { type: i1$1.GlobalStateService }, { type: TicketService }] });
1614
2798
 
1615
2799
  const routes = [
1616
2800
  {
@@ -1620,7 +2804,7 @@ const routes = [
1620
2804
  ];
1621
2805
  class TangoManageTicketsRoutingModule {
1622
2806
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1623
- static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsRoutingModule, imports: [i2$1.RouterModule], exports: [RouterModule] });
2807
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsRoutingModule, imports: [i2.RouterModule], exports: [RouterModule] });
1624
2808
  static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsRoutingModule, imports: [RouterModule.forChild(routes), RouterModule] });
1625
2809
  }
1626
2810
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsRoutingModule, decorators: [{
@@ -1643,13 +2827,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
1643
2827
  class TangoManageTicketsModule {
1644
2828
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1645
2829
  static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsModule, declarations: [TangoManageTicketsComponent,
1646
- TicketsComponent, AddCsmModalComponent, CommentModelComponent, AuditMetricsComponent, ReTriggerComponent, AuditLogComponent, CountComponent], imports: [CommonModule,
2830
+ TicketsComponent, AddCsmModalComponent, CommentModelComponent, AuditMetricsComponent,
2831
+ ReTriggerComponent, AuditLogComponent, CountComponent, FootfallDicComponent,
2832
+ ReactiveSelectComponent,
2833
+ GroupSelectComponent], imports: [CommonModule,
1647
2834
  TangoManageTicketsRoutingModule,
1648
2835
  FormsModule,
2836
+ ReactiveFormsModule,
1649
2837
  CommonSharedModule] });
1650
2838
  static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsModule, imports: [CommonModule,
1651
2839
  TangoManageTicketsRoutingModule,
1652
2840
  FormsModule,
2841
+ ReactiveFormsModule,
1653
2842
  CommonSharedModule] });
1654
2843
  }
1655
2844
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageTicketsModule, decorators: [{
@@ -1657,12 +2846,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
1657
2846
  args: [{
1658
2847
  declarations: [
1659
2848
  TangoManageTicketsComponent,
1660
- TicketsComponent, AddCsmModalComponent, CommentModelComponent, AuditMetricsComponent, ReTriggerComponent, AuditLogComponent, CountComponent
2849
+ TicketsComponent, AddCsmModalComponent, CommentModelComponent, AuditMetricsComponent,
2850
+ ReTriggerComponent, AuditLogComponent, CountComponent, FootfallDicComponent,
2851
+ ReactiveSelectComponent,
2852
+ GroupSelectComponent,
1661
2853
  ],
1662
2854
  imports: [
1663
2855
  CommonModule,
1664
2856
  TangoManageTicketsRoutingModule,
1665
2857
  FormsModule,
2858
+ ReactiveFormsModule,
1666
2859
  CommonSharedModule
1667
2860
  ]
1668
2861
  }]