added year display mode
This commit is contained in:
parent
4b11841bc1
commit
4995e9ed0e
27
dist/frappe-gantt.js
vendored
27
dist/frappe-gantt.js
vendored
@ -991,7 +991,7 @@ class Gantt {
|
||||
header_height: 50,
|
||||
column_width: 30,
|
||||
step: 24,
|
||||
view_modes: ['Quarter Day', 'Half Day', 'Day', 'Week', 'Month'],
|
||||
view_modes: ['Quarter Day', 'Half Day', 'Day', 'Week', 'Month', 'Year'],
|
||||
bar_height: 20,
|
||||
bar_corner_radius: 3,
|
||||
arrow_curve: 5,
|
||||
@ -1110,6 +1110,9 @@ class Gantt {
|
||||
} else if (view_mode === 'Month') {
|
||||
this.options.step = 24 * 30;
|
||||
this.options.column_width = 120;
|
||||
} else if (view_mode === 'Year') {
|
||||
this.options.step = 24 * 365;
|
||||
this.options.column_width = 120;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1141,6 +1144,9 @@ class Gantt {
|
||||
} else if (this.view_is('Month')) {
|
||||
this.gantt_start = date_utils.start_of(this.gantt_start, 'year');
|
||||
this.gantt_end = date_utils.add(this.gantt_end, 1, 'year');
|
||||
} else if (this.view_is('Year')) {
|
||||
this.gantt_start = date_utils.add(this.gantt_start, -2, 'year');
|
||||
this.gantt_end = date_utils.add(this.gantt_end, 2, 'year');
|
||||
} else {
|
||||
this.gantt_start = date_utils.add(this.gantt_start, -1, 'month');
|
||||
this.gantt_end = date_utils.add(this.gantt_end, 1, 'month');
|
||||
@ -1155,9 +1161,13 @@ class Gantt {
|
||||
if (!cur_date) {
|
||||
cur_date = date_utils.clone(this.gantt_start);
|
||||
} else {
|
||||
cur_date = this.view_is('Month')
|
||||
? date_utils.add(cur_date, 1, 'month')
|
||||
: date_utils.add(cur_date, this.options.step, 'hour');
|
||||
if (this.view_is('Year')) {
|
||||
cur_date = date_utils.add(cur_date, 1, 'year');
|
||||
} else if (this.view_is('Month')) {
|
||||
cur_date = date_utils.add(cur_date, 1, 'month');
|
||||
} else {
|
||||
cur_date = date_utils.add(cur_date, this.options.step, 'hour');
|
||||
}
|
||||
}
|
||||
this.dates.push(cur_date);
|
||||
}
|
||||
@ -1393,6 +1403,7 @@ class Gantt {
|
||||
? date_utils.format(date, 'D MMM')
|
||||
: date_utils.format(date, 'D'),
|
||||
Month_lower: date_utils.format(date, 'MMMM'),
|
||||
Year_lower: date_utils.format(date, 'YYYY'),
|
||||
'Quarter Day_upper':
|
||||
date.getDate() !== last_date.getDate()
|
||||
? date_utils.format(date, 'D MMM')
|
||||
@ -1412,6 +1423,10 @@ class Gantt {
|
||||
? date_utils.format(date, 'MMMM')
|
||||
: '',
|
||||
Month_upper:
|
||||
date.getFullYear() !== last_date.getFullYear()
|
||||
? date_utils.format(date, 'YYYY')
|
||||
: '',
|
||||
Year_upper:
|
||||
date.getFullYear() !== last_date.getFullYear()
|
||||
? date_utils.format(date, 'YYYY')
|
||||
: ''
|
||||
@ -1433,7 +1448,9 @@ class Gantt {
|
||||
Week_lower: 0,
|
||||
Week_upper: this.options.column_width * 4 / 2,
|
||||
Month_lower: this.options.column_width / 2,
|
||||
Month_upper: this.options.column_width * 12 / 2
|
||||
Month_upper: this.options.column_width * 12 / 2,
|
||||
Year_lower: this.options.column_width / 2,
|
||||
Year_upper: this.options.column_width * 30 / 2
|
||||
};
|
||||
|
||||
return {
|
||||
|
||||
2
dist/frappe-gantt.min.js
vendored
2
dist/frappe-gantt.min.js
vendored
File diff suppressed because one or more lines are too long
10
index.html
10
index.html
@ -75,6 +75,13 @@
|
||||
dependencies: 'Task 4',
|
||||
custom_class: 'bar-milestone'
|
||||
},
|
||||
{
|
||||
start: '2014-01-05',
|
||||
end: '2019-10-12',
|
||||
name: 'Long term task',
|
||||
id: "Task 6",
|
||||
progress: 0
|
||||
}
|
||||
]
|
||||
var gantt_chart = new Gantt(".gantt-target", tasks, {
|
||||
on_click: function (task) {
|
||||
@ -88,7 +95,8 @@
|
||||
},
|
||||
on_view_change: function(mode) {
|
||||
console.log(mode);
|
||||
}
|
||||
},
|
||||
view_mode: 'Year'
|
||||
});
|
||||
console.log(gantt_chart);
|
||||
</script>
|
||||
|
||||
27
src/index.js
27
src/index.js
@ -68,7 +68,7 @@ export default class Gantt {
|
||||
header_height: 50,
|
||||
column_width: 30,
|
||||
step: 24,
|
||||
view_modes: ['Quarter Day', 'Half Day', 'Day', 'Week', 'Month'],
|
||||
view_modes: ['Quarter Day', 'Half Day', 'Day', 'Week', 'Month', 'Year'],
|
||||
bar_height: 20,
|
||||
bar_corner_radius: 3,
|
||||
arrow_curve: 5,
|
||||
@ -187,6 +187,9 @@ export default class Gantt {
|
||||
} else if (view_mode === 'Month') {
|
||||
this.options.step = 24 * 30;
|
||||
this.options.column_width = 120;
|
||||
} else if (view_mode === 'Year') {
|
||||
this.options.step = 24 * 365;
|
||||
this.options.column_width = 120;
|
||||
}
|
||||
}
|
||||
|
||||
@ -218,6 +221,9 @@ export default class Gantt {
|
||||
} else if (this.view_is('Month')) {
|
||||
this.gantt_start = date_utils.start_of(this.gantt_start, 'year');
|
||||
this.gantt_end = date_utils.add(this.gantt_end, 1, 'year');
|
||||
} else if (this.view_is('Year')) {
|
||||
this.gantt_start = date_utils.add(this.gantt_start, -2, 'year');
|
||||
this.gantt_end = date_utils.add(this.gantt_end, 2, 'year');
|
||||
} else {
|
||||
this.gantt_start = date_utils.add(this.gantt_start, -1, 'month');
|
||||
this.gantt_end = date_utils.add(this.gantt_end, 1, 'month');
|
||||
@ -232,9 +238,13 @@ export default class Gantt {
|
||||
if (!cur_date) {
|
||||
cur_date = date_utils.clone(this.gantt_start);
|
||||
} else {
|
||||
cur_date = this.view_is('Month')
|
||||
? date_utils.add(cur_date, 1, 'month')
|
||||
: date_utils.add(cur_date, this.options.step, 'hour');
|
||||
if (this.view_is('Year')) {
|
||||
cur_date = date_utils.add(cur_date, 1, 'year');
|
||||
} else if (this.view_is('Month')) {
|
||||
cur_date = date_utils.add(cur_date, 1, 'month');
|
||||
} else {
|
||||
cur_date = date_utils.add(cur_date, this.options.step, 'hour');
|
||||
}
|
||||
}
|
||||
this.dates.push(cur_date);
|
||||
}
|
||||
@ -470,6 +480,7 @@ export default class Gantt {
|
||||
? date_utils.format(date, 'D MMM')
|
||||
: date_utils.format(date, 'D'),
|
||||
Month_lower: date_utils.format(date, 'MMMM'),
|
||||
Year_lower: date_utils.format(date, 'YYYY'),
|
||||
'Quarter Day_upper':
|
||||
date.getDate() !== last_date.getDate()
|
||||
? date_utils.format(date, 'D MMM')
|
||||
@ -489,6 +500,10 @@ export default class Gantt {
|
||||
? date_utils.format(date, 'MMMM')
|
||||
: '',
|
||||
Month_upper:
|
||||
date.getFullYear() !== last_date.getFullYear()
|
||||
? date_utils.format(date, 'YYYY')
|
||||
: '',
|
||||
Year_upper:
|
||||
date.getFullYear() !== last_date.getFullYear()
|
||||
? date_utils.format(date, 'YYYY')
|
||||
: ''
|
||||
@ -510,7 +525,9 @@ export default class Gantt {
|
||||
Week_lower: 0,
|
||||
Week_upper: this.options.column_width * 4 / 2,
|
||||
Month_lower: this.options.column_width / 2,
|
||||
Month_upper: this.options.column_width * 12 / 2
|
||||
Month_upper: this.options.column_width * 12 / 2,
|
||||
Year_lower: this.options.column_width / 2,
|
||||
Year_upper: this.options.column_width * 30 / 2
|
||||
};
|
||||
|
||||
return {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user