jingrow/gantt
1
0
Fork 0
Code Pull Requests Activity

fix: handle bar disappearing

Browse Source
This commit is contained in:
Safwan Samsudeen 2025-01-08 13:01:19 +05:30
parent 2c15115198
commit 7dcc132830
2 changed files with 7 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/index.js
View File

@ -1100,17 +1100,16 @@ export default class Gantt {
$.on(this.$svg, 'mousedown', '.bar-wrapper, .handle', (e, element) => { $.on(this.$svg, 'mousedown', '.bar-wrapper, .handle', (e, element) => {
const bar_wrapper = $.closest('.bar-wrapper', element); const bar_wrapper = $.closest('.bar-wrapper', element);
bars.forEach((bar) => bar.group.classList.remove('active'));
if (element.classList.contains('left')) { if (element.classList.contains('left')) {
is_resizing_left = true; is_resizing_left = true;
element.classList.add('visible');
} else if (element.classList.contains('right')) { } else if (element.classList.contains('right')) {
is_resizing_right = true; is_resizing_right = true;
element.classList.add('visible');
} else if (element.classList.contains('bar-wrapper')) { } else if (element.classList.contains('bar-wrapper')) {
is_dragging = true; is_dragging = true;
} }
bar_wrapper.classList.add('active');
if (this.popup) this.popup.hide(); if (this.popup) this.popup.hide();
x_on_start = e.offsetX || e.layerX; x_on_start = e.offsetX || e.layerX;
@ -1316,6 +1315,7 @@ export default class Gantt {
is_dragging = false; is_dragging = false;
is_resizing_left = false; is_resizing_left = false;
is_resizing_right = false; is_resizing_right = false;
document.querySelector('.visible').classList.remove('visible');
}); });
$.on(this.$svg, 'mouseup', (e) => { $.on(this.$svg, 'mouseup', (e) => {
@ -1479,9 +1479,6 @@ export default class Gantt {
} }
unselect_all() { unselect_all() {
[...this.$svg.querySelectorAll('.bar-wrapper')].forEach((el) => {
el.classList.remove('active');
});
if (this.popup) this.popup.parent.classList.add('hide'); if (this.popup) this.popup.parent.classList.add('hide');
this.$container this.$container
.querySelectorAll('.date-range-highlight') .querySelectorAll('.date-range-highlight')

7
src/styles/gantt.css
View File

@ -137,7 +137,7 @@
text-align: center; text-align: center;
height: 30px; height: 30px;
border-radius: 0; border-radius: 0;
border: 1px dotted grey; border: 1px solid grey;
border-right: none; border-right: none;
color: var(--g-text-dark); color: var(--g-text-dark);
padding: 4px 10px; padding: 4px 10px;
@ -150,7 +150,7 @@
& .side-header *:first-child { & .side-header *:first-child {
border-radius: 0 8px 8px 0; border-radius: 0 8px 8px 0;
border-right: 1px dotted grey; border-right: 1px solid grey;
} }
& .side-header *:last-child { & .side-header *:last-child {
@ -298,7 +298,8 @@
fill: var(--g-handle-color); fill: var(--g-handle-color);
opacity: 0; opacity: 0;
transition: opacity 0.3s ease; transition: opacity 0.3s ease;
&.active { &.active,
&.visible {
cursor: ew-resize; cursor: ew-resize;
opacity: 1; opacity: 1;
} }