From fb0798dc7ee3a2546549abef92288a51fa4af7d6 Mon Sep 17 00:00:00 2001
From: yaoyun8 <yaoyun8@huawei.com>
Date: Mon, 30 Sep 2024 00:11:10 -0700
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9AcanvasSrc?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../canvas/DesignCanvas/src/DesignCanvas.vue  | 20 +++++++++++-----
 .../canvas/container/src/CanvasContainer.vue  | 24 +++++++++++++------
 packages/canvas/index.js                      |  3 ++-
 3 files changed, 33 insertions(+), 14 deletions(-)

diff --git a/packages/canvas/DesignCanvas/src/DesignCanvas.vue b/packages/canvas/DesignCanvas/src/DesignCanvas.vue
index 95229979d..041c6f2e8 100644
--- a/packages/canvas/DesignCanvas/src/DesignCanvas.vue
+++ b/packages/canvas/DesignCanvas/src/DesignCanvas.vue
@@ -5,7 +5,8 @@
         :is="CanvasContainer.entry"
         :controller="controller"
         :materials-panel="materialsPanel"
-        :canvas-src="canvasUrl"
+        :canvas-src="canvasSrc"
+        :canvas-src-doc="canvasSrcDoc"
         @remove="removeNode"
         @selected="nodeSelected"
       ></component>
@@ -26,13 +27,15 @@ import {
   useHistory,
   useModal,
   getMergeRegistry,
-  getMergeMeta
+  getMergeMeta,
+  getOptions
 } from '@opentiny/tiny-engine-meta-register'
 import { useHttp } from '@opentiny/tiny-engine-http'
 import { constants } from '@opentiny/tiny-engine-utils'
 import * as ast from '@opentiny/tiny-engine-common/js/ast'
 import { initCanvas } from '../../init-canvas/init-canvas'
 import { getImportMapData } from './importMap'
+import meta from '../meta'
 
 const { PAGE_STATUS } = constants
 
@@ -52,6 +55,13 @@ export default {
     const showMask = ref(true)
     const canvasRef = ref(null)
     let showModal = false // 弹窗标识
+    const { canvasSrc = '' } = getOptions(meta.id) || {}
+    let canvasSrcDoc = ''
+
+    if (!canvasSrc) {
+      const { importMap, importStyles } = getImportMapData(getMergeMeta('engine.config')?.importMapVersion)
+      canvasSrcDoc = initCanvas(importMap, importStyles)
+    }
 
     const removeNode = (node) => {
       const { pageState } = useCanvas()
@@ -158,12 +168,10 @@ export default {
       canvasResizeObserver?.disconnect?.()
     })
 
-    const { importMap, importStyles } = getImportMapData(getMergeMeta('engine.config')?.importMapVersion)
-    const { html: canvasUrl } = initCanvas(importMap, importStyles)
-
     return {
       removeNode,
-      canvasUrl,
+      canvasSrc,
+      canvasSrcDoc,
       nodeSelected,
       footData,
       materialsPanel,
diff --git a/packages/canvas/container/src/CanvasContainer.vue b/packages/canvas/container/src/CanvasContainer.vue
index aac69d2d1..b284963bd 100644
--- a/packages/canvas/container/src/CanvasContainer.vue
+++ b/packages/canvas/container/src/CanvasContainer.vue
@@ -11,13 +11,22 @@
   <canvas-divider :selectState="selectState"></canvas-divider>
   <canvas-resize-border :iframe="iframe"></canvas-resize-border>
   <canvas-resize>
-    <iframe
-      v-if="!loading"
-      id="canvas"
-      ref="iframe"
-      :srcdoc="canvasSrc"
-      style="border: none; width: 100%; height: 100%"
-    ></iframe>
+    <template v-if="!loading">
+      <iframe
+        v-if="canvasSrc"
+        id="canvas"
+        ref="iframe"
+        :src="canvasSrc"
+        style="border: none; width: 100%; height: 100%"
+      ></iframe>
+      <iframe
+        v-else
+        id="canvas"
+        ref="iframe"
+        :srcdoc="canvasSrcDoc"
+        style="border: none; width: 100%; height: 100%"
+      ></iframe>
+    </template>
     <div v-else class="datainit-tip">应用数据初始化中...</div>
   </canvas-resize>
   <canvas-menu @insert="insertComponent"></canvas-menu>
@@ -63,6 +72,7 @@ export default {
   props: {
     controller: Object,
     canvasSrc: String,
+    canvasSrcDoc: String,
     materialsPanel: Object
   },
   emits: ['selected', 'remove'],
diff --git a/packages/canvas/index.js b/packages/canvas/index.js
index 4b935cabd..0a3016f76 100644
--- a/packages/canvas/index.js
+++ b/packages/canvas/index.js
@@ -15,8 +15,9 @@ import { CanvasBreadcrumb } from './breadcrumb'
 import CanvasContainer from './container'
 import CanvasLayout from './layout'
 import DesignCanvas from './DesignCanvas'
+import { createRender } from './render'
 
-export { CanvasContainer, CanvasLayout, DesignCanvas }
+export { CanvasContainer, CanvasLayout, DesignCanvas, createRender }
 
 export default {
   ...DesignCanvas,