tango-app-ui-shared 3.0.16-dev → 3.0.18-dev
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/modules/layout/toolbar/classic/classic.component.mjs +2 -18
- package/esm2022/lib/modules/layout/toolbar/date-single-select/date-single-select.component.mjs +42 -52
- package/esm2022/lib/modules/layout/toolbar/datepicker/datepicker.component.mjs +12 -21
- package/esm2022/lib/modules/layout/toolbar/single-store/single-store.component.mjs +15 -16
- package/esm2022/lib/modules/layout/toolbar/toolbar.component.mjs +59 -44
- package/fesm2022/tango-app-ui-shared.mjs +122 -143
- package/fesm2022/tango-app-ui-shared.mjs.map +1 -1
- package/lib/modules/layout/toolbar/date-single-select/date-single-select.component.d.ts +5 -5
- package/lib/modules/layout/toolbar/toolbar.component.d.ts +5 -2
- package/package.json +1 -1
|
@@ -1694,15 +1694,10 @@ class ClassicComponent {
|
|
|
1694
1694
|
next: (res) => {
|
|
1695
1695
|
this.getClientList = res?.data?.result;
|
|
1696
1696
|
if ("header-filters" in localStorage) {
|
|
1697
|
-
// debugger
|
|
1698
1697
|
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
1699
|
-
// debugger
|
|
1700
|
-
// if(headerFilters.date){
|
|
1701
1698
|
this.selectedFilters.date = headerFilters.date;
|
|
1702
1699
|
this.selectedDateRange.startDate = headerFilters.date.startDate;
|
|
1703
1700
|
this.selectedDateRange.endDate = headerFilters.date.endDate;
|
|
1704
|
-
// }
|
|
1705
|
-
console.log(this.selectedDateRange);
|
|
1706
1701
|
this.dataObject[0].Issues = this.getClientList;
|
|
1707
1702
|
this.toggleCheckbox("Select All", 0);
|
|
1708
1703
|
this.dummyArray = JSON.parse(JSON.stringify(this.dataObject));
|
|
@@ -1710,7 +1705,6 @@ class ClassicComponent {
|
|
|
1710
1705
|
const currentIssues = this.dummyArray[0].Issues.map((item) => item.clientId);
|
|
1711
1706
|
this.selectedFilters.clients = currentIssues;
|
|
1712
1707
|
this.selectedFilters.client = headerFilters.client;
|
|
1713
|
-
// }
|
|
1714
1708
|
this.globalService.dataRangeValue.next(this.selectedFilters);
|
|
1715
1709
|
this.cd.detectChanges();
|
|
1716
1710
|
}
|
|
@@ -1727,14 +1721,11 @@ class ClassicComponent {
|
|
|
1727
1721
|
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
1728
1722
|
this.cd.detectChanges();
|
|
1729
1723
|
}
|
|
1730
|
-
console.log(this.selectedDateRange);
|
|
1731
1724
|
},
|
|
1732
1725
|
});
|
|
1733
|
-
// this.updateProps();
|
|
1734
1726
|
const subscr = this.layout.layoutConfigSubject
|
|
1735
1727
|
.asObservable()
|
|
1736
1728
|
.subscribe(() => {
|
|
1737
|
-
// this.updateProps();
|
|
1738
1729
|
});
|
|
1739
1730
|
this.unsubscribe.push(subscr);
|
|
1740
1731
|
}
|
|
@@ -1759,9 +1750,6 @@ class ClassicComponent {
|
|
|
1759
1750
|
});
|
|
1760
1751
|
}
|
|
1761
1752
|
}
|
|
1762
|
-
// ngOnInit() {
|
|
1763
|
-
// console.log(this.dataObject,'obj');
|
|
1764
|
-
// }
|
|
1765
1753
|
opendropdown(e) {
|
|
1766
1754
|
console.log(687);
|
|
1767
1755
|
e.stopPropagation();
|
|
@@ -1771,7 +1759,7 @@ class ClassicComponent {
|
|
|
1771
1759
|
event.stopPropagation();
|
|
1772
1760
|
this.dataObject.forEach((item, i) => {
|
|
1773
1761
|
if (i !== index) {
|
|
1774
|
-
item.isOpen = false;
|
|
1762
|
+
item.isOpen = false;
|
|
1775
1763
|
}
|
|
1776
1764
|
});
|
|
1777
1765
|
this.dataObject[index].isOpen = !this.dataObject[index].isOpen;
|
|
@@ -1866,7 +1854,6 @@ class ClassicComponent {
|
|
|
1866
1854
|
? this.selectedValuesArray[index]
|
|
1867
1855
|
: [];
|
|
1868
1856
|
});
|
|
1869
|
-
// this.selectedFilters.stores=this.responseArray
|
|
1870
1857
|
this.selectedFilters.clients = this.responseArray[0].Issues;
|
|
1871
1858
|
this.selectedFilters.date = this.selectedDateRange;
|
|
1872
1859
|
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
@@ -1896,7 +1883,6 @@ class ClassicComponent {
|
|
|
1896
1883
|
datechange(event) {
|
|
1897
1884
|
if (event && event.startDate && event.endDate) {
|
|
1898
1885
|
if (this.dayjs(event.startDate).isValid() && this.dayjs(event.endDate).isValid()) {
|
|
1899
|
-
// Dates are valid, proceed with formatting
|
|
1900
1886
|
this.selectedDateRange.startDate = this.dayjs(event.startDate)
|
|
1901
1887
|
.utc()
|
|
1902
1888
|
.format("YYYY-MM-DD");
|
|
@@ -1906,8 +1892,6 @@ class ClassicComponent {
|
|
|
1906
1892
|
console.log(this.selectedDateRange);
|
|
1907
1893
|
}
|
|
1908
1894
|
else {
|
|
1909
|
-
// Dates are not valid, handle the scenario accordingly
|
|
1910
|
-
console.error("Invalid dates provided:", event.startDate, event.endDate);
|
|
1911
1895
|
}
|
|
1912
1896
|
}
|
|
1913
1897
|
else {
|
|
@@ -2164,17 +2148,14 @@ class DatepickerComponent {
|
|
|
2164
2148
|
ngOnInit() {
|
|
2165
2149
|
if ("header-filters" in localStorage) {
|
|
2166
2150
|
const headerFilters = JSON.parse(localStorage.getItem('header-filters') || '{}');
|
|
2167
|
-
// if (headerFilters.date) {
|
|
2168
2151
|
this.selectedFilters.date = headerFilters.date;
|
|
2169
2152
|
this.selectedDateRange.startDate = headerFilters.date.startDate;
|
|
2170
2153
|
this.selectedDateRange.endDate = headerFilters.date.endDate;
|
|
2171
|
-
|
|
2172
|
-
this.cd.detectChanges();
|
|
2173
|
-
// }
|
|
2154
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2174
2155
|
}
|
|
2175
2156
|
else {
|
|
2176
|
-
this.selectedDateRange.startDate = this.dayjs().format("MM-DD
|
|
2177
|
-
this.selectedDateRange.endDate = this.dayjs().format("MM-DD
|
|
2157
|
+
this.selectedDateRange.startDate = this.dayjs().format("YYYY-MM-DD");
|
|
2158
|
+
this.selectedDateRange.endDate = this.dayjs().format("YYYY-MM-DD");
|
|
2178
2159
|
}
|
|
2179
2160
|
}
|
|
2180
2161
|
ranges = {
|
|
@@ -2197,22 +2178,17 @@ class DatepickerComponent {
|
|
|
2197
2178
|
}
|
|
2198
2179
|
}
|
|
2199
2180
|
datechange(event) {
|
|
2200
|
-
// debugger
|
|
2201
2181
|
if (event && event.startDate && event.endDate) {
|
|
2202
2182
|
if (this.dayjs(event.startDate).isValid() && this.dayjs(event.endDate).isValid()) {
|
|
2203
|
-
|
|
2204
|
-
this.selectedDateRange.
|
|
2205
|
-
this.selectedDateRange.endDate = this.dayjs(event.endDate).utc().format('DD-MM-YYYY');
|
|
2183
|
+
this.selectedDateRange.startDate = this.dayjs(event.startDate).utc().format('YYYY-MM-DD');
|
|
2184
|
+
this.selectedDateRange.endDate = this.dayjs(event.endDate).utc().format('YYYY-MM-DD');
|
|
2206
2185
|
}
|
|
2207
2186
|
else {
|
|
2208
|
-
//
|
|
2209
|
-
|
|
2210
|
-
//
|
|
2211
|
-
|
|
2212
|
-
|
|
2213
|
-
this.selectedDateRange.startDate = this.dayjs(storedFilters.startDate).format('DD-MM-YYYY');
|
|
2214
|
-
this.selectedDateRange.endDate = this.dayjs(storedFilters.endDate).format('DD-MM-YYYY');
|
|
2215
|
-
}
|
|
2187
|
+
// const storedFilters = JSON.parse(localStorage.getItem('header-filters') || '{}');
|
|
2188
|
+
// if (storedFilters.startDate && storedFilters.endDate) {
|
|
2189
|
+
// this.selectedDateRange.startDate = this.dayjs(storedFilters.startDate).format('YYYY-MM-DD');
|
|
2190
|
+
// this.selectedDateRange.endDate = this.dayjs(storedFilters.endDate).format('YYYY-MM-DD');
|
|
2191
|
+
// }
|
|
2216
2192
|
}
|
|
2217
2193
|
}
|
|
2218
2194
|
else {
|
|
@@ -2221,10 +2197,9 @@ class DatepickerComponent {
|
|
|
2221
2197
|
}
|
|
2222
2198
|
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
2223
2199
|
this.selectedFilters = headerFilters;
|
|
2224
|
-
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2225
2200
|
this.selectedFilters.date = this.selectedDateRange;
|
|
2201
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2226
2202
|
localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
|
|
2227
|
-
// this.globalService.sendData(this.selectedDateRange);
|
|
2228
2203
|
}
|
|
2229
2204
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DatepickerComponent, deps: [{ token: i1.LayoutService }, { token: GlobalStateService }, { token: AuthService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2230
2205
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", 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\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>", 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:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}\n"], dependencies: [{ kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.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"] }] });
|
|
@@ -2264,13 +2239,21 @@ class DateSingleSelectComponent {
|
|
|
2264
2239
|
this.clientList.find((obj) => {
|
|
2265
2240
|
if (obj.clientId === headerFilters.client) {
|
|
2266
2241
|
this.selectedClient = obj;
|
|
2267
|
-
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2268
|
-
this.cd.detectChanges();
|
|
2269
2242
|
}
|
|
2270
2243
|
});
|
|
2244
|
+
this.selectedFilters.client = headerFilters.client;
|
|
2245
|
+
this.selectedFilters.clients = [headerFilters.clients];
|
|
2246
|
+
this.selectedFilters.date = headerFilters.date;
|
|
2247
|
+
this.selectedDateRange.startDate = headerFilters.date.startDate;
|
|
2248
|
+
this.selectedDateRange.endDate = headerFilters.date.endDate;
|
|
2249
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2250
|
+
this.cd.detectChanges();
|
|
2271
2251
|
}
|
|
2272
2252
|
else {
|
|
2273
2253
|
this.selectedClient = this.clientList[0];
|
|
2254
|
+
this.selectedDateRange.startDate =
|
|
2255
|
+
this.dayjs().format("YYYY-MM-DD");
|
|
2256
|
+
this.selectedDateRange.endDate = this.dayjs().format("YYYY-MM-DD");
|
|
2274
2257
|
this.selectedFilters.client = this.selectedClient.clientId;
|
|
2275
2258
|
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2276
2259
|
this.cd.detectChanges();
|
|
@@ -2279,63 +2262,48 @@ class DateSingleSelectComponent {
|
|
|
2279
2262
|
},
|
|
2280
2263
|
});
|
|
2281
2264
|
}
|
|
2282
|
-
ngOnInit() {
|
|
2283
|
-
if ("header-filters" in localStorage) {
|
|
2284
|
-
const headerFilters = JSON.parse(localStorage.getItem('header-filters') || '{}');
|
|
2285
|
-
this.cd.detectChanges();
|
|
2286
|
-
if (headerFilters.client) {
|
|
2287
|
-
this.clientList.find((obj) => {
|
|
2288
|
-
if (obj.clientId === headerFilters.client) {
|
|
2289
|
-
this.selectedClient = obj;
|
|
2290
|
-
}
|
|
2291
|
-
});
|
|
2292
|
-
}
|
|
2293
|
-
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2294
|
-
this.selectedFilters.client = headerFilters.client;
|
|
2295
|
-
this.selectedFilters.clients = [headerFilters.clients];
|
|
2296
|
-
this.selectedFilters.date = headerFilters.date;
|
|
2297
|
-
this.selectedDateRange.startDate = headerFilters.date.startDate;
|
|
2298
|
-
this.selectedDateRange.endDate = headerFilters.date.endDate;
|
|
2299
|
-
}
|
|
2300
|
-
else {
|
|
2301
|
-
this.selectedDateRange.startDate = this.dayjs().format('MM-DD-YYYY');
|
|
2302
|
-
this.selectedDateRange.endDate = this.dayjs().format('MM-DD-YYYY');
|
|
2303
|
-
}
|
|
2304
|
-
}
|
|
2265
|
+
ngOnInit() { }
|
|
2305
2266
|
onClientSelect(event) {
|
|
2306
2267
|
this.selectedClient = event;
|
|
2307
2268
|
this.gs.selectedClient.next(this.selectedClient);
|
|
2308
2269
|
}
|
|
2309
2270
|
ranges = {
|
|
2310
|
-
|
|
2311
|
-
|
|
2312
|
-
|
|
2313
|
-
|
|
2314
|
-
|
|
2315
|
-
|
|
2316
|
-
|
|
2317
|
-
this.dayjs().subtract(
|
|
2318
|
-
|
|
2271
|
+
Today: [this.dayjs(), this.dayjs()],
|
|
2272
|
+
Yesterday: [
|
|
2273
|
+
this.dayjs().subtract(1, "days"),
|
|
2274
|
+
this.dayjs().subtract(1, "days"),
|
|
2275
|
+
],
|
|
2276
|
+
"This Week": [this.dayjs().subtract(6, "days"), this.dayjs()],
|
|
2277
|
+
"Last Week": [
|
|
2278
|
+
this.dayjs().subtract(14, "days").startOf("days"),
|
|
2279
|
+
this.dayjs().subtract(8, "days").endOf("days"),
|
|
2280
|
+
],
|
|
2281
|
+
"This Month": [this.dayjs().startOf("month"), this.dayjs().endOf("month")],
|
|
2282
|
+
"Last Month": [
|
|
2283
|
+
this.dayjs().subtract(1, "month").startOf("month"),
|
|
2284
|
+
this.dayjs().subtract(1, "month").endOf("month"),
|
|
2285
|
+
],
|
|
2319
2286
|
};
|
|
2320
2287
|
onStartDateChange(event) {
|
|
2321
2288
|
if (this.dayjs(event.startDate).isValid()) {
|
|
2322
2289
|
this.isCustomDate = (m) => {
|
|
2323
|
-
const isValidDate = m > this.dayjs() || m > this.dayjs(event.startDate.add(90,
|
|
2324
|
-
return isValidDate ?
|
|
2290
|
+
const isValidDate = m > this.dayjs() || m > this.dayjs(event.startDate.add(90, "days"));
|
|
2291
|
+
return isValidDate ? "invalid-date" : false;
|
|
2325
2292
|
};
|
|
2326
2293
|
}
|
|
2327
2294
|
}
|
|
2328
2295
|
datechange(event) {
|
|
2329
2296
|
if (event && event.startDate && event.endDate) {
|
|
2330
|
-
if (this.dayjs(event.startDate).isValid() &&
|
|
2331
|
-
|
|
2332
|
-
this.selectedDateRange.startDate = this.dayjs(event.startDate)
|
|
2333
|
-
|
|
2297
|
+
if (this.dayjs(event.startDate).isValid() &&
|
|
2298
|
+
this.dayjs(event.endDate).isValid()) {
|
|
2299
|
+
this.selectedDateRange.startDate = this.dayjs(event.startDate)
|
|
2300
|
+
.utc()
|
|
2301
|
+
.format("YYYY-MM-DD");
|
|
2302
|
+
this.selectedDateRange.endDate = this.dayjs(event.endDate)
|
|
2303
|
+
.utc()
|
|
2304
|
+
.format("YYYY-MM-DD");
|
|
2334
2305
|
}
|
|
2335
2306
|
else {
|
|
2336
|
-
// Dates are not valid, handle the scenario accordingly
|
|
2337
|
-
console.error('Invalid dates provided:', event.startDate, event.endDate);
|
|
2338
|
-
// If you want to fallback to stored filters when the dates are invalid, you can keep the existing logic
|
|
2339
2307
|
// const storedFilters = JSON.parse(localStorage.getItem('dateRangeFilters') || '{}');
|
|
2340
2308
|
// if (storedFilters.startDate && storedFilters.endDate) {
|
|
2341
2309
|
// this.selectedDateRange.startDate = dayjs(storedFilters.startDate).format('DD-MM-YYYY');
|
|
@@ -2348,9 +2316,6 @@ class DateSingleSelectComponent {
|
|
|
2348
2316
|
this.selectedFilters.date = headerFilters.date;
|
|
2349
2317
|
}
|
|
2350
2318
|
this.selectedFilters.date = this.selectedDateRange;
|
|
2351
|
-
// this.globalService.sendData(JSON.stringify(this.selectedFilters.date));
|
|
2352
|
-
// localStorage.setItem('dateRangeFilters', JSON.stringify(this.selectedDateRange));
|
|
2353
|
-
// this.globalService.sendData(this.selectedDateRange);
|
|
2354
2319
|
}
|
|
2355
2320
|
Apply() {
|
|
2356
2321
|
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
@@ -2358,14 +2323,14 @@ class DateSingleSelectComponent {
|
|
|
2358
2323
|
this.selectedFilters.client = this.selectedClient.clientId;
|
|
2359
2324
|
this.selectedFilters.date = this.selectedDateRange;
|
|
2360
2325
|
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2361
|
-
localStorage.setItem(
|
|
2326
|
+
localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
|
|
2362
2327
|
}
|
|
2363
2328
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DateSingleSelectComponent, deps: [{ token: AuthService }, { token: GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2364
2329
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", 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\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\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:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.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: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.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"] }] });
|
|
2365
2330
|
}
|
|
2366
2331
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DateSingleSelectComponent, decorators: [{
|
|
2367
2332
|
type: Component,
|
|
2368
|
-
args: [{ selector:
|
|
2333
|
+
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\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\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:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"] }]
|
|
2369
2334
|
}], ctorParameters: () => [{ type: AuthService }, { type: GlobalStateService }, { type: i0.ChangeDetectorRef }] });
|
|
2370
2335
|
|
|
2371
2336
|
class SingleStoreComponent {
|
|
@@ -2401,17 +2366,19 @@ class SingleStoreComponent {
|
|
|
2401
2366
|
this.storeList.find((obj) => {
|
|
2402
2367
|
if (obj.storeId === headerFilters.store) {
|
|
2403
2368
|
this.selectedClient = obj;
|
|
2404
|
-
|
|
2369
|
+
console.log("1111111111111");
|
|
2370
|
+
// this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2405
2371
|
}
|
|
2406
|
-
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2407
|
-
this.selectedFilters.store = headerFilters.store;
|
|
2408
|
-
this.selectedFilters.client = headerFilters.client;
|
|
2409
|
-
this.selectedFilters.clients = [headerFilters.clients];
|
|
2410
|
-
this.selectedFilters.date = headerFilters.date;
|
|
2411
|
-
this.selectedDateRange.startDate = headerFilters.date.startDate;
|
|
2412
|
-
this.selectedDateRange.endDate = headerFilters.date.endDate;
|
|
2413
|
-
this.cd.detectChanges();
|
|
2414
2372
|
});
|
|
2373
|
+
// console.log("222222222222222");
|
|
2374
|
+
this.selectedFilters.store = headerFilters.store;
|
|
2375
|
+
this.selectedFilters.client = headerFilters.client;
|
|
2376
|
+
this.selectedFilters.clients = [headerFilters.clients];
|
|
2377
|
+
this.selectedFilters.date = headerFilters.date;
|
|
2378
|
+
this.selectedDateRange.startDate = headerFilters.date.startDate;
|
|
2379
|
+
this.selectedDateRange.endDate = headerFilters.date.endDate;
|
|
2380
|
+
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2381
|
+
this.cd.detectChanges();
|
|
2415
2382
|
}
|
|
2416
2383
|
else {
|
|
2417
2384
|
this.selectedClient = this.storeList[0];
|
|
@@ -2419,6 +2386,7 @@ class SingleStoreComponent {
|
|
|
2419
2386
|
this.selectedDateRange.startDate = this.dayjs().format('YYYY-MM-DD');
|
|
2420
2387
|
this.selectedDateRange.endDate = this.dayjs().format('YYYY-MM-DD');
|
|
2421
2388
|
this.selectedFilters.date = this.selectedDateRange;
|
|
2389
|
+
console.log("33333333333333");
|
|
2422
2390
|
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2423
2391
|
this.cd.detectChanges();
|
|
2424
2392
|
}
|
|
@@ -2429,7 +2397,7 @@ class SingleStoreComponent {
|
|
|
2429
2397
|
}
|
|
2430
2398
|
onClientSelect(event) {
|
|
2431
2399
|
this.selectedClient = event;
|
|
2432
|
-
this.gs.selectedClient.next(this.selectedClient)
|
|
2400
|
+
// this.gs.selectedClient.next(this.selectedClient)
|
|
2433
2401
|
}
|
|
2434
2402
|
ranges = {
|
|
2435
2403
|
'Today': [this.dayjs(), this.dayjs()],
|
|
@@ -2453,12 +2421,10 @@ class SingleStoreComponent {
|
|
|
2453
2421
|
datechange(event) {
|
|
2454
2422
|
if (event && event.startDate && event.endDate) {
|
|
2455
2423
|
if (this.dayjs(event.startDate).isValid() && this.dayjs(event.endDate).isValid()) {
|
|
2456
|
-
// Dates are valid, proceed with formatting
|
|
2457
2424
|
this.selectedDateRange.startDate = this.dayjs(event.startDate).utc().format('YYYY-MM-DD');
|
|
2458
2425
|
this.selectedDateRange.endDate = this.dayjs(event.endDate).utc().format('YYYY-MM-DD');
|
|
2459
2426
|
}
|
|
2460
2427
|
else {
|
|
2461
|
-
console.error('Invalid dates provided:', event.startDate, event.endDate);
|
|
2462
2428
|
}
|
|
2463
2429
|
}
|
|
2464
2430
|
else {
|
|
@@ -2466,15 +2432,13 @@ class SingleStoreComponent {
|
|
|
2466
2432
|
this.selectedFilters.date = headerFilters.date;
|
|
2467
2433
|
}
|
|
2468
2434
|
this.selectedFilters.date = this.selectedDateRange;
|
|
2469
|
-
// this.globalService.sendData(JSON.stringify(this.selectedFilters.date));
|
|
2470
|
-
// localStorage.setItem('dateRangeFilters', JSON.stringify(this.selectedDateRange));
|
|
2471
|
-
// this.globalService.sendData(this.selectedDateRange);
|
|
2472
2435
|
}
|
|
2473
2436
|
Apply() {
|
|
2474
2437
|
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
2475
2438
|
this.selectedFilters = headerFilters;
|
|
2476
2439
|
this.selectedFilters.store = this.selectedClient.storeId;
|
|
2477
2440
|
this.selectedFilters.date = this.selectedDateRange;
|
|
2441
|
+
console.log("4444444444444444");
|
|
2478
2442
|
this.gs.dataRangeValue.next(this.selectedFilters);
|
|
2479
2443
|
localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
|
|
2480
2444
|
}
|
|
@@ -2491,6 +2455,7 @@ class ToolbarComponent {
|
|
|
2491
2455
|
router;
|
|
2492
2456
|
route;
|
|
2493
2457
|
gs;
|
|
2458
|
+
pageInfo;
|
|
2494
2459
|
unsubscribe = [];
|
|
2495
2460
|
// Public props
|
|
2496
2461
|
currentLayoutType;
|
|
@@ -2515,11 +2480,12 @@ class ToolbarComponent {
|
|
|
2515
2480
|
singleStore;
|
|
2516
2481
|
headervalue;
|
|
2517
2482
|
storeId;
|
|
2518
|
-
constructor(layout, router, route, gs) {
|
|
2483
|
+
constructor(layout, router, route, gs, pageInfo) {
|
|
2519
2484
|
this.layout = layout;
|
|
2520
2485
|
this.router = router;
|
|
2521
2486
|
this.route = route;
|
|
2522
2487
|
this.gs = gs;
|
|
2488
|
+
this.pageInfo = pageInfo;
|
|
2523
2489
|
}
|
|
2524
2490
|
ngOnInit() {
|
|
2525
2491
|
// let data:any = JSON.parse(localStorage.getItem('header-filters') || '');
|
|
@@ -2568,73 +2534,86 @@ class ToolbarComponent {
|
|
|
2568
2534
|
ngOnDestroy() {
|
|
2569
2535
|
this.unsubscribe.forEach((sb) => sb.unsubscribe());
|
|
2570
2536
|
}
|
|
2537
|
+
setPageData(storeId) {
|
|
2538
|
+
this.pageInfo.setTitle("Tickets");
|
|
2539
|
+
this.pageInfo.setDescription("View, share, download and benchmark the stores performance in one screen");
|
|
2540
|
+
this.pageInfo.setBreadcrumbs([
|
|
2541
|
+
{ title: "Manage", path: "/manage", isActive: false, isSeparator: false },
|
|
2542
|
+
{ title: "Manage", path: "/manage", isActive: false, isSeparator: true },
|
|
2543
|
+
{
|
|
2544
|
+
title: "Stores",
|
|
2545
|
+
path: "/manage/stores",
|
|
2546
|
+
isActive: false,
|
|
2547
|
+
isSeparator: false,
|
|
2548
|
+
},
|
|
2549
|
+
{
|
|
2550
|
+
title: "Stores",
|
|
2551
|
+
path: "/manage/stores",
|
|
2552
|
+
isActive: false,
|
|
2553
|
+
isSeparator: true,
|
|
2554
|
+
},
|
|
2555
|
+
{
|
|
2556
|
+
title: storeId,
|
|
2557
|
+
path: "/manage/stores/" + storeId,
|
|
2558
|
+
isActive: false,
|
|
2559
|
+
isSeparator: false,
|
|
2560
|
+
},
|
|
2561
|
+
{
|
|
2562
|
+
title: storeId,
|
|
2563
|
+
path: "/manage/stores" + storeId,
|
|
2564
|
+
isActive: false,
|
|
2565
|
+
isSeparator: true,
|
|
2566
|
+
},
|
|
2567
|
+
]);
|
|
2568
|
+
}
|
|
2571
2569
|
showPageTitle() {
|
|
2572
2570
|
if ("header-filters" in localStorage) {
|
|
2573
2571
|
const data = JSON.parse(localStorage.getItem("header-filters") || "{}");
|
|
2574
2572
|
this.storeId = data.store;
|
|
2573
|
+
this.setPageData(this.storeId);
|
|
2574
|
+
// Construct the new URL with the updated storeId
|
|
2575
|
+
const currentUrl = this.router.url;
|
|
2576
|
+
const updatedUrl = currentUrl.replace(/\/manage\/stores\/\d+-\d+\//, `/manage/stores/${this.storeId}/`);
|
|
2577
|
+
// Navigate to the updated URL
|
|
2578
|
+
this.router.navigateByUrl(updatedUrl);
|
|
2575
2579
|
}
|
|
2576
|
-
|
|
2580
|
+
const url = this.router.url.split("/");
|
|
2577
2581
|
if (url[2] == 'settings') {
|
|
2578
|
-
|
|
2579
|
-
this.singleSelect = true;
|
|
2580
|
-
this.multiSelect = false;
|
|
2581
|
-
this.datepicker = false;
|
|
2582
|
-
this.singleStore = false;
|
|
2583
|
-
this.singleSelectdatepicker = false;
|
|
2582
|
+
this.setUIProperties(true, false, false, false, false);
|
|
2584
2583
|
}
|
|
2585
2584
|
else if (this.router.url == "/manage/brands") {
|
|
2586
|
-
this.
|
|
2587
|
-
this.multiSelect = false;
|
|
2588
|
-
this.datepicker = false;
|
|
2589
|
-
this.singleStore = false;
|
|
2590
|
-
this.singleSelectdatepicker = false;
|
|
2585
|
+
this.setUIProperties(false, false, false, false, false);
|
|
2591
2586
|
}
|
|
2592
|
-
else if (this.router.url == "/manage/users" || this.router.url == "/manage/stores" || this.router.url == "/manage/stores/addition-method"
|
|
2593
|
-
this.
|
|
2594
|
-
this.multiSelect = false;
|
|
2595
|
-
this.datepicker = false;
|
|
2596
|
-
this.singleStore = false;
|
|
2597
|
-
this.singleSelectdatepicker = true;
|
|
2587
|
+
else if (this.router.url == "/manage/users" || this.router.url == "/manage/stores" || this.router.url == "/manage/stores/addition-method") {
|
|
2588
|
+
this.setUIProperties(false, false, false, false, true);
|
|
2598
2589
|
}
|
|
2599
2590
|
else if (this.router.url == `/manage/stores/${this.storeId}/infra-ticket` || this.router.url == `/manage/stores/${this.storeId}/settings`) {
|
|
2600
|
-
this.
|
|
2601
|
-
this.multiSelect = false;
|
|
2602
|
-
this.datepicker = false;
|
|
2603
|
-
this.singleSelectdatepicker = false;
|
|
2604
|
-
this.singleStore = true;
|
|
2591
|
+
this.setUIProperties(false, false, false, true, false);
|
|
2605
2592
|
}
|
|
2606
2593
|
else if (this.router.url == "/profile") {
|
|
2607
|
-
this.
|
|
2608
|
-
this.multiSelect = false;
|
|
2609
|
-
this.datepicker = false;
|
|
2610
|
-
this.singleStore = false;
|
|
2611
|
-
this.singleSelectdatepicker = false;
|
|
2594
|
+
this.setUIProperties(false, false, false, false, false);
|
|
2612
2595
|
}
|
|
2613
2596
|
else {
|
|
2614
|
-
this.
|
|
2615
|
-
this.multiSelect = true;
|
|
2616
|
-
this.datepicker = false;
|
|
2617
|
-
this.singleSelectdatepicker = false;
|
|
2618
|
-
this.singleStore = false;
|
|
2597
|
+
this.setUIProperties(false, true, false, false, false);
|
|
2619
2598
|
}
|
|
2620
|
-
// else if (this.router.url == "/manage/users") {
|
|
2621
|
-
// this.singleSelect = false;
|
|
2622
|
-
// this.multiSelect = false;
|
|
2623
|
-
// this.datepicker = true;
|
|
2624
|
-
// this.singleStore =false
|
|
2625
|
-
// this.singleSelectdatepicker = false;
|
|
2626
|
-
// }
|
|
2627
2599
|
const viewsWithPageTitles = ["classic", "reports", "saas"];
|
|
2628
2600
|
return (this.appPageTitleDisplay &&
|
|
2629
2601
|
viewsWithPageTitles.some((t) => t === this.appToolbarLayout));
|
|
2630
2602
|
}
|
|
2631
|
-
|
|
2603
|
+
setUIProperties(singleSelect, multiSelect, datepicker, singleStore, singleSelectdatepicker) {
|
|
2604
|
+
this.singleSelect = singleSelect;
|
|
2605
|
+
this.multiSelect = multiSelect;
|
|
2606
|
+
this.datepicker = datepicker;
|
|
2607
|
+
this.singleStore = singleStore;
|
|
2608
|
+
this.singleSelectdatepicker = singleSelectdatepicker;
|
|
2609
|
+
}
|
|
2610
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1.LayoutService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: GlobalStateService }, { token: i1.PageInfoService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2632
2611
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", 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=\"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\">\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\">\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\">\r\n <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelectdatepicker\">\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</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" }] });
|
|
2633
2612
|
}
|
|
2634
2613
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, decorators: [{
|
|
2635
2614
|
type: Component,
|
|
2636
2615
|
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=\"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\">\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\">\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\">\r\n <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelectdatepicker\">\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</div>\r\n<!--end::Toolbar container-->\r\n" }]
|
|
2637
|
-
}], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: GlobalStateService }], propDecorators: { currentLayoutType: [{
|
|
2616
|
+
}], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: GlobalStateService }, { type: i1.PageInfoService }], propDecorators: { currentLayoutType: [{
|
|
2638
2617
|
type: Input
|
|
2639
2618
|
}], appToolbarLayout: [{
|
|
2640
2619
|
type: Input
|