Flex 绘制甘特图

?

?

?

?

?

?

?

//生成甘特图
	private function renderGanttChart():void
	{
		this.clearGanttChart(); //清除甘特图
		
		var startDate:Date = this.taskList.getItemAt(0).plannedStartDate;
		var endDate:Date = this.taskList.getItemAt(0).plannedEndDate;
		var leaf:String = this.taskList.getItemAt(0).leaf;
		var duration:Number = this.taskList.getItemAt(0).duration;
		
		
		//甘特图开始日期（周日）
		var beginSunday:Date = this.getStartDate4GanttChart(startDate);
		//甘特图结束日期（周六）
		var endSaturday:Date = this.getEndDate4GanttChart(endDate);
		//计算起止两个周日的间隔天数（一定为7的倍数）
		var intervalBetweenSundays:Number = this.getDateInterval(beginSunday,new Date(endSaturday.getFullYear(),endSaturday.getMonth(),endSaturday.getDate() + 1));
		//计算起止两个周日间隔的周数
		var numberOfWeeks:Number = intervalBetweenSundays / 7;
		
		//绘制甘特图标题栏的上部区域
		//注意：前面多显示一周，后面多显示一周
		for(var i:Number = -1; i <= numberOfWeeks; ++i)
		{
			var hbox:HBox = new HBox();
			hbox.height = 20;
			hbox.width = 140;
			hbox.setStyle("borderStyle","solid");
			hbox.setStyle("borderThickness","1");
			hbox.setStyle("borderColor","black");
			hbox.setStyle("horizontalAlign","center");
			hbox.setStyle("backgroundColor","0XD7D7D7");
			
			if(-1 != i)
			{
				hbox.setStyle("borderSides","top right bottom"); //从第二个开始不显示左边框
			}
			
			var label:Label = new Label();
			label.text = this.getDateByIndexOfWeek(i,beginSunday); 
			
			hbox.addChild(label);
			
			this.upper.addChild(hbox);
		}
		
		//绘制甘特图下部区域
		for(var i:Number = 0; i < intervalBetweenSundays + 14; ++i)
		{
			var hbox:HBox = new HBox();
			hbox.height = 20;
			hbox.width = 20;
			hbox.setStyle("borderStyle","0XD7D7D7");
			hbox.setStyle("borderSides","left right bottom"); 
			
			if(0 != i)
			{
				hbox.setStyle("borderSides","right bottom");
			}
			
			var label:Label = new Label();
			label.text = this.getDayByIndex(i); 
			
			hbox.addChild(label);
			
			this.lower.addChild(hbox);
		}
		
		//绘制星期分割线
		this.canvas.graphics.lineStyle(1,0X0000FF);
		
		for(var i:Number = 0; i < numberOfWeeks + 2; ++i)
		{
			var startPoint:Point = new Point(140 * i,0);
			var endPoint:Point = new Point(140 * i,300); //此处的变量y需要替换掉
			
			var maxDistance:Number = Point.distance(startPoint,endPoint);
			
			var stepper:Number = 0;
			var p1:Point = null;
			var p2:Point = null;
			
			while(stepper < maxDistance)
			{
				p1 = Point.interpolate(endPoint,startPoint,stepper/maxDistance);
				
				stepper += 5;
				
				if(stepper > maxDistance)
				{
					stepper = maxDistance;
				}
				
				p2 = Point.interpolate(endPoint,stepper/maxDistance);
				
				this.canvas.graphics.moveTo(p1.x,p1.y);
				this.canvas.graphics.lineTo(p2.x,p2.y);
				
				stepper += 5;
			}
		}
		
		//绘制项目根节点甘特图
		this.canvas.graphics.lineStyle(1,0X000000);
		this.canvas.graphics.beginFill(0X000000); //填充黑色
		
		for(var i:Number = 0; i < this.taskList.length; ++i)
		{
			var task:Task = this.taskList.getItemAt(i) as Task;
			
			var startDate:Date = task.plannedStartDate;
			var duration:Number = task.duration;
			var leaf:String = task.leaf;
			
			var interval:Number = this.getDateInterval(beginSunday,startDate);
			
			var startX:Number = 20 * (7 + interval);     //20 * (7 + startDate.getDay());
			var startY:Number = 8 + 20 * i;
			var endX:Number = startX + 20 * duration;
			var endY:Number = startY + 8;
			
			if("true" == leaf) //根节点是叶子节点
			{
				this.canvas.graphics.drawRect(startX,startY,20 * duration,8);
			}
			else //根节点不是叶子节点
			{
				this.canvas.graphics.drawRect(startX - 4,20 * duration + 8,8);
				
				//开始处
				this.canvas.graphics.moveTo(startX - 4,startY + 8);
				this.canvas.graphics.lineTo(startX + 4,startY + 8);
				this.canvas.graphics.lineTo(startX,startY + 8 + 4);
				this.canvas.graphics.lineTo(startX - 4,startY + 8);
				
				//结束处
				this.canvas.graphics.moveTo(endX - 4,endY);
				this.canvas.graphics.lineTo(endX + 4,endY);
				this.canvas.graphics.lineTo(endX,endY + 4);
				this.canvas.graphics.lineTo(endX - 4,endY);
			}
		}
		
		this.canvas.graphics.endFill();
	}
	
	
	//甘特图处理相关方法
	
	private function clearGanttChart():void
	{
		this.upper.removeAllChildren(); //清除甘特图标题栏的上部
		this.lower.removeAllChildren(); //清除甘特图标题栏的下部
		this.canvas.graphics.clear(); //清除甘特图
	}
	
	
	//获得两个日期之间的间隔天数
	private function getDateInterval(startDate:Date,endDate:Date):Number
	{
		var interval:Number = (endDate.getTime() - startDate.getTime()) / (1000 * 60 * 60 * 24 );
		
		return interval;
	}
	
	//计算甘特图的开始日期
	private function getStartDate4GanttChart(startDate:Date):Date
	{
		var day:Number = startDate.getDay(); //获得开始日期为周几
		
		var startDate4GanttChart:Date = new Date(startDate.getFullYear(),startDate.getMonth(),startDate.getDate() - day);
		
		return startDate4GanttChart;
	}
	
	//计算甘特图的结束日期
	private function getEndDate4GanttChart(endDate:Date):Date
	{
		var day:Number = endDate.getDay(); //获得开始日期为周几
		
		var endDate4GanttChart:Date = new Date(endDate.getFullYear(),endDate.getMonth(),endDate.getDate() + (6 - day));
		
		return endDate4GanttChart;
	}
	
	//根据索引获取每周的周日
	private function getDateByIndexOfWeek(index:Number,beginSunday:Date):String
	{
		var someSunday:Date = new Date(beginSunday.getFullYear(),beginSunday.getMonth(),beginSunday.getDate() + 7 * index);
		
		var year:Number = someSunday.getFullYear();
		var month:Number = someSunday.getMonth() + 1;
		var date:Number = someSunday.getDate();
		
		var month2String:String = month.toString();
		var date2String:String = date.toString();
		
		if(month < 10)
		{
			month2String = "0" + month;
		}
		if(date < 10)
		{
			date2String = "0" + date;
		}
		
		var result:String = year + "-" + month2String + "-" + date2String;
		
		return result;
	}
	
	//根据索引计算每天为星期几
	private function getDayByIndex(index:Number):String
	{
		var compIndex:Number = index % 7;
		
		switch(compIndex)
		{
			case 0:
				return "日";
			case 1:
				return "一";
			case 2:
				return "二";
			case 3:
				return "三";
			case 4:
				return "四";
			case 5:
				return "五";
			case 6:
				return "六";
			default:
				return null;
		}
	}
	
	
	
	
	//切换项目，显示根节点
	private function switchProject(xml:String):void
	{
		this.showViewProjectView();
		this.treeData = new XML(xml);
		
		this.taskList.removeAll(); //清空任务列表
		
		var id:Number = Number(this.treeData.@id);
		var name:String = this.treeData.@label;
		var startDate:Date = new Date(this.treeData.@startYear,this.treeData.@startMonth,this.treeData.@startDate);
		var endDate:Date = new Date(this.treeData.@endYear,this.treeData.@endMonth,this.treeData.@endDate);
		var leaf:String = this.treeData.@leaf;
		var duration:Number = this.getDateInterval(startDate,endDate);
		
		var task:Task = new Task();
		task.id = id;
		task.name = name;
		task.plannedStartDate = startDate;
		task.plannedEndDate = endDate;
		task.duration = duration;
		task.leaf = leaf;
		
		this.taskList.addItem(task); // 将根节点放到集合中
		
		this.renderGanttChart();
	}
		
	//创建任务
	private function createTask():void
	{
		if(null == this.projectTree.selectedItem)
		{
			Alert.show("请选择父节点");
			return;
		}
		
		this.selectedItem = this.projectTree.selectedItem as XML;	
		
		var parentId:Number = Number(this.selectedItem.attribute("id"));	
		
		var addTaskWindow:AddTaskWindow = new AddTaskWindow();
		addTaskWindow.parentWindow = this;
		addTaskWindow.callbackFunction = createSubTaskHandler;
		addTaskWindow.parentId = parentId;
		
		PopUpManager.addPopUp(addTaskWindow,this,true);
		PopUpManager.centerPopUp(addTaskWindow); // 弹出窗口居中显示
		
	}
	
	//创建任务的回调，来自于子窗口
	private function createSubTaskHandler(taskId:Number,name:String):void
	{
		if(!this.isExpanded || 1 == this.selectedItem.child("mock").length() 
				|| 0 == this.selectedItem.children().length())
		{
			this.selectedItem4Open = this.selectedItem;
			
			var length:int = this.selectedItem4Open.children().length(); //首先获取子元素的数量
		
			for(var i:int = 0; i < length; ++i) //删除子元素
			{
				delete this.selectedItem4Open.children()[0];
			}
			
			this.openedItemId = this.selectedItem4Open.@id;
			this.openedItemName = this.selectedItem4Open.@label;
			
			this.taskTreeService.send();
		}
		else
		{
			var xml:XML = <task></task>
			xml.@id = taskId;
			xml.@label = name;
		
			this.selectedItem.appendChild(xml);
		}
	}
	
	//显示查看项目视图
	private function showViewProjectView():void
	{
		this.mainViewContainer.selectedIndex = 1;
	}
	
	//显示创建项目视图
	private function showCreateProjectView():void
	{
		this.mainViewContainer.selectedIndex = 0;
	}
	
	
	
	//创建项目
	private function createProject():void
	{
		this.createProjectService.send();
	}
	
	//创建项目回调
	private function addTaskHandler(event:ResultEvent):void
	{
		var returnedData:String = String(event.result);
		var returnedObject:Object = JSON.decode(returnedData);
		
		var projectId:int = returnedObject.id;
		var name:String = returnedObject.name;
		
		ExternalInterface.call("parent.addProjectNode",projectId,name);//调用外部的js方法
	}
	
	//判断节点展开或是回调
	private function doItemOpening(event:TreeEvent):void
	{
		if(event.opening) //展开
		{
			this.doItemOpen(event);
		}
		else //关闭
		{
			this.doItemClose(event);
		}
		
	}
	
	//处理节点展开事件
	private function doItemOpen(event:TreeEvent):void
	{
		this.selectedItem4Open = event.item as XML; //获取被展开的节点
		
		var length:int = this.selectedItem4Open.children().length(); //首先获取子元素的数量
		
		for(var i:int = 0; i < length; ++i) //删除子元素
		{
			delete this.selectedItem4Open.children()[0];
		}
		
		this.openedItemId = this.selectedItem4Open.@id;
		this.openedItemName = this.selectedItem4Open.@label;
		
		this.equipTaskIds(); //构造ids信息
		
		this.taskTreeService.send();
	}
	
	//处理节点关闭事件
	private function doItemClose(event:TreeEvent):void
	{
		this.isExpanded = false;
		
		var xml:XML = event.item as XML;
		
		var taskDescendantsSize:int = xml.descendants("task").length()
		
		for(var i:int = 0; i < this.taskList.length; ++i)
		{
			if(this.taskList.getItemAt(i).id == xml.@id)
			{
				for(var j:int = 0; j < taskDescendantsSize; ++j)
				{
					this.taskList.removeItemAt(i + 1);//注意，此处为i + 1
				}
				
				break;
			}
		}
		
		//从树中删除关闭的节点
		var length:int = xml.children().length();
		
		for(var i:int = 0; i < length; ++i)
		{
			delete xml.children()[0];
		}
		
		xml.appendChild(<mock/>);
		
		this.renderGanttChart();
	}
	
	
	
	private function equipTaskIds():void
	{
		//首先清空以前保存的id信息
		this.taskIds = "";
		
		for(var i:int = 0; i < this.taskList.length; ++i)
		{
			this.taskIds += this.taskList.getItemAt(i).id + "@";
		}
	}
	
	
	
	
	
	// 展开树节点的回调
	private function taskTreeServiceHandler(event:ResultEvent):void
	{
		this.isExpanded = true; //节点被展开
		
		var xml:XML = new XML(event.result); // 服务端返回的数据
		
		//首先处理已经显示的节点的信息
		for(var i:int = 0; i < xml.child("existedTask").length(); ++i)
		{
			this.taskList.getItemAt(i).plannedStartDate = new Date(xml.child("existedTask")[i].@startYear,xml.child("existedTask")[i].@startMonth,xml.child("existedTask")[i].@startDate);
			this.taskList.getItemAt(i).plannedEndDate = new Date(xml.child("existedTask")[i].@endYear,xml.child("existedTask")[i].@endMonth,xml.child("existedTask")[i].@endDate);
			this.taskList.getItemAt(i).duration = this.getDateInterval(this.taskList.getItemAt(i).plannedStartDate,this.taskList.getItemAt(i).plannedEndDate);
		}
		
		//处理节点展开的信息
		for(var i:int = 0; i < xml.child("task").length(); ++i)
		{
			this.selectedItem4Open.appendChild(xml.child("task")[i]); //附加子节点
		}
		
		//将新展开的节点插入到taskList列表中
		for(var i:int = 0; i < this.taskList.length; ++i)
		{
			if(this.taskList.getItemAt(i).id == this.openedItemId)
			{
				for(var j:int = 0; j < xml.child("task").length(); ++j)
				{
					var id:Number = Number(xml.child("task")[j].@id);
					var name:String = String(xml.child("task")[j].@label);
					var startDate:Date = new Date(xml.child("task")[j].@startYear,xml.child("task")[j].@startMonth,xml.child("task")[j].@startDate);
					var endDate:Date = new Date(xml.child("task")[j].@endYear,xml.child("task")[j].@endMonth,xml.child("task")[j].@endDate);
					var leaf:String = xml.child("task")[j].@leaf;
					var duration:Number = this.getDateInterval(startDate,endDate);
					
					var task:Task = new Task();
					task.id = id;
					task.name = name;
					task.plannedStartDate = startDate;
					task.plannedEndDate = endDate;
					task.duration = duration;
					task.leaf = leaf;
					
					this.taskList.addItemAt(task,i + j + 1);
				}
				
				break;
			}
		}
		
		this.projectTree.expandItem(this.selectedItem4Open,true); //指定展开哪个节点
		
		this.renderGanttChart();
	}