Extjs 如何在Bryntum'；甘特是谁？

我的甘特图上有一个资源分配列。 我可以更改作业，但我想知道如何保存它们？

---

我还可以更改工作分配的默认单位百分比tot小时

在CrudManager上读一点，它处理数据加载和保存。这个链接有你所需要的一切

导言

本指南介绍如何将CRUD管理器与Ext甘特图一起使用。它只包含特定于甘特图的详细信息。有关CRUD manager实现和体系结构的一般信息，请参阅本指南

为Ext甘特图实现CRUD管理器的类称为Gnt.data.CrudManager。它使用AJAX作为传输系统，JSON作为编码格式。 使用CRUD管理器的好处

在ExtGantt的早期版本中，必须使用标准ExtJS数据包加载和保存数据。这将涉及在数据存储上设置代理，并在每个这样的存储上处理加载和保存。这种方法可行，但也有一些缺点：

To load data into the Gantt, you had to deal with each store separately. In the worst case, this could mean about 4-5 ajax requests to load the Gantt chart (Tasks, Dependencies, Resources, Assignments, Calendars) depending on which features you used.
Hard to use database transactions on the server side.

出于性能原因，显然我们希望加载过程使用单个请求，返回甘特图中使用的所有存储所使用的数据。这现在很容易实现，因为CM在一个请求中加载数据。在保存更改时，您通常希望使用基于“全部或无”事务的方法在数据库中持久化更新。如果使用两个单独的ajax请求，这是不可行的。 商店

Ext甘特图中使用了许多不同的数据实体：日历、资源、工作分配、依赖项和任务。要向Gnt.data.CrudManager实例注册它们，应分别使用以下配置：calendarManager、resourceStore、assignmentStore、dependencyStore、taskStore

以下是基本配置的外观：

var crudManager = new Gnt.data.CrudManager({
    autoLoad        : true,
    calendarManager : calendarManager,
    resourceStore   : resourceStore,
    dependencyStore : dependencyStore,
    assignmentStore : assignmentStore
    taskStore       : taskStore,
    transport       : {
        load    : {
            url     : 'php/read.php'
        },
        sync    : {
            url     : 'php/save.php'
        }
    }
});

后端（在本例中为“read.php”）应返回类似于下面所示的JSON：

{
    "success"      : true,

    "dependencies" : {
        "rows" : [
            {"Id" : 1, "From" : 11, "To" : 17, "Type" : 2, "Lag" : 0, "Cls" : "", "LagUnit" : "d"},
            {"Id" : 2, "From" : 12, "To" : 17, "Type" : 2, "Lag" : 0, "Cls" : "", "LagUnit" : "d"},
            {"Id" : 3, "From" : 13, "To" : 17, "Type" : 2, "Lag" : 0, "Cls" : "", "LagUnit" : "d"}
        ]
    },

    "assignments" : {
        "rows" : [
            {
                "Id"         : 1,
                "TaskId"     : 11,
                "ResourceId" : 1,
                "Units"      : 100
            },
            {
                "Id"         : 2,
                "TaskId"     : 11,
                "ResourceId" : 2,
                "Units"      : 80
            }
        ]
    },

    "resources" : {
        "rows" : [
            {"Id" : 1, "Name" : "Mats" },
            {"Id" : 2, "Name" : "Nickolay" },
            {"Id" : 3, "Name" : "Goran" }
        ]
    },

    "tasks" : {
        "rows" : [
            {
                "BaselineEndDate"   : "2010-01-28",
                "Id"                : 11,
                "leaf"              : true,
                "Name"              : "Investigate",
                "PercentDone"       : 50,
                "TaskType"          : "LowPrio",
                "StartDate"         : "2010-01-18",
                "BaselineStartDate" : "2010-01-20",
                "Segments"          : [
                    {
                        "Id"                : 1,
                        "StartDate"         : "2010-01-18",
                        "Duration"          : 1
                    },
                    {
                        "Id"                : 2,
                        "StartDate"         : "2010-01-20",
                        "Duration"          : 2
                    },
                    {
                        "Id"                : 3,
                        "StartDate"         : "2010-01-25",
                        "Duration"          : 5
                    }
                ]
            },
            {
                "BaselineEndDate"   : "2010-02-01",
                "Id"                : 12,
                "leaf"              : true,
                "Name"              : "Assign resources",
                "PercentDone"       : 50,
                "StartDate"         : "2010-01-18",
                "BaselineStartDate" : "2010-01-25",
                "Duration"          : 10
            },
            {
                "BaselineEndDate"   : "2010-02-01",
                "Id"                : 13,
                "leaf"              : true,
                "Name"              : "Gather documents (not resizable)",
                "Resizable"         : false,
                "PercentDone"       : 50,
                "StartDate"         : "2010-01-18",
                "BaselineStartDate" : "2010-01-25",
                "Duration"          : 10
            },
            {
                "BaselineEndDate"   : "2010-02-04",
                "Id"                : 17,
                "leaf"              : true,
                "Name"              : "Report to management",
                "PercentDone"       : 0,
                "StartDate"         : "2010-01-30",
                "BaselineStartDate" : "2010-01-29",
                "Duration"          : 0
            }
        ]
    }
}

如果已为任务存储实例指定了calendarManager、resourceStore、dependencyStore和assignmentStore配置，则不应指定这些配置。在这种情况下，CRUD管理器将仅从提供的任务存储实例中获取它们：

var taskStore = new Gnt.data.TaskStore({
    calendarManager : calendarManager,
    resourceStore   : resourceStore,
    dependencyStore : dependencyStore,
    assignmentStore : assignmentStore
});

