SFGantt 展示project网络图-CSDN博客

本文链接：https://blog.csdn.net/spapple/article/details/52022360

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="${basePath}js/gantt.js"
charset="utf-8"></script>
<script type="text/javascript">
var gtData, gtMap;
function onLoad()//在页面初始化的时候执行本函数
{
var strXML = parent.Ext.getCmp("showNetworkWindow").taskList;;//获取XML字符串传递参数
var doc = SFAjax.createDocument(strXML);
onGanttLoaded(doc);
// var path = "${pageContext.request.contextPath}/schedule/scheduleTaskList/showGantt.shtml?scheduleId=${param.scheduleId}";
// SFAjax.loadXml(path, onGanttLoaded); //通过Ajax模式下载对应的XML文件，并在下载完成之后执行onDataLoaded函数
}
function onGanttLoaded(doc) //doc参数是一个XML文件DOM对象
{
var gtConfig = new SFConfig(); //初始化一个页面上的配置对象
gtConfig.setConfig("SFGantt/container", "Div_Gantt"); //设置用来显示甘特图的层的ID
gtConfig.setConfig("SFGantt/idCellWidth", 0);//左侧ID列表的宽度，实际上也就是显示LOGO的宽度
gtConfig.setConfig("SFGantt/readOnly", true); //只读
// gtConfig.setConfig("SFGantt/disableContextMenu", true); //禁止右键菜单
gtConfig.setConfig("SFGanttField/dateShowFormat", "yyyy-MM-dd");//日期列显示格式
gtConfig.setConfig("SFGanttField/dateInputFormat", "yyyy-MM-dd");//日期列输入格式
gtConfig.setConfig("SFGantt/imgPath", "img/");//图片文件URL目录的路径

gtConfig.setConfig("SFGantt/showNetwork", true); //设置显示网络图
gtConfig.setConfig("SFGanttNetworkControl/dir", "x"); //网络图的显示方向，横向x,纵向y
// gtConfig.setConfig("SFGanttNetworkControl/combineLine",true); //网络图显示时是否将箭头线条合并使图看起来更简单

gtData = new SFData(new SFDataProject(doc)); //将doc对象初始化为一个甘特数据对象
gtMap = new SFGantt(gtConfig, gtData); //用相应的数据对象和配置对象创建甘特对象
gtMap.showMap(null, 5); //显示网络图
//计算所有任务的工期，任务都按照固定工期进行运算。
init();
CriticalPath();
}
function depose()//销毁甘特图以释放内存
{
if (gtData && gtMap) {
gtMap.depose();
gtData.depose();
gtMap = null;
gtData = null;
}
}

//向前递归推动任务
function forwardPush(task, earlystart) {
var succTask;
var aSuccTasks = task.getSuccessorTasks();

task.setProperty("EarlyStart", earlystart);
task.setProperty("EarlyFinish", dateAdd("s", task
.getProperty("Duration"), earlystart));

for (var i = 0; i < aSuccTasks.length; i++) {
succTask = aSuccTasks[i];//取得该链接的后续任务

if (succTask.getProperty("EarlyStart") < task
.getProperty("EarlyFinish")) {
//进行递归调用
//alert(task.getProperty("Name"));
forwardPush(succTask, task.getProperty("EarlyFinish"));
}
}
}

//向后递归推动任务
function backPull(task, latefinish) {
var predTask;
var aPredTasks = task.getPredecessorTasks();

task.setProperty("LateFinish", latefinish);
task.setProperty("LateStart", dateAdd("s", -task
.getProperty("Duration"), latefinish));

for (var i = 0; i < aPredTasks.length; i++) {
predTask = aPredTasks[i];//取得该链接的后续任务

if (predTask.getProperty("LateFinish") > task
.getProperty("LateStart")) {
//进行递归调用
backPull(predTask, task.getProperty("LateStart"));
}
}
}

//由于原任务中不含工期数据，需要先按照当前的计划开始和计划结束计算工期
function init() {

for (var clsTask = gtData.getRootTask(); clsTask != null; clsTask = clsTask
.getNextTask()) {
//任务工期按照天数进行计算
clsTask.setProperty("Duration", dateDiff("s", clsTask
.getProperty("Start"), clsTask.getProperty("Finish")));
//先给日期赋初值
if (!clsTask.getProperty("Summary")) {
clsTask.setProperty("EarlyStart", new Date(0));
clsTask.setProperty("EarlyFinish", new Date(0));
clsTask.setProperty("LateStart", new Date(9999, 9, 9));
clsTask.setProperty("LateFinish", new Date(9999, 9, 9));
}

//初始化后置任务链接，刚开始初始化时为提高效率，只按照xml结构初始化了前置任务链接，计划关键任务必须都初始化
//这个问题以后才能改进
clsTask.getSuccessorLinks();
}
}

