fix: a bug

This commit is contained in:
Safwan Samsudeen 2024-05-02 15:06:04 +05:30
parent 9cd3633dd7
commit 30a8d5a78b
5 changed files with 52 additions and 50 deletions

20
dist/frappe-gantt.js vendored
View File

@ -1,4 +1,4 @@
const k = "year", D = "month", v = "day", E = "hour", Y = "minute", A = "second", L = "millisecond", T = { const M = "year", D = "month", v = "day", E = "hour", Y = "minute", A = "second", L = "millisecond", T = {
January: "Jan", January: "Jan",
February: "Feb", February: "Feb",
March: "Mar", March: "Mar",
@ -95,7 +95,7 @@ const k = "year", D = "month", v = "day", E = "hour", Y = "minute", A = "second"
add(n, t, e) { add(n, t, e) {
t = parseInt(t, 10); t = parseInt(t, 10);
const s = [ const s = [
n.getFullYear() + (e === k ? t : 0), n.getFullYear() + (e === M ? t : 0),
n.getMonth() + (e === D ? t : 0), n.getMonth() + (e === D ? t : 0),
n.getDate() + (e === v ? t : 0), n.getDate() + (e === v ? t : 0),
n.getHours() + (e === E ? t : 0), n.getHours() + (e === E ? t : 0),
@ -107,7 +107,7 @@ const k = "year", D = "month", v = "day", E = "hour", Y = "minute", A = "second"
}, },
start_of(n, t) { start_of(n, t) {
const e = { const e = {
[k]: 6, [M]: 6,
[D]: 5, [D]: 5,
[v]: 4, [v]: 4,
[E]: 3, [E]: 3,
@ -121,7 +121,7 @@ const k = "year", D = "month", v = "day", E = "hour", Y = "minute", A = "second"
} }
const i = [ const i = [
n.getFullYear(), n.getFullYear(),
s(k) ? 0 : n.getMonth(), s(M) ? 0 : n.getMonth(),
s(D) ? 1 : n.getDate(), s(D) ? 1 : n.getDate(),
s(v) ? 0 : n.getHours(), s(v) ? 0 : n.getHours(),
s(E) ? 0 : n.getMinutes(), s(E) ? 0 : n.getMinutes(),
@ -554,7 +554,7 @@ class O {
const t = this.$bar; const t = this.$bar;
this.handle_group.querySelector(".handle.left").setAttribute("x", t.getX() - 12), this.handle_group.querySelector(".handle.right").setAttribute("x", t.getEndX() + 4); this.handle_group.querySelector(".handle.left").setAttribute("x", t.getX() - 12), this.handle_group.querySelector(".handle.right").setAttribute("x", t.getEndX() + 4);
const e = this.group.querySelector(".handle.progress"); const e = this.group.querySelector(".handle.progress");
e && e.setAttribute("points", this.get_progress_polygon_points()); console.log(e, this.$bar_progress.getEndX()), e && e.setAttribute("cx", this.$bar_progress.getEndX());
} }
update_arrow_position() { update_arrow_position() {
this.arrows = this.arrows || []; this.arrows = this.arrows || [];
@ -685,7 +685,7 @@ class F {
e = t; e = t;
else else
throw new TypeError( throw new TypeError(
"Frappé Gantt only supports usage of a string CSS selector, HTML DOM element or SVG DOM element for the 'element' parameter" "Frappe Gantt only supports usage of a string CSS selector, HTML DOM element or SVG DOM element for the 'element' parameter"
); );
e ? (this.$svg = e, this.$svg.classList.add("gantt")) : this.$svg = c("svg", { e ? (this.$svg = e, this.$svg.classList.add("gantt")) : this.$svg = c("svg", {
append_to: s, append_to: s,
@ -1101,7 +1101,7 @@ class F {
bind_grid_click() { bind_grid_click() {
_.on( _.on(
this.$svg, this.$svg,
this.options.popup_trigger, "click",
".grid-row, .grid-header", ".grid-row, .grid-header",
() => { () => {
this.unselect_all(), this.hide_popup(); this.unselect_all(), this.hide_popup();
@ -1145,10 +1145,10 @@ class F {
if (x && !x.classList.contains("current-upper")) { if (x && !x.classList.contains("current-upper")) {
const m = document.querySelector(".current-upper"); const m = document.querySelector(".current-upper");
m && (m.classList.remove("current-upper"), m.style.left = this.upper_texts_x[m.textContent] + "px", m.style.top = this.options.header_height - 50 + "px"), x.classList.add("current-upper"); m && (m.classList.remove("current-upper"), m.style.left = this.upper_texts_x[m.textContent] + "px", m.style.top = this.options.header_height - 50 + "px"), x.classList.add("current-upper");
let M = this.$svg.getBoundingClientRect(); let k = this.$svg.getBoundingClientRect();
x.style.left = M.x + this.$container.scrollLeft + 10 + "px", x.style.top = M.y + this.options.header_height - 50 + "px"; x.style.left = k.x + this.$container.scrollLeft + 10 + "px", x.style.top = k.y + this.options.header_height - 50 + "px";
} }
Array.prototype.forEach.call(g, function(m, M) { Array.prototype.forEach.call(g, function(m, k) {
f.push(m.getAttribute("data-id")); f.push(m.getAttribute("data-id"));
}), w && (u = f.map((m) => this.get_bar(m)), this.options.auto_move_label && u.forEach((m) => { }), w && (u = f.map((m) => this.get_bar(m)), this.options.auto_move_label && u.forEach((m) => {
m.update_label_position_on_horizontal_scroll({ m.update_label_position_on_horizontal_scroll({

File diff suppressed because one or more lines are too long

View File

@ -7,6 +7,7 @@
"scripts": { "scripts": {
"start": "yarn run dev", "start": "yarn run dev",
"dev": "vite", "dev": "vite",
"build-dev": "vite build --watch",
"build": "vite build", "build": "vite build",
"test": "jest", "test": "jest",
"lint": "eslint src/**/*.js", "lint": "eslint src/**/*.js",

View File

@ -31,8 +31,8 @@ export default class Bar {
this.width = this.gantt.options.column_width * this.duration; this.width = this.gantt.options.column_width * this.duration;
this.progress_width = this.progress_width =
this.gantt.options.column_width * this.gantt.options.column_width *
this.duration * this.duration *
(this.task.progress / 100) || 0; (this.task.progress / 100) || 0;
this.group = createSVG('g', { this.group = createSVG('g', {
class: class:
'bar-wrapper' + 'bar-wrapper' +
@ -72,8 +72,8 @@ export default class Bar {
this.compute_expected_progress(); this.compute_expected_progress();
this.expected_progress_width = this.expected_progress_width =
this.gantt.options.column_width * this.gantt.options.column_width *
this.duration * this.duration *
(this.expected_progress / 100) || 0; (this.expected_progress / 100) || 0;
} }
draw() { draw() {
@ -102,7 +102,7 @@ export default class Bar {
class: class:
'bar' + 'bar' +
(/^((?!chrome|android).)*safari/i.test(navigator.userAgent) && (/^((?!chrome|android).)*safari/i.test(navigator.userAgent) &&
!this.task.important !this.task.important
? ' safari' ? ' safari'
: ''), : ''),
append_to: this.bar_group, append_to: this.bar_group,
@ -287,12 +287,12 @@ export default class Bar {
this.group, this.group,
'mouseenter', 'mouseenter',
(e) => (e) =>
(timeout = setTimeout(() => { (timeout = setTimeout(() => {
this.show_popup(e.offsetX || e.layerX); this.show_popup(e.offsetX || e.layerX);
document.getElementById( document.getElementById(
`${task_id}-highlight`, `${task_id}-highlight`,
).style.display = 'block'; ).style.display = 'block';
}, 200)), }, 200)),
); );
$.on(this.group, 'mouseleave', () => { $.on(this.group, 'mouseleave', () => {
@ -567,8 +567,8 @@ export default class Bar {
this.$expected_bar_progress.setAttribute( this.$expected_bar_progress.setAttribute(
'width', 'width',
this.gantt.options.column_width * this.gantt.options.column_width *
this.duration * this.duration *
(this.expected_progress / 100) || 0, (this.expected_progress / 100) || 0,
); );
} }
@ -634,8 +634,9 @@ export default class Bar {
.querySelector('.handle.right') .querySelector('.handle.right')
.setAttribute('x', bar.getEndX() + 4); .setAttribute('x', bar.getEndX() + 4);
const handle = this.group.querySelector('.handle.progress'); const handle = this.group.querySelector('.handle.progress');
console.log(handle, this.$bar_progress.getEndX())
handle && handle &&
handle.setAttribute('points', this.get_progress_polygon_points()); handle.setAttribute('cx', this.$bar_progress.getEndX());
} }
update_arrow_position() { update_arrow_position() {

View File

@ -77,8 +77,8 @@ export default class Gantt {
svg_element = element; svg_element = element;
} else { } else {
throw new TypeError( throw new TypeError(
'Frappé Gantt only supports usage of a string CSS selector,' + 'Frappe Gantt only supports usage of a string CSS selector,' +
" HTML DOM element or SVG DOM element for the 'element' parameter", " HTML DOM element or SVG DOM element for the 'element' parameter",
); );
} }
@ -144,7 +144,7 @@ export default class Gantt {
if (diff < 0) { if (diff < 0) {
throw Error( throw Error(
"start of task can't be after end of task: in task #, " + "start of task can't be after end of task: in task #, " +
(i + 1), (i + 1),
); );
} }
// make task invalid if duration too large // make task invalid if duration too large
@ -390,7 +390,7 @@ export default class Gantt {
this.options.header_height + this.options.header_height +
this.options.padding + this.options.padding +
(this.options.bar_height + this.options.padding) * (this.options.bar_height + this.options.padding) *
this.tasks.length; this.tasks.length;
createSVG('rect', { createSVG('rect', {
x: 0, x: 0,
@ -621,7 +621,7 @@ export default class Gantt {
x + x +
(date_utils.diff(today, this.gantt_start, 'hour') / (date_utils.diff(today, this.gantt_start, 'hour') /
this.options.step) * this.options.step) *
this.options.column_width, this.options.column_width,
date: today, date: today,
}; };
} }
@ -776,10 +776,10 @@ export default class Gantt {
date.getDate() !== last_date.getDate() date.getDate() !== last_date.getDate()
? date.getMonth() !== last_date.getMonth() ? date.getMonth() !== last_date.getMonth()
? date_utils.format( ? date_utils.format(
date, date,
'D MMM', 'D MMM',
this.options.language, this.options.language,
) )
: date_utils.format(date, 'D', this.options.language) : date_utils.format(date, 'D', this.options.language)
: '', : '',
Day_upper: Day_upper:
@ -801,7 +801,7 @@ export default class Gantt {
}; };
let column_width = this.view_is(VIEW_MODE.MONTH) let column_width = this.view_is(VIEW_MODE.MONTH)
? (date_utils.get_days_in_month(date) * this.options.column_width) / ? (date_utils.get_days_in_month(date) * this.options.column_width) /
30 30
: this.options.column_width; : this.options.column_width;
const base_pos = { const base_pos = {
x: last_date_info x: last_date_info
@ -833,17 +833,17 @@ export default class Gantt {
base_pos_x: base_pos.x, base_pos_x: base_pos.x,
upper_text: this.options.lower_text upper_text: this.options.lower_text
? this.options.upper_text( ? this.options.upper_text(
date, date,
this.options.view_mode, this.options.view_mode,
date_text[`${this.options.view_mode}_upper`], date_text[`${this.options.view_mode}_upper`],
) )
: date_text[`${this.options.view_mode}_upper`], : date_text[`${this.options.view_mode}_upper`],
lower_text: this.options.lower_text lower_text: this.options.lower_text
? this.options.lower_text( ? this.options.lower_text(
date, date,
this.options.view_mode, this.options.view_mode,
date_text[`${this.options.view_mode}_lower`], date_text[`${this.options.view_mode}_lower`],
) )
: date_text[`${this.options.view_mode}_lower`], : date_text[`${this.options.view_mode}_lower`],
upper_x: base_pos.x + x_pos[`${this.options.view_mode}_upper`], upper_x: base_pos.x + x_pos[`${this.options.view_mode}_upper`],
upper_y: base_pos.upper_y, upper_y: base_pos.upper_y,
@ -919,7 +919,7 @@ export default class Gantt {
const scroll_pos = const scroll_pos =
(hours_before_first_task / this.options.step) * (hours_before_first_task / this.options.step) *
this.options.column_width - this.options.column_width -
this.options.column_width; this.options.column_width;
parent_element.scrollTo({ left: scroll_pos, behavior: 'smooth' }); parent_element.scrollTo({ left: scroll_pos, behavior: 'smooth' });
} }
@ -931,7 +931,7 @@ export default class Gantt {
bind_grid_click() { bind_grid_click() {
$.on( $.on(
this.$svg, this.$svg,
this.options.popup_trigger, 'click',
'.grid-row, .grid-header', '.grid-row, .grid-header',
() => { () => {
this.unselect_all(); this.unselect_all();