var crudManager = new Gnt.data.CrudManager({
    // Specifying TaskStore only
    taskStore       : taskStore,
    transport       : {
        load    : {
            url     : 'php/read.php'
        },
        sync    : {
            url     : 'php/save.php'
        }
    }
});

您可以使用存储配置提供任意数量的附加存储：

var crudManager=新Gnt.data.crudManager({ taskStore:taskStore， 门店：[门店1、门店2、门店3]， 运输：{ 负载：{ url:'php/read.php' }, 同步：{ url:'php/save.php' } } });

或者使用addStore方法以编程方式添加它们：

crudManager.addStore([ store2, store3 ]);

实施

以下是如何创建CRUD管理器：

var crudManager = new Gnt.data.CrudManager({
    autoLoad        : true,
    taskStore       : taskStore,
    transport       : {
        load    : {
            url     : 'php/read.php'
        },
        sync    : {
            url     : 'php/save.php'
        }
    }
});

在上面的示例数据中，加载操作将自动启动，因为配置CM时自动加载选项设置为true。还有一种加载方法可以手动调用加载：

crudManager.load(function (response) {
    alert('Data loaded...');
})

要自动保存更改，有一个自动同步选项，当然，如果需要，您也可以手动调用同步方法：

crudManager.sync(function (response) {
    alert('Changes saved...');
});

通过提供crudManager配置，可以将任何Gnt.panel.Gantt实例配置为使用CRUD管理器。在这种情况下，不需要在甘特图面板上指定taskStore、dependencyStore、resourceStore、assignmentStore。它们将从提供的crudManager实例中获取

new Gnt.panel.Gantt({
    viewPreset          : 'dayAndWeek',
    startDate           : new Date(2014, 0, 1),
    endDate             : new Date(2014, 1, 1),
    width               : 800,
    height              : 350,
    // point grid to use CRUD manager
    crudManager         : crudManager
    columns             : [
        {
            xtype   : 'namecolumn'
        },
        {
            xtype   : 'startdatecolumn'
        }
    ]
});

日历

Gnt.data.CrudManager支持批量加载项目中的所有项目日历。要做到这一点，必须指定Gnt.data.CrudManager.calendarManager配置，或者可以在任务存储中指定它

var calendarManager   = Ext.create('Gnt.data.CalendarManager', {
    calendarClass   : 'Gnt.data.calendar.BusinessTime'
});

...

var taskStore     = Ext.create('Gnt.data.TakStore', {
    // taskStore calendar will automatically be set when calendarManager gets loaded
    calendarManager : calendarManager,
    resourceStore   : resourceStore,
    dependencyStore : dependencyStore,
    assignmentStore : assignmentStore
});

var crudManager   = Ext.create('Gnt.data.CrudManager', {
    autoLoad        : true,
    taskStore       : taskStore,
    transport       : {
        load    : {
            url     : 'php/read.php'
        },
        sync    : {
            url     : 'php/save.php'
        }
    }
});

荷载响应结构

日历管理器负载响应的结构比所描述的常规响应稍微复杂一些

与标准响应的第一个区别是，对于每个日历，我们将其数据包含在Days字段下。“天数”字段下的对象与包含存储数据的任何其他对象的结构完全相同。它有包含日历记录数组的行（每个记录代表一个Gnt.model.CalendarDay实例），total定义了这些记录的数量

另一件需要注意的事情是如何将元数据用于日历管理器加载。它具有projectCalendar属性，该属性必须包含应用作项目日历的日历的标识符

{
    requestId   : 123890,
    revision    : 123,
    success     : true,

    calendars   : {
        // each record represents a Gnt.model.Calendar instance
        rows        : [
            {
                Id                  : "1",
                parentId            : null,
                Name                : "General",
                DaysPerMonth        : 20,
                DefaultAvailability : ["08:00-12:00","13:00-17:00"],
                ...
                // the calendar data
                Days                : {
                    // each record represents Gnt.model.CalendarDay instance
                    rows    : [{
                        Id                  : 2,
                        calendarId          : "1",
                        Name                : "Some big holiday",
                        Type                : "DAY",
                        Date                : "2010-01-14",
                        Availability        : [],
                        Weekday             : 0,
                        OverrideStartDate   : null,
                        OverrideEndDate     : null,
                        IsWorkingDay        : false,
                        Cls                 : "gnt-national-holiday"
                    }],
                    total   : 1
                },
                // child calendars go here
                // each record represents a Gnt.model.Calendar instance
                children    : [{
                    Id          : "2",
                    parentId    : "1",
                    Name        : "Holidays",
                    ...
                    // "Holidays" calendar data
                    Days        : {
                        // each record represents Gnt.model.CalendarDay instance
                        rows    : [
                            {
                                Id          : 3,
                                calendarId  : "2",
                                Name        : "Mats's birthday",
                                Date        : "2010-01-13",
                                ...
                            },
                            {
                                Id          : 4
                                calendarId  : "2",
                                Name        : "Bryntum company holiday",
                                Date        : "2010-02-01",
                                ...
                            },
                            {
                                Id          : 5,
                                calendarId  : "2",
                                Name        : "Bryntum 1st birthday",
                                Date        : "2010-12-01",
                                ...
                            }
                        ],
                        total   : 3
                    },
                    leaf    : true
                }]
            }
        ],
        total       : 2,
        metaData    : {
            // this specifies the identifier of the project calendar
            projectCalendar : "1"
        }

    },

    store2      : {
        ...
    },

    store3      : {
        ...
    }
}

---

好的，垫子！但是我想知道是否可以将资源分配的默认百分比单位更改为小时