dhtmlxGantt官方最新版免费下载试用,历史版本下载,在线文档和帮助文件下载-慧都网
此功能仅在 Gantt PRO 版本中可用。
DhtmlxGantt的资源控制,用于将多个资源及其数量分配给任务的复杂控件。
gantt.config.lightbox.sections = [
{name: "description", height: 38, map_to: "text", type: "textarea", focus: true},
{name:"owner",height:60, type:"resources", options:gantt.serverList("people"),
map_to:"owner_id", default_value:8},
{name: "time", type: "duration", map_to: "auto"}
];
分配多个资源
gantt.config.lightbox.sections = [
{ name:"description",height:38,map_to:"text",type:"textarea",focus:true },
{ name:"time",type:"duration",map_to:"auto" },
{ name:"rooms",type:"resources",map_to:"rooms", options:[
{ key: 1, label: "room 1", unit: "hours" },
{ key: 2, label: "room 2", unit: "hours" },
{ key: 3, label: "room 3", unit: "hours" }
]
}
];
gantt.locale.labels.section_rooms = "Rooms";
初始化
要将资源控件添加到灯箱,请按照以下步骤操作:
在灯箱配置中添加一个部分:
var roomsMap = [
{ key: 1, label: "room 1", unit: "hours" },
{ key: 2, label: "room 2", unit: "hours" },
{ key: 3, label: "room 3", unit: "hours" }
];
gantt.config.lightbox.sections = [
{ name:"description",height:38,map_to:"text",type:"textarea",focus:true },
{ name:"time",type:"duration",map_to:"auto" },
{ name:"rooms",type:"resources",map_to:"rooms", options:roomsMap}
];
为部分设置标签:
gantt.locale.labels.section_resources = "Rooms";
特性
以下属性最重要且通常用于资源控制:
- name - (字符串) 部分名称
- map_to - ( string ) 将被映射到该部分的数据属性的名称
- type - ( string )部分控件的类型
- options - ( array ) 对象数组。定义控件的选择选项(用于选择、复选框、单选和资源 控件)。数组中的每个对象都指定一个选项并包括以下属性:
- key - ( string ) 选项 id。此属性与任务数据属性进行比较以将选项分配给任务
- label - ( string ) 选项标签
- unit - ( number ) 资源的计量单位
- focus - ( boolean ) 如果设置为true,该部分将专注于打开灯箱
- default_value - ( any ) 该部分控件的默认值。如果资源的价值不足,则应用。选项数组中的每个选项都可以指定自己的默认值。
用数据填充控件
通常,要设置资源控制的值,请使用options参数:
gantt.config.lightbox.sections = [
{ name:"rooms",type:"resources",map_to:"rooms",
options:[
{ key: 1, label: "room 1", unit: "hours" },
{ key: 2, label: "room 2", unit: "hours" },
{ key: 3, label: "room 3", unit: "hours" }
]
}
];
options参数中的项目具有 3 个强制属性:
- key - 选项 ID
- label - 选项标签
- unit - 资源的计量单位
使用来自服务器的数据填充控件
要从服务器填充控件,请将options选项设置为serverList方法返回的值:
gantt.config.lightbox.sections = [
{name: "description", height: 38, map_to: "text", type: "textarea", focus: true},
{name: "resources", type: "resources", map_to: "owner_id", default_value:8,
options: gantt.serverList("people")},
{name: "time", type: "duration", map_to: "auto"}
];
gantt.init("gantt_here");
gantt.load("/data");
更多关于DhtmlxGantt教程的内容可进入官网查看。
DhtmlxGantt是针对您的解决方案的交互式JavaScript / HTML5甘特图。更多关于产品的疑问,都可以私信了解更多。
本文暂时没有评论,来添加一个吧(●'◡'●)