From 706c88c7d525f4d8bdd4866f3635809ff1d1638d Mon Sep 17 00:00:00 2001
From: wanglin2 <1013335014@qq.com>
Date: Sun, 23 Apr 2023 16:18:49 +0800
Subject: [PATCH] =?UTF-8?q?Featyre=EF=BC=9A=E5=AF=8C=E6=96=87=E6=9C=AC?=
 =?UTF-8?q?=E6=A8=A1=E5=BC=8F=E4=B8=8B=EF=BC=8C=E5=AF=BC=E5=85=A5=E6=95=B0?=
 =?UTF-8?q?=E6=8D=AE=E3=80=81=E5=88=9D=E5=A7=8B=E5=8C=96=E6=95=B0=E6=8D=AE?=
 =?UTF-8?q?=E3=80=81=E5=88=87=E6=8D=A2=E4=B8=BB=E9=A2=98=E5=9C=BA=E6=99=AF?=
 =?UTF-8?q?=E8=8A=82=E7=82=B9=E6=A0=B7=E5=BC=8F=E6=94=AF=E6=8C=81=E8=B7=9F?=
 =?UTF-8?q?=E9=9A=8F=E4=B8=BB=E9=A2=98=E5=8F=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 simple-mind-map/src/RichText.js                 | 17 +++++++++++------
 simple-mind-map/src/Style.js                    | 12 ++++++++++++
 simple-mind-map/src/utils/index.js              | 10 ++++++++++
 simple-mind-map/src/utils/nodeCreateContents.js |  9 ++++++++-
 4 files changed, 41 insertions(+), 7 deletions(-)

diff --git a/simple-mind-map/src/RichText.js b/simple-mind-map/src/RichText.js
index 4e2433e3..227f701e 100644
--- a/simple-mind-map/src/RichText.js
+++ b/simple-mind-map/src/RichText.js
@@ -1,8 +1,7 @@
 import Quill from 'quill'
 import 'quill/dist/quill.snow.css'
 import html2canvas from 'html2canvas'
-import { Image as SvgImage } from '@svgdotjs/svg.js'
-import { walk } from './utils'
+import { walk, getTextFromHtml } from './utils'
 import { CONSTANTS } from './utils/constant'
 
 let extended = false
@@ -45,6 +44,11 @@ class RichText {
     this.initOpt()
     this.extendQuill()
     this.appendCss()
+
+    // 处理数据，转成富文本格式
+    if (this.mindMap.opt.data) {
+      this.mindMap.opt.data = this.handleSetData(this.mindMap.opt.data)
+    }
   }
 
   // 插入样式
@@ -427,15 +431,13 @@ class RichText {
 
   // 将所有节点转换成非富文本节点
   transformAllNodesToNormalNode() {
-    let div = document.createElement('div')
     walk(
       this.mindMap.renderer.renderTree,
       null,
       node => {
         if (node.data.richText) {
           node.data.richText = false
-          div.innerHTML = node.data.text
-          node.data.text = div.textContent
+          node.data.text = getTextFromHtml(node.data.text)
           // delete node.data.uid
         }
       },
@@ -453,7 +455,10 @@ class RichText {
   // 处理导入数据
   handleSetData(data) {
     let walk = (root) => {
-      root.data.richText = true
+      if (!root.data.richText) {
+        root.data.richText = true
+        root.data.resetRichText = true
+      }
       if (root.children && root.children.length > 0) {
         Array.from(root.children).forEach((item) => {
           walk(item)
diff --git a/simple-mind-map/src/Style.js b/simple-mind-map/src/Style.js
index b0f95fd3..6f10526e 100644
--- a/simple-mind-map/src/Style.js
+++ b/simple-mind-map/src/Style.js
@@ -109,6 +109,18 @@ class Style {
       })
   }
 
+  // 生成内联样式
+  createStyleText() {
+    return `
+      color: ${this.merge('color')};
+      font-family: ${this.merge('fontFamily')};
+      font-size: ${this.merge('fontSize') + 'px'};
+      font-weight: ${this.merge('fontWeight')};
+      font-style: ${this.merge('fontStyle')};
+      text-decoration: ${this.merge('textDecoration')}
+    `
+  }
+
   // 获取文本样式
   getTextFontStyle() {
     return { 
diff --git a/simple-mind-map/src/utils/index.js b/simple-mind-map/src/utils/index.js
index 476cb974..050a342e 100644
--- a/simple-mind-map/src/utils/index.js
+++ b/simple-mind-map/src/utils/index.js
@@ -332,4 +332,14 @@ export const checkNodeOuter = (mindMap, node) => {
     offsetLeft,
     offsetTop
   }
+}
+
+// 提取html字符串里的纯文本
+let getTextFromHtmlEl = null
+export const getTextFromHtml = (html) => {
+  if (!getTextFromHtmlEl) {
+    getTextFromHtmlEl = document.createElement('div')
+  }
+  getTextFromHtmlEl.innerHTML = html
+  return getTextFromHtmlEl.textContent
 }
\ No newline at end of file
diff --git a/simple-mind-map/src/utils/nodeCreateContents.js b/simple-mind-map/src/utils/nodeCreateContents.js
index 4e729947..ba305df8 100644
--- a/simple-mind-map/src/utils/nodeCreateContents.js
+++ b/simple-mind-map/src/utils/nodeCreateContents.js
@@ -1,6 +1,7 @@
-import { measureText, resizeImgSize } from '../utils'
+import { measureText, resizeImgSize, getTextFromHtml } from '../utils'
 import { Image, SVG, A, G, Rect, Text, ForeignObject } from '@svgdotjs/svg.js'
 import iconsSvg from '../svg/icons'
+import { CONSTANTS } from './constant'
 
 //  创建图片节点
 function createImgNode() {
@@ -52,6 +53,12 @@ function createIconNode() {
 // 创建富文本节点
 function createRichTextNode() {
   let g = new G()
+  // 重新设置富文本节点内容
+  if (this.nodeData.data.resetRichText || [CONSTANTS.CHANGE_THEME].includes(this.mindMap.renderer.renderSource)) {
+    delete this.nodeData.data.resetRichText
+    let text = getTextFromHtml(this.nodeData.data.text)
+    this.nodeData.data.text = `<p><span style="${this.style.createStyleText()}">${text}</span></p>`
+  }
   let html = `<div>${this.nodeData.data.text}</div>`
   let div = document.createElement('div')
   div.innerHTML = html