gantt-task-react的改造使用

gantt-task-react的镜像地址

例子

改造1：切断父子关联关系，父为project组件，子为task组件，

原来的功能是task组件拖动会影响到父组件，现在切断两者关联关系，数据都用task组件，

给task组件重新给上父子关联关系

父节点特有：是否为组：isGroup: true, 是否展开：expanded: true
子节点特有：groupId（groupId为父节点id）

需要注意的是progress这个字段要传0，不然底色不是纯色

改造2：将原来的全部伸缩改造为默认展示五列

改造3：将原来的task组件一个图形，拆分为两个图形，上面一个图形为计划开始时间和计划结束时间，下面一个图形为实际开始时间和实际结束时间，上面的图形可以拖动，下面的图形只是展示用，没有任何事件。

最终实现效果图：

<Gantttasks={getVisibleTasks()}TaskListHeader={(props) => <TaskListHeader {...props} isChecked={isChecked} />}TaskListTable={(props) => <TaskListContent {...props} isChecked={isChecked}toggleGroupClick={toggleGroupClick}onSearchTask={() => searchTasksFunc({page: currentPage,size: currentSize})} />}TooltipContent={() => null}viewMode={view}listCellWidth={"120px"}isChecked={isChecked}toggleNumber={isChecked ? 11 : 5}columnWidth={columnWidth}ganttHeight={'calc(80vh - 120px)'}locale={'zh-cn'}onExpanderClick={toggleGroupClick}onDoubleClick={handleDblClick}onDateChange={handleTaskChange}/>