Our state of the art Gantt chart


Post by johanbrodin »

Hi,

We want to preserve when users expand/collapse items saving gantts. The property for this is "expanded" for each item in Taskdata. However this is missing calling "this.gantt.project.inlineData" (see picture)

I would think this is a bug so please add that property.

Regards
Johan

Attachments
expanded.png
expanded.png (518.24 KiB) Viewed 298 times

Post by ghulam.ghous »

Hi there,

Can you please provide more context? I checked in our online basic example, it exists on it. How can I reproduce it? https://bryntum.com/products/gantt/examples/frameworks/react/javascript/inline-data/build/. Only the leaf nodes does not have this property, but it makes sense because they are leafs and going to be expanded or collapsed.


Post by johanbrodin »

Hi,

In your demo data you are hardcoding expanded (see picture) so not updated by the Gantt chart.

You can either reproduce this by removing this hardcoded property in your demo data. Or simple press collapse and then if you view the property you can see that it is still "expanded: true".

Attachments
demo data.png
demo data.png (174.02 KiB) Viewed 292 times

Post by ghulam.ghous »

Ok. Thanks for sharing this. I have checked with the team, and expanded is only the initial expanded state. If you want to check whether a record is expanded or not, you will have to use the isExpanded method. https://bryntum.com/products/gantt/docs/api/Gantt/model/TaskModel#function-isExpanded. This will always return the current state.

Regards,
Ghous


Post by johanbrodin »

Hi Ghous,

This would work but I do not see this as a good solution since it is both not effective and cumbersome. Can I ask you to discuse internally if you can implement the asked solution below.

Your suggested solution

  1. Loop through the taskData recursivly (items are not stored flat) and on each item call the isExpanded method
  2. Then set this value in the item expanded property

Asked solution

  1. inlineData returnes the property expanded in taskData which capture the state if an item is expanded/collapsed. With that we can just load the same data to preserve the expand/collapsed so working out of the box!

Regards
/Johan


Post by mats »

Seems like a bit of confusion here. What you need is to mark the expanded field as persistable, then you'll see it part of the dataset.

export default class Task extends TaskModel {

static $name = 'Task';

static get fields() {
    return [
        { name : 'expanded', persist : true },  
    ];
}

Post by johanbrodin »

Hi Mats,

Thx for clearifying. This is excatly the solution we are asking for.

However adding the expanded as persist is not making any difference (see below code snippits). Neither of the properties we add in the exported Task class are available with inlineData. So are we injecting the Task class correctly (works great for column but that is not what we are talking about here.)

//#1. our Task class with now the added expanded property.
import { TaskModel } from '@bryntum/gantt';

export default class Task extends TaskModel {
    //extra task fields
    static get fields() {
        return [
            { name : 'jiraId', type : 'string' },
            { name : 'jiraParentId', type : 'string' },
            { name : 'jiraInitiativeId', type : 'string' },
            { name : 'jiraAssignee', type : 'string' },
            { name : 'jiraType', type : 'string' },
            { name : 'jiraIssue', type : 'string' },               
{ name : 'bojaAddTaskTimestamp', type : 'string' },
{ name : 'expanded', persist : true } //getting the expand field with inlineData ]; } } //#2. Project model config with Task added to taskModelClass import Task from '../lib/Task.js'; getProjectModel(startDate: Date): Partial<ProjectModelConfig> { return { calendar: 'general', startDate: startDate, hoursPerDay: 24, daysPerWeek: 5, daysPerMonth: 20, taskModelClass : Task //injecting Task class in bryntum-gantt-project-model } }
//#3. config added to project model <bryntum-gantt-project-model #project [calendar] = "projectConfig.calendar!" [startDate] = "projectConfig.startDate!" [hoursPerDay] = "projectConfig.hoursPerDay!" [daysPerMonth] = "projectConfig.daysPerMonth!" [tasks] = "tasks" [timeRanges] = "timeRanges" [assignments] = "assignments" [resources] = "resources" [dependencies] = "dependencies" [calendars] = "ganttConfig.calendars" [taskModelClass] = "projectConfig.taskModelClass!" </bryntum-gantt-project-model>

Post by marcio »

Hey Johan,

Thanks for sharing.

The snippets that you shared are looking good. So it looks like a bug. I created a ticket to fix that https://github.com/bryntum/support/issues/9734.

Best regards,
Márcio


Post by johanbrodin »

Ok looking forward to the fix


Post Reply