agmission/Development/client/src/app/shared/date-range-control/date-range-control.component.ts

71 lines
2.3 KiB
TypeScript

import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { FormControl } from '@angular/forms';
import { DateUtils } from '../utils';
export interface DateRangeSelection {
startDate: Date;
endDate: Date;
}
@Component({
selector: 'agm-date-range-control',
templateUrl: './date-range-control.component.html',
styleUrls: ['./date-range-control.component.scss']
})
export class DateRangeControlComponent implements OnInit {
@Output() rangeChange = new EventEmitter<DateRangeSelection>();
readonly maxRangeDays = 90;
readonly maxDate = DateUtils.startOfDay(new Date());
readonly minDate = DateUtils.addDays(this.maxDate, -(this.maxRangeDays - 1));
readonly dateRangeControl = new FormControl([]);
ngOnInit(): void {
const defaultRange = this.getCurrentWeekRange();
this.dateRangeControl.setValue(defaultRange);
this.emitIfRangeComplete(defaultRange);
}
onRangeSelected(range: Date[]): void {
if (!Array.isArray(range) || range.length < 2 || !range[0] || !range[1]) {
return;
}
const startDate = DateUtils.startOfDay(range[0]);
const selectedEndDate = DateUtils.startOfDay(range[1]);
const maxEndDate = DateUtils.addDays(startDate, this.maxRangeDays - 1);
const endDate = selectedEndDate > maxEndDate ? maxEndDate : selectedEndDate;
if (endDate.getTime() !== selectedEndDate.getTime()) {
const clampedRange = [startDate, endDate];
this.dateRangeControl.setValue(clampedRange, { emitEvent: false });
this.emitIfRangeComplete(clampedRange);
return;
}
this.emitIfRangeComplete([startDate, endDate]);
}
private emitIfRangeComplete(range: Date[]): void {
if (!Array.isArray(range) || range.length < 2 || !range[0] || !range[1]) {
return;
}
this.rangeChange.emit({
startDate: DateUtils.startOfDay(range[0]),
endDate: DateUtils.startOfDay(range[1])
});
}
private getCurrentWeekRange(): Date[] {
const today = DateUtils.startOfDay(new Date());
const day = today.getDay(); // 0=Sun, 1=Mon, ..., 6=Sat
const daysSinceMonday = day === 0 ? 6 : day - 1;
const monday = DateUtils.addDays(today, -daysSinceMonday);
const sunday = DateUtils.addDays(monday, 6);
const endDate = sunday > today ? today : sunday;
return [monday, endDate];
}
}