vue-cal
vue-cal copied to clipboard
editable events crossing days are not draggable, resizing them causes ui bugs
I am using the calendar using the "week" view with editable events set to { title: true, drag: true, resize: true, delete: false, create: true }
and I noticed that if an event crosses midnight it becomes immobile.
here is a sample event body that I copied
{
"_eid": "25608_4",
"start": "2021-07-30T04:14:00.000Z",
"startTimeMinutes": 1334,
"end": "2021-07-30T12:15:00.000Z",
"endTimeMinutes": 375,
"title": "",
"content": "",
"background": false,
"allDay": false,
"daysCount": 2
}
Further to this, if you resize the event so that it doesn't cross midnight anymore, the whole event gets misplaced outside of the calendar as shown below:
-
load calendar: correctly rendered (bottom of calendar shown)
-
load calendar: correctly rendered (top of calendar shown)
-
resize event to no longer pass midnight and it jumps off the calendar
Forked a codepen from the documentation that reproduces this bug here: https://codepen.io/Wolfwood_/pen/oNWJRGx
This is the same codepen from #425 and will demonstrate both of these 2 issues.
Hi @Spacarar,
Indeed drag and drop does not support multiple day events as written in the documentation.

Also if you want to resize multiple day events horizontally, you need to add the resize-x
(x axis) option.