update

wanglin2 · Mar 8, 2024 · f59f45d · f59f45d
2 parents 59eab15 + 3e59fa6
commit f59f45d
Show file tree

Hide file tree

Showing 119 changed files with 1,505 additions and 225 deletions.
diff --git a/README.md b/README.md
@@ -94,6 +94,12 @@ const mindMap = new MindMap({
 
 群聊人数较多，无法通过二维码入群，可以微信添加`wanglinguanfang`拉你入群。
 
+# star
+
+如果喜欢本项目，欢迎点个star，这对我们很重要。
+
+[![Star History Chart](https://api.star-history.com/svg?repos=wanglin2/mind-map&type=Date)](https://star-history.com/#wanglin2/mind-map&Date)
+
 # 请作者喝杯咖啡
 
 开源不易，如果本项目有帮助到你的话，可以考虑请作者喝杯咖啡~
@@ -272,4 +278,24 @@ const mindMap = new MindMap({
         <img src="./web/src/assets/avatar/慕智打印-兰兰.jpg" style="width: 50px;height: 50px;" />
         <span>慕智打印-兰兰</span>
     </span>
+    <span>
+        <img src="./web/src/assets/avatar/default.png" style="width: 50px;height: 50px;" />
+        <span>锦冰</span>
+    </span>
+    <span>
+        <img src="./web/src/assets/avatar/旭东.png" style="width: 50px;height: 50px;" />
+        <span>旭东</span>
+    </span>
+    <span>
+        <img src="./web/src/assets/avatar/俊奇.jpg" style="width: 50px;height: 50px;" />
+        <span>俊奇</span>
+    </span>
+    <span>
+        <img src="./web/src/assets/avatar/橘半.jpg" style="width: 50px;height: 50px;" />
+        <span>橘半</span>
+    </span>
+    <span>
+        <img src="./web/src/assets/avatar/pluvet.jpg" style="width: 50px;height: 50px;" />
+        <span>pluvet</span>
+    </span>
 </p>
diff --git a/copy.js b/copy.js
@@ -13,3 +13,4 @@ if (fs.existsSync(src)) {
     fs.unlinkSync(src)
 }
 
+console.warn('请检查手绘风格选项是否开启！！！')
diff --git a/dist/css/app.css b/dist/css/app.css
diff --git a/dist/css/chunk-2c94741a.css → dist/css/chunk-17089aa8.css b/dist/css/chunk-2c94741a.css → dist/css/chunk-17089aa8.css
diff --git a/dist/fonts/iconfont.ttf b/dist/fonts/iconfont.ttf
diff --git a/dist/fonts/iconfont.woff b/dist/fonts/iconfont.woff
diff --git a/dist/fonts/iconfont.woff2 b/dist/fonts/iconfont.woff2
diff --git a/dist/img/pluvet.jpg b/dist/img/pluvet.jpg
diff --git a/dist/img/俊奇.jpg b/dist/img/俊奇.jpg
diff --git a/dist/img/橘半.jpg b/dist/img/橘半.jpg
diff --git a/dist/js/app.js b/dist/js/app.js
diff --git a/dist/js/chunk-02258ed0.js b/dist/js/chunk-02258ed0.js
diff --git a/dist/js/chunk-2c94741a.js → dist/js/chunk-17089aa8.js b/dist/js/chunk-2c94741a.js → dist/js/chunk-17089aa8.js
diff --git a/dist/js/chunk-2bf818d4.js b/dist/js/chunk-2bf818d4.js
diff --git a/dist/js/chunk-2d0aa978.js b/dist/js/chunk-2d0aa978.js
diff --git a/dist/js/chunk-2d0c09f6.js b/dist/js/chunk-2d0c09f6.js
diff --git a/dist/js/chunk-2d0c0a44.js b/dist/js/chunk-2d0c0a44.js
diff --git a/dist/js/chunk-2d0d9fbc.js b/dist/js/chunk-2d0d9fbc.js
diff --git a/dist/js/chunk-2d0dad5f.js b/dist/js/chunk-2d0dad5f.js
diff --git a/dist/js/chunk-2d0f026c.js b/dist/js/chunk-2d0f026c.js
diff --git a/dist/js/chunk-2d0f0784.js b/dist/js/chunk-2d0f0784.js
diff --git a/dist/js/chunk-2d208ffa.js b/dist/js/chunk-2d208ffa.js
diff --git a/dist/js/chunk-2d216004.js b/dist/js/chunk-2d216004.js
diff --git a/dist/js/chunk-2d216f87.js b/dist/js/chunk-2d216f87.js
diff --git a/dist/js/chunk-2d217907.js b/dist/js/chunk-2d217907.js
diff --git a/dist/js/chunk-554d686c.js b/dist/js/chunk-554d686c.js
diff --git a/dist/js/chunk-792bedf8.js b/dist/js/chunk-792bedf8.js
diff --git a/index.html b/index.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1"><link rel="icon" href="dist/logo.ico"><title>思绪思维导图</title><script>// 自定义静态资源的路径
       window.externalPublicPath = './dist/'
       // 接管应用
-      window.takeOverApp = false</script><link href="dist/css/chunk-vendors.css?c19e442932d6fe6a3e37" rel="stylesheet"><link href="dist/css/app.css?c19e442932d6fe6a3e37" rel="stylesheet"></head><body><noscript><strong>We're sorry but thoughts doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script>const getDataFromBackend = () => {
+      window.takeOverApp = false</script><link href="dist/css/chunk-vendors.css?97072371e55f8bd6a3b4" rel="stylesheet"><link href="dist/css/app.css?97072371e55f8bd6a3b4" rel="stylesheet"></head><body><noscript><strong>We're sorry but thoughts doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script>const getDataFromBackend = () => {
         return new Promise((resolve, reject) => {
           setTimeout(() => {
             resolve({
@@ -66,4 +66,4 @@
         // 可以通过window.$bus.$on()来监听应用的一些事件
         // 实例化页面
         window.initApp()
-      }</script><script src="dist/js/chunk-vendors.js?c19e442932d6fe6a3e37"></script><script src="dist/js/app.js?c19e442932d6fe6a3e37"></script></body></html>
+      }</script><script src="dist/js/chunk-vendors.js?97072371e55f8bd6a3b4"></script><script src="dist/js/app.js?97072371e55f8bd6a3b4"></script></body></html>
diff --git a/simple-mind-map/full.js b/simple-mind-map/full.js
@@ -28,7 +28,7 @@ MindMap.iconList = icons.nodeIconList
 MindMap.constants = constants
 MindMap.themes = themes
 MindMap.defaultTheme = defaultTheme
-MindMap.version = '0.9.6'
+MindMap.version = '0.9.8'
 
 MindMap.usePlugin(MiniMap)
   .usePlugin(Watermark)

diff --git a/simple-mind-map/index.js b/simple-mind-map/index.js
@@ -31,6 +31,8 @@ class MindMap {
   constructor(opt = {}) {
     // 合并选项
     this.opt = this.handleOpt(merge(defaultOpt, opt))
+    // 预处理节点数据
+    this.opt.data = this.handleData(this.opt.data)
 
     // 容器元素
     this.el = this.opt.el
@@ -39,6 +41,10 @@ class MindMap {
     // 获取容器尺寸位置信息
     this.getElRectInfo()
 
+    // 画布初始大小
+    this.initWidth = this.width
+    this.initHeight = this.height
+
     // 添加css
     this.cssEl = null
     this.addCss()
@@ -94,8 +100,6 @@ class MindMap {
 
   //  配置参数处理
   handleOpt(opt) {
-    // 深拷贝一份节点数据
-    opt.data = simpleDeepClone(opt.data || {})
     // 检查布局配置
     if (!layoutValueList.includes(opt.layout)) {
       opt.layout = CONSTANTS.LAYOUT.LOGICAL_STRUCTURE
@@ -105,6 +109,16 @@ class MindMap {
     return opt
   }
 
+  // 预处理节点数据
+  handleData(data) {
+    data = simpleDeepClone(data || {})
+    // 根节点不能收起
+    if (data.data && !data.data.expand) {
+      data.data.expand = true
+    }
+    return data
+  }
+
   // 创建容器元素
   initContainer() {
     const { associativeLineIsAlwaysAboveNode } = this.opt
@@ -304,7 +318,8 @@ class MindMap {
 
   //  动态设置思维导图数据，纯节点数据
   setData(data) {
-    data = simpleDeepClone(data || {})
+    data = this.handleData(data)
+    this.opt.data = data
     this.execCommand('CLEAR_ACTIVE_NODE')
     this.command.clearHistory()
     this.command.addHistory()

diff --git a/simple-mind-map/package.json b/simple-mind-map/package.json
@@ -1,6 +1,6 @@
 {
   "name": "simple-mind-map",
-  "version": "0.9.6",
+  "version": "0.9.8",
   "description": "一个简单的web在线思维导图",
   "authors": [
     {

diff --git a/simple-mind-map/src/constants/constant.js b/simple-mind-map/src/constants/constant.js
@@ -346,7 +346,7 @@ export const cssContent = `
     display: block;
   }
 
-  .smm-node.active .smm-hover-node{
+  .smm-node.active .smm-hover-node, .smm-node-highlight .smm-hover-node{
     display: block;
     opacity: 1;
     stroke-width: 2;

diff --git a/simple-mind-map/src/constants/defaultOptions.js b/simple-mind-map/src/constants/defaultOptions.js
@@ -275,5 +275,18 @@ export const defaultOpt = {
   customCreateNodePolygon: null,
   // 自定义转换节点连线路径的方法
   // 接收svg path字符串，返回转换后的svg path字符串
-  customTransformNodeLinePath: null
+  customTransformNodeLinePath: null,
+  // 是否仅搜索当前渲染的节点，被收起的节点不会被搜索到
+  isOnlySearchCurrentRenderNodes: false,
+  // 协同编辑时，同一个节点不能同时被多人选中
+  onlyOneEnableActiveNodeOnCooperate: false,
+  // 协同编辑时，节点操作即将更新到其他客户端前的生命周期函数
+  // 函数接收一个对象作为参数：
+  /*
+    {
+      type: createOrUpdate（创建节点或更新节点）、delete（删除节点）
+      data: 1.当type=createOrUpdate时，代表被创建或被更新的节点数据，即将同步到其他客户端，所以你可以修改该数据；2.当type=delete时，代表被删除的节点数据
+    }
+  */
+  beforeCooperateUpdate: null
 }
diff --git a/simple-mind-map/src/core/render/Render.js b/simple-mind-map/src/core/render/Render.js
@@ -28,7 +28,9 @@ import {
   parseAddGeneralizationNodeList,
   checkNodeListIsEqual,
   createSmmFormatData,
-  checkSmmFormatData
+  checkSmmFormatData,
+  checkIsNodeStyleDataKey,
+  removeRichTextStyes
 } from '../../utils'
 import { shapeList } from './node/Shape'
 import { lineStyleProps } from '../../themes/default'
@@ -271,6 +273,15 @@ class Render {
     // 定位节点
     this.goTargetNode = this.goTargetNode.bind(this)
     this.mindMap.command.add('GO_TARGET_NODE', this.goTargetNode)
+    // 一键去除节点自定义样式
+    this.removeCustomStyles = this.removeCustomStyles.bind(this)
+    this.mindMap.command.add('REMOVE_CUSTOM_STYLES', this.removeCustomStyles)
+    // 一键去除所有节点自定义样式
+    this.removeAllNodeCustomStyles = this.removeAllNodeCustomStyles.bind(this)
+    this.mindMap.command.add(
+      'REMOVE_ALL_NODE_CUSTOM_STYLES',
+      this.removeAllNodeCustomStyles
+    )
   }
 
   //  注册快捷键
@@ -494,6 +505,11 @@ class Render {
 
   // 添加节点到激活列表里
   addNodeToActiveList(node) {
+    if (
+      this.mindMap.opt.onlyOneEnableActiveNodeOnCooperate &&
+      node.userList.length > 0
+    )
+      return
     const index = this.findActiveNodeIndex(node)
     if (index === -1) {
       this.mindMap.execCommand('SET_NODE_ACTIVE', node, true)
@@ -638,7 +654,7 @@ class Render {
           uid: createUid(),
           ...(appointData || {})
         },
-        children: [...createUidForAppointNodes(appointChildren, true)]
+        children: [...createUidForAppointNodes(appointChildren)]
       }
       parent.nodeData.children.splice(index + 1, 0, newNodeData)
     })
@@ -674,10 +690,7 @@ class Render {
       const parent = node.parent
       // 计算插入位置
       const index = getNodeDataIndex(node)
-      const newNodeList = createUidForAppointNodes(
-        simpleDeepClone(nodeList),
-        true
-      )
+      const newNodeList = createUidForAppointNodes(simpleDeepClone(nodeList))
       parent.nodeData.children.splice(index + 1, 0, ...newNodeList)
     })
     if (focusNewNode) {
@@ -737,7 +750,7 @@ class Render {
           ...params,
           ...(appointData || {})
         },
-        children: [...createUidForAppointNodes(appointChildren, true)]
+        children: [...createUidForAppointNodes(appointChildren)]
       }
       node.nodeData.children.push(newNode)
       // 插入子节点时自动展开子节点
@@ -777,7 +790,7 @@ class Render {
       if (!node.nodeData.children) {
         node.nodeData.children = []
       }
-      childList = createUidForAppointNodes(childList, true)
+      childList = createUidForAppointNodes(childList)
       node.nodeData.children.push(...childList)
       // 插入子节点时自动展开子节点
       node.setData({
@@ -911,6 +924,65 @@ class Render {
     this.mindMap.render()
   }
 
+  // 移除节点数据的自定义样式的内部方法
+  _handleRemoveCustomStyles(nodeData) {
+    let hasCustomStyles = false
+    Object.keys(nodeData).forEach(key => {
+      if (checkIsNodeStyleDataKey(key)) {
+        hasCustomStyles = true
+        delete nodeData[key]
+      }
+    })
+    // 如果是富文本，那么还要处理富文本内容
+    if (hasCustomStyles && this.mindMap.richText) {
+      nodeData.resetRichText = true
+      nodeData.text = removeRichTextStyes(nodeData.text)
+    }
+    return hasCustomStyles
+  }
+
+  // 一键去除自定义样式
+  removeCustomStyles(node) {
+    node = node || this.activeNodeList[0]
+    if (!node) {
+      return
+    }
+    const hasCustomStyles = this._handleRemoveCustomStyles(node.getData())
+    if (hasCustomStyles) {
+      this.reRenderNodeCheckChange(node)
+    }
+  }
+
+  // 一键去除所有节点自定义样式
+  removeAllNodeCustomStyles(appointNodes) {
+    appointNodes = formatDataToArray(appointNodes)
+    let hasCustomStyles = false
+    // 指定了节点列表，那么遍历该节点列表
+    if (appointNodes.length > 0) {
+      appointNodes.forEach(node => {
+        const _hasCustomStyles = this._handleRemoveCustomStyles(node.getData())
+        if (_hasCustomStyles) hasCustomStyles = true
+      })
+    } else {
+      // 否则遍历整棵树
+      walk(this.renderTree, null, node => {
+        const _hasCustomStyles = this._handleRemoveCustomStyles(node.data)
+        if (_hasCustomStyles) hasCustomStyles = true
+        // 不要忘记概要节点
+        if (node.data.generalization && node.data.generalization.length > 0) {
+          node.data.generalization.forEach(generalizationData => {
+            const _hasCustomStyles =
+              this._handleRemoveCustomStyles(generalizationData)
+            if (_hasCustomStyles) hasCustomStyles = true
+          })
+        }
+      })
+    }
+    if (hasCustomStyles) {
+      this.mindMap.reRender()
+    }
+  }
+
   // 复制节点
   copy() {
     this.beingCopyData = this.copyNode()
@@ -1146,7 +1218,15 @@ class Render {
       // 如果只选中了一个节点，删除后激活其兄弟节点或者父节点
       needActiveNode = this.getNextActiveNode()
       for (let i = 0; i < list.length; i++) {
-        let node = list[i]
+        const node = list[i]
+        const currentEditNode = this.textEdit.getCurrentEditNode()
+        if (
+          currentEditNode &&
+          currentEditNode.getData('uid') === node.getData('uid')
+        ) {
+          // 如果当前节点正在编辑中，那么先完成编辑
+          this.textEdit.hideEditTextBox()
+        }
         if (isAppointNodes) list.splice(i, 1)
         if (node.isGeneralization) {
           this.deleteNodeGeneralization(node)
@@ -1538,7 +1618,8 @@ class Render {
         ...(data || {
           text: this.mindMap.opt.defaultGeneralizationText
         }),
-        range: item.range || null
+        range: item.range || null,
+        uid: createUid()
       }
       let generalization = item.node.getData('generalization')
       if (generalization) {
@@ -1634,7 +1715,7 @@ class Render {
       if (targetNode) {
         targetNode.active()
         this.moveNodeToCenter(targetNode)
-        callback()
+        callback(targetNode)
       }
     })
   }
@@ -1649,6 +1730,11 @@ class Render {
   //  设置节点数据，并判断是否渲染
   setNodeDataRender(node, data, notRender = false) {
     this.mindMap.execCommand('SET_NODE_DATA', node, data)
+    this.reRenderNodeCheckChange(node, notRender)
+  }
+
+  // 重新节点某个节点，判断节点大小是否发生了改变，是的话触发重绘
+  reRenderNodeCheckChange(node, notRender) {
     let changed = node.reRender()
     if (changed) {
       if (!notRender) this.mindMap.render()

diff --git a/simple-mind-map/src/core/render/TextEdit.js b/simple-mind-map/src/core/render/TextEdit.js
@@ -315,4 +315,12 @@ export default class TextEdit {
     this.textEditNode.style.transform = 'translateY(0)'
     this.showTextEdit = false
   }
+
+  // 获取当前正在编辑中的节点实例
+  getCurrentEditNode() {
+    if (this.mindMap.richText) {
+      return this.mindMap.richText.node
+    }
+    return this.currentNode
+  }
 }
Original file line number	Diff line number	Diff line change
Expand Up		@@ -13,3 +13,4 @@ if (fs.existsSync(src)) {
		fs.unlinkSync(src)
		}

		console.warn('请检查手绘风格选项是否开启！！！')