From 75742bef2795cfcaf0c594fd507305de77a17377 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=A1=97=E8=A7=92=E5=B0=8F=E6=9E=97?= <1013335014@qq.com> Date: Fri, 14 Feb 2025 09:24:47 +0800 Subject: [PATCH] =?UTF-8?q?Demo=EF=BC=9A=E6=94=AF=E6=8C=81=E8=AE=BE?= =?UTF-8?q?=E7=BD=AE=E5=BC=80=E5=90=AF=E6=8B=96=E5=8A=A8=E7=94=BB=E5=B8=83?= =?UTF-8?q?=E7=9A=84=E5=8A=A8=E9=87=8F=E6=95=88=E6=9E=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/src/lang/en_us.js | 1 + web/src/lang/zh_cn.js | 1 + web/src/lang/zh_tw.js | 1 + web/src/pages/Edit/components/Edit.vue | 105 +++++++++++++++------- web/src/pages/Edit/components/Setting.vue | 20 ++++- web/src/store.js | 8 ++ 6 files changed, 100 insertions(+), 36 deletions(-) diff --git a/web/src/lang/en_us.js b/web/src/lang/en_us.js index 709477cc..fbabd0cf 100644 --- a/web/src/lang/en_us.js +++ b/web/src/lang/en_us.js @@ -61,6 +61,7 @@ export default { 'Enable real-time rendering effect for text editing', isShowScrollbar: 'Is show scrollbar', isUseHandDrawnLikeStyle: 'Is use hand drawn like style', + isUseMomentum: 'Is open drag momentum', watermark: 'Watermark', showWatermark: 'Is show watermark', onlyExport: 'Only export', diff --git a/web/src/lang/zh_cn.js b/web/src/lang/zh_cn.js index b508b0cf..d4b58234 100644 --- a/web/src/lang/zh_cn.js +++ b/web/src/lang/zh_cn.js @@ -59,6 +59,7 @@ export default { openRealtimeRenderOnNodeTextEdit: '开启文本编辑实时渲染效果', isShowScrollbar: '是否显示滚动条', isUseHandDrawnLikeStyle: '是否开启手绘风格', + isUseMomentum: '是否开启拖动画布的动量效果', watermark: '水印', showWatermark: '是否显示水印', watermarkDefaultText: '水印文字', diff --git a/web/src/lang/zh_tw.js b/web/src/lang/zh_tw.js index 645d684e..a22f76d8 100644 --- a/web/src/lang/zh_tw.js +++ b/web/src/lang/zh_tw.js @@ -62,6 +62,7 @@ export default { openRealtimeRenderOnNodeTextEdit: '開啟文本編輯實時渲染效果', isShowScrollbar: '顯示捲軸', isUseHandDrawnLikeStyle: '使用手繪風格', + isUseMomentum: '是否開啓拖動畫布的動量效果', watermark: '浮水印', showWatermark: '顯示浮水印', onlyExport: '僅在匯出時顯示', diff --git a/web/src/pages/Edit/components/Edit.vue b/web/src/pages/Edit/components/Edit.vue index 20d98f4a..0fa32544 100644 --- a/web/src/pages/Edit/components/Edit.vue +++ b/web/src/pages/Edit/components/Edit.vue @@ -84,7 +84,7 @@ import MindMapLayoutPro from 'simple-mind-map/src/plugins/MindMapLayoutPro.js' import Themes from 'simple-mind-map-plugin-themes' // 协同编辑插件 // import Cooperate from 'simple-mind-map/src/plugins/Cooperate.js' -// 以下插件为付费插件，详情请查看开发文档。依次为：手绘风格插件、标记插件、编号插件、Freemind软件格式导入导出插件、Excel软件格式导入导出插件、待办插件、节点连线流动效果插件 +// 以下插件为付费插件，详情请查看开发文档。依次为：手绘风格插件、标记插件、编号插件、Freemind软件格式导入导出插件、Excel软件格式导入导出插件、待办插件、节点连线流动效果插件、动量效果插件 // import HandDrawnLikeStyle from 'simple-mind-map-plugin-handdrawnlikestyle' // import Notation from 'simple-mind-map-plugin-notation' // import Numbers from 'simple-mind-map-plugin-numbers' @@ -92,7 +92,8 @@ import Themes from 'simple-mind-map-plugin-themes' // import Excel from 'simple-mind-map-plugin-excel' // import Checkbox from 'simple-mind-map-plugin-checkbox' // import LineFlow from 'simple-mind-map-plugin-lineflow' -// npm link simple-mind-map-plugin-excel simple-mind-map-plugin-freemind simple-mind-map-plugin-numbers simple-mind-map-plugin-notation simple-mind-map-plugin-handdrawnlikestyle simple-mind-map-plugin-checkbox simple-mind-map simple-mind-map-plugin-themes simple-mind-map-plugin-lineflow +// import Momentum from 'simple-mind-map-plugin-momentum' +// npm link simple-mind-map-plugin-excel simple-mind-map-plugin-freemind simple-mind-map-plugin-numbers simple-mind-map-plugin-notation simple-mind-map-plugin-handdrawnlikestyle simple-mind-map-plugin-checkbox simple-mind-map simple-mind-map-plugin-themes simple-mind-map-plugin-lineflow simple-mind-map-plugin-momentum import OutlineSidebar from './OutlineSidebar' import Style from './Style' import BaseStyle from './BaseStyle' @@ -208,6 +209,7 @@ export default { state.localConfig.useLeftKeySelectionRightKeyDrag, isUseHandDrawnLikeStyle: state => state.localConfig.isUseHandDrawnLikeStyle, + isUseMomentum: state => state.localConfig.isUseMomentum, extraTextOnExport: state => state.extraTextOnExport, isDragOutlineTreeNode: state => state.isDragOutlineTreeNode }) @@ -233,6 +235,13 @@ export default { } else { this.removeHandDrawnLikeStylePlugin() } + }, + isUseMomentum() { + if (this.isUseMomentum) { + this.addMomentumPlugin() + } else { + this.removeMomentumPlugin() + } } }, mounted() { @@ -548,38 +557,7 @@ export default { // return el // } }) - if (this.openNodeRichText) this.addRichTextPlugin() - if (this.isShowScrollbar) this.addScrollbarPlugin() - if (this.isUseHandDrawnLikeStyle) this.addHandDrawnLikeStylePlugin() - if (typeof HandDrawnLikeStyle !== 'undefined') { - this.$store.commit('setSupportHandDrawnLikeStyle', true) - } - if (typeof Notation !== 'undefined') { - this.mindMap.addPlugin(Notation) - this.$store.commit('setSupportMark', true) - } - if (typeof Numbers !== 'undefined') { - this.mindMap.addPlugin(Numbers) - this.$store.commit('setSupportNumbers', true) - } - if (typeof Freemind !== 'undefined') { - this.mindMap.addPlugin(Freemind) - this.$store.commit('setSupportFreemind', true) - Vue.prototype.Freemind = Freemind - } - if (typeof Excel !== 'undefined') { - this.mindMap.addPlugin(Excel) - this.$store.commit('setSupportExcel', true) - Vue.prototype.Excel = Excel - } - if (typeof Checkbox !== 'undefined') { - this.mindMap.addPlugin(Checkbox) - this.$store.commit('setSupportCheckbox', true) - } - if (typeof LineFlow !== 'undefined') { - this.mindMap.addPlugin(LineFlow) - this.$store.commit('setSupportLineFlow', true) - } + this.loadPlugins() this.mindMap.keyCommand.addShortcut('Control+s', () => { this.manualSave() }) @@ -651,6 +629,46 @@ export default { // }, 5000) }, + // 加载相关插件 + loadPlugins() { + if (this.openNodeRichText) this.addRichTextPlugin() + if (this.isShowScrollbar) this.addScrollbarPlugin() + if (typeof HandDrawnLikeStyle !== 'undefined') { + this.$store.commit('setSupportHandDrawnLikeStyle', true) + if (this.isUseHandDrawnLikeStyle) this.addHandDrawnLikeStylePlugin() + } + if (typeof Momentum !== 'undefined') { + this.$store.commit('setSupportMomentum', true) + if (this.isUseMomentum) this.addMomentumPlugin() + } + if (typeof Notation !== 'undefined') { + this.mindMap.addPlugin(Notation) + this.$store.commit('setSupportMark', true) + } + if (typeof Numbers !== 'undefined') { + this.mindMap.addPlugin(Numbers) + this.$store.commit('setSupportNumbers', true) + } + if (typeof Freemind !== 'undefined') { + this.mindMap.addPlugin(Freemind) + this.$store.commit('setSupportFreemind', true) + Vue.prototype.Freemind = Freemind + } + if (typeof Excel !== 'undefined') { + this.mindMap.addPlugin(Excel) + this.$store.commit('setSupportExcel', true) + Vue.prototype.Excel = Excel + } + if (typeof Checkbox !== 'undefined') { + this.mindMap.addPlugin(Checkbox) + this.$store.commit('setSupportCheckbox', true) + } + if (typeof LineFlow !== 'undefined') { + this.mindMap.addPlugin(LineFlow) + this.$store.commit('setSupportLineFlow', true) + } + }, + // url中是否存在要打开的文件 hasFileURL() { const fileURL = this.$route.query.fileURL @@ -766,6 +784,25 @@ export default { } }, + // 加载动量效果插件 + addMomentumPlugin() { + try { + if (!this.mindMap) return + this.mindMap.addPlugin(Momentum) + } catch (error) { + console.log('动量效果插件不存在') + } + }, + + // 移除动量效果插件 + removeMomentumPlugin() { + try { + this.mindMap.removePlugin(Momentum) + } catch (error) { + console.log('动量效果插件不存在') + } + }, + // 测试动态插入节点 testDynamicCreateNodes() { // return diff --git a/web/src/pages/Edit/components/Setting.vue b/web/src/pages/Edit/components/Setting.vue index 4ea85510..be6f0796 100644 --- a/web/src/pages/Edit/components/Setting.vue +++ b/web/src/pages/Edit/components/Setting.vue @@ -1,6 +1,10 @@