|
@@ -27,8 +27,6 @@ export function GanttChartMonth(options) {
|
|
this.offsetDis = (options['viewWidth']/2) || 800;
|
|
this.offsetDis = (options['viewWidth']/2) || 800;
|
|
// 拖动定时器
|
|
// 拖动定时器
|
|
this.dragTimer = null;
|
|
this.dragTimer = null;
|
|
- // 每天的间隔宽度
|
|
|
|
- this.dayStep = parseInt(this.cWidth/365);
|
|
|
|
// 分组标题高度
|
|
// 分组标题高度
|
|
this.groupTitleHeight = 18;
|
|
this.groupTitleHeight = 18;
|
|
// 任务矩形高度
|
|
// 任务矩形高度
|
|
@@ -36,7 +34,9 @@ export function GanttChartMonth(options) {
|
|
// 每行任务的纵向间距
|
|
// 每行任务的纵向间距
|
|
this.rowSpanDis = 22;
|
|
this.rowSpanDis = 22;
|
|
// 总天数
|
|
// 总天数
|
|
- this.daysCount = options['daysCount'] || 365;
|
|
|
|
|
|
+ this.daysCount = options['daysCount'] || 365*1.5;
|
|
|
|
+ // 每天的间隔宽度
|
|
|
|
+ this.dayStep = parseInt(this.cWidth/this.daysCount);
|
|
// 任务图距离顶部高度
|
|
// 任务图距离顶部高度
|
|
this.graphTopDis = 60
|
|
this.graphTopDis = 60
|
|
// 任务矩形最小宽度
|
|
// 任务矩形最小宽度
|
|
@@ -46,7 +46,7 @@ export function GanttChartMonth(options) {
|
|
this.timePerPix = this.cWidth/this.daysCount/24/3600
|
|
this.timePerPix = this.cWidth/this.daysCount/24/3600
|
|
// 当前视图开始时间,向前推N天
|
|
// 当前视图开始时间,向前推N天
|
|
this.startAt = moment().startOf('year')
|
|
this.startAt = moment().startOf('year')
|
|
- this.endAt = moment().endOf('year')
|
|
|
|
|
|
+ this.endAt = moment().endOf('year').add(6, 'months')
|
|
this.graphDiv = document.getElementById(options['chartParentContainer']);
|
|
this.graphDiv = document.getElementById(options['chartParentContainer']);
|
|
this.chartContainer = options['chartContainer']
|
|
this.chartContainer = options['chartContainer']
|
|
// 图形容器组
|
|
// 图形容器组
|
|
@@ -149,18 +149,18 @@ GanttChartMonth.prototype.pageTo = function(dir = 'next') {
|
|
this.endEvent = null;
|
|
this.endEvent = null;
|
|
if (dir == 'next') {
|
|
if (dir == 'next') {
|
|
// 向后翻页`
|
|
// 向后翻页`
|
|
- this.startAt = this.startAt.add(this.daysCount, 'days');
|
|
|
|
|
|
+ this.startAt = this.startAt.add(366, 'days');
|
|
this.offsetDis = 0
|
|
this.offsetDis = 0
|
|
} else {
|
|
} else {
|
|
// 向前翻页
|
|
// 向前翻页
|
|
- this.startAt = this.startAt.subtract(this.daysCount, 'days');
|
|
|
|
- this.offsetDis = 2*this.viewWidth
|
|
|
|
|
|
+ this.startAt = this.startAt.subtract(365, 'days');
|
|
|
|
+ this.offsetDis = 2380 //2*this.viewWidth
|
|
}
|
|
}
|
|
this.endAt = moment(this.startAt).add(this.daysCount, 'days');
|
|
this.endAt = moment(this.startAt).add(this.daysCount, 'days');
|
|
this.pageToCallback({dir: dir, startAt: this.startAt.format('YYYY-MM-DD'), endAt: this.endAt.format('YYYY-MM-DD')})
|
|
this.pageToCallback({dir: dir, startAt: this.startAt.format('YYYY-MM-DD'), endAt: this.endAt.format('YYYY-MM-DD')})
|
|
console.log('已翻页', this.startAt.format('YYYY-MM-DD'),this.endAt.format('YYYY-MM-DD'), this.offsetDis);
|
|
console.log('已翻页', this.startAt.format('YYYY-MM-DD'),this.endAt.format('YYYY-MM-DD'), this.offsetDis);
|
|
// offsetDis = viewWidth;
|
|
// offsetDis = viewWidth;
|
|
- this.forceRefreshGraph();
|
|
|
|
|
|
+ // this.forceRefreshGraph();
|
|
}
|
|
}
|
|
// 上次点击时间,用于滚动时误触停止
|
|
// 上次点击时间,用于滚动时误触停止
|
|
let lastClickAt = null;
|
|
let lastClickAt = null;
|
|
@@ -278,14 +278,21 @@ GanttChartMonth.prototype.drawTimeZone = function() {
|
|
let nowAtStr = moment().format('YYYY-MM-DD')
|
|
let nowAtStr = moment().format('YYYY-MM-DD')
|
|
let year = this.startAt.format('YYYY')
|
|
let year = this.startAt.format('YYYY')
|
|
this.timeZoneLineEls = []
|
|
this.timeZoneLineEls = []
|
|
- for (let i = 1; i < 13; i++) {
|
|
|
|
- let tempAt = moment(`${year}-${i}`)
|
|
|
|
|
|
+ for (let i = 1; i < 19; i++) {
|
|
|
|
+ let tempAt = moment(this.startAt)
|
|
|
|
+ tempAt.add(i-1, 'months')
|
|
|
|
+ // console.log('tempAt:', tempAt.format('YYYY-MM-DD'))
|
|
|
|
+ // 当月天数
|
|
|
|
+ let daysCount = tempAt.dayOfYear()
|
|
|
|
+ if(tempAt.format('YYYY') != year){
|
|
|
|
+ daysCount = parseInt(daysCount) + 365
|
|
|
|
+ }
|
|
let timeText = tempAt.format('MM');
|
|
let timeText = tempAt.format('MM');
|
|
- if(timeText == '01'){
|
|
|
|
|
|
+ if(timeText == '01'){
|
|
// 第一天,顶部需要绘制年月
|
|
// 第一天,顶部需要绘制年月
|
|
timeGroup.addShape('text', {
|
|
timeGroup.addShape('text', {
|
|
attrs: {
|
|
attrs: {
|
|
- x: this.dayStep * i,
|
|
|
|
|
|
+ x: this.dayStep * daysCount + 100,
|
|
y: 20,
|
|
y: 20,
|
|
fontSize: 12,
|
|
fontSize: 12,
|
|
text: tempAt.format('YYYY'),
|
|
text: tempAt.format('YYYY'),
|
|
@@ -324,11 +331,11 @@ GanttChartMonth.prototype.drawTimeZone = function() {
|
|
// this.todayTimeLineEl.setZIndex(3)
|
|
// this.todayTimeLineEl.setZIndex(3)
|
|
}
|
|
}
|
|
|
|
|
|
- // 当月天数
|
|
|
|
- let daysCount = moment(`${year}-${i}`).dayOfYear()
|
|
|
|
|
|
+
|
|
|
|
+ // console.error('time:',tempAt.format('YYYY-MM'),', dayscount:', daysCount)
|
|
timeGroup.addShape('text', {
|
|
timeGroup.addShape('text', {
|
|
attrs: {
|
|
attrs: {
|
|
- x: this.dayStep * daysCount + 180,
|
|
|
|
|
|
+ x: this.dayStep * daysCount + 180 - 70,
|
|
y: 40,
|
|
y: 40,
|
|
fontSize: 10,
|
|
fontSize: 10,
|
|
text: timeText,
|
|
text: timeText,
|
|
@@ -369,13 +376,13 @@ GanttChartMonth.prototype.handleClick = function(task, flag, ev) {
|
|
*/
|
|
*/
|
|
GanttChartMonth.prototype.statusColor =function(task) {
|
|
GanttChartMonth.prototype.statusColor =function(task) {
|
|
switch (task.statusType) {
|
|
switch (task.statusType) {
|
|
- case 1:
|
|
|
|
|
|
+ case 0:
|
|
return ['#e7e9ea', '#c3c7cb'];
|
|
return ['#e7e9ea', '#c3c7cb'];
|
|
- case 2:
|
|
|
|
|
|
+ case 1:
|
|
return ['#dee9fe', '#5b8ff9'];
|
|
return ['#dee9fe', '#5b8ff9'];
|
|
- case 3:
|
|
|
|
|
|
+ case 2:
|
|
return ['#fbce99', '#f58300'];
|
|
return ['#fbce99', '#f58300'];
|
|
- case 4:
|
|
|
|
|
|
+ case 3:
|
|
return ['#fbb8b5', '#f54e45'];
|
|
return ['#fbb8b5', '#f54e45'];
|
|
default:
|
|
default:
|
|
return ['#fbb8b5', '#f54e45'];
|
|
return ['#fbb8b5', '#f54e45'];
|
|
@@ -425,9 +432,17 @@ GanttChartMonth.prototype.postDrawTasksCallBack = function(){
|
|
|
|
|
|
if(true){
|
|
if(true){
|
|
let year = this.startAt.format('YYYY')
|
|
let year = this.startAt.format('YYYY')
|
|
- for (let i = 1; i < 13; i++) {
|
|
|
|
|
|
+ for (let i = 1; i < 19; i++) {
|
|
|
|
+ let tempAt = moment(this.startAt)
|
|
|
|
+ tempAt.add(i-1, 'months')
|
|
|
|
+ // console.log('tempAt:', tempAt.format('YYYY-MM-DD'))
|
|
|
|
+ // 当月天数
|
|
|
|
+ let daysCount = tempAt.dayOfYear()
|
|
|
|
+ if(tempAt.format('YYYY') != year){
|
|
|
|
+ daysCount = parseInt(daysCount) + 365
|
|
|
|
+ }
|
|
// 当月天数
|
|
// 当月天数
|
|
- let daysCount = moment(`${year}-${i}`).dayOfYear()
|
|
|
|
|
|
+ // let daysCount = moment(`${year}-${i}`).dayOfYear()
|
|
let lineEl = this.timeGroupEl.addShape('rect', {
|
|
let lineEl = this.timeGroupEl.addShape('rect', {
|
|
attrs: {
|
|
attrs: {
|
|
x: this.dayStep * daysCount,
|
|
x: this.dayStep * daysCount,
|