fix(Calendar): does not display events on the calendar when sliding the carusel to avoid showing overlapping events

This commit is contained in:
SimonGschnell
2024-11-12 09:57:10 +01:00
parent 6cf7a8e35e
commit 3046c29ae2
3 changed files with 22 additions and 4 deletions
+5 -1
View File
@@ -15,7 +15,8 @@ export default {
'focusDate',
'size',
'events',
'noMonthView'
'noMonthView',
'isSliding'
],
props: {
year: Number,
@@ -39,6 +40,9 @@ export default {
return result;
},
eventsPerDayAndHour() {
// return early if the calendar pane is sliding
if (this.isSliding) return {};
const res = {};
this.days.forEach(day => {
let key = day.toDateString();
+12 -2
View File
@@ -6,7 +6,13 @@ export default {
return {
carousel: null,
queue: 0,
offset: 0
offset: 0,
slideAnimation:false,
}
},
provide() {
return {
isSliding: Vue.computed(() => this.slideAnimation),
}
},
computed: {
@@ -34,6 +40,10 @@ export default {
else
this.carousel.prev();
}
this.slideAnimation = false;
},
slide(evt) {
this.slideAnimation = true;
}
},
mounted() {
@@ -45,7 +55,7 @@ export default {
}
},
template: `
<div ref="carousel" class="calendar-pane carousel slide" @[\`slid.bs.carousel\`]="slid" :data-queue="queue">
<div ref="carousel" class="calendar-pane carousel slide" @[\`slide.bs.carousel\`]="slide" @[\`slid.bs.carousel\`]="slid" :data-queue="queue">
<!--height calc function just for user testing purpose (has to be fixed)-->
<div class="carousel-inner " style="height:calc(100vh - 220px); overflow:scroll">
<div v-for="i in [...Array(3).keys()]" :key="i" class="carousel-item">
+5 -1
View File
@@ -15,7 +15,8 @@ export default {
'focusDate',
'size',
'events',
'noMonthView'
'noMonthView',
'isSliding'
],
props: {
year: Number,
@@ -45,6 +46,9 @@ export default {
},
eventsPerDayAndHour() {
// return early if the calendar pane is sliding
if (this.isSliding) return {};
const res = {};
this.days.forEach(day => {
let key = day.toDateString();