feat: improved progress handle
This commit is contained in:
parent
8bdd488618
commit
e9931bde24
23
src/bar.js
23
src/bar.js
@ -149,7 +149,7 @@ export default class Bar {
|
||||
$date_highlight.classList.add('date-highlight')
|
||||
$date_highlight.style.height = this.height * 0.8 + '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'
|
||||
this.$date_highlight = $date_highlight
|
||||
this.gantt.$lower_header.prepend($date_highlight)
|
||||
@ -254,13 +254,24 @@ export default class Bar {
|
||||
|
||||
get_progress_polygon_points() {
|
||||
const bar_progress = this.$bar_progress;
|
||||
let icon_width = 10;
|
||||
let icon_height = 15;
|
||||
|
||||
return [
|
||||
bar_progress.getEndX() - 6,
|
||||
bar_progress.getY() + bar_progress.getHeight() + 8,
|
||||
bar_progress.getEndX() + 6,
|
||||
bar_progress.getY() + bar_progress.getHeight() + 8,
|
||||
bar_progress.getEndX() - icon_width / 2,
|
||||
bar_progress.getY() + bar_progress.getHeight() / 2,
|
||||
|
||||
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,
|
||||
];
|
||||
}
|
||||
|
||||
|
||||
@ -38,11 +38,11 @@ $dark-blue: #2c94ec !default;
|
||||
}
|
||||
|
||||
.upper-header {
|
||||
height: 50px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.lower-header {
|
||||
height: 56px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.lower-text {
|
||||
@ -218,6 +218,10 @@ $dark-blue: #2c94ec !default;
|
||||
.handle {
|
||||
fill: $handle-color-important;
|
||||
}
|
||||
|
||||
.handle.progress {
|
||||
fill: $text-light;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -229,6 +233,10 @@ $dark-blue: #2c94ec !default;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
.handle.progress {
|
||||
fill: $text-muted;
|
||||
}
|
||||
|
||||
.bar-wrapper {
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
|
||||
@ -1182,7 +1182,7 @@ export default class Gantt {
|
||||
this.$svg.innerHTML = "";
|
||||
this.$header?.remove?.()
|
||||
this.$current_highlight?.remove?.()
|
||||
this.$popup_wrapper?.remove?.()
|
||||
this.$popup_wrapper.innerHTML = ''
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user