拖拽 Drag

我们经常需要通过拖拽交互调整任务上下级或任务顺序，拖拽任务排序。

通过以下配置开启任务栏拖拽能力。

const netGraph = new NetPlanGraph({
  draggable: true,
})

// 等同于
const netGraph = new NetPlanGraph({
  draggable: {
    enabled: true,
  },
})

创建画布后，调用 netGraph.enableDrag() 和 netGraph.disableDrag() 来启用和禁用。

if (netGraph.isDragEnabled()) {
  netGraph.disableDrag()
} else {
  netGraph.enableDrag()
}

拖拽事件

netGraph.on("dragging", (e, el) => {
  // e mouseevent 
  // el 包裹移动节点   
})

netGraph.on("drop", (e, pos, dropId, dragId) => {
  // e mouseevent 
  // pos:front after(向前或向后插入)  
  // dropId：拖拽放置到的任务ID 
  // dropId：被拖拽的任务id
})