Given this issue https://github.com/bryntum/support/issues/3995 I have been recommended in a previous thread to use separate stores between partnered schedulers.
This has an unintended consequence shown in the console of this video https://www.dropbox.com/s/llbif27iuz0saez/Screen%20Recording%202022-11-25%20at%2013.24.03.mov?dl=0
- When dragging from one scheduler to another
- One scheduler instructs event id 8 to be deleted
- The other scheduler instructs the (now deleted) event to be re-assigned.
Below is the full code to be tested on https://bryntum.com/products/scheduler/examples/crudmanager/
Please recommend how CrudManagers can currently be used with partnered schedulers.
import { Scheduler, WidgetHelper, Toast, Splitter, CrudManager, EventStore, ResourceStore } from '../../build/scheduler.module.js?463519';
import shared from '../_shared/shared.module.js?463519';
const cookie = 'PHPSESSID=scheduler-crudmanager';
if (!(document.cookie.includes(cookie))) {
document.cookie = `${cookie}-${Math.random().toString(16).substring(2)}`;
}
const crudManager = {
resourceStore : {
// Add some custom fields
fields : ['car', 'dt']
},
eventStore : {
// Add a custom field and redefine durationUnit to default to hours
fields : ['dt', { name : 'durationUnit', defaultValue : 'hour' }]
},
// This config enables response validation and dumping of found errors to the browser console.
// It's meant to be used as a development stage helper only so please set it to false for production systems.
validateResponse : true,
transport : {
load : {
url : 'php/read.php',
paramName : 'data'
},
sync : {
url : 'php/sync.php'
}
},
autoLoad : true,
autoSync : true,
}
const config = {
appendTo : 'container',
flex: '1 1 50%',
startDate : new Date(2018, 4, 21, 6),
endDate : new Date(2018, 4, 21, 18),
viewPreset : 'hourAndDay',
rowHeight : 50,
barMargin : 5,
eventColor : 'orange',
eventStyle : 'colored',
syncMask : null,
loadMask : null,
features : {
eventDrag: {
constrainDragToTimeline: false // Allow drag outside of this Scheduler
},
eventDragCreate: false,
eventDragSelect: true,
},
columns : [
{ text : 'Car', field : 'car', width : 100, editor : false, hidden : false },
],
}
const scheduler1 = new Scheduler({...config, crudManager});
new Splitter({appendTo: 'container'});
const scheduler2 = new Scheduler({...config, ...{partner: scheduler1, hideHeaders: true, crudManager}});
const changesString = (pack) => {
return pack.map(pack => { return { events: pack.events, assignments: pack.assignments, }})
}
scheduler1.crudManager.on({
load() {
scheduler1.resourceStore.filter(r => r.car.startsWith("Volvo"))
scheduler1.assignmentStore.filter(a => scheduler1.resourceStore.records.map(r => r.id).includes(a.resourceId))
},
beforeSync({pack}) {
console.log("schedule1", JSON.stringify(pack))
}
})
scheduler2.crudManager.on({
load() {
scheduler2.resourceStore.filter(r => !r.car.startsWith("Volvo"))
scheduler2.assignmentStore.filter(a => scheduler2.resourceStore.records.map(r => r.id).includes(a.resourceId))
},
beforeSync({pack}) {
console.log("schedule2", JSON.stringify(pack))
}
})