Our state of the art Gantt chart


Post by awakeb1 »

Hi support team,

I have a scenario as:

  • I create a template to reuse later. For example my template was created from Aug 01 2020. It means Start Date of template project also Aug 01 2020. Now I use this template for new project with Start Date is Oct 04 2021. The problem I faced that the template I used was created from 2020, so its holidays totally difference with 2021. So my expectation that after project loaded, I want to force the button sync is enable and can sync all tasks again. Why I need to able to sync at the first time when project loaded? Because Bryntum Gantt will auto update Start & Finish based on calendar of the year 2021 that I passed.

Here is my code after applied the template:

data.json
(1.62 MiB) Downloaded 42 times

And here is image of data above loaded on Bryntum Gantt. Start & Finish Date are totally difference with the code above. but I don't know why the button save is disabled

after applied template.PNG
after applied template.PNG (98.12 KiB) Viewed 777 times

Please help me how to force enable to save all tasks?

Thanks


Post by alex.l »

Could you please share the code? How did you load your data, what Gantt initial config do you use. If you loaded that data, there is nothing to sync.
Try to call gantt.project.commitAsync, but better to share the code to see what's happening.

All the best,
Alex


Post by awakeb1 »

Hi Alex,

I already attached data.json file in previous post. you can try to use my data in bryntum aspnetcore example, you will see the Start & Finish Date in data.json file and bryntum gantt chart showing totally difference.

PS: I tried to call gantt.project.commitAsync() but no luck

Thanks


Post by alex.l »

Ok, I tried to load the project you attached using gantt.project.applyLoadResponse() method.
The problem that startDate for the project applies only after first data loading.
If you want to load another project, you could try to set startData manually using gantt.project.startDate = date, or you have to create new project with your data.

const project = new Project({...});
gantt.project = project;

All the best,
Alex


Post by awakeb1 »

Hi Alex,

My expectation is force to enable button save and save all tasks. Because the data show in Bryntum Gantt is right and it applied correct calendar holiday.

Again, is there any way to force all tasks is dirty to able to save all tasks?

Thanks


Post by arcady »

