58 lines
1.8 KiB
JavaScript
58 lines
1.8 KiB
JavaScript
/**
|
||
* @author: clay
|
||
* @data: 2019/07/16
|
||
* @description: edit mode: 鼠标拖动节点的交互(记录拖拽前后的数据，用于【撤销】和【重做】)
|
||
*/
|
||
|
||
// 用来获取调用此js的vue组件实例（this）
|
||
let vm = null
|
||
let historyData = null
|
||
|
||
const sendThis = (_this) => {
|
||
vm = _this
|
||
}
|
||
|
||
export default {
|
||
sendThis, // 暴露函数
|
||
name: 'drag-event-edit',
|
||
options: {
|
||
getEvents() {
|
||
return {
|
||
'node:dragstart': 'onNodeDragstart',
|
||
'node:dragend': 'onNodeDragend'
|
||
}
|
||
},
|
||
onNodeDragstart() {
|
||
let graph = vm.getGraph()
|
||
if(graph.cfg){
|
||
historyData = JSON.stringify(graph.save())
|
||
}
|
||
},
|
||
onNodeDragend() {
|
||
if (historyData) {
|
||
let graph = vm.getGraph()
|
||
// 如果当前点过【撤销】了，拖拽节点后没有【重做】功能
|
||
// 重置undoCount，拖拽后的数据给(当前所在historyIndex + 1)，且清空这个时间点之后的记录
|
||
if (vm.getUndoCount() > 0) {
|
||
vm.editHistoryIndex( vm.getHistoryIndex() - vm.getUndoCount()) // 此时的historyIndex应当更新为【撤销】后所在的索引位置
|
||
for (let i = 1; i <= vm.getUndoCount(); i++) {
|
||
let key = `graph_history_${vm.getHistoryIndex() + i}`
|
||
vm.removeHistoryData(key)
|
||
}
|
||
vm.editUndoCount(0);
|
||
} else {
|
||
// 正常顺序执行的情况，记录拖拽前的数据状态
|
||
let key = `graph_history_${vm.getHistoryIndex()}`
|
||
vm.addHistoryData(key, historyData)
|
||
}
|
||
// 记录拖拽后的数据状态
|
||
const index=vm.getHistoryIndex()+ 1;
|
||
vm.editHistoryIndex(index);
|
||
let key = `graph_history_${index}`
|
||
let currentData = JSON.stringify(graph.save())
|
||
vm.addHistoryData(key, currentData)
|
||
}
|
||
}
|
||
}
|
||
}
|