From 47328236f7af3e12a10ab0debbae0a7d1acf5477 Mon Sep 17 00:00:00 2001 From: wanglin2 <1013335014@qq.com> Date: Fri, 30 Dec 2022 10:52:04 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E7=94=BB=E5=B8=83=E8=B7=9D?= =?UTF-8?q?=E7=AA=97=E5=8F=A3=E5=B7=A6=E4=B8=8A=E8=A7=92=E4=B8=8D=E4=B8=BA?= =?UTF-8?q?0=E6=97=B6=E8=8A=82=E7=82=B9=E6=8B=96=E6=8B=BD=E5=87=BA?= =?UTF-8?q?=E7=8E=B0=E5=81=8F=E7=A7=BB=E7=9A=84=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 2 +- index.html | 2 +- simple-mind-map/package.json | 2 +- simple-mind-map/src/Drag.js | 9 ++-- simple-mind-map/src/Render.js | 67 ++++++++++++-------------- web/src/pages/Edit/components/Edit.vue | 5 ++ 6 files changed, 43 insertions(+), 44 deletions(-) diff --git a/README.md b/README.md index 381738dd..e68dfe13 100644 --- a/README.md +++ b/README.md @@ -93,7 +93,7 @@ npm run build # 安装 -> 当前仓库版本：0.2.19，当前npm版本：0.2.19 +> 当前仓库版本：0.2.20，当前npm版本：0.2.20 ```bash npm i simple-mind-map diff --git a/index.html b/index.html index 34c8bdf3..8094277b 100644 --- a/index.html +++ b/index.html @@ -1 +1 @@ -一个简单的web思维导图实现
\ No newline at end of file +一个简单的web思维导图实现
\ No newline at end of file diff --git a/simple-mind-map/package.json b/simple-mind-map/package.json index 9d99df75..2407f636 100644 --- a/simple-mind-map/package.json +++ b/simple-mind-map/package.json @@ -1,6 +1,6 @@ { "name": "simple-mind-map", - "version": "0.2.19", + "version": "0.2.20", "description": "一个简单的web在线思维导图", "authors": [ { diff --git a/simple-mind-map/src/Drag.js b/simple-mind-map/src/Drag.js index f186bb05..5c8925d6 100644 --- a/simple-mind-map/src/Drag.js +++ b/simple-mind-map/src/Drag.js @@ -76,12 +76,11 @@ class Drag extends Base { // 计算鼠标按下的位置距离节点左上角的距离 this.drawTransform = this.mindMap.draw.transform() let { scaleX, scaleY, translateX, translateY } = this.drawTransform - this.offsetX = e.clientX - (node.left * scaleX + translateX) - this.offsetY = e.clientY - (node.top * scaleY + translateY) - // + let { x, y } = this.mindMap.toPos(e.clientX, e.clientY) + this.offsetX = x - (node.left * scaleX + translateX) + this.offsetY = y - (node.top * scaleY + translateY) this.node = node this.isMousedown = true - let { x, y } = this.mindMap.toPos(e.clientX, e.clientY) this.mouseDownX = x this.mouseDownY = y }) @@ -275,7 +274,7 @@ class Drag extends Base { } } // 检测兄弟节点位置 - if (!this.prevNode && !this.nextNode && this.node.isBrother(node)) { + if (!this.prevNode && !this.nextNode && !node.isRoot) {// && this.node.isBrother(node) if (left <= checkRight && right >= this.cloneNodeLeft) { if (this.cloneNodeTop > bottom && this.cloneNodeTop <= bottom + 10) { this.prevNode = node diff --git a/simple-mind-map/src/Render.js b/simple-mind-map/src/Render.js index c5980c9c..b31b0195 100644 --- a/simple-mind-map/src/Render.js +++ b/simple-mind-map/src/Render.js @@ -549,32 +549,30 @@ class Render { if (node.isRoot) { return } - let parent = node.parent - let childList = parent.children - // 要移动节点的索引 - let index = childList.findIndex(item => { + // 移动节点 + let nodeParent = node.parent + let nodeBorthers = nodeParent.children + let nodeIndex = nodeBorthers.findIndex(item => { return item === node }) - if (index === -1) { + if (nodeIndex === -1) { return } - // 目标节点的索引 - let existIndex = childList.findIndex(item => { + nodeBorthers.splice(nodeIndex, 1) + nodeParent.nodeData.children.splice(nodeIndex, 1) + + + // 目标节点 + let existParent = exist.parent + let existBorthers = existParent.children + let existIndex = existBorthers.findIndex(item => { return item === exist }) if (existIndex === -1) { return } - // 当前节点在目标节点前面 - if (index < existIndex) { - existIndex = existIndex - 1 - } - // 节点实例 - childList.splice(index, 1) - childList.splice(existIndex, 0, node) - // 节点数据 - parent.nodeData.children.splice(index, 1) - parent.nodeData.children.splice(existIndex, 0, node.nodeData) + existBorthers.splice(existIndex, 0, node) + existParent.nodeData.children.splice(existIndex, 0, node.nodeData) this.mindMap.render() } @@ -588,34 +586,31 @@ class Render { if (node.isRoot) { return } - let parent = node.parent - let childList = parent.children - // 要移动节点的索引 - let index = childList.findIndex(item => { + // 移动节点 + let nodeParent = node.parent + let nodeBorthers = nodeParent.children + let nodeIndex = nodeBorthers.findIndex(item => { return item === node }) - if (index === -1) { + if (nodeIndex === -1) { return } - // 目标节点的索引 - let existIndex = childList.findIndex(item => { + nodeBorthers.splice(nodeIndex, 1) + nodeParent.nodeData.children.splice(nodeIndex, 1) + + + // 目标节点 + let existParent = exist.parent + let existBorthers = existParent.children + let existIndex = existBorthers.findIndex(item => { return item === exist }) if (existIndex === -1) { return } - // 当前节点在目标节点前面 - if (index < existIndex) { - // do nothing - } else { - existIndex = existIndex + 1 - } - // 节点实例 - childList.splice(index, 1) - childList.splice(existIndex, 0, node) - // 节点数据 - parent.nodeData.children.splice(index, 1) - parent.nodeData.children.splice(existIndex, 0, node.nodeData) + existIndex++ + existBorthers.splice(existIndex, 0, node) + existParent.nodeData.children.splice(existIndex, 0, node.nodeData) this.mindMap.render() } diff --git a/web/src/pages/Edit/components/Edit.vue b/web/src/pages/Edit/components/Edit.vue index b7f81bd0..b3b1a8ba 100644 --- a/web/src/pages/Edit/components/Edit.vue +++ b/web/src/pages/Edit/components/Edit.vue @@ -328,6 +328,11 @@ export default { top: 0px; width: 100%; height: 100%; + + // left: 100px; + // top: 100px; + // right: 100px; + // bottom: 100px; } }