Hi Ram,
Thanks for your replay,
-> Hear is the
code snippet of event template for appointment.
<!-- Template for Appointment -->
<template v-slot:eventTemplate="{ data }">
<v-card
height="auto"
:id="data.StartTime"
@click="
$router.push(`/meeting/${data.id}/agenda/tenant/${tenantId}`)
"
class="subject appointment-meeting-template full-width ma-1"
tile
>
<v-row no-gutters class="appointment-meetingName px-1">
{{ data.meetingName }}
</v-row>
<v-row
no-gutters
class="appointment-topic px-1 ma-1"
v-for="(topicCat, index) in data.topicCategory"
:key="index"
>
<v-col cols="12" class="topic-category text-center">{{
topicCat.name
}}</v-col>
<ul class="pl-4" style="width: 100%">
<li v-for="(topic, index) in topicCat.topics" :key="index">
<span class="topic">{{ topic.topicName }}</span>
<v-divider
v-if="index !== topicCat.topics.length - 1"
></v-divider>
</li>
</ul>
</v-row>
</v-card>
</template>
->
code snippet used to manually set the height of cells and position of appointments
onDataBound() {
let scheduleObj = this.$refs.agendaScheduleObj;
console.log("onDataBound.........", scheduleObj);
this.setAgendaUI();
},
setAgendaUI() {
setTimeout(() => {
let appointments = document.getElementsByClassName("e-appointment");
let cells = document.getElementsByClassName(
"e-work-cells e-child-node e-work-days"
);
let agendaCells = document.getElementsByClassName(
"e-resource-cells e-child-node"
);
for (let c = 0; c < cells.length; c++) {
let childrenHeight = 0;
let cell = cells[c];
for (let a = 0; a < appointments.length; a++) {
let appointment = appointments[a];
let appointmentDate = new Date(
appointment.children[0].children[0].id
);
let cellDate = new Date(Number(cell.dataset.date));
if (
appointmentDate.getMonth() == cellDate.getMonth() &&
appointmentDate.getFullYear() == cellDate.getFullYear() &&
cell.dataset.groupIndex == appointment.dataset.groupIndex
) {
childrenHeight += appointment.offsetHeight;
cell.style.height = `${childrenHeight}px`;
if (appointment.previousSibling == null) {
appointment.style.top = `${cell.offsetTop}px`;
} else {
if (
appointment.previousSibling &&
appointment.parentNode.childElementCount
) {
for (
let i = 0;
i < appointment.parentNode.children.length;
i++
) {
let sum = 0;
for (let j = 0; j < i; j++) {
sum += appointment.parentNode.children[j].offsetHeight;
}
appointment.parentNode.children[i].style.top = `${
cell.offsetTop + sum
}px`;
}
}
}
} else {
childrenHeight = 0;
}
// }
}
for (let i = 0; i < agendaCells.length; i++) {
if (agendaCells[i].dataset.groupIndex == cell.dataset.groupIndex) {
agendaCells[i].style.height = `${cell.offsetHeight}px`;
}
}
}
this.resizing = false;
// console.log("resizing end", this.resizing);
}, 100);
},
Thanks and Regards,
Ravi
Before
After hovering on Sidebar 
