From 25a2d919fbe0f7b8986f9dcfbd6a03ae8de3f0d4 Mon Sep 17 00:00:00 2001 From: wanglin25 Date: Mon, 9 May 2022 11:03:56 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E8=B6=85=E9=93=BE=E6=8E=A5?= =?UTF-8?q?=E3=80=81=E5=A4=87=E6=B3=A8=E3=80=81=E6=A0=87=E7=AD=BE=E7=AD=89?= =?UTF-8?q?=E6=96=87=E5=AD=97=E7=BC=96=E8=BE=91=E6=97=B6=E8=BF=94=E5=9B=9E?= =?UTF-8?q?=E9=94=AE=E5=92=8C=E5=9B=9E=E8=BD=A6=E9=94=AE=E4=B8=8E=E6=80=9D?= =?UTF-8?q?=E7=BB=B4=E5=AF=BC=E5=9B=BE=E5=BF=AB=E6=8D=B7=E9=94=AE=E5=86=B2?= =?UTF-8?q?=E7=AA=81=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 | 12 ++++++- simple-mind-map/src/Export.js | 4 +-- simple-mind-map/src/Render.js | 36 ++++++++++++++----- web/src/pages/Edit/components/Edit.vue | 6 ++++ web/src/pages/Edit/components/Export.vue | 2 +- .../pages/Edit/components/NodeHyperlink.vue | 2 ++ web/src/pages/Edit/components/NodeNote.vue | 2 ++ web/src/pages/Edit/components/NodeTag.vue | 2 ++ 8 files changed, 54 insertions(+), 12 deletions(-) diff --git a/README.md b/README.md index d9e18fcd..d2907fb2 100644 --- a/README.md +++ b/README.md @@ -250,7 +250,7 @@ const mindMap = new MindMap({ `data`：思维导图结构数据 -#### export(type, isDownload) +#### export(type, isDownload, fileName) 导出 @@ -258,6 +258,8 @@ const mindMap = new MindMap({ `isDownload`：是否需要直接触发下载，布尔值，默认为`false` +`fileName`：（v0.1.6+）导出文件的名称，默认为`思维导图` + #### toPos(x, y) v0.1.5+ @@ -286,6 +288,14 @@ v0.1.5+ ### 方法 +#### startTextEdit() + +（v0.1.6+）若有文字编辑需求可调用该方法，会禁用回车键和删除键相关快捷键防止冲突 + +#### endTextEdit() + +（v0.1.6+）结束文字编辑，会恢复回车键和删除键相关快捷键 + #### addActiveNode(node) 添加节点到激活列表里 diff --git a/simple-mind-map/src/Export.js b/simple-mind-map/src/Export.js index 5eb6637e..2c8e5992 100644 --- a/simple-mind-map/src/Export.js +++ b/simple-mind-map/src/Export.js @@ -22,11 +22,11 @@ class Export { * @Date: 2021-07-02 07:44:06 * @Desc: 导出 */ - async export(type, isDownload = true) { + async export(type, isDownload = true, name = '思维导图') { if (this[type]) { let result = await this[type]() if (isDownload) { - downloadFile(result, '思维导图.' + type) + downloadFile(result, name + '.' + type) } return result } else { diff --git a/simple-mind-map/src/Render.js b/simple-mind-map/src/Render.js index 526e58e1..4dc67703 100644 --- a/simple-mind-map/src/Render.js +++ b/simple-mind-map/src/Render.js @@ -176,13 +176,13 @@ class Render { this.mindMap.execCommand('INSERT_CHILD_NODE') }) // 插入同级节点 - let insertNodeWrap = () => { + this.insertNodeWrap = () => { if (this.textEdit.showTextEdit) { return } this.mindMap.execCommand('INSERT_NODE') } - this.mindMap.keyCommand.addShortcut('Enter', insertNodeWrap) + this.mindMap.keyCommand.addShortcut('Enter', this.insertNodeWrap) // 展开/收起节点 this.mindMap.keyCommand.addShortcut('/', () => { this.activeNodeList.forEach((node) => { @@ -193,18 +193,16 @@ class Render { }) }) // 删除节点 - let removeNodeWrap = () => { + this.removeNodeWrap = () => { this.mindMap.execCommand('REMOVE_NODE') } - this.mindMap.keyCommand.addShortcut('Del|Backspace', removeNodeWrap) + this.mindMap.keyCommand.addShortcut('Del|Backspace', this.removeNodeWrap) // 节点编辑时某些快捷键会存在冲突，需要暂时去除 this.mindMap.on('before_show_text_edit', () => { - this.mindMap.keyCommand.removeShortcut('Del|Backspace') - this.mindMap.keyCommand.removeShortcut('Enter', insertNodeWrap) + this.startTextEdit() }) this.mindMap.on('hide_text_edit', () => { - this.mindMap.keyCommand.addShortcut('Del|Backspace', removeNodeWrap) - this.mindMap.keyCommand.addShortcut('Enter', insertNodeWrap) + this.endTextEdit() }) // 全选 this.mindMap.keyCommand.addShortcut('Control+a', () => { @@ -212,6 +210,28 @@ class Render { }) } + /** + * javascript comment + * @Author: 王林25 + * @Date: 2022-05-09 10:43:52 + * @Desc: 开启文字编辑，会禁用回车键和删除键相关快捷键防止冲突 + */ + startTextEdit() { + this.mindMap.keyCommand.removeShortcut('Del|Backspace') + this.mindMap.keyCommand.removeShortcut('Enter', this.insertNodeWrap) + } + + /** + * javascript comment + * @Author: 王林25 + * @Date: 2022-05-09 10:45:11 + * @Desc: 结束文字编辑，会恢复回车键和删除键相关快捷键 + */ + endTextEdit() { + this.mindMap.keyCommand.addShortcut('Del|Backspace', this.removeNodeWrap) + this.mindMap.keyCommand.addShortcut('Enter', this.insertNodeWrap) + } + /** * javascript comment * @Author: 王林25 diff --git a/web/src/pages/Edit/components/Edit.vue b/web/src/pages/Edit/components/Edit.vue index d355c30d..ca3ff7d2 100644 --- a/web/src/pages/Edit/components/Edit.vue +++ b/web/src/pages/Edit/components/Edit.vue @@ -58,6 +58,12 @@ export default { this.$bus.$on('execCommand', this.execCommand) this.$bus.$on('export', this.export) this.$bus.$on('setData', this.setData) + this.$bus.$on('startTextEdit', () => { + this.mindMap.renderer.startTextEdit(); + }); + this.$bus.$on('endTextEdit', () => { + this.mindMap.renderer.endTextEdit(); + }); if (this.openTest) { setTimeout(() => { this.test() diff --git a/web/src/pages/Edit/components/Export.vue b/web/src/pages/Edit/components/Export.vue index 7a5ddb19..0264fa03 100644 --- a/web/src/pages/Edit/components/Export.vue +++ b/web/src/pages/Edit/components/Export.vue @@ -61,7 +61,7 @@ export default { * @Desc: 确定 */ confirm() { - this.$bus.$emit("export", this.exportType); + this.$bus.$emit("export", this.exportType, true, this.fileName); this.$notify.info({ title: '消息', message: '如果没有触发下载，请检查是否被浏览器拦截了' diff --git a/web/src/pages/Edit/components/NodeHyperlink.vue b/web/src/pages/Edit/components/NodeHyperlink.vue index 66fa6e91..9b7c6be4 100644 --- a/web/src/pages/Edit/components/NodeHyperlink.vue +++ b/web/src/pages/Edit/components/NodeHyperlink.vue @@ -53,6 +53,7 @@ export default { } }); this.$bus.$on("showNodeLink", () => { + this.$bus.$emit('startTextEdit'); this.dialogVisible = true; }); }, @@ -64,6 +65,7 @@ export default { */ cancel() { this.dialogVisible = false; + this.$bus.$emit('endTextEdit'); }, /** diff --git a/web/src/pages/Edit/components/NodeNote.vue b/web/src/pages/Edit/components/NodeNote.vue index 849aec03..a1cb0f0f 100644 --- a/web/src/pages/Edit/components/NodeNote.vue +++ b/web/src/pages/Edit/components/NodeNote.vue @@ -46,6 +46,7 @@ export default { } }); this.$bus.$on("showNodeNote", () => { + this.$bus.$emit('startTextEdit'); this.dialogVisible = true; }); }, @@ -57,6 +58,7 @@ export default { */ cancel() { this.dialogVisible = false; + this.$bus.$emit('endTextEdit'); }, /** diff --git a/web/src/pages/Edit/components/NodeTag.vue b/web/src/pages/Edit/components/NodeTag.vue index 5cfa3d8b..752d3d7c 100644 --- a/web/src/pages/Edit/components/NodeTag.vue +++ b/web/src/pages/Edit/components/NodeTag.vue @@ -67,6 +67,7 @@ export default { } }); this.$bus.$on("showNodeTag", () => { + this.$bus.$emit('startTextEdit'); this.dialogVisible = true; }); }, @@ -97,6 +98,7 @@ export default { */ cancel() { this.dialogVisible = false; + this.$bus.$emit('endTextEdit'); }, /**