diff --git a/src/constants/scheduling.js b/src/constants/scheduling.js index 5e819a7a4..c656ac60a 100644 --- a/src/constants/scheduling.js +++ b/src/constants/scheduling.js @@ -13,4 +13,4 @@ const monthsOfYear = [ "December", ]; -export { monthsOfYear }; \ No newline at end of file +export { monthsOfYear }; diff --git a/src/digital-components/date-picker/date-picker.vue b/src/digital-components/date-picker/date-picker.vue index 9ff0f5cf7..27426cde0 100644 --- a/src/digital-components/date-picker/date-picker.vue +++ b/src/digital-components/date-picker/date-picker.vue @@ -11,7 +11,9 @@
{{ month.monthLabel }} {{ month.yearNum.toString() }}
-
+
= Available
@@ -46,7 +48,13 @@
- + @@ -83,7 +91,8 @@ export default { modelValue: { type: Object, }, - todayOverrideDateString: { // only used for unit tests to override today's date + todayOverrideDateString: { + // only used for unit tests to override today's date type: String, default: null, }, @@ -125,7 +134,7 @@ export default { if (this.isInitialView) { this.isInitialView = false; // 1st click removes hidden styling } else { - this.addMonthData(); // 2nd click adds 1 month data + this.addMonthData(); // 2nd click adds 1 month data } }, setCalendarData() { @@ -135,10 +144,10 @@ export default { // first 0, then 1 for (let i = 0; i <= this.monthsAfterToLoadOffset; i++) { months.push(this.getMonthData(i)); - } + } } else if (this.calendarViewDirection === "past") { // first 0, then -1 - for (let i = 0; i >= (0 - this.monthsAfterToLoadOffset); i--) { + for (let i = 0; i >= 0 - this.monthsAfterToLoadOffset; i--) { months.unshift(this.getMonthData(i)); } } else { @@ -162,28 +171,29 @@ export default { const datesArray = []; const todayDateNum = this.todayDate.getDate(); - if (typeof offset !== 'undefined') { // offset only passed during initial setup with setCalendarData + if (typeof offset !== "undefined") { + // offset only passed during initial setup with setCalendarData yearNum = this.todayDate.getFullYear(); monthIndex = this.todayDate.getMonth() + offset; - if (direction === "future" && offset > 0) { + if (direction === "future" && offset > 0) { while (monthIndex > 11) { monthIndex = monthIndex - 12; yearNum++; } - } else if (direction === "past" && offset < 0) { + } else if (direction === "past" && offset < 0) { while (monthIndex < 0) { monthIndex = 12 + monthIndex; yearNum--; } } - - } else { // used only when adding an additional month + } else { + // used only when adding an additional month if (direction === "future") { // get last day of current calendar data const lastMonthInCalendarData = this.calendarData[this.calendarData.length - 1]; - + if (lastMonthInCalendarData.monthIndex === 11) { monthIndex = 0; yearNum = lastMonthInCalendarData.yearNum + 1; @@ -195,7 +205,7 @@ export default { if (direction === "past") { // get last day of current calendar data const firstMonthInCalendarData = this.calendarData[0]; - + if (firstMonthInCalendarData.monthIndex === 0) { monthIndex = 11; yearNum = firstMonthInCalendarData.yearNum - 1; @@ -204,39 +214,51 @@ export default { yearNum = firstMonthInCalendarData.yearNum; } } - } const todayDayIndex = this.todayDate.getDay(); // get day of week index of today (0-6) - currentWeekStartDateNum = todayDayIndex > todayDateNum ? 1 : todayDateNum - todayDayIndex; // FUTURE + currentWeekStartDateNum = + todayDayIndex > todayDateNum ? 1 : todayDateNum - todayDayIndex; // FUTURE const monthEndDate = new Date(yearNum, monthIndex + 1, 0); // BOTH let monthEndDateNum = monthEndDate.getDate(); // BOTH currentWeekEndDateNum = todayDateNum + 6 - todayDayIndex; // PAST, aka Sat. (ok if it's larger than the month end?) - if (offset === 0 && direction === "past" && monthEndDateNum > currentWeekEndDateNum) monthEndDateNum = currentWeekEndDateNum; // PAST - const monthStartDateNum = (offset === 0 && direction === "future") ? currentWeekStartDateNum : 1; // FUTURE + if (offset === 0 && direction === "past" && monthEndDateNum > currentWeekEndDateNum) + monthEndDateNum = currentWeekEndDateNum; // PAST + const monthStartDateNum = + offset === 0 && direction === "future" ? currentWeekStartDateNum : 1; // FUTURE const monthStartDate = new Date(yearNum, monthIndex, monthStartDateNum); // BOTH const startDateDayIndex = monthStartDate.getDay(); // FUTURE const endDateDayIndex = monthEndDate.getDay(); // PAST - if (typeof offset !== 'undefined') { + if (typeof offset !== "undefined") { + if (offset === 0 && direction === "future") + firstMonthDayTally = monthStartDateNum - startDateDayIndex; // FUTURE (starts low, counts up) + if (offset === 0 && direction === "past") + firstMonthDayTally = currentWeekEndDateNum; // PAST (starts high, counts down) - if (offset === 0 && direction === "future") firstMonthDayTally = monthStartDateNum - startDateDayIndex; // FUTURE (starts low, counts up) - if (offset === 0 && direction === "past") firstMonthDayTally = currentWeekEndDateNum; // PAST (starts high, counts down) - - while (direction === "future" && offset === 0 && firstMonthDayTally < monthEndDateNum) { // FUTURE + while ( + direction === "future" && + offset === 0 && + firstMonthDayTally < monthEndDateNum + ) { + // FUTURE firstMonthDayTally = firstMonthDayTally + 7; this.initialViewRowsTally++; } - while (direction === "past" && offset === 0 && firstMonthDayTally > monthStartDateNum) { // PAST + while ( + direction === "past" && + offset === 0 && + firstMonthDayTally > monthStartDateNum + ) { + // PAST firstMonthDayTally = firstMonthDayTally - 7; this.initialViewRowsTally++; } - if (Math.abs(offset) === 1) { - + if (Math.abs(offset) === 1) { if (this.initialViewRowsTally < this.initialViewRowsToShow) { - initialViewEndDate = 6 - startDateDayIndex + monthStartDateNum; // FUTURE + initialViewEndDate = 6 - startDateDayIndex + monthStartDateNum; // FUTURE initialViewStartDate = monthEndDateNum - endDateDayIndex; // PAST this.initialViewRowsTally++; } else { @@ -248,15 +270,14 @@ export default { initialViewStartDate = initialViewStartDate - 7; this.initialViewRowsTally++; } - } - + } } - + if (this.selectableDates === "custom") { const monthStart = { year: yearNum, month: monthIndex + 1, - date: (offset === 0) ? todayDateNum : monthStartDateNum, + date: offset === 0 ? todayDateNum : monthStartDateNum, }; const monthEnd = { year: monthEndDate.getFullYear(), @@ -270,7 +291,8 @@ export default { // populate datesArray for (let i = monthStartDateNum; i <= monthEndDateNum; i++) { let dayClasses = ""; - const thisDate = { // NOTE: uses monthNum (1-based), NOT monthIndex (0-based) + const thisDate = { + // NOTE: uses monthNum (1-based), NOT monthIndex (0-based) year: yearNum, month: monthIndex + 1, date: i, @@ -284,10 +306,10 @@ export default { if (offset === 0 && i > todayDateNum && direction === "past") { dayClasses += "unavailable-day"; } - if (Math.abs(offset) === 1&& direction === "future" && i > initialViewEndDate) { + if (Math.abs(offset) === 1 && direction === "future" && i > initialViewEndDate) { dayClasses += "day-hidden"; } - if (Math.abs(offset) === 1&& direction === "past" && i < initialViewStartDate) { + if (Math.abs(offset) === 1 && direction === "past" && i < initialViewStartDate) { dayClasses += "day-hidden"; } if (this.selectableDates === "custom" && this.isSelectableDate(thisDate)) { @@ -334,8 +356,13 @@ export default { return isSelectable; }, updateSelectableDates(monthStart, monthEnd) { - this.customSelectableDatesCallback(monthStart, monthEnd)?.forEach(newObj => { - const index = this.selectableDatesData.findIndex(obj => obj.year === newObj.year && obj.month === newObj.month && obj.date === newObj.date); + this.customSelectableDatesCallback(monthStart, monthEnd)?.forEach((newObj) => { + const index = this.selectableDatesData.findIndex( + (obj) => + obj.year === newObj.year && + obj.month === newObj.month && + obj.date === newObj.date + ); if (index === -1) this.selectableDatesData.push(newObj); }); }, @@ -344,7 +371,6 @@ export default {