fix

src/components/Canvas/FlowCanvas/components/nodes/result-image.vue

@@ -23,6 +23,7 @@
 				</button>
 			</div>
 			<img
+				v-loadimg="false"
 				class="image"
 				v-if="item.status == 'RETURNED'"
 				:src="item?.url"
@@ -58,10 +59,11 @@
 
 <script setup lang="ts">
 	import myEvent from '@/utils/myEvent'
-	import { downloadImage } from '../../../tools/tools'
+	import { downloadImage, base64Tofile } from '../../../tools/tools'
 	import { reactive, ref, onBeforeUnmount, useAttrs, inject, watch, computed, onMounted } from 'vue'
 	import HighlightAdmin from '@/components/highlightAdmin.vue'
 	import { NODE_DATATYPE } from '../../tools/index.d'
+	import { uploadImage } from '@/api/upload'
 	const openImagePreview = inject('openImagePreview') as (url: string) => void
 	const openThreeModelPreview = inject('openThreeModelPreview') as (url: string) => void
 	const props = defineProps({
@@ -203,11 +205,19 @@
 		eventManager.registerEvents()
 	}
 	const depthCanvasWorkbench = (options)=>{
-		data.imageProcessTasks.forEach((item) => {
-			if(item.taskId == options.taskId){
-				item.url = options.url
-			}
+		console.log(options)
+		// 1. 提取 MIME 类型和 Base64 数据
+		const file = base64Tofile(options.url,'image.png')
+		const formData = new FormData()
+		formData.append('file', file)
+		uploadImage(formData).then((res) => {
+			data.imageProcessTasks.forEach((item) => {
+				if(item.taskId == options.taskId){
+					item.url = res
+				}
+			})
 		})
+		
 	}
 
 	const onEdit = (item: any) => {

src/components/Canvas/tools/tools.ts

@@ -60,3 +60,21 @@ export const downImgListToZip = async (imagesParams,callback) => {
 		})
 		.catch((error) => console.error('下载失败:', error))
 }
+
+/** base64转二进制 */
+export const base64Tofile = (base64: string,name: string) => {
+	const arr = base64.split(',')
+	const mime = arr[0].match(/:(.*?);/)[1]
+	const bstr = atob(arr[1])
+	// 2. 转换为 Uint8Array
+	let n = bstr.length
+	const u8arr = new Uint8Array(n)
+	while (n--) {
+		u8arr[n] = bstr.charCodeAt(n)
+	}
+	// 3. 创建 Blob
+	const blob = new Blob([u8arr], { type: mime })
+	// 4. 创建 File 对象（可选）
+	const file = new File([blob], name, { type: mime })
+	return file
+}

src/main.ts

@@ -30,6 +30,20 @@ app.use(router)
 	.use(i18n)
 	.mount('#app')
 
-
+// 简写形式
+const vLoadimg = (el, binding) => {
+	const src = binding.value
+	if (el.src === src) return
+	const img = new Image()
+	img.src = src
+	img.onload = () => {
+	  el.src = src
+	}
+	img.onerror = () => {
+	  console.log('图片加载失败:', src)
+	}
+}
+// 注册
+app.directive('loadimg', vLoadimg)
 flexible();