tango-app-ui-shared 3.3.0-beta.6 → 3.3.0-beta.8
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/modules/common/filters/filters.component.mjs +3 -3
- package/esm2022/lib/modules/layout/layout.module.mjs +5 -2
- package/esm2022/lib/modules/layout/sidebar/sidebar-menu/sidebar-menu.component.mjs +3 -3
- package/esm2022/lib/modules/layout/toolbar/date-single-select/date-single-select.component.mjs +3 -3
- package/esm2022/lib/modules/layout/toolbar/datepicker/datepicker.component.mjs +3 -3
- package/esm2022/lib/modules/layout/toolbar/single-store/single-store.component.mjs +3 -3
- package/esm2022/lib/modules/layout/toolbar/toolbar.component.mjs +24 -15
- package/esm2022/lib/modules/layout/toolbar/traffic-header/traffic-header/traffic-header.component.mjs +533 -0
- package/esm2022/lib/services/auth.service.mjs +12 -1
- package/fesm2022/tango-app-ui-shared.mjs +569 -25
- package/fesm2022/tango-app-ui-shared.mjs.map +1 -1
- package/lib/modules/layout/layout.module.d.ts +11 -10
- package/lib/modules/layout/toolbar/toolbar.component.d.ts +2 -1
- package/lib/modules/layout/toolbar/traffic-header/traffic-header/traffic-header.component.d.ts +66 -0
- package/lib/services/auth.service.d.ts +4 -0
- package/package.json +1 -1
|
@@ -41,6 +41,7 @@ class AuthService {
|
|
|
41
41
|
billingApiUrl;
|
|
42
42
|
oldDashboardUrl;
|
|
43
43
|
dropDownTrigger = new BehaviorSubject(null);
|
|
44
|
+
trafficApiUrl;
|
|
44
45
|
constructor(router, gs, http) {
|
|
45
46
|
this.router = router;
|
|
46
47
|
this.gs = gs;
|
|
@@ -53,6 +54,7 @@ class AuthService {
|
|
|
53
54
|
this.oldDashboardUrl = env.oldDashboardUrl;
|
|
54
55
|
this.authlocalStorageToken = `${env.appVersion}-${env.USERDATA_KEY}`;
|
|
55
56
|
this.billingApiUrl = env.billingApiUrl;
|
|
57
|
+
this.trafficApiUrl = env.trafficApiUrl;
|
|
56
58
|
}
|
|
57
59
|
});
|
|
58
60
|
}
|
|
@@ -120,6 +122,15 @@ class AuthService {
|
|
|
120
122
|
getClientProducts(clientId) {
|
|
121
123
|
return this.http.get(`${this.billingApiUrl}/getClientProducts/${clientId}`);
|
|
122
124
|
}
|
|
125
|
+
getLocation(data) {
|
|
126
|
+
return this.http.post(`${this.trafficApiUrl}/headerLocations_v1`, data);
|
|
127
|
+
}
|
|
128
|
+
getGroups(data) {
|
|
129
|
+
return this.http.post(`${this.trafficApiUrl}/headerGroups_v1`, data);
|
|
130
|
+
}
|
|
131
|
+
getHeaderStores(data) {
|
|
132
|
+
return this.http.post(`${this.trafficApiUrl}/headerStores_v1`, data);
|
|
133
|
+
}
|
|
123
134
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuthService, deps: [{ token: i1.Router }, { token: i1$1.GlobalStateService }, { token: i3.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
124
135
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuthService, providedIn: 'root' });
|
|
125
136
|
}
|
|
@@ -2815,11 +2826,11 @@ class DatepickerComponent {
|
|
|
2815
2826
|
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
2816
2827
|
}
|
|
2817
2828
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DatepickerComponent, deps: [{ token: i1$1.LayoutService }, { token: i1$1.GlobalStateService }, { token: AuthService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2818
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DatepickerComponent, selector: "lib-datepicker", ngImport: i0, template: "<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 ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [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\" />\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:
|
|
2829
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DatepickerComponent, selector: "lib-datepicker", ngImport: i0, template: "<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 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>", 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}\n"], dependencies: [{ kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.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"] }] });
|
|
2819
2830
|
}
|
|
2820
2831
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DatepickerComponent, decorators: [{
|
|
2821
2832
|
type: Component,
|
|
2822
|
-
args: [{ selector: "lib-datepicker", template: "<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 ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [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\" />\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:
|
|
2833
|
+
args: [{ selector: "lib-datepicker", template: "<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 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>", 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}\n"] }]
|
|
2823
2834
|
}], ctorParameters: () => [{ type: i1$1.LayoutService }, { type: i1$1.GlobalStateService }, { type: AuthService }, { type: i0.ChangeDetectorRef }] });
|
|
2824
2835
|
|
|
2825
2836
|
class DateSingleSelectComponent {
|
|
@@ -2980,11 +2991,11 @@ class DateSingleSelectComponent {
|
|
|
2980
2991
|
this.gs.manageRefreshTrigger.next(true);
|
|
2981
2992
|
}
|
|
2982
2993
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DateSingleSelectComponent, deps: [{ token: AuthService }, { token: i1$1.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2983
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DateSingleSelectComponent, selector: "lib-date-single-select", ngImport: i0, template: "<div class=\"wrapper mx-2\" >\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\r\n \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 ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [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\" />\r\n</div>\r\n\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\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:
|
|
2994
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DateSingleSelectComponent, selector: "lib-date-single-select", ngImport: i0, template: "<div class=\"wrapper mx-2\" >\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\r\n \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 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\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\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: "component", type: CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.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"] }] });
|
|
2984
2995
|
}
|
|
2985
2996
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DateSingleSelectComponent, decorators: [{
|
|
2986
2997
|
type: Component,
|
|
2987
|
-
args: [{ selector: "lib-date-single-select", template: "<div class=\"wrapper mx-2\" >\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\r\n \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 ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [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\" />\r\n</div>\r\n\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\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:
|
|
2998
|
+
args: [{ selector: "lib-date-single-select", template: "<div class=\"wrapper mx-2\" >\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\r\n \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 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\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\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"] }]
|
|
2988
2999
|
}], ctorParameters: () => [{ type: AuthService }, { type: i1$1.GlobalStateService }, { type: i0.ChangeDetectorRef }] });
|
|
2989
3000
|
|
|
2990
3001
|
class SingleStoreComponent {
|
|
@@ -3115,13 +3126,536 @@ class SingleStoreComponent {
|
|
|
3115
3126
|
localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
|
|
3116
3127
|
}
|
|
3117
3128
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SingleStoreComponent, deps: [{ token: AuthService }, { token: i1$1.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3118
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SingleStoreComponent, selector: "lib-single-store", ngImport: i0, template: "<div 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\r\n \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 ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [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\" />\r\n</div>\r\n\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\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:
|
|
3129
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SingleStoreComponent, selector: "lib-single-store", ngImport: i0, template: "<div 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\r\n \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 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\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\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: "component", type: CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.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"] }] });
|
|
3119
3130
|
}
|
|
3120
3131
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SingleStoreComponent, decorators: [{
|
|
3121
3132
|
type: Component,
|
|
3122
|
-
args: [{ selector: 'lib-single-store', template: "<div 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\r\n \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 ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [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\" />\r\n</div>\r\n\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\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:
|
|
3133
|
+
args: [{ selector: 'lib-single-store', template: "<div 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\r\n \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 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\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\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"] }]
|
|
3123
3134
|
}], ctorParameters: () => [{ type: AuthService }, { type: i1$1.GlobalStateService }, { type: i0.ChangeDetectorRef }] });
|
|
3124
3135
|
|
|
3136
|
+
class TrafficHeaderComponent {
|
|
3137
|
+
auth;
|
|
3138
|
+
gs;
|
|
3139
|
+
cd;
|
|
3140
|
+
dayjs = dayjs;
|
|
3141
|
+
isCustomDate = (m) => {
|
|
3142
|
+
const isValidDate = m > this.dayjs();
|
|
3143
|
+
return isValidDate ? "invalid-date" : false;
|
|
3144
|
+
};
|
|
3145
|
+
selectedDateRange = {};
|
|
3146
|
+
selectedFilters = {
|
|
3147
|
+
client: null,
|
|
3148
|
+
clientName: null,
|
|
3149
|
+
clients: [],
|
|
3150
|
+
store: null,
|
|
3151
|
+
stores: [],
|
|
3152
|
+
date: null,
|
|
3153
|
+
group: [],
|
|
3154
|
+
location: [],
|
|
3155
|
+
};
|
|
3156
|
+
Opendropdown = false;
|
|
3157
|
+
dropdownOpen = null; // 'location' or 'group'
|
|
3158
|
+
searchLocationText = "";
|
|
3159
|
+
searchGroupText = "";
|
|
3160
|
+
locations = [];
|
|
3161
|
+
filteredLocations = [];
|
|
3162
|
+
groupsData = [];
|
|
3163
|
+
filteredGroups = [];
|
|
3164
|
+
filteredStores = [];
|
|
3165
|
+
stores = [];
|
|
3166
|
+
searchStoreText = '';
|
|
3167
|
+
clientList = [];
|
|
3168
|
+
selectedClient;
|
|
3169
|
+
constructor(auth, gs, cd) {
|
|
3170
|
+
this.auth = auth;
|
|
3171
|
+
this.gs = gs;
|
|
3172
|
+
this.cd = cd;
|
|
3173
|
+
}
|
|
3174
|
+
onClick(event) {
|
|
3175
|
+
const target = event.target;
|
|
3176
|
+
if (!target.closest('.dropdown1')) {
|
|
3177
|
+
this.Opendropdown = false;
|
|
3178
|
+
}
|
|
3179
|
+
}
|
|
3180
|
+
closeDropdown1() {
|
|
3181
|
+
this.Opendropdown = false;
|
|
3182
|
+
}
|
|
3183
|
+
ngOnInit() {
|
|
3184
|
+
const user = JSON.parse(localStorage.getItem('user-info'));
|
|
3185
|
+
if (user.userType === 'tango')
|
|
3186
|
+
this.getClient();
|
|
3187
|
+
// Load filters from localStorage if they exist
|
|
3188
|
+
if ("header-filters" in localStorage) {
|
|
3189
|
+
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
3190
|
+
// Load and set selected filters from localStorage
|
|
3191
|
+
this.selectedFilters.client = headerFilters.client;
|
|
3192
|
+
this.selectedFilters.clientName = headerFilters.clientName;
|
|
3193
|
+
this.selectedFilters.clients = headerFilters.clients;
|
|
3194
|
+
this.selectedFilters.store = headerFilters.store;
|
|
3195
|
+
this.selectedFilters.date = headerFilters.date;
|
|
3196
|
+
this.selectedFilters.stores = headerFilters.stores;
|
|
3197
|
+
this.selectedFilters.group = headerFilters.group;
|
|
3198
|
+
this.selectedFilters.location = headerFilters.location;
|
|
3199
|
+
this.getLocations();
|
|
3200
|
+
this.getStore();
|
|
3201
|
+
// Sync selected locations, groups, and stores with filtered data
|
|
3202
|
+
this.filteredLocations = headerFilters.location
|
|
3203
|
+
? headerFilters.location.map((item) => ({ ...item, checked: item.checked === true }))
|
|
3204
|
+
: [];
|
|
3205
|
+
this.filteredGroups = headerFilters.group
|
|
3206
|
+
? headerFilters.group.map((item) => ({ ...item, checked: item.checked === true }))
|
|
3207
|
+
: [];
|
|
3208
|
+
this.filteredStores = headerFilters.stores
|
|
3209
|
+
? headerFilters.stores.map((item) => ({ ...item, checked: item.checked === true }))
|
|
3210
|
+
: [];
|
|
3211
|
+
// Format date range
|
|
3212
|
+
if (headerFilters.date) {
|
|
3213
|
+
this.selectedDateRange = {
|
|
3214
|
+
startDate: this.dayjs(headerFilters.date.startDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
3215
|
+
endDate: this.dayjs(headerFilters.date.endDate, "YYYY-MM-DD").format("DD-MM-YYYY"),
|
|
3216
|
+
};
|
|
3217
|
+
}
|
|
3218
|
+
// Update localStorage with current selectedFilters
|
|
3219
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
3220
|
+
// Emit data via service
|
|
3221
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
3222
|
+
}
|
|
3223
|
+
}
|
|
3224
|
+
getClient() {
|
|
3225
|
+
this.auth.getClients().subscribe({
|
|
3226
|
+
next: (e) => {
|
|
3227
|
+
if (e) {
|
|
3228
|
+
this.clientList = e.data.result;
|
|
3229
|
+
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
3230
|
+
if (headerFilters.client) {
|
|
3231
|
+
this.clientList.find((obj) => {
|
|
3232
|
+
if (obj.clientId === headerFilters.client) {
|
|
3233
|
+
this.selectedClient = obj;
|
|
3234
|
+
}
|
|
3235
|
+
});
|
|
3236
|
+
this.selectedFilters.client = headerFilters.client;
|
|
3237
|
+
this.selectedFilters.clientName = headerFilters.clientName;
|
|
3238
|
+
this.selectedFilters.clients = headerFilters.clients;
|
|
3239
|
+
this.selectedFilters.store = headerFilters.store;
|
|
3240
|
+
this.selectedFilters.date = headerFilters.date;
|
|
3241
|
+
this.selectedFilters.stores = headerFilters.stores;
|
|
3242
|
+
this.selectedFilters.group = headerFilters.group;
|
|
3243
|
+
this.selectedFilters.location = headerFilters.location;
|
|
3244
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
3245
|
+
}
|
|
3246
|
+
else {
|
|
3247
|
+
this.selectedClient = this.clientList[0];
|
|
3248
|
+
this.selectedFilters.client = this.selectedClient.clientId;
|
|
3249
|
+
this.selectedFilters.clientName = this.selectedClient.clientName;
|
|
3250
|
+
this.selectedFilters.clients = headerFilters.clients;
|
|
3251
|
+
this.selectedFilters.store = headerFilters.store;
|
|
3252
|
+
this.selectedFilters.date = headerFilters.date;
|
|
3253
|
+
this.selectedFilters.stores = headerFilters.stores;
|
|
3254
|
+
this.selectedFilters.group = headerFilters.group;
|
|
3255
|
+
this.selectedFilters.location = headerFilters.location;
|
|
3256
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
3257
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
3258
|
+
this.cd.detectChanges();
|
|
3259
|
+
}
|
|
3260
|
+
}
|
|
3261
|
+
else {
|
|
3262
|
+
this.selectedClient = this.clientList[0];
|
|
3263
|
+
this.selectedFilters.client = this.selectedClient.clientId;
|
|
3264
|
+
this.selectedFilters.clientName = this.selectedClient.clientName;
|
|
3265
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
3266
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
3267
|
+
this.cd.detectChanges();
|
|
3268
|
+
}
|
|
3269
|
+
},
|
|
3270
|
+
});
|
|
3271
|
+
}
|
|
3272
|
+
onClientSelect(event) {
|
|
3273
|
+
this.selectedClient = event;
|
|
3274
|
+
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
3275
|
+
this.selectedFilters = headerFilters;
|
|
3276
|
+
this.selectedFilters.client = this.selectedClient.clientId;
|
|
3277
|
+
this.selectedFilters.clientName = this.selectedClient.clientName;
|
|
3278
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
3279
|
+
localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
|
|
3280
|
+
this.cd.detectChanges();
|
|
3281
|
+
}
|
|
3282
|
+
ranges = {
|
|
3283
|
+
Today: [this.dayjs(), this.dayjs()],
|
|
3284
|
+
Yesterday: [
|
|
3285
|
+
this.dayjs().subtract(1, "days"),
|
|
3286
|
+
this.dayjs().subtract(1, "days"),
|
|
3287
|
+
],
|
|
3288
|
+
"This Week": [this.dayjs().subtract(6, "days"), this.dayjs()],
|
|
3289
|
+
"Last Week": [
|
|
3290
|
+
this.dayjs().subtract(14, "days").startOf("days"),
|
|
3291
|
+
this.dayjs().subtract(8, "days").endOf("days"),
|
|
3292
|
+
],
|
|
3293
|
+
"This Month": [this.dayjs().startOf("month"), this.dayjs().endOf("month")],
|
|
3294
|
+
"Last Month": [
|
|
3295
|
+
this.dayjs().subtract(1, "month").startOf("month"),
|
|
3296
|
+
this.dayjs().subtract(1, "month").endOf("month"),
|
|
3297
|
+
],
|
|
3298
|
+
};
|
|
3299
|
+
onStartDateChange(event) {
|
|
3300
|
+
if (this.dayjs(event.startDate).isValid()) {
|
|
3301
|
+
this.isCustomDate = (m) => {
|
|
3302
|
+
const isValidDate = m > this.dayjs() || m > this.dayjs(event.startDate.add(90, "days"));
|
|
3303
|
+
return isValidDate ? "invalid-date" : false;
|
|
3304
|
+
};
|
|
3305
|
+
}
|
|
3306
|
+
}
|
|
3307
|
+
datechange(event) {
|
|
3308
|
+
if (event && event.startDate && event.endDate) {
|
|
3309
|
+
if (this.dayjs(event.startDate).isValid() &&
|
|
3310
|
+
this.dayjs(event.endDate).isValid()) {
|
|
3311
|
+
this.selectedDateRange.startDate = event.startDate;
|
|
3312
|
+
this.selectedDateRange.endDate = event.endDate;
|
|
3313
|
+
var datetime = {
|
|
3314
|
+
startDate: this.dayjs(event.startDate, "DD-MM-YYYY").format("YYYY-MM-DD"),
|
|
3315
|
+
endDate: this.dayjs(event.endDate, "DD-MM-YYYY").format("YYYY-MM-DD"),
|
|
3316
|
+
};
|
|
3317
|
+
this.selectedFilters.date = datetime;
|
|
3318
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
3319
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
3320
|
+
}
|
|
3321
|
+
}
|
|
3322
|
+
}
|
|
3323
|
+
opendropdown(e) {
|
|
3324
|
+
e.stopPropagation();
|
|
3325
|
+
this.Opendropdown = !this.Opendropdown;
|
|
3326
|
+
}
|
|
3327
|
+
getLocations() {
|
|
3328
|
+
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
3329
|
+
let obj = {
|
|
3330
|
+
clientId: headerFilters.client,
|
|
3331
|
+
city: [],
|
|
3332
|
+
group: [],
|
|
3333
|
+
};
|
|
3334
|
+
this.auth.getLocation(obj).subscribe({
|
|
3335
|
+
next: (res) => {
|
|
3336
|
+
// Map the fetched locations with default unchecked state
|
|
3337
|
+
this.locations = res.data.locationData.map((city) => ({
|
|
3338
|
+
city: city.city,
|
|
3339
|
+
checked: false,
|
|
3340
|
+
}));
|
|
3341
|
+
// Sync the fetched locations with any stored checked values in localStorage
|
|
3342
|
+
if (this.selectedFilters.location && Array.isArray(this.selectedFilters.location)) {
|
|
3343
|
+
this.filteredLocations = this.locations.map(location => {
|
|
3344
|
+
const matchedLocation = this.selectedFilters.location.find((loc) => loc.city === location.city);
|
|
3345
|
+
return matchedLocation ? { ...location, checked: matchedLocation.checked } : location;
|
|
3346
|
+
});
|
|
3347
|
+
}
|
|
3348
|
+
else {
|
|
3349
|
+
this.filteredLocations = this.locations;
|
|
3350
|
+
}
|
|
3351
|
+
},
|
|
3352
|
+
error: (err) => {
|
|
3353
|
+
console.error("Failed to fetch locations", err);
|
|
3354
|
+
},
|
|
3355
|
+
});
|
|
3356
|
+
}
|
|
3357
|
+
isAllLocationsSelected() {
|
|
3358
|
+
return this.filteredLocations.every(location => location.checked);
|
|
3359
|
+
}
|
|
3360
|
+
selectedLocationsLabel() {
|
|
3361
|
+
const selectedLocations = this.filteredLocations
|
|
3362
|
+
.filter(location => location.checked)
|
|
3363
|
+
.map(location => location.city);
|
|
3364
|
+
return selectedLocations.length === 0
|
|
3365
|
+
? ''
|
|
3366
|
+
: selectedLocations.length === 1
|
|
3367
|
+
? selectedLocations[0]
|
|
3368
|
+
: `${selectedLocations.length} locations selected`;
|
|
3369
|
+
}
|
|
3370
|
+
getGroups(cities) {
|
|
3371
|
+
const obj = { city: cities, clientId: this.selectedFilters.client, group: [] };
|
|
3372
|
+
this.auth.getGroups(obj).subscribe({
|
|
3373
|
+
next: (res) => {
|
|
3374
|
+
let checkedGroup = this.filteredGroups.filter((group) => group.checked).map((group) => group.groupName);
|
|
3375
|
+
const combinedGroups = res.data.groupData.map((groupName) => ({
|
|
3376
|
+
groupName: groupName.groupName,
|
|
3377
|
+
checked: checkedGroup.includes(groupName.groupName) ? true : false,
|
|
3378
|
+
}));
|
|
3379
|
+
this.groupsData = combinedGroups;
|
|
3380
|
+
this.filteredGroups = combinedGroups;
|
|
3381
|
+
// Auto-fetch stores when groups are selected
|
|
3382
|
+
const selectedGroups = this.filteredGroups.filter((group) => group.checked).map((group) => group.groupName);
|
|
3383
|
+
if (selectedGroups.length > 0) {
|
|
3384
|
+
this.getStore(); // Fetch stores based on selected groups
|
|
3385
|
+
}
|
|
3386
|
+
},
|
|
3387
|
+
error: (err) => {
|
|
3388
|
+
console.error("Failed to fetch groups", err);
|
|
3389
|
+
},
|
|
3390
|
+
});
|
|
3391
|
+
}
|
|
3392
|
+
toggleDropdown(type) {
|
|
3393
|
+
if (this.dropdownOpen === type) {
|
|
3394
|
+
this.dropdownOpen = null;
|
|
3395
|
+
if (type === 'group') {
|
|
3396
|
+
this.resetSelectedGroups();
|
|
3397
|
+
}
|
|
3398
|
+
if (type === 'store') {
|
|
3399
|
+
this.resetSelectedStores();
|
|
3400
|
+
}
|
|
3401
|
+
}
|
|
3402
|
+
else {
|
|
3403
|
+
this.dropdownOpen = type;
|
|
3404
|
+
if (type === 'group') {
|
|
3405
|
+
const selectedCities = this.filteredLocations
|
|
3406
|
+
.filter((location) => location.checked)
|
|
3407
|
+
.map((location) => location.city);
|
|
3408
|
+
if (selectedCities.length > 0) {
|
|
3409
|
+
if (!this.searchGroupText.trim().length) {
|
|
3410
|
+
this.getGroups(selectedCities);
|
|
3411
|
+
}
|
|
3412
|
+
}
|
|
3413
|
+
}
|
|
3414
|
+
if (type == 'store') {
|
|
3415
|
+
if (!this.searchStoreText.trim().length) {
|
|
3416
|
+
this.getStore();
|
|
3417
|
+
}
|
|
3418
|
+
}
|
|
3419
|
+
}
|
|
3420
|
+
}
|
|
3421
|
+
handleGroupDropdownClick() {
|
|
3422
|
+
if (this.dropdownOpen === 'group') {
|
|
3423
|
+
this.resetSelectedGroups();
|
|
3424
|
+
}
|
|
3425
|
+
this.toggleDropdown('group');
|
|
3426
|
+
}
|
|
3427
|
+
resetSelectedGroups() {
|
|
3428
|
+
this.filteredGroups.forEach((group) => (group.checked = false));
|
|
3429
|
+
this.searchGroupText = "";
|
|
3430
|
+
}
|
|
3431
|
+
selectedGroupsLabel() {
|
|
3432
|
+
const selectedGroups = this.filteredGroups.filter((group) => group.checked);
|
|
3433
|
+
return selectedGroups.length === 0
|
|
3434
|
+
? "No groups selected"
|
|
3435
|
+
: selectedGroups.length === 1
|
|
3436
|
+
? selectedGroups[0].groupName
|
|
3437
|
+
: `${selectedGroups.length} groups selected`;
|
|
3438
|
+
}
|
|
3439
|
+
isAllGroupsSelected() {
|
|
3440
|
+
return this.filteredGroups.length ? this.filteredGroups.every((group) => group.checked) : false;
|
|
3441
|
+
}
|
|
3442
|
+
getStore() {
|
|
3443
|
+
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
3444
|
+
const city = this.filteredLocations
|
|
3445
|
+
.filter(location => location.checked)
|
|
3446
|
+
.map(location => location.city);
|
|
3447
|
+
const group = this.filteredGroups
|
|
3448
|
+
.filter(group => group.checked)
|
|
3449
|
+
.map(group => group.groupName);
|
|
3450
|
+
const data = { city, group, clientId: headerFilters.client };
|
|
3451
|
+
this.auth.getHeaderStores(data).subscribe({
|
|
3452
|
+
next: (res) => {
|
|
3453
|
+
const checkedStoreIds = this.filteredStores
|
|
3454
|
+
.filter(store => store.checked)
|
|
3455
|
+
.map(store => store.storeId);
|
|
3456
|
+
this.stores = res.data.storesData;
|
|
3457
|
+
this.filteredStores = this.stores.map((item) => ({
|
|
3458
|
+
...item,
|
|
3459
|
+
checked: checkedStoreIds.length ? checkedStoreIds.includes(item.storeId) : false
|
|
3460
|
+
}));
|
|
3461
|
+
// if(!city.length && !group.length){
|
|
3462
|
+
// this.selectedFilters.stores = this.filteredStores.map((item) => ({
|
|
3463
|
+
// ...item,
|
|
3464
|
+
// checked: true}));
|
|
3465
|
+
// localStorage.setItem(
|
|
3466
|
+
// "header-filters",
|
|
3467
|
+
// JSON.stringify(this.selectedFilters)
|
|
3468
|
+
// );
|
|
3469
|
+
// this.gs.dataRangeValue.next(this.selectedFilters);
|
|
3470
|
+
// }
|
|
3471
|
+
// Ensure selected stores are reflected
|
|
3472
|
+
this.stores.forEach(store => {
|
|
3473
|
+
const storedStore = this.selectedFilters.stores.find((s) => s.storeId === store.storeId);
|
|
3474
|
+
if (storedStore) {
|
|
3475
|
+
store.checked = storedStore.checked;
|
|
3476
|
+
}
|
|
3477
|
+
});
|
|
3478
|
+
},
|
|
3479
|
+
error: (err) => {
|
|
3480
|
+
console.error("Failed to fetch stores", err);
|
|
3481
|
+
},
|
|
3482
|
+
});
|
|
3483
|
+
}
|
|
3484
|
+
resetSelectedStores() {
|
|
3485
|
+
this.filteredStores.forEach((store) => (store.checked = false));
|
|
3486
|
+
this.searchStoreText = "";
|
|
3487
|
+
}
|
|
3488
|
+
selectedStoresLabel() {
|
|
3489
|
+
const selectedStores = this.filteredStores.filter((store) => store.checked);
|
|
3490
|
+
return selectedStores.length === 0
|
|
3491
|
+
? "No Stores selected"
|
|
3492
|
+
: selectedStores.length === 1
|
|
3493
|
+
? selectedStores[0].storeName
|
|
3494
|
+
: `${selectedStores.length} Stores selected`;
|
|
3495
|
+
}
|
|
3496
|
+
isAllStoresSelected() {
|
|
3497
|
+
return this.filteredStores.length > 0 && this.filteredStores.every(store => store.checked);
|
|
3498
|
+
}
|
|
3499
|
+
// Method to handle dropdown item selection
|
|
3500
|
+
updateSelectedStores() {
|
|
3501
|
+
// Update logic for store selection
|
|
3502
|
+
// Ensure this logic does not reset the store values unintentionally
|
|
3503
|
+
this.selectedFilters.stores = this.filteredStores.filter(store => store.checked);
|
|
3504
|
+
localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
|
|
3505
|
+
}
|
|
3506
|
+
toggleSelectAllLocations(event) {
|
|
3507
|
+
const isChecked = event.target.checked;
|
|
3508
|
+
this.filteredLocations.forEach((location) => (location.checked = isChecked));
|
|
3509
|
+
this.updateSelectedLocations();
|
|
3510
|
+
}
|
|
3511
|
+
toggleSelectAllStores(event) {
|
|
3512
|
+
const checked = event.target.checked;
|
|
3513
|
+
this.filteredStores.forEach(store => store.checked = checked);
|
|
3514
|
+
this.updateSelectedStores();
|
|
3515
|
+
}
|
|
3516
|
+
updateSelectedLocations() {
|
|
3517
|
+
// When locations are selected, fetch the related groups
|
|
3518
|
+
const selectedCities = this.filteredLocations
|
|
3519
|
+
.filter((location) => location.checked)
|
|
3520
|
+
.map((location) => location.city);
|
|
3521
|
+
if (selectedCities.length > 0) {
|
|
3522
|
+
this.getGroups(selectedCities); // Fetch groups based on selected cities
|
|
3523
|
+
}
|
|
3524
|
+
else {
|
|
3525
|
+
this.filteredGroups = []; // Clear groups if no locations are selected
|
|
3526
|
+
}
|
|
3527
|
+
this.filteredStores = []; // Reset stores as well
|
|
3528
|
+
this.searchGroupText = '';
|
|
3529
|
+
this.searchStoreText = '';
|
|
3530
|
+
}
|
|
3531
|
+
toggleSelectAllGroups(event) {
|
|
3532
|
+
const isChecked = event.target.checked;
|
|
3533
|
+
this.filteredGroups.forEach((group) => (group.checked = isChecked));
|
|
3534
|
+
this.updateSelectedGroups();
|
|
3535
|
+
}
|
|
3536
|
+
updateSelectedGroups() {
|
|
3537
|
+
// Fetch the relevant stores after groups are selected
|
|
3538
|
+
const selectedGroups = this.filteredGroups
|
|
3539
|
+
.filter((group) => group.checked)
|
|
3540
|
+
.map((group) => group.groupName);
|
|
3541
|
+
if (selectedGroups.length > 0) {
|
|
3542
|
+
this.getStore(); // Fetch stores based on selected groups
|
|
3543
|
+
}
|
|
3544
|
+
else {
|
|
3545
|
+
this.filteredStores = []; // Clear stores if no groups are selected
|
|
3546
|
+
}
|
|
3547
|
+
this.searchStoreText = '';
|
|
3548
|
+
}
|
|
3549
|
+
Reset() {
|
|
3550
|
+
// Clear groups and stores
|
|
3551
|
+
this.filteredGroups = [];
|
|
3552
|
+
this.filteredStores = [];
|
|
3553
|
+
// Reset locations and checkboxes
|
|
3554
|
+
this.filteredLocations.forEach(location => location.checked = false);
|
|
3555
|
+
this.searchLocationText = "";
|
|
3556
|
+
this.searchGroupText = "";
|
|
3557
|
+
this.searchStoreText = "";
|
|
3558
|
+
this.groupsData.forEach(group => group.checked = false);
|
|
3559
|
+
// Update stores based on conditions
|
|
3560
|
+
if (this.filteredLocations.every(location => !location.checked) &&
|
|
3561
|
+
this.filteredGroups.every(group => !group.checked)) {
|
|
3562
|
+
this.filteredStores = this.stores.map(store => ({
|
|
3563
|
+
...store,
|
|
3564
|
+
checked: true
|
|
3565
|
+
}));
|
|
3566
|
+
}
|
|
3567
|
+
else {
|
|
3568
|
+
this.filteredStores = this.stores.map(store => ({
|
|
3569
|
+
...store,
|
|
3570
|
+
checked: false
|
|
3571
|
+
}));
|
|
3572
|
+
}
|
|
3573
|
+
// Update localStorage and emit data
|
|
3574
|
+
const resetFilters = {
|
|
3575
|
+
...this.selectedFilters,
|
|
3576
|
+
stores: this.filteredStores,
|
|
3577
|
+
group: [],
|
|
3578
|
+
location: []
|
|
3579
|
+
};
|
|
3580
|
+
localStorage.setItem("header-filters", JSON.stringify(resetFilters));
|
|
3581
|
+
this.gs.dataRangeValue.next(resetFilters);
|
|
3582
|
+
this.Opendropdown = false; // Close dropdown if needed
|
|
3583
|
+
}
|
|
3584
|
+
Apply() {
|
|
3585
|
+
// Close the dropdown
|
|
3586
|
+
this.Opendropdown = false;
|
|
3587
|
+
// Fetch existing filters from localStorage
|
|
3588
|
+
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
3589
|
+
// Ensure current selections are reflected
|
|
3590
|
+
this.selectedFilters.location = this.filteredLocations;
|
|
3591
|
+
this.selectedFilters.group = this.filteredGroups;
|
|
3592
|
+
this.selectedFilters.stores = this.filteredStores;
|
|
3593
|
+
// Store updated filters back in localStorage
|
|
3594
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
3595
|
+
// Emit the updated filters via the service
|
|
3596
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
3597
|
+
// Trigger refresh if necessary
|
|
3598
|
+
this.gs.manageRefreshTrigger.next(true);
|
|
3599
|
+
this.cd.detectChanges();
|
|
3600
|
+
}
|
|
3601
|
+
filterLocations() {
|
|
3602
|
+
const searchText = this.searchLocationText.toLowerCase();
|
|
3603
|
+
if (searchText) {
|
|
3604
|
+
// Filter based on search text
|
|
3605
|
+
this.filteredLocations = this.locations.filter((location) => location.city.toLowerCase().includes(searchText));
|
|
3606
|
+
}
|
|
3607
|
+
else {
|
|
3608
|
+
// Reset to full array if search text is empty
|
|
3609
|
+
this.filteredLocations = [...this.locations];
|
|
3610
|
+
}
|
|
3611
|
+
}
|
|
3612
|
+
filterGroups() {
|
|
3613
|
+
if (this.searchGroupText) {
|
|
3614
|
+
this.filteredGroups = this.groupsData.filter((group) => group.groupName
|
|
3615
|
+
.toLowerCase()
|
|
3616
|
+
.includes(this.searchGroupText.toLowerCase()));
|
|
3617
|
+
}
|
|
3618
|
+
else {
|
|
3619
|
+
this.filteredGroups = this.groupsData;
|
|
3620
|
+
}
|
|
3621
|
+
}
|
|
3622
|
+
filterStores() {
|
|
3623
|
+
if (this.searchStoreText) {
|
|
3624
|
+
this.filteredStores = this.stores.filter((store) => store.storeName
|
|
3625
|
+
.toLowerCase()
|
|
3626
|
+
.includes(this.searchStoreText.toLowerCase()));
|
|
3627
|
+
}
|
|
3628
|
+
else {
|
|
3629
|
+
this.filteredStores = this.stores;
|
|
3630
|
+
}
|
|
3631
|
+
}
|
|
3632
|
+
closeDropdown() {
|
|
3633
|
+
this.dropdownOpen = null;
|
|
3634
|
+
}
|
|
3635
|
+
clickOutside(event) {
|
|
3636
|
+
const clickedInside = event.target.closest(".dropdown-container");
|
|
3637
|
+
const clickedoutSide = event.target.closest(".dropdown1");
|
|
3638
|
+
if (!clickedInside) {
|
|
3639
|
+
this.closeDropdown();
|
|
3640
|
+
}
|
|
3641
|
+
if (!clickedoutSide) {
|
|
3642
|
+
this.closeDropdown1();
|
|
3643
|
+
}
|
|
3644
|
+
}
|
|
3645
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TrafficHeaderComponent, deps: [{ token: AuthService }, { token: i1$1.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3646
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TrafficHeaderComponent, selector: "lib-traffic-header", host: { listeners: { "document:click": "clickOutside($event)" } }, ngImport: i0, template: "<div class=\"wrapper mx-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 dropdown1 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 <!-- Location Dropdown -->\r\n<div class=\"dropdown-container\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input\" \r\n [value]=\"selectedLocationsLabel()\"\r\n (focus)=\"toggleDropdown('location')\" \r\n readonly\r\n placeholder=\"Select locations...\"\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 locations...\" \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\" \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 Locations\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\" \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\" \r\n [value]=\"selectedGroupsLabel()\" readonly\r\n placeholder=\"Select groups...\"\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 groups...\" \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\" \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\" \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\" \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\" \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\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:200px;overflow-y:auto;display:block;box-sizing:border-box}.dropdown-item{padding:8px 12px}.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}.dropdown1{position:absolute;top:70px;min-width:270px!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:14px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}::ng-deep .dropdown1{z-index:1!important}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.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: i3$2.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: i3$2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.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: i2.AsyncPipe, name: "async" }] });
|
|
3647
|
+
}
|
|
3648
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TrafficHeaderComponent, decorators: [{
|
|
3649
|
+
type: Component,
|
|
3650
|
+
args: [{ selector: "lib-traffic-header", template: "<div class=\"wrapper mx-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 dropdown1 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 <!-- Location Dropdown -->\r\n<div class=\"dropdown-container\" (clickOutside)=\"closeDropdown()\">\r\n <div class=\"dropdown-header\">\r\n <input \r\n type=\"text\" \r\n class=\"form-control dropdown-input\" \r\n [value]=\"selectedLocationsLabel()\"\r\n (focus)=\"toggleDropdown('location')\" \r\n readonly\r\n placeholder=\"Select locations...\"\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 locations...\" \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\" \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 Locations\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\" \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\" \r\n [value]=\"selectedGroupsLabel()\" readonly\r\n placeholder=\"Select groups...\"\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 groups...\" \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\" \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\" \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\" \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\" \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\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:200px;overflow-y:auto;display:block;box-sizing:border-box}.dropdown-item{padding:8px 12px}.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}.dropdown1{position:absolute;top:70px;min-width:270px!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:14px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}::ng-deep .dropdown1{z-index:1!important}\n"] }]
|
|
3651
|
+
}], ctorParameters: () => [{ type: AuthService }, { type: i1$1.GlobalStateService }, { type: i0.ChangeDetectorRef }], propDecorators: { onClick: [{
|
|
3652
|
+
type: HostListener,
|
|
3653
|
+
args: ['document:click', ['$event']]
|
|
3654
|
+
}], clickOutside: [{
|
|
3655
|
+
type: HostListener,
|
|
3656
|
+
args: ["document:click", ["$event"]]
|
|
3657
|
+
}] } });
|
|
3658
|
+
|
|
3125
3659
|
class ToolbarComponent {
|
|
3126
3660
|
layout;
|
|
3127
3661
|
router;
|
|
@@ -3159,6 +3693,7 @@ class ToolbarComponent {
|
|
|
3159
3693
|
stores: [],
|
|
3160
3694
|
date: null,
|
|
3161
3695
|
};
|
|
3696
|
+
trafficdatepicker;
|
|
3162
3697
|
constructor(layout, router, route, gs) {
|
|
3163
3698
|
this.layout = layout;
|
|
3164
3699
|
this.router = router;
|
|
@@ -3233,10 +3768,10 @@ class ToolbarComponent {
|
|
|
3233
3768
|
URL == "/manage/stores" || URL === "/manage/stores?type=stores" || URL === "/manage/stores?type=groups" ||
|
|
3234
3769
|
URL == "/manage/stores/addition-method" ||
|
|
3235
3770
|
URL == "/manage/stores/add-single-store") {
|
|
3236
|
-
this.setUIProperties(true, false, false, false, false);
|
|
3771
|
+
this.setUIProperties(true, false, false, false, false, false);
|
|
3237
3772
|
}
|
|
3238
3773
|
else if (url[3] == "edge-app") {
|
|
3239
|
-
this.setUIProperties(false, false, false, false, true);
|
|
3774
|
+
this.setUIProperties(false, false, false, false, true, false);
|
|
3240
3775
|
}
|
|
3241
3776
|
else if (URL == `/manage/stores/infra-ticket?storeId=${this.storeId}` || URL == `/manage/stores/infra-ticket?storeId=${this.storeId}&type=infra` ||
|
|
3242
3777
|
URL == `/manage/stores/settings?storeId=${this.storeId}` || URL == `/manage/stores/infra-ticket?storeId=${this.storeId}&type=dataMismatch` ||
|
|
@@ -3244,19 +3779,22 @@ class ToolbarComponent {
|
|
|
3244
3779
|
URL == `/manage/stores/cameras?storeId=${this.storeId}` ||
|
|
3245
3780
|
// URL == `/manage/stores/infrastructure?storeId=${this.storeId}` ||
|
|
3246
3781
|
URL == `/manage/stores/mat?storeId=${this.storeId}`) {
|
|
3247
|
-
this.setUIProperties(false, false, false, true, false);
|
|
3782
|
+
this.setUIProperties(false, false, false, true, false, false);
|
|
3783
|
+
}
|
|
3784
|
+
else if (URL == "/profile" || url[2] === "data-mismatch" || url[2] === "employeetraining" || URL == "/notifications/alerts"
|
|
3785
|
+
|| URL == "/manage/brands" || URL == "/manage/users/tango" || URL === "/tickets/users?type=audit") {
|
|
3786
|
+
this.setUIProperties(false, false, false, false, false, false);
|
|
3248
3787
|
}
|
|
3249
|
-
else if (URL == "/
|
|
3250
|
-
|
|
3251
|
-
this.setUIProperties(false, false, false, false, false);
|
|
3788
|
+
else if (URL == "/manage/traffic") {
|
|
3789
|
+
this.setUIProperties(false, false, false, false, false, true);
|
|
3252
3790
|
}
|
|
3253
3791
|
else {
|
|
3254
|
-
this.setUIProperties(false, false, false, false, true);
|
|
3792
|
+
this.setUIProperties(false, false, false, false, true, false);
|
|
3255
3793
|
}
|
|
3256
3794
|
}
|
|
3257
3795
|
else {
|
|
3258
3796
|
if (url[3] == "edge-app") {
|
|
3259
|
-
this.setUIProperties(false, false, true, false, false);
|
|
3797
|
+
this.setUIProperties(false, false, true, false, false, false);
|
|
3260
3798
|
}
|
|
3261
3799
|
else if (URL == `/manage/stores/infra-ticket?storeId=${this.storeId}` || URL == `/manage/stores/infra-ticket?storeId=${this.storeId}&type=infra` ||
|
|
3262
3800
|
URL == `/manage/stores/settings?storeId=${this.storeId}` || URL == `/manage/stores/infra-ticket?storeId=${this.storeId}&type=dataMismatch` ||
|
|
@@ -3264,36 +3802,40 @@ class ToolbarComponent {
|
|
|
3264
3802
|
URL == `/manage/stores/cameras?storeId=${this.storeId}` ||
|
|
3265
3803
|
// URL == `/manage/stores/infrastructure?storeId=${this.storeId}` ||
|
|
3266
3804
|
URL == `/manage/stores/mat?storeId=${this.storeId}`) {
|
|
3267
|
-
this.setUIProperties(false, false, false, true, false);
|
|
3805
|
+
this.setUIProperties(false, false, false, true, false, false);
|
|
3268
3806
|
}
|
|
3269
3807
|
else if (URL == "/profile" || URL == "/manage/users/client" || URL == "/manage/users/tango" ||
|
|
3270
3808
|
URL == "/manage/stores" || URL === "/manage/stores?type=stores" || URL === "/manage/stores?type=groups" || url[2] == "settings" ||
|
|
3271
3809
|
URL == "/manage/stores/addition-method" ||
|
|
3272
3810
|
URL == "/manage/stores/add-single-store" || url[2] === "data-mismatch" || url[2] === "employeetraining"
|
|
3273
3811
|
|| URL == "/notifications/alerts" || URL == "/manage/users/tango") {
|
|
3274
|
-
this.setUIProperties(false, false, false, false, false);
|
|
3812
|
+
this.setUIProperties(false, false, false, false, false, false);
|
|
3813
|
+
}
|
|
3814
|
+
else if (URL == "/manage/traffic") {
|
|
3815
|
+
this.setUIProperties(false, false, false, false, false, true);
|
|
3275
3816
|
}
|
|
3276
3817
|
else {
|
|
3277
|
-
this.setUIProperties(false, false, true, false, false);
|
|
3818
|
+
this.setUIProperties(false, false, true, false, false, false);
|
|
3278
3819
|
}
|
|
3279
3820
|
}
|
|
3280
3821
|
const viewsWithPageTitles = ["classic", "reports", "saas"];
|
|
3281
3822
|
return (this.appPageTitleDisplay &&
|
|
3282
3823
|
viewsWithPageTitles.some((t) => t === this.appToolbarLayout));
|
|
3283
3824
|
}
|
|
3284
|
-
setUIProperties(singleSelect, multiSelect, datepicker, singleStore, singleSelectdatepicker) {
|
|
3825
|
+
setUIProperties(singleSelect, multiSelect, datepicker, singleStore, singleSelectdatepicker, trafficdatepicker) {
|
|
3285
3826
|
this.singleSelect = singleSelect;
|
|
3286
3827
|
this.multiSelect = multiSelect;
|
|
3287
3828
|
this.datepicker = datepicker;
|
|
3288
3829
|
this.singleStore = singleStore;
|
|
3289
3830
|
this.singleSelectdatepicker = singleSelectdatepicker;
|
|
3831
|
+
this.trafficdatepicker = trafficdatepicker;
|
|
3290
3832
|
}
|
|
3291
3833
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1$1.LayoutService }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i1$1.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3292
|
-
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\r\n <ng-container *ngIf=\"datepicker && users.userType ==='client'\">\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=\"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: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.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" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
3834
|
+
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\r\n <ng-container *ngIf=\"datepicker && users.userType ==='client'\">\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=\"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: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.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" }, { kind: "component", type: TrafficHeaderComponent, selector: "lib-traffic-header" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
3293
3835
|
}
|
|
3294
3836
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
3295
3837
|
type: Component,
|
|
3296
|
-
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\r\n <ng-container *ngIf=\"datepicker && users.userType ==='client'\">\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=\"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" }]
|
|
3838
|
+
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\r\n <ng-container *ngIf=\"datepicker && users.userType ==='client'\">\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=\"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" }]
|
|
3297
3839
|
}], ctorParameters: () => [{ type: i1$1.LayoutService }, { type: i1.Router }, { type: i1.ActivatedRoute }, { type: i1$1.GlobalStateService }], propDecorators: { currentLayoutType: [{
|
|
3298
3840
|
type: Input
|
|
3299
3841
|
}], appToolbarLayout: [{
|
|
@@ -3394,11 +3936,11 @@ class SidebarMenuComponent {
|
|
|
3394
3936
|
});
|
|
3395
3937
|
}
|
|
3396
3938
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SidebarMenuComponent, deps: [{ token: AuthService }, { token: i1$1.GlobalStateService }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
3397
|
-
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=\"(gs.userAccess | async)?.analytics_birdsEye_isView && (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 <!-- Manage -->\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 show\">\r\n <span class=\"menu-link\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <!-- <lib-keenicon name=\"profile-circle\" class=\"fs-2\"></lib-keenicon> -->\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 <!-- Manage -->\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <!-- <lib-keenicon name=\"profile-circle\" class=\"fs-2\"></lib-keenicon> -->\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/tickets\">My Workspace\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)?.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 </div>\r\n <!--end::Menu-->\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\r\n\r\n\r\n\r\n\r\n <!-- Tango Traffic -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_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_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> -->", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
3939
|
+
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=\"(gs.userAccess | async)?.analytics_birdsEye_isView && (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 <!-- Manage -->\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\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <!-- <lib-keenicon name=\"profile-circle\" class=\"fs-2\"></lib-keenicon> -->\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 <!-- Manage -->\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\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <!-- <lib-keenicon name=\"profile-circle\" class=\"fs-2\"></lib-keenicon> -->\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/tickets\">My Workspace\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)?.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 </div>\r\n <!--end::Menu-->\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\r\n\r\n\r\n\r\n\r\n <!-- Tango Traffic -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_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_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> -->", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
3398
3940
|
}
|
|
3399
3941
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SidebarMenuComponent, decorators: [{
|
|
3400
3942
|
type: Component,
|
|
3401
|
-
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=\"(gs.userAccess | async)?.analytics_birdsEye_isView && (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 <!-- Manage -->\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 show\">\r\n <span class=\"menu-link\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <!-- <lib-keenicon name=\"profile-circle\" class=\"fs-2\"></lib-keenicon> -->\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 <!-- Manage -->\r\n <div *ngIf=\"(gs.userAccess | async)?.userType === 'tango'\" class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n <span class=\"menu-link\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <!-- <lib-keenicon name=\"profile-circle\" class=\"fs-2\"></lib-keenicon> -->\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/tickets\">My Workspace\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)?.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 </div>\r\n <!--end::Menu-->\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\r\n\r\n\r\n\r\n\r\n <!-- Tango Traffic -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_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_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> -->" }]
|
|
3943
|
+
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=\"(gs.userAccess | async)?.analytics_birdsEye_isView && (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 <!-- Manage -->\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\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <!-- <lib-keenicon name=\"profile-circle\" class=\"fs-2\"></lib-keenicon> -->\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 <!-- Manage -->\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\">\r\n <span style=\"width: 0px;\" class=\"menu-icon\">\r\n <!-- <lib-keenicon name=\"profile-circle\" class=\"fs-2\"></lib-keenicon> -->\r\n </span>\r\n <span class=\"menu-title\" data-link=\"/tickets\">My Workspace\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)?.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 </div>\r\n <!--end::Menu-->\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\r\n\r\n\r\n\r\n\r\n <!-- Tango Traffic -->\r\n <!-- <div *ngIf=\"(gs.userAccess | async)?.analytics_tangoTraffic_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_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> -->" }]
|
|
3402
3944
|
}], ctorParameters: () => [{ type: AuthService }, { type: i1$1.GlobalStateService }, { type: i1.Router }] });
|
|
3403
3945
|
|
|
3404
3946
|
class SidebarFooterComponent {
|
|
@@ -4359,11 +4901,11 @@ class FiltersComponent {
|
|
|
4359
4901
|
this.appliedFilters.emit(this.responseArray);
|
|
4360
4902
|
}
|
|
4361
4903
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FiltersComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.Router }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4362
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FiltersComponent, selector: "lib-filters", inputs: { dataObject: "dataObject" }, outputs: { appliedFilters: "appliedFilters" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"position-relative\">\r\n \r\n <button type=\"button\" (click)=\"opendropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div class=\"card p-5 dropdown1 position-absolute z-1 end-0\" style=\"z-index: 1 !important;\" *ngIf=\"Opendropdown\">\r\n <div class=\"dropdown-title d-flex justify-content-between\">Filter Options\r\n <!-- <div class=\"text-end\"> -->\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 </div>\r\n <div class=\"w-100 border border-gray mt-3\"></div>\r\n <div class=\"py-3\" *ngFor=\"let item of dataObject; let i = index\">\r\n <div *ngIf=\"item.type !== 'single'\">\r\n <div class=\"dropdown form-select position-relative d-flex justify-content-between\" (click)=\"Dropdown(item.Description,i,$event)\">\r\n <!-- <span class=\"\">{{ selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined ? selectedValuesArray[i]?.length + ' ' + item.Description.split(' ').pop() + ' Selected' : item.Description }}</span> -->\r\n <span>{{item.Description}}</span> <span *ngIf=\"selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined && selectedValuesArray[i]?.length !== 0\" class=\"badge badge-light-default\">{{selectedValuesArray[i]?.length}}</span>\r\n </div>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute w-100\">\r\n <div class=\"form-check d-flex align-items-center py-3 pt-3 ps-0\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\" [checked]=\"selectedValuesArray[i]?.length === item.Issues.length\"\r\n (change)=\"toggleCheckbox($event,'Select All', i,0)\">\r\n <label class=\"form-check-label cursor-pointer px-2\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n \r\n <div class=\"border border-gray mt-3 \"></div>\r\n \r\n <div class=\"mt-3 d-flex align-items-center\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <input type=\"text\" [(ngModel)]=\"dataObject[i].selectedValue\" (input)=\"searchData($event,i)\" [id]=\"i\" class=\"form-control searchinput ps-14 py-2 me-2 mt-2\"\r\n placeholder=\"Search\" autocomplete=\"off\" />\r\n </div>\r\n \r\n <div *ngFor=\"let issue of item.Issues;let j=index\" class=\"form-check d-flex align-items-center py-3 pt-3 ps-0 mt-2 \">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"issue.text\" id=\"option{{issue.text}}\" [checked]=\"issue.checked\"\r\n (change)=\"toggleCheckbox($event,issue.text,i,j)\">\r\n <label class=\"form-check-label cursor-pointer px-2\" for=\"option{{issue.text}}\">\r\n {{ issue.text }}\r\n </label>\r\n </div>\r\n <div class=\"mt-5 d-flex justify-content-center\">\r\n <span class=\"form-check-label\" *ngIf=\"noFilter\"> No filters available</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"item.type === 'single'\" class=\"position-relative w-100\">\r\n <button type=\"button\" (click)=\"openDropdown($event,i)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\"> {{selectedValuesArray[i]?.text ? selectedValuesArray[i]?.text : item.Description}}\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"item.isOpen\" class=\"card py-1 w-100 dropdown-single position-absolute z-1 top-50px end-0\">\r\n <ul *ngFor=\"let item of item.Issues; let j = index\" class=\"list-unstyled\">\r\n <li [ngClass]=\"selectedValuesArray[i]?.text === item.text ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem($event,i,j)\">{{item.text}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div role=\"group\" class=\"d-flex justify-content-between\">\r\n <button class=\"btn btn-outline w-100 me-2\" (click)=\"Reset()\"> Reset </button>\r\n <button class=\"btn btn-primary w-100 ms-2\" (click)=\"Apply()\">Apply</button>\r\n </div> -->\r\n </div>\r\n</div>", styles: [".dropdown1{position:absolute;top:70px;min-width:270px!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:14px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{width:90%!important;z-index:1;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;height:200px;overflow:auto}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize}.dropdown1 .items:hover,.dropdown1 .tems.focus,.dropdown1 .items.active,.dropdown1 .camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 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}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 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}::ng-deep .dropdown1{z-index:1!important}.btn-resize{font-size:13px!important;height:29px!important;line-height:11px!important;padding:1px!important}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
4904
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FiltersComponent, selector: "lib-filters", inputs: { dataObject: "dataObject" }, outputs: { appliedFilters: "appliedFilters" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"position-relative\">\r\n \r\n <button type=\"button\" (click)=\"opendropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div class=\"card p-5 dropdown1 position-absolute z-1 end-0\" style=\"z-index: 1 !important;\" *ngIf=\"Opendropdown\">\r\n <div class=\"dropdown-title d-flex justify-content-between\">Filter Options\r\n <!-- <div class=\"text-end\"> -->\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 </div>\r\n <div class=\"w-100 border border-gray mt-3\"></div>\r\n <div class=\"py-3\" *ngFor=\"let item of dataObject; let i = index\">\r\n <div *ngIf=\"item.type !== 'single'\">\r\n <div class=\"dropdown form-select position-relative d-flex justify-content-between cursor-pointer\" (click)=\"Dropdown(item.Description,i,$event)\">\r\n <!-- <span class=\"\">{{ selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined ? selectedValuesArray[i]?.length + ' ' + item.Description.split(' ').pop() + ' Selected' : item.Description }}</span> -->\r\n <span>{{item.Description}}</span> <span *ngIf=\"selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined && selectedValuesArray[i]?.length !== 0\" class=\"badge badge-light-default\">{{selectedValuesArray[i]?.length}}</span>\r\n </div>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute w-100\">\r\n <div class=\"form-check d-flex align-items-center py-3 pt-3 ps-0\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\" [checked]=\"selectedValuesArray[i]?.length === item.Issues.length\"\r\n (change)=\"toggleCheckbox($event,'Select All', i,0)\">\r\n <label class=\"form-check-label cursor-pointer px-2\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n \r\n <div class=\"border border-gray mt-3 \"></div>\r\n \r\n <div class=\"mt-3 d-flex align-items-center\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <input type=\"text\" [(ngModel)]=\"dataObject[i].selectedValue\" (input)=\"searchData($event,i)\" [id]=\"i\" class=\"form-control searchinput ps-14 py-2 me-2 mt-2\"\r\n placeholder=\"Search\" autocomplete=\"off\" />\r\n </div>\r\n \r\n <div *ngFor=\"let issue of item.Issues;let j=index\" class=\"form-check d-flex align-items-center py-3 pt-3 ps-0 mt-2 \">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"issue.text\" id=\"option{{issue.text}}\" [checked]=\"issue.checked\"\r\n (change)=\"toggleCheckbox($event,issue.text,i,j)\">\r\n <label class=\"form-check-label cursor-pointer px-2\" for=\"option{{issue.text}}\">\r\n {{ issue.text }}\r\n </label>\r\n </div>\r\n <div class=\"mt-5 d-flex justify-content-center\">\r\n <span class=\"form-check-label\" *ngIf=\"noFilter\"> No filters available</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"item.type === 'single'\" class=\"position-relative w-100\">\r\n <button type=\"button\" (click)=\"openDropdown($event,i)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\"> {{selectedValuesArray[i]?.text ? selectedValuesArray[i]?.text : item.Description}}\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"item.isOpen\" class=\"card py-1 w-100 dropdown-single position-absolute z-1 top-50px end-0\">\r\n <ul *ngFor=\"let item of item.Issues; let j = index\" class=\"list-unstyled\">\r\n <li [ngClass]=\"selectedValuesArray[i]?.text === item.text ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem($event,i,j)\">{{item.text}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div role=\"group\" class=\"d-flex justify-content-between\">\r\n <button class=\"btn btn-outline w-100 me-2\" (click)=\"Reset()\"> Reset </button>\r\n <button class=\"btn btn-primary w-100 ms-2\" (click)=\"Apply()\">Apply</button>\r\n </div> -->\r\n </div>\r\n</div>", styles: [".dropdown1{position:absolute;top:70px;min-width:270px!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:14px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{width:90%!important;z-index:1;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;height:200px;overflow:auto}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize}.dropdown1 .items:hover,.dropdown1 .tems.focus,.dropdown1 .items.active,.dropdown1 .camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 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}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 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}::ng-deep .dropdown1{z-index:1!important}.btn-resize{font-size:13px!important;height:29px!important;line-height:11px!important;padding:1px!important}.dropdown-single{z-index:1;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;min-height:auto;max-height:200px;overflow:auto}.dropdown-single label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
4363
4905
|
}
|
|
4364
4906
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FiltersComponent, decorators: [{
|
|
4365
4907
|
type: Component,
|
|
4366
|
-
args: [{ selector: 'lib-filters', template: "<div class=\"position-relative\">\r\n \r\n <button type=\"button\" (click)=\"opendropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div class=\"card p-5 dropdown1 position-absolute z-1 end-0\" style=\"z-index: 1 !important;\" *ngIf=\"Opendropdown\">\r\n <div class=\"dropdown-title d-flex justify-content-between\">Filter Options\r\n <!-- <div class=\"text-end\"> -->\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 </div>\r\n <div class=\"w-100 border border-gray mt-3\"></div>\r\n <div class=\"py-3\" *ngFor=\"let item of dataObject; let i = index\">\r\n <div *ngIf=\"item.type !== 'single'\">\r\n <div class=\"dropdown form-select position-relative d-flex justify-content-between\" (click)=\"Dropdown(item.Description,i,$event)\">\r\n <!-- <span class=\"\">{{ selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined ? selectedValuesArray[i]?.length + ' ' + item.Description.split(' ').pop() + ' Selected' : item.Description }}</span> -->\r\n <span>{{item.Description}}</span> <span *ngIf=\"selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined && selectedValuesArray[i]?.length !== 0\" class=\"badge badge-light-default\">{{selectedValuesArray[i]?.length}}</span>\r\n </div>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute w-100\">\r\n <div class=\"form-check d-flex align-items-center py-3 pt-3 ps-0\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\" [checked]=\"selectedValuesArray[i]?.length === item.Issues.length\"\r\n (change)=\"toggleCheckbox($event,'Select All', i,0)\">\r\n <label class=\"form-check-label cursor-pointer px-2\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n \r\n <div class=\"border border-gray mt-3 \"></div>\r\n \r\n <div class=\"mt-3 d-flex align-items-center\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <input type=\"text\" [(ngModel)]=\"dataObject[i].selectedValue\" (input)=\"searchData($event,i)\" [id]=\"i\" class=\"form-control searchinput ps-14 py-2 me-2 mt-2\"\r\n placeholder=\"Search\" autocomplete=\"off\" />\r\n </div>\r\n \r\n <div *ngFor=\"let issue of item.Issues;let j=index\" class=\"form-check d-flex align-items-center py-3 pt-3 ps-0 mt-2 \">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"issue.text\" id=\"option{{issue.text}}\" [checked]=\"issue.checked\"\r\n (change)=\"toggleCheckbox($event,issue.text,i,j)\">\r\n <label class=\"form-check-label cursor-pointer px-2\" for=\"option{{issue.text}}\">\r\n {{ issue.text }}\r\n </label>\r\n </div>\r\n <div class=\"mt-5 d-flex justify-content-center\">\r\n <span class=\"form-check-label\" *ngIf=\"noFilter\"> No filters available</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"item.type === 'single'\" class=\"position-relative w-100\">\r\n <button type=\"button\" (click)=\"openDropdown($event,i)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\"> {{selectedValuesArray[i]?.text ? selectedValuesArray[i]?.text : item.Description}}\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"item.isOpen\" class=\"card py-1 w-100 dropdown-single position-absolute z-1 top-50px end-0\">\r\n <ul *ngFor=\"let item of item.Issues; let j = index\" class=\"list-unstyled\">\r\n <li [ngClass]=\"selectedValuesArray[i]?.text === item.text ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem($event,i,j)\">{{item.text}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div role=\"group\" class=\"d-flex justify-content-between\">\r\n <button class=\"btn btn-outline w-100 me-2\" (click)=\"Reset()\"> Reset </button>\r\n <button class=\"btn btn-primary w-100 ms-2\" (click)=\"Apply()\">Apply</button>\r\n </div> -->\r\n </div>\r\n</div>", styles: [".dropdown1{position:absolute;top:70px;min-width:270px!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:14px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{width:90%!important;z-index:1;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;height:200px;overflow:auto}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize}.dropdown1 .items:hover,.dropdown1 .tems.focus,.dropdown1 .items.active,.dropdown1 .camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 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}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 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}::ng-deep .dropdown1{z-index:1!important}.btn-resize{font-size:13px!important;height:29px!important;line-height:11px!important;padding:1px!important}\n"] }]
|
|
4908
|
+
args: [{ selector: 'lib-filters', template: "<div class=\"position-relative\">\r\n \r\n <button type=\"button\" (click)=\"opendropdown($event)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-2\">Filter</span> </button>\r\n <div class=\"card p-5 dropdown1 position-absolute z-1 end-0\" style=\"z-index: 1 !important;\" *ngIf=\"Opendropdown\">\r\n <div class=\"dropdown-title d-flex justify-content-between\">Filter Options\r\n <!-- <div class=\"text-end\"> -->\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 </div>\r\n <div class=\"w-100 border border-gray mt-3\"></div>\r\n <div class=\"py-3\" *ngFor=\"let item of dataObject; let i = index\">\r\n <div *ngIf=\"item.type !== 'single'\">\r\n <div class=\"dropdown form-select position-relative d-flex justify-content-between cursor-pointer\" (click)=\"Dropdown(item.Description,i,$event)\">\r\n <!-- <span class=\"\">{{ selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined ? selectedValuesArray[i]?.length + ' ' + item.Description.split(' ').pop() + ' Selected' : item.Description }}</span> -->\r\n <span>{{item.Description}}</span> <span *ngIf=\"selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined && selectedValuesArray[i]?.length !== 0\" class=\"badge badge-light-default\">{{selectedValuesArray[i]?.length}}</span>\r\n </div>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute w-100\">\r\n <div class=\"form-check d-flex align-items-center py-3 pt-3 ps-0\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\" [checked]=\"selectedValuesArray[i]?.length === item.Issues.length\"\r\n (change)=\"toggleCheckbox($event,'Select All', i,0)\">\r\n <label class=\"form-check-label cursor-pointer px-2\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n \r\n <div class=\"border border-gray mt-3 \"></div>\r\n \r\n <div class=\"mt-3 d-flex align-items-center\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <input type=\"text\" [(ngModel)]=\"dataObject[i].selectedValue\" (input)=\"searchData($event,i)\" [id]=\"i\" class=\"form-control searchinput ps-14 py-2 me-2 mt-2\"\r\n placeholder=\"Search\" autocomplete=\"off\" />\r\n </div>\r\n \r\n <div *ngFor=\"let issue of item.Issues;let j=index\" class=\"form-check d-flex align-items-center py-3 pt-3 ps-0 mt-2 \">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"issue.text\" id=\"option{{issue.text}}\" [checked]=\"issue.checked\"\r\n (change)=\"toggleCheckbox($event,issue.text,i,j)\">\r\n <label class=\"form-check-label cursor-pointer px-2\" for=\"option{{issue.text}}\">\r\n {{ issue.text }}\r\n </label>\r\n </div>\r\n <div class=\"mt-5 d-flex justify-content-center\">\r\n <span class=\"form-check-label\" *ngIf=\"noFilter\"> No filters available</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"item.type === 'single'\" class=\"position-relative w-100\">\r\n <button type=\"button\" (click)=\"openDropdown($event,i)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\"> {{selectedValuesArray[i]?.text ? selectedValuesArray[i]?.text : item.Description}}\r\n <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"item.isOpen\" class=\"card py-1 w-100 dropdown-single position-absolute z-1 top-50px end-0\">\r\n <ul *ngFor=\"let item of item.Issues; let j = index\" class=\"list-unstyled\">\r\n <li [ngClass]=\"selectedValuesArray[i]?.text === item.text ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem($event,i,j)\">{{item.text}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div role=\"group\" class=\"d-flex justify-content-between\">\r\n <button class=\"btn btn-outline w-100 me-2\" (click)=\"Reset()\"> Reset </button>\r\n <button class=\"btn btn-primary w-100 ms-2\" (click)=\"Apply()\">Apply</button>\r\n </div> -->\r\n </div>\r\n</div>", styles: [".dropdown1{position:absolute;top:70px;min-width:270px!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:14px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{width:90%!important;z-index:1;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;height:200px;overflow:auto}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize}.dropdown1 .items:hover,.dropdown1 .tems.focus,.dropdown1 .items.active,.dropdown1 .camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 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}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 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}::ng-deep .dropdown1{z-index:1!important}.btn-resize{font-size:13px!important;height:29px!important;line-height:11px!important;padding:1px!important}.dropdown-single{z-index:1;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;min-height:auto;max-height:200px;overflow:auto}.dropdown-single label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize}\n"] }]
|
|
4367
4909
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.Router }, { type: i0.ChangeDetectorRef }], propDecorators: { dataObject: [{
|
|
4368
4910
|
type: Input
|
|
4369
4911
|
}], appliedFilters: [{
|
|
@@ -5311,7 +5853,8 @@ class LayoutModule {
|
|
|
5311
5853
|
DateSingleSelectComponent,
|
|
5312
5854
|
SingleStoreComponent,
|
|
5313
5855
|
NotificationsInnerComponent,
|
|
5314
|
-
CsmAssignConfirmationComponent
|
|
5856
|
+
CsmAssignConfirmationComponent,
|
|
5857
|
+
TrafficHeaderComponent], imports: [CommonModule, i1.RouterModule, TranslationModule,
|
|
5315
5858
|
InlineSVGModule,
|
|
5316
5859
|
NgbDropdownModule,
|
|
5317
5860
|
NgbProgressbarModule,
|
|
@@ -5374,6 +5917,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
5374
5917
|
SingleStoreComponent,
|
|
5375
5918
|
NotificationsInnerComponent,
|
|
5376
5919
|
CsmAssignConfirmationComponent,
|
|
5920
|
+
TrafficHeaderComponent
|
|
5377
5921
|
],
|
|
5378
5922
|
imports: [
|
|
5379
5923
|
CommonModule,
|