I'm trying to display custom events within a scheduler so that :
- when we edit an existing event, we can see its additional attribute displayed within a combo list initialized at its value.
- when we create a new event, it's additional attribute is displayed within a combo list initialized at a specific default value.
For example, this additionnal attribute could be the kind of the event (meeting, phone, mail or default).
I had a look at your example https://www.bryntum.com/examples/scheduler/eventeditor/
But I could not make it work on my project.
Here is what I've done :
Event extending EventModel :
import {EventModel} from 'bryntum-scheduler';
export class Event extends EventModel {
static get fields() {
return [
{
name: 'id',
dataSource: 'id',
type : 'number'
},
{
name: 'type',
dataSource: 'type',
type : 'string',
defaultValue : 'default'
},
{
name: 'resourceId',
dataSource: 'resourceId',
type : 'number'
},
{
name: 'name',
dataSource: 'name',
type : 'string'
},
{
name: 'startDate',
dataSource: 'startDate',
type : 'date'
},
{
name: 'endDate',
dataSource: 'endDate',
type : 'date'
},
{
name: 'eventColor',
dataSource: 'color',
type : 'string'
}
];
}
}
Scheduler creation, based on newVal, an instance of my Schedule class :
const scheduler = new Scheduler({
// Basic GUI
appendTo: 'container',
minHeight: window.innerHeight * 0.75,
viewPreset : 'hourAndDay',
// Data
startDate : new Date(newVal.startDate),
endDate : new Date(newVal.endDate),
resources : newVal.resources,
events : newVal.events,
// GUI configuration
columns : [
{ type: 'resourceInfo', text : 'Name', field : 'name', width : 150, showEventCount : false, showRole : true }
],
features : {
eventEdit : {
// Add extra widgets to the event editor
extraItems : [
{
type : 'combo',
name : 'type',
label : 'Type',
index : 1,
items : newVal.types,
value : 'default'
}
]
}
}
});
import {Event} from './event';
import {Resource} from './resource';
export class Schedule {
public types: string[];
constructor(public events: Event[], public resources: Resource[], public startDate: Date, public endDate: Date) {
this.types = [];
events.forEach( (event, index) => {
if ( ! this.types.includes(event.type, 0)) {
this.types[this.types.length] = event.type;
}
});
this.types[this.types.length] = 'default';
}
}
Thank you in advance,
Regards,
Edit : It is a data problem. Actually, if i edit an existing event before creating a new event, then the new event will take the type of the event I've edited before. Even worse, if I go back to the event I've edited to change its type, it will also change the type of the newly created event !! So obviously, data are not saved as I thought. Does it come from the crud manager?