bryntum / support

An issues-only repository for the Bryntum project management component suite which includes powerful Grid, Scheduler, Calendar, Kanban Task Board and Gantt chart components all built in pure JS / CSS / TypeScript
https://www.bryntum.com
53 stars 6 forks source link

Missing event object in beforeAdd and strange effects when copy/paste Events #9803

Closed marciogurka closed 3 weeks ago

marciogurka commented 1 month ago

Forum post

" Hello Bryntum!

We integrate the Scheduler Pro in our Angular-app. I think since version 6.x we encountered some problems when copy and paste events.

I describe two problems which seem related.

1. beforeAdd listener on AssignmentStore: When copying two Scheduler-Events an paste them, the second beforeAdd-event does not contain the Scheduler-Event object but the EventId. We need the object to add some properties.

Problem 1.mov

Reproduce:

import { AssignmentStore, Scheduler, EventModel } from '../../build/scheduler.module.js?478494';
import shared from '../_shared/shared.module.js?478494';

// Making a custom EventModel to enable resourceIds field usage
class CustomEventModel extends EventModel {
    static $name  = 'CustomEventModel';
    static fields = [
        { name : 'resourceIds', persist : true }
    ];
}

//region Data

const
    resources   = 
        { id : 'r1', name : 'Celia', city : 'Barcelona' },
        { id : 'r2', name : 'Lee', city : 'London' },
        { id : 'r3', name : 'Macy', city : 'New York' },
        { id : 'r4', name : 'Madison', city : 'Barcelona' },
        { id : 'r5', name : 'Rob', city : 'Rome' },
        { id : 'r6', name : 'Dave', city : 'Barcelona' },
        { id : 'r7', name : 'Dan', city : 'London' },
        { id : 'r8', name : 'George', city : 'New York' },
        { id : 'r9', name : 'Gloria', city : 'Rome' },
        { id : 'r10', name : 'Henrik', city : 'London' }
    ],
    events      = [
        {
            id          : 1,
            startDate   : new Date(2017, 0, 1, 10),
            endDate     : new Date(2017, 0, 1, 12),
            name        : 'Multi assigned',
            iconCls     : 'b-fa b-fa-users',
            resourceIds : ['r1', 'r2', 'r8']
        },
        {
            id          : 2,
            startDate   : new Date(2017, 0, 1, 13),
            endDate     : new Date(2017, 0, 1, 15),
            name        : 'Single assigned',
            iconCls     : 'b-fa b-fa-user',
            eventColor  : 'indigo',
            resourceIds : ['r3']
        },
        {
            id          : 3,
            startDate   : new Date(2017, 0, 1, 8),
            endDate     : new Date(2017, 0, 1, 11),
            name        : 'Single assigned',
            iconCls     : 'b-fa b-fa-user',
            eventColor  : 'cyan',
            resourceIds : ['r4']
        },
        {
            id          : 4,
            startDate   : new Date(2017, 0, 1, 10),
            endDate     : new Date(2017, 0, 1, 13),
            name        : 'Single assigned',
            iconCls     : 'b-fa b-fa-user',
            eventColor  : 'blue',
            resourceIds : ['r5']
        },
        {
            id          : 5,
            startDate   : new Date(2017, 0, 1, 13),
            endDate     : new Date(2017, 0, 1, 15),
            name        : 'Single assigned',
            iconCls     : 'b-fa b-fa-user',
            eventColor  : 'violet',
            resourceIds : ['r6']
        }
    ];

//endregion

const scheduler = new Scheduler({
    appendTo : 'container',

startDate         : new Date(2017, 0, 1, 6),
endDate           : new Date(2017, 0, 1, 20),
viewPreset        : 'hourAndDay',
eventStyle        : 'border',
resourceImagePath : '../_shared/images/users/',
multiEventSelect  : true,

columns : [
    { type : 'resourceInfo', text : 'Name', field : 'name', width : 130 },
    { text : 'City', field : 'city', width : 90 }
],

features : {
    eventDragSelect : true
},

resources,
eventStore : {
    modelClass : CustomEventModel,
    data       : events
},
assignmentStore: new AssignmentStore({
listeners: {
  beforeAdd: (event) =>  {
    console.log("beforeAdd event:", 
         event.records[0].originalData.event); 
    return true
  }
}
})
});

2. Strange effects when copy/paste Scheduler-Events Several pasting actions adds more than the desired events and suddenly pasting does not work anymore.

Problem 2.mov

Reproduce:

"