jingrow/gantt
1
0
Fork 0
Code Pull Requests Activity

feat: improved progress handle

Browse Source
This commit is contained in:
Safwan Samsudeen 2024-04-28 17:46:01 +05:30
parent 8bdd488618
commit e9931bde24
3 changed files with 28 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/bar.js
View File

@ -149,7 +149,7 @@ export default class Bar {
$date_highlight.classList.add('date-highlight') $date_highlight.classList.add('date-highlight')
$date_highlight.style.height = this.height * 0.8 + 'px' $date_highlight.style.height = this.height * 0.8 + 'px'
$date_highlight.style.width = this.width + 'px' $date_highlight.style.width = this.width + 'px'
$date_highlight.style.top = this.gantt.options.header_height - 24 + 'px' $date_highlight.style.top = this.gantt.options.header_height - 25 + 'px'
$date_highlight.style.left = x + 'px' $date_highlight.style.left = x + 'px'
this.$date_highlight = $date_highlight this.$date_highlight = $date_highlight
this.gantt.$lower_header.prepend($date_highlight) this.gantt.$lower_header.prepend($date_highlight)
@ -254,13 +254,24 @@ export default class Bar {
get_progress_polygon_points() { get_progress_polygon_points() {
const bar_progress = this.$bar_progress; const bar_progress = this.$bar_progress;
let icon_width = 10;
let icon_height = 15;
return [ return [
bar_progress.getEndX() - 6, bar_progress.getEndX() - icon_width / 2,
bar_progress.getY() + bar_progress.getHeight() + 8, bar_progress.getY() + bar_progress.getHeight() / 2,
bar_progress.getEndX() + 6,
bar_progress.getY() + bar_progress.getHeight() + 8,
bar_progress.getEndX(), bar_progress.getEndX(),
bar_progress.getY() + bar_progress.getHeight() + 0.5, bar_progress.getY() + bar_progress.getHeight() / 2 - icon_height / 2,
bar_progress.getEndX() + icon_width / 2,
bar_progress.getY() + bar_progress.getHeight() / 2,
bar_progress.getEndX(),
bar_progress.getY() + bar_progress.getHeight() / 2 + icon_height / 2,
bar_progress.getEndX() - icon_width / 2,
bar_progress.getY() + bar_progress.getHeight() / 2,
]; ];
} }

12
src/gantt.scss
View File

@ -38,11 +38,11 @@ $dark-blue: #2c94ec !default;
} }
.upper-header { .upper-header {
height: 50px; height: 40px;
} }
.lower-header { .lower-header {
height: 56px; height: 30px;
} }
.lower-text { .lower-text {
@ -218,6 +218,10 @@ $dark-blue: #2c94ec !default;
.handle { .handle {
fill: $handle-color-important; fill: $handle-color-important;
} }
.handle.progress {
fill: $text-light;
}
} }
@ -229,6 +233,10 @@ $dark-blue: #2c94ec !default;
transition: opacity 0.3s ease; transition: opacity 0.3s ease;
} }
.handle.progress {
fill: $text-muted;
}
.bar-wrapper { .bar-wrapper {
cursor: pointer; cursor: pointer;
outline: none; outline: none;

2
src/index.js
View File

@ -1182,7 +1182,7 @@ export default class Gantt {
this.$svg.innerHTML = ""; this.$svg.innerHTML = "";
this.$header?.remove?.() this.$header?.remove?.()
this.$current_highlight?.remove?.() this.$current_highlight?.remove?.()
this.$popup_wrapper?.remove?.() this.$popup_wrapper.innerHTML = ''
} }
} }