Premium support for our pure JavaScript UI components


Post by jk@datapult.dk »

Johan, thank you for a great and understanding answer. Have a great day!


Post by jk@datapult.dk »

Hi again, Johan & Team

I hope that you are well.

I am not able to make a functioning replication of the following issue but I hope that you or your colleagues can spot what is going on here because I am struggling.

I am (testing) on 5.2.9 and running a setup very similar to the code I shared here in this post: viewtopic.php?p=116677#p116677

I tried as you recommended to chain the eventStore into the second scheduler. I get this error thrown. The only thing relating to my code is ScheduleItemModelByUser, which is simply my Event model class.

CorePartOfProjectModelMixin.js:27 Uncaught (in promise) RangeError: Maximum call stack size exceeded
    at new CorePartOfProjectModelMixin2 (CorePartOfProjectModelMixin.js:27:13)
    at new CoreEventMixin2 (CoreEventMixin.js:22:25)
    at new ScheduleItemModelByUser (ScheduleItemModelByUser.ts:3:8)
    at new ClassDefEx (Store.js:1083:9)
    at new ClassDefEx (Store.js:1083:9)
    at EventStore.createRecord (Store.js:1416:5)
    at StoreSync.js:290:21
    at Array.forEach (<anonymous>)
    at EventStore.syncFlatDataset (StoreSync.js:267:26)
    at EventStore.syncDataset (StoreSync.js:163:55)

What might be causing this? There is only around 2.000 events so not a whole lot.

In case you want to see my Event model class:

import { EventModel } from "@bryntum/scheduler"

export class ScheduleItemModelByUser extends EventModel {

    static get fields() {
        return [
            { name: "name", type: "string" },
            { name: "id", dataSource: "frontendId", },
            { name: "backendId", type: "integer" },
            { name: "wishTypeId", type: "integer" },
            { name: "roomId", type: "integer" },
            { name: "resourceId", dataSource: "userId", },
            { name: "note", type: "string" },
            { name: "eventType", type: "string", defaultValue: "wish" },
            { name: "startDate", dataSource: "start", },
            { name: "endDate", dataSource: "end", },
            { name: "historic", type: "boolean", defaultValue: true },
            { name: "durationUnit", defaultValue: "day" },
        ];
    }
}

Post by johan.isaksson »

Hi,

I am not spotting anything wrong with your custom event model, I'll give it a shot locally, in case there is some issue with field mappings and the project. Will get back to you on that.

Meanwhile, the original issue was resolved and is part of the upcoming 5.2.10 release. If you are able to, you could try it by getting a nightly build from the CustomerZone. I recall also fixing some more issues related to sharing the store, with some luck it might resolve this issue too.

Best regards,
Johan Isaksson

Post by johan.isaksson »

I tried the following and it seems to work fine with your mappings, on 5.2.10:

import Scheduler from '../../lib/Scheduler/view/Scheduler.js';
import EventModel from '../../lib/Scheduler/model/EventModel.js';
import CrudManager from '../../lib/Scheduler/data/CrudManager.js';

const
    resources = [
        { id : 'r1', name : 'Mike' },
        { id : 'r2', name : 'Linda' }
    ],
    events = [
        {
            frontendId : 1,
            userId     : 'r1',
            start      : new Date(2017, 0, 1, 10),
            end        : new Date(2017, 0, 1, 12),
            name       : 'Click me'
        },
        {
            frontendId : 2,
            userId     : 'r2',
            start      : new Date(2017, 0, 1, 12),
            end        : new Date(2017, 0, 1, 13, 30),
            name       : 'Drag me'
        }
    ];

class ScheduleItemModelByUser extends EventModel {
    static get fields() {
        return [
            { name : 'id', dataSource : 'frontendId' },
            { name : 'resourceId', dataSource : 'userId' },
            { name : 'startDate', dataSource : 'start' },
            { name : 'endDate', dataSource : 'end' },
            { name : 'durationUnit', defaultValue : 'day' }
        ];
    }
}

const crudManager = new CrudManager({
    eventStore : {
        modelClass : ScheduleItemModelByUser
    }
});

const scheduler = new Scheduler({
    appendTo      : 'container',
    startDate     : new Date(2017, 0, 1, 6),
    endDate       : new Date(2017, 0, 1, 20),
    viewPreset    : 'hourAndDay',
    eventStore    : crudManager.eventStore,
    resourceStore : crudManager.resourceStore.chain(),
    columns       : [
        { text : 'Name', field : 'name', width : 130 }
    ]
});

const scheduler2 = new Scheduler({
    appendTo      : 'container',
    partner       : scheduler,
    eventStore    : crudManager.eventStore,
    resourceStore : crudManager.resourceStore.chain(r => r.id === 'r2'),
    columns       : [
        { text : 'Name', field : 'name', width : 130 }
    ]
});

crudManager.loadCrudManagerData({
    events : { rows : events },
    resources : { rows : resources }
});

Can you modify the above to reproduce your issue?

Best regards,
Johan Isaksson

Post by jk@datapult.dk »

Thanks, Johan. I appreciate your answer. Let me park this until I can npm install 5.2.10 and get back to you.


Post by marcio »

We'll be waiting for your feedback jk, feel free to reach us anytime that you need assistance! :)

Best regards,
Márcio


Post Reply