function CriticalPath() {
var startTask;
var endTask;
var clsTask;
//一个项目应该只有一个起点任务和一个终点任务

//找到起点任务
for (clsTask = gtData.getRootTask(); clsTask != null; clsTask = clsTask
.getNextTask()) {
if (!clsTask.getProperty("Summary")
&& clsTask.getPredecessorTasks().length == 0) {
startTask = clsTask;
break;
}
}

//向后计算每个任务的最早开始时间
forwardPush(startTask, startTask.getProperty("Start"));

//找到终点任务
for (clsTask = gtData.getRootTask(); clsTask != null; clsTask = clsTask
.getNextTask()) {
if (!clsTask.getProperty("Summary")
&& clsTask.getSuccessorTasks().length == 0) {
endTask = clsTask;
//alert(endTask.getProperty("Name"));
//break;
}
}

//向前计算每个任务的最晚完成时间
backPull(endTask, endTask.getProperty("EarlyFinish"));

//如果最早开始时间=最晚开始时间，则该任务为关键路径上的任务
for (clsTask = gtData.getRootTask(); clsTask != null; clsTask = clsTask
.getNextTask()) {
if (!clsTask.getProperty("Summary")
&& clsTask.getProperty("EarlyStart").toString() == clsTask
.getProperty("LateStart").toString()) {
clsTask.setProperty("IsKeyTask", true);
if (clsTask.getProperty("Duration") > 0)//里程碑不采用这种样式
clsTask.setProperty("ClassName", "TaskImportant");
else
clsTask.setProperty("ClassName", "MilestoneCircle");
}
}

//将关键路径的链接线改称不同样式显示,从起点任务开始
SetKeyLinkStyle(startTask)

}

function SetKeyLinkStyle(task) {
var succTask;
var succLink;
var aSuccLinks = task.getSuccessorLinks();

for (var i = 0; i < aSuccLinks.length; i++) {
succLink = aSuccLinks[i]
succTask = succLink.getSuccessorTask(); //取得该链接的后续任务
if (succTask.getProperty("IsKeyTask"))//如果后续任务也是关键任务
{
succLink.setProperty("ClassName", "RedDashed");
//进行递归调用
SetKeyLinkStyle(succTask);
}

}
}

//日期相加函数
function dateAdd(interval, number, date) {
var dt = new Date(date.valueOf());

switch (interval.toLowerCase()) {
case "y":
return new Date(dt.setFullYear(dt.getFullYear() + number));
case "m":
return new Date(dt.setMonth(dt.getMonth() + number));
case "d":
return new Date(dt.setDate(dt.getDate() + number));
case "w":
return new Date(dt.setDate(dt.getDate() + 7 * number));
case "h":
return new Date(dt.setHours(dt.getHours() + number));
case "n":
return new Date(dt.setMinutes(dt.getMinutes() + number));
case "s":
return new Date(dt.setSeconds(dt.getSeconds() + number));
case "l":
return new Date(dt.setMilliseconds(dt.getMilliseconds() + number));
}
}

//日期差异函数
function dateDiff(strInterval, dtStart, dtEnd) {
switch (strInterval) {
case 's':
return parseInt((dtEnd - dtStart) / 1000);
case 'n':
return parseInt((dtEnd - dtStart) / 60000);
case 'h':
return parseInt((dtEnd - dtStart) / 3600000);
case 'd':
return parseInt((dtEnd - dtStart) / 86400000);
case 'w':
return parseInt((dtEnd - dtStart) / (86400000 * 7));
case 'm':
return (dtEnd.getMonth() + 1)
+ ((dtEnd.getFullYear() - dtStart.getFullYear()) * 12)
- (dtStart.getMonth() + 1);
case 'y':
return dtEnd.getFullYear() - dtStart.getFullYear();
case 'd-h':
return parseFloat((dtEnd - dtStart) / 86400000).toFixed(2);
}
}
</script>
</head>
<body οnlοad="onLoad()">
<div id="content">
<div id="Div_Gantt" style="width: 100%; height: 100%"></div>
</div>
</body>
</html>