how do you use Draggable events with read start and end dates from the event and fix them but choose resource?

    document.addEventListener('DOMContentLoaded', function () {

        var date = new Date()
        var d = date.getDate(),
            m = date.getMonth(),
            y = date.getFullYear()

        var Calendar = FullCalendar.Calendar;
        //var Draggable = FullCalendar.Draggable;

        var containerEl = document.getElementById('external-events');
        var checkbox = document.getElementById('drop-remove');

        var Draggable = FullCalendarInteraction.Draggable;

        new Draggable(containerEl, {
            itemSelector: '.external-event',
            eventData: function (eventEl) {
                return {
                    id: eventEl.getAttribute('data-id'),
                    title: eventEl.getAttribute('data-title'),
                    start: eventEl.getAttribute('data-start'),
                    end: eventEl.getAttribute('data-end'),
                    resourceId: eventEl.getAttribute('data-resource-id'),
                    description: eventEl.getAttribute('data-description'),
                    backgroundColor: window.getComputedStyle(eventEl, null).getPropertyValue('background-color'),
                    borderColor: window.getComputedStyle(eventEl, null).getPropertyValue('background-color'),
                    textColor: window.getComputedStyle(eventEl, null).getPropertyValue('color')
                };
            }
        });


        let calendarEl = document.getElementById('calendar');
        let calendar;

        let start = '2024-05-01';
        let end = '2024-06-31';

        let resourcesurl = '/resources';//alert(resourcesurl);
        let zone = '{{$zone}}';
        let available = '{{$available}}';
        let resourcesIndex = 0;

        if (zone === '1') {
            resourcesIndex += 1;
            if (resourcesIndex === 1) {
                resourcesurl += '?zone=on';
            } else {
                resourcesurl += '&zone=on';
            }
        }
        if (available === '1') {
            resourcesIndex += 1;
            if (resourcesIndex === 1) {
                resourcesurl += '?available=on';
            } el</x-turndown>