|
@@ -65,7 +65,9 @@ export function GanttChartMonth(options) {
|
|
|
// 翻页时间回调
|
|
|
this.pageToCallback = options.pageToCallback || null
|
|
|
// hover背景条
|
|
|
- this.hoverEl = null
|
|
|
+ this.hoverEl = null;
|
|
|
+ // hover背景条位置高度
|
|
|
+ this.hoverElY = 0;
|
|
|
}
|
|
|
|
|
|
/**
|
|
@@ -137,12 +139,15 @@ GanttChartMonth.prototype.forceRefreshGraph = function() {
|
|
|
|
|
|
GanttChartMonth.prototype.initHoverElHandler = function(){
|
|
|
let that = this
|
|
|
- this.gCanvas.on('mousemove', (ev)=>{
|
|
|
+ this.gCanvas.on('mousemove', (ev)=>{
|
|
|
+ // console.log('ev', ev)
|
|
|
if(that.hoverEl){
|
|
|
- that.hoverEl.attr({
|
|
|
- y: ev.y
|
|
|
- })
|
|
|
- that.hoverEl.setZIndex(-1)
|
|
|
+ if (this.hoverElY) {
|
|
|
+ that.hoverEl.attr({
|
|
|
+ y: this.hoverElY - 5
|
|
|
+ })
|
|
|
+ that.hoverEl.setZIndex(-1)
|
|
|
+ }
|
|
|
}
|
|
|
})
|
|
|
}
|
|
@@ -370,19 +375,19 @@ GanttChartMonth.prototype.drawTimeZone = function() {
|
|
|
* 处理点击
|
|
|
*/
|
|
|
GanttChartMonth.prototype.handleClick = function(task, flag, ev) {
|
|
|
- // let detailDiv = document.getElementById('detailDiv')
|
|
|
if (flag == 'enter') {
|
|
|
- // detailDiv.style.display = 'block'
|
|
|
- // detailDiv.style.left = ev.clientX+'px';
|
|
|
- // detailDiv.style.top = ev.clientY+'px';
|
|
|
- // document.getElementById('detailTaskName').textContent = task._pdata.description
|
|
|
- // document.getElementById('detailTaskStatus').textContent = task._pdata.status
|
|
|
- // document.getElementById('detailTaskStartDate').textContent = task._pdata.startDate
|
|
|
- // document.getElementById('detailTaskEndDate').textContent = task._pdata.endDate
|
|
|
- // console.log('show:', task)
|
|
|
+ document.querySelector('#ganttContainer>canvas').style.cursor = 'pointer';
|
|
|
+ this.hoverElY = task.cfg.attrs.y;
|
|
|
+ // console.log('task', task.cfg.attrs.y)
|
|
|
} else if (flag === 'leave') {
|
|
|
- // detailDiv.style.display = 'none'
|
|
|
- // console.log('hide:', task)
|
|
|
+ document.querySelector('#ganttContainer>canvas').style.cursor = 'default';
|
|
|
+ if(this.hoverEl){
|
|
|
+ this.hoverEl.attr({
|
|
|
+ y: 0
|
|
|
+ })
|
|
|
+ this.hoverEl.setZIndex(-5)
|
|
|
+ this.hoverElY = 0;
|
|
|
+ }
|
|
|
} else {
|
|
|
this.callback(task)
|
|
|
console.log('click:', task)
|
|
@@ -573,12 +578,10 @@ GanttChartMonth.prototype.drawTasks = function() {
|
|
|
rectEl._pdata = _taskItem
|
|
|
_taskItem._rectEl = rectEl
|
|
|
rectEl.on('mouseover', (ev) => {
|
|
|
- document.querySelector('#ganttContainer>canvas').style.cursor = 'pointer';
|
|
|
- // this.handleClick(ev.target, 'enter', ev)
|
|
|
+ this.handleClick(ev.target, 'enter', ev)
|
|
|
})
|
|
|
rectEl.on('mouseleave', (ev) => {
|
|
|
- document.querySelector('#ganttContainer>canvas').style.cursor = 'default';
|
|
|
- // this.handleClick(ev.target, 'leave', ev)
|
|
|
+ this.handleClick(ev.target, 'leave', ev)
|
|
|
})
|
|
|
rectEl.on('click', (ev) => {
|
|
|
this.handleClick(ev.target, 'click', ev)
|