jingrow/gantt
1
0
Fork 0
Code Pull Requests Activity

feat: configurable highlights

Browse Source
This commit is contained in:
safwansamsudeen 2024-12-03 15:44:38 +05:30
parent b776376f4e
commit 6984d3e544
3 changed files with 58 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/defaults.js
View File

@ -7,7 +7,7 @@ const DEFAULT_VIEW_MODES = [
step: '1h',
lower_text: 'HH',
upper_text: (d, ld, lang) =>
d.getDate() !== ld.getDate()
!ld || d.getDate() !== ld.getDate()
? date_utils.format(d, 'D MMMM', lang)
: '',
upper_text_frequency: 24,
@ -19,7 +19,7 @@ const DEFAULT_VIEW_MODES = [
format_string: 'YYYY-MM-DD HH',
lower_text: 'HH',
upper_text: (d, ld, lang) =>
d.getDate() !== ld.getDate()
!ld || d.getDate() !== ld.getDate()
? date_utils.format(d, 'D MMM', lang)
: '',
upper_text_frequency: 4,
@ -31,7 +31,7 @@ const DEFAULT_VIEW_MODES = [
format_string: 'YYYY-MM-DD HH',
lower_text: 'HH',
upper_text: (d, ld, lang) =>
d.getDate() !== ld.getDate()
!ld || d.getDate() !== ld.getDate()
? d.getMonth() !== d.getMonth()
? date_utils.format(d, 'D MMM', lang)
: date_utils.format(d, 'D', lang)
@ -44,9 +44,11 @@ const DEFAULT_VIEW_MODES = [
format_string: 'YYYY-MM-DD',
step: '1d',
lower_text: (d, ld, lang) =>
d.getDate() !== ld.getDate() ? date_utils.format(d, 'D', lang) : '',
!ld || d.getDate() !== ld.getDate()
? date_utils.format(d, 'D', lang)
: '',
upper_text: (d, ld, lang) =>
d.getMonth() !== ld.getMonth()
!ld || d.getMonth() !== ld.getMonth()
? date_utils.format(d, 'MMMM', lang)
: '',
thick_line: (d) => d.getDay() === 1,
@ -61,7 +63,7 @@ const DEFAULT_VIEW_MODES = [
? date_utils.format(d, 'D MMM', lang)
: date_utils.format(d, 'D', lang),
upper_text: (d, ld, lang) =>
d.getMonth() !== ld.getMonth()
!ld || d.getMonth() !== ld.getMonth()
? date_utils.format(d, 'MMMM', lang)
: '',
thick_line: (d) => d.getDate() >= 1 && d.getDate() <= 7,
@ -117,6 +119,7 @@ const DEFAULT_OPTIONS = {
today_button: true,
view_mode_select: false,
default_snap: '1d',
holiday_highlight: { green: 'weekend' },
};
export { DEFAULT_OPTIONS, DEFAULT_VIEW_MODES };

4
src/gantt.css
View File

@ -186,10 +186,6 @@
}
}
& .holiday-highlight {
fill: var(--holiday-color);
}
& .arrow {
fill: none;
stroke: #9fa9b1;

74
src/index.js
View File

@ -534,31 +534,55 @@ export default class Gantt {
}
highlightWeekends() {
// FIX
if (!this.view_is('Day') && !this.view_is('Half Day')) return;
for (
let d = new Date(this.gantt_start);
d <= this.gantt_end;
d.setDate(d.getDate() + 1)
) {
if (d.getDay() === 0 || d.getDay() === 6) {
const x =
(date_utils.diff(d, this.gantt_start, this.config.unit) /
this.config.step) *
this.config.column_width;
const height =
(this.options.bar_height + this.options.padding) *
this.tasks.length;
createSVG('rect', {
x,
y: this.options.header_height + this.options.padding / 2,
width:
(this.view_is('Day') ? 1 : 2) *
this.config.column_width,
height,
class: 'holiday-highlight',
append_to: this.layers.grid,
});
for (let color in this.options.holiday_highlight) {
let check_highlight = this.options.holiday_highlight[color];
if (check_highlight === 'weekend')
check_highlight = (d) => d.getDay() === 0 || d.getDay() === 6;
console.log(check_highlight);
let extra_func;
if (typeof check_highlight === 'object') {
let f = check_highlight.find((k) => typeof k === 'function');
if (f) {
extra_func = f;
}
check_highlight = (d) =>
this.options.holiday_highlight[color]
.filter((k) => typeof k !== 'function')
.map((k) => new Date(k + ' ').getTime())
.includes(d.getTime());
}
for (
let d = new Date(this.gantt_start);
d <= this.gantt_end;
d.setDate(d.getDate() + 1)
) {
if (check_highlight(d) || (extra_func && extra_func(d))) {
const x =
(date_utils.diff(
d,
this.gantt_start,
this.config.unit,
) /
this.config.step) *
this.config.column_width;
const height =
(this.options.bar_height + this.options.padding) *
this.tasks.length;
createSVG('rect', {
x,
y:
this.options.header_height +
this.options.padding / 2,
width: this.config.column_width,
height,
style: `fill: ${color};`,
append_to: this.layers.grid,
});
}
}
}
}