There are two reasons for that:
1) crud manager which is used for data loading explicitly makes all loaded records not dirty
2) another reason is records are not phantom (https://bryntum.com/docs/gantt/#Core/data/Model#property-isPhantom). They all have real identifiers so only their changes will be sent back to the server. If you want the whole records to be sent to the server you need to process them to make them phantom.

We have the msprojectimport demo that actually does a similar thing it loads data from the server and processes records one by one to reset their identifiers and thus makes them phantom. So the records are treated as new ones and can be sent to the server. So you can check the code of that demo (namely examples/msprojectimport/lib/Importer.js file code).
The demo does not use crud manager directly just because of the reason #1 mentioned above.

So you can do something similar.


Post by arcady »

BTW a bit hackish way to workaround the phatomness problem is returning records from the server w/ identifiers looking like this "_generatedXXX". For example:

 "resources" : {
    "rows" : [
      { "id" : "_generated1", "name" : "Celia", "city" : "Barcelona", "calendar" : null, "image" : "celia.jpg" },
...

Or you can override isPhantom method so it would rely on some special field responsible for saying if a record is phantom.


Post by awakeb1 »

Hi Arcady,

I use the same approach with bryntum demo import mpp, mean I used Import.js library
Here is my data return and use in Import.js library:

{
    "success": true,
    "data": {
        "project": {
            "calendar": 3,
            "hoursPerDay": 8,
            "daysPerWeek": 5,
            "daysPerMonth": 20,
            "startDate": "2021-10-04"
        },
        "calendars": {
            "children": [
                {
                    "id": 3,
                    "parentIdRaw": null,
                    "name": "General",
                    "daysPerMonth": 20,
                    "daysPerWeek": 5,
                    "hoursPerDay": 8,
                    "isCompanyCalendar": true,
                    "unspecifiedTimeIsWorking": false,
                    "Parent": null,
                    "intervals": [
                        {
                            "id": 1,
                            "recurrentStartDate": "on Monday at 08:00",
                            "recurrentEndDate": "on Monday at 12:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 2,
                            "recurrentStartDate": "on Monday at 13:00",
                            "recurrentEndDate": "on Monday at 17:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 3,
                            "recurrentStartDate": "on Tuesday at 08:00",
                            "recurrentEndDate": "on Tuesday at 12:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 4,
                            "recurrentStartDate": "on Tuesday at 13:00",
                            "recurrentEndDate": "on Tuesday at 17:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 5,
                            "recurrentStartDate": "on Wednesday at 08:00",
                            "recurrentEndDate": "on Wednesday at 12:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 6,
                            "recurrentStartDate": "on Wednesday at 13:00",
                            "recurrentEndDate": "on Wednesday at 17:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 7,
                            "recurrentStartDate": "on Thursday at 08:00",
                            "recurrentEndDate": "on Thursday at 12:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 8,
                            "recurrentStartDate": "on Thursday at 13:00",
                            "recurrentEndDate": "on Thursday at 17:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 9,
                            "recurrentStartDate": "on Friday at 08:00",
                            "recurrentEndDate": "on Friday at 12:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 10,
                            "recurrentStartDate": "on Friday at 13:00",
                            "recurrentEndDate": "on Friday at 17:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 11,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-01-01",
                            "endDate": "2021-01-02",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 12,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-01-26",
                            "endDate": "2021-01-27",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 13,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-03-01",
                            "endDate": "2021-03-02",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 14,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-04-02",
                            "endDate": "2021-04-03",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 15,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-04-05",
                            "endDate": "2021-04-06",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 16,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-04-25",
                            "endDate": "2021-04-26",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 17,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-04-26",
                            "endDate": "2021-04-27",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 18,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-06-07",
                            "endDate": "2021-06-08",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 19,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-09-27",
                            "endDate": "2021-09-28",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 20,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-12-25",
                            "endDate": "2021-12-26",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 21,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-12-26",
                            "endDate": "2021-12-27",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 22,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-12-27",
                            "endDate": "2021-12-28",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 23,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-12-28",
                            "endDate": "2021-12-29",
                            "isWorking": false,
                            "cls": null
                        }
                    ],
                    "leaf": true,
                    "children": [],
                    "tasks": [],
                    "resources": []
                },
                {
                    "id": 4,
                    "parentIdRaw": null,
                    "name": "Night Shift 4 day",
                    "daysPerMonth": 16,
                    "daysPerWeek": 4,
                    "hoursPerDay": 8,
                    "isCompanyCalendar": false,
                    "unspecifiedTimeIsWorking": false,
                    "Parent": null,
                    "intervals": [
                        {
                            "id": 24,
                            "recurrentStartDate": "on Monday at 22:00",
                            "recurrentEndDate": "on Tuesday at 02:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 25,
                            "recurrentStartDate": "on Tuesday at 03:00",
                            "recurrentEndDate": "on Tuesday at 07:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 26,
                            "recurrentStartDate": "on Tuesday at 22:00",
                            "recurrentEndDate": "on Wednesday at 02:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 27,
                            "recurrentStartDate": "on Wednesday at 03:00",
                            "recurrentEndDate": "on Wednesday at 07:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 28,
                            "recurrentStartDate": "on Wednesday at 22:00",
                            "recurrentEndDate": "on Thursday at 02:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 29,
                            "recurrentStartDate": "on Thursday at 03:00",
                            "recurrentEndDate": "on Thursday at 07:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 30,
                            "recurrentStartDate": "on Thursday at 22:00",
                            "recurrentEndDate": "on Friday at 02:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 31,
                            "recurrentStartDate": "on Friday at 03:00",
                            "recurrentEndDate": "on Friday at 07:00",
                            "startDate": null,
                            "endDate": null,
                            "isWorking": true,
                            "cls": null
                        },
                        {
                            "id": 32,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-01-01",
                            "endDate": "2021-01-02",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 33,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-01-26",
                            "endDate": "2021-01-27",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 34,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-03-01",
                            "endDate": "2021-03-02",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 35,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-04-02",
                            "endDate": "2021-04-03",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 36,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-04-05",
                            "endDate": "2021-04-06",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 37,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-04-25",
                            "endDate": "2021-04-26",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 38,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-04-26",
                            "endDate": "2021-04-27",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 39,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-06-07",
                            "endDate": "2021-06-08",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 40,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-09-27",
                            "endDate": "2021-09-28",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 41,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-12-25",
                            "endDate": "2021-12-26",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 42,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-12-26",
                            "endDate": "2021-12-27",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 43,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-12-27",
                            "endDate": "2021-12-28",
                            "isWorking": false,
                            "cls": null
                        },
                        {
                            "id": 44,
                            "recurrentStartDate": null,
                            "recurrentEndDate": null,
                            "startDate": "2021-12-28",
                            "endDate": "2021-12-29",
                            "isWorking": false,
                            "cls": null
                        }
                    ],
                    "leaf": true,
                    "children": [],
                    "tasks": [],
                    "resources": []
                }
            ]
        },
        "resources": [],
        "tasks": [
            {
                "name": "Root",
                "startDate": "2020-09-28",
                "endDate": "2020-10-01",
                "duration": 4,
                "durationUnit": "day",
                "percentDone": 0,
                "schedulingMode": "Normal",
                "baselineStartDate": null,
                "baselineEndDate": null,
                "baselinePercentDone": null,
                "cls": "",
                "expanded": false,
                "effort": 16,
                "effortUnit": "hour",
                "note": null,
                "constraintType": "startnoearlierthan",
                "constraintDate": "2020-09-28",
                "manuallyScheduled": false,
                "draggable": true,
                "resizable": true,
                "rollup": false,
                "showInTimeline": false,
                "color": null,
                "deadlineDate": null,
                "index": null,
                "Code": "TASK.00001",
                "TaskTemplateId": 18,
                "ActualDuration": null,
                "CompletedPercentage": 0,
                "id": 2187,
                "baselines": null,
                "calendarId": null,
                "leaf": false,
                "children": [
                    {
                        "name": "Task 1",
                        "startDate": "2020-09-28",
                        "endDate": "2020-10-01",
                        "duration": 4,
                        "durationUnit": "day",
                        "percentDone": 0,
                        "schedulingMode": "Normal",
                        "baselineStartDate": null,
                        "baselineEndDate": null,
                        "baselinePercentDone": null,
                        "cls": "",
                        "expanded": false,
                        "effort": 8,
                        "effortUnit": "hour",
                        "note": null,
                        "constraintType": "startnoearlierthan",
                        "constraintDate": "2020-09-28",
                        "manuallyScheduled": false,
                        "draggable": true,
                        "resizable": true,
                        "rollup": false,
                        "showInTimeline": false,
                        "color": null,
                        "deadlineDate": null,
                        "index": null,
                        "Code": "TASK.00002",
                        "TaskTemplateId": 18,
                        "ActualDuration": null,
                        "CompletedPercentage": 0,
                        "id": 2188,
                        "baselines": null,
                        "calendarId": null,
                        "leaf": true,
                        "children": null,
                        "ActualStartDate": null,
                        "ActualFinishDate": null,
                        "ActualEffortHours": 0,
                        "Baseline1StartDate": null,
                        "Baseline1EndDate": null,
                        "ProjectID": 0,
                        "OriginalID": null,
                        "InVisible": false,
                        "IsDetailTask": null,
                        "FromViewCRChanges": false,
                        "ChildrenRaw": [],
                        "parent": null
                    },
                    {
                        "name": "Task",
                        "startDate": "2020-09-28",
                        "endDate": "2020-09-29",
                        "duration": 2,
                        "durationUnit": "day",
                        "percentDone": 0,
                        "schedulingMode": "Normal",
                        "baselineStartDate": null,
                        "baselineEndDate": null,
                        "baselinePercentDone": null,
                        "cls": "",
                        "expanded": false,
                        "effort": 8,
                        "effortUnit": "hour",
                        "note": null,
                        "constraintType": "startnoearlierthan",
                        "constraintDate": "2020-09-28",
                        "manuallyScheduled": false,
                        "draggable": true,
                        "resizable": true,
                        "rollup": false,
                        "showInTimeline": false,
                        "color": null,
                        "deadlineDate": null,
                        "index": null,
                        "Code": "TASK.00003",
                        "TaskTemplateId": 18,
                        "ActualDuration": null,
                        "CompletedPercentage": 0,
                        "id": 2189,
                        "baselines": null,
                        "calendarId": null,
                        "leaf": true,
                        "children": null,
                        "ActualStartDate": null,
                        "ActualFinishDate": null,
                        "ActualEffortHours": 0,
                        "Baseline1StartDate": null,
                        "Baseline1EndDate": null,
                        "ProjectID": 0,
                        "OriginalID": null,
                        "InVisible": false,
                        "IsDetailTask": null,
                        "FromViewCRChanges": false,
                        "ChildrenRaw": [],
                        "parent": null
                    }
                ],
                "ActualStartDate": null,
                "ActualFinishDate": null,
                "ActualEffortHours": 0,
                "Baseline1StartDate": null,
                "Baseline1EndDate": null,
                "ProjectID": 0,
                "OriginalID": null,
                "InVisible": false,
                "IsDetailTask": null,
                "FromViewCRChanges": false,
                "ChildrenRaw": [
                    {
                        "name": "Task 1",
                        "startDate": "2020-09-28",
                        "endDate": "2020-10-01",
                        "duration": 4,
                        "durationUnit": "day",
                        "percentDone": 0,
                        "schedulingMode": "Normal",
                        "baselineStartDate": null,
                        "baselineEndDate": null,
                        "baselinePercentDone": null,
                        "cls": "",
                        "expanded": false,
                        "effort": 8,
                        "effortUnit": "hour",
                        "note": null,
                        "constraintType": "startnoearlierthan",
                        "constraintDate": "2020-09-28",
                        "manuallyScheduled": false,
                        "draggable": true,
                        "resizable": true,
                        "rollup": false,
                        "showInTimeline": false,
                        "color": null,
                        "deadlineDate": null,
                        "index": null,
                        "Code": "TASK.00002",
                        "TaskTemplateId": 18,
                        "ActualDuration": null,
                        "CompletedPercentage": 0,
                        "id": 2188,
                        "baselines": null,
                        "calendarId": null,
                        "leaf": true,
                        "children": null,
                        "ActualStartDate": null,
                        "ActualFinishDate": null,
                        "ActualEffortHours": 0,
                        "Baseline1StartDate": null,
                        "Baseline1EndDate": null,
                        "ProjectID": 0,
                        "OriginalID": null,
                        "InVisible": false,
                        "IsDetailTask": null,
                        "FromViewCRChanges": false,
                        "ChildrenRaw": [],
                        "parent": null
                    },
                    {
                        "name": "Task",
                        "startDate": "2020-09-28",
                        "endDate": "2020-09-29",
                        "duration": 2,
                        "durationUnit": "day",
                        "percentDone": 0,
                        "schedulingMode": "Normal",
                        "baselineStartDate": null,
                        "baselineEndDate": null,
                        "baselinePercentDone": null,
                        "cls": "",
                        "expanded": false,
                        "effort": 8,
                        "effortUnit": "hour",
                        "note": null,
                        "constraintType": "startnoearlierthan",
                        "constraintDate": "2020-09-28",
                        "manuallyScheduled": false,
                        "draggable": true,
                        "resizable": true,
                        "rollup": false,
                        "showInTimeline": false,
                        "color": null,
                        "deadlineDate": null,
                        "index": null,
                        "Code": "TASK.00003",
                        "TaskTemplateId": 18,
                        "ActualDuration": null,
                        "CompletedPercentage": 0,
                        "id": 2189,
                        "baselines": null,
                        "calendarId": null,
                        "leaf": true,
                        "children": null,
                        "ActualStartDate": null,
                        "ActualFinishDate": null,
                        "ActualEffortHours": 0,
                        "Baseline1StartDate": null,
                        "Baseline1EndDate": null,
                        "ProjectID": 0,
                        "OriginalID": null,
                        "InVisible": false,
                        "IsDetailTask": null,
                        "FromViewCRChanges": false,
                        "ChildrenRaw": [],
                        "parent": null
                    }
                ],
                "parent": null
            }
        ],
        "assignments": [],
        "dependencies": [],
        "columns": []
    }
}

Here is UI after imported:

button save still enable.PNG
button save still enable.PNG (80.27 KiB) Viewed 733 times

Please take a look at the image above. isPhantom value of all records are true and all ids value are "generatedClassDefEx1", "generatedClassDefEx2" and "_generatedClassDefEx3". All data seem the same with what you suggested but the button save still not enable for save.

Please help!

Thanks


Post by arcady »

Please try setting silenceInitialCommit to false on the project.
It cleans up data changes so stores look not having anything to sync after data lading.


Post by awakeb1 »

Hi,

I tried to set silenceInitialCommit to false as you suggested, but still no luck.

button save still enable 2.PNG
button save still enable 2.PNG (121.86 KiB) Viewed 726 times

Note: in Import.js also set silenceInitialCommit to false

Could you please try to use my data in bryntum demo: https://dev.bryntum.com/examples/gantt-vanilla/examples/msprojectimport/index.html ?


Post Reply