diff --git a/projects/swimlane/ngx-ui/CHANGELOG.md b/projects/swimlane/ngx-ui/CHANGELOG.md index 08821bdc8..5256932fe 100644 --- a/projects/swimlane/ngx-ui/CHANGELOG.md +++ b/projects/swimlane/ngx-ui/CHANGELOG.md @@ -2,6 +2,9 @@ ## HEAD (unreleased) +- Fix (`ngx-date-range-picker`): Preset values now retain their relative expressions when cancel is clicked, instead of being converted to timestamps +- Fix (`ngx-date-range-picker`): Fix highlight the date for given `selectedRange` values. + ## 50.1.3 (2025-09-23) - Fix (`ngx-multi-dimension-selection`): Show children of items matching search term diff --git a/projects/swimlane/ngx-ui/src/lib/components/date-range-calendar/date-range-picker.component.spec.ts b/projects/swimlane/ngx-ui/src/lib/components/date-range-calendar/date-range-picker.component.spec.ts index c5bb1b01c..5b5b3317b 100644 --- a/projects/swimlane/ngx-ui/src/lib/components/date-range-calendar/date-range-picker.component.spec.ts +++ b/projects/swimlane/ngx-ui/src/lib/components/date-range-calendar/date-range-picker.component.spec.ts @@ -139,7 +139,12 @@ describe('DateRangePickerComponent', () => { it('should reset to last confirmed range onCancel when present', () => { const confirmedStart = new Date('2023-01-01'); const confirmedEnd = new Date('2023-01-10'); - component.lastConfirmedRange = { startDate: confirmedStart, endDate: confirmedEnd }; + component.lastConfirmedRange = { + startDate: confirmedStart, + endDate: confirmedEnd, + startRaw: '2023-01-01', + endRaw: '2023-01-10' + }; spyOn(component.cancel, 'emit'); component.onCancel(); expect(component.form.startDate).toEqual(confirmedStart); diff --git a/projects/swimlane/ngx-ui/src/lib/components/date-range-calendar/date-range-picker.component.ts b/projects/swimlane/ngx-ui/src/lib/components/date-range-calendar/date-range-picker.component.ts index 7a26dba3f..4990e9591 100644 --- a/projects/swimlane/ngx-ui/src/lib/components/date-range-calendar/date-range-picker.component.ts +++ b/projects/swimlane/ngx-ui/src/lib/components/date-range-calendar/date-range-picker.component.ts @@ -80,7 +80,7 @@ export class DateRangePickerComponent implements OnInit, OnChanges { @ViewChild('wrapperRef', { static: false }) wrapperRef!: DropdownComponent; private readonly dateFormat: string = 'yyyy-MM-dd HH:mm:ss'; - lastConfirmedRange: { startDate: Date; endDate: Date } = null; + lastConfirmedRange: { startDate: Date; endDate: Date; startRaw: string; endRaw: string } = null; form: DateRangeForm = { startRaw: '', endRaw: '', startDate: null, endDate: null }; @@ -154,12 +154,15 @@ export class DateRangePickerComponent implements OnInit, OnChanges { : this.selectedRange.end; this.lastConfirmedRange = { startDate, - endDate + endDate, + startRaw: this.selectedRange.start, + endRaw: this.selectedRange.end }; this.form.startRaw = this.selectedRange.start; this.form.endRaw = this.selectedRange.end; this.form.startDate = startDate; this.form.endDate = endDate; + this.rangeModel = { startDate, endDate }; this.setTooltipDate(startDate, endDate); } } @@ -284,7 +287,9 @@ export class DateRangePickerComponent implements OnInit, OnChanges { if (this.form.startDate && this.form.endDate) { this.lastConfirmedRange = { startDate: this.form.startDate, - endDate: this.form.endDate + endDate: this.form.endDate, + startRaw: this.form.startRaw, + endRaw: this.form.endRaw }; this.updateSelectedLabel(); this.apply.emit({ @@ -304,10 +309,13 @@ export class DateRangePickerComponent implements OnInit, OnChanges { this.form = { startDate: this.lastConfirmedRange.startDate, endDate: this.lastConfirmedRange.endDate, - startRaw: format(this.lastConfirmedRange.startDate, this.dateFormat), - endRaw: format(this.lastConfirmedRange.endDate, this.dateFormat) + startRaw: this.lastConfirmedRange.startRaw, + endRaw: this.lastConfirmedRange.endRaw + }; + this.rangeModel = { + startDate: this.lastConfirmedRange.startDate, + endDate: this.lastConfirmedRange.endDate }; - this.rangeModel = { ...this.lastConfirmedRange }; } else { // First-time cancel before any apply: reset form this.form = {