Happy to introduce the public beta of Mobiscroll for Vue, quarter resolution to the timeline view, along with easier validation control, new event connection types, and drag & drop improvements.
Mobiscroll for Vue
Avoid double booking
When it comes to scheduling resources, overlapping events are not allowed in a lot of cases. More than just one event happening at the same time is still a thing and we not removing that, but we are introducing the
eventOverlap option that is applicable to the instance, resources or individual events.
Prior to having this option it was necessary to rely on the
onEventUpdate lifecycle events and manually check and handle the overlap there.
Timeline event connections
We had event connection for some time now – since they were introduced in version 5.19, with some limitations. We only supported
finish-to-start connections which went from the end of one event and connected to the beginning of another event.
We are introducing four connection types:
Check out how you can control the event connections in this example.
Timeline Q1, Q2, Q3, Q4
We are adding horizontal quarter resolution to the timeline view. Use it for dividing the view into quarters.
Templating of the quarter header and footers is new as well and comes with this release.
Check out how to customize the header and footer in case of any timeline resolution and learn how to configure quarter resolution for your view.
Drag & drop control and improvements
We have added
dragInTime support for external events. In times of scheduled but unassigned events listed externally of the calendar might be already fixed. When assigning such events it is better to just fix them in time in the calendar and let users only move them between resources rather than retroactively modifying them.
Time slots inherited the same drag & drop controls that the resources have. This means if
true, the events won’t be draggable between time slots. Eg. if someone wants for move an assignment and keep it in a specific shift, they can do that now without the need to write a custom validation logic in the lifecycle events.
Agenda empty state
The empty state template was introduced in version 5.26. Being able to create a custom template/render function for the views that don’t have events is useful for showing CTAs, images and text.
Check out this example and customize the agenda empty state through the
renderAgendaEmpty and the
We are working on a couple of powerful features, like being able to fix certain rows at the top of the timeline, better control over handling many overlapping events along with new tools for a nice zoom feature.