Hi Team,
I am facing this issue, when I load the Scheduler - Group Summary component for a logged in user and logout and login with another user, try to load the Scheduler, its retaining the old data and showing up "Data Loading Failed". So I wanted to know if is there a way to clear data before loading Scheduler component. Below is the code I am using for loading:
const crudManager = new CrudManager(
{
autoLoad : false,
transport : {
load : {
method: 'GET',
url: `GroupActionSummary`,
paramName: 'data',
headers: {
'Content-Type': 'application/json',
},
}
},
listeners: {
beforeSend: ({ params }) => {
params.id = actionId;
},
beforeLoad: () => {
if (!actionId) {
return false;
}
return true;
}
}
});
const schedulerConfig = {
set: (id) => {
actionId= id;
},
eventStyle : 'border',
resourceImagePath : 'https://',
readOnly: true,
features : {
group : 'actionName',
sort : 'name',
groupSummary : {
collapseToHeader : true,
summaries : [
{
label : 'Total',
height : 40, // needed to make summary row grow correctly
renderer({ events }) {
const value = Math.min(1, events.length / maxValue),
height = (100 * value) + '%';
return `
<div class="bar-outer">
<div class="bar-inner" style="height: ${height}"><label class="${value > 0.5 ? 'b-summarybar-label-inside' : ''}">${events.length || ''}</label></div>
</div>
`;
}
}
]
},
pan : true,
eventDragCreate : false,
eventMenu: {
disabled: true
},
cellMenu : {
disabled: true
},
scheduleMenu : {
disabled: true
},
eventDrag : {
disabled: true
},
eventDragSelect : {
disabled: true
},
eventResize :{
disabled : true
},
eventEdit : {
disabled : true
}
},
columns : [
{
text : 'Action',
width : 100,
field : 'actionName',
hidden : true
},
{
type : 'resourceInfo',
text : 'Action',
width : 170,
showEventCount : false,
showMeta(resourceRecord){
var eventLength = resourceRecord.events.length;
return `${eventLength} task${eventLength != 1 ? "s":""}`;
},
summaries : [{ sum : 'count', label : 'Employees' }]
},
{
text : 'Name',
width : 130,
field : 'name'
},
{
type : "timeAxis",
tooltip : "Right-click for context menu"
}
],
rowHeight : 55,
barMargin : 10,
startDate : '',
endDate : '',
createEventOnDblClick : false,
// Customize preset
viewPreset : {
base : 'weekDateAndMonth',
displayDateFormat : 'DD-MM-YYYY',
timeResolution : {
unit : 'day',
increment : 1
}
},
crudManager : crudManager,
eventRenderer : (eventRecord, renderData) => UtilService.getSchedulerProEventRenderer(eventRecord, renderData)
};
export { schedulerConfig };
function ActionGroup(actionId) {
const schedulerRef = useRef();
schedulerConfig.setAction(actionId.actionId);
useEffect(() => {
schedulerConfig.crudManager.load();
if(schedulerRef.current){
const scheduler = schedulerRef.current.instance;
scheduler.zoomLevel = 7;
}
}, []);
return (
<Fragment>
<BryntumScheduler ref={schedulerRef}{...schedulerConfig}/>
</Fragment>
);
}