@workiom/frappe-gantt 1.0.5 → 1.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/dist/frappe-gantt.css +1 -1
- package/dist/frappe-gantt.es.js +248 -199
- package/dist/frappe-gantt.umd.js +11 -11
- package/package.json +1 -1
- package/src/arrow.js +10 -0
- package/src/bar.js +6 -2
- package/src/defaults.js +1 -0
- package/src/index.js +101 -0
- package/src/styles/dark.css +5 -0
- package/src/styles/gantt.css +4 -0
- package/src/styles/light.css +1 -0
package/dist/frappe-gantt.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const M = "year", D = "month",
|
|
1
|
+
const M = "year", D = "month", L = "day", T = "hour", Y = "minute", E = "second", H = "millisecond", l = {
|
|
2
2
|
parse_duration(r) {
|
|
3
3
|
const e = /([0-9]+)(y|m|d|h|min|s|ms)/gm.exec(r);
|
|
4
4
|
if (e !== null) {
|
|
@@ -40,7 +40,7 @@ const M = "year", D = "month", T = "day", L = "hour", Y = "minute", A = "second"
|
|
|
40
40
|
month: "long"
|
|
41
41
|
}), s = new Intl.DateTimeFormat(e, {
|
|
42
42
|
month: "short"
|
|
43
|
-
}), n = i.format(r), a = n.charAt(0).toUpperCase() + n.slice(1), o = this.get_date_values(r).map((
|
|
43
|
+
}), n = i.format(r), a = n.charAt(0).toUpperCase() + n.slice(1), o = this.get_date_values(r).map((c) => v(c, 2, 0)), h = {
|
|
44
44
|
YYYY: o[0],
|
|
45
45
|
MM: v(+o[1] + 1, 2, 0),
|
|
46
46
|
DD: o[2],
|
|
@@ -52,19 +52,19 @@ const M = "year", D = "month", T = "day", L = "hour", Y = "minute", A = "second"
|
|
|
52
52
|
MMMM: a,
|
|
53
53
|
MMM: s.format(r)
|
|
54
54
|
};
|
|
55
|
-
let
|
|
56
|
-
const
|
|
57
|
-
return Object.keys(h).sort((
|
|
58
|
-
|
|
59
|
-
}),
|
|
60
|
-
|
|
61
|
-
}),
|
|
55
|
+
let d = t;
|
|
56
|
+
const _ = [];
|
|
57
|
+
return Object.keys(h).sort((c, g) => g.length - c.length).forEach((c) => {
|
|
58
|
+
d.includes(c) && (d = d.replaceAll(c, `$${_.length}`), _.push(h[c]));
|
|
59
|
+
}), _.forEach((c, g) => {
|
|
60
|
+
d = d.replaceAll(`$${g}`, c);
|
|
61
|
+
}), d;
|
|
62
62
|
},
|
|
63
63
|
diff(r, t, e = "day") {
|
|
64
|
-
let i, s, n, a, o, h,
|
|
64
|
+
let i, s, n, a, o, h, d;
|
|
65
65
|
i = r - t + (t.getTimezoneOffset() - r.getTimezoneOffset()) * 6e4, s = i / 1e3, a = s / 60, n = a / 60, o = n / 24;
|
|
66
|
-
let
|
|
67
|
-
return
|
|
66
|
+
let _ = r.getFullYear() - t.getFullYear(), c = r.getMonth() - t.getMonth();
|
|
67
|
+
return c += o % 30 / 30, h = _ * 12 + c, r.getDate() < t.getDate() && h--, d = h / 12, e.endsWith("s") || (e += "s"), Math.round(
|
|
68
68
|
{
|
|
69
69
|
milliseconds: i,
|
|
70
70
|
seconds: s,
|
|
@@ -72,7 +72,7 @@ const M = "year", D = "month", T = "day", L = "hour", Y = "minute", A = "second"
|
|
|
72
72
|
hours: n,
|
|
73
73
|
days: o,
|
|
74
74
|
months: h,
|
|
75
|
-
years:
|
|
75
|
+
years: d
|
|
76
76
|
}[e] * 100
|
|
77
77
|
) / 100;
|
|
78
78
|
},
|
|
@@ -88,10 +88,10 @@ const M = "year", D = "month", T = "day", L = "hour", Y = "minute", A = "second"
|
|
|
88
88
|
const i = [
|
|
89
89
|
r.getFullYear() + (e === M ? t : 0),
|
|
90
90
|
r.getMonth() + (e === D ? t : 0),
|
|
91
|
-
r.getDate() + (e ===
|
|
92
|
-
r.getHours() + (e ===
|
|
91
|
+
r.getDate() + (e === L ? t : 0),
|
|
92
|
+
r.getHours() + (e === T ? t : 0),
|
|
93
93
|
r.getMinutes() + (e === Y ? t : 0),
|
|
94
|
-
r.getSeconds() + (e ===
|
|
94
|
+
r.getSeconds() + (e === E ? t : 0),
|
|
95
95
|
r.getMilliseconds() + (e === H ? t : 0)
|
|
96
96
|
];
|
|
97
97
|
return new Date(...i);
|
|
@@ -100,10 +100,10 @@ const M = "year", D = "month", T = "day", L = "hour", Y = "minute", A = "second"
|
|
|
100
100
|
const e = {
|
|
101
101
|
[M]: 6,
|
|
102
102
|
[D]: 5,
|
|
103
|
-
[
|
|
104
|
-
[
|
|
103
|
+
[L]: 4,
|
|
104
|
+
[T]: 3,
|
|
105
105
|
[Y]: 2,
|
|
106
|
-
[
|
|
106
|
+
[E]: 1,
|
|
107
107
|
[H]: 0
|
|
108
108
|
};
|
|
109
109
|
function i(n) {
|
|
@@ -114,10 +114,10 @@ const M = "year", D = "month", T = "day", L = "hour", Y = "minute", A = "second"
|
|
|
114
114
|
r.getFullYear(),
|
|
115
115
|
i(M) ? 0 : r.getMonth(),
|
|
116
116
|
i(D) ? 1 : r.getDate(),
|
|
117
|
-
i(
|
|
118
|
-
i(
|
|
117
|
+
i(L) ? 0 : r.getHours(),
|
|
118
|
+
i(T) ? 0 : r.getMinutes(),
|
|
119
119
|
i(Y) ? 0 : r.getSeconds(),
|
|
120
|
-
i(
|
|
120
|
+
i(E) ? 0 : r.getMilliseconds()
|
|
121
121
|
];
|
|
122
122
|
return new Date(...s);
|
|
123
123
|
},
|
|
@@ -170,7 +170,7 @@ function f(r, t) {
|
|
|
170
170
|
i === "append_to" ? t.append_to.appendChild(e) : i === "innerHTML" ? e.innerHTML = t.innerHTML : i === "clipPath" ? e.setAttribute("clip-path", "url(#" + t[i] + ")") : e.setAttribute(i, t[i]);
|
|
171
171
|
return e;
|
|
172
172
|
}
|
|
173
|
-
function
|
|
173
|
+
function A(r, t, e, i) {
|
|
174
174
|
const s = W(r, t, e, i);
|
|
175
175
|
if (s === r) {
|
|
176
176
|
const n = document.createEvent("HTMLEvents");
|
|
@@ -240,7 +240,10 @@ p.attr = (r, t, e) => {
|
|
|
240
240
|
};
|
|
241
241
|
class q {
|
|
242
242
|
constructor(t, e, i) {
|
|
243
|
-
this.gantt = t, this.from_task = e, this.to_task = i, this.calculate_path(), this.draw();
|
|
243
|
+
this.gantt = t, this.from_task = e, this.to_task = i, this.is_critical = this.check_critical_path(), this.calculate_path(), this.draw();
|
|
244
|
+
}
|
|
245
|
+
check_critical_path() {
|
|
246
|
+
return this.gantt.options.critical_path ? this.from_task.task._is_critical === !0 && this.to_task.task._is_critical === !0 : !1;
|
|
244
247
|
}
|
|
245
248
|
calculate_path() {
|
|
246
249
|
let t = this.from_task.$bar.getX() + this.from_task.$bar.getWidth() / 2;
|
|
@@ -252,29 +255,29 @@ class q {
|
|
|
252
255
|
const a = this.from_task.task._index > this.to_task.task._index;
|
|
253
256
|
let o = this.gantt.options.arrow_curve;
|
|
254
257
|
const h = a ? 1 : 0;
|
|
255
|
-
let
|
|
258
|
+
let d = a ? -o : o;
|
|
256
259
|
if (this.to_task.$bar.getX() <= this.from_task.$bar.getX() + this.gantt.options.padding) {
|
|
257
|
-
let
|
|
258
|
-
|
|
259
|
-
const
|
|
260
|
+
let _ = this.gantt.options.padding / 2 - o;
|
|
261
|
+
_ < 0 && (_ = 0, o = this.gantt.options.padding / 2, d = a ? -o : o);
|
|
262
|
+
const c = this.to_task.$bar.getY() + this.to_task.$bar.getHeight() / 2 - d, g = this.to_task.$bar.getX() - this.gantt.options.padding;
|
|
260
263
|
this.path = `
|
|
261
264
|
M ${t} ${i}
|
|
262
|
-
v ${
|
|
265
|
+
v ${_}
|
|
263
266
|
a ${o} ${o} 0 0 1 ${-o} ${o}
|
|
264
|
-
H ${
|
|
265
|
-
a ${o} ${o} 0 0 ${h} ${-o} ${
|
|
266
|
-
V ${
|
|
267
|
-
a ${o} ${o} 0 0 ${h} ${o} ${
|
|
267
|
+
H ${g}
|
|
268
|
+
a ${o} ${o} 0 0 ${h} ${-o} ${d}
|
|
269
|
+
V ${c}
|
|
270
|
+
a ${o} ${o} 0 0 ${h} ${o} ${d}
|
|
268
271
|
L ${s} ${n}
|
|
269
272
|
m -5 -5
|
|
270
273
|
l 5 5
|
|
271
274
|
l -5 5`;
|
|
272
275
|
} else {
|
|
273
276
|
s < t + o && (o = s - t);
|
|
274
|
-
let
|
|
277
|
+
let _ = a ? n + o : n - o;
|
|
275
278
|
this.path = `
|
|
276
279
|
M ${t} ${i}
|
|
277
|
-
V ${
|
|
280
|
+
V ${_}
|
|
278
281
|
a ${o} ${o} 0 0 ${h} ${o} ${o}
|
|
279
282
|
L ${s} ${n}
|
|
280
283
|
m -5 -5
|
|
@@ -286,7 +289,8 @@ class q {
|
|
|
286
289
|
this.element = f("path", {
|
|
287
290
|
d: this.path,
|
|
288
291
|
"data-from": this.from_task.task.id,
|
|
289
|
-
"data-to": this.to_task.task.id
|
|
292
|
+
"data-to": this.to_task.task.id,
|
|
293
|
+
class: this.is_critical ? "arrow-critical" : ""
|
|
290
294
|
});
|
|
291
295
|
}
|
|
292
296
|
update() {
|
|
@@ -316,7 +320,7 @@ class F {
|
|
|
316
320
|
});
|
|
317
321
|
}
|
|
318
322
|
prepare_values() {
|
|
319
|
-
this.invalid = this.task.invalid, this.height = this.gantt.options.bar_height, this.image_size = this.height - 5, this.task._start = new Date(this.task.start), this.task._end = new Date(this.task.end), this.compute_x(), this.compute_y(), this.compute_duration(), this.corner_radius = this.gantt.options.bar_corner_radius, this.width = this.gantt.config.column_width * this.duration, (!this.task.progress || this.task.progress < 0) && (this.task.progress = 0), this.task.progress > 100 && (this.task.progress = 100);
|
|
323
|
+
this.invalid = this.task.invalid, this.height = this.gantt.options.bar_height, this.image_size = this.height - 5, (!this.task._start || !(this.task._start instanceof Date)) && (this.task._start = new Date(this.task.start)), (!this.task._end || !(this.task._end instanceof Date)) && (this.task._end = new Date(this.task.end)), this.compute_x(), this.compute_y(), this.compute_duration(), this.corner_radius = this.gantt.options.bar_corner_radius, this.width = this.gantt.config.column_width * this.duration, (!this.task.progress || this.task.progress < 0) && (this.task.progress = 0), this.task.progress > 100 && (this.task.progress = 100);
|
|
320
324
|
}
|
|
321
325
|
prepare_helpers() {
|
|
322
326
|
SVGElement.prototype.getX = function() {
|
|
@@ -347,7 +351,7 @@ class F {
|
|
|
347
351
|
ry: this.corner_radius,
|
|
348
352
|
class: "bar",
|
|
349
353
|
append_to: this.bar_group
|
|
350
|
-
}), this.task.color && (this.$bar.style.fill = this.task.color),
|
|
354
|
+
}), this.task.color && (this.$bar.style.fill = this.task.color), A(this.$bar, "width", 0, this.width), this.invalid && this.$bar.classList.add("bar-invalid");
|
|
351
355
|
}
|
|
352
356
|
draw_expected_progress_bar() {
|
|
353
357
|
this.invalid || (this.$expected_bar_progress = f("rect", {
|
|
@@ -359,7 +363,7 @@ class F {
|
|
|
359
363
|
ry: this.corner_radius,
|
|
360
364
|
class: "bar-expected-progress",
|
|
361
365
|
append_to: this.bar_group
|
|
362
|
-
}),
|
|
366
|
+
}), A(
|
|
363
367
|
this.$expected_bar_progress,
|
|
364
368
|
"width",
|
|
365
369
|
0,
|
|
@@ -380,7 +384,7 @@ class F {
|
|
|
380
384
|
class: "bar-progress",
|
|
381
385
|
append_to: this.bar_group
|
|
382
386
|
}), this.task.color_progress && (this.$bar_progress.style.fill = this.task.color_progress);
|
|
383
|
-
const e =
|
|
387
|
+
const e = l.diff(
|
|
384
388
|
this.task._start,
|
|
385
389
|
this.gantt.gantt_start,
|
|
386
390
|
this.gantt.config.unit
|
|
@@ -390,12 +394,12 @@ class F {
|
|
|
390
394
|
width: this.width,
|
|
391
395
|
left: e
|
|
392
396
|
});
|
|
393
|
-
this.$date_highlight = i, this.gantt.$lower_header.prepend(this.$date_highlight),
|
|
397
|
+
this.$date_highlight = i, this.gantt.$lower_header.prepend(this.$date_highlight), A(this.$bar_progress, "width", 0, this.progress_width);
|
|
394
398
|
}
|
|
395
399
|
calculate_progress_width() {
|
|
396
|
-
const t = this.$bar.getWidth(), e = this.x + t, i = this.gantt.config.ignored_positions.reduce((h,
|
|
400
|
+
const t = this.$bar.getWidth(), e = this.x + t, i = this.gantt.config.ignored_positions.reduce((h, d) => h + (d >= this.x && d < e), 0) * this.gantt.config.column_width;
|
|
397
401
|
let s = (t - i) * this.task.progress / 100;
|
|
398
|
-
const n = this.x + s, a = this.gantt.config.ignored_positions.reduce((h,
|
|
402
|
+
const n = this.x + s, a = this.gantt.config.ignored_positions.reduce((h, d) => h + (d >= this.x && d < n), 0) * this.gantt.config.column_width;
|
|
399
403
|
s += a;
|
|
400
404
|
let o = this.gantt.get_ignored_region(
|
|
401
405
|
this.x + s
|
|
@@ -548,35 +552,35 @@ class F {
|
|
|
548
552
|
validate_dependency_constraints(t, e = null) {
|
|
549
553
|
const i = this.task.dependencies_type || this.gantt.options.dependencies_type;
|
|
550
554
|
if (i === "fixed")
|
|
551
|
-
return this.task.dependencies.map((
|
|
552
|
-
const s = t / this.gantt.config.column_width, n =
|
|
555
|
+
return this.task.dependencies.map((_) => this.gantt.get_bar(_).$bar.getX()).reduce((_, c) => _ && t >= c, !0);
|
|
556
|
+
const s = t / this.gantt.config.column_width, n = l.add(
|
|
553
557
|
this.gantt.gantt_start,
|
|
554
558
|
s * this.gantt.config.step,
|
|
555
559
|
this.gantt.config.unit
|
|
556
|
-
), o = (e || this.$bar.getWidth()) / this.gantt.config.column_width, h =
|
|
560
|
+
), o = (e || this.$bar.getWidth()) / this.gantt.config.column_width, h = l.add(
|
|
557
561
|
n,
|
|
558
562
|
o * this.gantt.config.step,
|
|
559
563
|
this.gantt.config.unit
|
|
560
564
|
);
|
|
561
|
-
for (const
|
|
562
|
-
const
|
|
563
|
-
if (!
|
|
564
|
-
const
|
|
565
|
+
for (const d of this.task.dependencies) {
|
|
566
|
+
const _ = this.gantt.get_bar(d);
|
|
567
|
+
if (!_) continue;
|
|
568
|
+
const c = _.task;
|
|
565
569
|
switch (i) {
|
|
566
570
|
case "finish-to-start":
|
|
567
|
-
if (n <
|
|
571
|
+
if (n < c._end)
|
|
568
572
|
return !1;
|
|
569
573
|
break;
|
|
570
574
|
case "start-to-start":
|
|
571
|
-
if (n <
|
|
575
|
+
if (n < c._start)
|
|
572
576
|
return !1;
|
|
573
577
|
break;
|
|
574
578
|
case "finish-to-finish":
|
|
575
|
-
if (h <
|
|
579
|
+
if (h < c._end)
|
|
576
580
|
return !1;
|
|
577
581
|
break;
|
|
578
582
|
case "start-to-finish":
|
|
579
|
-
if (h <
|
|
583
|
+
if (h < c._start)
|
|
580
584
|
return !1;
|
|
581
585
|
break;
|
|
582
586
|
}
|
|
@@ -585,8 +589,8 @@ class F {
|
|
|
585
589
|
}
|
|
586
590
|
update_label_position_on_horizontal_scroll({ x: t, sx: e }) {
|
|
587
591
|
const i = this.gantt.$container, s = this.group.querySelector(".bar-label"), n = this.group.querySelector(".bar-img") || "", a = this.bar_group.querySelector(".img_mask") || "";
|
|
588
|
-
let o = this.$bar.getX() + this.$bar.getWidth(), h = s.getX() + t,
|
|
589
|
-
s.classList.contains("big") || (
|
|
592
|
+
let o = this.$bar.getX() + this.$bar.getWidth(), h = s.getX() + t, d = n && n.getX() + t || 0, _ = n && n.getBBox().width + 7 || 7, c = h + s.getBBox().width + 7, g = e + i.clientWidth / 2;
|
|
593
|
+
s.classList.contains("big") || (c < o && t > 0 && c < g || h - _ > this.$bar.getX() && t < 0 && c > g) && (s.setAttribute("x", h), n && (n.setAttribute("x", d), a.setAttribute("x", d)));
|
|
590
594
|
}
|
|
591
595
|
date_changed() {
|
|
592
596
|
let t = !1;
|
|
@@ -594,7 +598,7 @@ class F {
|
|
|
594
598
|
Number(this.task._start) !== Number(e) && (t = !0, this.task._start = e), Number(this.task._end) !== Number(i) && (t = !0, this.task._end = i), t && this.gantt.trigger_event("date_change", [
|
|
595
599
|
this.task,
|
|
596
600
|
e,
|
|
597
|
-
|
|
601
|
+
l.add(i, -1, "second")
|
|
598
602
|
]);
|
|
599
603
|
}
|
|
600
604
|
progress_changed() {
|
|
@@ -608,12 +612,12 @@ class F {
|
|
|
608
612
|
}
|
|
609
613
|
compute_start_end_date() {
|
|
610
614
|
const t = this.$bar, e = t.getX() / this.gantt.config.column_width;
|
|
611
|
-
let i =
|
|
615
|
+
let i = l.add(
|
|
612
616
|
this.gantt.gantt_start,
|
|
613
617
|
e * this.gantt.config.step,
|
|
614
618
|
this.gantt.config.unit
|
|
615
619
|
);
|
|
616
|
-
const s = t.getWidth() / this.gantt.config.column_width, n =
|
|
620
|
+
const s = t.getWidth() / this.gantt.config.column_width, n = l.add(
|
|
617
621
|
i,
|
|
618
622
|
s * this.gantt.config.step,
|
|
619
623
|
this.gantt.config.unit
|
|
@@ -628,11 +632,11 @@ class F {
|
|
|
628
632
|
return parseInt(e / i * 100, 10);
|
|
629
633
|
}
|
|
630
634
|
compute_expected_progress() {
|
|
631
|
-
this.expected_progress =
|
|
635
|
+
this.expected_progress = l.diff(l.today(), this.task._start, "hour") / this.gantt.config.step, this.expected_progress = (this.expected_progress < this.duration ? this.expected_progress : this.duration) * 100 / this.duration;
|
|
632
636
|
}
|
|
633
637
|
compute_x() {
|
|
634
638
|
const { column_width: t } = this.gantt.config, e = this.task._start, i = this.gantt.gantt_start;
|
|
635
|
-
let n =
|
|
639
|
+
let n = l.diff(e, i, this.gantt.config.unit) / this.gantt.config.step * t;
|
|
636
640
|
this.x = n;
|
|
637
641
|
}
|
|
638
642
|
compute_y() {
|
|
@@ -644,10 +648,10 @@ class F {
|
|
|
644
648
|
e++, !this.gantt.config.ignored_dates.find(
|
|
645
649
|
(s) => s.getTime() === i.getTime()
|
|
646
650
|
) && (!this.gantt.config.ignored_function || !this.gantt.config.ignored_function(i)) && t++;
|
|
647
|
-
this.task.actual_duration = t, this.task.ignored_duration = e - t, this.duration =
|
|
651
|
+
this.task.actual_duration = t, this.task.ignored_duration = e - t, this.duration = l.convert_scales(
|
|
648
652
|
e + "d",
|
|
649
653
|
this.gantt.config.unit
|
|
650
|
-
) / this.gantt.config.step, this.actual_duration_raw =
|
|
654
|
+
) / this.gantt.config.step, this.actual_duration_raw = l.convert_scales(
|
|
651
655
|
t + "d",
|
|
652
656
|
this.gantt.config.unit
|
|
653
657
|
) / this.gantt.config.step, this.ignored_duration_raw = this.duration - this.actual_duration_raw;
|
|
@@ -721,7 +725,7 @@ class O {
|
|
|
721
725
|
type: "button",
|
|
722
726
|
append_to: this.actions
|
|
723
727
|
});
|
|
724
|
-
typeof a == "function" && (a = a(i)), h.innerHTML = a, h.onclick = (
|
|
728
|
+
typeof a == "function" && (a = a(i)), h.innerHTML = a, h.onclick = (d) => o(i, this.gantt, d);
|
|
725
729
|
}
|
|
726
730
|
});
|
|
727
731
|
n !== !1 && (n && (this.parent.innerHTML = n), this.actions.innerHTML === "" ? this.actions.remove() : this.parent.appendChild(this.actions), this.parent.style.left = t + 10 + "px", this.parent.style.top = e - 10 + "px", this.parent.classList.remove("hide"));
|
|
@@ -735,8 +739,8 @@ function S(r) {
|
|
|
735
739
|
return t - t % 10 + "";
|
|
736
740
|
}
|
|
737
741
|
function I(r, t, e) {
|
|
738
|
-
let i =
|
|
739
|
-
return `${
|
|
742
|
+
let i = l.add(r, 6, "day"), s = i.getMonth() !== r.getMonth() ? "D MMM" : "D", n = !t || r.getMonth() !== t.getMonth() ? "D MMM" : "D";
|
|
743
|
+
return `${l.format(r, n, e)} - ${l.format(i, s, e)}`;
|
|
740
744
|
}
|
|
741
745
|
const y = [
|
|
742
746
|
{
|
|
@@ -745,7 +749,7 @@ const y = [
|
|
|
745
749
|
step: "1h",
|
|
746
750
|
date_format: "YYYY-MM-DD HH:",
|
|
747
751
|
lower_text: "HH",
|
|
748
|
-
upper_text: (r, t, e) => !t || r.getDate() !== t.getDate() ?
|
|
752
|
+
upper_text: (r, t, e) => !t || r.getDate() !== t.getDate() ? l.format(r, "D MMMM", e) : "",
|
|
749
753
|
upper_text_frequency: 24
|
|
750
754
|
},
|
|
751
755
|
{
|
|
@@ -754,7 +758,7 @@ const y = [
|
|
|
754
758
|
step: "6h",
|
|
755
759
|
date_format: "YYYY-MM-DD HH:",
|
|
756
760
|
lower_text: "HH",
|
|
757
|
-
upper_text: (r, t, e) => !t || r.getDate() !== t.getDate() ?
|
|
761
|
+
upper_text: (r, t, e) => !t || r.getDate() !== t.getDate() ? l.format(r, "D MMM", e) : "",
|
|
758
762
|
upper_text_frequency: 4
|
|
759
763
|
},
|
|
760
764
|
{
|
|
@@ -763,7 +767,7 @@ const y = [
|
|
|
763
767
|
step: "12h",
|
|
764
768
|
date_format: "YYYY-MM-DD HH:",
|
|
765
769
|
lower_text: "HH",
|
|
766
|
-
upper_text: (r, t, e) => !t || r.getDate() !== t.getDate() ? r.getMonth() !== r.getMonth() ?
|
|
770
|
+
upper_text: (r, t, e) => !t || r.getDate() !== t.getDate() ? r.getMonth() !== r.getMonth() ? l.format(r, "D MMM", e) : l.format(r, "D", e) : "",
|
|
767
771
|
upper_text_frequency: 2
|
|
768
772
|
},
|
|
769
773
|
{
|
|
@@ -771,8 +775,8 @@ const y = [
|
|
|
771
775
|
padding: "7d",
|
|
772
776
|
date_format: "YYYY-MM-DD",
|
|
773
777
|
step: "1d",
|
|
774
|
-
lower_text: (r, t, e) => !t || r.getDate() !== t.getDate() ?
|
|
775
|
-
upper_text: (r, t, e) => !t || r.getMonth() !== t.getMonth() ?
|
|
778
|
+
lower_text: (r, t, e) => !t || r.getDate() !== t.getDate() ? l.format(r, "D", e) : "",
|
|
779
|
+
upper_text: (r, t, e) => !t || r.getMonth() !== t.getMonth() ? l.format(r, "MMMM", e) : "",
|
|
776
780
|
thick_line: (r) => r.getDay() === 1
|
|
777
781
|
},
|
|
778
782
|
{
|
|
@@ -782,7 +786,7 @@ const y = [
|
|
|
782
786
|
date_format: "YYYY-MM-DD",
|
|
783
787
|
column_width: 140,
|
|
784
788
|
lower_text: I,
|
|
785
|
-
upper_text: (r, t, e) => !t || r.getMonth() !== t.getMonth() ?
|
|
789
|
+
upper_text: (r, t, e) => !t || r.getMonth() !== t.getMonth() ? l.format(r, "MMMM", e) : "",
|
|
786
790
|
thick_line: (r) => r.getDate() >= 1 && r.getDate() <= 7,
|
|
787
791
|
upper_text_frequency: 4
|
|
788
792
|
},
|
|
@@ -793,7 +797,7 @@ const y = [
|
|
|
793
797
|
column_width: 120,
|
|
794
798
|
date_format: "YYYY-MM",
|
|
795
799
|
lower_text: "MMMM",
|
|
796
|
-
upper_text: (r, t, e) => !t || r.getFullYear() !== t.getFullYear() ?
|
|
800
|
+
upper_text: (r, t, e) => !t || r.getFullYear() !== t.getFullYear() ? l.format(r, "YYYY", e) : "",
|
|
797
801
|
thick_line: (r) => r.getMonth() % 3 === 0,
|
|
798
802
|
snap_at: "7d"
|
|
799
803
|
},
|
|
@@ -814,6 +818,7 @@ const y = [
|
|
|
814
818
|
bar_height: 30,
|
|
815
819
|
container_height: "auto",
|
|
816
820
|
column_width: null,
|
|
821
|
+
critical_path: !1,
|
|
817
822
|
date_format: "YYYY-MM-DD HH:mm",
|
|
818
823
|
dependencies_type: "fixed",
|
|
819
824
|
upper_header_height: 45,
|
|
@@ -828,12 +833,12 @@ const y = [
|
|
|
828
833
|
padding: 18,
|
|
829
834
|
popup: (r) => {
|
|
830
835
|
r.set_title(r.task.name), r.task.description ? r.set_subtitle(r.task.description) : r.set_subtitle("");
|
|
831
|
-
const t =
|
|
836
|
+
const t = l.format(
|
|
832
837
|
r.task._start,
|
|
833
838
|
"MMM D",
|
|
834
839
|
r.chart.options.language
|
|
835
|
-
), e =
|
|
836
|
-
|
|
840
|
+
), e = l.format(
|
|
841
|
+
l.add(r.task._end, -1, "second"),
|
|
837
842
|
"MMM D",
|
|
838
843
|
r.chart.options.language
|
|
839
844
|
);
|
|
@@ -853,7 +858,7 @@ const y = [
|
|
|
853
858
|
view_modes: y,
|
|
854
859
|
is_weekend: (r) => r.getDay() === 0 || r.getDay() === 6
|
|
855
860
|
};
|
|
856
|
-
class
|
|
861
|
+
class j {
|
|
857
862
|
constructor(t, e, i) {
|
|
858
863
|
this.setup_wrapper(t), this.setup_options(i), this.setup_tasks(e), this.change_view_mode(), this.bind_events();
|
|
859
864
|
}
|
|
@@ -936,24 +941,24 @@ class B {
|
|
|
936
941
|
return console.error(
|
|
937
942
|
`task "${e.id}" doesn't have a start date`
|
|
938
943
|
), !1;
|
|
939
|
-
if (e._start =
|
|
940
|
-
let { duration: h, scale:
|
|
941
|
-
e.end =
|
|
944
|
+
if (e._start = l.parse(e.start), e.end === void 0 && e.duration !== void 0 && (e.end = e._start, e.duration.split(" ").forEach((o) => {
|
|
945
|
+
let { duration: h, scale: d } = l.parse_duration(o);
|
|
946
|
+
e.end = l.add(e.end, h, d);
|
|
942
947
|
})), !e.end)
|
|
943
948
|
return console.error(`task "${e.id}" doesn't have an end date`), !1;
|
|
944
|
-
if (e._end =
|
|
949
|
+
if (e._end = l.parse(e.end), l.diff(e._end, e._start, "year") < 0)
|
|
945
950
|
return console.error(
|
|
946
951
|
`start of task can't be after end of task: in task "${e.id}"`
|
|
947
952
|
), !1;
|
|
948
|
-
if (
|
|
953
|
+
if (l.diff(e._end, e._start, "year") > 10)
|
|
949
954
|
return console.error(
|
|
950
955
|
`the duration of task "${e.id}" is too long (above ten years)`
|
|
951
956
|
), !1;
|
|
952
|
-
if (e._index = i,
|
|
957
|
+
if (e._index = i, l.get_date_values(e._end).slice(3).every((a) => a === 0) && (e._end = l.add(e._end, 24, "hour")), typeof e.dependencies == "string" || !e.dependencies) {
|
|
953
958
|
let a = [];
|
|
954
959
|
e.dependencies && (a = e.dependencies.split(",").map((o) => o.trim().replaceAll(" ", "_")).filter((o) => o)), e.dependencies = a;
|
|
955
960
|
}
|
|
956
|
-
return e.id ? typeof e.id == "string" ? e.id = e.id.replaceAll(" ", "_") : e.id = `${e.id}` : e.id =
|
|
961
|
+
return e.id ? typeof e.id == "string" ? e.id = e.id.replaceAll(" ", "_") : e.id = `${e.id}` : e.id = B(e), e;
|
|
957
962
|
}).filter((e) => e), this.setup_dependencies();
|
|
958
963
|
}
|
|
959
964
|
setup_dependencies() {
|
|
@@ -975,7 +980,7 @@ class B {
|
|
|
975
980
|
e && (i = this.$container.scrollLeft, s = this.options.scroll_to, this.options.scroll_to = null), this.options.view_mode = t.name, this.config.view_mode = t, this.update_view_scale(t), this.setup_dates(e), this.render(), e && (this.$container.scrollLeft = i, this.options.scroll_to = s), this.trigger_event("view_change", [t]);
|
|
976
981
|
}
|
|
977
982
|
update_view_scale(t) {
|
|
978
|
-
let { duration: e, scale: i } =
|
|
983
|
+
let { duration: e, scale: i } = l.parse_duration(t.step);
|
|
979
984
|
this.config.step = e, this.config.unit = i, this.config.column_width = this.options.column_width || t.column_width || 45, this.$container.style.setProperty(
|
|
980
985
|
"--gv-column-width",
|
|
981
986
|
this.config.column_width + "px"
|
|
@@ -989,13 +994,13 @@ class B {
|
|
|
989
994
|
this.tasks.length || (e = /* @__PURE__ */ new Date(), i = /* @__PURE__ */ new Date());
|
|
990
995
|
for (let s of this.tasks)
|
|
991
996
|
(!e || s._start < e) && (e = s._start), (!i || s._end > i) && (i = s._end);
|
|
992
|
-
if (e =
|
|
997
|
+
if (e = l.start_of(e, this.config.unit), i = l.start_of(i, this.config.unit), !t)
|
|
993
998
|
if (this.options.infinite_padding)
|
|
994
|
-
this.gantt_start =
|
|
999
|
+
this.gantt_start = l.add(
|
|
995
1000
|
e,
|
|
996
1001
|
-this.config.extend_by_units * 3,
|
|
997
1002
|
this.config.unit
|
|
998
|
-
), this.gantt_end =
|
|
1003
|
+
), this.gantt_end = l.add(
|
|
999
1004
|
i,
|
|
1000
1005
|
this.config.extend_by_units * 3,
|
|
1001
1006
|
this.config.unit
|
|
@@ -1006,13 +1011,13 @@ class B {
|
|
|
1006
1011
|
this.config.view_mode.padding
|
|
1007
1012
|
]);
|
|
1008
1013
|
let [s, n] = this.config.view_mode.padding.map(
|
|
1009
|
-
|
|
1014
|
+
l.parse_duration
|
|
1010
1015
|
);
|
|
1011
|
-
this.gantt_start =
|
|
1016
|
+
this.gantt_start = l.add(
|
|
1012
1017
|
e,
|
|
1013
1018
|
-s.duration,
|
|
1014
1019
|
s.scale
|
|
1015
|
-
), this.gantt_end =
|
|
1020
|
+
), this.gantt_end = l.add(
|
|
1016
1021
|
i,
|
|
1017
1022
|
n.duration,
|
|
1018
1023
|
n.scale
|
|
@@ -1023,7 +1028,7 @@ class B {
|
|
|
1023
1028
|
setup_date_values() {
|
|
1024
1029
|
let t = this.gantt_start;
|
|
1025
1030
|
for (this.dates = [t]; t < this.gantt_end; )
|
|
1026
|
-
t =
|
|
1031
|
+
t = l.add(
|
|
1027
1032
|
t,
|
|
1028
1033
|
this.config.step,
|
|
1029
1034
|
this.config.unit
|
|
@@ -1142,12 +1147,12 @@ class B {
|
|
|
1142
1147
|
}), n += o;
|
|
1143
1148
|
if (this.options.lines !== "horizontal")
|
|
1144
1149
|
for (let h of this.dates) {
|
|
1145
|
-
let
|
|
1146
|
-
this.config.view_mode.thick_line && this.config.view_mode.thick_line(h) && (
|
|
1150
|
+
let d = "tick";
|
|
1151
|
+
this.config.view_mode.thick_line && this.config.view_mode.thick_line(h) && (d += " thick"), f("path", {
|
|
1147
1152
|
d: `M ${t} ${e} v ${i}`,
|
|
1148
|
-
class:
|
|
1153
|
+
class: d,
|
|
1149
1154
|
append_to: this.layers.grid
|
|
1150
|
-
}), this.view_is("month") ? t +=
|
|
1155
|
+
}), this.view_is("month") ? t += l.get_days_in_month(h) * this.config.column_width / 30 : this.view_is("year") ? t += l.get_days_in_year(h) * this.config.column_width / 365 : t += this.config.column_width;
|
|
1151
1156
|
}
|
|
1152
1157
|
}
|
|
1153
1158
|
highlight_holidays() {
|
|
@@ -1175,22 +1180,22 @@ class B {
|
|
|
1175
1180
|
if (!(this.config.ignored_dates.find(
|
|
1176
1181
|
(a) => a.getTime() == n.getTime()
|
|
1177
1182
|
) || this.config.ignored_function && this.config.ignored_function(n)) && (i(n) || s && s(n))) {
|
|
1178
|
-
const a =
|
|
1183
|
+
const a = l.diff(
|
|
1179
1184
|
n,
|
|
1180
1185
|
this.gantt_start,
|
|
1181
1186
|
this.config.unit
|
|
1182
|
-
) / this.config.step * this.config.column_width, o = this.grid_height - this.config.header_height, h =
|
|
1187
|
+
) / this.config.step * this.config.column_width, o = this.grid_height - this.config.header_height, h = l.format(n, "YYYY-MM-DD", this.options.language).replace(" ", "_");
|
|
1183
1188
|
if (t[n]) {
|
|
1184
|
-
let
|
|
1189
|
+
let d = this.create_el({
|
|
1185
1190
|
classes: "holiday-label label_" + h,
|
|
1186
1191
|
append_to: this.$extras
|
|
1187
1192
|
});
|
|
1188
|
-
|
|
1193
|
+
d.textContent = t[n];
|
|
1189
1194
|
}
|
|
1190
1195
|
f("rect", {
|
|
1191
1196
|
x: Math.round(a),
|
|
1192
1197
|
y: this.config.header_height,
|
|
1193
|
-
width: this.config.column_width /
|
|
1198
|
+
width: this.config.column_width / l.convert_scales(
|
|
1194
1199
|
this.config.view_mode.step,
|
|
1195
1200
|
"day"
|
|
1196
1201
|
),
|
|
@@ -1212,7 +1217,7 @@ class B {
|
|
|
1212
1217
|
if (!t) return;
|
|
1213
1218
|
const [e, i] = t;
|
|
1214
1219
|
i.classList.add("current-date-highlight");
|
|
1215
|
-
const n =
|
|
1220
|
+
const n = l.diff(
|
|
1216
1221
|
/* @__PURE__ */ new Date(),
|
|
1217
1222
|
this.gantt_start,
|
|
1218
1223
|
this.config.unit
|
|
@@ -1246,8 +1251,8 @@ class B {
|
|
|
1246
1251
|
(n) => n.getTime() == i.getTime()
|
|
1247
1252
|
) && (!this.config.ignored_function || !this.config.ignored_function(i)))
|
|
1248
1253
|
continue;
|
|
1249
|
-
let s =
|
|
1250
|
-
|
|
1254
|
+
let s = l.convert_scales(
|
|
1255
|
+
l.diff(i, this.gantt_start) + "d",
|
|
1251
1256
|
this.config.unit
|
|
1252
1257
|
) / this.config.step;
|
|
1253
1258
|
this.config.ignored_positions.push(s * this.config.column_width), f("rect", {
|
|
@@ -1265,9 +1270,9 @@ class B {
|
|
|
1265
1270
|
);
|
|
1266
1271
|
}
|
|
1267
1272
|
create_el({ left: t, top: e, width: i, height: s, id: n, classes: a, append_to: o, type: h }) {
|
|
1268
|
-
let
|
|
1269
|
-
for (let
|
|
1270
|
-
return
|
|
1273
|
+
let d = document.createElement(h || "div");
|
|
1274
|
+
for (let _ of a.split(" ")) d.classList.add(_);
|
|
1275
|
+
return d.style.top = e + "px", d.style.left = t + "px", n && (d.id = n), i && (d.style.width = i + "px"), s && (d.style.height = s + "px"), o && o.appendChild(d), d;
|
|
1271
1276
|
}
|
|
1272
1277
|
make_dates() {
|
|
1273
1278
|
this.get_dates_to_draw().forEach((t, e) => {
|
|
@@ -1305,10 +1310,10 @@ class B {
|
|
|
1305
1310
|
this.config.column_width;
|
|
1306
1311
|
const s = e ? e.x + e.column_width : 0;
|
|
1307
1312
|
let n = this.config.view_mode.upper_text, a = this.config.view_mode.lower_text;
|
|
1308
|
-
return n ? typeof n == "string" && (this.config.view_mode.upper_text = (o) =>
|
|
1313
|
+
return n ? typeof n == "string" && (this.config.view_mode.upper_text = (o) => l.format(o, n, this.options.language)) : this.config.view_mode.upper_text = () => "", a ? typeof a == "string" && (this.config.view_mode.lower_text = (o) => l.format(o, a, this.options.language)) : this.config.view_mode.lower_text = () => "", {
|
|
1309
1314
|
date: t,
|
|
1310
1315
|
formatted_date: k(
|
|
1311
|
-
|
|
1316
|
+
l.format(
|
|
1312
1317
|
t,
|
|
1313
1318
|
this.config.date_format,
|
|
1314
1319
|
this.options.language
|
|
@@ -1337,7 +1342,7 @@ class B {
|
|
|
1337
1342
|
});
|
|
1338
1343
|
}
|
|
1339
1344
|
make_arrows() {
|
|
1340
|
-
this.arrows = [];
|
|
1345
|
+
this.arrows = [], this.options.critical_path && this.calculate_critical_path();
|
|
1341
1346
|
for (let t of this.tasks) {
|
|
1342
1347
|
let e = [];
|
|
1343
1348
|
e = t.dependencies.map((i) => {
|
|
@@ -1354,6 +1359,50 @@ class B {
|
|
|
1354
1359
|
}).filter(Boolean), this.arrows = this.arrows.concat(e);
|
|
1355
1360
|
}
|
|
1356
1361
|
}
|
|
1362
|
+
calculate_critical_path() {
|
|
1363
|
+
this.tasks.forEach((n) => n._is_critical = !1);
|
|
1364
|
+
const t = {};
|
|
1365
|
+
this.tasks.forEach((n) => {
|
|
1366
|
+
t[n.id] = { es: 0, ef: 0, ls: 0, lf: 0 };
|
|
1367
|
+
});
|
|
1368
|
+
const e = (n) => {
|
|
1369
|
+
if (t[n.id].ef > 0) return t[n.id];
|
|
1370
|
+
let a = 0;
|
|
1371
|
+
n.dependencies && n.dependencies.length > 0 && n.dependencies.forEach((h) => {
|
|
1372
|
+
const d = this.get_task(h);
|
|
1373
|
+
if (d) {
|
|
1374
|
+
const _ = e(d);
|
|
1375
|
+
a = Math.max(a, _.ef);
|
|
1376
|
+
}
|
|
1377
|
+
}), t[n.id].es = a;
|
|
1378
|
+
const o = l.diff(n._end, n._start, "hour") / 24;
|
|
1379
|
+
return t[n.id].ef = a + o, t[n.id];
|
|
1380
|
+
};
|
|
1381
|
+
this.tasks.forEach((n) => e(n));
|
|
1382
|
+
const i = Math.max(...Object.values(t).map((n) => n.ef)), s = (n) => {
|
|
1383
|
+
if (t[n.id].ls > 0 || t[n.id].lf > 0)
|
|
1384
|
+
return t[n.id];
|
|
1385
|
+
const a = this.tasks.filter(
|
|
1386
|
+
(d) => d.dependencies && d.dependencies.includes(n.id)
|
|
1387
|
+
);
|
|
1388
|
+
let o = i;
|
|
1389
|
+
a.length > 0 && a.forEach((d) => {
|
|
1390
|
+
const _ = s(d);
|
|
1391
|
+
o = Math.min(o, _.ls);
|
|
1392
|
+
});
|
|
1393
|
+
const h = l.diff(n._end, n._start, "hour") / 24;
|
|
1394
|
+
return t[n.id].lf = o, t[n.id].ls = o - h, t[n.id];
|
|
1395
|
+
};
|
|
1396
|
+
this.tasks.forEach((n) => s(n)), this.tasks.forEach((n) => {
|
|
1397
|
+
const a = t[n.id], o = a.ls - a.es;
|
|
1398
|
+
n._is_critical = Math.abs(o) < 0.01;
|
|
1399
|
+
});
|
|
1400
|
+
}
|
|
1401
|
+
update_arrow_critical_path() {
|
|
1402
|
+
this.arrows.forEach((t) => {
|
|
1403
|
+
t.from_task.task._is_critical === !0 && t.to_task.task._is_critical === !0 ? t.element.classList.add("arrow-critical") : t.element.classList.remove("arrow-critical");
|
|
1404
|
+
});
|
|
1405
|
+
}
|
|
1357
1406
|
map_arrows_on_bars() {
|
|
1358
1407
|
for (let t of this.bars)
|
|
1359
1408
|
t.arrows = this.arrows.filter((e) => e.from_task.task.id === t.task.id || e.to_task.task.id === t.task.id);
|
|
@@ -1375,9 +1424,9 @@ class B {
|
|
|
1375
1424
|
else {
|
|
1376
1425
|
if (t === "today")
|
|
1377
1426
|
return this.scroll_current();
|
|
1378
|
-
typeof t == "string" && (t =
|
|
1427
|
+
typeof t == "string" && (t = l.parse(t));
|
|
1379
1428
|
}
|
|
1380
|
-
const i =
|
|
1429
|
+
const i = l.diff(
|
|
1381
1430
|
t,
|
|
1382
1431
|
this.gantt_start,
|
|
1383
1432
|
this.config.unit
|
|
@@ -1385,7 +1434,7 @@ class B {
|
|
|
1385
1434
|
this.$container.scrollTo({
|
|
1386
1435
|
left: i - this.config.column_width / 6,
|
|
1387
1436
|
behavior: "smooth"
|
|
1388
|
-
}), this.$current && this.$current.classList.remove("current-upper"), this.current_date =
|
|
1437
|
+
}), this.$current && this.$current.classList.remove("current-upper"), this.current_date = l.add(
|
|
1389
1438
|
this.gantt_start,
|
|
1390
1439
|
this.$container.scrollLeft / this.config.column_width,
|
|
1391
1440
|
this.config.unit
|
|
@@ -1397,7 +1446,7 @@ class B {
|
|
|
1397
1446
|
), n = this.upperTexts.find(
|
|
1398
1447
|
(a) => a.textContent === s
|
|
1399
1448
|
);
|
|
1400
|
-
this.current_date =
|
|
1449
|
+
this.current_date = l.add(
|
|
1401
1450
|
this.gantt_start,
|
|
1402
1451
|
(this.$container.scrollLeft + n.clientWidth) / this.config.column_width,
|
|
1403
1452
|
this.config.unit
|
|
@@ -1416,7 +1465,7 @@ class B {
|
|
|
1416
1465
|
if (t < this.gantt_start || t > this.gantt_end) return null;
|
|
1417
1466
|
let e = /* @__PURE__ */ new Date(), i = this.$container.querySelector(
|
|
1418
1467
|
".date_" + k(
|
|
1419
|
-
|
|
1468
|
+
l.format(
|
|
1420
1469
|
e,
|
|
1421
1470
|
this.config.date_format,
|
|
1422
1471
|
this.options.language
|
|
@@ -1424,9 +1473,9 @@ class B {
|
|
|
1424
1473
|
)
|
|
1425
1474
|
), s = 0;
|
|
1426
1475
|
for (; !i && s < this.config.step; )
|
|
1427
|
-
e =
|
|
1476
|
+
e = l.add(e, -1, this.config.unit), i = this.$container.querySelector(
|
|
1428
1477
|
".date_" + k(
|
|
1429
|
-
|
|
1478
|
+
l.format(
|
|
1430
1479
|
e,
|
|
1431
1480
|
this.config.date_format,
|
|
1432
1481
|
this.options.language
|
|
@@ -1435,7 +1484,7 @@ class B {
|
|
|
1435
1484
|
), s++;
|
|
1436
1485
|
return [
|
|
1437
1486
|
/* @__PURE__ */ new Date(
|
|
1438
|
-
|
|
1487
|
+
l.format(
|
|
1439
1488
|
e,
|
|
1440
1489
|
this.config.date_format,
|
|
1441
1490
|
this.options.language
|
|
@@ -1475,63 +1524,63 @@ class B {
|
|
|
1475
1524
|
if (!this.bars.length) return [0, 0, 0];
|
|
1476
1525
|
let { x: t, width: e } = this.bars[0].group.getBBox(), i = t, s = t, n = t + e;
|
|
1477
1526
|
return Array.prototype.forEach.call(this.bars, function({ group: a }, o) {
|
|
1478
|
-
let { x: h, width:
|
|
1479
|
-
h < i && (i = h), h > s && (s = h), h +
|
|
1527
|
+
let { x: h, width: d } = a.getBBox();
|
|
1528
|
+
h < i && (i = h), h > s && (s = h), h + d > n && (n = h + d);
|
|
1480
1529
|
}), [i, s, n];
|
|
1481
1530
|
}
|
|
1482
1531
|
bind_bar_events() {
|
|
1483
1532
|
let t = !1, e = 0, i = 0, s = !1, n = !1, a = null, o = [];
|
|
1484
1533
|
this.bar_being_dragged = null;
|
|
1485
1534
|
const h = () => t || s || n;
|
|
1486
|
-
this.$svg.onclick = (
|
|
1487
|
-
|
|
1535
|
+
this.$svg.onclick = (_) => {
|
|
1536
|
+
_.target.classList.contains("grid-row") && this.unselect_all();
|
|
1488
1537
|
};
|
|
1489
|
-
let
|
|
1490
|
-
if (p.on(this.$svg, "mousemove", ".bar-wrapper, .handle", (
|
|
1491
|
-
this.bar_being_dragged === !1 && Math.abs((
|
|
1492
|
-
}), p.on(this.$svg, "mousedown", ".bar-wrapper, .handle", (
|
|
1493
|
-
const
|
|
1494
|
-
|
|
1538
|
+
let d = 0;
|
|
1539
|
+
if (p.on(this.$svg, "mousemove", ".bar-wrapper, .handle", (_) => {
|
|
1540
|
+
this.bar_being_dragged === !1 && Math.abs((_.offsetX || _.layerX) - d) > 10 && (this.bar_being_dragged = !0);
|
|
1541
|
+
}), p.on(this.$svg, "mousedown", ".bar-wrapper, .handle", (_, c) => {
|
|
1542
|
+
const g = p.closest(".bar-wrapper", c);
|
|
1543
|
+
c.classList.contains("left") ? (s = !0, c.classList.add("visible")) : c.classList.contains("right") ? (n = !0, c.classList.add("visible")) : c.classList.contains("bar-wrapper") && (t = !0), this.popup && this.popup.hide(), e = _.offsetX || _.layerX, a = g.getAttribute("data-id");
|
|
1495
1544
|
const $ = this.get_bar(a).task.dependencies_type || this.options.dependencies_type;
|
|
1496
1545
|
let m;
|
|
1497
1546
|
this.options.move_dependencies && $ === "fixed" ? m = [
|
|
1498
1547
|
a,
|
|
1499
1548
|
...this.get_all_dependent_tasks(a)
|
|
1500
|
-
] : m = [a], o = m.map((x) => this.get_bar(x)), this.bar_being_dragged = !1,
|
|
1549
|
+
] : m = [a], o = m.map((x) => this.get_bar(x)), this.bar_being_dragged = !1, d = e, o.forEach((x) => {
|
|
1501
1550
|
const w = x.$bar;
|
|
1502
1551
|
w.ox = w.getX(), w.oy = w.getY(), w.owidth = w.getWidth(), w.finaldx = 0;
|
|
1503
1552
|
});
|
|
1504
1553
|
}), this.options.infinite_padding) {
|
|
1505
|
-
let
|
|
1506
|
-
p.on(this.$container, "mousewheel", (
|
|
1507
|
-
let
|
|
1508
|
-
if (!
|
|
1509
|
-
let u =
|
|
1510
|
-
|
|
1554
|
+
let _ = !1;
|
|
1555
|
+
p.on(this.$container, "mousewheel", (c) => {
|
|
1556
|
+
let g = this.$container.scrollWidth / 2;
|
|
1557
|
+
if (!_ && c.currentTarget.scrollLeft <= g) {
|
|
1558
|
+
let u = c.currentTarget.scrollLeft;
|
|
1559
|
+
_ = !0, this.gantt_start = l.add(
|
|
1511
1560
|
this.gantt_start,
|
|
1512
1561
|
-this.config.extend_by_units,
|
|
1513
1562
|
this.config.unit
|
|
1514
|
-
), this.setup_date_values(), this.render(),
|
|
1563
|
+
), this.setup_date_values(), this.render(), c.currentTarget.scrollLeft = u + this.config.column_width * this.config.extend_by_units, setTimeout(() => _ = !1, 300);
|
|
1515
1564
|
}
|
|
1516
|
-
if (!
|
|
1517
|
-
let u =
|
|
1518
|
-
|
|
1565
|
+
if (!_ && c.currentTarget.scrollWidth - (c.currentTarget.scrollLeft + c.currentTarget.clientWidth) <= g) {
|
|
1566
|
+
let u = c.currentTarget.scrollLeft;
|
|
1567
|
+
_ = !0, this.gantt_end = l.add(
|
|
1519
1568
|
this.gantt_end,
|
|
1520
1569
|
this.config.extend_by_units,
|
|
1521
1570
|
this.config.unit
|
|
1522
|
-
), this.setup_date_values(), this.render(),
|
|
1571
|
+
), this.setup_date_values(), this.render(), c.currentTarget.scrollLeft = u, setTimeout(() => _ = !1, 300);
|
|
1523
1572
|
}
|
|
1524
1573
|
});
|
|
1525
1574
|
}
|
|
1526
|
-
p.on(this.$container, "scroll", (
|
|
1527
|
-
let
|
|
1528
|
-
const
|
|
1575
|
+
p.on(this.$container, "scroll", (_) => {
|
|
1576
|
+
let c = [];
|
|
1577
|
+
const g = this.bars.map(
|
|
1529
1578
|
({ group: b }) => b.getAttribute("data-id")
|
|
1530
1579
|
);
|
|
1531
1580
|
let u;
|
|
1532
|
-
i && (u =
|
|
1581
|
+
i && (u = _.currentTarget.scrollLeft - i), this.current_date = l.add(
|
|
1533
1582
|
this.gantt_start,
|
|
1534
|
-
|
|
1583
|
+
_.currentTarget.scrollLeft / this.config.column_width * this.config.step,
|
|
1535
1584
|
this.config.unit
|
|
1536
1585
|
);
|
|
1537
1586
|
let $ = this.config.view_mode.upper_text(
|
|
@@ -1541,9 +1590,9 @@ class B {
|
|
|
1541
1590
|
), m = this.upperTexts.find(
|
|
1542
1591
|
(b) => b.textContent === $
|
|
1543
1592
|
);
|
|
1544
|
-
this.current_date =
|
|
1593
|
+
this.current_date = l.add(
|
|
1545
1594
|
this.gantt_start,
|
|
1546
|
-
(
|
|
1595
|
+
(_.currentTarget.scrollLeft + m.clientWidth) / this.config.column_width * this.config.step,
|
|
1547
1596
|
this.config.unit
|
|
1548
1597
|
), $ = this.config.view_mode.upper_text(
|
|
1549
1598
|
this.current_date,
|
|
@@ -1551,55 +1600,55 @@ class B {
|
|
|
1551
1600
|
this.options.language
|
|
1552
1601
|
), m = this.upperTexts.find(
|
|
1553
1602
|
(b) => b.textContent === $
|
|
1554
|
-
), m !== this.$current && (this.$current && this.$current.classList.remove("current-upper"), m.classList.add("current-upper"), this.$current = m), i =
|
|
1603
|
+
), m !== this.$current && (this.$current && this.$current.classList.remove("current-upper"), m.classList.add("current-upper"), this.$current = m), i = _.currentTarget.scrollLeft;
|
|
1555
1604
|
let [x, w, X] = this.get_start_end_positions();
|
|
1556
1605
|
i > X + 100 ? (this.$adjust.innerHTML = "←", this.$adjust.classList.remove("hide"), this.$adjust.onclick = () => {
|
|
1557
1606
|
this.$container.scrollTo({
|
|
1558
1607
|
left: w,
|
|
1559
1608
|
behavior: "smooth"
|
|
1560
1609
|
});
|
|
1561
|
-
}) : i +
|
|
1610
|
+
}) : i + _.currentTarget.offsetWidth < x - 100 ? (this.$adjust.innerHTML = "→", this.$adjust.classList.remove("hide"), this.$adjust.onclick = () => {
|
|
1562
1611
|
this.$container.scrollTo({
|
|
1563
1612
|
left: x,
|
|
1564
1613
|
behavior: "smooth"
|
|
1565
1614
|
});
|
|
1566
|
-
}) : this.$adjust.classList.add("hide"), u && (
|
|
1615
|
+
}) : this.$adjust.classList.add("hide"), u && (c = g.map((b) => this.get_bar(b)), this.options.auto_move_label && c.forEach((b) => {
|
|
1567
1616
|
b.update_label_position_on_horizontal_scroll({
|
|
1568
1617
|
x: u,
|
|
1569
|
-
sx:
|
|
1618
|
+
sx: _.currentTarget.scrollLeft
|
|
1570
1619
|
});
|
|
1571
1620
|
}));
|
|
1572
|
-
}), p.on(this.$svg, "mousemove", (
|
|
1621
|
+
}), p.on(this.$svg, "mousemove", (_) => {
|
|
1573
1622
|
if (!h()) return;
|
|
1574
|
-
const
|
|
1575
|
-
o.forEach((
|
|
1576
|
-
const u =
|
|
1577
|
-
u.finaldx = this.get_snap_position(
|
|
1623
|
+
const c = (_.offsetX || _.layerX) - e;
|
|
1624
|
+
o.forEach((g) => {
|
|
1625
|
+
const u = g.$bar;
|
|
1626
|
+
u.finaldx = this.get_snap_position(c, u.ox), this.hide_popup(), s ? a === g.task.id ? g.update_bar_position({
|
|
1578
1627
|
x: u.ox + u.finaldx,
|
|
1579
1628
|
width: u.owidth - u.finaldx
|
|
1580
|
-
}) :
|
|
1629
|
+
}) : g.update_bar_position({
|
|
1581
1630
|
x: u.ox + u.finaldx
|
|
1582
|
-
}) : n ? a ===
|
|
1631
|
+
}) : n ? a === g.task.id && g.update_bar_position({
|
|
1583
1632
|
width: u.owidth + u.finaldx
|
|
1584
|
-
}) : t && !this.options.readonly && !this.options.readonly_dates &&
|
|
1633
|
+
}) : t && !this.options.readonly && !this.options.readonly_dates && g.update_bar_position({ x: u.ox + u.finaldx });
|
|
1585
1634
|
});
|
|
1586
1635
|
}), document.addEventListener("mouseup", () => {
|
|
1587
|
-
var
|
|
1588
|
-
t = !1, s = !1, n = !1, (
|
|
1589
|
-
}), p.on(this.$svg, "mouseup", (
|
|
1590
|
-
this.bar_being_dragged = null, o.forEach((
|
|
1591
|
-
|
|
1636
|
+
var _, c, g;
|
|
1637
|
+
t = !1, s = !1, n = !1, (g = (c = (_ = this.$container.querySelector(".visible")) == null ? void 0 : _.classList) == null ? void 0 : c.remove) == null || g.call(c, "visible");
|
|
1638
|
+
}), p.on(this.$svg, "mouseup", (_) => {
|
|
1639
|
+
this.bar_being_dragged = null, o.forEach((g) => {
|
|
1640
|
+
g.$bar.finaldx && (g.date_changed(), g.compute_progress(), g.set_action_completed());
|
|
1592
1641
|
});
|
|
1593
|
-
const
|
|
1594
|
-
|
|
1642
|
+
const c = this.get_bar(a);
|
|
1643
|
+
c && c.$bar.finaldx && this.update_dependent_tasks_by_type(c), this.options.critical_path && o.some((g) => g.$bar.finaldx) && (this.calculate_critical_path(), this.update_arrow_critical_path());
|
|
1595
1644
|
}), this.bind_bar_progress();
|
|
1596
1645
|
}
|
|
1597
1646
|
bind_bar_progress() {
|
|
1598
1647
|
let t = 0, e = null, i = null, s = null, n = null;
|
|
1599
1648
|
p.on(this.$svg, "mousedown", ".handle.progress", (o, h) => {
|
|
1600
1649
|
e = !0, t = o.offsetX || o.layerX;
|
|
1601
|
-
const
|
|
1602
|
-
i = this.get_bar(
|
|
1650
|
+
const _ = p.closest(".bar-wrapper", h).getAttribute("data-id");
|
|
1651
|
+
i = this.get_bar(_), s = i.$bar_progress, n = i.$bar, s.finaldx = 0, s.owidth = s.getWidth(), s.min_dx = -s.owidth, s.max_dx = n.getWidth() - s.getWidth();
|
|
1603
1652
|
});
|
|
1604
1653
|
const a = this.config.ignored_positions.map((o) => [
|
|
1605
1654
|
o,
|
|
@@ -1609,24 +1658,24 @@ class B {
|
|
|
1609
1658
|
if (!e) return;
|
|
1610
1659
|
let h = o.offsetX || o.layerX;
|
|
1611
1660
|
if (h > t) {
|
|
1612
|
-
let
|
|
1613
|
-
([
|
|
1661
|
+
let c = a.find(
|
|
1662
|
+
([g, u]) => h >= g && h < u
|
|
1614
1663
|
);
|
|
1615
|
-
for (;
|
|
1616
|
-
h =
|
|
1617
|
-
([
|
|
1664
|
+
for (; c; )
|
|
1665
|
+
h = c[1], c = a.find(
|
|
1666
|
+
([g, u]) => h >= g && h < u
|
|
1618
1667
|
);
|
|
1619
1668
|
} else {
|
|
1620
|
-
let
|
|
1621
|
-
([
|
|
1669
|
+
let c = a.find(
|
|
1670
|
+
([g, u]) => h > g && h <= u
|
|
1622
1671
|
);
|
|
1623
|
-
for (;
|
|
1624
|
-
h =
|
|
1625
|
-
([
|
|
1672
|
+
for (; c; )
|
|
1673
|
+
h = c[0], c = a.find(
|
|
1674
|
+
([g, u]) => h > g && h <= u
|
|
1626
1675
|
);
|
|
1627
1676
|
}
|
|
1628
|
-
let
|
|
1629
|
-
console.log(s),
|
|
1677
|
+
let _ = h - t;
|
|
1678
|
+
console.log(s), _ > s.max_dx && (_ = s.max_dx), _ < s.min_dx && (_ = s.min_dx), s.setAttribute("width", s.owidth + _), p.attr(i.$handle_progress, "cx", s.getEndX()), s.finaldx = _;
|
|
1630
1679
|
}), p.on(this.$svg, "mouseup", () => {
|
|
1631
1680
|
e = !1, s && s.finaldx && (s.finaldx = 0, i.progress_changed(), i.set_action_completed(), i = null, s = null, n = null);
|
|
1632
1681
|
});
|
|
@@ -1645,32 +1694,32 @@ class B {
|
|
|
1645
1694
|
const n = this.get_bar(s);
|
|
1646
1695
|
if (!n) return;
|
|
1647
1696
|
const a = n.task, o = a.dependencies_type || this.options.dependencies_type;
|
|
1648
|
-
let h,
|
|
1649
|
-
const
|
|
1650
|
-
let
|
|
1697
|
+
let h, d;
|
|
1698
|
+
const _ = l.diff(a._end, a._start, "hour");
|
|
1699
|
+
let c = !1;
|
|
1651
1700
|
switch (o) {
|
|
1652
1701
|
case "finish-to-start":
|
|
1653
|
-
t.task._end > a._start && (h = new Date(t.task._end),
|
|
1702
|
+
t.task._end > a._start && (h = new Date(t.task._end), d = l.add(h, _, "hour"), c = !0);
|
|
1654
1703
|
break;
|
|
1655
1704
|
case "start-to-start":
|
|
1656
|
-
t.task._start > a._start && (h = new Date(t.task._start),
|
|
1705
|
+
t.task._start > a._start && (h = new Date(t.task._start), d = l.add(h, _, "hour"), c = !0);
|
|
1657
1706
|
break;
|
|
1658
1707
|
case "finish-to-finish":
|
|
1659
|
-
t.task._end > a._end && (
|
|
1708
|
+
t.task._end > a._end && (d = new Date(t.task._end), h = l.add(d, -_, "hour"), c = !0);
|
|
1660
1709
|
break;
|
|
1661
1710
|
case "start-to-finish":
|
|
1662
|
-
t.task._start > a._end && (
|
|
1711
|
+
t.task._start > a._end && (d = new Date(t.task._start), h = l.add(d, -_, "hour"), c = !0);
|
|
1663
1712
|
break;
|
|
1664
1713
|
default:
|
|
1665
1714
|
return;
|
|
1666
1715
|
}
|
|
1667
|
-
|
|
1716
|
+
c && (a._start = h, a._end = d, n.compute_x(), n.compute_duration(), n.update_bar_position({
|
|
1668
1717
|
x: n.x,
|
|
1669
1718
|
width: n.width
|
|
1670
1719
|
}), this.trigger_event("date_change", [
|
|
1671
1720
|
a,
|
|
1672
1721
|
h,
|
|
1673
|
-
|
|
1722
|
+
l.add(d, -1, "second")
|
|
1674
1723
|
]), this.update_dependent_tasks_by_type(n));
|
|
1675
1724
|
});
|
|
1676
1725
|
}
|
|
@@ -1678,15 +1727,15 @@ class B {
|
|
|
1678
1727
|
let i = 1;
|
|
1679
1728
|
const s = this.options.snap_at || this.config.view_mode.snap_at || "1d";
|
|
1680
1729
|
if (s !== "unit") {
|
|
1681
|
-
const { duration:
|
|
1682
|
-
i =
|
|
1730
|
+
const { duration: _, scale: c } = l.parse_duration(s);
|
|
1731
|
+
i = l.convert_scales(this.config.view_mode.step, c) / _;
|
|
1683
1732
|
}
|
|
1684
1733
|
const n = t % (this.config.column_width / i);
|
|
1685
1734
|
let a = t - n + (n < this.config.column_width / i * 2 ? 0 : this.config.column_width / i), o = e + a;
|
|
1686
1735
|
const h = a > 0 ? 1 : -1;
|
|
1687
|
-
let
|
|
1688
|
-
for (;
|
|
1689
|
-
o += this.config.column_width * h,
|
|
1736
|
+
let d = this.get_ignored_region(o, h);
|
|
1737
|
+
for (; d.length; )
|
|
1738
|
+
o += this.config.column_width * h, d = this.get_ignored_region(o, h), d.length || (o -= this.config.column_width * h);
|
|
1690
1739
|
return o - e;
|
|
1691
1740
|
}
|
|
1692
1741
|
get_ignored_region(t, e = 1) {
|
|
@@ -1736,11 +1785,11 @@ class B {
|
|
|
1736
1785
|
* @memberof Gantt
|
|
1737
1786
|
*/
|
|
1738
1787
|
clear() {
|
|
1739
|
-
var t, e, i, s, n, a, o, h,
|
|
1740
|
-
this.$svg.innerHTML = "", (e = (t = this.$header) == null ? void 0 : t.remove) == null || e.call(t), (s = (i = this.$side_header) == null ? void 0 : i.remove) == null || s.call(i), (a = (n = this.$current_highlight) == null ? void 0 : n.remove) == null || a.call(n), (h = (o = this.$extras) == null ? void 0 : o.remove) == null || h.call(o), (
|
|
1788
|
+
var t, e, i, s, n, a, o, h, d, _;
|
|
1789
|
+
this.$svg.innerHTML = "", (e = (t = this.$header) == null ? void 0 : t.remove) == null || e.call(t), (s = (i = this.$side_header) == null ? void 0 : i.remove) == null || s.call(i), (a = (n = this.$current_highlight) == null ? void 0 : n.remove) == null || a.call(n), (h = (o = this.$extras) == null ? void 0 : o.remove) == null || h.call(o), (_ = (d = this.popup) == null ? void 0 : d.hide) == null || _.call(d);
|
|
1741
1790
|
}
|
|
1742
1791
|
}
|
|
1743
|
-
|
|
1792
|
+
j.VIEW_MODE = {
|
|
1744
1793
|
HOUR: y[0],
|
|
1745
1794
|
QUARTER_DAY: y[1],
|
|
1746
1795
|
HALF_DAY: y[2],
|
|
@@ -1749,12 +1798,12 @@ B.VIEW_MODE = {
|
|
|
1749
1798
|
MONTH: y[5],
|
|
1750
1799
|
YEAR: y[6]
|
|
1751
1800
|
};
|
|
1752
|
-
function
|
|
1801
|
+
function B(r) {
|
|
1753
1802
|
return r.name + "_" + Math.random().toString(36).slice(2, 12);
|
|
1754
1803
|
}
|
|
1755
1804
|
function k(r) {
|
|
1756
1805
|
return r.replaceAll(" ", "_").replaceAll(":", "_").replaceAll(".", "_");
|
|
1757
1806
|
}
|
|
1758
1807
|
export {
|
|
1759
|
-
|
|
1808
|
+
j as default
|
|
1760
1809
|
};
|