diff --git a/README.md b/README.md index 208560d1..a95388aa 100644 --- a/README.md +++ b/README.md @@ -86,7 +86,7 @@ const mindMap = new MindMap({ # License -MIT +[MIT](./LICENSE) # 微信交流群 @@ -96,11 +96,48 @@ MIT # 请作者喝杯咖啡 +开源不易，如果本项目有帮助到你的话，可以考虑请作者喝杯咖啡哟~ + > 厚椰乳一盒 + 纯牛奶半盒 + 冰块 + 咖啡液 = 生椰拿铁 yyds -> 转账请备注哦~你的头像和名称会出现在[文档页面](https://wanglin2.github.io/mind-map/#/doc/zh/introduction/%E8%AF%B7%E4%BD%9C%E8%80%85%E5%96%9D%E6%9D%AF%E5%92%96%E5%95%A1) +> 转账请备注【思维导图】。你的头像和名字将会出现在下面和[文档页面](https://wanglin2.github.io/mind-map/#/doc/zh/introduction/%E8%AF%B7%E4%BD%9C%E8%80%85%E5%96%9D%E6%9D%AF%E5%92%96%E5%95%A1)

+

+ +

+ + + Think + + + + 志斌 + + + + 小土渣的宇宙 + + + + qp + + + + ZXR + + + + 花儿朵朵 + + + + suka + + + + Chris +

\ No newline at end of file diff --git a/index.html b/index.html index 728adb78..1b985c2b 100644 --- a/index.html +++ b/index.html @@ -1 +1 @@ -思绪思维导图
\ No newline at end of file +思绪思维导图
\ No newline at end of file diff --git a/qrcode.jpg b/qrcode.jpg index 03f72210..447274c9 100644 Binary files a/qrcode.jpg and b/qrcode.jpg differ diff --git a/simple-mind-map/index.js b/simple-mind-map/index.js index 8cc6b91c..731edd37 100644 --- a/simple-mind-map/index.js +++ b/simple-mind-map/index.js @@ -32,9 +32,6 @@ class MindMap { this.svg = SVG().addTo(this.el).size(this.width, this.height) this.draw = this.svg.group() - // 节点id - this.uid = 1 - // 初始化主题 this.initTheme() @@ -238,7 +235,7 @@ class MindMap { // 获取思维导图数据，节点树、主题、布局等 getData(withConfig) { - let nodeData = this.command.removeDataUid(this.command.getCopyData()) + let nodeData = this.command.getCopyData() let data = {} if (withConfig) { data = { diff --git a/simple-mind-map/package-lock.json b/simple-mind-map/package-lock.json index 811a8646..29f719ea 100644 --- a/simple-mind-map/package-lock.json +++ b/simple-mind-map/package-lock.json @@ -1,11 +1,11 @@ { "name": "simple-mind-map", - "version": "0.6.0", + "version": "0.6.7", "lockfileVersion": 2, "requires": true, "packages": { "": { - "version": "0.6.0", + "version": "0.6.7", "license": "MIT", "dependencies": { "@svgdotjs/svg.js": "^3.0.16", diff --git a/simple-mind-map/package.json b/simple-mind-map/package.json index 8939adc3..18640db9 100644 --- a/simple-mind-map/package.json +++ b/simple-mind-map/package.json @@ -1,6 +1,6 @@ { "name": "simple-mind-map", - "version": "0.6.6", + "version": "0.6.7", "description": "一个简单的web在线思维导图", "authors": [ { diff --git a/simple-mind-map/src/constants/defaultOptions.js b/simple-mind-map/src/constants/defaultOptions.js index 26abae16..a89f448d 100644 --- a/simple-mind-map/src/constants/defaultOptions.js +++ b/simple-mind-map/src/constants/defaultOptions.js @@ -79,10 +79,6 @@ export const defaultOpt = { }, // 是否只有当鼠标在画布内才响应快捷键事件 enableShortcutOnlyWhenMouseInSvg: true, - // 是否开启节点动画过渡 - enableNodeTransitionMove: true, - // 如果开启节点动画过渡，可以通过该属性设置过渡的时间，单位ms - nodeTransitionMoveDuration: 300, // 初始根节点的位置 initRootNodePosition: null, // 导出png、svg、pdf时的图形内边距 diff --git a/simple-mind-map/src/core/command/Command.js b/simple-mind-map/src/core/command/Command.js index 2a5f3115..d8edde54 100644 --- a/simple-mind-map/src/core/command/Command.js +++ b/simple-mind-map/src/core/command/Command.js @@ -89,7 +89,7 @@ class Command { this.history.shift() } this.activeHistoryIndex = this.history.length - 1 - this.mindMap.emit('data_change', this.removeDataUid(data)) + this.mindMap.emit('data_change', data) this.mindMap.emit( 'back_forward', this.activeHistoryIndex, @@ -110,7 +110,7 @@ class Command { this.history.length ) let data = simpleDeepClone(this.history[this.activeHistoryIndex]) - this.mindMap.emit('data_change', this.removeDataUid(data)) + this.mindMap.emit('data_change', data) return data } } @@ -125,7 +125,7 @@ class Command { this.activeHistoryIndex += step this.mindMap.emit('back_forward', this.activeHistoryIndex, this.history.length) let data = simpleDeepClone(this.history[this.activeHistoryIndex]) - this.mindMap.emit('data_change', this.removeDataUid(data)) + this.mindMap.emit('data_change', data) return data } } diff --git a/simple-mind-map/src/core/render/Render.js b/simple-mind-map/src/core/render/Render.js index 708b689f..0a23119e 100644 --- a/simple-mind-map/src/core/render/Render.js +++ b/simple-mind-map/src/core/render/Render.js @@ -7,7 +7,7 @@ import Timeline from '../../layouts/Timeline' import VerticalTimeline from '../../layouts/VerticalTimeline' import Fishbone from '../../layouts/Fishbone' import TextEdit from './TextEdit' -import { copyNodeTree, simpleDeepClone, walk } from '../../utils' +import { copyNodeTree, simpleDeepClone, walk, bfsWalk } from '../../utils' import { shapeList } from './node/Shape' import { lineStyleProps } from '../../themes/default' import { CONSTANTS } from '../../constants/constant' @@ -195,6 +195,9 @@ class Render { // 设置节点形状 this.setNodeShape = this.setNodeShape.bind(this) this.mindMap.command.add('SET_NODE_SHAPE', this.setNodeShape) + // 定位节点 + this.goTargetNode = this.goTargetNode.bind(this) + this.mindMap.command.add('GO_TARGET_NODE', this.goTargetNode) } // 注册快捷键 @@ -259,7 +262,6 @@ class Render { // 渲染 render(callback = () => {}, source) { - let t = Date.now() // 如果当前还没有渲染完毕，不再触发渲染 if (this.isRendering) { // 等待当前渲染完毕后再进行一次渲染 @@ -290,7 +292,7 @@ class Render { // 更新根节点 this.root = root // 渲染节点 - const onEnd = () => { + this.root.render(() => { this.isRendering = false this.mindMap.emit('node_tree_render_end') callback && callback() @@ -303,18 +305,6 @@ class Render { this.mindMap.command.addHistory() } } - } - let { enableNodeTransitionMove, nodeTransitionMoveDuration } = - this.mindMap.opt - this.root.render(() => { - let dur = Date.now() - t - if (enableNodeTransitionMove && dur <= nodeTransitionMoveDuration) { - setTimeout(() => { - onEnd() - }, nodeTransitionMoveDuration - dur); - } else { - onEnd() - } }) }) this.mindMap.emit('node_active', null, this.activeNodeList) @@ -439,11 +429,14 @@ class Render { first.parent.destroy() } let index = this.getNodeIndex(first) + let isRichText = !!this.mindMap.richText first.parent.nodeData.children.splice(index + 1, 0, { inserting: openEdit, data: { text: text, expand: true, + richText: isRichText, + resetRichText: isRichText, ...(appointData || {}) }, children: [] @@ -468,11 +461,14 @@ class Render { node.nodeData.children = [] } let text = node.isRoot ? defaultInsertSecondLevelNodeText : defaultInsertBelowSecondLevelNodeText + let isRichText = !!this.mindMap.richText node.nodeData.children.push({ inserting: openEdit, data: { text: text, expand: true, + richText: isRichText, + resetRichText: isRichText, ...(appointData || {}) }, children: [] @@ -992,6 +988,19 @@ class Render { }) } + // 定位到指定节点 + goTargetNode(node) { + let uid = typeof node === 'string' ? node : node.nodeData.data.uid + if (!uid) return + this.expandToNodeUid(uid, () => { + let targetNode = this.findNodeByUid(uid) + if (targetNode) { + targetNode.active() + this.moveNodeToCenter(targetNode) + } + }) + } + // 更新节点数据 setNodeData(node, data) { Object.keys(data).forEach(key => { @@ -1028,6 +1037,44 @@ class Render { this.mindMap.view.translateY(offsetY) this.mindMap.view.setScale(1) } + + // 展开到指定uid的节点 + expandToNodeUid(uid, callback = () => {}) { + let parentsList = [] + const cache = {} + bfsWalk(this.renderTree, (node, parent) => { + if (node.data.uid === uid) { + parentsList = parent ? [...cache[parent.data.uid], parent] : [] + return 'stop' + } else { + cache[node.data.uid] = parent ? [...cache[parent.data.uid], parent]: [] + } + }) + let needRender = false + parentsList.forEach((node) => { + if (!node.data.expand) { + needRender = true + node.data.expand = true + } + }) + if (needRender) { + this.mindMap.render(callback) + } else { + callback() + } + } + + // 根据uid找到对应的节点实例 + findNodeByUid(uid) { + let res = null + walk(this.root, null, (node) => { + if (node.nodeData.data.uid === uid) { + res = node + return true + } + }) + return res + } } export default Render diff --git a/simple-mind-map/src/core/render/node/Node.js b/simple-mind-map/src/core/render/node/Node.js index e0f36761..4dd66d84 100644 --- a/simple-mind-map/src/core/render/node/Node.js +++ b/simple-mind-map/src/core/render/node/Node.js @@ -365,8 +365,8 @@ class Node { this._unVisibleRectRegionNode.fill({ color: 'transparent' }) - this.group.add(this._unVisibleRectRegionNode) } + this.group.add(this._unVisibleRectRegionNode) this.renderer.layout.renderExpandBtnRect(this._unVisibleRectRegionNode, this.expandBtnSize, width, height, this) } } @@ -476,8 +476,6 @@ class Node { return } let { - enableNodeTransitionMove, - nodeTransitionMoveDuration, alwaysShowExpandBtn } = this.mindMap.opt if (alwaysShowExpandBtn) { @@ -503,13 +501,7 @@ class Node { let t = this.group.transform() // 如果节点位置没有变化，则返回 if (this.left === t.translateX && this.top === t.translateY) return - if (!isLayout && enableNodeTransitionMove) { - this.group - .animate(nodeTransitionMoveDuration) - .translate(this.left - t.translateX, this.top - t.translateY) - } else { - this.group.translate(this.left - t.translateX, this.top - t.translateY) - } + this.group.translate(this.left - t.translateX, this.top - t.translateY) } // 重新渲染节点，即重新创建节点内容、计算节点大小、计算节点内容布局、更新展开收起按钮，概要及位置 @@ -531,8 +523,6 @@ class Node { // 递归渲染 render(callback = () => {}) { - let { enableNodeTransitionMove, nodeTransitionMoveDuration } = - this.mindMap.opt // 节点 // 重新渲染连线 this.renderLine() @@ -580,13 +570,7 @@ class Node { }) ) } else { - if (enableNodeTransitionMove && !isLayout) { - setTimeout(() => { - callback() - }, nodeTransitionMoveDuration) - } else { - callback() - } + callback() } // 手动插入的节点立即获得焦点并且开启编辑模式 if (this.nodeData.inserting) { diff --git a/simple-mind-map/src/core/render/node/nodeGeneralization.js b/simple-mind-map/src/core/render/node/nodeGeneralization.js index 2a2a585d..ba204186 100644 --- a/simple-mind-map/src/core/render/node/nodeGeneralization.js +++ b/simple-mind-map/src/core/render/node/nodeGeneralization.js @@ -1,4 +1,5 @@ import Node from './Node' +import { createUid } from '../../../utils/index' // 检查是否存在概要 function checkHasGeneralization () { @@ -18,7 +19,7 @@ function createGeneralizationNode () { data: { data: this.nodeData.data.generalization }, - uid: this.mindMap.uid++, + uid: createUid(), renderer: this.renderer, mindMap: this.mindMap, draw: this.draw, diff --git a/simple-mind-map/src/layouts/Base.js b/simple-mind-map/src/layouts/Base.js index ca27fcd4..f3876262 100644 --- a/simple-mind-map/src/layouts/Base.js +++ b/simple-mind-map/src/layouts/Base.js @@ -1,6 +1,7 @@ import Node from '../core/render/node/Node' import { CONSTANTS, initRootNodePositionMap } from '../constants/constant' import Lru from '../utils/Lru' +import { createUid } from '../utils/index' // 布局基类 class Base { @@ -101,7 +102,7 @@ class Base { } } else { // 创建新节点 - let uid = this.mindMap.uid++ + let uid = data.data.uid || createUid() newNode = new Node({ data, uid, diff --git a/simple-mind-map/src/plugins/KeyboardNavigation.js b/simple-mind-map/src/plugins/KeyboardNavigation.js index cdbf95f2..0a3f6098 100644 --- a/simple-mind-map/src/plugins/KeyboardNavigation.js +++ b/simple-mind-map/src/plugins/KeyboardNavigation.js @@ -28,8 +28,7 @@ class KeyboardNavigation { this.focus(dir) } else { let root = this.mindMap.renderer.root - this.mindMap.renderer.moveNodeToCenter(root) - root.active() + this.mindMap.execCommand('GO_TARGET_NODE', root) } } @@ -81,8 +80,7 @@ class KeyboardNavigation { // 找到了则让目标节点聚焦 if (targetNode) { - this.mindMap.renderer.moveNodeToCenter(targetNode) - targetNode.active() + this.mindMap.execCommand('GO_TARGET_NODE', targetNode) } } diff --git a/simple-mind-map/src/plugins/NodeImgAdjust.js b/simple-mind-map/src/plugins/NodeImgAdjust.js index 5a6ab838..a9b9d947 100644 --- a/simple-mind-map/src/plugins/NodeImgAdjust.js +++ b/simple-mind-map/src/plugins/NodeImgAdjust.js @@ -47,7 +47,7 @@ class NodeImgAdjust { // 节点图片鼠标移动事件 onNodeImgMousemove(node, img) { // 如果当前正在拖动调整中那么直接返回 - if (this.isMousedown || this.isAdjusted) return + if (this.isMousedown || this.isAdjusted || this.mindMap.opt.readonly) return // 如果在当前节点内移动，以及自定义元素已经是显示状态，那么直接返回 if (this.node === node && this.isShowHandleEl) return // 更新当前节点信息 diff --git a/simple-mind-map/src/utils/index.js b/simple-mind-map/src/utils/index.js index f84f7fd2..462b1913 100644 --- a/simple-mind-map/src/utils/index.js +++ b/simple-mind-map/src/utils/index.js @@ -1,3 +1,5 @@ +import { v4 as uuidv4 } from 'uuid' + // 深度优先遍历树 export const walk = ( root, @@ -31,9 +33,11 @@ export const walk = ( // 广度优先遍历树 export const bfsWalk = (root, callback) => { - callback(root) let stack = [root] let isStop = false + if (callback(root, null) === 'stop') { + isStop = true + } while (stack.length) { if (isStop) { break @@ -41,8 +45,9 @@ export const bfsWalk = (root, callback) => { let cur = stack.shift() if (cur.children && cur.children.length) { cur.children.forEach(item => { + if (isStop) return stack.push(item) - if (callback(item) === 'stop') { + if (callback(item, cur) === 'stop') { isStop = true } }) @@ -424,3 +429,8 @@ export const getImageSize = src => { } }) } + +// 创建节点唯一的id +export const createUid = () => { + return uuidv4() +} \ No newline at end of file diff --git a/web/public/index.html b/web/public/index.html index a5e6d6ba..4a1e5342 100644 --- a/web/public/index.html +++ b/web/public/index.html @@ -4,7 +4,7 @@ - + 思绪思维导图 diff --git a/web/public/logo.ico b/web/public/logo.ico new file mode 100644 index 00000000..d25c11d6 Binary files /dev/null and b/web/public/logo.ico differ diff --git a/web/src/assets/avatar/Chris.jpg b/web/src/assets/avatar/Chris.jpg new file mode 100644 index 00000000..c06638b5 Binary files /dev/null and b/web/src/assets/avatar/Chris.jpg differ diff --git a/web/src/assets/avatar/default.png b/web/src/assets/avatar/default.png new file mode 100644 index 00000000..f96d6b11 Binary files /dev/null and b/web/src/assets/avatar/default.png differ diff --git a/web/src/assets/avatar/suka.jpg b/web/src/assets/avatar/suka.jpg new file mode 100644 index 00000000..d0b22b2a Binary files /dev/null and b/web/src/assets/avatar/suka.jpg differ diff --git a/web/src/assets/avatar/花儿朵朵.jpg b/web/src/assets/avatar/花儿朵朵.jpg new file mode 100644 index 00000000..f5ec6027 Binary files /dev/null and b/web/src/assets/avatar/花儿朵朵.jpg differ diff --git a/web/src/assets/icon-font/iconfont.css b/web/src/assets/icon-font/iconfont.css index ef21a0db..d216721f 100644 --- a/web/src/assets/icon-font/iconfont.css +++ b/web/src/assets/icon-font/iconfont.css @@ -1,8 +1,8 @@ @font-face { font-family: "iconfont"; /* Project id 2479351 */ - src: url('iconfont.woff2?t=1688536767282') format('woff2'), - url('iconfont.woff?t=1688536767282') format('woff'), - url('iconfont.ttf?t=1688536767282') format('truetype'); + src: url('iconfont.woff2?t=1689407546912') format('woff2'), + url('iconfont.woff?t=1689407546912') format('woff'), + url('iconfont.ttf?t=1689407546912') format('truetype'); } .iconfont { @@ -13,6 +13,54 @@ -moz-osx-font-smoothing: grayscale; } +.iconjiantouyou:before { + content: "\e62d"; +} + +.iconbianji1:before { + content: "\e60a"; +} + +.icondaohang1:before { + content: "\e632"; +} + +.iconyanjing:before { + content: "\e8bf"; +} + +.iconwangzhan:before { + content: "\e628"; +} + +.iconcsdn:before { + content: "\e608"; +} + +.iconshejiaotubiao-10:before { + content: "\e644"; +} + +.iconstar:before { + content: "\e7df"; +} + +.iconfork:before { + content: "\e641"; +} + +.iconxiazai:before { + content: "\e613"; +} + +.iconteamwork:before { + content: "\e870"; +} + +.iconshuiyin:before { + content: "\e67a"; +} + .iconxmind:before { content: "\ea57"; } diff --git a/web/src/assets/icon-font/iconfont.ttf b/web/src/assets/icon-font/iconfont.ttf index 94b5e1f2..9c801c08 100644 Binary files a/web/src/assets/icon-font/iconfont.ttf and b/web/src/assets/icon-font/iconfont.ttf differ diff --git a/web/src/assets/icon-font/iconfont.woff b/web/src/assets/icon-font/iconfont.woff index 3fe37a1d..4d446856 100644 Binary files a/web/src/assets/icon-font/iconfont.woff and b/web/src/assets/icon-font/iconfont.woff differ diff --git a/web/src/assets/icon-font/iconfont.woff2 b/web/src/assets/icon-font/iconfont.woff2 index 751735e0..1d170d95 100644 Binary files a/web/src/assets/icon-font/iconfont.woff2 and b/web/src/assets/icon-font/iconfont.woff2 differ diff --git a/web/src/assets/img/block1.png b/web/src/assets/img/block1.png new file mode 100644 index 00000000..f1b6326b Binary files /dev/null and b/web/src/assets/img/block1.png differ diff --git a/web/src/assets/img/block3.png b/web/src/assets/img/block3.png new file mode 100644 index 00000000..68d38820 Binary files /dev/null and b/web/src/assets/img/block3.png differ diff --git a/web/src/assets/img/block4.png b/web/src/assets/img/block4.png new file mode 100644 index 00000000..5f2ff2d0 Binary files /dev/null and b/web/src/assets/img/block4.png differ diff --git a/web/src/assets/img/logo2.png b/web/src/assets/img/logo2.png new file mode 100644 index 00000000..2c6d7831 Binary files /dev/null and b/web/src/assets/img/logo2.png differ diff --git a/web/src/assets/img/split.png b/web/src/assets/img/split.png new file mode 100644 index 00000000..55bc2efc Binary files /dev/null and b/web/src/assets/img/split.png differ diff --git a/web/src/lang/en_us.js b/web/src/lang/en_us.js index c4050794..235ebd1d 100644 --- a/web/src/lang/en_us.js +++ b/web/src/lang/en_us.js @@ -114,8 +114,9 @@ export default { }, navigatorToolbar: { openMiniMap: 'Open mini map', - readonly: 'Readonly', - edit: 'Edit' + closeMiniMap: 'Close mini map', + readonly: 'Change to eadonly', + edit: 'Change to edit' }, nodeHyperlink: { title: 'Link', diff --git a/web/src/lang/zh_cn.js b/web/src/lang/zh_cn.js index d99a06e3..c050b0f4 100644 --- a/web/src/lang/zh_cn.js +++ b/web/src/lang/zh_cn.js @@ -114,8 +114,9 @@ export default { }, navigatorToolbar: { openMiniMap: '开启小地图', - readonly: '只读模式', - edit: '编辑模式' + closeMiniMap: '关闭小地图', + readonly: '切换为只读模式', + edit: '切换为编辑模式' }, nodeHyperlink: { title: '超链接', diff --git a/web/src/pages/Doc/Index.vue b/web/src/pages/Doc/Index.vue index d1307e18..22f74314 100644 --- a/web/src/pages/Doc/Index.vue +++ b/web/src/pages/Doc/Index.vue @@ -15,7 +15,8 @@ import Header from './components/Header.vue' import Sidebar from './components/Sidebar.vue' import CatalogBar from './components/CatalogBar.vue' -import 'highlight.js/styles/atom-one-dark.css' +// import 'highlight.js/styles/atom-one-dark.css' +import 'highlight.js/styles/github.css' export default { components: { @@ -103,7 +104,7 @@ export default { a { font-weight: 500; text-decoration: none; - color: #42b883; + color: #1ea59a; transition: color 0.25s; &:hover { diff --git a/web/src/pages/Doc/components/CatalogBar.vue b/web/src/pages/Doc/components/CatalogBar.vue index 79476a90..9399ef6a 100644 --- a/web/src/pages/Doc/components/CatalogBar.vue +++ b/web/src/pages/Doc/components/CatalogBar.vue @@ -225,7 +225,7 @@ export default { left: -10px; width: 4px; height: 20px; - background-color: #42b883; + background-color: #1ea59a; border-radius: 4px; transition: top 0.25s cubic-bezier(0, 1, 0.5, 1), opacity 0.25s, background-color 0.5s; diff --git a/web/src/pages/Doc/components/Header.vue b/web/src/pages/Doc/components/Header.vue index 752d2acf..59bb265d 100644 --- a/web/src/pages/Doc/components/Header.vue +++ b/web/src/pages/Doc/components/Header.vue @@ -1,8 +1,8 @@ diff --git a/web/src/pages/Doc/zh/changelog/index.md b/web/src/pages/Doc/zh/changelog/index.md index 1318fbf1..72584967 100644 --- a/web/src/pages/Doc/zh/changelog/index.md +++ b/web/src/pages/Doc/zh/changelog/index.md @@ -1,5 +1,15 @@ # Changelog +## 0.6.7 + +修复：1.修复节点收起再展开后展开收起按钮占位元素丢失的问题。 2.修复只读模式下可以缩放图片的问题。 + +新增：1.支持根据节点实例或节点uid定位到某个节点。 2.修改节点uid的创建方式，导出数据添加节点的uid。 + +移除：1.移除节点过渡效果。 + +Demo：1.添加网站首页。 2.修复大纲里创建新节点时节点样式丢失的问题。 3.修复大纲里编辑节点后按回车或Tab键后编辑文本丢失的问题。 4.优化大纲的节点定位，被收起的节点会自动展开。 5.侧边栏按钮支持收起。 6.优化小屏适配。 + ## 0.6.6 新增：1.支持导出为Xmind新版文件。2.导入Xmind新版文件支持导入节点中的图片。 3.新增竖向时间轴结构。 diff --git a/web/src/pages/Doc/zh/changelog/index.vue b/web/src/pages/Doc/zh/changelog/index.vue index 3e43e1d5..071e4cab 100644 --- a/web/src/pages/Doc/zh/changelog/index.vue +++ b/web/src/pages/Doc/zh/changelog/index.vue @@ -1,6 +1,11 @@ diff --git a/web/src/pages/Doc/zh/render/index.md b/web/src/pages/Doc/zh/render/index.md index 174ad065..80d3ec48 100644 --- a/web/src/pages/Doc/zh/render/index.md +++ b/web/src/pages/Doc/zh/render/index.md @@ -82,4 +82,22 @@ 移动节点到画布中心。 -目前如果是存在缩放的情况下回到中心会重置缩放。 \ No newline at end of file +目前如果是存在缩放的情况下回到中心会重置缩放。 + +### expandToNodeUid(uid, callback) + +> v0.6.7+ + +- `uid`：节点uid + +- `callback`：展开完成的回调函数 + +展开到指定uid的节点。 + +### findNodeByUid(uid) + +> v0.6.7+ + +- `uid`：节点uid + +根据uid找到对应的节点实例。 \ No newline at end of file diff --git a/web/src/pages/Doc/zh/render/index.vue b/web/src/pages/Doc/zh/render/index.vue index b8d54bce..6f6f9255 100644 --- a/web/src/pages/Doc/zh/render/index.vue +++ b/web/src/pages/Doc/zh/render/index.vue @@ -51,6 +51,27 @@

移动节点到画布中心。

目前如果是存在缩放的情况下回到中心会重置缩放。

+

expandToNodeUid(uid, callback)

+
+

v0.6.7+

+
+ +

展开到指定uid的节点。

+

findNodeByUid(uid)

+
+

v0.6.7+

+
+ +

根据uid找到对应的节点实例。

diff --git a/web/src/pages/Edit/components/Count.vue b/web/src/pages/Edit/components/Count.vue index 26bdf34a..6607f08b 100644 --- a/web/src/pages/Edit/components/Count.vue +++ b/web/src/pages/Edit/components/Count.vue @@ -95,4 +95,10 @@ export default { } } } + +@media screen and (max-width: 635px) { + .countContainer { + display: none; + } +} diff --git a/web/src/pages/Edit/components/MouseAction.vue b/web/src/pages/Edit/components/MouseAction.vue index f8e1012c..34ffb5ba 100644 --- a/web/src/pages/Edit/components/MouseAction.vue +++ b/web/src/pages/Edit/components/MouseAction.vue @@ -74,6 +74,7 @@ export default { .btn { cursor: pointer; + font-size: 18px; } } diff --git a/web/src/pages/Edit/components/NavigatorToolbar.vue b/web/src/pages/Edit/components/NavigatorToolbar.vue index 8157202f..6fa0481c 100644 --- a/web/src/pages/Edit/components/NavigatorToolbar.vue +++ b/web/src/pages/Edit/components/NavigatorToolbar.vue @@ -19,25 +19,51 @@
- {{ - $t('navigatorToolbar.openMiniMap') - }} + +
+
- - -
-
- + --> + +
+
+
+ +
@@ -77,16 +103,15 @@ export default { openMiniMap: false } }, - mounted() { - this.toggleMiniMap(this.openMiniMap) - }, methods: { - readonlyChange(value) { - this.mindMap.setMode(value ? 'readonly' : 'edit') + readonlyChange() { + this.isReadonly = !this.isReadonly + this.mindMap.setMode(this.isReadonly ? 'readonly' : 'edit') }, - toggleMiniMap(show) { - this.$bus.$emit('toggle_mini_map', show) + toggleMiniMap() { + this.openMiniMap = !this.openMiniMap + this.$bus.$emit('toggle_mini_map', this.openMiniMap) }, onLangChange(lang) { @@ -126,6 +151,18 @@ export default { color: #303133; text-decoration: none; } + + .btn { + cursor: pointer; + font-size: 18px; + } + } +} + +@media screen and (max-width: 502px) { + .navigatorContainer { + left: 20px; + overflow-x: auto; } } diff --git a/web/src/pages/Edit/components/Outline.vue b/web/src/pages/Edit/components/Outline.vue index 158371e7..e5cd2e84 100644 --- a/web/src/pages/Edit/components/Outline.vue +++ b/web/src/pages/Edit/components/Outline.vue @@ -46,11 +46,10 @@ export default { data: [], defaultProps: { label(data) { - return data.data.text.replaceAll(/\n/g, '
') + return data.data.richText ? data.data.text : data.data.text.replaceAll(/\n/g, '
') } }, - notHandleDataChange: false, - isCreateNode: false + notHandleDataChange: false } }, computed: { @@ -77,11 +76,12 @@ export default { }, methods: { onBlur(e, node) { - if (this.isCreateNode) { - this.isCreateNode = false - return + const richText = node.data.data.richText + if (richText) { + node.data._node.setText(e.target.innerHTML, true) + } else { + node.data._node.setText(e.target.innerText) } - node.data._node.setText(e.target.innerText) }, getKey() { @@ -102,24 +102,21 @@ export default { // 插入兄弟节点 insertNode() { this.notHandleDataChange = false - this.isCreateNode = true this.mindMap.execCommand('INSERT_NODE', false) }, // 插入下级节点 insertChildNode() { this.notHandleDataChange = false - this.isCreateNode = true this.mindMap.execCommand('INSERT_CHILD_NODE', false) }, // 激活当前节点且移动当前节点到画布中间 - onClick(e, data) { + onClick(e, node) { this.notHandleDataChange = true - let node = data.data._node - if (node.nodeData.data.isActive) return - node.mindMap.renderer.moveNodeToCenter(node) - node.active() + let targetNode = node.data._node + if (targetNode && targetNode.nodeData.data.isActive) return + this.mindMap.execCommand('GO_TARGET_NODE', node.data.data.uid) }, } } diff --git a/web/src/pages/Edit/components/SidebarTrigger.vue b/web/src/pages/Edit/components/SidebarTrigger.vue index e2676f73..fcc82a92 100644 --- a/web/src/pages/Edit/components/SidebarTrigger.vue +++ b/web/src/pages/Edit/components/SidebarTrigger.vue @@ -2,8 +2,11 @@
+
+ +
.sidebarTriggerContainer { position: fixed; - right: 0px; + right: -60px; margin-top: 110px; transition: all 0.3s; top: 50%; transform: translateY(-50%); &.show { + right: 0; + } + + &.hasActive { right: 305px; } + .toggleShowBtn { + position: absolute; + left: -6px; + width: 35px; + height: 60px; + background: #409eff; + top: 50%; + transform: translateY(-50%); + cursor: pointer; + transition: left .1s linear; + z-index: 0; + border-top-left-radius: 10px; + border-bottom-left-radius: 10px; + display: flex; + align-items: center; + padding-left: 4px; + + &.hide { + left: -8px; + + span { + transform: rotateZ(180deg); + } + } + + &:hover { + left: -18px; + } + + span { + color: #fff; + transition: all 0.1s; + } + } + .trigger { + position: relative; width: 60px; border-color: #eee; background-color: #fff; diff --git a/web/src/pages/Edit/components/Toolbar.vue b/web/src/pages/Edit/components/Toolbar.vue index d38f4322..8b6f3ee7 100644 --- a/web/src/pages/Edit/components/Toolbar.vue +++ b/web/src/pages/Edit/components/Toolbar.vue @@ -520,4 +520,17 @@ export default { } } } + +@media screen and (max-width: 1040px) { + + .toolbarContainer { + .toolbar { + left: 20px; + right: 20px; + transform: translateX(0); + width: auto; + max-width: none; + } + } +} diff --git a/web/src/pages/Index/Index.vue b/web/src/pages/Index/Index.vue new file mode 100644 index 00000000..f26fc356 --- /dev/null +++ b/web/src/pages/Index/Index.vue @@ -0,0 +1,41 @@ + + + + + diff --git a/web/src/pages/Index/components/Block1.vue b/web/src/pages/Index/components/Block1.vue new file mode 100644 index 00000000..65065c38 --- /dev/null +++ b/web/src/pages/Index/components/Block1.vue @@ -0,0 +1,206 @@ + + + + + diff --git a/web/src/pages/Index/components/Block2.vue b/web/src/pages/Index/components/Block2.vue new file mode 100644 index 00000000..25f19690 --- /dev/null +++ b/web/src/pages/Index/components/Block2.vue @@ -0,0 +1,263 @@ + + + + + diff --git a/web/src/pages/Index/components/Block3.vue b/web/src/pages/Index/components/Block3.vue new file mode 100644 index 00000000..06d8a451 --- /dev/null +++ b/web/src/pages/Index/components/Block3.vue @@ -0,0 +1,102 @@ + + + + + diff --git a/web/src/pages/Index/components/Block4.vue b/web/src/pages/Index/components/Block4.vue new file mode 100644 index 00000000..aa78e1c7 --- /dev/null +++ b/web/src/pages/Index/components/Block4.vue @@ -0,0 +1,140 @@ + + + + + diff --git a/web/src/pages/Index/components/Block5.vue b/web/src/pages/Index/components/Block5.vue new file mode 100644 index 00000000..90120d62 --- /dev/null +++ b/web/src/pages/Index/components/Block5.vue @@ -0,0 +1,229 @@ + + + + + diff --git a/web/src/pages/Index/components/Header.vue b/web/src/pages/Index/components/Header.vue new file mode 100644 index 00000000..a778b750 --- /dev/null +++ b/web/src/pages/Index/components/Header.vue @@ -0,0 +1,167 @@ + + + + + diff --git a/web/src/pages/Index/components/Split.vue b/web/src/pages/Index/components/Split.vue new file mode 100644 index 00000000..6ce174c3 --- /dev/null +++ b/web/src/pages/Index/components/Split.vue @@ -0,0 +1,16 @@ + + + + + diff --git a/web/src/pages/Workbenche/components/AboutDialog.vue b/web/src/pages/Workbenche/components/AboutDialog.vue index ef214b5f..3e41fdc8 100644 --- a/web/src/pages/Workbenche/components/AboutDialog.vue +++ b/web/src/pages/Workbenche/components/AboutDialog.vue @@ -10,12 +10,17 @@

思绪思维导图

版本：{{ version }}

+

+ 官网： + 思绪思维导图 +

获取源码： mind-map

下载最新版本： + 百度云 releases

@@ -55,14 +60,20 @@ export default { open(type) { let url = '' switch (type) { + case 'homepage': + url = 'https://wanglin2.github.io/mind-map/#/index' + break case 'mind-map': url = 'https://github.com/wanglin2/mind-map/tree/electron' - break; + break + case 'baiduNet': + url = 'https://pan.baidu.com/s/1huasEbKsGNH2Af68dvWiOg?pwd=3bp3' + break case 'releases': url = 'https://github.com/wanglin2/mind-map/releases' break default: - break; + break } window.electronAPI.openUrl(url) } @@ -72,9 +83,9 @@ export default { diff --git a/web/src/pages/Workbenche/components/SponsorDialog.vue b/web/src/pages/Workbenche/components/SponsorDialog.vue new file mode 100644 index 00000000..f301dd54 --- /dev/null +++ b/web/src/pages/Workbenche/components/SponsorDialog.vue @@ -0,0 +1,101 @@ + + + + + + \ No newline at end of file diff --git a/web/src/pages/Workbenche/views/Edit.vue b/web/src/pages/Workbenche/views/Edit.vue index e5b7644d..e566b3b2 100644 --- a/web/src/pages/Workbenche/views/Edit.vue +++ b/web/src/pages/Workbenche/views/Edit.vue @@ -121,6 +121,7 @@ export default { width: 10px; height: 10px; margin-left: 10px; + flex-shrink: 0; .modifyDot { width: 100%; diff --git a/web/src/pages/Workbenche/views/Home.vue b/web/src/pages/Workbenche/views/Home.vue index 87413a9c..c6875691 100644 --- a/web/src/pages/Workbenche/views/Home.vue +++ b/web/src/pages/Workbenche/views/Home.vue @@ -14,6 +14,9 @@ 关于软件 + 友情赞助 + 使用帮助 + 开发文档
@@ -23,6 +26,7 @@
+ @@ -32,6 +36,7 @@ import MacControl from '../components/MacControl.vue' import Sidebar from '../components/Sidebar.vue' import FileList from '../components/FileList.vue' import AboutDialog from '../components/AboutDialog.vue' +import SponsorDialog from '../components/SponsorDialog.vue' export default { components: { @@ -39,11 +44,13 @@ export default { MacControl, Sidebar, FileList, - AboutDialog + AboutDialog, + SponsorDialog }, data() { return { - showAboutDialog: false + showAboutDialog: false, + showSponsorDialog: false } }, methods: { @@ -52,6 +59,15 @@ export default { case 'about': this.showAboutDialog = true break + case 'sponsor': + this.showSponsorDialog = true + break + case 'help': + window.electronAPI.openUrl('https://wanglin2.github.io/mind-map/#/help/') + break + case 'doc': + window.electronAPI.openUrl('https://wanglin2.github.io/mind-map/#/doc/zh/') + break default: break } diff --git a/web/src/router.js b/web/src/router.js index 2ac1d08f..93054823 100644 --- a/web/src/router.js +++ b/web/src/router.js @@ -6,6 +6,7 @@ import routerList from '@/pages/Doc/routerList' import WorkbenchePage from '@/pages/Workbenche/Index' import WorkbencheHomePage from '@/pages/Workbenche/views/Home' import WorkbencheEditPage from '@/pages/Workbenche/views/Edit' +import IndexPage from '@/pages/Index/Index' // 处理没有翻译的章节路由 const handleRouterList = () => { @@ -52,6 +53,16 @@ const routes = [ } ] }, + { + path: '/index', + name: 'Index', + component: IndexPage + }, + { + path: '/', + name: 'Edit', + component: EditPage + }, ...routerList.map((item) => { return { path: `/doc/${item.lang}/`,