Hi Team,
Query: Is there any event to make below changes for popup Scheduling cycle.
A. How to remove option "Deactivate dependency".
B. Callback function on button "Apply" click.
Thanks,
Shashank Yadav
Hatch Digital
Hi,
Sure, to achieve it you need to create a custom class overriding the cycleResolutionPopup class
https://bryntum.com/products/gantt/docs/api/SchedulerPro/widget/CycleResolutionPopup
And need to set the custom class to https://bryntum.com/products/gantt/docs/api/Gantt/view/Gantt#config-cycleResolutionPopupClass
class CustomCycleResolution extends CycleResolutionPopup {
getResolutions() {
const
{ schedulingIssue } = this,
invalidDependencies = schedulingIssue?.getInvalidDependencies();
let resolutions = schedulingIssue?.getResolutions();
// If there are invalid dependencies involved (like parent-child or self-to-self)
// let's not suggests other resolutions to simplify the UI
if (resolutions && invalidDependencies.length) {
resolutions = resolutions.filter(r => r.dependency && invalidDependencies.includes(r.dependency));
}
resolutions?.shift();
return resolutions;
}
onApplyButtonClick() {
console.log('apply button clicked');
super.onApplyButtonClick()
}
}
new Gantt({
appendTo : 'container',
dependencyIdField : 'sequenceNumber',
rowHeight : 45,
tickSize : 45,
barMargin : 8,
cycleResolutionPopupClass : CustomCycleResolution,
project : {
autoLoad : true,
transport : {
load : {
url : '../_datasets/launch-saas.json'
}
}
},
columns : [
{ type : 'name', width : 250 }
],
// Custom task content, display task name on child tasks
taskRenderer({ taskRecord }) {
if (taskRecord.isLeaf && !taskRecord.isMilestone) {
return StringHelper.encodeHtml(taskRecord.name);
}
}
});
I hope it helps.
Hi Tasim,
Thanks for responding.
Do we need to import CycleResolutionPopup from "@bryntum/gantt"?
Because code is not able to find onApplyButtonClick function and variable schedulingIssue from extended class.
import { CycleResolutionPopup } from "@bryntum/gantt";
Thanks,
Shashank Yadav
Hatch Digital
Hi,
It's works fine for me in react
Here is how my code looks like in AppConfig file
/**
* Application configuration
*/
import React from 'react';
import DemoButton from './components/DemoButton';
import DemoEditor from './components/DemoEditor';
import { CycleResolutionPopup } from '@bryntum/gantt';
class CustomCycleResolution extends CycleResolutionPopup {
getResolutions() {
const
{ schedulingIssue } = this,
invalidDependencies = schedulingIssue?.getInvalidDependencies();
let resolutions = schedulingIssue?.getResolutions();
// If there are invalid dependencies involved (like parent-child or self-to-self)
// let's not suggests other resolutions to simplify the UI
if (resolutions && invalidDependencies.length) {
resolutions = resolutions.filter(r => r.dependency && invalidDependencies.includes(r.dependency));
}
/* eslint-disable no-unused-expressions */
resolutions?.shift();
return resolutions;
}
onApplyButtonClick() {
console.log('apply button clicked');
super.onApplyButtonClick()
}
}
const ganttConfig = {
project : {
autoLoad : true,
transport : {
load : {
url : 'data/launch-saas.json'
}
},
// 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
},
cycleResolutionPopupClass : CustomCycleResolution,
columns : [
{
type : 'name',
field : 'name',
width : 250,
renderer : ({ record }) => {
return record.isLeaf ? <span>{record.name}</span> : <b>{record.name}</b>;
}
},
{
text : 'Edit<div class="small-text">(React component)</div>',
htmlEncodeHeaderText : false,
width : 120,
editor : false,
align : 'center',
// Using custom React component
renderer : ({ record, grid, grid: { extraData } }) =>
record.isLeaf ? (
<DemoButton
text={'Edit'}
onClick={() => extraData.handleEditClick({ record, grid })}
/>
) : null
},
{
field : 'draggable',
text : 'Draggable<div class="small-text">(React editor)</div>',
htmlEncodeHeaderText : false,
width : 120,
align : 'center',
editor : ref => <DemoEditor ref={ref} />,
renderer : ({ value }) => (value ? 'Yes' : 'No')
}
],
viewPreset : 'weekAndDayLetter',
barMargin : 10
};
export { ganttConfig };
What errors do you get?
Hi,
I've updated one of our demo with the cycleResolution popup code (Angular)
Please find it attached below. You can run it with npm i && npm start
Please let us know if you have any other questions.
Thanks Tasim.
I do have a query, as after we select "Removing Dependencies" and then on Apply button.
The changes get applied to Gantt.
But we have observed that, the projectl -> stm is not tracking the changes made.
Is it expected behavior?
Is there any way that we can add that "removed depndency" change to project -> stm?
Thanks,
Shashank Yadav
Hatch Digital
Hi,
Sounds like a bug, we'll investigate it. Here is the ticket to track progress https://github.com/bryntum/support/issues/8811
Best regards,
Tasnim