Increase readability
This commit is contained in:
parent
7fd7362982
commit
0bed421da3
1 changed files with 9 additions and 4 deletions
|
|
@ -153,7 +153,7 @@ export default {
|
||||||
this.initializeWindow();
|
this.initializeWindow();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
// Pending auto select is set when the user is at the end of the dates and the next page of dates is loaded.
|
||||||
if (this.pendingAutoSelect) {
|
if (this.pendingAutoSelect) {
|
||||||
this.pendingAutoSelect = false;
|
this.pendingAutoSelect = false;
|
||||||
this.advanceWindowAndAutoSelect();
|
this.advanceWindowAndAutoSelect();
|
||||||
|
|
@ -164,9 +164,11 @@ export default {
|
||||||
this.updateWindowSize();
|
this.updateWindowSize();
|
||||||
window.addEventListener("resize", this.updateWindowSize);
|
window.addEventListener("resize", this.updateWindowSize);
|
||||||
if (!this.allDates.length) return;
|
if (!this.allDates.length) return;
|
||||||
|
// If a model value is set, we need to set the window start to the index of the model value.
|
||||||
|
// Otherwise, we need to initialize the window.
|
||||||
if (this.modelValue) {
|
if (this.modelValue) {
|
||||||
const index = this.allDates.findIndex((d) => d.value === this.modelValue);
|
const index = this.allDates.findIndex((d) => d.value === this.modelValue);
|
||||||
if (index !== -1) this.windowStart = this.getWindowStart(index);
|
if (index !== -1) this.windowStart = this.getWindowStartFromIndex(index);
|
||||||
} else {
|
} else {
|
||||||
this.initializeWindow();
|
this.initializeWindow();
|
||||||
}
|
}
|
||||||
|
|
@ -183,7 +185,7 @@ export default {
|
||||||
? require("@/assets/img/icons/chevron-right-blue.svg")
|
? require("@/assets/img/icons/chevron-right-blue.svg")
|
||||||
: require("@/assets/img/icons/chevron-right-grey.svg");
|
: require("@/assets/img/icons/chevron-right-grey.svg");
|
||||||
},
|
},
|
||||||
getWindowStart(index) {
|
getWindowStartFromIndex(index) {
|
||||||
return Math.floor(index / this.windowSize) * this.windowSize;
|
return Math.floor(index / this.windowSize) * this.windowSize;
|
||||||
},
|
},
|
||||||
goBack() {
|
goBack() {
|
||||||
|
|
@ -206,6 +208,7 @@ export default {
|
||||||
this.autoSelectFirstAvailable();
|
this.autoSelectFirstAvailable();
|
||||||
},
|
},
|
||||||
autoSelectFirstAvailable() {
|
autoSelectFirstAvailable() {
|
||||||
|
// Finds the first available date in the visible dates and emits the value.
|
||||||
const first = this.visibleDates.find((d) => d.isAvailable);
|
const first = this.visibleDates.find((d) => d.isAvailable);
|
||||||
this.$emit("update:modelValue", first ? first.value : null);
|
this.$emit("update:modelValue", first ? first.value : null);
|
||||||
},
|
},
|
||||||
|
|
@ -215,10 +218,12 @@ export default {
|
||||||
|
|
||||||
const firstAvailable = this.allDates.find((d) => d.isAvailable);
|
const firstAvailable = this.allDates.find((d) => d.isAvailable);
|
||||||
if (firstAvailable) {
|
if (firstAvailable) {
|
||||||
|
// If an available date is found, set the window start ensures the first available date is visible.
|
||||||
const index = this.allDates.indexOf(firstAvailable);
|
const index = this.allDates.indexOf(firstAvailable);
|
||||||
this.windowStart = this.getWindowStart(index);
|
this.windowStart = this.getWindowStartFromIndex(index);
|
||||||
this.$emit("update:modelValue", firstAvailable.value);
|
this.$emit("update:modelValue", firstAvailable.value);
|
||||||
} else {
|
} else {
|
||||||
|
// If no available dates are found, set the window start to the last window.
|
||||||
this.windowStart = Math.max(0, this.allDates.length - this.windowSize);
|
this.windowStart = Math.max(0, this.allDates.length - this.windowSize);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue