tango-app-ui-shared 3.3.1-plano.2 → 3.5.0-alpha.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/guards/tickets.guard.mjs +1 -1
- package/esm2022/lib/interceptors/http-auth-interceptor.mjs +144 -67
- package/esm2022/lib/modules/layout/layout.module.mjs +9 -3
- package/esm2022/lib/modules/layout/sidebar/sidebar-footer/sidebar-footer.component.mjs +1 -3
- package/esm2022/lib/modules/layout/sidebar/sidebar-menu/sidebar-menu.component.mjs +3 -10
- package/esm2022/lib/modules/layout/toolbar/metrics-header/metrics-header.component.mjs +1321 -0
- package/esm2022/lib/modules/layout/toolbar/single-clientstore-date/single-clientstore-date.component.mjs +11 -0
- package/esm2022/lib/modules/layout/toolbar/single-store/single-store.component.mjs +3 -3
- package/esm2022/lib/modules/layout/toolbar/single-storedate/single-storedate.component.mjs +69 -33
- package/esm2022/lib/modules/layout/toolbar/toolbar.component.mjs +51 -60
- package/esm2022/lib/modules/layout/toolbar/traffic-header/traffic-header/traffic-header.component.mjs +2 -3
- package/esm2022/lib/services/auth.service.mjs +23 -8
- package/fesm2022/tango-app-ui-shared.mjs +1751 -320
- package/fesm2022/tango-app-ui-shared.mjs.map +1 -1
- package/lib/interceptors/http-auth-interceptor.d.ts +1 -0
- package/lib/modules/layout/layout.module.d.ts +12 -10
- package/lib/modules/layout/sidebar/sidebar-menu/sidebar-menu.component.d.ts +0 -2
- package/lib/modules/layout/toolbar/metrics-header/metrics-header.component.d.ts +103 -0
- package/lib/modules/layout/toolbar/single-clientstore-date/single-clientstore-date.component.d.ts +5 -0
- package/lib/modules/layout/toolbar/single-storedate/single-storedate.component.d.ts +6 -2
- package/lib/modules/layout/toolbar/toolbar.component.d.ts +3 -1
- package/lib/services/auth.service.d.ts +6 -2
- package/package.json +1 -1
|
@@ -44,7 +44,6 @@ class AuthService {
|
|
|
44
44
|
trafficApiUrl;
|
|
45
45
|
traxUrl;
|
|
46
46
|
galleryApiUrl;
|
|
47
|
-
storeBuilderApiUrl;
|
|
48
47
|
constructor(router, gs, http) {
|
|
49
48
|
this.router = router;
|
|
50
49
|
this.gs = gs;
|
|
@@ -61,7 +60,6 @@ class AuthService {
|
|
|
61
60
|
this.galleryApiUrl = env.galleryApiUrl;
|
|
62
61
|
this.traxUrl = env.trafficApiUrl;
|
|
63
62
|
this.traxUrl = env.traxUrl;
|
|
64
|
-
this.storeBuilderApiUrl = env.storeBuilderUrl;
|
|
65
63
|
}
|
|
66
64
|
});
|
|
67
65
|
}
|
|
@@ -75,9 +73,8 @@ class AuthService {
|
|
|
75
73
|
return headers;
|
|
76
74
|
}
|
|
77
75
|
logout() {
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
});
|
|
76
|
+
this.deleteCookie(this.authlocalStorageToken);
|
|
77
|
+
return this.http.get(`${this.userApiUrl}/logout`);
|
|
81
78
|
}
|
|
82
79
|
getClients() {
|
|
83
80
|
return this.http.get(`${this.clientApiUrl}/get-clients`, {})
|
|
@@ -150,8 +147,26 @@ class AuthService {
|
|
|
150
147
|
getCountry(data) {
|
|
151
148
|
return this.http.post(`${this.trafficApiUrl}/headerCountry_v2`, data);
|
|
152
149
|
}
|
|
153
|
-
|
|
154
|
-
return this.http.
|
|
150
|
+
getHeaderZone(data) {
|
|
151
|
+
return this.http.post(`${this.trafficApiUrl}/headerZoneV2`, data);
|
|
152
|
+
}
|
|
153
|
+
base64Encode(str) {
|
|
154
|
+
return btoa(encodeURIComponent(str));
|
|
155
|
+
}
|
|
156
|
+
base64Decode(str) {
|
|
157
|
+
return decodeURIComponent(atob(str));
|
|
158
|
+
}
|
|
159
|
+
setCookie(name, value, days = 1) {
|
|
160
|
+
const encodedValue = this.base64Encode(value);
|
|
161
|
+
const expires = new Date(Date.now() + days * 864e5).toUTCString();
|
|
162
|
+
document.cookie = `${name}=${encodedValue}; expires=${expires}; path=/; Secure; SameSite=Strict`;
|
|
163
|
+
}
|
|
164
|
+
getCookie(name) {
|
|
165
|
+
const match = document.cookie.match(new RegExp(`(^| )${name}=([^;]+)`));
|
|
166
|
+
return match ? this.base64Decode(match[2]) : null;
|
|
167
|
+
}
|
|
168
|
+
deleteCookie(name) {
|
|
169
|
+
document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`;
|
|
155
170
|
}
|
|
156
171
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuthService, deps: [{ token: i2.Router }, { token: i1.GlobalStateService }, { token: i3.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
157
172
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuthService, providedIn: 'root' });
|
|
@@ -3264,11 +3279,11 @@ class SingleStoreComponent {
|
|
|
3264
3279
|
}
|
|
3265
3280
|
}
|
|
3266
3281
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SingleStoreComponent, deps: [{ token: AuthService }, { token: i1.GlobalStateService }, { token: i0.ChangeDetectorRef }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
3267
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SingleStoreComponent, selector: "lib-single-store", inputs: { urlString: "urlString" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"URL[2] !=='controlcenter'\" class=\"wrapper mx-2\" >\r\n <lib-select [items]=\"storeList\" [multi]=\"false\" [searchField]=\"'storeName'\" [disabled]=\"false\" [idField]=\"'storeId'\"\r\n (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select> \r\n</div>\r\n\r\n<div *ngIf=\"URL[2] !=='controlcenter'
|
|
3282
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SingleStoreComponent, selector: "lib-single-store", inputs: { urlString: "urlString" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"URL[2] !=='controlcenter'\" class=\"wrapper mx-2\" >\r\n <lib-select [items]=\"storeList\" [multi]=\"false\" [searchField]=\"'storeName'\" [disabled]=\"false\" [idField]=\"'storeId'\"\r\n (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select> \r\n</div>\r\n\r\n<div *ngIf=\"URL[2] !=='controlcenter'\" 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=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" style=\"min-width: 260px !important;\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\" [autoApply]=\"true\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n</div>\r\n<div *ngIf=\"URL[2] ==='controlcenter' && urlString.includes('playback')\" class=\"d-flex align-items-center w-150px 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=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [showCustomRangeLabel]=\"false\" [alwaysShowCalendars]=\"false\" [autoApply]=\"true\" [singleDatePicker]=\"true\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1}\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n</div>\r\n\r\n<div *ngIf=\"URL[2] !=='controlcenter'\">\r\n <div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\r\n</div>\r\n\r\n\r\n", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:365px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { 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: "directive", type: i7.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
|
|
3268
3283
|
}
|
|
3269
3284
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SingleStoreComponent, decorators: [{
|
|
3270
3285
|
type: Component,
|
|
3271
|
-
args: [{ selector: 'lib-single-store', template: "<div *ngIf=\"URL[2] !=='controlcenter'\" class=\"wrapper mx-2\" >\r\n <lib-select [items]=\"storeList\" [multi]=\"false\" [searchField]=\"'storeName'\" [disabled]=\"false\" [idField]=\"'storeId'\"\r\n (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select> \r\n</div>\r\n\r\n<div *ngIf=\"URL[2] !=='controlcenter'
|
|
3286
|
+
args: [{ selector: 'lib-single-store', template: "<div *ngIf=\"URL[2] !=='controlcenter'\" class=\"wrapper mx-2\" >\r\n <lib-select [items]=\"storeList\" [multi]=\"false\" [searchField]=\"'storeName'\" [disabled]=\"false\" [idField]=\"'storeId'\"\r\n (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select> \r\n</div>\r\n\r\n<div *ngIf=\"URL[2] !=='controlcenter'\" 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=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" style=\"min-width: 260px !important;\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\" [autoApply]=\"true\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n</div>\r\n<div *ngIf=\"URL[2] ==='controlcenter' && urlString.includes('playback')\" class=\"d-flex align-items-center w-150px 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=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [showCustomRangeLabel]=\"false\" [alwaysShowCalendars]=\"false\" [autoApply]=\"true\" [singleDatePicker]=\"true\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1}\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n</div>\r\n\r\n<div *ngIf=\"URL[2] !=='controlcenter'\">\r\n <div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\r\n</div>\r\n\r\n\r\n", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:365px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"] }]
|
|
3272
3287
|
}], ctorParameters: () => [{ type: AuthService }, { type: i1.GlobalStateService }, { type: i0.ChangeDetectorRef }, { type: i2.Router }], propDecorators: { urlString: [{
|
|
3273
3288
|
type: Input
|
|
3274
3289
|
}] } });
|
|
@@ -3697,7 +3712,7 @@ class TrafficHeaderComponent {
|
|
|
3697
3712
|
? ''
|
|
3698
3713
|
: selectedLocations.length === 1
|
|
3699
3714
|
? selectedLocations[0]
|
|
3700
|
-
: `${selectedLocations.length}
|
|
3715
|
+
: `${selectedLocations.length} locations`;
|
|
3701
3716
|
}
|
|
3702
3717
|
removeLocation() {
|
|
3703
3718
|
this.Reset();
|
|
@@ -3992,7 +4007,6 @@ class TrafficHeaderComponent {
|
|
|
3992
4007
|
this.locations = [];
|
|
3993
4008
|
this.groupsData = [];
|
|
3994
4009
|
this.stores = [];
|
|
3995
|
-
this.countries = [];
|
|
3996
4010
|
// Clear search input fields
|
|
3997
4011
|
this.searchLocationText = "";
|
|
3998
4012
|
this.searchGroupText = "";
|
|
@@ -5197,6 +5211,7 @@ class SingleStoredateComponent {
|
|
|
5197
5211
|
gs;
|
|
5198
5212
|
cd;
|
|
5199
5213
|
router;
|
|
5214
|
+
activatedRoute;
|
|
5200
5215
|
dayjs = dayjs;
|
|
5201
5216
|
isCustomDate = (m) => {
|
|
5202
5217
|
const isValidDate = m > this.dayjs();
|
|
@@ -5216,52 +5231,85 @@ class SingleStoredateComponent {
|
|
|
5216
5231
|
URL;
|
|
5217
5232
|
baseurl;
|
|
5218
5233
|
users;
|
|
5219
|
-
|
|
5234
|
+
headerFilters;
|
|
5235
|
+
dataUser;
|
|
5236
|
+
constructor(auth, gs, cd, router, activatedRoute) {
|
|
5220
5237
|
this.auth = auth;
|
|
5221
5238
|
this.gs = gs;
|
|
5222
5239
|
this.cd = cd;
|
|
5223
5240
|
this.router = router;
|
|
5241
|
+
this.activatedRoute = activatedRoute;
|
|
5224
5242
|
}
|
|
5225
5243
|
ngOnInit() {
|
|
5244
|
+
this.activatedRoute?.queryParams.subscribe(params => {
|
|
5245
|
+
this.dataUser = params;
|
|
5246
|
+
// Re-check date after params load
|
|
5247
|
+
this.initializeFilters();
|
|
5248
|
+
});
|
|
5226
5249
|
if ("user-info" in localStorage) {
|
|
5227
5250
|
const userData = JSON.parse(localStorage.getItem("user-info") || "{}");
|
|
5228
5251
|
this.users = userData;
|
|
5229
5252
|
}
|
|
5230
|
-
|
|
5231
|
-
|
|
5232
|
-
|
|
5233
|
-
|
|
5234
|
-
|
|
5235
|
-
|
|
5253
|
+
}
|
|
5254
|
+
initializeFilters() {
|
|
5255
|
+
const clientFromRoute = this.dataUser?.client;
|
|
5256
|
+
const clientFromHeader = localStorage.getItem("header-filters")
|
|
5257
|
+
? JSON.parse(localStorage.getItem("header-filters") || "{}").client
|
|
5258
|
+
: null;
|
|
5259
|
+
const clientFromUser = this.users?.clientId;
|
|
5260
|
+
const headerFilters = localStorage.getItem("header-filters")
|
|
5261
|
+
? JSON.parse(localStorage.getItem("header-filters") || "{}")
|
|
5262
|
+
: {};
|
|
5263
|
+
this.headerFilters = headerFilters;
|
|
5264
|
+
// Determine final client ID
|
|
5265
|
+
const finalClient = clientFromRoute ?? clientFromHeader ?? clientFromUser;
|
|
5266
|
+
this.selectedFilters.client = finalClient;
|
|
5267
|
+
this.selectedFilters.clients = finalClient ? [finalClient] : [];
|
|
5268
|
+
this.selectedFilters.clientName = headerFilters.clientName || "";
|
|
5269
|
+
this.selectedFilters.store = this.dataUser?.storeId ?? headerFilters.store ?? "";
|
|
5270
|
+
this.selectedFilters.storeName = headerFilters.storeName || "";
|
|
5271
|
+
this.selectedFilters.group = headerFilters.group;
|
|
5272
|
+
this.selectedFilters.location = headerFilters.location;
|
|
5273
|
+
this.selectedFilters.country = headerFilters.country;
|
|
5274
|
+
this.selectedFilters.stores = headerFilters.stores ?? "";
|
|
5275
|
+
this.selectedFilters.zoneName = headerFilters.zoneName ?? "";
|
|
5276
|
+
// ✅ Handle query param date if present
|
|
5277
|
+
if (this.dataUser?.date) {
|
|
5278
|
+
const date = this.dataUser.date;
|
|
5279
|
+
this.selectedFilters.date = {
|
|
5280
|
+
startDate: date,
|
|
5281
|
+
endDate: date,
|
|
5282
|
+
};
|
|
5283
|
+
this.selectedDateRange = {
|
|
5284
|
+
startDate: this.dayjs(date, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
5285
|
+
endDate: this.dayjs(date, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
5286
|
+
};
|
|
5287
|
+
}
|
|
5288
|
+
else if (headerFilters?.date?.startDate && headerFilters?.date?.endDate) {
|
|
5236
5289
|
this.selectedFilters.date = headerFilters.date;
|
|
5237
|
-
this.selectedFilters.storeName = headerFilters.storeName;
|
|
5238
5290
|
this.selectedDateRange = {
|
|
5239
|
-
startDate: this.dayjs(headerFilters
|
|
5240
|
-
endDate: this.dayjs(headerFilters
|
|
5291
|
+
startDate: this.dayjs(headerFilters.date.startDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
5292
|
+
endDate: this.dayjs(headerFilters.date.endDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
5241
5293
|
};
|
|
5242
|
-
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
5243
|
-
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
5244
5294
|
}
|
|
5245
5295
|
else {
|
|
5246
|
-
|
|
5247
|
-
|
|
5248
|
-
|
|
5249
|
-
startDate:
|
|
5250
|
-
endDate:
|
|
5296
|
+
// Default to yesterday
|
|
5297
|
+
const yesterday = this.dayjs().subtract(1, "days");
|
|
5298
|
+
const formattedDate = {
|
|
5299
|
+
startDate: yesterday.format("YYYY-MM-DD"),
|
|
5300
|
+
endDate: yesterday.format("YYYY-MM-DD"),
|
|
5251
5301
|
};
|
|
5252
|
-
|
|
5253
|
-
|
|
5254
|
-
startDate:
|
|
5255
|
-
endDate:
|
|
5302
|
+
this.selectedFilters.date = formattedDate;
|
|
5303
|
+
this.selectedDateRange = {
|
|
5304
|
+
startDate: yesterday.format("DD-MM-YYYY"),
|
|
5305
|
+
endDate: yesterday.format("DD-MM-YYYY"),
|
|
5256
5306
|
};
|
|
5257
|
-
|
|
5258
|
-
|
|
5259
|
-
|
|
5260
|
-
// };
|
|
5261
|
-
this.selectedFilters.date = datetime;
|
|
5307
|
+
}
|
|
5308
|
+
// Save only if valid
|
|
5309
|
+
if (finalClient && this.selectedFilters.date?.startDate && this.selectedFilters.store) {
|
|
5262
5310
|
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
5263
|
-
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
5264
5311
|
}
|
|
5312
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
5265
5313
|
}
|
|
5266
5314
|
onClientSelect(event) {
|
|
5267
5315
|
this.selectedClient = event;
|
|
@@ -5291,12 +5339,14 @@ class SingleStoredateComponent {
|
|
|
5291
5339
|
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
5292
5340
|
this.selectedFilters.date = headerFilters.date;
|
|
5293
5341
|
}
|
|
5294
|
-
this.
|
|
5295
|
-
this.selectedFilters.
|
|
5342
|
+
const clientId = this.users?.clientId ?? this.dataUser?.client ?? this.selectedFilters.client;
|
|
5343
|
+
this.selectedFilters.client = clientId;
|
|
5344
|
+
this.selectedFilters.clients = clientId ? [clientId] : [this.selectedFilters.client];
|
|
5296
5345
|
this.selectedFilters.date = this.selectedFilters.date;
|
|
5297
|
-
this.selectedFilters.storeName = this.selectedFilters.storeName;
|
|
5346
|
+
this.selectedFilters.storeName = this.selectedFilters.storeName || '';
|
|
5298
5347
|
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
5299
5348
|
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
5349
|
+
this.cd.detectChanges();
|
|
5300
5350
|
}
|
|
5301
5351
|
Apply() {
|
|
5302
5352
|
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
@@ -5305,13 +5355,13 @@ class SingleStoredateComponent {
|
|
|
5305
5355
|
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
5306
5356
|
localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
|
|
5307
5357
|
}
|
|
5308
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SingleStoredateComponent, deps: [{ token: AuthService }, { token: i1.GlobalStateService }, { token: i0.ChangeDetectorRef }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
5358
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SingleStoredateComponent, deps: [{ token: AuthService }, { token: i1.GlobalStateService }, { token: i0.ChangeDetectorRef }, { token: i2.Router }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
5309
5359
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SingleStoredateComponent, selector: "lib-single-storedate", ngImport: i0, template: "\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=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" style=\"width:165px !important\" type=\"text\" matInput ngxDaterangepickerMd [singleDatePicker]=\"true\" [drops]=\"'down'\"\r\n [opens]=\"'left'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" [autoApply]=\"true\"/>\r\n</div>\r\n\r\n<!-- <div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div> -->", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:365px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\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"] }, { kind: "directive", type: i7.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
|
|
5310
5360
|
}
|
|
5311
5361
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SingleStoredateComponent, decorators: [{
|
|
5312
5362
|
type: Component,
|
|
5313
5363
|
args: [{ selector: 'lib-single-storedate', template: "\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=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" style=\"width:165px !important\" type=\"text\" matInput ngxDaterangepickerMd [singleDatePicker]=\"true\" [drops]=\"'down'\"\r\n [opens]=\"'left'\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" [autoApply]=\"true\"/>\r\n</div>\r\n\r\n<!-- <div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div> -->", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:365px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"] }]
|
|
5314
|
-
}], ctorParameters: () => [{ type: AuthService }, { type: i1.GlobalStateService }, { type: i0.ChangeDetectorRef }, { type: i2.Router }] });
|
|
5364
|
+
}], ctorParameters: () => [{ type: AuthService }, { type: i1.GlobalStateService }, { type: i0.ChangeDetectorRef }, { type: i2.Router }, { type: i2.ActivatedRoute }] });
|
|
5315
5365
|
|
|
5316
5366
|
class TraxWithoutdateComponent {
|
|
5317
5367
|
auth;
|
|
@@ -6817,207 +6867,1513 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
6817
6867
|
args: ["document:click", ["$event"]]
|
|
6818
6868
|
}] } });
|
|
6819
6869
|
|
|
6820
|
-
class
|
|
6821
|
-
|
|
6870
|
+
class MetricsHeaderComponent {
|
|
6871
|
+
auth;
|
|
6822
6872
|
router;
|
|
6823
|
-
route;
|
|
6824
6873
|
gs;
|
|
6825
|
-
|
|
6826
|
-
|
|
6827
|
-
|
|
6828
|
-
|
|
6829
|
-
|
|
6830
|
-
|
|
6831
|
-
|
|
6832
|
-
|
|
6833
|
-
|
|
6834
|
-
|
|
6835
|
-
appToolbarFixedMobile;
|
|
6836
|
-
appPageTitleDisplay;
|
|
6837
|
-
// page title
|
|
6838
|
-
appPageTitleDirection = "";
|
|
6839
|
-
appPageTitleCSSClass = "";
|
|
6840
|
-
appPageTitleBreadcrumb;
|
|
6841
|
-
appPageTitleDescription;
|
|
6842
|
-
querParams;
|
|
6843
|
-
singleSelect;
|
|
6844
|
-
multiSelect;
|
|
6845
|
-
datepicker;
|
|
6846
|
-
singleSelectdatepicker;
|
|
6847
|
-
singleStore;
|
|
6848
|
-
headervalue;
|
|
6849
|
-
storeId;
|
|
6850
|
-
users;
|
|
6874
|
+
cd;
|
|
6875
|
+
dayjs = dayjs;
|
|
6876
|
+
isCustomDate = (m) => {
|
|
6877
|
+
const isValidDate = m > this.dayjs();
|
|
6878
|
+
return isValidDate ? "invalid-date" : false;
|
|
6879
|
+
};
|
|
6880
|
+
selectedDateRange = {
|
|
6881
|
+
startDate: dayjs().subtract(30, "days"),
|
|
6882
|
+
endDate: dayjs().subtract(1, "days"),
|
|
6883
|
+
};
|
|
6851
6884
|
selectedFilters = {
|
|
6852
6885
|
client: null,
|
|
6886
|
+
clientName: null,
|
|
6853
6887
|
clients: [],
|
|
6854
6888
|
store: null,
|
|
6855
6889
|
stores: [],
|
|
6856
6890
|
date: null,
|
|
6891
|
+
group: [],
|
|
6892
|
+
location: [],
|
|
6893
|
+
country: [],
|
|
6894
|
+
zoneName: [],
|
|
6857
6895
|
};
|
|
6858
|
-
|
|
6859
|
-
|
|
6860
|
-
|
|
6861
|
-
|
|
6862
|
-
|
|
6863
|
-
|
|
6864
|
-
|
|
6865
|
-
|
|
6896
|
+
Opendropdown = false;
|
|
6897
|
+
dropdownOpen = null; // 'location' or 'group'
|
|
6898
|
+
searchLocationText = "";
|
|
6899
|
+
searchGroupText = "";
|
|
6900
|
+
locations = [];
|
|
6901
|
+
filteredLocations = [];
|
|
6902
|
+
groupsData = [];
|
|
6903
|
+
filteredGroups = [];
|
|
6904
|
+
filteredStores = [];
|
|
6905
|
+
filteredZones = [];
|
|
6906
|
+
stores = [];
|
|
6907
|
+
zones = [];
|
|
6908
|
+
searchStoreText = "";
|
|
6909
|
+
searchZoneText = "";
|
|
6910
|
+
clientList = [];
|
|
6911
|
+
selectedClient;
|
|
6912
|
+
locationLabel = [];
|
|
6913
|
+
groupLabel = [];
|
|
6914
|
+
users;
|
|
6915
|
+
url;
|
|
6916
|
+
filteredCountries = [];
|
|
6917
|
+
countryLabel = [];
|
|
6918
|
+
searchCountryText = "";
|
|
6919
|
+
countries = [];
|
|
6920
|
+
constructor(auth, router, gs, cd) {
|
|
6921
|
+
this.auth = auth;
|
|
6866
6922
|
this.router = router;
|
|
6867
|
-
this.route = route;
|
|
6868
6923
|
this.gs = gs;
|
|
6869
|
-
this.
|
|
6870
|
-
}
|
|
6871
|
-
ngOnInit() {
|
|
6872
|
-
if ("user-info" in localStorage) {
|
|
6873
|
-
const userData = JSON.parse(localStorage.getItem("user-info") || "{}");
|
|
6874
|
-
this.users = userData;
|
|
6875
|
-
}
|
|
6876
|
-
if ("header-filters" in localStorage) {
|
|
6877
|
-
const data = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
6878
|
-
this.client = data?.client;
|
|
6879
|
-
}
|
|
6880
|
-
this.getUserInfo(this.client ? this.client : this.users.client);
|
|
6881
|
-
this.showPageTitle();
|
|
6882
|
-
const subscr = this.layout.layoutConfigSubject
|
|
6883
|
-
.asObservable()
|
|
6884
|
-
.subscribe((config) => {
|
|
6885
|
-
this.updateProps(config);
|
|
6886
|
-
});
|
|
6887
|
-
this.unsubscribe.push(subscr);
|
|
6924
|
+
this.cd = cd;
|
|
6888
6925
|
}
|
|
6889
|
-
|
|
6890
|
-
|
|
6891
|
-
if (!
|
|
6892
|
-
|
|
6893
|
-
}
|
|
6894
|
-
this.appPageTitleDisplay = this.layout.getProp("app.pageTitle.display", config);
|
|
6895
|
-
this.appToolbarContainer = this.layout.getProp("app.toolbar.container", config);
|
|
6896
|
-
this.appToolbarContainerCSSClass =
|
|
6897
|
-
this.appToolbarContainer === "fixed"
|
|
6898
|
-
? "container-xxl"
|
|
6899
|
-
: "container-fluid";
|
|
6900
|
-
const containerClass = this.layout.getProp("app.toolbar.containerClass", config);
|
|
6901
|
-
if (containerClass) {
|
|
6902
|
-
this.appToolbarContainerCSSClass += ` ${containerClass}`;
|
|
6903
|
-
}
|
|
6904
|
-
this.appToolbarFixedDesktop = this.layout.getProp("app.toolbar.fixed.desktop", config);
|
|
6905
|
-
if (this.appToolbarFixedDesktop) {
|
|
6906
|
-
document.body.setAttribute("data-kt-app-toolbar-fixed", "true");
|
|
6907
|
-
}
|
|
6908
|
-
this.appToolbarFixedMobile = this.layout.getProp("app.toolbar.fixed.mobile", config);
|
|
6909
|
-
if (this.appToolbarFixedMobile) {
|
|
6910
|
-
document.body.setAttribute("data-kt-app-toolbar-fixed-mobile", "true");
|
|
6926
|
+
onClick(event) {
|
|
6927
|
+
const target = event.target;
|
|
6928
|
+
if (!target.closest(".dropdown2")) {
|
|
6929
|
+
this.Opendropdown = false;
|
|
6911
6930
|
}
|
|
6912
|
-
// toolbar
|
|
6913
|
-
this.appPageTitleDirection = this.layout.getProp("app.pageTitle.direction", config);
|
|
6914
|
-
this.appPageTitleCSSClass = this.layout.getProp("app.pageTitle.class", config);
|
|
6915
|
-
this.appPageTitleBreadcrumb = this.layout.getProp("app.pageTitle.breadCrumb", config);
|
|
6916
|
-
this.appPageTitleDescription = this.layout.getProp("app.pageTitle.description", config);
|
|
6917
|
-
document.body.setAttribute("data-kt-app-toolbar-enabled", "true");
|
|
6918
6931
|
}
|
|
6919
|
-
|
|
6920
|
-
|
|
6921
|
-
this.unsubscribe.forEach((sb) => sb.unsubscribe());
|
|
6922
|
-
this.destroy$.next(true);
|
|
6923
|
-
this.destroy$.complete();
|
|
6924
|
-
// localStorage.removeItem("usersEmail-info");
|
|
6932
|
+
closeDropdown1() {
|
|
6933
|
+
this.Opendropdown = false;
|
|
6925
6934
|
}
|
|
6926
|
-
|
|
6927
|
-
|
|
6928
|
-
|
|
6929
|
-
|
|
6930
|
-
|
|
6931
|
-
|
|
6932
|
-
|
|
6933
|
-
|
|
6934
|
-
|
|
6935
|
-
|
|
6936
|
-
|
|
6937
|
-
|
|
6938
|
-
|
|
6939
|
-
|
|
6940
|
-
|
|
6941
|
-
// this.router.navigate([URL])
|
|
6942
|
-
}
|
|
6943
|
-
const url = URL.split("?")[0].split('/');
|
|
6944
|
-
this.urlString = URL;
|
|
6945
|
-
if (this.users?.userType === "tango") {
|
|
6946
|
-
if (url[2] == "settings" || URL == "/manage/users/client" ||
|
|
6947
|
-
URL == "/manage/stores" || URL === "/manage/stores?type=stores" || URL === "/manage/stores?type=clusters" ||
|
|
6948
|
-
URL == "/manage/stores/addition-method" ||
|
|
6949
|
-
URL == "/manage/stores/add-single-store" || URL === "/manage/trax/gallery" || URL == "/notifications/alerts?tab=alert" || URL == "/notifications/alerts?tab=download" || URL === "/manage/trax/audit") {
|
|
6950
|
-
this.setUIProperties(true, false, false, false, false, false, false, false, false, false);
|
|
6951
|
-
}
|
|
6952
|
-
else if (url[3] == "edge-app") {
|
|
6953
|
-
this.setUIProperties(false, false, false, false, true, false, false, false, false, false);
|
|
6954
|
-
}
|
|
6955
|
-
else if (URL == `/manage/stores/infra-ticket?storeId=${this.storeId}` || URL == `/manage/stores/infra-ticket?storeId=${this.storeId}&type=infra` ||
|
|
6956
|
-
URL == `/manage/stores/settings?storeId=${this.storeId}` || URL == `/manage/stores/infra-ticket?storeId=${this.storeId}&type=dataMismatch` ||
|
|
6957
|
-
URL == `/manage/stores/zones?storeId=${this.storeId}` ||
|
|
6958
|
-
URL == `/manage/stores/cameras?storeId=${this.storeId}` ||
|
|
6959
|
-
// URL == `/manage/stores/infrastructure?storeId=${this.storeId}` ||
|
|
6960
|
-
URL == `/manage/stores/mat?storeId=${this.storeId}`) {
|
|
6961
|
-
this.setUIProperties(false, false, false, true, false, false, false, false, false, false);
|
|
6962
|
-
}
|
|
6963
|
-
else if (URL == "/tickets/stores" || URL == "/manage/users/tango/audit") {
|
|
6964
|
-
this.setUIProperties(false, false, true, false, false, false, false, false, false, false);
|
|
6965
|
-
}
|
|
6966
|
-
else if (url[2] === 'controlcenter') {
|
|
6967
|
-
if (URL == `/manage/controlcenter/playback?storeId=${this.storeId}` || URL == `/manage/controlcenter/playback`) {
|
|
6968
|
-
this.setUIProperties(false, false, false, false, false, false, false, false, true, false);
|
|
6935
|
+
ngOnInit() {
|
|
6936
|
+
// this.setRangesBasedOnRoute();
|
|
6937
|
+
// Listen for route changes to update ranges
|
|
6938
|
+
// this.router?.events?.subscribe((event) => {
|
|
6939
|
+
// if (event instanceof NavigationEnd) {
|
|
6940
|
+
// this.setRangesBasedOnRoute();
|
|
6941
|
+
// }
|
|
6942
|
+
// });
|
|
6943
|
+
this.url = this.router.url.split("?")[0].split("/");
|
|
6944
|
+
const user = JSON.parse(localStorage.getItem("user-info"));
|
|
6945
|
+
this.users = user;
|
|
6946
|
+
this.gs?.manageRefreshTrigger?.subscribe((e) => {
|
|
6947
|
+
if (e) {
|
|
6948
|
+
if (user.userType === "tango") {
|
|
6949
|
+
this.getClient();
|
|
6969
6950
|
}
|
|
6970
6951
|
else {
|
|
6971
|
-
|
|
6952
|
+
const storedFilters = localStorage.getItem("header-filters");
|
|
6953
|
+
if (storedFilters) {
|
|
6954
|
+
const headerFilters = JSON.parse(storedFilters);
|
|
6955
|
+
this.filteredStores = headerFilters?.stores.map((store) => ({
|
|
6956
|
+
...store,
|
|
6957
|
+
checked: store.checked,
|
|
6958
|
+
}));
|
|
6959
|
+
this.filteredZones = headerFilters?.zoneName.map((store) => ({
|
|
6960
|
+
...store,
|
|
6961
|
+
checked: store.checked,
|
|
6962
|
+
}));
|
|
6963
|
+
}
|
|
6972
6964
|
}
|
|
6973
6965
|
}
|
|
6974
|
-
|
|
6975
|
-
|
|
6976
|
-
|
|
6977
|
-
|
|
6978
|
-
|
|
6979
|
-
|
|
6980
|
-
|
|
6981
|
-
|
|
6982
|
-
|
|
6983
|
-
|
|
6984
|
-
|
|
6985
|
-
|
|
6986
|
-
|
|
6987
|
-
|
|
6988
|
-
|
|
6989
|
-
|
|
6990
|
-
|
|
6991
|
-
|
|
6992
|
-
|
|
6993
|
-
|
|
6994
|
-
|
|
6995
|
-
|
|
6996
|
-
|
|
6966
|
+
});
|
|
6967
|
+
// Fetch client data if the user is of type 'tango'
|
|
6968
|
+
if (user.userType === "tango") {
|
|
6969
|
+
this.getClient();
|
|
6970
|
+
}
|
|
6971
|
+
else {
|
|
6972
|
+
this.getCountry();
|
|
6973
|
+
this.getLocations();
|
|
6974
|
+
this.getGroups();
|
|
6975
|
+
this.getStore();
|
|
6976
|
+
const clientFilters = localStorage.getItem("client-details");
|
|
6977
|
+
if (clientFilters) {
|
|
6978
|
+
const headerclientFilters = JSON.parse(clientFilters);
|
|
6979
|
+
this.selectedClient = {
|
|
6980
|
+
trafficDateRange: headerclientFilters.trafficDateRange,
|
|
6981
|
+
};
|
|
6982
|
+
}
|
|
6983
|
+
}
|
|
6984
|
+
// Load filters from localStorage if they exist
|
|
6985
|
+
const storedFilters = localStorage.getItem("header-filters");
|
|
6986
|
+
if (storedFilters) {
|
|
6987
|
+
const headerFilters = JSON.parse(storedFilters);
|
|
6988
|
+
// Initialize selectedFilters with defaults or existing values
|
|
6989
|
+
this.selectedFilters = {
|
|
6990
|
+
client: headerFilters.client || this.users.client,
|
|
6991
|
+
clientName: headerFilters.clientName || "",
|
|
6992
|
+
clients: headerFilters.clients || [],
|
|
6993
|
+
store: headerFilters.store || null,
|
|
6994
|
+
date: headerFilters.date || {},
|
|
6995
|
+
stores: headerFilters.stores || [],
|
|
6996
|
+
group: headerFilters.group || [],
|
|
6997
|
+
location: headerFilters.location || [],
|
|
6998
|
+
country: headerFilters.country || [],
|
|
6999
|
+
zoneName: headerFilters.zoneName || [],
|
|
7000
|
+
};
|
|
7001
|
+
// Sync filtered data with stored selections
|
|
7002
|
+
this.filteredCountries = this.syncWithLocalStorage(headerFilters.country);
|
|
7003
|
+
this.filteredLocations = this.syncWithLocalStorage(headerFilters.location);
|
|
7004
|
+
this.filteredGroups = this.syncWithLocalStorage(headerFilters.group);
|
|
7005
|
+
this.filteredStores = this.syncWithLocalStorage(headerFilters.stores);
|
|
7006
|
+
this.filteredZones = this.syncWithLocalStorage(headerFilters.zoneName);
|
|
7007
|
+
// Format date range if it exists
|
|
7008
|
+
if (headerFilters.date) {
|
|
7009
|
+
this.selectedDateRange = {
|
|
7010
|
+
startDate: this.dayjs(headerFilters.date.startDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
7011
|
+
endDate: this.dayjs(headerFilters.date.endDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
7012
|
+
};
|
|
7013
|
+
}
|
|
7014
|
+
else {
|
|
7015
|
+
this.selectedDateRange = {
|
|
7016
|
+
startDate: this.dayjs(this.selectedDateRange.startDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
7017
|
+
endDate: this.dayjs(this.selectedDateRange.endDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
7018
|
+
};
|
|
7019
|
+
}
|
|
7020
|
+
// console.log("3")
|
|
7021
|
+
// Emit data via service and update localStorage
|
|
7022
|
+
this.emitAndStoreFilters();
|
|
7023
|
+
}
|
|
7024
|
+
else {
|
|
7025
|
+
// Initialize empty states if no header filters are present in localStorage
|
|
7026
|
+
this.resetFilters();
|
|
7027
|
+
// console.log("2")
|
|
7028
|
+
}
|
|
7029
|
+
}
|
|
7030
|
+
syncWithLocalStorage(items) {
|
|
7031
|
+
return items
|
|
7032
|
+
? items.map((item) => ({
|
|
7033
|
+
...item,
|
|
7034
|
+
checked: item.checked === true,
|
|
7035
|
+
}))
|
|
7036
|
+
: [];
|
|
7037
|
+
}
|
|
7038
|
+
emitAndStoreFilters() {
|
|
7039
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
7040
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7041
|
+
// console.log("1")
|
|
7042
|
+
}
|
|
7043
|
+
/**
|
|
7044
|
+
* Reset selectedFilters and all related arrays to empty states
|
|
7045
|
+
*/
|
|
7046
|
+
resetFilters() {
|
|
7047
|
+
this.selectedFilters = {
|
|
7048
|
+
client: null,
|
|
7049
|
+
clientName: "",
|
|
7050
|
+
clients: [],
|
|
7051
|
+
store: null,
|
|
7052
|
+
date: {},
|
|
7053
|
+
stores: [],
|
|
7054
|
+
group: [],
|
|
7055
|
+
location: [],
|
|
7056
|
+
country: [],
|
|
7057
|
+
zoneName: [],
|
|
7058
|
+
};
|
|
7059
|
+
this.filteredLocations = [];
|
|
7060
|
+
this.filteredGroups = [];
|
|
7061
|
+
this.filteredStores = [];
|
|
7062
|
+
this.filteredCountries = [];
|
|
7063
|
+
this.filteredZones = [];
|
|
7064
|
+
}
|
|
7065
|
+
getClient() {
|
|
7066
|
+
this.auth.getClients().subscribe({
|
|
7067
|
+
next: (e) => {
|
|
7068
|
+
if (e) {
|
|
7069
|
+
this.clientList = e.data.result;
|
|
7070
|
+
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
7071
|
+
if (headerFilters.client) {
|
|
7072
|
+
this.clientList.find((obj) => {
|
|
7073
|
+
if (obj.clientId === headerFilters.client) {
|
|
7074
|
+
this.selectedClient = obj;
|
|
7075
|
+
}
|
|
7076
|
+
});
|
|
7077
|
+
// const startDate = this.dayjs(headerFilters.date.startDate);
|
|
7078
|
+
// const endDate = this.dayjs(headerFilters.date.endDate);
|
|
7079
|
+
// const differenceInDays = endDate.diff(startDate, 'days');
|
|
7080
|
+
// if (differenceInDays >= 90 && this.selectedClient?.trafficDateRange === 90) {
|
|
7081
|
+
// this.selectedDateRange = {
|
|
7082
|
+
// startDate: this.dayjs(headerFilters.date.startDate, "YYYY-MM-DD").subtract(-90, 'days').format("DD-MM-YYYY"),
|
|
7083
|
+
// endDate: this.dayjs(headerFilters.date.endDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
7084
|
+
// };
|
|
7085
|
+
// } else {
|
|
7086
|
+
// this.selectedDateRange = {
|
|
7087
|
+
// startDate: this.dayjs(this.selectedDateRange.startDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
7088
|
+
// endDate: this.dayjs(this.selectedDateRange.endDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
7089
|
+
// };
|
|
7090
|
+
// }
|
|
7091
|
+
this.selectedFilters.client = headerFilters.client;
|
|
7092
|
+
this.selectedFilters.clientName = headerFilters.clientName;
|
|
7093
|
+
this.selectedFilters.clients = [headerFilters.client];
|
|
7094
|
+
this.selectedFilters.store = headerFilters.store;
|
|
7095
|
+
this.selectedFilters.date = headerFilters.date;
|
|
7096
|
+
this.selectedFilters.stores = headerFilters.stores;
|
|
7097
|
+
this.selectedFilters.group = headerFilters.group;
|
|
7098
|
+
this.selectedFilters.location = headerFilters.location;
|
|
7099
|
+
this.selectedFilters.country = headerFilters.country;
|
|
7100
|
+
this.selectedFilters.zoneName = headerFilters.zoneName;
|
|
7101
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
7102
|
+
// console.log("2")
|
|
7103
|
+
// Ensure locations and groups are loaded before fetching stores
|
|
7104
|
+
this.getCountry();
|
|
7105
|
+
this.getLocations();
|
|
7106
|
+
this.getGroups();
|
|
7107
|
+
// Fetch stores only after locations and groups are set
|
|
7108
|
+
this.getStore();
|
|
7109
|
+
}
|
|
7110
|
+
else {
|
|
7111
|
+
this.selectedClient = this.clientList[0];
|
|
7112
|
+
this.selectedFilters.client = this.selectedClient.clientId;
|
|
7113
|
+
this.selectedFilters.clientName = this.selectedClient.clientName;
|
|
7114
|
+
this.selectedFilters.clients = [this.selectedClient.clientId];
|
|
7115
|
+
this.selectedFilters.store = headerFilters.store;
|
|
7116
|
+
this.selectedFilters.date = headerFilters.date;
|
|
7117
|
+
this.selectedFilters.stores = headerFilters.stores;
|
|
7118
|
+
this.selectedFilters.group = headerFilters.group;
|
|
7119
|
+
this.selectedFilters.location = headerFilters.location;
|
|
7120
|
+
this.selectedFilters.country = headerFilters.country;
|
|
7121
|
+
this.selectedFilters.zoneName = headerFilters.zoneName;
|
|
7122
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7123
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
7124
|
+
// console.log("3")
|
|
7125
|
+
this.cd.detectChanges();
|
|
7126
|
+
// Ensure locations and groups are loaded before fetching stores
|
|
7127
|
+
this.getCountry();
|
|
7128
|
+
this.getLocations();
|
|
7129
|
+
this.getGroups();
|
|
7130
|
+
// Fetch stores only after locations and groups are set
|
|
7131
|
+
this.getStore();
|
|
7132
|
+
}
|
|
7133
|
+
}
|
|
7134
|
+
else {
|
|
7135
|
+
this.selectedClient = this.clientList[0];
|
|
7136
|
+
this.selectedFilters.client = this.selectedClient.clientId;
|
|
7137
|
+
this.selectedFilters.clientName = this.selectedClient.clientName;
|
|
7138
|
+
// Ensure locations and groups are loaded before fetching stores
|
|
7139
|
+
this.getCountry();
|
|
7140
|
+
this.getLocations();
|
|
7141
|
+
this.getGroups();
|
|
7142
|
+
// Fetch stores only after locations and groups are set
|
|
7143
|
+
this.getStore();
|
|
7144
|
+
this.getZone();
|
|
7145
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7146
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
7147
|
+
// console.log("4")
|
|
7148
|
+
this.cd.detectChanges();
|
|
7149
|
+
}
|
|
7150
|
+
this.getUserInfo(this.selectedFilters.client);
|
|
7151
|
+
},
|
|
7152
|
+
});
|
|
7153
|
+
}
|
|
7154
|
+
getUserInfo(client) {
|
|
7155
|
+
let obj = {
|
|
7156
|
+
clientId: client ? client : "",
|
|
7157
|
+
};
|
|
7158
|
+
if (client) {
|
|
7159
|
+
this.auth.getHeaderUsers(obj).subscribe({
|
|
7160
|
+
next: (e) => {
|
|
7161
|
+
localStorage.setItem("usersEmail-info", JSON.stringify(e?.data?.userEmailData || []));
|
|
7162
|
+
},
|
|
7163
|
+
});
|
|
7164
|
+
}
|
|
7165
|
+
}
|
|
7166
|
+
onClientSelect(event) {
|
|
7167
|
+
// Update the selected client
|
|
7168
|
+
this.selectedClient = event;
|
|
7169
|
+
// Clear previous filtered data and selections
|
|
7170
|
+
this.filteredGroups = [];
|
|
7171
|
+
this.filteredStores = [];
|
|
7172
|
+
this.filteredLocations = [];
|
|
7173
|
+
this.selectedFilters.stores = [];
|
|
7174
|
+
this.selectedFilters.group = [];
|
|
7175
|
+
this.selectedFilters.location = [];
|
|
7176
|
+
this.selectedFilters.country = [];
|
|
7177
|
+
this.selectedFilters.zoneName = [];
|
|
7178
|
+
// Fetch header filters from localStorage
|
|
7179
|
+
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
7180
|
+
// Update the selected filters with the new client
|
|
7181
|
+
this.selectedFilters.client = this.selectedClient.clientId;
|
|
7182
|
+
this.selectedFilters.clientName = this.selectedClient.clientName;
|
|
7183
|
+
// Remove old store, group, and location data from the header filters
|
|
7184
|
+
delete headerFilters.stores;
|
|
7185
|
+
delete headerFilters.groups;
|
|
7186
|
+
delete headerFilters.location;
|
|
7187
|
+
delete headerFilters.country;
|
|
7188
|
+
delete headerFilters.zoneName;
|
|
7189
|
+
// Fetch new data based on the new client
|
|
7190
|
+
this.getCountry();
|
|
7191
|
+
this.getLocations();
|
|
7192
|
+
this.getStore();
|
|
7193
|
+
this.getGroups();
|
|
7194
|
+
// Update localStorage with the new client selection and empty filter data
|
|
7195
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7196
|
+
window.location.reload();
|
|
7197
|
+
// Emit data to the global service
|
|
7198
|
+
// this.gs.dataRangeValue.next(this.selectedFilters);
|
|
7199
|
+
// Trigger change detection to reflect UI changes
|
|
7200
|
+
this.cd.detectChanges();
|
|
7201
|
+
}
|
|
7202
|
+
ranges = {
|
|
7203
|
+
Today: [dayjs(), dayjs()],
|
|
7204
|
+
Yesterday: [dayjs().subtract(1, "days"), dayjs().subtract(1, "days")],
|
|
7205
|
+
"This Week": [dayjs().subtract(7, "days"), dayjs().subtract(1, "days")],
|
|
7206
|
+
"Last Week": [
|
|
7207
|
+
dayjs().subtract(14, "days").startOf("day"),
|
|
7208
|
+
dayjs().subtract(8, "days").endOf("day"),
|
|
7209
|
+
],
|
|
7210
|
+
"This Month": [dayjs().subtract(30, "days"), dayjs().subtract(1, "days")],
|
|
7211
|
+
"Last Month": [
|
|
7212
|
+
dayjs().subtract(1, "month").startOf("month"),
|
|
7213
|
+
dayjs().subtract(1, "month").endOf("month"),
|
|
7214
|
+
],
|
|
7215
|
+
};
|
|
7216
|
+
onStartDateChange(event) {
|
|
7217
|
+
if (this.dayjs(event.startDate).isValid()) {
|
|
7218
|
+
if (this.selectedClient?.traxDateRange === 90) {
|
|
7219
|
+
this.isCustomDate = (m) => {
|
|
7220
|
+
const isValidDate = m > this.dayjs() || m > this.dayjs(event.startDate.add(90, "days"));
|
|
7221
|
+
return isValidDate ? "invalid-date" : false;
|
|
7222
|
+
};
|
|
7223
|
+
}
|
|
7224
|
+
else {
|
|
7225
|
+
this.isCustomDate = (m) => {
|
|
7226
|
+
const isValidDate = m > this.dayjs() ||
|
|
7227
|
+
m > this.dayjs(event.startDate.add(180, "days"));
|
|
7228
|
+
return isValidDate ? "invalid-date" : false;
|
|
7229
|
+
};
|
|
7230
|
+
}
|
|
7231
|
+
}
|
|
7232
|
+
}
|
|
7233
|
+
datechange(event) {
|
|
7234
|
+
if (event && event.startDate && event.endDate) {
|
|
7235
|
+
if (this.dayjs(event.startDate).isValid() &&
|
|
7236
|
+
this.dayjs(event.endDate).isValid()) {
|
|
7237
|
+
this.selectedDateRange.startDate = event.startDate;
|
|
7238
|
+
this.selectedDateRange.endDate = event.endDate;
|
|
7239
|
+
var datetime = {
|
|
7240
|
+
startDate: this.dayjs(event.startDate, "DD-MM-YYYY").format("YYYY-MM-DD"),
|
|
7241
|
+
endDate: this.dayjs(event.endDate, "DD-MM-YYYY").format("YYYY-MM-DD"),
|
|
7242
|
+
};
|
|
7243
|
+
this.selectedFilters.date = datetime;
|
|
7244
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7245
|
+
window.location.reload();
|
|
7246
|
+
// this.gs.dataRangeValue.next(this.selectedFilters);
|
|
7247
|
+
}
|
|
7248
|
+
}
|
|
7249
|
+
}
|
|
7250
|
+
opendropdown(e) {
|
|
7251
|
+
e.stopPropagation();
|
|
7252
|
+
this.Opendropdown = !this.Opendropdown;
|
|
7253
|
+
}
|
|
7254
|
+
getLocations() {
|
|
7255
|
+
const country = this.countries
|
|
7256
|
+
.filter((country) => country.checked)
|
|
7257
|
+
.map((country) => country.country);
|
|
7258
|
+
// const headerFilters: any = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
7259
|
+
let obj = {
|
|
7260
|
+
clientId: this.selectedFilters.client
|
|
7261
|
+
? this.selectedFilters.client
|
|
7262
|
+
: this.users.clientId,
|
|
7263
|
+
country,
|
|
7264
|
+
city: [],
|
|
7265
|
+
group: [],
|
|
7266
|
+
};
|
|
7267
|
+
this.auth.getLocation(obj).subscribe({
|
|
7268
|
+
next: (res) => {
|
|
7269
|
+
let cityList = this.selectedFilters?.location
|
|
7270
|
+
?.filter((location) => location.checked)
|
|
7271
|
+
.map((loc) => loc.city);
|
|
7272
|
+
// Map the fetched locations with default unchecked state
|
|
7273
|
+
this.locations = res?.data?.locationData.map((city) => ({
|
|
7274
|
+
city: city.city,
|
|
7275
|
+
// checked: cityList?.length ? cityList.includes(city.city) : true,
|
|
7276
|
+
checked: cityList?.includes(city.city) ? true : false,
|
|
7277
|
+
}));
|
|
7278
|
+
// Sync the fetched locations with any stored checked values in localStorage
|
|
7279
|
+
if (this.selectedFilters.location &&
|
|
7280
|
+
Array.isArray(this.selectedFilters.location)) {
|
|
7281
|
+
this.filteredLocations = this.locations.map((location) => {
|
|
7282
|
+
const matchedLocation = this.selectedFilters.location.find((loc) => loc.city === location.city);
|
|
7283
|
+
return matchedLocation
|
|
7284
|
+
? { ...location, checked: matchedLocation.checked }
|
|
7285
|
+
: location;
|
|
7286
|
+
});
|
|
7287
|
+
}
|
|
7288
|
+
else {
|
|
7289
|
+
this.filteredLocations = this.locations;
|
|
7290
|
+
}
|
|
7291
|
+
if (this.searchLocationText) {
|
|
7292
|
+
this.filteredLocations = this.locations.filter((location) => location.city
|
|
7293
|
+
.toLowerCase()
|
|
7294
|
+
.includes(this.searchLocationText.toLowerCase()));
|
|
7295
|
+
}
|
|
7296
|
+
const selectedLocations = this.locations
|
|
7297
|
+
.filter((location) => location.checked)
|
|
7298
|
+
.map((location) => location.city);
|
|
7299
|
+
if (selectedLocations.length > 0) {
|
|
7300
|
+
setTimeout(() => {
|
|
7301
|
+
this.getGroups();
|
|
7302
|
+
this.getStore(); // Fetch stores based on selected groups
|
|
7303
|
+
}, 1000);
|
|
7304
|
+
}
|
|
7305
|
+
if (!selectedLocations.length && country.length) {
|
|
7306
|
+
this.getGroups();
|
|
7307
|
+
}
|
|
7308
|
+
},
|
|
7309
|
+
error: (err) => {
|
|
7310
|
+
console.error("Failed to fetch locations", err);
|
|
7311
|
+
},
|
|
7312
|
+
});
|
|
7313
|
+
}
|
|
7314
|
+
isAllLocationsSelected() {
|
|
7315
|
+
return this.filteredLocations.every((location) => location.checked);
|
|
7316
|
+
}
|
|
7317
|
+
selectedLocationsLabel() {
|
|
7318
|
+
const selectedLocations = (this.locationLabel = this.searchLocationText
|
|
7319
|
+
.length
|
|
7320
|
+
? this.locations
|
|
7321
|
+
.filter((location) => location.checked)
|
|
7322
|
+
.map((location) => location.city)
|
|
7323
|
+
: this.filteredLocations
|
|
7324
|
+
.filter((location) => location.checked)
|
|
7325
|
+
.map((location) => location.city));
|
|
7326
|
+
return selectedLocations.length === 0
|
|
7327
|
+
? ""
|
|
7328
|
+
: selectedLocations.length === 1
|
|
7329
|
+
? selectedLocations[0]
|
|
7330
|
+
: `${selectedLocations.length} Region`;
|
|
7331
|
+
}
|
|
7332
|
+
removeLocation() {
|
|
7333
|
+
this.Reset();
|
|
7334
|
+
}
|
|
7335
|
+
getGroups() {
|
|
7336
|
+
const country = this.countries
|
|
7337
|
+
.filter((country) => country.checked)
|
|
7338
|
+
.map((country) => country.country);
|
|
7339
|
+
let city;
|
|
7340
|
+
city = this.locations
|
|
7341
|
+
.filter((location) => location.checked)
|
|
7342
|
+
.map((location) => location.city);
|
|
7343
|
+
if (!city.length && country.length) {
|
|
7344
|
+
city = this.locations.map((loc) => loc.city);
|
|
7345
|
+
}
|
|
7346
|
+
const obj = {
|
|
7347
|
+
country,
|
|
7348
|
+
city,
|
|
7349
|
+
clientId: this.selectedFilters.client
|
|
7350
|
+
? this.selectedFilters.client
|
|
7351
|
+
: this.users.clientId,
|
|
7352
|
+
group: [],
|
|
7353
|
+
};
|
|
7354
|
+
this.auth.getGroups(obj).subscribe({
|
|
7355
|
+
next: (res) => {
|
|
7356
|
+
let checkedGroup = this.selectedFilters?.group
|
|
7357
|
+
?.filter((group) => group.checked)
|
|
7358
|
+
.map((group) => group.groupName);
|
|
7359
|
+
const combinedGroups = res?.data?.groupData?.map((groupName) => ({
|
|
7360
|
+
groupName: groupName.groupName,
|
|
7361
|
+
checked: checkedGroup?.includes(groupName.groupName) ? true : false,
|
|
7362
|
+
// checked: checkedGroup?.length ? checkedGroup.includes(groupName.groupName) : true,
|
|
7363
|
+
}));
|
|
7364
|
+
this.groupsData = combinedGroups;
|
|
7365
|
+
if (this.searchGroupText.length) {
|
|
7366
|
+
this.filteredGroups = combinedGroups.filter((item) => item.groupName.toLowerCase().includes(this.searchGroupText));
|
|
7367
|
+
}
|
|
7368
|
+
else {
|
|
7369
|
+
this.filteredGroups = combinedGroups;
|
|
7370
|
+
}
|
|
7371
|
+
// Auto-fetch stores when groups are selected
|
|
7372
|
+
const selectedGroups = this.groupsData
|
|
7373
|
+
.filter((group) => group.checked)
|
|
7374
|
+
.map((group) => group.groupName);
|
|
7375
|
+
if (selectedGroups.length > 0) {
|
|
7376
|
+
setTimeout(() => {
|
|
7377
|
+
this.getStore(); // Fetch stores based on selected groups
|
|
7378
|
+
}, 1000);
|
|
7379
|
+
}
|
|
7380
|
+
},
|
|
7381
|
+
error: (err) => {
|
|
7382
|
+
console.error("Failed to fetch groups", err);
|
|
7383
|
+
},
|
|
7384
|
+
});
|
|
7385
|
+
}
|
|
7386
|
+
toggleDropdown(type) {
|
|
7387
|
+
if (this.dropdownOpen === type) {
|
|
7388
|
+
// If the dropdown is open, close it and avoid resetting the selected values unnecessarily
|
|
7389
|
+
this.dropdownOpen = null;
|
|
7390
|
+
}
|
|
7391
|
+
else {
|
|
7392
|
+
// Open the specific dropdown and handle data fetching only if necessary
|
|
7393
|
+
this.dropdownOpen = type;
|
|
7394
|
+
if (type === "country") {
|
|
7395
|
+
// Fetch countries only if not already fetched and no search text exists
|
|
7396
|
+
if ((!this.filteredCountries || this.filteredCountries.length === 0) &&
|
|
7397
|
+
!this.searchCountryText.trim()) {
|
|
7398
|
+
this.getCountry();
|
|
7399
|
+
}
|
|
7400
|
+
}
|
|
7401
|
+
if (type === "group") {
|
|
7402
|
+
// Fetch groups only if there are selected cities and no active search text
|
|
7403
|
+
const selectedCities = this.locations
|
|
7404
|
+
.filter((location) => location.checked)
|
|
7405
|
+
.map((location) => location.city);
|
|
7406
|
+
// Fetch groups only if locations are selected, no search text exists, and dropdown is opened
|
|
7407
|
+
if (this.filteredLocations.length > 0 ||
|
|
7408
|
+
(selectedCities.length > 0 && !this.searchGroupText.trim())) {
|
|
7409
|
+
this.getGroups();
|
|
7410
|
+
}
|
|
7411
|
+
else {
|
|
7412
|
+
this.filteredGroups = []; // Clear groups if no locations are selected
|
|
7413
|
+
}
|
|
7414
|
+
}
|
|
7415
|
+
if (type === "store") {
|
|
7416
|
+
// Fetch stores only if not already fetched and no search text is active
|
|
7417
|
+
if ((!this.filteredStores || this.filteredStores.length === 0) &&
|
|
7418
|
+
!this.searchStoreText.trim()) {
|
|
7419
|
+
this.getStore();
|
|
7420
|
+
}
|
|
7421
|
+
}
|
|
7422
|
+
if (type === "zone") {
|
|
7423
|
+
// Fetch stores only if not already fetched and no search text is active
|
|
7424
|
+
if ((!this.filteredZones || this.filteredZones.length === 0) &&
|
|
7425
|
+
!this.searchZoneText.trim()) {
|
|
7426
|
+
this.getZone();
|
|
7427
|
+
}
|
|
7428
|
+
}
|
|
7429
|
+
}
|
|
7430
|
+
}
|
|
7431
|
+
handleGroupDropdownClick() {
|
|
7432
|
+
if (this.dropdownOpen === "group") {
|
|
7433
|
+
this.resetSelectedGroups();
|
|
7434
|
+
}
|
|
7435
|
+
this.toggleDropdown("group");
|
|
7436
|
+
}
|
|
7437
|
+
resetSelectedGroups() {
|
|
7438
|
+
this.filteredGroups.forEach((group) => (group.checked = false));
|
|
7439
|
+
this.searchGroupText = "";
|
|
7440
|
+
}
|
|
7441
|
+
selectedGroupsLabel() {
|
|
7442
|
+
const selectedGroups = (this.groupLabel = this.searchGroupText.length
|
|
7443
|
+
? this.groupsData.filter((group) => group.checked)
|
|
7444
|
+
: this.filteredGroups.filter((group) => group.checked));
|
|
7445
|
+
return selectedGroups.length === 0
|
|
7446
|
+
? ""
|
|
7447
|
+
: selectedGroups.length === 1
|
|
7448
|
+
? selectedGroups[0].groupName
|
|
7449
|
+
: `${selectedGroups.length} Clusters`;
|
|
7450
|
+
}
|
|
7451
|
+
removeGroup() {
|
|
7452
|
+
this.Reset();
|
|
7453
|
+
}
|
|
7454
|
+
isAllGroupsSelected() {
|
|
7455
|
+
return this.filteredGroups.length
|
|
7456
|
+
? this.filteredGroups.every((group) => group.checked)
|
|
7457
|
+
: false;
|
|
7458
|
+
}
|
|
7459
|
+
getStore() {
|
|
7460
|
+
const country = this.countries
|
|
7461
|
+
.filter((country) => country.checked)
|
|
7462
|
+
.map((country) => country.country);
|
|
7463
|
+
const city = this.locations
|
|
7464
|
+
.filter((location) => location.checked)
|
|
7465
|
+
.map((location) => location.city);
|
|
7466
|
+
const group = this.groupsData
|
|
7467
|
+
.filter((group) => group.checked)
|
|
7468
|
+
.map((group) => group.groupName);
|
|
7469
|
+
const data = {
|
|
7470
|
+
country,
|
|
7471
|
+
city,
|
|
7472
|
+
clusters: group,
|
|
7473
|
+
clientId: this.users.clientId || this.selectedFilters.client,
|
|
7474
|
+
};
|
|
7475
|
+
this.auth.getHeaderStores(data).subscribe({
|
|
7476
|
+
next: (res) => {
|
|
7477
|
+
if (res && res.code === 200) {
|
|
7478
|
+
// Initialize stores from API response
|
|
7479
|
+
this.stores = res.data.storesData;
|
|
7480
|
+
// Check if there are previously selected stores
|
|
7481
|
+
const checkedStoreIds = this.selectedFilters?.stores
|
|
7482
|
+
? this.selectedFilters.stores
|
|
7483
|
+
.filter((store) => store.checked)
|
|
7484
|
+
.map((store) => store.storeId)
|
|
7485
|
+
: [];
|
|
7486
|
+
// Sync the `checked` state
|
|
7487
|
+
this.stores.forEach((store) => {
|
|
7488
|
+
store.checked = checkedStoreIds.length
|
|
7489
|
+
? checkedStoreIds.includes(store.storeId) // Use previous selection
|
|
7490
|
+
: true; // Default to true if no previous selection
|
|
7491
|
+
});
|
|
7492
|
+
// Apply search filter if search text is present
|
|
7493
|
+
if (this.searchStoreText.length) {
|
|
7494
|
+
this.filteredStores = this.stores.filter((store) => store.storeName
|
|
7495
|
+
.toLowerCase()
|
|
7496
|
+
.includes(this.searchStoreText.toLowerCase()));
|
|
7497
|
+
}
|
|
7498
|
+
else {
|
|
7499
|
+
this.filteredStores = [...this.stores];
|
|
7500
|
+
}
|
|
7501
|
+
// Update `selectedFilters.stores` to reflect the current state
|
|
7502
|
+
this.selectedFilters.stores = this.filteredStores.map((store) => ({
|
|
7503
|
+
storeId: store.storeId,
|
|
7504
|
+
storeName: store.storeName,
|
|
7505
|
+
checked: store.checked,
|
|
7506
|
+
}));
|
|
7507
|
+
// this.selectedFilters.country = country;
|
|
7508
|
+
// Save updated filters to localStorage
|
|
7509
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7510
|
+
this.getZone();
|
|
7511
|
+
// Trigger UI change detection
|
|
7512
|
+
this.cd.detectChanges();
|
|
7513
|
+
}
|
|
7514
|
+
else {
|
|
7515
|
+
// Handle empty or error response
|
|
7516
|
+
this.clearStoresState();
|
|
7517
|
+
}
|
|
7518
|
+
},
|
|
7519
|
+
error: (err) => {
|
|
7520
|
+
console.error("Failed to fetch stores", err);
|
|
7521
|
+
this.clearStoresState();
|
|
7522
|
+
},
|
|
7523
|
+
});
|
|
7524
|
+
}
|
|
7525
|
+
getZone() {
|
|
7526
|
+
const country = this.countries
|
|
7527
|
+
.filter((country) => country.checked)
|
|
7528
|
+
.map((country) => country.country);
|
|
7529
|
+
const city = this.locations
|
|
7530
|
+
.filter((location) => location.checked)
|
|
7531
|
+
.map((location) => location.city);
|
|
7532
|
+
const group = this.groupsData
|
|
7533
|
+
.filter((group) => group.checked)
|
|
7534
|
+
.map((group) => group.groupName);
|
|
7535
|
+
const storeId = this.filteredStores
|
|
7536
|
+
.filter((group) => group.checked)
|
|
7537
|
+
.map((group) => group.storeId);
|
|
7538
|
+
const data = {
|
|
7539
|
+
country,
|
|
7540
|
+
city,
|
|
7541
|
+
clusters: group,
|
|
7542
|
+
clientId: this.users.clientId || this.selectedFilters.client,
|
|
7543
|
+
storeId: storeId,
|
|
7544
|
+
};
|
|
7545
|
+
this.auth.getHeaderZone(data).subscribe({
|
|
7546
|
+
next: (res) => {
|
|
7547
|
+
if (res && res.code === 200) {
|
|
7548
|
+
// Initialize zones with Overall Store first, unchecked by default
|
|
7549
|
+
this.zones = [
|
|
7550
|
+
{ _id: "overall", tagName: "Overall Store", checked: false },
|
|
7551
|
+
...(res?.data?.zoneData?.map((zone) => ({
|
|
7552
|
+
_id: zone._id,
|
|
7553
|
+
tagName: zone.tagName,
|
|
7554
|
+
checked: false, // initialize unchecked; will update below
|
|
7555
|
+
})) || []),
|
|
7556
|
+
];
|
|
7557
|
+
// Get previously selected zone IDs (checked ones)
|
|
7558
|
+
const checkedStoreIds = this.selectedFilters?.zoneName
|
|
7559
|
+
? this.selectedFilters.zoneName
|
|
7560
|
+
.filter((zone) => zone.checked)
|
|
7561
|
+
.map((zone) => zone._id)
|
|
7562
|
+
: [];
|
|
7563
|
+
// Sync checked state with previous selections or default:
|
|
7564
|
+
// If no previous selection, Overall Store unchecked, others checked
|
|
7565
|
+
this.zones.forEach((zone) => {
|
|
7566
|
+
if (checkedStoreIds.length) {
|
|
7567
|
+
zone.checked = checkedStoreIds.includes(zone._id);
|
|
7568
|
+
}
|
|
7569
|
+
else {
|
|
7570
|
+
zone.checked = zone._id !== "overall";
|
|
7571
|
+
}
|
|
7572
|
+
});
|
|
7573
|
+
// Apply search filter if any
|
|
7574
|
+
if (this.searchZoneText.length) {
|
|
7575
|
+
this.filteredZones = this.zones.filter((zone) => zone.tagName
|
|
7576
|
+
.toLowerCase()
|
|
7577
|
+
.includes(this.searchZoneText.toLowerCase()));
|
|
7578
|
+
}
|
|
7579
|
+
else {
|
|
7580
|
+
this.filteredZones = [...this.zones];
|
|
7581
|
+
}
|
|
7582
|
+
// Update selectedFilters.zoneName with current checked states
|
|
7583
|
+
this.selectedFilters.zoneName = this.filteredZones.map((zone) => ({
|
|
7584
|
+
_id: zone._id,
|
|
7585
|
+
tagName: zone.tagName,
|
|
7586
|
+
checked: zone.checked,
|
|
7587
|
+
}));
|
|
7588
|
+
// Save updated filters to localStorage
|
|
7589
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7590
|
+
// Trigger change detection if needed
|
|
7591
|
+
this.cd.detectChanges();
|
|
7592
|
+
}
|
|
7593
|
+
else {
|
|
7594
|
+
this.clearZoneState();
|
|
7595
|
+
}
|
|
7596
|
+
},
|
|
7597
|
+
error: (err) => {
|
|
7598
|
+
console.error("Failed to fetch zones", err);
|
|
7599
|
+
this.clearZoneState();
|
|
7600
|
+
},
|
|
7601
|
+
});
|
|
7602
|
+
}
|
|
7603
|
+
clearZoneState() {
|
|
7604
|
+
this.zones = [];
|
|
7605
|
+
this.filteredZones = [];
|
|
7606
|
+
this.selectedFilters.zonename = [];
|
|
7607
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7608
|
+
}
|
|
7609
|
+
// Clear stores state and reset filters
|
|
7610
|
+
clearStoresState() {
|
|
7611
|
+
this.stores = [];
|
|
7612
|
+
this.filteredStores = [];
|
|
7613
|
+
this.selectedFilters.stores = [];
|
|
7614
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7615
|
+
}
|
|
7616
|
+
resetSelectedStores() {
|
|
7617
|
+
this.filteredStores.forEach((store) => (store.checked = false));
|
|
7618
|
+
this.searchStoreText = "";
|
|
7619
|
+
}
|
|
7620
|
+
selectedStoresLabel() {
|
|
7621
|
+
const selectedStores = this.searchStoreText.length
|
|
7622
|
+
? this.stores.filter((store) => store.checked)
|
|
7623
|
+
: this.filteredStores.filter((store) => store.checked);
|
|
7624
|
+
return selectedStores.length === 0
|
|
7625
|
+
? "0 Stores"
|
|
7626
|
+
: selectedStores.length === 1
|
|
7627
|
+
? selectedStores[0].storeName
|
|
7628
|
+
: `${selectedStores.length} Stores`;
|
|
7629
|
+
}
|
|
7630
|
+
selectedZonesLabel() {
|
|
7631
|
+
const selectedStores = this.searchZoneText.length
|
|
7632
|
+
? this.zones.filter((zone) => zone.checked)
|
|
7633
|
+
: this.filteredZones.filter((zone) => zone.checked);
|
|
7634
|
+
return selectedStores.length === 0
|
|
7635
|
+
? "0 Zones"
|
|
7636
|
+
: selectedStores.length === 1
|
|
7637
|
+
? selectedStores[0].tagName
|
|
7638
|
+
: `${selectedStores.length} Zones`;
|
|
7639
|
+
}
|
|
7640
|
+
isAllStoresSelected() {
|
|
7641
|
+
return (this.filteredStores.length > 0 &&
|
|
7642
|
+
this.filteredStores.every((store) => store.checked));
|
|
7643
|
+
}
|
|
7644
|
+
isAllZonesSelected() {
|
|
7645
|
+
return this.filteredZones
|
|
7646
|
+
.filter((zone) => zone._id !== "overall")
|
|
7647
|
+
.every((zone) => zone.checked);
|
|
7648
|
+
}
|
|
7649
|
+
// Method to handle dropdown item selection
|
|
7650
|
+
updateSelectedStores() {
|
|
7651
|
+
this.filteredStores.forEach((store) => {
|
|
7652
|
+
const filteredStore = this.stores.findIndex((fStore) => fStore.storeId === store.storeId);
|
|
7653
|
+
if (filteredStore != -1) {
|
|
7654
|
+
this.stores[filteredStore].checked = store.checked; // Sync the checked state with full store list
|
|
7655
|
+
}
|
|
7656
|
+
});
|
|
7657
|
+
// Update selectedFilters based on the current store selection
|
|
7658
|
+
this.selectedFilters.stores = this.stores.filter((store) => store.checked);
|
|
7659
|
+
// Update localStorage with the latest selection
|
|
7660
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7661
|
+
// Emit updated filters via service
|
|
7662
|
+
// this.gs.dataRangeValue.next(this.selectedFilters);
|
|
7663
|
+
// Trigger change detection if necessary
|
|
7664
|
+
if (this.selectedFilters.stores.length > 0)
|
|
7665
|
+
this.getZone();
|
|
7666
|
+
else
|
|
7667
|
+
this.zones = [];
|
|
7668
|
+
this.filteredZones = [];
|
|
7669
|
+
this.selectedFilters.zoneName = [];
|
|
7670
|
+
this.cd.detectChanges();
|
|
7671
|
+
}
|
|
7672
|
+
updateSelectedZones(clickedZoneId) {
|
|
7673
|
+
this.filteredZones.forEach((zone) => {
|
|
7674
|
+
const index = this.zones.findIndex((z) => z._id === zone._id);
|
|
7675
|
+
if (index !== -1) {
|
|
7676
|
+
this.zones[index].checked = zone.checked;
|
|
7677
|
+
}
|
|
7678
|
+
});
|
|
7679
|
+
const overallZone = this.zones.find((z) => z._id === "overall");
|
|
7680
|
+
const overallChecked = overallZone?.checked ?? false;
|
|
7681
|
+
const othersSelected = this.zones.some((z) => z._id !== "overall" && z.checked);
|
|
7682
|
+
if (clickedZoneId === "overall" && overallChecked) {
|
|
7683
|
+
this.zones = this.zones.map((z) => ({
|
|
7684
|
+
...z,
|
|
7685
|
+
checked: z._id === "overall",
|
|
7686
|
+
}));
|
|
7687
|
+
}
|
|
7688
|
+
if (clickedZoneId !== "overall" && overallChecked) {
|
|
7689
|
+
if (overallZone) {
|
|
7690
|
+
overallZone.checked = false;
|
|
7691
|
+
}
|
|
7692
|
+
}
|
|
7693
|
+
this.filteredZones = [...this.zones];
|
|
7694
|
+
this.selectedFilters.zoneName = this.zones.filter((z) => z.checked);
|
|
7695
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7696
|
+
this.cd.detectChanges();
|
|
7697
|
+
}
|
|
7698
|
+
toggleSelectAllLocations(event) {
|
|
7699
|
+
const isChecked = event.target.checked;
|
|
7700
|
+
this.filteredLocations.forEach((location) => (location.checked = isChecked));
|
|
7701
|
+
this.updateSelectedLocations();
|
|
7702
|
+
}
|
|
7703
|
+
toggleSelectAllStores(event) {
|
|
7704
|
+
const checked = event.target.checked;
|
|
7705
|
+
// Apply the selection to both filtered and full list of stores
|
|
7706
|
+
this.filteredStores.forEach((store) => (store.checked = checked));
|
|
7707
|
+
this.stores.forEach((store) => {
|
|
7708
|
+
const filteredStore = this.filteredStores.find((fStore) => fStore.storeId === store.storeId);
|
|
7709
|
+
if (filteredStore) {
|
|
7710
|
+
store.checked = checked; // Sync the checked state with full store list
|
|
7711
|
+
}
|
|
7712
|
+
});
|
|
7713
|
+
// Update the selected stores and persist the selection
|
|
7714
|
+
this.updateSelectedStores();
|
|
7715
|
+
}
|
|
7716
|
+
toggleSelectAllZones(event) {
|
|
7717
|
+
const checked = event.target.checked;
|
|
7718
|
+
this.filteredZones.forEach((zone) => {
|
|
7719
|
+
if (zone._id !== "overall") {
|
|
7720
|
+
zone.checked = checked;
|
|
7721
|
+
}
|
|
7722
|
+
else {
|
|
7723
|
+
zone.checked = false;
|
|
7724
|
+
}
|
|
7725
|
+
});
|
|
7726
|
+
this.zones.forEach((zone) => {
|
|
7727
|
+
const match = this.filteredZones.find((fz) => fz._id === zone._id);
|
|
7728
|
+
if (match) {
|
|
7729
|
+
zone.checked = match.checked;
|
|
7730
|
+
}
|
|
7731
|
+
});
|
|
7732
|
+
// Since this is bulk, pass a dummy value — any non-overall zone is fine
|
|
7733
|
+
const anySelectedZone = this.filteredZones.find((z) => z._id !== "overall");
|
|
7734
|
+
const clickedId = anySelectedZone ? anySelectedZone._id : "";
|
|
7735
|
+
this.updateSelectedZones(clickedId);
|
|
7736
|
+
}
|
|
7737
|
+
updateSelectedLocations() {
|
|
7738
|
+
// When locations are selected, fetch the related groups
|
|
7739
|
+
const selectedCities = this.filteredLocations
|
|
7740
|
+
.filter((location) => location.checked)
|
|
7741
|
+
.map((location) => location.city);
|
|
7742
|
+
this.filteredLocations.forEach((location) => {
|
|
7743
|
+
let findLocationIndex = this.locations.findIndex((loc) => loc.city == location.city);
|
|
7744
|
+
if (findLocationIndex != -1) {
|
|
7745
|
+
this.locations[findLocationIndex].checked = location.checked;
|
|
7746
|
+
}
|
|
7747
|
+
});
|
|
7748
|
+
if (selectedCities.length > 0 || !selectedCities.length) {
|
|
7749
|
+
this.selectedFilters.stores = [];
|
|
7750
|
+
this.groupsData = [];
|
|
7751
|
+
this.getGroups(); // Fetch groups based on selected cities
|
|
7752
|
+
// If there are selected groups, fetch the stores based on selected groups
|
|
7753
|
+
this.getStore();
|
|
7754
|
+
this.selectedFilters.location = this.locations;
|
|
7755
|
+
}
|
|
7756
|
+
else {
|
|
7757
|
+
this.filteredGroups = []; // Clear groups if no locations are selected
|
|
7758
|
+
this.selectedFilters.location = [];
|
|
7759
|
+
}
|
|
7760
|
+
this.selectedFilters.group = [];
|
|
7761
|
+
this.filteredStores = []; // Reset stores as well
|
|
7762
|
+
this.searchGroupText = "";
|
|
7763
|
+
this.searchStoreText = "";
|
|
7764
|
+
// this.Opendropdown = false;
|
|
7765
|
+
}
|
|
7766
|
+
toggleSelectAllGroups(event) {
|
|
7767
|
+
const isChecked = event.target.checked;
|
|
7768
|
+
this.filteredGroups.forEach((group) => (group.checked = isChecked));
|
|
7769
|
+
this.updateSelectedGroups();
|
|
7770
|
+
}
|
|
7771
|
+
updateSelectedGroups() {
|
|
7772
|
+
// Fetch the relevant stores after groups are selected
|
|
7773
|
+
const selectedGroups = this.filteredGroups
|
|
7774
|
+
.filter((group) => group.checked)
|
|
7775
|
+
.map((group) => group.groupName);
|
|
7776
|
+
this.filteredGroups.forEach((group) => {
|
|
7777
|
+
let findGroupIndex = this.groupsData.findIndex((item) => item.groupName == group.groupName);
|
|
7778
|
+
if (findGroupIndex != -1) {
|
|
7779
|
+
this.groupsData[findGroupIndex].checked = group.checked;
|
|
7780
|
+
}
|
|
7781
|
+
});
|
|
7782
|
+
if (selectedGroups.length > 0 || !selectedGroups.length) {
|
|
7783
|
+
this.selectedFilters.stores = [];
|
|
7784
|
+
// If there are selected groups, fetch the stores based on selected groups
|
|
7785
|
+
this.getStore();
|
|
7786
|
+
this.selectedFilters.group = this.groupsData;
|
|
7787
|
+
}
|
|
7788
|
+
else {
|
|
7789
|
+
// If no groups are selected, clear the stores list
|
|
7790
|
+
this.filteredStores = [];
|
|
7791
|
+
// Also, update localStorage to reflect the cleared store selection
|
|
7792
|
+
this.selectedFilters.stores = [];
|
|
7793
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7794
|
+
// Emit data via service
|
|
7795
|
+
// this.gs.dataRangeValue.next(this.selectedFilters);
|
|
7796
|
+
}
|
|
7797
|
+
// Clear the search store text when groups are updated
|
|
7798
|
+
this.searchStoreText = "";
|
|
7799
|
+
}
|
|
7800
|
+
Reset() {
|
|
7801
|
+
setTimeout(() => {
|
|
7802
|
+
this.filteredCountries = [];
|
|
7803
|
+
this.filteredGroups = [];
|
|
7804
|
+
this.filteredStores = [];
|
|
7805
|
+
this.filteredLocations = [];
|
|
7806
|
+
this.locations = [];
|
|
7807
|
+
this.groupsData = [];
|
|
7808
|
+
this.stores = [];
|
|
7809
|
+
this.filteredZones = [];
|
|
7810
|
+
this.zones = [];
|
|
7811
|
+
this.countries = [];
|
|
7812
|
+
this.searchLocationText = "";
|
|
7813
|
+
this.searchGroupText = "";
|
|
7814
|
+
this.searchStoreText = "";
|
|
7815
|
+
this.selectedFilters.stores = [];
|
|
7816
|
+
this.selectedFilters.group = [];
|
|
7817
|
+
this.selectedFilters.location = [];
|
|
7818
|
+
this.selectedFilters.country = [];
|
|
7819
|
+
this.selectedFilters.zoneName = [];
|
|
7820
|
+
this.getCountry();
|
|
7821
|
+
this.getLocations();
|
|
7822
|
+
this.getStore();
|
|
7823
|
+
this.getGroups();
|
|
7824
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
7825
|
+
window.location.reload();
|
|
7826
|
+
// this.gs.dataRangeValue.next(this.selectedFilters);
|
|
7827
|
+
this.cd.detectChanges();
|
|
7828
|
+
this.Opendropdown = false;
|
|
7829
|
+
}, 100);
|
|
7830
|
+
}
|
|
7831
|
+
filterLocations() {
|
|
7832
|
+
const searchText = this.searchLocationText.toLowerCase();
|
|
7833
|
+
if (searchText) {
|
|
7834
|
+
// Preserve the checked state during filtering
|
|
7835
|
+
this.filteredLocations = this.locations
|
|
7836
|
+
.map((location) => ({
|
|
7837
|
+
...location,
|
|
7838
|
+
checked: this.filteredLocations.find((l) => l.city === location.city)
|
|
7839
|
+
?.checked || false,
|
|
7840
|
+
}))
|
|
7841
|
+
.filter((location) => location?.city?.toLowerCase().includes(searchText));
|
|
7842
|
+
}
|
|
7843
|
+
else {
|
|
7844
|
+
// Restore the original checked state when search text is cleared
|
|
7845
|
+
this.filteredLocations = this.locations.map((location) => ({
|
|
7846
|
+
...location,
|
|
7847
|
+
checked: this.selectedFilters.location.find((l) => l.city === location.city)?.checked || false,
|
|
7848
|
+
}));
|
|
7849
|
+
}
|
|
7850
|
+
}
|
|
7851
|
+
filterGroups() {
|
|
7852
|
+
const searchText = this.searchGroupText.toLowerCase();
|
|
7853
|
+
if (searchText) {
|
|
7854
|
+
// Preserve the checked state during filtering
|
|
7855
|
+
this.filteredGroups = this.groupsData
|
|
7856
|
+
.map((group) => ({
|
|
7857
|
+
...group,
|
|
7858
|
+
checked: this.filteredGroups.find((g) => g.groupName === group.groupName)
|
|
7859
|
+
?.checked || false,
|
|
7860
|
+
}))
|
|
7861
|
+
.filter((group) => group?.groupName?.toLowerCase().includes(searchText));
|
|
7862
|
+
}
|
|
7863
|
+
else {
|
|
7864
|
+
// Restore the original checked state when search text is cleared
|
|
7865
|
+
this.filteredGroups = this.groupsData.map((group) => ({
|
|
7866
|
+
...group,
|
|
7867
|
+
checked: this.selectedFilters.group.find((g) => g.groupName === group.groupName)?.checked || false,
|
|
7868
|
+
}));
|
|
7869
|
+
}
|
|
7870
|
+
}
|
|
7871
|
+
filterStores() {
|
|
7872
|
+
const searchText = this.searchStoreText.toLowerCase();
|
|
7873
|
+
// Preserve checked states during filtering
|
|
7874
|
+
if (searchText) {
|
|
7875
|
+
// Filter based on search text while preserving checked state
|
|
7876
|
+
this.filteredStores = this.stores
|
|
7877
|
+
.map((store) => ({
|
|
7878
|
+
...store,
|
|
7879
|
+
// Check if the store is already checked in filteredStores, fallback to original stores' checked state
|
|
7880
|
+
checked: this.selectedFilters.stores.find((s) => s.storeId === store.storeId)?.checked ||
|
|
7881
|
+
store.checked ||
|
|
7882
|
+
false,
|
|
7883
|
+
}))
|
|
7884
|
+
.filter((store) => store.storeName.toLowerCase().includes(searchText));
|
|
7885
|
+
}
|
|
7886
|
+
else {
|
|
7887
|
+
// When the search text is cleared, restore the original list with preserved checked states
|
|
7888
|
+
this.filteredStores = this.stores.map((store) => ({
|
|
7889
|
+
...store,
|
|
7890
|
+
// Preserve the checked state based on the selected filters
|
|
7891
|
+
checked: this.selectedFilters.stores.find((s) => s.storeId === store.storeId)?.checked ||
|
|
7892
|
+
store.checked ||
|
|
7893
|
+
false,
|
|
7894
|
+
}));
|
|
7895
|
+
}
|
|
7896
|
+
}
|
|
7897
|
+
filterZones() {
|
|
7898
|
+
const searchText = this.searchZoneText.toLowerCase();
|
|
7899
|
+
// Preserve checked states during filtering
|
|
7900
|
+
if (searchText) {
|
|
7901
|
+
// Filter based on search text while preserving checked state
|
|
7902
|
+
this.filteredZones = this.zones
|
|
7903
|
+
.map((zone) => ({
|
|
7904
|
+
...zone,
|
|
7905
|
+
// Check if the store is already checked in filteredStores, fallback to original stores' checked state
|
|
7906
|
+
checked: this.selectedFilters.zoneName.find((s) => s._id === zone._id)
|
|
7907
|
+
?.checked ||
|
|
7908
|
+
zone.checked ||
|
|
7909
|
+
false,
|
|
7910
|
+
}))
|
|
7911
|
+
.filter((zone) => zone.tagName.toLowerCase().includes(searchText));
|
|
7912
|
+
}
|
|
7913
|
+
else {
|
|
7914
|
+
// When the search text is cleared, restore the original list with preserved checked states
|
|
7915
|
+
this.filteredZones = this.zones.map((zone) => ({
|
|
7916
|
+
...zone,
|
|
7917
|
+
// Preserve the checked state based on the selected filters
|
|
7918
|
+
checked: this.selectedFilters.zoneName.find((s) => s._id === zone._id)
|
|
7919
|
+
?.checked ||
|
|
7920
|
+
zone.checked ||
|
|
7921
|
+
false,
|
|
7922
|
+
}));
|
|
7923
|
+
}
|
|
7924
|
+
}
|
|
7925
|
+
closeDropdown() {
|
|
7926
|
+
this.dropdownOpen = null;
|
|
7927
|
+
}
|
|
7928
|
+
clickOutside(event) {
|
|
7929
|
+
const clickedInside = event.target.closest(".dropdown-container");
|
|
7930
|
+
const clickedoutSide = event.target.closest(".dropdown2");
|
|
7931
|
+
if (!clickedInside) {
|
|
7932
|
+
this.closeDropdown();
|
|
7933
|
+
}
|
|
7934
|
+
if (!clickedoutSide) {
|
|
7935
|
+
this.closeDropdown1();
|
|
7936
|
+
}
|
|
7937
|
+
}
|
|
7938
|
+
// getCountry(): void {
|
|
7939
|
+
// // const headerFilters: any = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
7940
|
+
// let obj ={
|
|
7941
|
+
// clientId: this.selectedFilters.client ? this.selectedFilters.client :this.users.clientId,
|
|
7942
|
+
// }
|
|
7943
|
+
// this.auth.getCountry(obj).subscribe({
|
|
7944
|
+
// next: (res: any) => {
|
|
7945
|
+
// let countryList = this.selectedFilters?.country?.filter((country:any) => country.checked).map((loc:any) => loc.allCountry);
|
|
7946
|
+
// // Map the fetched countries with default unchecked state
|
|
7947
|
+
// this.countires = res?.data?.countryData.map((allCountry: any) => ({
|
|
7948
|
+
// allCountry: allCountry.allCountry,
|
|
7949
|
+
// checked: countryList?.includes(allCountry.allCountry) ? true : false,
|
|
7950
|
+
// }));
|
|
7951
|
+
// // Sync the fetched countries with any stored checked values in localStorage
|
|
7952
|
+
// if (this.selectedFilters.country && Array.isArray(this.selectedFilters.country)) {
|
|
7953
|
+
// this.filteredCountries = this.countries.map(country => {
|
|
7954
|
+
// const matchedLocation = this.selectedFilters.country.find((loc: any) => loc.allCountry === country.allCountry);
|
|
7955
|
+
// return matchedLocation ? { ...country, checked: matchedLocation.checked } : country;
|
|
7956
|
+
// });
|
|
7957
|
+
// } else {
|
|
7958
|
+
// this.filteredCountries = this.countries;
|
|
7959
|
+
// }
|
|
7960
|
+
// if(this.searchLocationText) {
|
|
7961
|
+
// this.filteredCountries = this.countries.filter((country:any) => country.city.toLowerCase().includes(this.searchLocationText.toLowerCase()))
|
|
7962
|
+
// }
|
|
7963
|
+
// const selectedCountries = this.countries.filter((country) => country.checked).map((country) => country.allCountry);
|
|
7964
|
+
// if (selectedCountries.length > 0) {
|
|
7965
|
+
// setTimeout(()=>{
|
|
7966
|
+
// this.getStore(); // Fetch stores based on selected groups
|
|
7967
|
+
// },1000)
|
|
7968
|
+
// }
|
|
7969
|
+
// },
|
|
7970
|
+
// error: (err) => {
|
|
7971
|
+
// console.error("Failed to fetch countries", err);
|
|
7972
|
+
// },
|
|
7973
|
+
// });
|
|
7974
|
+
// }
|
|
7975
|
+
// selectedCountriesLabel(): string {
|
|
7976
|
+
// const selectedCountries = this.countryLabel = this.searchLocationText.length ? this.countries
|
|
7977
|
+
// .filter(country => country.checked).map(country => country.allCountry) : this.filteredCountries
|
|
7978
|
+
// .filter(country => country.checked).map(country => country.allCountry);
|
|
7979
|
+
// return selectedCountries.length === 0
|
|
7980
|
+
// ? ''
|
|
7981
|
+
// : selectedCountries.length === 1
|
|
7982
|
+
// ? selectedCountries[0]
|
|
7983
|
+
// : `${selectedCountries.length} countries`;
|
|
7984
|
+
// }
|
|
7985
|
+
// isAllCountriesSelected(): boolean {
|
|
7986
|
+
// return this.filteredCountries.every(country => country.checked);
|
|
7987
|
+
// }
|
|
7988
|
+
// filterCountries(): void {
|
|
7989
|
+
// const searchText = this.searchCountryText.toLowerCase();
|
|
7990
|
+
// if (searchText) {
|
|
7991
|
+
// // Preserve the checked state during filtering
|
|
7992
|
+
// this.filteredCountries = this.countires
|
|
7993
|
+
// .map(country => ({
|
|
7994
|
+
// ...country,
|
|
7995
|
+
// checked: this.filteredCountries.find(l => l.allCountry === country.allCountry)?.checked || false
|
|
7996
|
+
// }))
|
|
7997
|
+
// .filter(location =>
|
|
7998
|
+
// location?.allCountry?.toLowerCase().includes(searchText)
|
|
7999
|
+
// );
|
|
8000
|
+
// } else {
|
|
8001
|
+
// // Restore the original checked state when search text is cleared
|
|
8002
|
+
// this.filteredCountries = this.countires.map(country => ({
|
|
8003
|
+
// ...country,
|
|
8004
|
+
// checked: this.selectedFilters.country.find((l:any) => l.allCountry === country.allCountry)?.checked || false
|
|
8005
|
+
// }));
|
|
8006
|
+
// }
|
|
8007
|
+
// }
|
|
8008
|
+
getCountry() {
|
|
8009
|
+
let obj = {
|
|
8010
|
+
clientId: this.selectedFilters.client
|
|
8011
|
+
? this.selectedFilters.client
|
|
8012
|
+
: this.users.clientId,
|
|
8013
|
+
};
|
|
8014
|
+
this.auth.getCountry(obj).subscribe({
|
|
8015
|
+
next: (res) => {
|
|
8016
|
+
// Extract selected countries from existing filters (if any)
|
|
8017
|
+
let countryList = this.selectedFilters?.country
|
|
8018
|
+
?.filter((country) => country.checked)
|
|
8019
|
+
.map((loc) => loc.country);
|
|
8020
|
+
// Map API response to frontend model
|
|
8021
|
+
this.countries = res?.data?.countryData.map((item) => ({
|
|
8022
|
+
country: item.country,
|
|
8023
|
+
// checked: countryList?.length ? countryList.includes(item.country) : true,
|
|
8024
|
+
// checked: cityList?.length ? cityList.includes(city.city) : true,
|
|
8025
|
+
checked: countryList?.includes(item.country) ? true : false,
|
|
8026
|
+
}));
|
|
8027
|
+
if (this.selectedFilters.country &&
|
|
8028
|
+
Array.isArray(this.selectedFilters.country)) {
|
|
8029
|
+
this.filteredCountries = this.countries.map((location) => {
|
|
8030
|
+
const matchedLocation = this.selectedFilters.country.find((loc) => loc.country === location.country);
|
|
8031
|
+
return matchedLocation
|
|
8032
|
+
? { ...location, checked: matchedLocation.checked }
|
|
8033
|
+
: location;
|
|
8034
|
+
});
|
|
8035
|
+
}
|
|
6997
8036
|
else {
|
|
6998
|
-
this.
|
|
8037
|
+
this.filteredCountries = this.countries;
|
|
8038
|
+
}
|
|
8039
|
+
// Initially, all countries are visible
|
|
8040
|
+
this.filteredCountries = [...this.countries];
|
|
8041
|
+
// If a search text already exists, filter immediately
|
|
8042
|
+
if (this.searchCountryText) {
|
|
8043
|
+
this.filterCountries();
|
|
8044
|
+
}
|
|
8045
|
+
// Fetch stores if at least one country is selected
|
|
8046
|
+
let selectedCountries = this.countries.filter((country) => country.checked);
|
|
8047
|
+
if (selectedCountries.length > 0) {
|
|
8048
|
+
setTimeout(() => {
|
|
8049
|
+
this.getLocations();
|
|
8050
|
+
this.getStore(); // fetch stores
|
|
8051
|
+
}, 1000);
|
|
6999
8052
|
}
|
|
8053
|
+
},
|
|
8054
|
+
error: (err) => {
|
|
8055
|
+
console.error("Failed to fetch countries", err);
|
|
8056
|
+
},
|
|
8057
|
+
});
|
|
8058
|
+
}
|
|
8059
|
+
selectedCountriesLabel() {
|
|
8060
|
+
const selectedCountries = this.searchCountryText.length
|
|
8061
|
+
? this.filteredCountries
|
|
8062
|
+
.filter((country) => country.checked)
|
|
8063
|
+
.map((country) => country.country)
|
|
8064
|
+
: this.countries
|
|
8065
|
+
.filter((country) => country.checked)
|
|
8066
|
+
.map((country) => country.country);
|
|
8067
|
+
return selectedCountries.length === 0
|
|
8068
|
+
? ""
|
|
8069
|
+
: selectedCountries.length === 1
|
|
8070
|
+
? selectedCountries[0]
|
|
8071
|
+
: `${selectedCountries.length} countries`;
|
|
8072
|
+
}
|
|
8073
|
+
filterCountries() {
|
|
8074
|
+
const searchText = this.searchCountryText.toLowerCase();
|
|
8075
|
+
if (searchText) {
|
|
8076
|
+
// Filter and preserve checked state
|
|
8077
|
+
this.filteredCountries = this.countries
|
|
8078
|
+
.map((country) => ({
|
|
8079
|
+
...country,
|
|
8080
|
+
checked: this.filteredCountries.find((c) => c.country === country.country)
|
|
8081
|
+
?.checked || false,
|
|
8082
|
+
}))
|
|
8083
|
+
.filter((country) => country.country.toLowerCase().includes(searchText));
|
|
8084
|
+
}
|
|
8085
|
+
else {
|
|
8086
|
+
// Reset to full list
|
|
8087
|
+
this.filteredCountries = this.countries.map((country) => ({
|
|
8088
|
+
...country,
|
|
8089
|
+
checked: this.selectedFilters.country?.find((c) => c.country === country.country)?.checked || false,
|
|
8090
|
+
}));
|
|
8091
|
+
}
|
|
8092
|
+
}
|
|
8093
|
+
isAllCountriesSelected() {
|
|
8094
|
+
return (this.filteredCountries.length > 0 &&
|
|
8095
|
+
this.filteredCountries.every((country) => country.checked));
|
|
8096
|
+
}
|
|
8097
|
+
toggleSelectAllCountries(event) {
|
|
8098
|
+
const isChecked = event.target.checked;
|
|
8099
|
+
this.filteredCountries.forEach((country) => (country.checked = isChecked));
|
|
8100
|
+
this.updateSelectedCountries();
|
|
8101
|
+
}
|
|
8102
|
+
updateSelectedCountries() {
|
|
8103
|
+
// When locations are selected, fetch the related groups
|
|
8104
|
+
const selectedCountries = this.filteredCountries
|
|
8105
|
+
.filter((country) => country.checked)
|
|
8106
|
+
.map((country) => country.country);
|
|
8107
|
+
this.filteredCountries.forEach((country) => {
|
|
8108
|
+
let findCountryIndex = this.countries.findIndex((loc) => loc.country == country.country);
|
|
8109
|
+
if (findCountryIndex != -1) {
|
|
8110
|
+
this.countries[findCountryIndex].checked = country.checked;
|
|
8111
|
+
}
|
|
8112
|
+
});
|
|
8113
|
+
if (selectedCountries.length > 0 || !selectedCountries.length) {
|
|
8114
|
+
this.selectedFilters.stores = [];
|
|
8115
|
+
this.groupsData = [];
|
|
8116
|
+
this.locations = [];
|
|
8117
|
+
this.selectedFilters.zoneName = [];
|
|
8118
|
+
this.getLocations();
|
|
8119
|
+
this.getGroups(); // Fetch groups based on selected cities
|
|
8120
|
+
// If there are selected groups, fetch the stores based on selected groups
|
|
8121
|
+
this.getStore();
|
|
8122
|
+
this.getZone();
|
|
8123
|
+
this.selectedFilters.country = this.filteredCountries;
|
|
8124
|
+
}
|
|
8125
|
+
else {
|
|
8126
|
+
this.filteredGroups = []; // Clear groups if no locations are selected
|
|
8127
|
+
this.selectedFilters.country = [];
|
|
8128
|
+
}
|
|
8129
|
+
this.selectedFilters.group = [];
|
|
8130
|
+
this.filteredStores = []; // Reset stores as well
|
|
8131
|
+
this.filteredZones = [];
|
|
8132
|
+
this.searchGroupText = "";
|
|
8133
|
+
this.searchStoreText = "";
|
|
8134
|
+
// this.Opendropdown = false;
|
|
8135
|
+
}
|
|
8136
|
+
removeCountry() {
|
|
8137
|
+
this.Reset();
|
|
8138
|
+
}
|
|
8139
|
+
Apply() {
|
|
8140
|
+
// Close the dropdown
|
|
8141
|
+
this.Opendropdown = false;
|
|
8142
|
+
// Fetch existing filters from localStorage
|
|
8143
|
+
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
8144
|
+
this.selectedFilters.store = null;
|
|
8145
|
+
// Ensure current selections are reflected
|
|
8146
|
+
this.selectedFilters.country = this.filteredCountries;
|
|
8147
|
+
this.selectedFilters.location = this.locations;
|
|
8148
|
+
this.selectedFilters.group = this.groupsData;
|
|
8149
|
+
this.selectedFilters.stores = headerFilters.stores
|
|
8150
|
+
? headerFilters.stores
|
|
8151
|
+
: this.stores;
|
|
8152
|
+
this.selectedFilters.zoneName = headerFilters.zoneName
|
|
8153
|
+
? headerFilters.zoneName
|
|
8154
|
+
: this.zones;
|
|
8155
|
+
// this.selectedFilters.zoneName = this.filteredZones;
|
|
8156
|
+
// Store updated filters back in localStorage
|
|
8157
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
8158
|
+
// this.gs.dataRangeValue.next(this.selectedFilters);
|
|
8159
|
+
window.location.reload();
|
|
8160
|
+
// Emit the updated filters via the service
|
|
8161
|
+
// this.gs.dataRangeValue.next(this.selectedFilters);
|
|
8162
|
+
// Trigger refresh if necessary
|
|
8163
|
+
// this.gs.manageRefreshTrigger.next(true);
|
|
8164
|
+
this.cd.detectChanges();
|
|
8165
|
+
}
|
|
8166
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MetricsHeaderComponent, deps: [{ token: AuthService }, { token: i2.Router }, { token: i1.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
8167
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: MetricsHeaderComponent, selector: "lib-metrics-header", host: { listeners: { "document:click": "clickOutside($event)" } }, ngImport: i0, template: "<div class=\"me-3\">\r\n <label *ngIf=\"selectedCountriesLabel()\" class=\"badge badge-light-default mx-2\">{{selectedCountriesLabel()}} \r\n <span class=\"cursor-pointer\" (click)=\"removeCountry()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M9 3L3 9M3 3L9 9\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </label>\r\n <label *ngIf=\"selectedLocationsLabel()\" class=\"badge badge-light-default mx-2\">{{selectedLocationsLabel()}} \r\n <span class=\"cursor-pointer\" (click)=\"removeLocation()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M9 3L3 9M3 3L9 9\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </label>\r\n <label *ngIf=\"selectedGroupsLabel()\" class=\"badge badge-light-default mx-2\">{{selectedGroupsLabel()}} \r\n <span class=\"cursor-pointer\" (click)=\"removeGroup()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M9 3L3 9M3 3L9 9\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </label>\r\n <label class=\"badge badge-light-default\">{{selectedStoresLabel()}}</label>\r\n <label class=\"badge badge-light-default mx-2\">{{selectedZonesLabel()}} \r\n <!-- <span class=\"cursor-pointer\" (click)=\"removeGroup()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M9 3L3 9M3 3L9 9\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span> -->\r\n </label>\r\n</div>\r\n\r\n\r\n<div class=\"wrapper me-3\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\">\r\n<lib-select [items]=\"clientList\" [multi]=\"false\" [searchField]=\"'clientName'\" [disabled]=\"false\" [idField]=\"'clientId'\"\r\n(selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n</div>\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=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" style=\"min-width: 260px !important;\" type=\"text\" matInput\r\n ngxDaterangepickerMd [drops]=\"'down'\" [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [autoApply]=\"true\"\r\n [alwaysShowCalendars]=\"false\" [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\"\r\n [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n</div>\r\n<div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"opendropdown($event)\" class=\"btn btn-default mx-2 rounded-3 text-nowrap border-val\">\r\n <!-- <span class=\"me-2\">Filter</span> -->\r\n <svg class=\"pl-3\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n\r\n <div *ngIf=\"Opendropdown\" class=\"card p-5 dropdown2 position-absolute z-1 end-0\" style=\"z-index: 1 !important;\" (clickOutside)=\"closeDropdown1()\">\r\n <div class=\"dropdown-title d-flex justify-content-between mb-2\">Filter Options\r\n <button class=\"btn btn-outline w-25 ms-3 btn-resize\" (click)=\"Reset()\"> Reset </button>\r\n <button class=\"btn btn-primary w-25 btn-resize\" (click)=\"Apply()\">Apply</button>\r\n </div>\r\n\r\n <!-- Country Dropdown -->\r\n<div class=\"dropdown-container\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\" (click)=\"toggleDropdown('country')\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input cursor-pointer\" \r\n [value]=\"selectedCountriesLabel()\"\r\n readonly\r\n placeholder=\"Select country\"\r\n />\r\n </div>\r\n <div class=\"dropdown-menu custom-dropdown-menu\" *ngIf=\"dropdownOpen === 'country'\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control mb-2 dropdown-search\" \r\n placeholder=\"Search country\" \r\n [(ngModel)]=\"searchCountryText\" \r\n (ngModelChange)=\"filterCountries()\" \r\n />\r\n <div class=\"form-check mb-2 dropdown-item custom-dropdown-item\">\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n id=\"selectAllCountries\" \r\n [checked]=\"isAllCountriesSelected()\" \r\n (change)=\"toggleSelectAllCountries($event)\" \r\n />\r\n <label class=\"form-check-label\" for=\"selectAllCountries\">\r\n Select All\r\n </label>\r\n </div>\r\n <div \r\n class=\"dropdown-item form-check custom-dropdown-item\" \r\n *ngFor=\"let country of filteredCountries\"\r\n >\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n [id]=\"country.country\" \r\n [(ngModel)]=\"country.checked\"\r\n (change)=\"updateSelectedCountries()\" \r\n />\r\n <label class=\"form-check-label\" [for]=\"country.country\">\r\n {{ country.country }}\r\n </label>\r\n \r\n </div>\r\n </div>\r\n</div>\r\n\r\n <!-- Location Dropdown -->\r\n<div class=\"dropdown-container mt-3\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\" (click)=\"toggleDropdown('location')\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input cursor-pointer\" \r\n [value]=\"selectedLocationsLabel()\"\r\n readonly\r\n placeholder=\"Select Region\"\r\n />\r\n </div>\r\n <div class=\"dropdown-menu custom-dropdown-menu\" *ngIf=\"dropdownOpen === 'location'\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control mb-2 dropdown-search\" \r\n placeholder=\"Search Region\" \r\n [(ngModel)]=\"searchLocationText\" \r\n (ngModelChange)=\"filterLocations()\" \r\n />\r\n <div class=\"form-check mb-2 dropdown-item custom-dropdown-item\">\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n id=\"selectAllLocations\" \r\n [checked]=\"isAllLocationsSelected()\" \r\n (change)=\"toggleSelectAllLocations($event)\" \r\n />\r\n <label class=\"form-check-label\" for=\"selectAllLocations\">\r\n Select All\r\n </label>\r\n </div>\r\n <div \r\n class=\"dropdown-item form-check custom-dropdown-item\" \r\n *ngFor=\"let location of filteredLocations\"\r\n >\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n [id]=\"location.city\" \r\n [(ngModel)]=\"location.checked\"\r\n (change)=\"updateSelectedLocations()\" \r\n />\r\n <label class=\"form-check-label\" [for]=\"location.city\">\r\n {{ location.city }}\r\n </label>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Group Dropdown -->\r\n<div class=\"dropdown-container mt-3\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\" (click)=\"toggleDropdown('group')\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input cursor-pointer\" \r\n [value]=\"selectedGroupsLabel()\" readonly\r\n placeholder=\"Select clusters\"\r\n />\r\n </div>\r\n <div class=\"dropdown-menu custom-dropdown-menu\" *ngIf=\"dropdownOpen === 'group'\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control mb-2 dropdown-search\" \r\n placeholder=\"Search clusters\" \r\n [(ngModel)]=\"searchGroupText\" \r\n (ngModelChange)=\"filterGroups()\" \r\n />\r\n <div class=\"form-check mb-2 dropdown-item custom-dropdown-item\">\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n id=\"selectAllGroups\" \r\n [checked]=\"isAllGroupsSelected()\" \r\n (change)=\"toggleSelectAllGroups($event)\" \r\n />\r\n <label class=\"form-check-label\" for=\"selectAllGroups\">\r\n Select All\r\n </label>\r\n </div>\r\n <div \r\n class=\"dropdown-item form-check custom-dropdown-item\" \r\n *ngFor=\"let group of filteredGroups\"\r\n >\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n [id]=\"group.groupName\"\r\n [(ngModel)]=\"group.checked\"\r\n (change)=\"updateSelectedGroups()\" \r\n />\r\n <label class=\"form-check-label\" [for]=\"group.groupName\">\r\n {{ group.groupName }}\r\n </label>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<!-- Store Dropdown -->\r\n<div class=\"dropdown-container mt-3\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\" (click)=\"toggleDropdown('store')\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input cursor-pointer\"\r\n [value]=\"selectedStoresLabel()\"\r\n readonly\r\n placeholder=\"Select stores\"\r\n />\r\n </div>\r\n <div class=\"dropdown-menu custom-dropdown-menu\" *ngIf=\"dropdownOpen === 'store'\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control mb-2 dropdown-search \" \r\n placeholder=\"Search stores\" \r\n [(ngModel)]=\"searchStoreText\" \r\n (ngModelChange)=\"filterStores()\" \r\n />\r\n <div class=\"form-check mb-2 dropdown-item custom-dropdown-item\">\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n id=\"selectAllStores\" \r\n [checked]=\"isAllStoresSelected()\" \r\n (change)=\"toggleSelectAllStores($event)\" \r\n />\r\n <label class=\"form-check-label\" for=\"selectAllStores\">\r\n Select All\r\n </label>\r\n </div>\r\n <div \r\n class=\"dropdown-item form-check custom-dropdown-item\" \r\n *ngFor=\"let store of filteredStores\"\r\n >\r\n <input \r\n class=\"form-check-input\" \r\n type=\"checkbox\" \r\n [id]=\"store.storeId\"\r\n [(ngModel)]=\"store.checked\"\r\n (change)=\"updateSelectedStores()\" \r\n />\r\n <label class=\"form-check-label\" [for]=\"store.storeId\">\r\n {{ store.storeName }}\r\n </label>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Zone Dropdown -->\r\n<div class=\"dropdown-container mt-3\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\" (click)=\"toggleDropdown('zone')\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input cursor-pointer\"\r\n [value]=\"selectedZonesLabel()\"\r\n readonly\r\n placeholder=\"Select zones\"\r\n />\r\n </div>\r\n <div class=\"dropdown-menu custom-dropdown-menu\" *ngIf=\"dropdownOpen === 'zone'\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control mb-2 dropdown-search \" \r\n placeholder=\"Search zones\" \r\n [(ngModel)]=\"searchZoneText\" \r\n (ngModelChange)=\"filterZones()\" \r\n />\r\n <div class=\"form-check mb-2 dropdown-item custom-dropdown-item\">\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n id=\"selectAllZones\" \r\n [checked]=\"isAllZonesSelected()\" \r\n (change)=\"toggleSelectAllZones($event)\" \r\n />\r\n <label class=\"form-check-label\" for=\"selectAllZones\">\r\n Select All\r\n </label>\r\n </div>\r\n <div \r\n class=\"dropdown-item form-check custom-dropdown-item\" \r\n *ngFor=\"let zone of filteredZones\"\r\n >\r\n <input \r\n class=\"form-check-input\" \r\n type=\"checkbox\" \r\n [id]=\"zone._id\"\r\n [(ngModel)]=\"zone.checked\"\r\n (change)=\"updateSelectedZones(zone._id)\"\r\n />\r\n <label class=\"form-check-label\" [for]=\"zone._id\">\r\n {{ zone.tagName }}\r\n </label>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n\r\n\r\n </div>\r\n</div>", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:365px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}.filter-label{color:var(--Gray-500, #667085)!important;font-size:14px;font-style:normal;font-weight:600;line-height:20px;text-transform:capitalize}.position-relative{position:relative}.filter-icon{cursor:pointer}.dropdown-container{position:relative;display:inline-block;width:100%}.dropdown-header{cursor:pointer;width:100%}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize;width:100%;box-sizing:border-box}.dropdown-menu{position:absolute;top:100%;left:0;right:0;border:1px solid #ccc;background-color:#fff;z-index:1000;max-height:230px;overflow-y:auto;display:block;box-sizing:border-box;padding:10px 5px}.dropdown-item{padding:6px 0}.dropdown-item:hover{background-color:#f1f1f1}.dropdown-item input[type=checkbox]{margin-right:10px}.custom-dropdown-menu{border-radius:4px;box-shadow:0 1px 2px #1018280d}.custom-dropdown-item{display:flex;align-items:center}.custom-dropdown-item input{margin-left:10px}.btn-resize{font-size:13px!important;height:29px!important;line-height:11px!important;padding:3px!important}.dropdown2{position:absolute;top:70px;min-width:270px!important}.dropdown2 .dropdown-title{color:var(--Gray-900, #101828);font-size:14px;font-weight:600;line-height:24px}.dropdown2 .dropdown{position:relative;display:inline-block}.dropdown2 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.form-check-label{color:var(--Gray-700, #344054)!important;font-size:14px;font-style:normal;font-weight:500;line-height:20px}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}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { 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: "directive", type: i7.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
|
|
8168
|
+
}
|
|
8169
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MetricsHeaderComponent, decorators: [{
|
|
8170
|
+
type: Component,
|
|
8171
|
+
args: [{ selector: "lib-metrics-header", template: "<div class=\"me-3\">\r\n <label *ngIf=\"selectedCountriesLabel()\" class=\"badge badge-light-default mx-2\">{{selectedCountriesLabel()}} \r\n <span class=\"cursor-pointer\" (click)=\"removeCountry()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M9 3L3 9M3 3L9 9\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </label>\r\n <label *ngIf=\"selectedLocationsLabel()\" class=\"badge badge-light-default mx-2\">{{selectedLocationsLabel()}} \r\n <span class=\"cursor-pointer\" (click)=\"removeLocation()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M9 3L3 9M3 3L9 9\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </label>\r\n <label *ngIf=\"selectedGroupsLabel()\" class=\"badge badge-light-default mx-2\">{{selectedGroupsLabel()}} \r\n <span class=\"cursor-pointer\" (click)=\"removeGroup()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M9 3L3 9M3 3L9 9\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </label>\r\n <label class=\"badge badge-light-default\">{{selectedStoresLabel()}}</label>\r\n <label class=\"badge badge-light-default mx-2\">{{selectedZonesLabel()}} \r\n <!-- <span class=\"cursor-pointer\" (click)=\"removeGroup()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\r\n <path d=\"M9 3L3 9M3 3L9 9\" stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span> -->\r\n </label>\r\n</div>\r\n\r\n\r\n<div class=\"wrapper me-3\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\">\r\n<lib-select [items]=\"clientList\" [multi]=\"false\" [searchField]=\"'clientName'\" [disabled]=\"false\" [idField]=\"'clientId'\"\r\n(selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n</div>\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=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" style=\"min-width: 260px !important;\" type=\"text\" matInput\r\n ngxDaterangepickerMd [drops]=\"'down'\" [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [autoApply]=\"true\"\r\n [alwaysShowCalendars]=\"false\" [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\"\r\n [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n</div>\r\n<div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"opendropdown($event)\" class=\"btn btn-default mx-2 rounded-3 text-nowrap border-val\">\r\n <!-- <span class=\"me-2\">Filter</span> -->\r\n <svg class=\"pl-3\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n\r\n <div *ngIf=\"Opendropdown\" class=\"card p-5 dropdown2 position-absolute z-1 end-0\" style=\"z-index: 1 !important;\" (clickOutside)=\"closeDropdown1()\">\r\n <div class=\"dropdown-title d-flex justify-content-between mb-2\">Filter Options\r\n <button class=\"btn btn-outline w-25 ms-3 btn-resize\" (click)=\"Reset()\"> Reset </button>\r\n <button class=\"btn btn-primary w-25 btn-resize\" (click)=\"Apply()\">Apply</button>\r\n </div>\r\n\r\n <!-- Country Dropdown -->\r\n<div class=\"dropdown-container\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\" (click)=\"toggleDropdown('country')\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input cursor-pointer\" \r\n [value]=\"selectedCountriesLabel()\"\r\n readonly\r\n placeholder=\"Select country\"\r\n />\r\n </div>\r\n <div class=\"dropdown-menu custom-dropdown-menu\" *ngIf=\"dropdownOpen === 'country'\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control mb-2 dropdown-search\" \r\n placeholder=\"Search country\" \r\n [(ngModel)]=\"searchCountryText\" \r\n (ngModelChange)=\"filterCountries()\" \r\n />\r\n <div class=\"form-check mb-2 dropdown-item custom-dropdown-item\">\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n id=\"selectAllCountries\" \r\n [checked]=\"isAllCountriesSelected()\" \r\n (change)=\"toggleSelectAllCountries($event)\" \r\n />\r\n <label class=\"form-check-label\" for=\"selectAllCountries\">\r\n Select All\r\n </label>\r\n </div>\r\n <div \r\n class=\"dropdown-item form-check custom-dropdown-item\" \r\n *ngFor=\"let country of filteredCountries\"\r\n >\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n [id]=\"country.country\" \r\n [(ngModel)]=\"country.checked\"\r\n (change)=\"updateSelectedCountries()\" \r\n />\r\n <label class=\"form-check-label\" [for]=\"country.country\">\r\n {{ country.country }}\r\n </label>\r\n \r\n </div>\r\n </div>\r\n</div>\r\n\r\n <!-- Location Dropdown -->\r\n<div class=\"dropdown-container mt-3\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\" (click)=\"toggleDropdown('location')\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input cursor-pointer\" \r\n [value]=\"selectedLocationsLabel()\"\r\n readonly\r\n placeholder=\"Select Region\"\r\n />\r\n </div>\r\n <div class=\"dropdown-menu custom-dropdown-menu\" *ngIf=\"dropdownOpen === 'location'\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control mb-2 dropdown-search\" \r\n placeholder=\"Search Region\" \r\n [(ngModel)]=\"searchLocationText\" \r\n (ngModelChange)=\"filterLocations()\" \r\n />\r\n <div class=\"form-check mb-2 dropdown-item custom-dropdown-item\">\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n id=\"selectAllLocations\" \r\n [checked]=\"isAllLocationsSelected()\" \r\n (change)=\"toggleSelectAllLocations($event)\" \r\n />\r\n <label class=\"form-check-label\" for=\"selectAllLocations\">\r\n Select All\r\n </label>\r\n </div>\r\n <div \r\n class=\"dropdown-item form-check custom-dropdown-item\" \r\n *ngFor=\"let location of filteredLocations\"\r\n >\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n [id]=\"location.city\" \r\n [(ngModel)]=\"location.checked\"\r\n (change)=\"updateSelectedLocations()\" \r\n />\r\n <label class=\"form-check-label\" [for]=\"location.city\">\r\n {{ location.city }}\r\n </label>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Group Dropdown -->\r\n<div class=\"dropdown-container mt-3\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\" (click)=\"toggleDropdown('group')\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input cursor-pointer\" \r\n [value]=\"selectedGroupsLabel()\" readonly\r\n placeholder=\"Select clusters\"\r\n />\r\n </div>\r\n <div class=\"dropdown-menu custom-dropdown-menu\" *ngIf=\"dropdownOpen === 'group'\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control mb-2 dropdown-search\" \r\n placeholder=\"Search clusters\" \r\n [(ngModel)]=\"searchGroupText\" \r\n (ngModelChange)=\"filterGroups()\" \r\n />\r\n <div class=\"form-check mb-2 dropdown-item custom-dropdown-item\">\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n id=\"selectAllGroups\" \r\n [checked]=\"isAllGroupsSelected()\" \r\n (change)=\"toggleSelectAllGroups($event)\" \r\n />\r\n <label class=\"form-check-label\" for=\"selectAllGroups\">\r\n Select All\r\n </label>\r\n </div>\r\n <div \r\n class=\"dropdown-item form-check custom-dropdown-item\" \r\n *ngFor=\"let group of filteredGroups\"\r\n >\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n [id]=\"group.groupName\"\r\n [(ngModel)]=\"group.checked\"\r\n (change)=\"updateSelectedGroups()\" \r\n />\r\n <label class=\"form-check-label\" [for]=\"group.groupName\">\r\n {{ group.groupName }}\r\n </label>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n<!-- Store Dropdown -->\r\n<div class=\"dropdown-container mt-3\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\" (click)=\"toggleDropdown('store')\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input cursor-pointer\"\r\n [value]=\"selectedStoresLabel()\"\r\n readonly\r\n placeholder=\"Select stores\"\r\n />\r\n </div>\r\n <div class=\"dropdown-menu custom-dropdown-menu\" *ngIf=\"dropdownOpen === 'store'\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control mb-2 dropdown-search \" \r\n placeholder=\"Search stores\" \r\n [(ngModel)]=\"searchStoreText\" \r\n (ngModelChange)=\"filterStores()\" \r\n />\r\n <div class=\"form-check mb-2 dropdown-item custom-dropdown-item\">\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n id=\"selectAllStores\" \r\n [checked]=\"isAllStoresSelected()\" \r\n (change)=\"toggleSelectAllStores($event)\" \r\n />\r\n <label class=\"form-check-label\" for=\"selectAllStores\">\r\n Select All\r\n </label>\r\n </div>\r\n <div \r\n class=\"dropdown-item form-check custom-dropdown-item\" \r\n *ngFor=\"let store of filteredStores\"\r\n >\r\n <input \r\n class=\"form-check-input\" \r\n type=\"checkbox\" \r\n [id]=\"store.storeId\"\r\n [(ngModel)]=\"store.checked\"\r\n (change)=\"updateSelectedStores()\" \r\n />\r\n <label class=\"form-check-label\" [for]=\"store.storeId\">\r\n {{ store.storeName }}\r\n </label>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Zone Dropdown -->\r\n<div class=\"dropdown-container mt-3\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\" (click)=\"toggleDropdown('zone')\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input cursor-pointer\"\r\n [value]=\"selectedZonesLabel()\"\r\n readonly\r\n placeholder=\"Select zones\"\r\n />\r\n </div>\r\n <div class=\"dropdown-menu custom-dropdown-menu\" *ngIf=\"dropdownOpen === 'zone'\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control mb-2 dropdown-search \" \r\n placeholder=\"Search zones\" \r\n [(ngModel)]=\"searchZoneText\" \r\n (ngModelChange)=\"filterZones()\" \r\n />\r\n <div class=\"form-check mb-2 dropdown-item custom-dropdown-item\">\r\n <input \r\n class=\"form-check-input cursor-pointer\" \r\n type=\"checkbox\" \r\n id=\"selectAllZones\" \r\n [checked]=\"isAllZonesSelected()\" \r\n (change)=\"toggleSelectAllZones($event)\" \r\n />\r\n <label class=\"form-check-label\" for=\"selectAllZones\">\r\n Select All\r\n </label>\r\n </div>\r\n <div \r\n class=\"dropdown-item form-check custom-dropdown-item\" \r\n *ngFor=\"let zone of filteredZones\"\r\n >\r\n <input \r\n class=\"form-check-input\" \r\n type=\"checkbox\" \r\n [id]=\"zone._id\"\r\n [(ngModel)]=\"zone.checked\"\r\n (change)=\"updateSelectedZones(zone._id)\"\r\n />\r\n <label class=\"form-check-label\" [for]=\"zone._id\">\r\n {{ zone.tagName }}\r\n </label>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n\r\n\r\n </div>\r\n</div>", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:365px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}.filter-label{color:var(--Gray-500, #667085)!important;font-size:14px;font-style:normal;font-weight:600;line-height:20px;text-transform:capitalize}.position-relative{position:relative}.filter-icon{cursor:pointer}.dropdown-container{position:relative;display:inline-block;width:100%}.dropdown-header{cursor:pointer;width:100%}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize;width:100%;box-sizing:border-box}.dropdown-menu{position:absolute;top:100%;left:0;right:0;border:1px solid #ccc;background-color:#fff;z-index:1000;max-height:230px;overflow-y:auto;display:block;box-sizing:border-box;padding:10px 5px}.dropdown-item{padding:6px 0}.dropdown-item:hover{background-color:#f1f1f1}.dropdown-item input[type=checkbox]{margin-right:10px}.custom-dropdown-menu{border-radius:4px;box-shadow:0 1px 2px #1018280d}.custom-dropdown-item{display:flex;align-items:center}.custom-dropdown-item input{margin-left:10px}.btn-resize{font-size:13px!important;height:29px!important;line-height:11px!important;padding:3px!important}.dropdown2{position:absolute;top:70px;min-width:270px!important}.dropdown2 .dropdown-title{color:var(--Gray-900, #101828);font-size:14px;font-weight:600;line-height:24px}.dropdown2 .dropdown{position:relative;display:inline-block}.dropdown2 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.form-check-label{color:var(--Gray-700, #344054)!important;font-size:14px;font-style:normal;font-weight:500;line-height:20px}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}\n"] }]
|
|
8172
|
+
}], ctorParameters: () => [{ type: AuthService }, { type: i2.Router }, { type: i1.GlobalStateService }, { type: i0.ChangeDetectorRef }], propDecorators: { onClick: [{
|
|
8173
|
+
type: HostListener,
|
|
8174
|
+
args: ["document:click", ["$event"]]
|
|
8175
|
+
}], clickOutside: [{
|
|
8176
|
+
type: HostListener,
|
|
8177
|
+
args: ["document:click", ["$event"]]
|
|
8178
|
+
}] } });
|
|
8179
|
+
|
|
8180
|
+
class ToolbarComponent {
|
|
8181
|
+
layout;
|
|
8182
|
+
router;
|
|
8183
|
+
route;
|
|
8184
|
+
gs;
|
|
8185
|
+
auth;
|
|
8186
|
+
unsubscribe = [];
|
|
8187
|
+
// Public props
|
|
8188
|
+
currentLayoutType;
|
|
8189
|
+
appToolbarLayout;
|
|
8190
|
+
// toolbar
|
|
8191
|
+
appToolbarDisplay;
|
|
8192
|
+
appToolbarContainer;
|
|
8193
|
+
appToolbarContainerCSSClass = "";
|
|
8194
|
+
appToolbarFixedDesktop;
|
|
8195
|
+
appToolbarFixedMobile;
|
|
8196
|
+
appPageTitleDisplay;
|
|
8197
|
+
// page title
|
|
8198
|
+
appPageTitleDirection = "";
|
|
8199
|
+
appPageTitleCSSClass = "";
|
|
8200
|
+
appPageTitleBreadcrumb;
|
|
8201
|
+
appPageTitleDescription;
|
|
8202
|
+
querParams;
|
|
8203
|
+
singleSelect;
|
|
8204
|
+
multiSelect;
|
|
8205
|
+
datepicker;
|
|
8206
|
+
singleSelectdatepicker;
|
|
8207
|
+
singleStore;
|
|
8208
|
+
headervalue;
|
|
8209
|
+
storeId;
|
|
8210
|
+
users;
|
|
8211
|
+
selectedFilters = {
|
|
8212
|
+
client: null,
|
|
8213
|
+
clients: [],
|
|
8214
|
+
store: null,
|
|
8215
|
+
stores: [],
|
|
8216
|
+
date: null,
|
|
8217
|
+
};
|
|
8218
|
+
trafficdatepicker;
|
|
8219
|
+
traxdatepicker;
|
|
8220
|
+
urlString;
|
|
8221
|
+
traxwithoutdatepicker;
|
|
8222
|
+
storesSingle;
|
|
8223
|
+
nobWithoutClient;
|
|
8224
|
+
merticsHeader;
|
|
8225
|
+
constructor(layout, router, route, gs, auth) {
|
|
8226
|
+
this.layout = layout;
|
|
8227
|
+
this.router = router;
|
|
8228
|
+
this.route = route;
|
|
8229
|
+
this.gs = gs;
|
|
8230
|
+
this.auth = auth;
|
|
8231
|
+
}
|
|
8232
|
+
ngOnInit() {
|
|
8233
|
+
if ("user-info" in localStorage) {
|
|
8234
|
+
const userData = JSON.parse(localStorage.getItem("user-info") || "{}");
|
|
8235
|
+
this.users = userData;
|
|
8236
|
+
}
|
|
8237
|
+
if ("header-filters" in localStorage) {
|
|
8238
|
+
const data = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
8239
|
+
this.client = data?.client;
|
|
8240
|
+
}
|
|
8241
|
+
this.getUserInfo(this.client ? this.client : this.users.client);
|
|
8242
|
+
this.showPageTitle();
|
|
8243
|
+
const subscr = this.layout.layoutConfigSubject
|
|
8244
|
+
.asObservable()
|
|
8245
|
+
.subscribe((config) => {
|
|
8246
|
+
this.updateProps(config);
|
|
8247
|
+
});
|
|
8248
|
+
this.unsubscribe.push(subscr);
|
|
8249
|
+
}
|
|
8250
|
+
updateProps(config) {
|
|
8251
|
+
this.appToolbarDisplay = this.layout.getProp("app.toolbar.display", config);
|
|
8252
|
+
if (!this.appToolbarDisplay) {
|
|
8253
|
+
return;
|
|
8254
|
+
}
|
|
8255
|
+
this.appPageTitleDisplay = this.layout.getProp("app.pageTitle.display", config);
|
|
8256
|
+
this.appToolbarContainer = this.layout.getProp("app.toolbar.container", config);
|
|
8257
|
+
this.appToolbarContainerCSSClass =
|
|
8258
|
+
this.appToolbarContainer === "fixed"
|
|
8259
|
+
? "container-xxl"
|
|
8260
|
+
: "container-fluid";
|
|
8261
|
+
const containerClass = this.layout.getProp("app.toolbar.containerClass", config);
|
|
8262
|
+
if (containerClass) {
|
|
8263
|
+
this.appToolbarContainerCSSClass += ` ${containerClass}`;
|
|
8264
|
+
}
|
|
8265
|
+
this.appToolbarFixedDesktop = this.layout.getProp("app.toolbar.fixed.desktop", config);
|
|
8266
|
+
if (this.appToolbarFixedDesktop) {
|
|
8267
|
+
document.body.setAttribute("data-kt-app-toolbar-fixed", "true");
|
|
8268
|
+
}
|
|
8269
|
+
this.appToolbarFixedMobile = this.layout.getProp("app.toolbar.fixed.mobile", config);
|
|
8270
|
+
if (this.appToolbarFixedMobile) {
|
|
8271
|
+
document.body.setAttribute("data-kt-app-toolbar-fixed-mobile", "true");
|
|
8272
|
+
}
|
|
8273
|
+
// toolbar
|
|
8274
|
+
this.appPageTitleDirection = this.layout.getProp("app.pageTitle.direction", config);
|
|
8275
|
+
this.appPageTitleCSSClass = this.layout.getProp("app.pageTitle.class", config);
|
|
8276
|
+
this.appPageTitleBreadcrumb = this.layout.getProp("app.pageTitle.breadCrumb", config);
|
|
8277
|
+
this.appPageTitleDescription = this.layout.getProp("app.pageTitle.description", config);
|
|
8278
|
+
document.body.setAttribute("data-kt-app-toolbar-enabled", "true");
|
|
8279
|
+
}
|
|
8280
|
+
destroy$ = new Subject();
|
|
8281
|
+
ngOnDestroy() {
|
|
8282
|
+
this.unsubscribe.forEach((sb) => sb.unsubscribe());
|
|
8283
|
+
this.destroy$.next(true);
|
|
8284
|
+
this.destroy$.complete();
|
|
8285
|
+
// localStorage.removeItem("usersEmail-info");
|
|
8286
|
+
}
|
|
8287
|
+
client;
|
|
8288
|
+
urlString1;
|
|
8289
|
+
showPageTitle() {
|
|
8290
|
+
let URL = "";
|
|
8291
|
+
if ("header-filters" in localStorage) {
|
|
8292
|
+
const data = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
8293
|
+
const store = this.route.snapshot.queryParamMap;
|
|
8294
|
+
this.storeId = data?.store;
|
|
8295
|
+
if (store?.params?.['storeId']) {
|
|
8296
|
+
this.storeId = store.params['storeId'];
|
|
8297
|
+
data.store = store.params['storeId'];
|
|
8298
|
+
localStorage.setItem('header-filters', JSON.stringify(data));
|
|
8299
|
+
}
|
|
8300
|
+
const currentUrl = this.router.url;
|
|
8301
|
+
const updatedUrl = currentUrl.replace(/\/manage\/stores\/\d+-\d+\//, `/manage/stores/`);
|
|
8302
|
+
URL = updatedUrl;
|
|
8303
|
+
// this.router.navigate([URL])
|
|
8304
|
+
}
|
|
8305
|
+
const url = URL.split("?")[0].split('/');
|
|
8306
|
+
this.urlString = URL;
|
|
8307
|
+
this.urlString1 = URL.split('/');
|
|
8308
|
+
if (this.users?.userType === "tango") {
|
|
8309
|
+
if (url[2] == "settings" || URL == "/manage/users/client" ||
|
|
8310
|
+
URL == "/manage/stores" || URL === "/manage/stores?type=stores" || URL === "/manage/stores?type=clusters" ||
|
|
8311
|
+
URL == "/manage/stores/addition-method" ||
|
|
8312
|
+
URL == "/manage/stores/add-single-store" || URL === "/manage/trax/gallery" || URL == "/notifications/alerts?tab=alert" || URL == "/notifications/alerts?tab=download" || URL === "/manage/trax/audit") {
|
|
8313
|
+
this.setUIProperties(true, false, false, false, false, false, false, false, false, false, false);
|
|
8314
|
+
}
|
|
8315
|
+
else if (url[3] == "edge-app") {
|
|
8316
|
+
this.setUIProperties(false, false, false, false, true, false, false, false, false, false, false);
|
|
8317
|
+
}
|
|
8318
|
+
else if (URL == `/manage/stores/infra-ticket?storeId=${this.storeId}` || URL == `/manage/stores/infra-ticket?storeId=${this.storeId}&type=infra` ||
|
|
8319
|
+
URL == `/manage/stores/settings?storeId=${this.storeId}` || URL == `/manage/stores/infra-ticket?storeId=${this.storeId}&type=dataMismatch` ||
|
|
8320
|
+
URL == `/manage/stores/zones?storeId=${this.storeId}` ||
|
|
8321
|
+
URL == `/manage/stores/cameras?storeId=${this.storeId}` ||
|
|
8322
|
+
// URL == `/manage/stores/infrastructure?storeId=${this.storeId}` ||
|
|
8323
|
+
URL == `/manage/stores/mat?storeId=${this.storeId}`) {
|
|
8324
|
+
this.setUIProperties(false, false, false, true, false, false, false, false, false, false, false);
|
|
8325
|
+
}
|
|
8326
|
+
else if (URL == "/tickets/stores" || URL == "/manage/users/tango/audit") {
|
|
8327
|
+
this.setUIProperties(false, false, true, false, false, false, false, false, false, false, false);
|
|
7000
8328
|
}
|
|
7001
|
-
else if (url[2]
|
|
7002
|
-
if (
|
|
7003
|
-
this.setUIProperties(false, false, false, false, false, false, false, false, false, false);
|
|
8329
|
+
else if (url[2] === 'controlcenter') {
|
|
8330
|
+
if (URL == `/manage/controlcenter/playback?storeId=${this.storeId}` || URL == `/manage/controlcenter/playback`) {
|
|
8331
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, true, false, false);
|
|
7004
8332
|
}
|
|
7005
8333
|
else {
|
|
7006
|
-
this.setUIProperties(
|
|
8334
|
+
this.setUIProperties(false, false, false, false, true, false, false, false, false, false, false);
|
|
7007
8335
|
}
|
|
7008
8336
|
}
|
|
7009
|
-
else
|
|
7010
|
-
|
|
7011
|
-
|
|
8337
|
+
else if (URL == "/profile" || url[2] === "data-mismatch" || url[2] === "employeetraining"
|
|
8338
|
+
|| URL == "/manage/brands" || URL == "/manage/users/tango" || (url[1] === "tickets" && url[2] === "audit")) {
|
|
8339
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, false, false, false);
|
|
8340
|
+
}
|
|
8341
|
+
else if (URL == "/manage/traffic/nob") {
|
|
8342
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, false, true, false);
|
|
8343
|
+
}
|
|
8344
|
+
else if (url[2] === "traffic" || url[2] === "zones" || URL == "/manage/analyse/reports" || URL == "/manage/employee-metrics/beeahGroup") {
|
|
8345
|
+
this.setUIProperties(false, false, false, false, false, true, false, false, false, false, false);
|
|
8346
|
+
}
|
|
8347
|
+
else if (url[2] === "employee-metrics" && url[3] === "heatmap") {
|
|
8348
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, true, false, false);
|
|
8349
|
+
}
|
|
8350
|
+
else if (url[2] === "employee-metrics") {
|
|
8351
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, false, false, true);
|
|
8352
|
+
}
|
|
8353
|
+
else if (url[2] == 'trax') {
|
|
8354
|
+
if (url[2] == 'trax' && (url.includes('createChecklist') || url.includes('configure') || url.includes('create-order') || url[3] == 'create-task' || url[3] == 'task-configure')) {
|
|
8355
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, false, false, false);
|
|
8356
|
+
}
|
|
8357
|
+
else if (url[2] == 'trax' && (url.includes('taskinfo'))) {
|
|
8358
|
+
this.setUIProperties(false, false, false, false, false, false, false, true, false, false, false);
|
|
8359
|
+
}
|
|
8360
|
+
else if (url[2] == 'trax' && url.includes('start')) {
|
|
8361
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, false, false, false);
|
|
8362
|
+
}
|
|
8363
|
+
else if (url[2] == 'trax' && (url.includes('checklist') || url.includes('gallery')) || url.includes('audit')) {
|
|
8364
|
+
this.setUIProperties(true, false, false, false, false, false, false, false, false, false, false);
|
|
7012
8365
|
}
|
|
7013
8366
|
else {
|
|
7014
|
-
this.setUIProperties(false, false, false, false,
|
|
8367
|
+
this.setUIProperties(false, false, false, false, false, false, true, false, false, false, false);
|
|
7015
8368
|
}
|
|
7016
8369
|
}
|
|
8370
|
+
else {
|
|
8371
|
+
this.setUIProperties(false, false, false, false, true, false, false, false, false, false, false);
|
|
8372
|
+
}
|
|
7017
8373
|
}
|
|
7018
8374
|
else {
|
|
7019
8375
|
if (url[3] == "edge-app") {
|
|
7020
|
-
this.setUIProperties(false, false, true, false, false, false, false, false, false, false);
|
|
8376
|
+
this.setUIProperties(false, false, true, false, false, false, false, false, false, false, false);
|
|
7021
8377
|
}
|
|
7022
8378
|
else if (URL == `/manage/stores/infra-ticket?storeId=${this.storeId}` || URL == `/manage/stores/infra-ticket?storeId=${this.storeId}&type=infra` ||
|
|
7023
8379
|
URL == `/manage/stores/settings?storeId=${this.storeId}` || URL == `/manage/stores/infra-ticket?storeId=${this.storeId}&type=dataMismatch` ||
|
|
@@ -7025,14 +8381,14 @@ class ToolbarComponent {
|
|
|
7025
8381
|
URL == `/manage/stores/cameras?storeId=${this.storeId}` ||
|
|
7026
8382
|
// URL == `/manage/stores/infrastructure?storeId=${this.storeId}` ||
|
|
7027
8383
|
URL == `/manage/stores/mat?storeId=${this.storeId}`) {
|
|
7028
|
-
this.setUIProperties(false, false, false, true, false, false, false, false, false, false);
|
|
8384
|
+
this.setUIProperties(false, false, false, true, false, false, false, false, false, false, false);
|
|
7029
8385
|
}
|
|
7030
8386
|
else if (url[2] === 'controlcenter') {
|
|
7031
8387
|
if (URL == `/manage/controlcenter/playback?storeId=${this.storeId}` || URL == `/manage/controlcenter/playback`) {
|
|
7032
|
-
this.setUIProperties(false, false, false, false, false, false, false, false, true, false);
|
|
8388
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, true, false, false);
|
|
7033
8389
|
}
|
|
7034
8390
|
else {
|
|
7035
|
-
this.setUIProperties(false, false, false, false, true, false, false, false, false, false);
|
|
8391
|
+
this.setUIProperties(false, false, false, false, true, false, false, false, false, false, false);
|
|
7036
8392
|
}
|
|
7037
8393
|
}
|
|
7038
8394
|
else if (URL == "/profile" || URL == "/manage/users/client" || URL == "/manage/users/tango" ||
|
|
@@ -7040,53 +8396,46 @@ class ToolbarComponent {
|
|
|
7040
8396
|
URL == "/manage/stores/addition-method" ||
|
|
7041
8397
|
URL == "/manage/stores/add-single-store" || url[2] === "data-mismatch" || url[2] === "employeetraining" || URL == "/notifications/alerts?tab=alert" || URL == "/notifications/alerts?tab=download"
|
|
7042
8398
|
|| URL == "/manage/users/tango" || URL === "/manage/controlcenter" || URL === 'manage/controlcenter/template-manager' || url[2] === 'controlcenter') {
|
|
7043
|
-
this.setUIProperties(false, false, false, false, false, false, false, false, false, false);
|
|
8399
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, false, false, false);
|
|
7044
8400
|
}
|
|
7045
8401
|
else if (URL == "/manage/traffic/nob") {
|
|
7046
|
-
this.setUIProperties(false, false, false, false, false, false, false, false, false, true);
|
|
8402
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, false, true, false);
|
|
8403
|
+
}
|
|
8404
|
+
else if (url[2] === "traffic" || url[2] === "zones" || URL == "/manage/analyse/reports" || URL == "/manage/employee-metrics/beeahGroup") {
|
|
8405
|
+
this.setUIProperties(false, false, false, false, false, true, false, false, false, false, false);
|
|
8406
|
+
}
|
|
8407
|
+
else if (url[2] === "employee-metrics" && url[3] === "heatmap") {
|
|
8408
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, true, false, false);
|
|
7047
8409
|
}
|
|
7048
|
-
else if (url[2] === "
|
|
7049
|
-
this.setUIProperties(false, false, false, false, false,
|
|
8410
|
+
else if (url[2] === "employee-metrics") {
|
|
8411
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, false, false, true);
|
|
7050
8412
|
}
|
|
7051
8413
|
else if (url[2] == 'trax') {
|
|
7052
8414
|
if (url[2] == 'trax' && (url.includes('createChecklist') || url.includes('configure') || url.includes('create-order') || url[3] == 'create-task' || url[3] == 'task-configure')) {
|
|
7053
|
-
this.setUIProperties(false, false, false, false, false, false, false, false, false, false);
|
|
8415
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, false, false, false);
|
|
7054
8416
|
}
|
|
7055
8417
|
else if (url[2] == 'trax' && (url.includes('taskinfo'))) {
|
|
7056
|
-
this.setUIProperties(false, false, false, false, false, false, false, true, false, false);
|
|
8418
|
+
this.setUIProperties(false, false, false, false, false, false, false, true, false, false, false);
|
|
7057
8419
|
}
|
|
7058
8420
|
else if (url[2] == 'trax' && url.includes('start')) {
|
|
7059
|
-
this.setUIProperties(false, false, false, false, false, false, false, false, false, false);
|
|
8421
|
+
this.setUIProperties(false, false, false, false, false, false, false, false, false, false, false);
|
|
7060
8422
|
}
|
|
7061
8423
|
else if (url[2] == 'trax' && (url.includes('checklist') || url.includes('gallery') || url.includes('audit'))) {
|
|
7062
|
-
this.setUIProperties(true, false, false, false, false, false, false, false, false, false);
|
|
7063
|
-
}
|
|
7064
|
-
else {
|
|
7065
|
-
this.setUIProperties(false, false, false, false, false, false, true, false, false, false);
|
|
7066
|
-
}
|
|
7067
|
-
}
|
|
7068
|
-
else if (url[2] == 'planogram') {
|
|
7069
|
-
if (url[2] == 'planogram' && (url.includes('layout-builder'))) {
|
|
7070
|
-
this.setUIProperties(false, false, false, false, false, false, false, false, false, false);
|
|
8424
|
+
this.setUIProperties(true, false, false, false, false, false, false, false, false, false, false);
|
|
7071
8425
|
}
|
|
7072
8426
|
else {
|
|
7073
|
-
this.setUIProperties(
|
|
8427
|
+
this.setUIProperties(false, false, false, false, false, false, true, false, false, false, false);
|
|
7074
8428
|
}
|
|
7075
8429
|
}
|
|
7076
8430
|
else {
|
|
7077
|
-
|
|
7078
|
-
this.setUIProperties(false, false, false, true, false, false, false, false, false, false);
|
|
7079
|
-
}
|
|
7080
|
-
else {
|
|
7081
|
-
this.setUIProperties(false, false, true, false, false, false, false, false, false, false);
|
|
7082
|
-
}
|
|
8431
|
+
this.setUIProperties(false, false, true, false, false, false, false, false, false, false, false);
|
|
7083
8432
|
}
|
|
7084
8433
|
}
|
|
7085
8434
|
const viewsWithPageTitles = ["classic", "reports", "saas"];
|
|
7086
8435
|
return (this.appPageTitleDisplay &&
|
|
7087
8436
|
viewsWithPageTitles.some((t) => t === this.appToolbarLayout));
|
|
7088
8437
|
}
|
|
7089
|
-
setUIProperties(singleSelect, multiSelect, datepicker, singleStore, singleSelectdatepicker, trafficdatepicker, traxdatepicker, traxwithoutdatepicker, storesSingle, nobWithoutClient) {
|
|
8438
|
+
setUIProperties(singleSelect, multiSelect, datepicker, singleStore, singleSelectdatepicker, trafficdatepicker, traxdatepicker, traxwithoutdatepicker, storesSingle, nobWithoutClient, merticsHeader) {
|
|
7090
8439
|
this.singleSelect = singleSelect;
|
|
7091
8440
|
this.multiSelect = multiSelect;
|
|
7092
8441
|
this.datepicker = datepicker;
|
|
@@ -7097,6 +8446,7 @@ class ToolbarComponent {
|
|
|
7097
8446
|
this.traxwithoutdatepicker = traxwithoutdatepicker;
|
|
7098
8447
|
this.storesSingle = storesSingle;
|
|
7099
8448
|
this.nobWithoutClient = nobWithoutClient;
|
|
8449
|
+
this.merticsHeader = merticsHeader;
|
|
7100
8450
|
}
|
|
7101
8451
|
getUserInfo(client) {
|
|
7102
8452
|
let obj = {
|
|
@@ -7111,11 +8461,11 @@ class ToolbarComponent {
|
|
|
7111
8461
|
}
|
|
7112
8462
|
}
|
|
7113
8463
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1.LayoutService }, { token: i2.Router }, { token: i2.ActivatedRoute }, { token: i1.GlobalStateService }, { token: AuthService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7114
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ToolbarComponent, selector: "lib-toolbar", inputs: { currentLayoutType: "currentLayoutType", appToolbarLayout: "appToolbarLayout" }, ngImport: i0, template: "<!--begin::Toolbar container-->\r\n<div id=\"kt_app_toolbar_container\" class=\"app-container\" [ngClass]=\"appToolbarContainerCSSClass\">\r\n <ng-container *ngIf=\"(gs.userAccess | async)?.userType === 'tango' || (gs.userAccess | async)?.userType === 'client' || (gs.userAccess | async)?.userType === 'lead'\" >\r\n <ng-container *ngIf=\"showPageTitle()\">\r\n <lib-page-title [appPageTitleDirection]=\"appPageTitleDirection\" [appPageTitleBreadcrumb]=\"appPageTitleBreadcrumb\"\r\n [appPageTitleDescription]=\"appPageTitleDescription\" class=\"page-title d-flex flex-wrap me-3\"\r\n [ngClass]=\"{'flex-column justify-content-center': appPageTitleDirection === 'column', 'align-items-center': appPageTitleDirection !== 'column', appPageTitleCSSClass}\">\r\n </lib-page-title>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"multiSelect && users.userType ==='tango'\">\r\n <lib-classic class=\"d-flex align-items-center gap-2 gap-lg-3\"></lib-classic>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelect && users.userType ==='tango'\">\r\n <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n </ng-container>\r\n <ng-container *ngIf=\"datepicker && (users.userType ==='client' || users.userType ==='tango')\">\r\n <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelectdatepicker && users.userType ==='tango'\">\r\n <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleStore\">\r\n <lib-single-store class=\"d-flex align-items-center me-5\"
|
|
8464
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ToolbarComponent, selector: "lib-toolbar", inputs: { currentLayoutType: "currentLayoutType", appToolbarLayout: "appToolbarLayout" }, ngImport: i0, template: "<!--begin::Toolbar container-->\r\n<div id=\"kt_app_toolbar_container\" class=\"app-container\" [ngClass]=\"appToolbarContainerCSSClass\">\r\n <ng-container *ngIf=\"(gs.userAccess | async)?.userType === 'tango' || (gs.userAccess | async)?.userType === 'client' || (gs.userAccess | async)?.userType === 'lead'\" >\r\n <ng-container *ngIf=\"showPageTitle()\">\r\n <lib-page-title [appPageTitleDirection]=\"appPageTitleDirection\" [appPageTitleBreadcrumb]=\"appPageTitleBreadcrumb\"\r\n [appPageTitleDescription]=\"appPageTitleDescription\" class=\"page-title d-flex flex-wrap me-3\"\r\n [ngClass]=\"{'flex-column justify-content-center': appPageTitleDirection === 'column', 'align-items-center': appPageTitleDirection !== 'column', appPageTitleCSSClass}\">\r\n </lib-page-title>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"multiSelect && users.userType ==='tango'\">\r\n <lib-classic class=\"d-flex align-items-center gap-2 gap-lg-3\"></lib-classic>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelect && users.userType ==='tango'\">\r\n <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n </ng-container>\r\n <ng-container *ngIf=\"datepicker && (users.userType ==='client' || users.userType ==='tango')\">\r\n <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelectdatepicker && users.userType ==='tango'\">\r\n <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleStore\">\r\n <lib-single-store class=\"d-flex align-items-center me-5\"></lib-single-store>\r\n </ng-container>\r\n <ng-container *ngIf=\"trafficdatepicker\">\r\n <lib-traffic-header class=\"d-flex align-items-center me-5\"></lib-traffic-header>\r\n </ng-container>\r\n <ng-container *ngIf=\"traxdatepicker\">\r\n <lib-trax-header class=\"d-flex align-items-center me-5\"></lib-trax-header>\r\n </ng-container>\r\n <ng-container *ngIf=\"traxwithoutdatepicker\">\r\n <lib-trax-withoutdate class=\"d-flex align-items-center me-5\"></lib-trax-withoutdate>\r\n </ng-container>\r\n <ng-container *ngIf=\"storesSingle\">\r\n <lib-single-storedate class=\"d-flex align-items-center me-5\"></lib-single-storedate>\r\n </ng-container>\r\n <ng-container *ngIf=\"nobWithoutClient\">\r\n <lib-traffic-nob class=\"d-flex align-items-center me-5\"></lib-traffic-nob>\r\n </ng-container>\r\n <ng-container *ngIf=\"merticsHeader\">\r\n <lib-metrics-header class=\"d-flex align-items-center me-5\"></lib-metrics-header>\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"appToolbarLayout === 'extended'\">\r\n <lib-extended class=\"d-flex align-items-center flex-shrink-0 me-5\"></lib-extended>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'reports'\">\r\n <lib-reports class=\"d-flex align-items-center overflow-auto\" [appPageTitleDisplay]=\"appPageTitleDisplay\">\r\n </lib-reports>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'saas'\">\r\n <lib-saas class=\"d-flex align-items-center gap-2\" [appPageTitleDisplay]=\"appPageTitleDisplay\"></lib-saas>\r\n </ng-container> -->\r\n</ng-container>\r\n</div>\r\n<!--end::Toolbar container-->\r\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PageTitleComponent, selector: "lib-page-title", inputs: ["appPageTitleDirection", "appPageTitleBreadcrumb", "appPageTitleDescription"] }, { kind: "component", type: ClassicComponent, selector: "lib-classic" }, { kind: "component", type: ClientSettingsComponent, selector: "lib-client-settings" }, { kind: "component", type: DatepickerComponent, selector: "lib-datepicker" }, { kind: "component", type: DateSingleSelectComponent, selector: "lib-date-single-select" }, { kind: "component", type: SingleStoreComponent, selector: "lib-single-store", inputs: ["urlString"] }, { kind: "component", type: TrafficHeaderComponent, selector: "lib-traffic-header" }, { kind: "component", type: TraxHeaderComponent, selector: "lib-trax-header" }, { kind: "component", type: SingleStoredateComponent, selector: "lib-single-storedate" }, { kind: "component", type: TraxWithoutdateComponent, selector: "lib-trax-withoutdate" }, { kind: "component", type: TrafficNobComponent, selector: "lib-traffic-nob" }, { kind: "component", type: MetricsHeaderComponent, selector: "lib-metrics-header" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
|
|
7115
8465
|
}
|
|
7116
8466
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
7117
8467
|
type: Component,
|
|
7118
|
-
args: [{ selector: "lib-toolbar", template: "<!--begin::Toolbar container-->\r\n<div id=\"kt_app_toolbar_container\" class=\"app-container\" [ngClass]=\"appToolbarContainerCSSClass\">\r\n <ng-container *ngIf=\"(gs.userAccess | async)?.userType === 'tango' || (gs.userAccess | async)?.userType === 'client' || (gs.userAccess | async)?.userType === 'lead'\" >\r\n <ng-container *ngIf=\"showPageTitle()\">\r\n <lib-page-title [appPageTitleDirection]=\"appPageTitleDirection\" [appPageTitleBreadcrumb]=\"appPageTitleBreadcrumb\"\r\n [appPageTitleDescription]=\"appPageTitleDescription\" class=\"page-title d-flex flex-wrap me-3\"\r\n [ngClass]=\"{'flex-column justify-content-center': appPageTitleDirection === 'column', 'align-items-center': appPageTitleDirection !== 'column', appPageTitleCSSClass}\">\r\n </lib-page-title>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"multiSelect && users.userType ==='tango'\">\r\n <lib-classic class=\"d-flex align-items-center gap-2 gap-lg-3\"></lib-classic>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelect && users.userType ==='tango'\">\r\n <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n </ng-container>\r\n <ng-container *ngIf=\"datepicker && (users.userType ==='client' || users.userType ==='tango')\">\r\n <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelectdatepicker && users.userType ==='tango'\">\r\n <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleStore\">\r\n <lib-single-store class=\"d-flex align-items-center me-5\"
|
|
8468
|
+
args: [{ selector: "lib-toolbar", template: "<!--begin::Toolbar container-->\r\n<div id=\"kt_app_toolbar_container\" class=\"app-container\" [ngClass]=\"appToolbarContainerCSSClass\">\r\n <ng-container *ngIf=\"(gs.userAccess | async)?.userType === 'tango' || (gs.userAccess | async)?.userType === 'client' || (gs.userAccess | async)?.userType === 'lead'\" >\r\n <ng-container *ngIf=\"showPageTitle()\">\r\n <lib-page-title [appPageTitleDirection]=\"appPageTitleDirection\" [appPageTitleBreadcrumb]=\"appPageTitleBreadcrumb\"\r\n [appPageTitleDescription]=\"appPageTitleDescription\" class=\"page-title d-flex flex-wrap me-3\"\r\n [ngClass]=\"{'flex-column justify-content-center': appPageTitleDirection === 'column', 'align-items-center': appPageTitleDirection !== 'column', appPageTitleCSSClass}\">\r\n </lib-page-title>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"multiSelect && users.userType ==='tango'\">\r\n <lib-classic class=\"d-flex align-items-center gap-2 gap-lg-3\"></lib-classic>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelect && users.userType ==='tango'\">\r\n <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n </ng-container>\r\n <ng-container *ngIf=\"datepicker && (users.userType ==='client' || users.userType ==='tango')\">\r\n <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelectdatepicker && users.userType ==='tango'\">\r\n <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleStore\">\r\n <lib-single-store class=\"d-flex align-items-center me-5\"></lib-single-store>\r\n </ng-container>\r\n <ng-container *ngIf=\"trafficdatepicker\">\r\n <lib-traffic-header class=\"d-flex align-items-center me-5\"></lib-traffic-header>\r\n </ng-container>\r\n <ng-container *ngIf=\"traxdatepicker\">\r\n <lib-trax-header class=\"d-flex align-items-center me-5\"></lib-trax-header>\r\n </ng-container>\r\n <ng-container *ngIf=\"traxwithoutdatepicker\">\r\n <lib-trax-withoutdate class=\"d-flex align-items-center me-5\"></lib-trax-withoutdate>\r\n </ng-container>\r\n <ng-container *ngIf=\"storesSingle\">\r\n <lib-single-storedate class=\"d-flex align-items-center me-5\"></lib-single-storedate>\r\n </ng-container>\r\n <ng-container *ngIf=\"nobWithoutClient\">\r\n <lib-traffic-nob class=\"d-flex align-items-center me-5\"></lib-traffic-nob>\r\n </ng-container>\r\n <ng-container *ngIf=\"merticsHeader\">\r\n <lib-metrics-header class=\"d-flex align-items-center me-5\"></lib-metrics-header>\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"appToolbarLayout === 'extended'\">\r\n <lib-extended class=\"d-flex align-items-center flex-shrink-0 me-5\"></lib-extended>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'reports'\">\r\n <lib-reports class=\"d-flex align-items-center overflow-auto\" [appPageTitleDisplay]=\"appPageTitleDisplay\">\r\n </lib-reports>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'saas'\">\r\n <lib-saas class=\"d-flex align-items-center gap-2\" [appPageTitleDisplay]=\"appPageTitleDisplay\"></lib-saas>\r\n </ng-container> -->\r\n</ng-container>\r\n</div>\r\n<!--end::Toolbar container-->\r\n" }]
|
|
7119
8469
|
}], ctorParameters: () => [{ type: i1.LayoutService }, { type: i2.Router }, { type: i2.ActivatedRoute }, { type: i1.GlobalStateService }, { type: AuthService }], propDecorators: { currentLayoutType: [{
|
|
7120
8470
|
type: Input
|
|
7121
8471
|
}], appToolbarLayout: [{
|
|
@@ -7171,7 +8521,6 @@ class SidebarMenuComponent {
|
|
|
7171
8521
|
oldDashboardRoutingUrl;
|
|
7172
8522
|
clientData;
|
|
7173
8523
|
headerFilters;
|
|
7174
|
-
showPlano;
|
|
7175
8524
|
constructor(authService, gs, router) {
|
|
7176
8525
|
this.authService = authService;
|
|
7177
8526
|
this.gs = gs;
|
|
@@ -7186,7 +8535,6 @@ class SidebarMenuComponent {
|
|
|
7186
8535
|
destroy$ = new Subject();
|
|
7187
8536
|
previousClientId = null;
|
|
7188
8537
|
ngOnInit() {
|
|
7189
|
-
this.getPlanoUsers();
|
|
7190
8538
|
if ("user-info" in localStorage) {
|
|
7191
8539
|
const userData = JSON.parse(localStorage.getItem("user-info") || "{}");
|
|
7192
8540
|
this.usersList = userData;
|
|
@@ -7215,11 +8563,6 @@ class SidebarMenuComponent {
|
|
|
7215
8563
|
// }
|
|
7216
8564
|
// })
|
|
7217
8565
|
}
|
|
7218
|
-
getPlanoUsers() {
|
|
7219
|
-
this.authService.getPlanoUsers().pipe(takeUntil(this.destroy$), debounceTime(100))?.subscribe((res) => {
|
|
7220
|
-
this.showPlano = res?.message || "Unauthorized";
|
|
7221
|
-
});
|
|
7222
|
-
}
|
|
7223
8566
|
oldDashborad() {
|
|
7224
8567
|
let obj = { username: this.usersList?.email }; //this.usersList?.email}; // Assuming this is required for authentication/authorization
|
|
7225
8568
|
this.authService
|
|
@@ -7265,11 +8608,11 @@ class SidebarMenuComponent {
|
|
|
7265
8608
|
});
|
|
7266
8609
|
}
|
|
7267
8610
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SidebarMenuComponent, deps: [{ token: AuthService }, { token: i1.GlobalStateService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
7268
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SidebarMenuComponent, selector: "lib-sidebar-menu", ngImport: i0, template: "<!--begin::Menu wrapper-->\r\n<div id=\"kt_app_sidebar_menu_scroll\" class=\"scroll-y my-5 mx-3\" data-kt-scroll=\"true\" data-kt-scroll-activate=\"true\"\r\n data-kt-scroll-height=\"auto\" data-kt-scroll-dependencies=\"#kt_app_sidebar_logo, #kt_app_sidebar_footer\"\r\n data-kt-scroll-wrappers=\"#kt_app_sidebar_menu\" data-kt-scroll-offset=\"5px\" data-kt-scroll-save-state=\"true\">\r\n <!--begin::Menu-->\r\n <div class=\"menu menu-column menu-rounded menu-sub-indention fw-semibold fs-6\" id=\"#kt_app_sidebar_menu\"\r\n data-kt-menu=\"true\" data-kt-menu-expand=\"false\">\r\n <!-- Birds Eye -->\r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard && (gs.userAccess | async)?.userType !== 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/birds_eye.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Analytics</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Analyse -->\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/tango_eye.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15 text-nowrap\">Tango Eye\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewTraffic && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic\">\r\n <span class=\"menu-title ms-8\">Traffic\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"clientData?.featureConfigs?.isNewZone && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v1\">\r\n <span class=\"menu-title ms-8\">Zones\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"clientData?.featureConfigs?.isNewZoneV2 && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v2\">\r\n <span class=\"menu-title ms-8\">Zone V2\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"clientData?.featureConfigs?.isTrax || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/dashboard\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_trax.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\">Tango Trax\r\n </span>\r\n </a>\r\n </div> \r\n <div class=\"menu-item\" *ngIf=\"showPlano === 'Authorized'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/planogram/manage-planograms\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" class=\"fs-2\">\r\n <path\r\n d=\"M13.3336 6H11.8667L10.5336 7.33344H8.66671V6H4.66671V11.3334H3.33359C3.15676 11.3307 2.98116 11.3632 2.81699 11.4289C2.65283 11.4947 2.50339 11.5925 2.37738 11.7166C2.25136 11.8406 2.15129 11.9885 2.08298 12.1517C2.01467 12.3148 1.97949 12.4899 1.97949 12.6667C1.97949 12.8436 2.01467 13.0186 2.08298 13.1818C2.15129 13.3449 2.25136 13.4928 2.37738 13.6169C2.50339 13.741 2.65283 13.8387 2.81699 13.9045C2.98116 13.9703 3.15676 14.0027 3.33359 14H13.3336C13.5104 14 13.6799 13.9298 13.8049 13.8048C13.9299 13.6798 14.0001 13.5102 14.0001 13.3334V6.66656C14.0001 6.48978 13.9299 6.32023 13.8049 6.19523C13.6799 6.07023 13.5104 6 13.3336 6ZM4.66671 4V11.3334H3.33359C2.97999 11.3334 2.64088 11.4739 2.39082 11.7239C2.14076 11.9739 2.00023 12.313 2.00015 12.6666V5.33344C2.00015 4.97979 2.14064 4.64062 2.3907 4.39056C2.64077 4.14049 2.97994 4 3.33359 4H4.66671Z\"\r\n fill=\"#667085\" />\r\n <path\r\n d=\"M4.66671 11.3334V6H8.66671V7.33344H10.5336L11.8667 6H13.3336C13.5104 6 13.6799 6.07023 13.8049 6.19523C13.9299 6.32023 14.0001 6.48978 14.0001 6.66656V13.3334C14.0001 13.5102 13.9299 13.6798 13.8049 13.8048C13.6799 13.9298 13.5104 14 13.3336 14H3.33359C3.15676 14.0027 2.98116 13.9703 2.81699 13.9045C2.65283 13.8387 2.50339 13.741 2.37738 13.6169C2.25136 13.4928 2.15129 13.3449 2.08298 13.1818C2.01467 13.0186 1.97949 12.8436 1.97949 12.6667C1.97949 12.4899 2.01467 12.3148 2.08298 12.1517C2.15129 11.9885 2.25136 11.8406 2.37738 11.7166C2.50339 11.5925 2.65283 11.4947 2.81699 11.4289C2.98116 11.3632 3.15676 11.3307 3.33359 11.3334M4.66671 11.3334H3.33359M4.66671 11.3334V4H3.33359C2.97994 4 2.64077 4.14049 2.3907 4.39056C2.14064 4.64062 2.00015 4.97979 2.00015 5.33344V12.6666C2.00023 12.313 2.14076 11.9739 2.39082 11.7239C2.64088 11.4739 2.97999 11.3334 3.33359 11.3334\"\r\n stroke=\"#98A2B3\" stroke-width=\"0.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M13.8067 3.12656L12.8732 2.19344C12.7486 2.07133 12.5811 2.00293 12.4067 2.00293C12.2322 2.00293 12.0647 2.07133 11.9401 2.19344L8.6665 5.46704V7.3336H10.5334L13.8067 4.06C13.9288 3.9354 13.9972 3.7679 13.9972 3.59344C13.9972 3.41898 13.9288 3.25116 13.8067 3.12656Z\"\r\n fill=\"#D0D5DD\" />\r\n </svg>\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\">Planogram\r\n </span>\r\n </a>\r\n </div> \r\n \r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon \">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/tango_trax.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15\">Tango Trax\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/checklist\">\r\n <span class=\"menu-title ms-8\">Checklist\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n <div *ngIf=\"clientData?.featureConfigs?.isControlCenter && this.usersList?.userType !=='tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/controlcenter\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/ControlCenter.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\" >Control Center\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic/explore\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/Explore.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Explore\r\n </span>\r\n </a>\r\n </div> \r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard && clientData?.featureConfigs?.isNewReports && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/analyse/reports\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/reports.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Reports\r\n </span>\r\n </a>\r\n </div> \r\n \r\n <!-- Manage -->\r\n <div *ngIf=\"(gs.userAccess | async)?.userType !== 'lead'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon \">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/manage.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15\">Manage\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/brands\">\r\n \r\n <span class=\"menu-title ms-8\">Brands\r\n </span>\r\n </a>\r\n </div>\r\n \r\n \r\n \r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/summary\">\r\n \r\n <span class=\"menu-title ms-8\">Summary\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/stores\">\r\n \r\n <span class=\"menu-title ms-8\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/client\">\r\n \r\n <span class=\"menu-title ms-8\">Users\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/tango\">\r\n \r\n <span class=\"menu-title ms-8\">Tango Users\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/tickets\" >\r\n \r\n <span class=\"menu-title ms-8\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/reports\" >\r\n \r\n <span class=\"menu-title ms-8\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/audit\" >\r\n \r\n <span class=\"menu-title ms-8\">Audit\r\n </span>\r\n </a>\r\n </div>\r\n \r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/billing\">\r\n \r\n <span class=\"menu-title ms-8\">Billing\r\n </span>\r\n </a>\r\n </div> \r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/settings\" >\r\n \r\n <span class=\"menu-title ms-8\">Settings\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/user-analysis\" >\r\n \r\n <span class=\"menu-title ms-8\">User Analysis\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n \r\n \r\n </div>\r\n\r\n <!-- Workspace -->\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/Workspace.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Workspace\r\n </span>\r\n </a>\r\n </div>\r\n <!--end::Menu-->\r\n</div>\r\n</div>\r\n<!--end::Menu wrapper-->\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title \" data-link=\"/manage/traffic\">ANALYZE\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n \r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\"\r\n class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M0.677249 15.8223H5.41799C6.09524 15.8223 6.09524 15.5214 6.09524 14.318V6.83461C6.09524 6.39794 5.79228 6.04449 5.41799 6.04449H0.677249C0.2709 6.04449 0 6.34534 0 6.79663V15.0701C0 15.5214 0.2709 15.8223 0.677249 15.8223Z\" fill=\"#475467\"/>\r\n <path d=\"M0.673874 4.44444H5.39099C5.79531 4.44444 6.06486 4.08889 6.06486 3.55555V0.888888C6.06486 0.355555 5.79531 0 5.39099 0H0.673874C0.269549 0 0 0.355555 0 0.888888V3.55555C0 4 0.269549 4.44444 0.673874 4.44444Z\" fill=\"#475467\"/>\r\n <path d=\"M2.27003 1.9131C2.27003 2.20178 2.09173 2.4358 1.87179 2.4358C1.65185 2.4358 1.47354 2.20178 1.47354 1.9131C1.47354 1.62443 1.65185 1.39041 1.87179 1.39041C2.09173 1.39041 2.27003 1.62443 2.27003 1.9131Z\" fill=\"#667085\"/>\r\n <path d=\"M3.46448 1.9131C3.46448 2.20178 3.28618 2.4358 3.06623 2.4358C2.84629 2.4358 2.66799 2.20178 2.66799 1.9131C2.66799 1.62443 2.84629 1.39041 3.06623 1.39041C3.28618 1.39041 3.46448 1.62443 3.46448 1.9131Z\" fill=\"#667085\"/>\r\n <path d=\"M4.66025 1.9131C4.66025 2.20178 4.48195 2.4358 4.262 2.4358C4.04206 2.4358 3.86376 2.20178 3.86376 1.9131C3.86376 1.62443 4.04206 1.39041 4.262 1.39041C4.48195 1.39041 4.66025 1.62443 4.66025 1.9131Z\" fill=\"#667085\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.61905 16V0H8.38095V16H7.61905Z\" fill=\"#667085\"/>\r\n <path d=\"M15.3227 0H10.582C10.1757 0 9.90476 0.300855 9.90476 0.752137V9.02564C9.90476 9.47692 10.1757 9.77778 10.582 9.77778H15.3227C15.7291 9.77778 16 9.47692 16 9.02564V0.752137C16 0.300855 15.7291 0 15.3227 0Z\" fill=\"#475467\"/>\r\n <path d=\"M9.93519 15.1111V12.4444C9.93519 11.9111 10.2047 11.5556 10.6091 11.5556H15.3261C15.7305 11.5556 16 11.9111 16 12.4444V15.1111C16 15.6444 15.7305 16 15.3261 16H10.6091C10.2047 16 9.93519 15.6444 9.93519 15.1111Z\" fill=\"#475467\"/>\r\n <path d=\"M12.0531 13.4336C12.0531 13.7223 11.8748 13.9563 11.6549 13.9563C11.4349 13.9563 11.2566 13.7223 11.2566 13.4336C11.2566 13.1449 11.4349 12.9109 11.6549 12.9109C11.8748 12.9109 12.0531 13.1449 12.0531 13.4336Z\" fill=\"#667085\"/>\r\n <path d=\"M13.2475 13.4336C13.2475 13.7223 13.0692 13.9563 12.8493 13.9563C12.6294 13.9563 12.4511 13.7223 12.4511 13.4336C12.4511 13.1449 12.6294 12.9109 12.8493 12.9109C13.0692 12.9109 13.2475 13.1449 13.2475 13.4336Z\" fill=\"#667085\"/>\r\n <path d=\"M14.4433 13.4336C14.4433 13.7223 14.265 13.9563 14.0451 13.9563C13.8251 13.9563 13.6468 13.7223 13.6468 13.4336C13.6468 13.1449 13.8251 12.9109 14.0451 12.9109C14.265 12.9109 14.4433 13.1449 14.4433 13.4336Z\" fill=\"#667085\"/>\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" data-link=\"\">Tango Eye\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Traffic\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"(gs.userAccess | async)?.analytics_tangoZone_isView && clientData?.featureConfigs?.isNewZone && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v1\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Zones\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v2\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Zone V2\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"this.usersList?.clientId ? this.usersList?.clientId === '11': this.headerFilters?.client === '11'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M9.84985 0.264419C9.5033 -0.0881395 8.97086 -0.0881395 8.62713 0.264419L2.76722 6.25478C2.5024 6.5231 2.40943 6.94117 2.52776 7.31557C4.9816 8.10493 6.91142 10.2546 7.60729 12.9815H12.8445C13.5912 12.9815 14.1968 12.3107 14.1968 11.4839V7.98637H15.0984C15.4702 7.98637 15.8027 7.73365 15.938 7.35301C16.0732 6.97238 15.983 6.53557 15.7098 6.25478L9.84985 0.264419ZM7.88619 6.48878C7.88619 6.21422 8.08904 5.98958 8.33696 5.98958H10.14C10.388 5.98958 10.5908 6.21422 10.5908 6.48878V8.48556C10.5908 8.76013 10.388 8.98476 10.14 8.98476H8.33696C8.08904 8.98476 7.88619 8.76013 7.88619 8.48556V6.48878Z\" fill=\"#667085\"/>\r\n <path d=\"M0 8.76165C0 8.34669 0.301447 8.01285 0.676143 8.01285C4.28506 8.01285 7.2122 11.2545 7.2122 15.2512C7.2122 15.6662 6.91075 16 6.53606 16C6.16136 16 5.85991 15.6662 5.85991 15.2512C5.85991 12.0813 3.53848 9.51044 0.676143 9.51044C0.301447 9.51044 0 9.1766 0 8.76165Z\" fill=\"#D0D5DD\"/>\r\n <path d=\"M1.539 15.7076C1.36993 15.8948 1.14062 16 0.901525 16C0.662426 16 0.43312 15.8948 0.264051 15.7076C0.0949818 15.5203 0 15.2664 0 15.0017C0 14.7368 0.0949818 14.4829 0.264051 14.2956C0.43312 14.1084 0.662426 14.0032 0.901525 14.0032C1.14062 14.0032 1.36993 14.1084 1.539 14.2956C1.70807 14.4829 1.80305 14.7368 1.80305 15.0017C1.80305 15.2664 1.70807 15.5203 1.539 15.7076Z\" fill=\"#D0D5DD\"/>\r\n <path d=\"M0.676143 12.5056C0.301447 12.5056 0 12.1717 0 11.7568C0 11.3418 0.301447 11.0081 0.676143 11.0081C2.79191 11.0081 4.50762 12.9081 4.50762 15.2512C4.50762 15.6662 4.20618 16 3.83148 16C3.45678 16 3.15534 15.6662 3.15534 15.2512C3.15534 13.7349 2.04533 12.5056 0.676143 12.5056Z\" fill=\"#D0D5DD\"/>\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" routerLink=\"/manage/controlcenter\">Control Center \r\n </span>\r\n \r\n </span>\r\n </div>\r\n \r\n <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\"\r\n class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M14.3843 6.77809L13.3937 6.58122C13.1468 6.53122 12.8937 6.60935 12.7156 6.78747L12.2343 7.26872C11.8718 7.63122 11.2625 7.53122 11.0343 7.07498L10.7437 6.49685C10.5937 6.19685 10.2875 6.00622 9.94997 6.00622C9.47497 6.00622 9.13435 6.46248 9.27185 6.91873L9.45935 7.5406C9.6031 8.02185 9.24372 8.50623 8.7406 8.50623H8.66872C8.24998 8.50623 7.85935 8.71561 7.6281 9.06249L7.29373 9.56561C7.11873 9.83123 7.1281 10.1781 7.31873 10.4312L7.82185 11.1031C8.14373 11.5312 7.92498 12.15 7.4031 12.2812L6.87185 12.4156C6.63748 12.475 6.44686 12.6406 6.35623 12.8656L5.84373 14.1437C6.51873 14.3719 7.24373 14.5 7.99998 14.5C11.5906 14.5 14.5 11.5906 14.5 7.99998C14.5 7.58123 14.4593 7.17184 14.3843 6.77809ZM1.64375 6.63435C1.83124 6.63435 1.81249 6.68122 1.92499 6.60935L2.41874 6.47185C2.62812 6.41247 2.84999 6.49997 2.96562 6.68122L3.02812 6.77809C3.21562 7.07184 3.54061 7.24997 3.89061 7.24997C4.24061 7.24997 4.56561 7.07184 4.75311 6.77809L4.94374 6.48122C4.98749 6.41247 5.04998 6.3531 5.12186 6.3156L6.24998 5.68435C6.81561 5.36872 7.04685 4.67185 6.78123 4.08123L6.60935 3.69374C6.34061 3.09374 5.64998 2.80311 5.03124 3.03436L4.94999 3.06561C4.63749 3.18123 4.66874 3.08437 4.39999 2.88749L3.96874 2.90311C2.39999 3.68749 1.92187 4.98436 1.6 6.48748L1.64375 6.63435ZM16 7.99998C16 10.1217 15.1571 12.1566 13.6568 13.6568C12.1565 15.1571 10.1217 16 7.99998 16C5.87825 16 3.84343 15.1571 2.34314 13.6568C0.842852 12.1566 0 10.1217 0 7.99998C0 5.87825 0.842852 3.84342 2.34314 2.34314C3.84343 0.842851 5.87825 0 7.99998 0C10.1217 0 12.1565 0.842851 13.6568 2.34314C15.1571 3.84342 16 5.87825 16 7.99998ZM11.4843 5.12185C11.55 4.8531 11.3875 4.58123 11.1218 4.5156L10.1218 4.2656C9.8531 4.19998 9.58122 4.36248 9.5156 4.6281C9.44997 4.89373 9.61247 5.16872 9.8781 5.23435L10.8781 5.48435C11.1468 5.54997 11.4187 5.38747 11.4843 5.12185ZM8.60935 5.74685C8.67497 5.4781 8.51248 5.20622 8.24685 5.1406C7.98123 5.07498 7.70623 5.23747 7.6406 5.5031L7.3906 6.5031C7.32498 6.77184 7.48748 7.04373 7.7531 7.10935C8.01873 7.17497 8.29373 7.01247 8.35935 6.74685L8.60935 5.74685Z\"\r\n fill=\"#475467\" />\r\n <path\r\n d=\"M2.45522 6.05254C2.59366 6.24051 2.35423 6.2781 2.22966 6.2781C2.10509 6.2781 2.0041 6.17711 2.0041 6.05254C2.0041 5.92797 2.10509 5.67661 2.22966 5.67661C2.35423 5.67661 2.45522 5.92797 2.45522 6.05254Z\"\r\n fill=\"#475467\" />\r\n <path\r\n d=\"M4.20498 11.8559C4.62113 11.3337 5.57024 10.0682 5.57024 9.35736C5.57024 8.49526 4.87261 7.79579 4.01273 7.79579C3.15285 7.79579 2.45522 8.49526 2.45522 9.35736C2.45522 10.0682 3.40433 11.3337 3.82047 11.8559C3.92025 11.9803 4.10521 11.9803 4.20498 11.8559ZM4.01273 8.83684C4.15042 8.83684 4.28247 8.89168 4.37984 8.98929C4.4772 9.08691 4.5319 9.21931 4.5319 9.35736C4.5319 9.49541 4.4772 9.62781 4.37984 9.72542C4.28247 9.82304 4.15042 9.87788 4.01273 9.87788C3.87504 9.87788 3.74298 9.82304 3.64562 9.72542C3.54826 9.62781 3.49356 9.49541 3.49356 9.35736C3.49356 9.21931 3.54826 9.08691 3.64562 8.98929C3.74298 8.89168 3.87504 8.83684 4.01273 8.83684Z\"\r\n fill=\"#667085\" />\r\n <path\r\n d=\"M13.0419 10.2943C13.9436 9.11946 16 6.27207 16 4.6727C16 2.73295 14.4884 1.1592 12.6253 1.1592C10.7623 1.1592 9.25074 2.73295 9.25074 4.6727C9.25074 6.27207 11.3071 9.11946 12.2088 10.2943C12.425 10.5743 12.8257 10.5743 13.0419 10.2943ZM12.6253 3.50153C12.9237 3.50153 13.2098 3.62492 13.4207 3.84456C13.6317 4.06419 13.7502 4.36208 13.7502 4.6727C13.7502 4.98331 13.6317 5.2812 13.4207 5.50083C13.2098 5.72047 12.9237 5.84386 12.6253 5.84386C12.327 5.84386 12.0409 5.72047 11.8299 5.50083C11.619 5.2812 11.5005 4.98331 11.5005 4.6727C11.5005 4.36208 11.619 4.06419 11.8299 3.84456C12.0409 3.62492 12.327 3.50153 12.6253 3.50153Z\"\r\n fill=\"#667085\" />\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" data-link=\"\">Tango Trax\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/checklist\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Checklist\r\n </span>\r\n </a>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n \r\n </div>\r\n \r\n</div>\r\n\r\n<div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\" routerLink=\"/manage/analyse/reports\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/manage/traffic\">REPORTS\r\n </span>\r\n \r\n </span>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango' || (gs.userAccess | async)?.userType === 'client'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/manage\">MANAGE\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_brands_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/brands\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/brands.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Brands\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_summary_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/summary\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/overview.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Summary\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.stores_stores_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/stores\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/stores.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.tickets_infra_isView || (gs.userAccess | async)?.tickets_dataMismatch_isView || (gs.userAccess | async)?.tickets_employeeMat_isView || (gs.userAccess | async)?.tickets_installation_isView \" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/tickets\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tickets.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_reports_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/reports\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/reports.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.users_users_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/client\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/users.svg\" alt=\"\">\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.settings_paymentSubscriptions_isView || (gs.userAccess | async)?.settings_activityLog_isView || (gs.userAccess | async)?.settings_brandDetails_isView || (gs.userAccess | async)?.settings_configuration_isView || (gs.userAccess | async)?.settings_contactDirectory_isView || (gs.userAccess | async)?.settings_documents_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/settings\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/settings.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Settings\r\n </span>\r\n </a>\r\n </div>\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/tango\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/users.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Users\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/billing\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/billing.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Billing\r\n </span>\r\n </a>\r\n </div> \r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/tickets\">MY WORKSPACE\r\n </span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/tickets/stores\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/stores.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tickets.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n \r\n </div>\r\n </div> -->\r\n\r\n\r\n\r\n\r\n\r\n <!-- Tango Traffic -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_isView && clientData?.featureConfigs?.isNewTraffic && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_traffic.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Traffic</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Tango Zone -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoZone_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_zone.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Zone</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Tango Revop -->\r\n <!-- <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_revop.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Tango Revop\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Home\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Tagging\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Pending Action\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Customer Profile\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <!-- Control Center -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_controlCenter_isView\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/control_center.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Control Center\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Live & Playback\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Screen Manager\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Store Explore\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <!-- Tango SOP -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoSop_isView\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_sop.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Tango SOP\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Dashboard\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Create & Manage\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Flag\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Incidents\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n", styles: [".menu-bullet-dot span{display:inline-block;width:6px;height:6px;background-color:#000;border-radius:50%;margin-right:10px;vertical-align:middle}:host::ng-deep .menu-sub .menu-sub-accordion{border-left:2px solid #98A2B3!important}::ng-deep .app-sidebar .menu .menu-item .menu-link.active .menu-title{color:#f5f5f5!important;border-radius:8px!important;border:1px solid var(--text-primary, #FFF)!important;padding:8px!important;color:var(--Primary-500, #33B5FF)!important;font-size:12px!important;font-style:normal;font-weight:600;line-height:18px}::ng-deep .app-sidebar .menu .menu-item .menu-link .menu-title{font-size:12px!important;font-style:normal;font-weight:600;line-height:18px}::ng-deep .app-sidebar .menu .menu-item .menu-link.active{transition:color .2s ease;background-color:#0d0e12!important}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
|
|
8611
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SidebarMenuComponent, selector: "lib-sidebar-menu", ngImport: i0, template: "<!--begin::Menu wrapper-->\r\n<div id=\"kt_app_sidebar_menu_scroll\" class=\"scroll-y my-5 ms-2 me-0\" data-kt-scroll=\"true\" data-kt-scroll-activate=\"true\"\r\n data-kt-scroll-height=\"auto\" data-kt-scroll-dependencies=\"#kt_app_sidebar_logo, #kt_app_sidebar_footer\"\r\n data-kt-scroll-wrappers=\"#kt_app_sidebar_menu\" data-kt-scroll-offset=\"5px\" data-kt-scroll-save-state=\"true\">\r\n <!--begin::Menu-->\r\n <div class=\"menu menu-column menu-rounded menu-sub-indention fw-semibold fs-6\" id=\"#kt_app_sidebar_menu\"\r\n data-kt-menu=\"true\" data-kt-menu-expand=\"false\">\r\n <!-- Birds Eye -->\r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard && (gs.userAccess | async)?.userType !== 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/birds_eye.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Analytics</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Analyse -->\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/tango_eye.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15 text-nowrap\">Tango Eye\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewTraffic && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic\">\r\n <span class=\"menu-title ms-8\">Traffic\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"clientData?.featureConfigs?.isNewZone && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v1\">\r\n <span class=\"menu-title ms-8\">Zones\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"clientData?.featureConfigs?.isNewZoneV2 && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v2\">\r\n <span class=\"menu-title ms-8\">Zone V2\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"clientData?.featureConfigs?.isTrax || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/dashboard\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_trax.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\">Tango Trax\r\n </span>\r\n </a>\r\n </div> \r\n<div *ngIf=\"this.usersList?.clientId ? this.usersList?.clientId === '430': this.headerFilters?.client === '430' || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/employee-metrics/aiManager\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n<g clip-path=\"url(#clip0_11702_17257)\">\r\n<path d=\"M3.33398 1.33398L3.46064 1.96065C3.55142 2.41065 3.75682 2.8296 4.05698 3.17695C4.35714 3.52429 4.74188 3.78826 5.17397 3.94332L5.33397 4.00065L5.17397 4.05798C4.74188 4.21304 4.35714 4.47701 4.05698 4.82435C3.75682 5.1717 3.55142 5.59065 3.46064 6.04065L3.33398 6.66732L3.20731 6.04065C3.11654 5.59065 2.91113 5.1717 2.61097 4.82435C2.31082 4.47701 1.92607 4.21304 1.49398 4.05798L1.33398 4.00065L1.49398 3.94332C1.92607 3.78826 2.31082 3.52429 2.61097 3.17695C2.91113 2.8296 3.11654 2.41065 3.20731 1.96065L3.33398 1.33398ZM5.33397 10.6673L5.48731 11.518C5.52712 11.7399 5.62255 11.9481 5.76467 12.1231C5.90679 12.2981 6.09096 12.4342 6.29997 12.5187L6.6673 12.6673L6.29997 12.816C6.09092 12.9003 5.90667 13.0363 5.76443 13.2112C5.6222 13.386 5.52662 13.5941 5.48664 13.816L5.33397 14.6673L5.18064 13.8167C5.14082 13.5948 5.0454 13.3866 4.90328 13.2116C4.76116 13.0366 4.57698 12.9005 4.36798 12.816L4.00064 12.6673L4.36798 12.5187C4.57702 12.4343 4.76128 12.2983 4.90351 12.1235C5.04575 11.9486 5.14132 11.7405 5.18131 11.5187L5.33397 10.6673ZM10.6673 2.00065L11.038 3.76998C11.2269 4.67204 11.6463 5.50975 12.2554 6.20143C12.8645 6.89311 13.6424 7.41515 14.5133 7.71665L15.3339 8.00065L14.5133 8.28465C13.6424 8.58615 12.8645 9.10819 12.2554 9.79987C11.6463 10.4916 11.2269 11.3293 11.038 12.2313L10.6673 14.0007L10.2966 12.2313C10.1077 11.3293 9.68827 10.4916 9.0792 9.79987C8.47013 9.10819 7.69221 8.58615 6.8213 8.28465L6.00064 8.00065L6.8213 7.71665C7.69221 7.41515 8.47013 6.89311 9.0792 6.20143C9.68827 5.50975 10.1077 4.67204 10.2966 3.76998L10.6673 2.00065Z\" stroke=\"#98A2B3\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n</g>\r\n<defs>\r\n<clipPath id=\"clip0_11702_17257\">\r\n<rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n</clipPath>\r\n</defs>\r\n</svg>\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\">AI Manager\r\n </span>\r\n </a>\r\n </div> \r\n\r\n <div *ngIf=\"this.usersList?.clientId ? this.usersList?.clientId === '489': this.headerFilters?.client === '489' || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/employee-metrics/beeahGroup\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n<g clip-path=\"url(#clip0_13388_25837)\">\r\n<path d=\"M10.9974 1.66406H13.664C13.8408 1.66406 14.0104 1.7343 14.1354 1.85932C14.2605 1.98435 14.3307 2.15392 14.3307 2.33073V4.9974M14.3307 10.9974V13.6641C14.3307 13.8409 14.2605 14.0104 14.1354 14.1355C14.0104 14.2605 13.8408 14.3307 13.664 14.3307H10.9974M4.99739 14.3307H2.33073C2.15392 14.3307 1.98435 14.2605 1.85932 14.1355C1.7343 14.0104 1.66406 13.8409 1.66406 13.6641V10.9974M1.66406 4.9974V2.33073C1.66406 2.15392 1.7343 1.98435 1.85932 1.85932C1.98435 1.7343 2.15392 1.66406 2.33073 1.66406H4.99739\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n<path d=\"M7.99999 12.6615C10.209 12.6615 12 10.5721 12 7.99479C12 5.41746 10.209 3.32812 7.99999 3.32812C5.79099 3.32812 4 5.41746 4 7.99479C4 10.5721 5.79099 12.6615 7.99999 12.6615Z\" stroke=\"#667085\" stroke-width=\"2\"/>\r\n<path d=\"M2 8H14M6.68999 10.0353C7.11232 10.3477 7.54898 10.5037 7.99998 10.5037C8.45065 10.5037 8.89931 10.3477 9.34598 10.0353\" stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n</g>\r\n<defs>\r\n<clipPath id=\"clip0_13388_25837\">\r\n<rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n</clipPath>\r\n</defs>\r\n</svg>\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\">AI Manager - Access Control\r\n </span>\r\n </a>\r\n </div> \r\n \r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon \">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/tango_trax.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15\">Tango Trax\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/checklist\">\r\n <span class=\"menu-title ms-8\">Checklist\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n <div *ngIf=\"clientData?.featureConfigs?.isControlCenter && this.usersList?.userType !=='tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/controlcenter\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/ControlCenter.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\" >Control Center\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic/explore\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/Explore.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Explore\r\n </span>\r\n </a>\r\n </div> \r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard && clientData?.featureConfigs?.isNewReports && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/analyse/reports\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/reports.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Reports\r\n </span>\r\n </a>\r\n </div> \r\n \r\n <!-- Manage -->\r\n <div *ngIf=\"(gs.userAccess | async)?.userType !== 'lead'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon \">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/manage.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15\">Manage\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/brands\">\r\n \r\n <span class=\"menu-title ms-8\">Brands\r\n </span>\r\n </a>\r\n </div>\r\n \r\n \r\n \r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/summary\">\r\n \r\n <span class=\"menu-title ms-8\">Summary\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/stores\">\r\n \r\n <span class=\"menu-title ms-8\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/client\">\r\n \r\n <span class=\"menu-title ms-8\">Users\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/tango\">\r\n \r\n <span class=\"menu-title ms-8\">Tango Users\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/tickets\" >\r\n \r\n <span class=\"menu-title ms-8\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/reports\" >\r\n \r\n <span class=\"menu-title ms-8\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/audit\" >\r\n \r\n <span class=\"menu-title ms-8\">Audit\r\n </span>\r\n </a>\r\n </div>\r\n \r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/billing\">\r\n \r\n <span class=\"menu-title ms-8\">Billing\r\n </span>\r\n </a>\r\n </div> \r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/settings\" >\r\n \r\n <span class=\"menu-title ms-8\">Settings\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/user-analysis\" >\r\n \r\n <span class=\"menu-title ms-8\">User Analysis\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n \r\n \r\n </div>\r\n\r\n <!-- Workspace -->\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/Workspace.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Workspace\r\n </span>\r\n </a>\r\n </div>\r\n <!--end::Menu-->\r\n</div>\r\n</div>\r\n<!--end::Menu wrapper-->\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title \" data-link=\"/manage/traffic\">ANALYZE\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n \r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\"\r\n class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M0.677249 15.8223H5.41799C6.09524 15.8223 6.09524 15.5214 6.09524 14.318V6.83461C6.09524 6.39794 5.79228 6.04449 5.41799 6.04449H0.677249C0.2709 6.04449 0 6.34534 0 6.79663V15.0701C0 15.5214 0.2709 15.8223 0.677249 15.8223Z\" fill=\"#475467\"/>\r\n <path d=\"M0.673874 4.44444H5.39099C5.79531 4.44444 6.06486 4.08889 6.06486 3.55555V0.888888C6.06486 0.355555 5.79531 0 5.39099 0H0.673874C0.269549 0 0 0.355555 0 0.888888V3.55555C0 4 0.269549 4.44444 0.673874 4.44444Z\" fill=\"#475467\"/>\r\n <path d=\"M2.27003 1.9131C2.27003 2.20178 2.09173 2.4358 1.87179 2.4358C1.65185 2.4358 1.47354 2.20178 1.47354 1.9131C1.47354 1.62443 1.65185 1.39041 1.87179 1.39041C2.09173 1.39041 2.27003 1.62443 2.27003 1.9131Z\" fill=\"#667085\"/>\r\n <path d=\"M3.46448 1.9131C3.46448 2.20178 3.28618 2.4358 3.06623 2.4358C2.84629 2.4358 2.66799 2.20178 2.66799 1.9131C2.66799 1.62443 2.84629 1.39041 3.06623 1.39041C3.28618 1.39041 3.46448 1.62443 3.46448 1.9131Z\" fill=\"#667085\"/>\r\n <path d=\"M4.66025 1.9131C4.66025 2.20178 4.48195 2.4358 4.262 2.4358C4.04206 2.4358 3.86376 2.20178 3.86376 1.9131C3.86376 1.62443 4.04206 1.39041 4.262 1.39041C4.48195 1.39041 4.66025 1.62443 4.66025 1.9131Z\" fill=\"#667085\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.61905 16V0H8.38095V16H7.61905Z\" fill=\"#667085\"/>\r\n <path d=\"M15.3227 0H10.582C10.1757 0 9.90476 0.300855 9.90476 0.752137V9.02564C9.90476 9.47692 10.1757 9.77778 10.582 9.77778H15.3227C15.7291 9.77778 16 9.47692 16 9.02564V0.752137C16 0.300855 15.7291 0 15.3227 0Z\" fill=\"#475467\"/>\r\n <path d=\"M9.93519 15.1111V12.4444C9.93519 11.9111 10.2047 11.5556 10.6091 11.5556H15.3261C15.7305 11.5556 16 11.9111 16 12.4444V15.1111C16 15.6444 15.7305 16 15.3261 16H10.6091C10.2047 16 9.93519 15.6444 9.93519 15.1111Z\" fill=\"#475467\"/>\r\n <path d=\"M12.0531 13.4336C12.0531 13.7223 11.8748 13.9563 11.6549 13.9563C11.4349 13.9563 11.2566 13.7223 11.2566 13.4336C11.2566 13.1449 11.4349 12.9109 11.6549 12.9109C11.8748 12.9109 12.0531 13.1449 12.0531 13.4336Z\" fill=\"#667085\"/>\r\n <path d=\"M13.2475 13.4336C13.2475 13.7223 13.0692 13.9563 12.8493 13.9563C12.6294 13.9563 12.4511 13.7223 12.4511 13.4336C12.4511 13.1449 12.6294 12.9109 12.8493 12.9109C13.0692 12.9109 13.2475 13.1449 13.2475 13.4336Z\" fill=\"#667085\"/>\r\n <path d=\"M14.4433 13.4336C14.4433 13.7223 14.265 13.9563 14.0451 13.9563C13.8251 13.9563 13.6468 13.7223 13.6468 13.4336C13.6468 13.1449 13.8251 12.9109 14.0451 12.9109C14.265 12.9109 14.4433 13.1449 14.4433 13.4336Z\" fill=\"#667085\"/>\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" data-link=\"\">Tango Eye\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Traffic\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"(gs.userAccess | async)?.analytics_tangoZone_isView && clientData?.featureConfigs?.isNewZone && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v1\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Zones\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v2\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Zone V2\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"this.usersList?.clientId ? this.usersList?.clientId === '11': this.headerFilters?.client === '11'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M9.84985 0.264419C9.5033 -0.0881395 8.97086 -0.0881395 8.62713 0.264419L2.76722 6.25478C2.5024 6.5231 2.40943 6.94117 2.52776 7.31557C4.9816 8.10493 6.91142 10.2546 7.60729 12.9815H12.8445C13.5912 12.9815 14.1968 12.3107 14.1968 11.4839V7.98637H15.0984C15.4702 7.98637 15.8027 7.73365 15.938 7.35301C16.0732 6.97238 15.983 6.53557 15.7098 6.25478L9.84985 0.264419ZM7.88619 6.48878C7.88619 6.21422 8.08904 5.98958 8.33696 5.98958H10.14C10.388 5.98958 10.5908 6.21422 10.5908 6.48878V8.48556C10.5908 8.76013 10.388 8.98476 10.14 8.98476H8.33696C8.08904 8.98476 7.88619 8.76013 7.88619 8.48556V6.48878Z\" fill=\"#667085\"/>\r\n <path d=\"M0 8.76165C0 8.34669 0.301447 8.01285 0.676143 8.01285C4.28506 8.01285 7.2122 11.2545 7.2122 15.2512C7.2122 15.6662 6.91075 16 6.53606 16C6.16136 16 5.85991 15.6662 5.85991 15.2512C5.85991 12.0813 3.53848 9.51044 0.676143 9.51044C0.301447 9.51044 0 9.1766 0 8.76165Z\" fill=\"#D0D5DD\"/>\r\n <path d=\"M1.539 15.7076C1.36993 15.8948 1.14062 16 0.901525 16C0.662426 16 0.43312 15.8948 0.264051 15.7076C0.0949818 15.5203 0 15.2664 0 15.0017C0 14.7368 0.0949818 14.4829 0.264051 14.2956C0.43312 14.1084 0.662426 14.0032 0.901525 14.0032C1.14062 14.0032 1.36993 14.1084 1.539 14.2956C1.70807 14.4829 1.80305 14.7368 1.80305 15.0017C1.80305 15.2664 1.70807 15.5203 1.539 15.7076Z\" fill=\"#D0D5DD\"/>\r\n <path d=\"M0.676143 12.5056C0.301447 12.5056 0 12.1717 0 11.7568C0 11.3418 0.301447 11.0081 0.676143 11.0081C2.79191 11.0081 4.50762 12.9081 4.50762 15.2512C4.50762 15.6662 4.20618 16 3.83148 16C3.45678 16 3.15534 15.6662 3.15534 15.2512C3.15534 13.7349 2.04533 12.5056 0.676143 12.5056Z\" fill=\"#D0D5DD\"/>\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" routerLink=\"/manage/controlcenter\">Control Center \r\n </span>\r\n \r\n </span>\r\n </div>\r\n \r\n <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\"\r\n class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M14.3843 6.77809L13.3937 6.58122C13.1468 6.53122 12.8937 6.60935 12.7156 6.78747L12.2343 7.26872C11.8718 7.63122 11.2625 7.53122 11.0343 7.07498L10.7437 6.49685C10.5937 6.19685 10.2875 6.00622 9.94997 6.00622C9.47497 6.00622 9.13435 6.46248 9.27185 6.91873L9.45935 7.5406C9.6031 8.02185 9.24372 8.50623 8.7406 8.50623H8.66872C8.24998 8.50623 7.85935 8.71561 7.6281 9.06249L7.29373 9.56561C7.11873 9.83123 7.1281 10.1781 7.31873 10.4312L7.82185 11.1031C8.14373 11.5312 7.92498 12.15 7.4031 12.2812L6.87185 12.4156C6.63748 12.475 6.44686 12.6406 6.35623 12.8656L5.84373 14.1437C6.51873 14.3719 7.24373 14.5 7.99998 14.5C11.5906 14.5 14.5 11.5906 14.5 7.99998C14.5 7.58123 14.4593 7.17184 14.3843 6.77809ZM1.64375 6.63435C1.83124 6.63435 1.81249 6.68122 1.92499 6.60935L2.41874 6.47185C2.62812 6.41247 2.84999 6.49997 2.96562 6.68122L3.02812 6.77809C3.21562 7.07184 3.54061 7.24997 3.89061 7.24997C4.24061 7.24997 4.56561 7.07184 4.75311 6.77809L4.94374 6.48122C4.98749 6.41247 5.04998 6.3531 5.12186 6.3156L6.24998 5.68435C6.81561 5.36872 7.04685 4.67185 6.78123 4.08123L6.60935 3.69374C6.34061 3.09374 5.64998 2.80311 5.03124 3.03436L4.94999 3.06561C4.63749 3.18123 4.66874 3.08437 4.39999 2.88749L3.96874 2.90311C2.39999 3.68749 1.92187 4.98436 1.6 6.48748L1.64375 6.63435ZM16 7.99998C16 10.1217 15.1571 12.1566 13.6568 13.6568C12.1565 15.1571 10.1217 16 7.99998 16C5.87825 16 3.84343 15.1571 2.34314 13.6568C0.842852 12.1566 0 10.1217 0 7.99998C0 5.87825 0.842852 3.84342 2.34314 2.34314C3.84343 0.842851 5.87825 0 7.99998 0C10.1217 0 12.1565 0.842851 13.6568 2.34314C15.1571 3.84342 16 5.87825 16 7.99998ZM11.4843 5.12185C11.55 4.8531 11.3875 4.58123 11.1218 4.5156L10.1218 4.2656C9.8531 4.19998 9.58122 4.36248 9.5156 4.6281C9.44997 4.89373 9.61247 5.16872 9.8781 5.23435L10.8781 5.48435C11.1468 5.54997 11.4187 5.38747 11.4843 5.12185ZM8.60935 5.74685C8.67497 5.4781 8.51248 5.20622 8.24685 5.1406C7.98123 5.07498 7.70623 5.23747 7.6406 5.5031L7.3906 6.5031C7.32498 6.77184 7.48748 7.04373 7.7531 7.10935C8.01873 7.17497 8.29373 7.01247 8.35935 6.74685L8.60935 5.74685Z\"\r\n fill=\"#475467\" />\r\n <path\r\n d=\"M2.45522 6.05254C2.59366 6.24051 2.35423 6.2781 2.22966 6.2781C2.10509 6.2781 2.0041 6.17711 2.0041 6.05254C2.0041 5.92797 2.10509 5.67661 2.22966 5.67661C2.35423 5.67661 2.45522 5.92797 2.45522 6.05254Z\"\r\n fill=\"#475467\" />\r\n <path\r\n d=\"M4.20498 11.8559C4.62113 11.3337 5.57024 10.0682 5.57024 9.35736C5.57024 8.49526 4.87261 7.79579 4.01273 7.79579C3.15285 7.79579 2.45522 8.49526 2.45522 9.35736C2.45522 10.0682 3.40433 11.3337 3.82047 11.8559C3.92025 11.9803 4.10521 11.9803 4.20498 11.8559ZM4.01273 8.83684C4.15042 8.83684 4.28247 8.89168 4.37984 8.98929C4.4772 9.08691 4.5319 9.21931 4.5319 9.35736C4.5319 9.49541 4.4772 9.62781 4.37984 9.72542C4.28247 9.82304 4.15042 9.87788 4.01273 9.87788C3.87504 9.87788 3.74298 9.82304 3.64562 9.72542C3.54826 9.62781 3.49356 9.49541 3.49356 9.35736C3.49356 9.21931 3.54826 9.08691 3.64562 8.98929C3.74298 8.89168 3.87504 8.83684 4.01273 8.83684Z\"\r\n fill=\"#667085\" />\r\n <path\r\n d=\"M13.0419 10.2943C13.9436 9.11946 16 6.27207 16 4.6727C16 2.73295 14.4884 1.1592 12.6253 1.1592C10.7623 1.1592 9.25074 2.73295 9.25074 4.6727C9.25074 6.27207 11.3071 9.11946 12.2088 10.2943C12.425 10.5743 12.8257 10.5743 13.0419 10.2943ZM12.6253 3.50153C12.9237 3.50153 13.2098 3.62492 13.4207 3.84456C13.6317 4.06419 13.7502 4.36208 13.7502 4.6727C13.7502 4.98331 13.6317 5.2812 13.4207 5.50083C13.2098 5.72047 12.9237 5.84386 12.6253 5.84386C12.327 5.84386 12.0409 5.72047 11.8299 5.50083C11.619 5.2812 11.5005 4.98331 11.5005 4.6727C11.5005 4.36208 11.619 4.06419 11.8299 3.84456C12.0409 3.62492 12.327 3.50153 12.6253 3.50153Z\"\r\n fill=\"#667085\" />\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" data-link=\"\">Tango Trax\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/checklist\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Checklist\r\n </span>\r\n </a>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n \r\n </div>\r\n \r\n</div>\r\n\r\n<div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\" routerLink=\"/manage/analyse/reports\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/manage/traffic\">REPORTS\r\n </span>\r\n \r\n </span>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango' || (gs.userAccess | async)?.userType === 'client'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/manage\">MANAGE\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_brands_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/brands\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/brands.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Brands\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_overview_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/summary\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/overview.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Summary\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_stores_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/stores\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/stores.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_tickets_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/tickets\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tickets.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_reports_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/reports\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/reports.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_users_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/client\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/users.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Users\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_audit_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/audit\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/audit.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Audit\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.settings_paymentSubscriptions_isView || (gs.userAccess | async)?.settings_activityLog_isView || (gs.userAccess | async)?.settings_brandDetails_isView || (gs.userAccess | async)?.settings_configuration_isView || (gs.userAccess | async)?.settings_contactDirectory_isView || (gs.userAccess | async)?.settings_documents_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/settings\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/settings.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Settings\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_users_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/tango\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/users.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Users\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/billing\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/billing.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Billing\r\n </span>\r\n </a>\r\n </div> \r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/tickets\">MY WORKSPACE\r\n </span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/tickets/stores\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/stores.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tickets.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n \r\n </div>\r\n </div> -->\r\n\r\n\r\n\r\n\r\n\r\n <!-- Tango Traffic -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_isView && clientData?.featureConfigs?.isNewTraffic && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_traffic.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Traffic</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Tango Zone -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoZone_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_zone.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Zone</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Tango Revop -->\r\n <!-- <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_revop.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Tango Revop\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Home\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Tagging\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Pending Action\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Customer Profile\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <!-- Control Center -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_controlCenter_isView\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/control_center.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Control Center\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Live & Playback\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Screen Manager\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Store Explore\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <!-- Tango SOP -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoSop_isView\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_sop.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Tango SOP\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Dashboard\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Create & Manage\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Flag\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Incidents\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n", styles: [".menu-bullet-dot span{display:inline-block;width:6px;height:6px;background-color:#000;border-radius:50%;margin-right:10px;vertical-align:middle}:host::ng-deep .menu-sub .menu-sub-accordion{border-left:2px solid #98A2B3!important}::ng-deep .app-sidebar .menu .menu-item .menu-link.active .menu-title{color:#f5f5f5!important;border-radius:8px!important;border:1px solid var(--text-primary, #FFF)!important;padding:8px!important;color:var(--Primary-500, #33B5FF)!important;font-size:12px!important;font-style:normal;font-weight:600;line-height:18px}::ng-deep .app-sidebar .menu .menu-item .menu-link .menu-title{font-size:12px!important;font-style:normal;font-weight:600;line-height:18px}::ng-deep .app-sidebar .menu .menu-item .menu-link.active{transition:color .2s ease;background-color:#0d0e12!important}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
|
|
7269
8612
|
}
|
|
7270
8613
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SidebarMenuComponent, decorators: [{
|
|
7271
8614
|
type: Component,
|
|
7272
|
-
args: [{ selector: "lib-sidebar-menu", template: "<!--begin::Menu wrapper-->\r\n<div id=\"kt_app_sidebar_menu_scroll\" class=\"scroll-y my-5 mx-3\" data-kt-scroll=\"true\" data-kt-scroll-activate=\"true\"\r\n data-kt-scroll-height=\"auto\" data-kt-scroll-dependencies=\"#kt_app_sidebar_logo, #kt_app_sidebar_footer\"\r\n data-kt-scroll-wrappers=\"#kt_app_sidebar_menu\" data-kt-scroll-offset=\"5px\" data-kt-scroll-save-state=\"true\">\r\n <!--begin::Menu-->\r\n <div class=\"menu menu-column menu-rounded menu-sub-indention fw-semibold fs-6\" id=\"#kt_app_sidebar_menu\"\r\n data-kt-menu=\"true\" data-kt-menu-expand=\"false\">\r\n <!-- Birds Eye -->\r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard && (gs.userAccess | async)?.userType !== 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/birds_eye.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Analytics</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Analyse -->\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/tango_eye.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15 text-nowrap\">Tango Eye\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewTraffic && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic\">\r\n <span class=\"menu-title ms-8\">Traffic\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"clientData?.featureConfigs?.isNewZone && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v1\">\r\n <span class=\"menu-title ms-8\">Zones\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"clientData?.featureConfigs?.isNewZoneV2 && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v2\">\r\n <span class=\"menu-title ms-8\">Zone V2\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"clientData?.featureConfigs?.isTrax || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/dashboard\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_trax.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\">Tango Trax\r\n </span>\r\n </a>\r\n </div> \r\n <div class=\"menu-item\" *ngIf=\"showPlano === 'Authorized'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/planogram/manage-planograms\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" class=\"fs-2\">\r\n <path\r\n d=\"M13.3336 6H11.8667L10.5336 7.33344H8.66671V6H4.66671V11.3334H3.33359C3.15676 11.3307 2.98116 11.3632 2.81699 11.4289C2.65283 11.4947 2.50339 11.5925 2.37738 11.7166C2.25136 11.8406 2.15129 11.9885 2.08298 12.1517C2.01467 12.3148 1.97949 12.4899 1.97949 12.6667C1.97949 12.8436 2.01467 13.0186 2.08298 13.1818C2.15129 13.3449 2.25136 13.4928 2.37738 13.6169C2.50339 13.741 2.65283 13.8387 2.81699 13.9045C2.98116 13.9703 3.15676 14.0027 3.33359 14H13.3336C13.5104 14 13.6799 13.9298 13.8049 13.8048C13.9299 13.6798 14.0001 13.5102 14.0001 13.3334V6.66656C14.0001 6.48978 13.9299 6.32023 13.8049 6.19523C13.6799 6.07023 13.5104 6 13.3336 6ZM4.66671 4V11.3334H3.33359C2.97999 11.3334 2.64088 11.4739 2.39082 11.7239C2.14076 11.9739 2.00023 12.313 2.00015 12.6666V5.33344C2.00015 4.97979 2.14064 4.64062 2.3907 4.39056C2.64077 4.14049 2.97994 4 3.33359 4H4.66671Z\"\r\n fill=\"#667085\" />\r\n <path\r\n d=\"M4.66671 11.3334V6H8.66671V7.33344H10.5336L11.8667 6H13.3336C13.5104 6 13.6799 6.07023 13.8049 6.19523C13.9299 6.32023 14.0001 6.48978 14.0001 6.66656V13.3334C14.0001 13.5102 13.9299 13.6798 13.8049 13.8048C13.6799 13.9298 13.5104 14 13.3336 14H3.33359C3.15676 14.0027 2.98116 13.9703 2.81699 13.9045C2.65283 13.8387 2.50339 13.741 2.37738 13.6169C2.25136 13.4928 2.15129 13.3449 2.08298 13.1818C2.01467 13.0186 1.97949 12.8436 1.97949 12.6667C1.97949 12.4899 2.01467 12.3148 2.08298 12.1517C2.15129 11.9885 2.25136 11.8406 2.37738 11.7166C2.50339 11.5925 2.65283 11.4947 2.81699 11.4289C2.98116 11.3632 3.15676 11.3307 3.33359 11.3334M4.66671 11.3334H3.33359M4.66671 11.3334V4H3.33359C2.97994 4 2.64077 4.14049 2.3907 4.39056C2.14064 4.64062 2.00015 4.97979 2.00015 5.33344V12.6666C2.00023 12.313 2.14076 11.9739 2.39082 11.7239C2.64088 11.4739 2.97999 11.3334 3.33359 11.3334\"\r\n stroke=\"#98A2B3\" stroke-width=\"0.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M13.8067 3.12656L12.8732 2.19344C12.7486 2.07133 12.5811 2.00293 12.4067 2.00293C12.2322 2.00293 12.0647 2.07133 11.9401 2.19344L8.6665 5.46704V7.3336H10.5334L13.8067 4.06C13.9288 3.9354 13.9972 3.7679 13.9972 3.59344C13.9972 3.41898 13.9288 3.25116 13.8067 3.12656Z\"\r\n fill=\"#D0D5DD\" />\r\n </svg>\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\">Planogram\r\n </span>\r\n </a>\r\n </div> \r\n \r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon \">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/tango_trax.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15\">Tango Trax\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/checklist\">\r\n <span class=\"menu-title ms-8\">Checklist\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n <div *ngIf=\"clientData?.featureConfigs?.isControlCenter && this.usersList?.userType !=='tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/controlcenter\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/ControlCenter.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\" >Control Center\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic/explore\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/Explore.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Explore\r\n </span>\r\n </a>\r\n </div> \r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard && clientData?.featureConfigs?.isNewReports && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/analyse/reports\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/reports.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Reports\r\n </span>\r\n </a>\r\n </div> \r\n \r\n <!-- Manage -->\r\n <div *ngIf=\"(gs.userAccess | async)?.userType !== 'lead'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon \">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/manage.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15\">Manage\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/brands\">\r\n \r\n <span class=\"menu-title ms-8\">Brands\r\n </span>\r\n </a>\r\n </div>\r\n \r\n \r\n \r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/summary\">\r\n \r\n <span class=\"menu-title ms-8\">Summary\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/stores\">\r\n \r\n <span class=\"menu-title ms-8\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/client\">\r\n \r\n <span class=\"menu-title ms-8\">Users\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/tango\">\r\n \r\n <span class=\"menu-title ms-8\">Tango Users\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/tickets\" >\r\n \r\n <span class=\"menu-title ms-8\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/reports\" >\r\n \r\n <span class=\"menu-title ms-8\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/audit\" >\r\n \r\n <span class=\"menu-title ms-8\">Audit\r\n </span>\r\n </a>\r\n </div>\r\n \r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/billing\">\r\n \r\n <span class=\"menu-title ms-8\">Billing\r\n </span>\r\n </a>\r\n </div> \r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/settings\" >\r\n \r\n <span class=\"menu-title ms-8\">Settings\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/user-analysis\" >\r\n \r\n <span class=\"menu-title ms-8\">User Analysis\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n \r\n \r\n </div>\r\n\r\n <!-- Workspace -->\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/Workspace.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Workspace\r\n </span>\r\n </a>\r\n </div>\r\n <!--end::Menu-->\r\n</div>\r\n</div>\r\n<!--end::Menu wrapper-->\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title \" data-link=\"/manage/traffic\">ANALYZE\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n \r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\"\r\n class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M0.677249 15.8223H5.41799C6.09524 15.8223 6.09524 15.5214 6.09524 14.318V6.83461C6.09524 6.39794 5.79228 6.04449 5.41799 6.04449H0.677249C0.2709 6.04449 0 6.34534 0 6.79663V15.0701C0 15.5214 0.2709 15.8223 0.677249 15.8223Z\" fill=\"#475467\"/>\r\n <path d=\"M0.673874 4.44444H5.39099C5.79531 4.44444 6.06486 4.08889 6.06486 3.55555V0.888888C6.06486 0.355555 5.79531 0 5.39099 0H0.673874C0.269549 0 0 0.355555 0 0.888888V3.55555C0 4 0.269549 4.44444 0.673874 4.44444Z\" fill=\"#475467\"/>\r\n <path d=\"M2.27003 1.9131C2.27003 2.20178 2.09173 2.4358 1.87179 2.4358C1.65185 2.4358 1.47354 2.20178 1.47354 1.9131C1.47354 1.62443 1.65185 1.39041 1.87179 1.39041C2.09173 1.39041 2.27003 1.62443 2.27003 1.9131Z\" fill=\"#667085\"/>\r\n <path d=\"M3.46448 1.9131C3.46448 2.20178 3.28618 2.4358 3.06623 2.4358C2.84629 2.4358 2.66799 2.20178 2.66799 1.9131C2.66799 1.62443 2.84629 1.39041 3.06623 1.39041C3.28618 1.39041 3.46448 1.62443 3.46448 1.9131Z\" fill=\"#667085\"/>\r\n <path d=\"M4.66025 1.9131C4.66025 2.20178 4.48195 2.4358 4.262 2.4358C4.04206 2.4358 3.86376 2.20178 3.86376 1.9131C3.86376 1.62443 4.04206 1.39041 4.262 1.39041C4.48195 1.39041 4.66025 1.62443 4.66025 1.9131Z\" fill=\"#667085\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.61905 16V0H8.38095V16H7.61905Z\" fill=\"#667085\"/>\r\n <path d=\"M15.3227 0H10.582C10.1757 0 9.90476 0.300855 9.90476 0.752137V9.02564C9.90476 9.47692 10.1757 9.77778 10.582 9.77778H15.3227C15.7291 9.77778 16 9.47692 16 9.02564V0.752137C16 0.300855 15.7291 0 15.3227 0Z\" fill=\"#475467\"/>\r\n <path d=\"M9.93519 15.1111V12.4444C9.93519 11.9111 10.2047 11.5556 10.6091 11.5556H15.3261C15.7305 11.5556 16 11.9111 16 12.4444V15.1111C16 15.6444 15.7305 16 15.3261 16H10.6091C10.2047 16 9.93519 15.6444 9.93519 15.1111Z\" fill=\"#475467\"/>\r\n <path d=\"M12.0531 13.4336C12.0531 13.7223 11.8748 13.9563 11.6549 13.9563C11.4349 13.9563 11.2566 13.7223 11.2566 13.4336C11.2566 13.1449 11.4349 12.9109 11.6549 12.9109C11.8748 12.9109 12.0531 13.1449 12.0531 13.4336Z\" fill=\"#667085\"/>\r\n <path d=\"M13.2475 13.4336C13.2475 13.7223 13.0692 13.9563 12.8493 13.9563C12.6294 13.9563 12.4511 13.7223 12.4511 13.4336C12.4511 13.1449 12.6294 12.9109 12.8493 12.9109C13.0692 12.9109 13.2475 13.1449 13.2475 13.4336Z\" fill=\"#667085\"/>\r\n <path d=\"M14.4433 13.4336C14.4433 13.7223 14.265 13.9563 14.0451 13.9563C13.8251 13.9563 13.6468 13.7223 13.6468 13.4336C13.6468 13.1449 13.8251 12.9109 14.0451 12.9109C14.265 12.9109 14.4433 13.1449 14.4433 13.4336Z\" fill=\"#667085\"/>\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" data-link=\"\">Tango Eye\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Traffic\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"(gs.userAccess | async)?.analytics_tangoZone_isView && clientData?.featureConfigs?.isNewZone && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v1\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Zones\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v2\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Zone V2\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"this.usersList?.clientId ? this.usersList?.clientId === '11': this.headerFilters?.client === '11'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M9.84985 0.264419C9.5033 -0.0881395 8.97086 -0.0881395 8.62713 0.264419L2.76722 6.25478C2.5024 6.5231 2.40943 6.94117 2.52776 7.31557C4.9816 8.10493 6.91142 10.2546 7.60729 12.9815H12.8445C13.5912 12.9815 14.1968 12.3107 14.1968 11.4839V7.98637H15.0984C15.4702 7.98637 15.8027 7.73365 15.938 7.35301C16.0732 6.97238 15.983 6.53557 15.7098 6.25478L9.84985 0.264419ZM7.88619 6.48878C7.88619 6.21422 8.08904 5.98958 8.33696 5.98958H10.14C10.388 5.98958 10.5908 6.21422 10.5908 6.48878V8.48556C10.5908 8.76013 10.388 8.98476 10.14 8.98476H8.33696C8.08904 8.98476 7.88619 8.76013 7.88619 8.48556V6.48878Z\" fill=\"#667085\"/>\r\n <path d=\"M0 8.76165C0 8.34669 0.301447 8.01285 0.676143 8.01285C4.28506 8.01285 7.2122 11.2545 7.2122 15.2512C7.2122 15.6662 6.91075 16 6.53606 16C6.16136 16 5.85991 15.6662 5.85991 15.2512C5.85991 12.0813 3.53848 9.51044 0.676143 9.51044C0.301447 9.51044 0 9.1766 0 8.76165Z\" fill=\"#D0D5DD\"/>\r\n <path d=\"M1.539 15.7076C1.36993 15.8948 1.14062 16 0.901525 16C0.662426 16 0.43312 15.8948 0.264051 15.7076C0.0949818 15.5203 0 15.2664 0 15.0017C0 14.7368 0.0949818 14.4829 0.264051 14.2956C0.43312 14.1084 0.662426 14.0032 0.901525 14.0032C1.14062 14.0032 1.36993 14.1084 1.539 14.2956C1.70807 14.4829 1.80305 14.7368 1.80305 15.0017C1.80305 15.2664 1.70807 15.5203 1.539 15.7076Z\" fill=\"#D0D5DD\"/>\r\n <path d=\"M0.676143 12.5056C0.301447 12.5056 0 12.1717 0 11.7568C0 11.3418 0.301447 11.0081 0.676143 11.0081C2.79191 11.0081 4.50762 12.9081 4.50762 15.2512C4.50762 15.6662 4.20618 16 3.83148 16C3.45678 16 3.15534 15.6662 3.15534 15.2512C3.15534 13.7349 2.04533 12.5056 0.676143 12.5056Z\" fill=\"#D0D5DD\"/>\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" routerLink=\"/manage/controlcenter\">Control Center \r\n </span>\r\n \r\n </span>\r\n </div>\r\n \r\n <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\"\r\n class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M14.3843 6.77809L13.3937 6.58122C13.1468 6.53122 12.8937 6.60935 12.7156 6.78747L12.2343 7.26872C11.8718 7.63122 11.2625 7.53122 11.0343 7.07498L10.7437 6.49685C10.5937 6.19685 10.2875 6.00622 9.94997 6.00622C9.47497 6.00622 9.13435 6.46248 9.27185 6.91873L9.45935 7.5406C9.6031 8.02185 9.24372 8.50623 8.7406 8.50623H8.66872C8.24998 8.50623 7.85935 8.71561 7.6281 9.06249L7.29373 9.56561C7.11873 9.83123 7.1281 10.1781 7.31873 10.4312L7.82185 11.1031C8.14373 11.5312 7.92498 12.15 7.4031 12.2812L6.87185 12.4156C6.63748 12.475 6.44686 12.6406 6.35623 12.8656L5.84373 14.1437C6.51873 14.3719 7.24373 14.5 7.99998 14.5C11.5906 14.5 14.5 11.5906 14.5 7.99998C14.5 7.58123 14.4593 7.17184 14.3843 6.77809ZM1.64375 6.63435C1.83124 6.63435 1.81249 6.68122 1.92499 6.60935L2.41874 6.47185C2.62812 6.41247 2.84999 6.49997 2.96562 6.68122L3.02812 6.77809C3.21562 7.07184 3.54061 7.24997 3.89061 7.24997C4.24061 7.24997 4.56561 7.07184 4.75311 6.77809L4.94374 6.48122C4.98749 6.41247 5.04998 6.3531 5.12186 6.3156L6.24998 5.68435C6.81561 5.36872 7.04685 4.67185 6.78123 4.08123L6.60935 3.69374C6.34061 3.09374 5.64998 2.80311 5.03124 3.03436L4.94999 3.06561C4.63749 3.18123 4.66874 3.08437 4.39999 2.88749L3.96874 2.90311C2.39999 3.68749 1.92187 4.98436 1.6 6.48748L1.64375 6.63435ZM16 7.99998C16 10.1217 15.1571 12.1566 13.6568 13.6568C12.1565 15.1571 10.1217 16 7.99998 16C5.87825 16 3.84343 15.1571 2.34314 13.6568C0.842852 12.1566 0 10.1217 0 7.99998C0 5.87825 0.842852 3.84342 2.34314 2.34314C3.84343 0.842851 5.87825 0 7.99998 0C10.1217 0 12.1565 0.842851 13.6568 2.34314C15.1571 3.84342 16 5.87825 16 7.99998ZM11.4843 5.12185C11.55 4.8531 11.3875 4.58123 11.1218 4.5156L10.1218 4.2656C9.8531 4.19998 9.58122 4.36248 9.5156 4.6281C9.44997 4.89373 9.61247 5.16872 9.8781 5.23435L10.8781 5.48435C11.1468 5.54997 11.4187 5.38747 11.4843 5.12185ZM8.60935 5.74685C8.67497 5.4781 8.51248 5.20622 8.24685 5.1406C7.98123 5.07498 7.70623 5.23747 7.6406 5.5031L7.3906 6.5031C7.32498 6.77184 7.48748 7.04373 7.7531 7.10935C8.01873 7.17497 8.29373 7.01247 8.35935 6.74685L8.60935 5.74685Z\"\r\n fill=\"#475467\" />\r\n <path\r\n d=\"M2.45522 6.05254C2.59366 6.24051 2.35423 6.2781 2.22966 6.2781C2.10509 6.2781 2.0041 6.17711 2.0041 6.05254C2.0041 5.92797 2.10509 5.67661 2.22966 5.67661C2.35423 5.67661 2.45522 5.92797 2.45522 6.05254Z\"\r\n fill=\"#475467\" />\r\n <path\r\n d=\"M4.20498 11.8559C4.62113 11.3337 5.57024 10.0682 5.57024 9.35736C5.57024 8.49526 4.87261 7.79579 4.01273 7.79579C3.15285 7.79579 2.45522 8.49526 2.45522 9.35736C2.45522 10.0682 3.40433 11.3337 3.82047 11.8559C3.92025 11.9803 4.10521 11.9803 4.20498 11.8559ZM4.01273 8.83684C4.15042 8.83684 4.28247 8.89168 4.37984 8.98929C4.4772 9.08691 4.5319 9.21931 4.5319 9.35736C4.5319 9.49541 4.4772 9.62781 4.37984 9.72542C4.28247 9.82304 4.15042 9.87788 4.01273 9.87788C3.87504 9.87788 3.74298 9.82304 3.64562 9.72542C3.54826 9.62781 3.49356 9.49541 3.49356 9.35736C3.49356 9.21931 3.54826 9.08691 3.64562 8.98929C3.74298 8.89168 3.87504 8.83684 4.01273 8.83684Z\"\r\n fill=\"#667085\" />\r\n <path\r\n d=\"M13.0419 10.2943C13.9436 9.11946 16 6.27207 16 4.6727C16 2.73295 14.4884 1.1592 12.6253 1.1592C10.7623 1.1592 9.25074 2.73295 9.25074 4.6727C9.25074 6.27207 11.3071 9.11946 12.2088 10.2943C12.425 10.5743 12.8257 10.5743 13.0419 10.2943ZM12.6253 3.50153C12.9237 3.50153 13.2098 3.62492 13.4207 3.84456C13.6317 4.06419 13.7502 4.36208 13.7502 4.6727C13.7502 4.98331 13.6317 5.2812 13.4207 5.50083C13.2098 5.72047 12.9237 5.84386 12.6253 5.84386C12.327 5.84386 12.0409 5.72047 11.8299 5.50083C11.619 5.2812 11.5005 4.98331 11.5005 4.6727C11.5005 4.36208 11.619 4.06419 11.8299 3.84456C12.0409 3.62492 12.327 3.50153 12.6253 3.50153Z\"\r\n fill=\"#667085\" />\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" data-link=\"\">Tango Trax\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/checklist\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Checklist\r\n </span>\r\n </a>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n \r\n </div>\r\n \r\n</div>\r\n\r\n<div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\" routerLink=\"/manage/analyse/reports\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/manage/traffic\">REPORTS\r\n </span>\r\n \r\n </span>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango' || (gs.userAccess | async)?.userType === 'client'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/manage\">MANAGE\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_brands_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/brands\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/brands.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Brands\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_summary_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/summary\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/overview.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Summary\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.stores_stores_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/stores\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/stores.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.tickets_infra_isView || (gs.userAccess | async)?.tickets_dataMismatch_isView || (gs.userAccess | async)?.tickets_employeeMat_isView || (gs.userAccess | async)?.tickets_installation_isView \" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/tickets\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tickets.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_reports_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/reports\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/reports.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.users_users_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/client\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/users.svg\" alt=\"\">\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.settings_paymentSubscriptions_isView || (gs.userAccess | async)?.settings_activityLog_isView || (gs.userAccess | async)?.settings_brandDetails_isView || (gs.userAccess | async)?.settings_configuration_isView || (gs.userAccess | async)?.settings_contactDirectory_isView || (gs.userAccess | async)?.settings_documents_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/settings\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/settings.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Settings\r\n </span>\r\n </a>\r\n </div>\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/tango\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/users.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Users\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/billing\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/billing.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Billing\r\n </span>\r\n </a>\r\n </div> \r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/tickets\">MY WORKSPACE\r\n </span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/tickets/stores\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/stores.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tickets.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n \r\n </div>\r\n </div> -->\r\n\r\n\r\n\r\n\r\n\r\n <!-- Tango Traffic -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_isView && clientData?.featureConfigs?.isNewTraffic && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_traffic.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Traffic</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Tango Zone -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoZone_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_zone.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Zone</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Tango Revop -->\r\n <!-- <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_revop.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Tango Revop\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Home\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Tagging\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Pending Action\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Customer Profile\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <!-- Control Center -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_controlCenter_isView\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/control_center.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Control Center\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Live & Playback\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Screen Manager\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Store Explore\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <!-- Tango SOP -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoSop_isView\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_sop.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Tango SOP\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Dashboard\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Create & Manage\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Flag\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Incidents\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n", styles: [".menu-bullet-dot span{display:inline-block;width:6px;height:6px;background-color:#000;border-radius:50%;margin-right:10px;vertical-align:middle}:host::ng-deep .menu-sub .menu-sub-accordion{border-left:2px solid #98A2B3!important}::ng-deep .app-sidebar .menu .menu-item .menu-link.active .menu-title{color:#f5f5f5!important;border-radius:8px!important;border:1px solid var(--text-primary, #FFF)!important;padding:8px!important;color:var(--Primary-500, #33B5FF)!important;font-size:12px!important;font-style:normal;font-weight:600;line-height:18px}::ng-deep .app-sidebar .menu .menu-item .menu-link .menu-title{font-size:12px!important;font-style:normal;font-weight:600;line-height:18px}::ng-deep .app-sidebar .menu .menu-item .menu-link.active{transition:color .2s ease;background-color:#0d0e12!important}\n"] }]
|
|
8615
|
+
args: [{ selector: "lib-sidebar-menu", template: "<!--begin::Menu wrapper-->\r\n<div id=\"kt_app_sidebar_menu_scroll\" class=\"scroll-y my-5 ms-2 me-0\" data-kt-scroll=\"true\" data-kt-scroll-activate=\"true\"\r\n data-kt-scroll-height=\"auto\" data-kt-scroll-dependencies=\"#kt_app_sidebar_logo, #kt_app_sidebar_footer\"\r\n data-kt-scroll-wrappers=\"#kt_app_sidebar_menu\" data-kt-scroll-offset=\"5px\" data-kt-scroll-save-state=\"true\">\r\n <!--begin::Menu-->\r\n <div class=\"menu menu-column menu-rounded menu-sub-indention fw-semibold fs-6\" id=\"#kt_app_sidebar_menu\"\r\n data-kt-menu=\"true\" data-kt-menu-expand=\"false\">\r\n <!-- Birds Eye -->\r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard && (gs.userAccess | async)?.userType !== 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/birds_eye.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Analytics</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Analyse -->\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/tango_eye.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15 text-nowrap\">Tango Eye\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewTraffic && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic\">\r\n <span class=\"menu-title ms-8\">Traffic\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"clientData?.featureConfigs?.isNewZone && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v1\">\r\n <span class=\"menu-title ms-8\">Zones\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"clientData?.featureConfigs?.isNewZoneV2 && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v2\">\r\n <span class=\"menu-title ms-8\">Zone V2\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"clientData?.featureConfigs?.isTrax || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/dashboard\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_trax.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\">Tango Trax\r\n </span>\r\n </a>\r\n </div> \r\n<div *ngIf=\"this.usersList?.clientId ? this.usersList?.clientId === '430': this.headerFilters?.client === '430' || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/employee-metrics/aiManager\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n<g clip-path=\"url(#clip0_11702_17257)\">\r\n<path d=\"M3.33398 1.33398L3.46064 1.96065C3.55142 2.41065 3.75682 2.8296 4.05698 3.17695C4.35714 3.52429 4.74188 3.78826 5.17397 3.94332L5.33397 4.00065L5.17397 4.05798C4.74188 4.21304 4.35714 4.47701 4.05698 4.82435C3.75682 5.1717 3.55142 5.59065 3.46064 6.04065L3.33398 6.66732L3.20731 6.04065C3.11654 5.59065 2.91113 5.1717 2.61097 4.82435C2.31082 4.47701 1.92607 4.21304 1.49398 4.05798L1.33398 4.00065L1.49398 3.94332C1.92607 3.78826 2.31082 3.52429 2.61097 3.17695C2.91113 2.8296 3.11654 2.41065 3.20731 1.96065L3.33398 1.33398ZM5.33397 10.6673L5.48731 11.518C5.52712 11.7399 5.62255 11.9481 5.76467 12.1231C5.90679 12.2981 6.09096 12.4342 6.29997 12.5187L6.6673 12.6673L6.29997 12.816C6.09092 12.9003 5.90667 13.0363 5.76443 13.2112C5.6222 13.386 5.52662 13.5941 5.48664 13.816L5.33397 14.6673L5.18064 13.8167C5.14082 13.5948 5.0454 13.3866 4.90328 13.2116C4.76116 13.0366 4.57698 12.9005 4.36798 12.816L4.00064 12.6673L4.36798 12.5187C4.57702 12.4343 4.76128 12.2983 4.90351 12.1235C5.04575 11.9486 5.14132 11.7405 5.18131 11.5187L5.33397 10.6673ZM10.6673 2.00065L11.038 3.76998C11.2269 4.67204 11.6463 5.50975 12.2554 6.20143C12.8645 6.89311 13.6424 7.41515 14.5133 7.71665L15.3339 8.00065L14.5133 8.28465C13.6424 8.58615 12.8645 9.10819 12.2554 9.79987C11.6463 10.4916 11.2269 11.3293 11.038 12.2313L10.6673 14.0007L10.2966 12.2313C10.1077 11.3293 9.68827 10.4916 9.0792 9.79987C8.47013 9.10819 7.69221 8.58615 6.8213 8.28465L6.00064 8.00065L6.8213 7.71665C7.69221 7.41515 8.47013 6.89311 9.0792 6.20143C9.68827 5.50975 10.1077 4.67204 10.2966 3.76998L10.6673 2.00065Z\" stroke=\"#98A2B3\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n</g>\r\n<defs>\r\n<clipPath id=\"clip0_11702_17257\">\r\n<rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n</clipPath>\r\n</defs>\r\n</svg>\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\">AI Manager\r\n </span>\r\n </a>\r\n </div> \r\n\r\n <div *ngIf=\"this.usersList?.clientId ? this.usersList?.clientId === '489': this.headerFilters?.client === '489' || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/employee-metrics/beeahGroup\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n<g clip-path=\"url(#clip0_13388_25837)\">\r\n<path d=\"M10.9974 1.66406H13.664C13.8408 1.66406 14.0104 1.7343 14.1354 1.85932C14.2605 1.98435 14.3307 2.15392 14.3307 2.33073V4.9974M14.3307 10.9974V13.6641C14.3307 13.8409 14.2605 14.0104 14.1354 14.1355C14.0104 14.2605 13.8408 14.3307 13.664 14.3307H10.9974M4.99739 14.3307H2.33073C2.15392 14.3307 1.98435 14.2605 1.85932 14.1355C1.7343 14.0104 1.66406 13.8409 1.66406 13.6641V10.9974M1.66406 4.9974V2.33073C1.66406 2.15392 1.7343 1.98435 1.85932 1.85932C1.98435 1.7343 2.15392 1.66406 2.33073 1.66406H4.99739\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n<path d=\"M7.99999 12.6615C10.209 12.6615 12 10.5721 12 7.99479C12 5.41746 10.209 3.32812 7.99999 3.32812C5.79099 3.32812 4 5.41746 4 7.99479C4 10.5721 5.79099 12.6615 7.99999 12.6615Z\" stroke=\"#667085\" stroke-width=\"2\"/>\r\n<path d=\"M2 8H14M6.68999 10.0353C7.11232 10.3477 7.54898 10.5037 7.99998 10.5037C8.45065 10.5037 8.89931 10.3477 9.34598 10.0353\" stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"/>\r\n</g>\r\n<defs>\r\n<clipPath id=\"clip0_13388_25837\">\r\n<rect width=\"16\" height=\"16\" fill=\"white\"/>\r\n</clipPath>\r\n</defs>\r\n</svg>\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\">AI Manager - Access Control\r\n </span>\r\n </a>\r\n </div> \r\n \r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon \">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/tango_trax.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15\">Tango Trax\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/checklist\">\r\n <span class=\"menu-title ms-8\">Checklist\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n <div *ngIf=\"clientData?.featureConfigs?.isControlCenter && this.usersList?.userType !=='tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/controlcenter\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/ControlCenter.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3 text-nowrap\" >Control Center\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic/explore\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/Explore.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Explore\r\n </span>\r\n </a>\r\n </div> \r\n <div *ngIf=\"clientData?.featureConfigs?.isNewDashboard && clientData?.featureConfigs?.isNewReports && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/analyse/reports\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/reports.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Reports\r\n </span>\r\n </a>\r\n </div> \r\n \r\n <!-- Manage -->\r\n <div *ngIf=\"(gs.userAccess | async)?.userType !== 'lead'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon \">\r\n <img class=\"fs-2 ms-15\" src=\"./assets/tango/sidemenu-icons/manage.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-15\">Manage\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\" *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/brands\">\r\n \r\n <span class=\"menu-title ms-8\">Brands\r\n </span>\r\n </a>\r\n </div>\r\n \r\n \r\n \r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/summary\">\r\n \r\n <span class=\"menu-title ms-8\">Summary\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/stores\">\r\n \r\n <span class=\"menu-title ms-8\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/client\">\r\n \r\n <span class=\"menu-title ms-8\">Users\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/tango\">\r\n \r\n <span class=\"menu-title ms-8\">Tango Users\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/tickets\" >\r\n \r\n <span class=\"menu-title ms-8\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/reports\" >\r\n \r\n <span class=\"menu-title ms-8\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/audit\" >\r\n \r\n <span class=\"menu-title ms-8\">Audit\r\n </span>\r\n </a>\r\n </div>\r\n \r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/billing\">\r\n \r\n <span class=\"menu-title ms-8\">Billing\r\n </span>\r\n </a>\r\n </div> \r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/settings\" >\r\n \r\n <span class=\"menu-title ms-8\">Settings\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/user-analysis\" >\r\n \r\n <span class=\"menu-title ms-8\">User Analysis\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n \r\n \r\n </div>\r\n\r\n <!-- Workspace -->\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/Workspace.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title ms-3\">Workspace\r\n </span>\r\n </a>\r\n </div>\r\n <!--end::Menu-->\r\n</div>\r\n</div>\r\n<!--end::Menu wrapper-->\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n <!-- <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title \" data-link=\"/manage/traffic\">ANALYZE\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n \r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\"\r\n class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M0.677249 15.8223H5.41799C6.09524 15.8223 6.09524 15.5214 6.09524 14.318V6.83461C6.09524 6.39794 5.79228 6.04449 5.41799 6.04449H0.677249C0.2709 6.04449 0 6.34534 0 6.79663V15.0701C0 15.5214 0.2709 15.8223 0.677249 15.8223Z\" fill=\"#475467\"/>\r\n <path d=\"M0.673874 4.44444H5.39099C5.79531 4.44444 6.06486 4.08889 6.06486 3.55555V0.888888C6.06486 0.355555 5.79531 0 5.39099 0H0.673874C0.269549 0 0 0.355555 0 0.888888V3.55555C0 4 0.269549 4.44444 0.673874 4.44444Z\" fill=\"#475467\"/>\r\n <path d=\"M2.27003 1.9131C2.27003 2.20178 2.09173 2.4358 1.87179 2.4358C1.65185 2.4358 1.47354 2.20178 1.47354 1.9131C1.47354 1.62443 1.65185 1.39041 1.87179 1.39041C2.09173 1.39041 2.27003 1.62443 2.27003 1.9131Z\" fill=\"#667085\"/>\r\n <path d=\"M3.46448 1.9131C3.46448 2.20178 3.28618 2.4358 3.06623 2.4358C2.84629 2.4358 2.66799 2.20178 2.66799 1.9131C2.66799 1.62443 2.84629 1.39041 3.06623 1.39041C3.28618 1.39041 3.46448 1.62443 3.46448 1.9131Z\" fill=\"#667085\"/>\r\n <path d=\"M4.66025 1.9131C4.66025 2.20178 4.48195 2.4358 4.262 2.4358C4.04206 2.4358 3.86376 2.20178 3.86376 1.9131C3.86376 1.62443 4.04206 1.39041 4.262 1.39041C4.48195 1.39041 4.66025 1.62443 4.66025 1.9131Z\" fill=\"#667085\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.61905 16V0H8.38095V16H7.61905Z\" fill=\"#667085\"/>\r\n <path d=\"M15.3227 0H10.582C10.1757 0 9.90476 0.300855 9.90476 0.752137V9.02564C9.90476 9.47692 10.1757 9.77778 10.582 9.77778H15.3227C15.7291 9.77778 16 9.47692 16 9.02564V0.752137C16 0.300855 15.7291 0 15.3227 0Z\" fill=\"#475467\"/>\r\n <path d=\"M9.93519 15.1111V12.4444C9.93519 11.9111 10.2047 11.5556 10.6091 11.5556H15.3261C15.7305 11.5556 16 11.9111 16 12.4444V15.1111C16 15.6444 15.7305 16 15.3261 16H10.6091C10.2047 16 9.93519 15.6444 9.93519 15.1111Z\" fill=\"#475467\"/>\r\n <path d=\"M12.0531 13.4336C12.0531 13.7223 11.8748 13.9563 11.6549 13.9563C11.4349 13.9563 11.2566 13.7223 11.2566 13.4336C11.2566 13.1449 11.4349 12.9109 11.6549 12.9109C11.8748 12.9109 12.0531 13.1449 12.0531 13.4336Z\" fill=\"#667085\"/>\r\n <path d=\"M13.2475 13.4336C13.2475 13.7223 13.0692 13.9563 12.8493 13.9563C12.6294 13.9563 12.4511 13.7223 12.4511 13.4336C12.4511 13.1449 12.6294 12.9109 12.8493 12.9109C13.0692 12.9109 13.2475 13.1449 13.2475 13.4336Z\" fill=\"#667085\"/>\r\n <path d=\"M14.4433 13.4336C14.4433 13.7223 14.265 13.9563 14.0451 13.9563C13.8251 13.9563 13.6468 13.7223 13.6468 13.4336C13.6468 13.1449 13.8251 12.9109 14.0451 12.9109C14.265 12.9109 14.4433 13.1449 14.4433 13.4336Z\" fill=\"#667085\"/>\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" data-link=\"\">Tango Eye\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion mx-2\" routerLinkActive=\"menu-active-bg\">\r\n <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/traffic\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Traffic\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\" *ngIf=\"(gs.userAccess | async)?.analytics_tangoZone_isView && clientData?.featureConfigs?.isNewZone && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v1\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Zones\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/zones/v2\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Zone V2\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"this.usersList?.clientId ? this.usersList?.clientId === '11': this.headerFilters?.client === '11'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path d=\"M9.84985 0.264419C9.5033 -0.0881395 8.97086 -0.0881395 8.62713 0.264419L2.76722 6.25478C2.5024 6.5231 2.40943 6.94117 2.52776 7.31557C4.9816 8.10493 6.91142 10.2546 7.60729 12.9815H12.8445C13.5912 12.9815 14.1968 12.3107 14.1968 11.4839V7.98637H15.0984C15.4702 7.98637 15.8027 7.73365 15.938 7.35301C16.0732 6.97238 15.983 6.53557 15.7098 6.25478L9.84985 0.264419ZM7.88619 6.48878C7.88619 6.21422 8.08904 5.98958 8.33696 5.98958H10.14C10.388 5.98958 10.5908 6.21422 10.5908 6.48878V8.48556C10.5908 8.76013 10.388 8.98476 10.14 8.98476H8.33696C8.08904 8.98476 7.88619 8.76013 7.88619 8.48556V6.48878Z\" fill=\"#667085\"/>\r\n <path d=\"M0 8.76165C0 8.34669 0.301447 8.01285 0.676143 8.01285C4.28506 8.01285 7.2122 11.2545 7.2122 15.2512C7.2122 15.6662 6.91075 16 6.53606 16C6.16136 16 5.85991 15.6662 5.85991 15.2512C5.85991 12.0813 3.53848 9.51044 0.676143 9.51044C0.301447 9.51044 0 9.1766 0 8.76165Z\" fill=\"#D0D5DD\"/>\r\n <path d=\"M1.539 15.7076C1.36993 15.8948 1.14062 16 0.901525 16C0.662426 16 0.43312 15.8948 0.264051 15.7076C0.0949818 15.5203 0 15.2664 0 15.0017C0 14.7368 0.0949818 14.4829 0.264051 14.2956C0.43312 14.1084 0.662426 14.0032 0.901525 14.0032C1.14062 14.0032 1.36993 14.1084 1.539 14.2956C1.70807 14.4829 1.80305 14.7368 1.80305 15.0017C1.80305 15.2664 1.70807 15.5203 1.539 15.7076Z\" fill=\"#D0D5DD\"/>\r\n <path d=\"M0.676143 12.5056C0.301447 12.5056 0 12.1717 0 11.7568C0 11.3418 0.301447 11.0081 0.676143 11.0081C2.79191 11.0081 4.50762 12.9081 4.50762 15.2512C4.50762 15.6662 4.20618 16 3.83148 16C3.45678 16 3.15534 15.6662 3.15534 15.2512C3.15534 13.7349 2.04533 12.5056 0.676143 12.5056Z\" fill=\"#D0D5DD\"/>\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" routerLink=\"/manage/controlcenter\">Control Center \r\n </span>\r\n \r\n </span>\r\n </div>\r\n \r\n <div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\"\r\n class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span class=\"menu-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M14.3843 6.77809L13.3937 6.58122C13.1468 6.53122 12.8937 6.60935 12.7156 6.78747L12.2343 7.26872C11.8718 7.63122 11.2625 7.53122 11.0343 7.07498L10.7437 6.49685C10.5937 6.19685 10.2875 6.00622 9.94997 6.00622C9.47497 6.00622 9.13435 6.46248 9.27185 6.91873L9.45935 7.5406C9.6031 8.02185 9.24372 8.50623 8.7406 8.50623H8.66872C8.24998 8.50623 7.85935 8.71561 7.6281 9.06249L7.29373 9.56561C7.11873 9.83123 7.1281 10.1781 7.31873 10.4312L7.82185 11.1031C8.14373 11.5312 7.92498 12.15 7.4031 12.2812L6.87185 12.4156C6.63748 12.475 6.44686 12.6406 6.35623 12.8656L5.84373 14.1437C6.51873 14.3719 7.24373 14.5 7.99998 14.5C11.5906 14.5 14.5 11.5906 14.5 7.99998C14.5 7.58123 14.4593 7.17184 14.3843 6.77809ZM1.64375 6.63435C1.83124 6.63435 1.81249 6.68122 1.92499 6.60935L2.41874 6.47185C2.62812 6.41247 2.84999 6.49997 2.96562 6.68122L3.02812 6.77809C3.21562 7.07184 3.54061 7.24997 3.89061 7.24997C4.24061 7.24997 4.56561 7.07184 4.75311 6.77809L4.94374 6.48122C4.98749 6.41247 5.04998 6.3531 5.12186 6.3156L6.24998 5.68435C6.81561 5.36872 7.04685 4.67185 6.78123 4.08123L6.60935 3.69374C6.34061 3.09374 5.64998 2.80311 5.03124 3.03436L4.94999 3.06561C4.63749 3.18123 4.66874 3.08437 4.39999 2.88749L3.96874 2.90311C2.39999 3.68749 1.92187 4.98436 1.6 6.48748L1.64375 6.63435ZM16 7.99998C16 10.1217 15.1571 12.1566 13.6568 13.6568C12.1565 15.1571 10.1217 16 7.99998 16C5.87825 16 3.84343 15.1571 2.34314 13.6568C0.842852 12.1566 0 10.1217 0 7.99998C0 5.87825 0.842852 3.84342 2.34314 2.34314C3.84343 0.842851 5.87825 0 7.99998 0C10.1217 0 12.1565 0.842851 13.6568 2.34314C15.1571 3.84342 16 5.87825 16 7.99998ZM11.4843 5.12185C11.55 4.8531 11.3875 4.58123 11.1218 4.5156L10.1218 4.2656C9.8531 4.19998 9.58122 4.36248 9.5156 4.6281C9.44997 4.89373 9.61247 5.16872 9.8781 5.23435L10.8781 5.48435C11.1468 5.54997 11.4187 5.38747 11.4843 5.12185ZM8.60935 5.74685C8.67497 5.4781 8.51248 5.20622 8.24685 5.1406C7.98123 5.07498 7.70623 5.23747 7.6406 5.5031L7.3906 6.5031C7.32498 6.77184 7.48748 7.04373 7.7531 7.10935C8.01873 7.17497 8.29373 7.01247 8.35935 6.74685L8.60935 5.74685Z\"\r\n fill=\"#475467\" />\r\n <path\r\n d=\"M2.45522 6.05254C2.59366 6.24051 2.35423 6.2781 2.22966 6.2781C2.10509 6.2781 2.0041 6.17711 2.0041 6.05254C2.0041 5.92797 2.10509 5.67661 2.22966 5.67661C2.35423 5.67661 2.45522 5.92797 2.45522 6.05254Z\"\r\n fill=\"#475467\" />\r\n <path\r\n d=\"M4.20498 11.8559C4.62113 11.3337 5.57024 10.0682 5.57024 9.35736C5.57024 8.49526 4.87261 7.79579 4.01273 7.79579C3.15285 7.79579 2.45522 8.49526 2.45522 9.35736C2.45522 10.0682 3.40433 11.3337 3.82047 11.8559C3.92025 11.9803 4.10521 11.9803 4.20498 11.8559ZM4.01273 8.83684C4.15042 8.83684 4.28247 8.89168 4.37984 8.98929C4.4772 9.08691 4.5319 9.21931 4.5319 9.35736C4.5319 9.49541 4.4772 9.62781 4.37984 9.72542C4.28247 9.82304 4.15042 9.87788 4.01273 9.87788C3.87504 9.87788 3.74298 9.82304 3.64562 9.72542C3.54826 9.62781 3.49356 9.49541 3.49356 9.35736C3.49356 9.21931 3.54826 9.08691 3.64562 8.98929C3.74298 8.89168 3.87504 8.83684 4.01273 8.83684Z\"\r\n fill=\"#667085\" />\r\n <path\r\n d=\"M13.0419 10.2943C13.9436 9.11946 16 6.27207 16 4.6727C16 2.73295 14.4884 1.1592 12.6253 1.1592C10.7623 1.1592 9.25074 2.73295 9.25074 4.6727C9.25074 6.27207 11.3071 9.11946 12.2088 10.2943C12.425 10.5743 12.8257 10.5743 13.0419 10.2943ZM12.6253 3.50153C12.9237 3.50153 13.2098 3.62492 13.4207 3.84456C13.6317 4.06419 13.7502 4.36208 13.7502 4.6727C13.7502 4.98331 13.6317 5.2812 13.4207 5.50083C13.2098 5.72047 12.9237 5.84386 12.6253 5.84386C12.327 5.84386 12.0409 5.72047 11.8299 5.50083C11.619 5.2812 11.5005 4.98331 11.5005 4.6727C11.5005 4.36208 11.619 4.06419 11.8299 3.84456C12.0409 3.62492 12.327 3.50153 12.6253 3.50153Z\"\r\n fill=\"#667085\" />\r\n </svg>\r\n </span>\r\n <span class=\"menu-title\" data-link=\"\">Tango Trax\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/trax/checklist\">\r\n <span class=\"menu-bullet\">\r\n </span>\r\n <span class=\"menu-title\">Checklist\r\n </span>\r\n </a>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n \r\n </div>\r\n \r\n</div>\r\n\r\n<div *ngIf=\"!clientData?.featureConfigs?.isNewDashboard || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\" routerLink=\"/manage/analyse/reports\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/manage/traffic\">REPORTS\r\n </span>\r\n \r\n </span>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango' || (gs.userAccess | async)?.userType === 'client'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/manage\">MANAGE\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_brands_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/brands\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/brands.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Brands\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_overview_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/summary\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/overview.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Summary\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_stores_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/stores\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/stores.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_tickets_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/tickets\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tickets.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_reports_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/reports\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/reports.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_users_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/client\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/users.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Users\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_audit_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/audit\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/audit.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Audit\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.settings_paymentSubscriptions_isView || (gs.userAccess | async)?.settings_activityLog_isView || (gs.userAccess | async)?.settings_brandDetails_isView || (gs.userAccess | async)?.settings_configuration_isView || (gs.userAccess | async)?.settings_contactDirectory_isView || (gs.userAccess | async)?.settings_documents_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/settings\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/settings.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Settings\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.manage_users_isView && (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users/tango\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/users.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Users\r\n </span>\r\n </a>\r\n </div>\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/billing\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/billing.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Billing\r\n </span>\r\n </a>\r\n </div> \r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here\">\r\n <span class=\"menu-link px-0\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/tickets\">MY WORKSPACE\r\n </span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/tickets/stores\">\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/stores.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Stores\r\n </span>\r\n </a>\r\n </div>\r\n \r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" [routerLink]=\"['/tickets/users']\" [queryParams]=\"{ type: 'installation' }\" >\r\n <span class=\"menu-bullet\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tickets.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tickets\r\n </span>\r\n </a>\r\n </div>\r\n \r\n </div>\r\n </div> -->\r\n\r\n\r\n\r\n\r\n\r\n <!-- Tango Traffic -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_isView && clientData?.featureConfigs?.isNewTraffic && ((gs.userAccess | async)?.userType !== 'tango') || (gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_traffic.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Traffic</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Tango Zone -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoZone_isView\" class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_zone.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\">Tango Zone</span>\r\n </a>\r\n </div> -->\r\n\r\n <!-- Tango Revop -->\r\n <!-- <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_revop.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Tango Revop\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Home\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Tagging\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Pending Action\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Customer Profile\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <!-- Control Center -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_controlCenter_isView\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/control_center.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Control Center\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Live & Playback\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Screen Manager\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Store Explore\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <!-- Tango SOP -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoSop_isView\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span class=\"menu-icon\">\r\n <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_sop.svg\" alt=\"\">\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/crafted/account\">Tango SOP\r\n </span>\r\n <span class=\"menu-arrow\"></span>\r\n </span>\r\n <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Dashboard\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Create & Manage\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Flag\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Reports\r\n </span>\r\n </a>\r\n </div>\r\n <div class=\"menu-item\">\r\n <a class=\"menu-link without-sub\" routerLinkActive=\"active\" (click)=\"oldDashborad()\">\r\n <span class=\"menu-bullet\">\r\n <span class=\"bullet bullet-dot\"></span>\r\n </span>\r\n <span class=\"menu-title\">Incidents\r\n </span>\r\n </a>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n", styles: [".menu-bullet-dot span{display:inline-block;width:6px;height:6px;background-color:#000;border-radius:50%;margin-right:10px;vertical-align:middle}:host::ng-deep .menu-sub .menu-sub-accordion{border-left:2px solid #98A2B3!important}::ng-deep .app-sidebar .menu .menu-item .menu-link.active .menu-title{color:#f5f5f5!important;border-radius:8px!important;border:1px solid var(--text-primary, #FFF)!important;padding:8px!important;color:var(--Primary-500, #33B5FF)!important;font-size:12px!important;font-style:normal;font-weight:600;line-height:18px}::ng-deep .app-sidebar .menu .menu-item .menu-link .menu-title{font-size:12px!important;font-style:normal;font-weight:600;line-height:18px}::ng-deep .app-sidebar .menu .menu-item .menu-link.active{transition:color .2s ease;background-color:#0d0e12!important}\n"] }]
|
|
7273
8616
|
}], ctorParameters: () => [{ type: AuthService }, { type: i1.GlobalStateService }, { type: i2.Router }] });
|
|
7274
8617
|
|
|
7275
8618
|
class SidebarFooterComponent {
|
|
@@ -7341,9 +8684,7 @@ class SidebarFooterComponent {
|
|
|
7341
8684
|
}
|
|
7342
8685
|
logout() {
|
|
7343
8686
|
this.auth.logout();
|
|
7344
|
-
// .pipe(takeUntil(this.destroy$)).subscribe((res:any)=>{
|
|
7345
8687
|
this.router.navigate(["/auth/login"]);
|
|
7346
|
-
// })
|
|
7347
8688
|
localStorage.clear();
|
|
7348
8689
|
this.pageInfo.setTitle('login');
|
|
7349
8690
|
}
|
|
@@ -9268,6 +10609,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
9268
10609
|
args: [{ selector: 'lib-storesingle', template: "<div class=\"wrapper\" >\r\n<lib-select [items]=\"storeList\" [multi]=\"false\" [searchField]=\"'storeName'\" [disabled]=\"false\" [idField]=\"'storeId'\"\r\n(selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n</div> ", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"] }]
|
|
9269
10610
|
}], ctorParameters: () => [{ type: AuthService }, { type: i1.GlobalStateService }, { type: i0.ChangeDetectorRef }, { type: i2.Router }] });
|
|
9270
10611
|
|
|
10612
|
+
class SingleClientstoreDateComponent {
|
|
10613
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SingleClientstoreDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10614
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SingleClientstoreDateComponent, selector: "lib-single-clientstore-date", ngImport: i0, template: "<p>single-clientstore-date works!</p>\r\n", styles: [""] });
|
|
10615
|
+
}
|
|
10616
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SingleClientstoreDateComponent, decorators: [{
|
|
10617
|
+
type: Component,
|
|
10618
|
+
args: [{ selector: 'lib-single-clientstore-date', template: "<p>single-clientstore-date works!</p>\r\n" }]
|
|
10619
|
+
}] });
|
|
10620
|
+
|
|
9271
10621
|
const routes$1 = [
|
|
9272
10622
|
{
|
|
9273
10623
|
path: '',
|
|
@@ -9309,7 +10659,9 @@ class LayoutModule {
|
|
|
9309
10659
|
SingleStoredateComponent,
|
|
9310
10660
|
StoresingleComponent,
|
|
9311
10661
|
TraxWithoutdateComponent,
|
|
9312
|
-
TrafficNobComponent
|
|
10662
|
+
TrafficNobComponent,
|
|
10663
|
+
MetricsHeaderComponent,
|
|
10664
|
+
SingleClientstoreDateComponent], imports: [CommonModule, i2.RouterModule, TranslationModule,
|
|
9313
10665
|
InlineSVGModule,
|
|
9314
10666
|
NgbDropdownModule,
|
|
9315
10667
|
NgbProgressbarModule,
|
|
@@ -9377,7 +10729,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
9377
10729
|
SingleStoredateComponent,
|
|
9378
10730
|
StoresingleComponent,
|
|
9379
10731
|
TraxWithoutdateComponent,
|
|
9380
|
-
TrafficNobComponent
|
|
10732
|
+
TrafficNobComponent,
|
|
10733
|
+
MetricsHeaderComponent,
|
|
10734
|
+
SingleClientstoreDateComponent
|
|
9381
10735
|
],
|
|
9382
10736
|
imports: [
|
|
9383
10737
|
CommonModule,
|
|
@@ -9577,28 +10931,131 @@ class HttpAuthInterceptor {
|
|
|
9577
10931
|
}
|
|
9578
10932
|
});
|
|
9579
10933
|
}
|
|
10934
|
+
// intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
|
|
10935
|
+
// const user: any = JSON.parse(localStorage.getItem(this.authlocalStorageToken) || '{}');
|
|
10936
|
+
// request = request.clone({
|
|
10937
|
+
// setHeaders: {
|
|
10938
|
+
// Authorization: 'Bearer ' + user.authenticationToken
|
|
10939
|
+
// }
|
|
10940
|
+
// });
|
|
10941
|
+
// return next.handle(request)
|
|
10942
|
+
// .pipe(tap((response:any)=>{
|
|
10943
|
+
// if(response?.body?.data?.result === 'RESTRICTED-IP'){
|
|
10944
|
+
// this.router.navigateByUrl('/error/403-ip')
|
|
10945
|
+
// }
|
|
10946
|
+
// }))
|
|
10947
|
+
// .pipe(
|
|
10948
|
+
// catchError((error:any)=>{
|
|
10949
|
+
// if (error instanceof HttpErrorResponse && error.status === 401) {
|
|
10950
|
+
// // If the error is due to unauthorized access, try to refresh the token
|
|
10951
|
+
// return this.handle401Error(request, next);
|
|
10952
|
+
// }
|
|
10953
|
+
// // else if (error instanceof HttpErrorResponse && error.status === 403) {
|
|
10954
|
+
// // // If the error is due to unauthorized access, try to refresh the token
|
|
10955
|
+
// // this.router.navigate(['/manage/brands'])
|
|
10956
|
+
// // }
|
|
10957
|
+
// return throwError(error);
|
|
10958
|
+
// })
|
|
10959
|
+
// );
|
|
10960
|
+
// }
|
|
10961
|
+
// private handle401Error(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
|
|
10962
|
+
// if (!this.isRefreshingToken) {
|
|
10963
|
+
// this.isRefreshingToken = true;
|
|
10964
|
+
// return this.authService.refreshToken().pipe(
|
|
10965
|
+
// switchMap((res: any) => {
|
|
10966
|
+
// if (res && res.code == 200 && res.data.result) {
|
|
10967
|
+
// // Update local storage with the new token
|
|
10968
|
+
// localStorage.setItem(this.authlocalStorageToken, JSON.stringify(res.data.result));
|
|
10969
|
+
// // Clone the request with the new token
|
|
10970
|
+
// request = request.clone({
|
|
10971
|
+
// setHeaders: {
|
|
10972
|
+
// Authorization: `Bearer ${res.data.result.authenticationToken}`
|
|
10973
|
+
// }
|
|
10974
|
+
// });
|
|
10975
|
+
// // Reset the flag for token refreshing
|
|
10976
|
+
// this.isRefreshingToken = false;
|
|
10977
|
+
// // Retry the original request with the new token
|
|
10978
|
+
// return next.handle(request);
|
|
10979
|
+
// } else {
|
|
10980
|
+
// // Logout user if refresh token fails
|
|
10981
|
+
// this.authService.logout();
|
|
10982
|
+
// const keysToKeep = ['data-mismatch-draft'];
|
|
10983
|
+
// const valuesToKeep:any = {};
|
|
10984
|
+
// keysToKeep.forEach(key => {
|
|
10985
|
+
// const value = localStorage.getItem(key);
|
|
10986
|
+
// if (value !== null) {
|
|
10987
|
+
// valuesToKeep[key] = value;
|
|
10988
|
+
// }
|
|
10989
|
+
// });
|
|
10990
|
+
// localStorage.clear();
|
|
10991
|
+
// Object.keys(valuesToKeep).forEach(key => {
|
|
10992
|
+
// localStorage.setItem(key, valuesToKeep[key]);
|
|
10993
|
+
// });
|
|
10994
|
+
// this.router.navigate(['/auth/login']);
|
|
10995
|
+
// return throwError('Token Expired Please Login Again!');
|
|
10996
|
+
// }
|
|
10997
|
+
// }),
|
|
10998
|
+
// catchError((error) => {
|
|
10999
|
+
// // Logout user if refresh token fails
|
|
11000
|
+
// this.authService.logout();
|
|
11001
|
+
// const keysToKeep = ['data-mismatch-draft'];
|
|
11002
|
+
// const valuesToKeep:any = {};
|
|
11003
|
+
// keysToKeep.forEach(key => {
|
|
11004
|
+
// const value = localStorage.getItem(key);
|
|
11005
|
+
// if (value !== null) {
|
|
11006
|
+
// valuesToKeep[key] = value;
|
|
11007
|
+
// }
|
|
11008
|
+
// });
|
|
11009
|
+
// localStorage.clear();
|
|
11010
|
+
// Object.keys(valuesToKeep).forEach(key => {
|
|
11011
|
+
// localStorage.setItem(key, valuesToKeep[key]);
|
|
11012
|
+
// });
|
|
11013
|
+
// this.router.navigate(['/auth/login']);
|
|
11014
|
+
// return throwError(error);
|
|
11015
|
+
// })
|
|
11016
|
+
// );
|
|
11017
|
+
// } else {
|
|
11018
|
+
// // If already refreshing the token, queue the request and wait
|
|
11019
|
+
// return this.tokenRefreshed.pipe(
|
|
11020
|
+
// switchMap(() => {
|
|
11021
|
+
// const tokens: any = JSON.parse(localStorage.getItem(this.authlocalStorageToken) || '{}');
|
|
11022
|
+
// request = request.clone({
|
|
11023
|
+
// setHeaders: {
|
|
11024
|
+
// Authorization: 'Bearer ' + tokens.authenticationToken
|
|
11025
|
+
// }
|
|
11026
|
+
// });
|
|
11027
|
+
// return next.handle(request);
|
|
11028
|
+
// })
|
|
11029
|
+
// );
|
|
11030
|
+
// }
|
|
11031
|
+
// }
|
|
9580
11032
|
intercept(request, next) {
|
|
9581
|
-
const
|
|
9582
|
-
|
|
9583
|
-
|
|
9584
|
-
|
|
11033
|
+
const tokenObjStr = this.authService.getCookie(this.authlocalStorageToken);
|
|
11034
|
+
let token = '';
|
|
11035
|
+
if (tokenObjStr) {
|
|
11036
|
+
try {
|
|
11037
|
+
const tokenObj = JSON.parse(tokenObjStr);
|
|
11038
|
+
token = tokenObj?.authenticationToken || '';
|
|
9585
11039
|
}
|
|
9586
|
-
|
|
9587
|
-
|
|
9588
|
-
|
|
11040
|
+
catch (e) {
|
|
11041
|
+
console.error('Invalid auth token format in cookie', e);
|
|
11042
|
+
}
|
|
11043
|
+
}
|
|
11044
|
+
if (token) {
|
|
11045
|
+
request = request.clone({
|
|
11046
|
+
setHeaders: {
|
|
11047
|
+
Authorization: 'Bearer ' + token,
|
|
11048
|
+
},
|
|
11049
|
+
});
|
|
11050
|
+
}
|
|
11051
|
+
return next.handle(request).pipe(tap((response) => {
|
|
9589
11052
|
if (response?.body?.data?.result === 'RESTRICTED-IP') {
|
|
9590
11053
|
this.router.navigateByUrl('/error/403-ip');
|
|
9591
11054
|
}
|
|
9592
|
-
}))
|
|
9593
|
-
.pipe(catchError((error) => {
|
|
11055
|
+
}), catchError((error) => {
|
|
9594
11056
|
if (error instanceof HttpErrorResponse && error.status === 401) {
|
|
9595
|
-
// If the error is due to unauthorized access, try to refresh the token
|
|
9596
11057
|
return this.handle401Error(request, next);
|
|
9597
11058
|
}
|
|
9598
|
-
// else if (error instanceof HttpErrorResponse && error.status === 403) {
|
|
9599
|
-
// // If the error is due to unauthorized access, try to refresh the token
|
|
9600
|
-
// this.router.navigate(['/manage/brands'])
|
|
9601
|
-
// }
|
|
9602
11059
|
return throwError(error);
|
|
9603
11060
|
}));
|
|
9604
11061
|
}
|
|
@@ -9606,70 +11063,44 @@ class HttpAuthInterceptor {
|
|
|
9606
11063
|
if (!this.isRefreshingToken) {
|
|
9607
11064
|
this.isRefreshingToken = true;
|
|
9608
11065
|
return this.authService.refreshToken().pipe(switchMap((res) => {
|
|
9609
|
-
if (res && res.code
|
|
9610
|
-
|
|
9611
|
-
|
|
9612
|
-
// Clone the request with the new token
|
|
11066
|
+
if (res && res.code === 200 && res.data?.result) {
|
|
11067
|
+
this.authService.setCookie(this.authlocalStorageToken, JSON.stringify(res.data.result), 1);
|
|
11068
|
+
const newToken = res.data.result.authenticationToken;
|
|
9613
11069
|
request = request.clone({
|
|
9614
11070
|
setHeaders: {
|
|
9615
|
-
Authorization:
|
|
9616
|
-
}
|
|
11071
|
+
Authorization: 'Bearer ' + newToken,
|
|
11072
|
+
},
|
|
9617
11073
|
});
|
|
9618
|
-
// Reset the flag for token refreshing
|
|
9619
11074
|
this.isRefreshingToken = false;
|
|
9620
|
-
// Retry the original request with the new token
|
|
9621
11075
|
return next.handle(request);
|
|
9622
11076
|
}
|
|
9623
11077
|
else {
|
|
9624
|
-
|
|
9625
|
-
|
|
9626
|
-
|
|
9627
|
-
const valuesToKeep = {};
|
|
9628
|
-
keysToKeep.forEach(key => {
|
|
9629
|
-
const value = localStorage.getItem(key);
|
|
9630
|
-
if (value !== null) {
|
|
9631
|
-
valuesToKeep[key] = value;
|
|
9632
|
-
}
|
|
9633
|
-
});
|
|
9634
|
-
localStorage.clear();
|
|
9635
|
-
Object.keys(valuesToKeep).forEach(key => {
|
|
9636
|
-
localStorage.setItem(key, valuesToKeep[key]);
|
|
9637
|
-
});
|
|
9638
|
-
this.router.navigate(['/auth/login']);
|
|
9639
|
-
return throwError('Token Expired Please Login Again!');
|
|
9640
|
-
}
|
|
9641
|
-
}), catchError((error) => {
|
|
9642
|
-
// Logout user if refresh token fails
|
|
9643
|
-
this.authService.logout();
|
|
9644
|
-
const keysToKeep = ['data-mismatch-draft'];
|
|
9645
|
-
const valuesToKeep = {};
|
|
9646
|
-
keysToKeep.forEach(key => {
|
|
9647
|
-
const value = localStorage.getItem(key);
|
|
9648
|
-
if (value !== null) {
|
|
9649
|
-
valuesToKeep[key] = value;
|
|
9650
|
-
}
|
|
9651
|
-
});
|
|
9652
|
-
localStorage.clear();
|
|
9653
|
-
Object.keys(valuesToKeep).forEach(key => {
|
|
9654
|
-
localStorage.setItem(key, valuesToKeep[key]);
|
|
9655
|
-
});
|
|
9656
|
-
this.router.navigate(['/auth/login']);
|
|
9657
|
-
return throwError(error);
|
|
9658
|
-
}));
|
|
11078
|
+
return this.forceLogout('Token Expired. Please login again.');
|
|
11079
|
+
}
|
|
11080
|
+
}), catchError((err) => this.forceLogout(err)));
|
|
9659
11081
|
}
|
|
9660
11082
|
else {
|
|
9661
|
-
//
|
|
9662
|
-
return
|
|
9663
|
-
const tokens = JSON.parse(localStorage.getItem(this.authlocalStorageToken) || '{}');
|
|
9664
|
-
request = request.clone({
|
|
9665
|
-
setHeaders: {
|
|
9666
|
-
Authorization: 'Bearer ' + tokens.authenticationToken
|
|
9667
|
-
}
|
|
9668
|
-
});
|
|
9669
|
-
return next.handle(request);
|
|
9670
|
-
}));
|
|
11083
|
+
// Optional: implement logic to queue and retry if multiple requests during refresh
|
|
11084
|
+
return throwError('Token refresh already in progress');
|
|
9671
11085
|
}
|
|
9672
11086
|
}
|
|
11087
|
+
forceLogout(message) {
|
|
11088
|
+
this.authService.logout();
|
|
11089
|
+
const keysToKeep = ['data-mismatch-draft'];
|
|
11090
|
+
const valuesToKeep = {};
|
|
11091
|
+
keysToKeep.forEach((key) => {
|
|
11092
|
+
const val = localStorage.getItem(key);
|
|
11093
|
+
if (val)
|
|
11094
|
+
valuesToKeep[key] = val;
|
|
11095
|
+
});
|
|
11096
|
+
localStorage.clear();
|
|
11097
|
+
// Object.entries(valuesToKeep).forEach(([k, v]) => {
|
|
11098
|
+
// return localStorage.setItem(k, v);
|
|
11099
|
+
// });
|
|
11100
|
+
this.authService.deleteCookie(this.authlocalStorageToken);
|
|
11101
|
+
this.router.navigate(['/auth/login']);
|
|
11102
|
+
return throwError(() => message);
|
|
11103
|
+
}
|
|
9673
11104
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: HttpAuthInterceptor, deps: [{ token: i1.GlobalStateService }, { token: AuthService }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
9674
11105
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: HttpAuthInterceptor });
|
|
9675
11106
|
}
|