calendar
unknown
jsx
2 years ago
1.2 kB
2
Indexable
Never
@Component class CalendarExample extends VueComponent { interval: DateInterval = weekInterval /** * Пример реализации простой логики выбора периода */ handleDayClick(day: Date) { if (this.interval.start) { if (this.interval.end) { this.interval.start = day this.interval.end = null } else { if (isBefore(day, this.interval.start)) { this.interval.end = this.interval.start this.interval.start = day } else { this.interval.end = day } } } else { if (!this.interval.end) { this.interval.start = day } } } isDisabled(day: Date) { if (this.interval.start && !this.interval.end) { return isBefore(addWeeks(this.interval.start, 1), day) || isAfter(this.interval.start, day) } return false } render() { return ( <Calendar renderDay={(context) => { return ( <CalendarDay key={context.day.toLocaleDateString()} whenDayClick={this.handleDayClick} context={context} isDisabled={this.isDisabled(context.day)} selected={this.interval} /> )}} /> ) } }