Extjs 甘特图自定义任务树

Extjs 甘特图自定义任务树

       Extjs 甘特图GanttPanel中默认的设置很难知足客户多变需求，咱们就针对一些经常使用的扩展作一个说明。 

      通常最经常使用的需求是，自定义多列，自定义行，自定义单元格等等。下面咱们就分别来讲明。

Extjs 甘特图自定义列

Extjs 甘特图GanttPanel的列配置对象，描述了表头、单元格、编辑器等重要配置。通常来讲， 咱们提供一个列配置对象，显示了“序号”、“任务名称”、“开始日期”、“完成日期”、“进度”等比较典型的列。 可是有时咱们会显示更多的任务属性，例如，任务的部门，负责人，地点等等。

Extjs 甘特图自定义列很是简单，只要在配置GanttPanel的列配置对象中多添加一个单元既可。见如下Extjs 甘特图例子

1.       var g = new Sch.gantt.GanttPanel({   

2.                   // Setup your static columns   

3.                   columns : [   

4.                       {   

5.                           header : 'Tasks',    

6.                           sortable:true,    

7.                           dataIndex : 'Name',    

8.                           locked : true,   

9.                           width:250,    

10.                       editor : new Ext.form.TextField()   

11.                   },{   

12.                       header : '更多列1',    

13.                       sortable:true,    

14.                       width:50,    

15.                       dataIndex : 'Other1',    

16.                       locked : true  

17.                   }   

18.               ],   

19.     

20.               taskStore : taskStore,   

21.               dependencyStore : dependencyStore   

22.   });  

Extjs 甘特图运行后的软件截图以下