tango-app-ui-shared 3.0.16-dev → 3.0.17-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 +41 -51
- package/esm2022/lib/modules/layout/toolbar/datepicker/datepicker.component.mjs +12 -21
- package/esm2022/lib/modules/layout/toolbar/single-store/single-store.component.mjs +1 -6
- package/fesm2022/tango-app-ui-shared.mjs +49 -89
- 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/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
2242
|
this.cd.detectChanges();
|
|
2269
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);
|
|
2270
2250
|
});
|
|
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 {
|
|
@@ -2453,12 +2418,10 @@ class SingleStoreComponent {
|
|
|
2453
2418
|
datechange(event) {
|
|
2454
2419
|
if (event && event.startDate && event.endDate) {
|
|
2455
2420
|
if (this.dayjs(event.startDate).isValid() && this.dayjs(event.endDate).isValid()) {
|
|
2456
|
-
// Dates are valid, proceed with formatting
|
|
2457
2421
|
this.selectedDateRange.startDate = this.dayjs(event.startDate).utc().format('YYYY-MM-DD');
|
|
2458
2422
|
this.selectedDateRange.endDate = this.dayjs(event.endDate).utc().format('YYYY-MM-DD');
|
|
2459
2423
|
}
|
|
2460
2424
|
else {
|
|
2461
|
-
console.error('Invalid dates provided:', event.startDate, event.endDate);
|
|
2462
2425
|
}
|
|
2463
2426
|
}
|
|
2464
2427
|
else {
|
|
@@ -2466,9 +2429,6 @@ class SingleStoreComponent {
|
|
|
2466
2429
|
this.selectedFilters.date = headerFilters.date;
|
|
2467
2430
|
}
|
|
2468
2431
|
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
2432
|
}
|
|
2473
2433
|
Apply() {
|
|
2474
2434
|
const headerFilters = JSON.parse(localStorage.getItem("header-filters") || "{}");
|