易度甘特图默认提供的列如下:
project.tree.set('columns', [{
header: 'edo甘特图 - <a href="http://www.edojs.com" target="_blank">www.edojs.com</a>',
columns: [
//ID:索引号
Edo.project.GanttView.createColumn('ID'),
//状态
Edo.project.GanttView.createColumn('status'),
//任务名称
Edo.project.GanttView.createColumn('name'),
//工期
Edo.project.GanttView.createColumn('DURATION'),
//完成百分比
Edo.project.GanttView.createColumn('PERCENTCOMPLETE'),
//开始日期
Edo.project.GanttView.createColumn('START'),
//完成日期
Edo.project.GanttView.createColumn('FINISH'),
//任务相关性
Edo.project.GanttView.createColumn('PredecessorLink'),
//资源分配
Edo.project.GanttView.createColumn('ASSIGNMENT')
]
}]);
对应的效果图如下:
![EdoGantt甘特图中间件自定义任务列_休闲_02](http://www.edogantt.com/p_w_picpaths/column1.jpg)
你可以使用易度提供的标准列,自定义显示哪些列,以及列的顺序,如下:
project.tree.set({
columns:[{
header: '使用易度甘特图提供的标准列自定义列',
columns: [
Edo.project.GanttView.createColumn('ID'),
Edo.project.GanttView.createColumn('name'),
Edo.project.GanttView.createColumn('DURATION'),
Edo.project.GanttView.createColumn('START'),
Edo.project.GanttView.createColumn('FINISH')
]
}]
});
效果图如下:
![EdoGantt甘特图中间件自定义任务列_project_03](http://www.edogantt.com/p_w_picpaths/column3.jpg)
你也可以完全自定义列,自己编写任务属性的renderer单元格渲染器,代码如下:
project.tree.set({
treeColumn: 'createdate',
autoColumns: true,
columns: [
{
header: '易度甘特图',
columns: [
{
header: '创建日期',
id: 'createdate',
dataIndex: 'CreateDate',
editor: { //自定义列编辑器
type: 'date'
},
renderer: function(v, r, c){ //自定义列渲染器
return v.format('Y-m-d');
}
},
{
header: '任务名称',
dataIndex: 'Name',
editor: {
type: 'text'
},
renderer: function(v, r, c){
return '<span style="color:blue;">'+v+'</span>';
}
},
{
header: '解决人',
dataIndex: 'Assignments',
renderer: function(v, r, c, colIndex, data, tree){
if(v && v.length){
var s = "";
for(var i=0,l=v.length; i<l; i++){
var uid = v[i].ResourceUID;
if(uid > 0) {
s += project.data.getResource(uid).Name;
if(i != l-1) s += ',';
}
}
return s;
}
}
}
]
}
]
});
对应的效果图如下:
![EdoGantt甘特图中间件自定义任务列_gantt_04](http://www.edogantt.com/p_w_picpaths/column2.jpg)