From bac174c8dfbea3dd08f9b1fdfce584480e363be3 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: Mon, 25 Dec 2023 17:39:51 +0800
Subject: [PATCH] =?UTF-8?q?Feat=EF=BC=9A=E6=96=B0=E5=A2=9E=E8=87=AA?=
 =?UTF-8?q?=E5=AE=9A=E4=B9=89=E8=8A=82=E7=82=B9=E7=B2=98=E8=B4=B4=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=E6=97=B6=E7=9A=84=E5=A4=84=E7=90=86=E5=87=BD=E6=95=B0?=
 =?UTF-8?q?=E9=80=89=E9=A1=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 simple-mind-map/src/constants/defaultOptions.js | 14 +++++++++++++-
 simple-mind-map/src/core/render/Render.js       | 15 ++++++++++++---
 web/src/pages/Edit/components/Edit.vue          | 14 ++++++++++++++
 3 files changed, 39 insertions(+), 4 deletions(-)

diff --git a/simple-mind-map/src/constants/defaultOptions.js b/simple-mind-map/src/constants/defaultOptions.js
index 095d5a36..178d1096 100644
--- a/simple-mind-map/src/constants/defaultOptions.js
+++ b/simple-mind-map/src/constants/defaultOptions.js
@@ -244,5 +244,17 @@ export const defaultOpt = {
   // 比如向右拖动时，思维导图图形的最左侧到达画布中心时将无法继续向右拖动，其他同理
   isLimitMindMapInCanvas: false,
   // 当注册了滚动条插件（Scrollbar）时，是否将思维导图限制在画布内，isLimitMindMapInCanvas不再起作用
-  isLimitMindMapInCanvasWhenHasScrollbar: true
+  isLimitMindMapInCanvasWhenHasScrollbar: true,
+  // 在节点上粘贴剪贴板中的图片的处理方法，默认是转换为data:url数据插入到节点中，你可以通过该方法来将图片数据上传到服务器，实现保存图片的url
+  // 可以传递一个异步方法，接收Blob类型的图片数据，需要返回如下结构：
+  /*
+    {
+      url,    // 图片url
+      size: {
+        width,  // 图片的宽度
+        height  //图片的高度
+      }
+    }
+  */
+  handleNodePasteImg: null
 }
diff --git a/simple-mind-map/src/core/render/Render.js b/simple-mind-map/src/core/render/Render.js
index e15fe01c..76ae08cb 100644
--- a/simple-mind-map/src/core/render/Render.js
+++ b/simple-mind-map/src/core/render/Render.js
@@ -895,8 +895,11 @@ class Render {
 
   // 粘贴
   async paste() {
-    const { errorHandler, handleIsSplitByWrapOnPasteCreateNewNode } =
-      this.mindMap.opt
+    const {
+      errorHandler,
+      handleIsSplitByWrapOnPasteCreateNewNode,
+      handleNodePasteImg
+    } = this.mindMap.opt
     // 读取剪贴板的文字和图片
     let text = null
     let img = null
@@ -999,7 +1002,13 @@ class Render {
       // 存在图片，则添加到当前激活节点
       if (img) {
         try {
-          let imgData = await loadImage(img)
+          let imgData = null
+          // 自定义图片处理函数
+          if (handleNodePasteImg && typeof handleNodePasteImg === 'function') {
+            imgData = await handleNodePasteImg(img)
+          } else {
+            imgData = await loadImage(img)
+          }
           if (this.activeNodeList.length > 0) {
             this.activeNodeList.forEach(node => {
               this.mindMap.execCommand('SET_NODE_IMAGE', node, {
diff --git a/web/src/pages/Edit/components/Edit.vue b/web/src/pages/Edit/components/Edit.vue
index c260c11a..cd199527 100644
--- a/web/src/pages/Edit/components/Edit.vue
+++ b/web/src/pages/Edit/components/Edit.vue
@@ -338,6 +338,20 @@ export default {
               break
           }
         }
+        // handleNodePasteImg: img => {
+        //   console.log(img)
+        //   return new Promise(resolve => {
+        //     setTimeout(() => {
+        //       resolve({
+        //         url: require('../../../assets/img/themes/autumn.jpg'),
+        //         size: {
+        //           width: 100,
+        //           height: 100
+        //         }
+        //       })
+        //     }, 200)
+        //   })
+        // }
         // isUseCustomNodeContent: true,
         // 示例1：组件里用到了router、store、i18n等实例化vue组件时需要用到的东西
         // customCreateNodeContent: (node) => {