CASH-2378: refactoring date picker to move several functions into helper so they can be used elsewhere
This commit is contained in:
Adam Caouette
parent
bbfaf75c87
commit
f686b684ce
2 changed files with 138 additions and 136 deletions
|
|
@ -153,6 +153,8 @@ import {
|
|||
convertDateToDateString,
|
||||
convertDateStringToDate,
|
||||
getTodayDateString,
|
||||
getInitialViewWeeks,
|
||||
getMonthEnd,
|
||||
} from "@/layouts/schedule/helpers/schedule-helper";
|
||||
import { useField, ErrorMessage } from "vee-validate";
|
||||
import { deepClone } from "@/helpers/object-helper";
|
||||
|
|
@ -291,140 +293,6 @@ export default {
|
|||
}
|
||||
this.$emit("date-selected", date);
|
||||
},
|
||||
getWeekStartDate(dateString) {
|
||||
const date = convertDateStringToDate(dateString);
|
||||
const dayOfWeek = date.getDay();
|
||||
// Subtract the day of the week from date to get the date of Sunday
|
||||
const sunday = new Date(date);
|
||||
sunday.setDate(sunday.getDate() - dayOfWeek);
|
||||
return convertDateToDateString(sunday);
|
||||
},
|
||||
getWeekEndDate(dateString) {
|
||||
const date = convertDateStringToDate(dateString);
|
||||
const dayOfWeek = date.getDay();
|
||||
const daysUntilSaturday = 6 - dayOfWeek; // Calculate the number of days until Saturday
|
||||
// Clone the given date and add the remaining days until Saturday
|
||||
const saturday = new Date(date);
|
||||
saturday.setDate(date.getDate() + daysUntilSaturday);
|
||||
return convertDateToDateString(saturday);
|
||||
},
|
||||
getNextWeekSunday(dateString) {
|
||||
const date = convertDateStringToDate(dateString);
|
||||
const dayOfWeek = date.getDay();
|
||||
const daysUntilNextSunday = 7 - dayOfWeek; // Calculate the number of days until the next Sunday
|
||||
// Clone the given date and add the remaining days until Sunday
|
||||
const nextSunday = new Date(date);
|
||||
nextSunday.setDate(date.getDate() + daysUntilNextSunday);
|
||||
return convertDateToDateString(nextSunday);
|
||||
},
|
||||
getMonthEnd(dateStr) {
|
||||
// convert string to date, do date calc, then return a string back
|
||||
const date = new Date(dateStr.split("-")[0], parseInt(dateStr.split("-")[1]), 0);
|
||||
return convertDateToDateString(date);
|
||||
},
|
||||
getInitialViewWeeks(todayString, initialViewRowsToShow, preSelectedDate) {
|
||||
// TODO: this only is for future direction; need to create logic for past direction
|
||||
const weeks = [];
|
||||
let weekStartDate = this.getWeekStartDate(todayString);
|
||||
let weekEndDate = this.getWeekEndDate(todayString);
|
||||
|
||||
if (preSelectedDate) {
|
||||
let preSelectedDateMonthEnd = this.getMonthEnd(
|
||||
preSelectedDate.replace("-mobile", "")
|
||||
);
|
||||
let monthEndsByThisWeek = false;
|
||||
let i = 0;
|
||||
while (!monthEndsByThisWeek && i < 52) {
|
||||
if (i > 0) {
|
||||
weekStartDate = this.getNextWeekSunday(weekEndDate);
|
||||
weekEndDate = this.getWeekEndDate(weekStartDate);
|
||||
|
||||
if (
|
||||
(preSelectedDateMonthEnd > weekStartDate &&
|
||||
preSelectedDateMonthEnd < weekEndDate) ||
|
||||
preSelectedDateMonthEnd === weekStartDate ||
|
||||
preSelectedDateMonthEnd === weekEndDate
|
||||
) {
|
||||
weekEndDate = preSelectedDateMonthEnd;
|
||||
monthEndsByThisWeek = true;
|
||||
} else if (preSelectedDateMonthEnd < weekEndDate) {
|
||||
// Additional case: if month ends before this week (but not necessarily during it),
|
||||
// still cut the loop here, but don't truncate the week.
|
||||
|
||||
monthEndsByThisWeek = true;
|
||||
}
|
||||
}
|
||||
weeks.push({
|
||||
weekNum: i + 1,
|
||||
weekStartDate: weekStartDate,
|
||||
weekEndDate: weekEndDate,
|
||||
});
|
||||
i++;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < initialViewRowsToShow; i++) {
|
||||
if (i > 0) {
|
||||
weekStartDate = this.getNextWeekSunday(weekEndDate);
|
||||
weekEndDate = this.getWeekEndDate(weekStartDate);
|
||||
}
|
||||
weeks.push({
|
||||
weekNum: i + 1,
|
||||
weekStartDate: weekStartDate,
|
||||
weekEndDate: weekEndDate,
|
||||
});
|
||||
}
|
||||
// If any of these weeks is split between two months, then make them 2 separate "weeks"
|
||||
// (a week split between two months is considered 2 weeks per business requirements)
|
||||
const hasSplitWeek = (week) => {
|
||||
return week.weekStartDate.split("-")[1] !== week.weekEndDate.split("-")[1]
|
||||
? true
|
||||
: false;
|
||||
};
|
||||
const splitWeekIndex = weeks.findIndex(hasSplitWeek);
|
||||
|
||||
if (splitWeekIndex > -1) {
|
||||
const week1 = [];
|
||||
const week2 = [];
|
||||
let switchToWeek2 = false;
|
||||
|
||||
for (let j = 0; j < 7; j++) {
|
||||
const newDate = convertDateStringToDate(
|
||||
weeks[splitWeekIndex].weekStartDate
|
||||
);
|
||||
newDate.setDate(newDate.getDate() + j);
|
||||
if (newDate.getDate() === 1) switchToWeek2 = true;
|
||||
if (switchToWeek2) {
|
||||
week2.push(convertDateToDateString(newDate));
|
||||
} else {
|
||||
week1.push(convertDateToDateString(newDate));
|
||||
}
|
||||
}
|
||||
|
||||
const week1EndDate = week1[week1.length - 1];
|
||||
const week2StartDate = week2[0];
|
||||
|
||||
if (week1EndDate < todayString) {
|
||||
// replace week 1 with week 2
|
||||
weeks[splitWeekIndex].weekStartDate = week2StartDate;
|
||||
} else {
|
||||
const newWeek = {
|
||||
weekNum: weeks[splitWeekIndex].weekNum,
|
||||
weekStartDate: week2StartDate,
|
||||
weekEndDate: weeks[splitWeekIndex].weekEndDate,
|
||||
};
|
||||
weeks[splitWeekIndex].weekEndDate = week1EndDate;
|
||||
weeks.splice(splitWeekIndex + 1, 0, newWeek);
|
||||
weeks.pop();
|
||||
weeks.forEach((item, index) => {
|
||||
if (index > splitWeekIndex) {
|
||||
item.weekNum = item.weekNum + 1;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
return weeks;
|
||||
},
|
||||
async loadInitialData(config) {
|
||||
/*
|
||||
** NOTE: this _could_ be called by a parent before fully loaded, so FYI component data or computeds might not be available
|
||||
|
|
@ -444,10 +312,10 @@ export default {
|
|||
if (config.selectableDatesSetting === "past") calendarViewDirection = "past";
|
||||
if (config.selectableDatesSetting === "custom") calendarViewDirection = "future";
|
||||
|
||||
const currentMonthEnd = this.getMonthEnd(todayDateString);
|
||||
const currentMonthEnd = getMonthEnd(todayDateString);
|
||||
// TODO - set up currentMonthStart if direction is PAST:
|
||||
// let currentMonthStart = new Date(todayYearNum, todayMonthIndex - 1, 1);
|
||||
const initialViewWeeks = this.getInitialViewWeeks(
|
||||
const initialViewWeeks = getInitialViewWeeks(
|
||||
todayDateString,
|
||||
config.initialViewRowsToShow,
|
||||
config.preSelectedDate
|
||||
|
|
|
|||
|
|
@ -79,3 +79,137 @@ export function getTodayDate() {
|
|||
export function getTodayDateString() {
|
||||
return convertDateToDateString(getTodayDate());
|
||||
}
|
||||
|
||||
export function getMonthEnd(dateStr) {
|
||||
// convert string to date, do date calc, then return a string back
|
||||
const date = new Date(dateStr.split("-")[0], parseInt(dateStr.split("-")[1]), 0);
|
||||
return convertDateToDateString(date);
|
||||
}
|
||||
|
||||
export function getWeekStartDate(dateString) {
|
||||
const date = convertDateStringToDate(dateString);
|
||||
const dayOfWeek = date.getDay();
|
||||
// Subtract the day of the week from date to get the date of Sunday
|
||||
const sunday = new Date(date);
|
||||
sunday.setDate(sunday.getDate() - dayOfWeek);
|
||||
return convertDateToDateString(sunday);
|
||||
}
|
||||
|
||||
export function getWeekEndDate(dateString) {
|
||||
const date = convertDateStringToDate(dateString);
|
||||
const dayOfWeek = date.getDay();
|
||||
const daysUntilSaturday = 6 - dayOfWeek; // Calculate the number of days until Saturday
|
||||
// Clone the given date and add the remaining days until Saturday
|
||||
const saturday = new Date(date);
|
||||
saturday.setDate(date.getDate() + daysUntilSaturday);
|
||||
return convertDateToDateString(saturday);
|
||||
}
|
||||
|
||||
export function getNextWeekSunday(dateString) {
|
||||
const date = convertDateStringToDate(dateString);
|
||||
const dayOfWeek = date.getDay();
|
||||
const daysUntilNextSunday = 7 - dayOfWeek; // Calculate the number of days until the next Sunday
|
||||
// Clone the given date and add the remaining days until Sunday
|
||||
const nextSunday = new Date(date);
|
||||
nextSunday.setDate(date.getDate() + daysUntilNextSunday);
|
||||
return convertDateToDateString(nextSunday);
|
||||
}
|
||||
|
||||
export function getInitialViewWeeks(todayString, initialViewRowsToShow, preSelectedDate) {
|
||||
const weeks = [];
|
||||
let weekStartDate = getWeekStartDate(todayString);
|
||||
let weekEndDate = getWeekEndDate(todayString);
|
||||
|
||||
if (preSelectedDate) {
|
||||
let preSelectedDateMonthEnd = getMonthEnd(preSelectedDate.replace("-mobile", ""));
|
||||
let monthEndsByThisWeek = false;
|
||||
let i = 0;
|
||||
while (!monthEndsByThisWeek && i < 52) {
|
||||
if (i > 0) {
|
||||
weekStartDate = getNextWeekSunday(weekEndDate);
|
||||
weekEndDate = getWeekEndDate(weekStartDate);
|
||||
|
||||
if (
|
||||
(preSelectedDateMonthEnd > weekStartDate &&
|
||||
preSelectedDateMonthEnd < weekEndDate) ||
|
||||
preSelectedDateMonthEnd === weekStartDate ||
|
||||
preSelectedDateMonthEnd === weekEndDate
|
||||
) {
|
||||
weekEndDate = preSelectedDateMonthEnd;
|
||||
monthEndsByThisWeek = true;
|
||||
} else if (preSelectedDateMonthEnd < weekEndDate) {
|
||||
// Additional case: if month ends before this week (but not necessarily during it),
|
||||
// still cut the loop here, but don't truncate the week.
|
||||
|
||||
monthEndsByThisWeek = true;
|
||||
}
|
||||
}
|
||||
weeks.push({
|
||||
weekNum: i + 1,
|
||||
weekStartDate: weekStartDate,
|
||||
weekEndDate: weekEndDate,
|
||||
});
|
||||
i++;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < initialViewRowsToShow; i++) {
|
||||
if (i > 0) {
|
||||
weekStartDate = getNextWeekSunday(weekEndDate);
|
||||
weekEndDate = getWeekEndDate(weekStartDate);
|
||||
}
|
||||
weeks.push({
|
||||
weekNum: i + 1,
|
||||
weekStartDate: weekStartDate,
|
||||
weekEndDate: weekEndDate,
|
||||
});
|
||||
}
|
||||
// If any of these weeks is split between two months, then make them 2 separate "weeks"
|
||||
// (a week split between two months is considered 2 weeks per business requirements)
|
||||
const hasSplitWeek = (week) => {
|
||||
return week.weekStartDate.split("-")[1] !== week.weekEndDate.split("-")[1]
|
||||
? true
|
||||
: false;
|
||||
};
|
||||
const splitWeekIndex = weeks.findIndex(hasSplitWeek);
|
||||
|
||||
if (splitWeekIndex > -1) {
|
||||
const week1 = [];
|
||||
const week2 = [];
|
||||
let switchToWeek2 = false;
|
||||
|
||||
for (let j = 0; j < 7; j++) {
|
||||
const newDate = convertDateStringToDate(weeks[splitWeekIndex].weekStartDate);
|
||||
newDate.setDate(newDate.getDate() + j);
|
||||
if (newDate.getDate() === 1) switchToWeek2 = true;
|
||||
if (switchToWeek2) {
|
||||
week2.push(convertDateToDateString(newDate));
|
||||
} else {
|
||||
week1.push(convertDateToDateString(newDate));
|
||||
}
|
||||
}
|
||||
|
||||
const week1EndDate = week1[week1.length - 1];
|
||||
const week2StartDate = week2[0];
|
||||
|
||||
if (week1EndDate < todayString) {
|
||||
// replace week 1 with week 2
|
||||
weeks[splitWeekIndex].weekStartDate = week2StartDate;
|
||||
} else {
|
||||
const newWeek = {
|
||||
weekNum: weeks[splitWeekIndex].weekNum,
|
||||
weekStartDate: week2StartDate,
|
||||
weekEndDate: weeks[splitWeekIndex].weekEndDate,
|
||||
};
|
||||
weeks[splitWeekIndex].weekEndDate = week1EndDate;
|
||||
weeks.splice(splitWeekIndex + 1, 0, newWeek);
|
||||
weeks.pop();
|
||||
weeks.forEach((item, index) => {
|
||||
if (index > splitWeekIndex) {
|
||||
item.weekNum = item.weekNum + 1;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
return weeks;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue