Skip to content

Commit 0413d99

Browse files
ManukMinasyanManukMinasyan
committed
Minimum and maximum selected dates functionality (Imporvments)
1 parent a9f5108 commit 0413d99

File tree

3 files changed

+58
-20
lines changed

3 files changed

+58
-20
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
},
77
"name": "vue-functional-calendar",
88
"description": "Lightweight, high-performance calendar component based on Vue.js",
9-
"version": "2.7.6",
9+
"version": "2.7.7",
1010
"license": "MIT",
1111
"repository": {
1212
"type": "git",

‎src/Demo.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<div>
3-
<functional-calendar class="demo-calendar" :is-date-range="true" :min-sel-days="3" :max-sel-days="5">
3+
<functional-calendar class="demo-calendar" :is-date-range="true" :min-sel-days="3" :max-sel-days="6">
44

55
</functional-calendar>
66
<FunctionalCalendar class="demo-calendar"

‎src/components/FunctionalCalendar.vue

Lines changed: 56 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -521,12 +521,12 @@
521521
// Maximum Selected Days
522522
let maxSelDays = this.fConfigs.maxSelDays;
523523
524-
if (maxSelDays && itemTime >= startDate.getTime() && diffDays > maxSelDays) {
524+
if (maxSelDays && itemTime >= startDate.getTime() && diffDays >= maxSelDays) {
525525
startDate.setDate(startDate.getDate() + (maxSelDays - 1));
526526
this.calendar.dateRange.end.date = helpCalendar.formatDate(startDate);
527527
}
528528
529-
if (maxSelDays && itemTime < startDate.getTime() && diffDays > maxSelDays) {
529+
if (maxSelDays && itemTime < startDate.getTime() && diffDays >= maxSelDays) {
530530
startDate.setDate(startDate.getDate() - (maxSelDays - 1));
531531
this.calendar.dateRange.start.date = helpCalendar.formatDate(startDate);
532532
}
@@ -659,10 +659,10 @@
659659
if (this.calendar.dateRange.start.date) {
660660
let itemDate = helpCalendar.getDateFromFormat(item.date).getTime();
661661
let thisDate = helpCalendar.getDateFromFormat(date).getTime();
662-
let startDate = helpCalendar.getDateFromFormat(this.calendar.dateRange.start.date).getTime();
662+
let startDate = helpCalendar.getDateFromFormat(this.calendar.dateRange.start.date);
663663
664-
this.listCalendars[e].weeks[f].days[i].isMouseToLeft = (itemDate === startDate && thisDate > startDate) || (itemDate === thisDate && thisDate < startDate);
665-
this.listCalendars[e].weeks[f].days[i].isMouseToRight = (itemDate === startDate && thisDate < startDate) || (itemDate === thisDate && thisDate > startDate);
664+
this.listCalendars[e].weeks[f].days[i].isMouseToLeft = (itemDate === startDate.getTime() && thisDate > startDate.getTime()) || (itemDate === thisDate && thisDate < startDate.getTime());
665+
this.listCalendars[e].weeks[f].days[i].isMouseToRight = (itemDate === startDate.getTime() && thisDate < startDate.getTime()) || (itemDate === thisDate && thisDate > startDate.getTime());
666666
667667
let dateDay = helpCalendar.getDateFromFormat(item.date).getDay() - 1;
668668
if (dateDay === -1) {
@@ -671,24 +671,62 @@
671671
672672
let dayOfWeekString = this.fConfigs.dayNames[dateDay];
673673
if (!this.fConfigs.disabledDayNames.includes(dayOfWeekString) &&
674-
((itemDate > startDate && itemDate < thisDate)
674+
((itemDate > startDate.getTime() && itemDate < thisDate)
675675
||
676-
(itemDate < startDate && itemDate > thisDate))
676+
(itemDate < startDate.getTime() && itemDate > thisDate))
677677
) {
678678
this.listCalendars[e].weeks[f].days[i].isMarked = true;
679679
}
680680
681+
if (!this.calendar.dateRange.end.date && itemDate === thisDate) {
682+
this.listCalendars[e].weeks[f].days[i].isHovered = true;
683+
}
684+
681685
if (this.checkSelDates('min', this.calendar.dateRange.start.date, item.date, date)) {
682686
this.listCalendars[e].weeks[f].days[i].isMarked = true;
687+
688+
let minDateToRight, minDateToLeft;
689+
minDateToLeft = new Date(startDate.getTime());
690+
minDateToRight = new Date(startDate.getTime());
691+
minDateToLeft.setDate(minDateToLeft.getDate() - this.fConfigs.minSelDays + 1);
692+
minDateToRight.setDate(minDateToRight.getDate() + this.fConfigs.minSelDays - 1);
693+
694+
if (thisDate >= minDateToLeft.getTime() && helpCalendar.formatDate(minDateToLeft) === item.date) {
695+
this.listCalendars[e].weeks[f].days[i].isMarked = false;
696+
this.listCalendars[e].weeks[f].days[i].isMouseToLeft = true;
697+
this.listCalendars[e].weeks[f].days[i].isHovered = true;
698+
} else if (thisDate <= minDateToRight.getTime() && helpCalendar.formatDate(minDateToRight) === item.date) {
699+
this.listCalendars[e].weeks[f].days[i].isMarked = false;
700+
this.listCalendars[e].weeks[f].days[i].isMouseToRight = true;
701+
this.listCalendars[e].weeks[f].days[i].isHovered = true;
702+
}
683703
}
684704
685705
if (this.checkSelDates('max', this.calendar.dateRange.start.date, item.date, date)) {
686706
this.listCalendars[e].weeks[f].days[i].isMarked = false;
687-
}
688-
689-
if (!this.calendar.dateRange.end.date && itemDate === thisDate) {
690-
this.listCalendars[e].weeks[f].days[i].isHovered = true;
691-
707+
this.listCalendars[e].weeks[f].days[i].isHovered = false;
708+
this.listCalendars[e].weeks[f].days[i].isMouseToLeft = false;
709+
this.listCalendars[e].weeks[f].days[i].isMouseToRight = false;
710+
711+
let maxDateToLeft, maxDateToRight;
712+
maxDateToLeft = new Date(startDate.getTime());
713+
maxDateToRight = new Date(startDate.getTime());
714+
maxDateToLeft.setDate(maxDateToLeft.getDate() - this.fConfigs.maxSelDays + 1);
715+
maxDateToRight.setDate(maxDateToRight.getDate() + this.fConfigs.maxSelDays - 1);
716+
717+
if (thisDate <= maxDateToLeft.getTime()) {
718+
if (helpCalendar.formatDate(maxDateToLeft) === item.date) {
719+
this.listCalendars[e].weeks[f].days[i].isHovered = true;
720+
this.listCalendars[e].weeks[f].days[i].isMouseToLeft = true;
721+
}
722+
}
723+
724+
if (thisDate >= maxDateToRight.getTime()) {
725+
if (helpCalendar.formatDate(maxDateToRight) === item.date) {
726+
this.listCalendars[e].weeks[f].days[i].isHovered = true;
727+
this.listCalendars[e].weeks[f].days[i].isMouseToRight = true;
728+
}
729+
}
692730
}
693731
}
694732
}
@@ -962,25 +1000,25 @@
9621000
let itemTime = helpCalendar.getDateFromFormat(itemDate).getTime();
9631001
let hoverTime = helpCalendar.getDateFromFormat(hoverDate).getTime();
9641002
965-
let days = type === 'min' ? this.fConfigs.minSelDays : this.fConfigs.maxSelDays - 1;
1003+
let days = type === 'min' ? this.fConfigs.minSelDays : this.fConfigs.maxSelDays - 2;
9661004
let minTime = days * 1000 * 60 * 60 * 24;
9671005
let rightTime = startTime + minTime;
9681006
let leftTime = startTime - minTime;
9691007
9701008
let result;
9711009
if (hoverTime > startTime) {
9721010
if (type === 'min')
973-
result = itemTime < rightTime && itemTime > startTime;
1011+
result = itemTime < rightTime && itemTime > startTime && this.fConfigs.minSelDays;
9741012
else
975-
result = itemTime > rightTime && itemTime > startTime;
1013+
result = itemTime > rightTime && itemTime > startTime && this.fConfigs.maxSelDays;
9761014
} else if (hoverTime < startTime) {
9771015
if (type === 'min')
978-
result = itemTime > leftTime && itemTime < startTime;
1016+
result = itemTime > leftTime && itemTime < startTime && this.fConfigs.minSelDays;
9791017
else
980-
result = itemTime < leftTime && itemTime < startTime;
1018+
result = itemTime < leftTime && itemTime < startTime && this.fConfigs.maxSelDays;
9811019
}
9821020
983-
return days && result;
1021+
return result;
9841022
},
9851023
checkLimits(value) {
9861024
if (this.fConfigs.limits) {

0 commit comments

Comments
 (0)