Browse Source

feat: 为 readJSON 新增 isChange 模式处理 base64 图片上传至 S3

lsc 2 weeks ago
parent
commit
cfc1940b58
2 changed files with 27 additions and 3 deletions
  1. 26 2
      src/hooks/useImport.ts
  2. 1 1
      src/views/Editor/Canvas/index.vue

+ 26 - 2
src/hooks/useImport.ts

@@ -280,7 +280,7 @@ export default () => {
   }
 
   // 直接读取JSON功能,暴露到window.readJSON
-  const readJSON = (jsonData: string | any, cover = false) => {
+  const readJSON = (jsonData: string | any, cover = false, isChange = false) => {
     try {
       console.log('readJSON 开始执行:', { jsonData, cover })
 
@@ -302,6 +302,30 @@ export default () => {
 
       console.log('提取的数据:', { slides: slides.length, title, theme, width, height, viewportRatio })
 
+      // isChange 模式:检查图片元素 src 是否为 base64,是则上传 S3 并替换为链接
+      if (isChange && Array.isArray(slides)) {
+        for (const slide of slides) {
+          if (!slide?.elements) continue
+          for (const element of slide.elements) {
+            if (element.type !== 'image') continue
+            if (typeof element.src !== 'string' || !element.src.startsWith('data:')) continue
+            ;(async () => {
+              try {
+                const file = await makeWhiteTransparent(element.src, `image_${Date.now()}.png`)
+                if (file) {
+                  const url = await uploadFileToS3(file)
+                  element.src = url
+                  slidesStore.updateElement({ id: element.id, props: { src: url } })
+                }
+              }
+              catch (error) {
+                console.error('Image upload failed:', error)
+              }
+            })()
+          }
+        }
+      }
+
       if (cover) {
         console.log('覆盖模式:更新幻灯片数据')
         slidesStore.updateSlideIndex(0)
@@ -1237,7 +1261,7 @@ export default () => {
               if (el.picBase64 && typeof el.picBase64 === 'string' && el.picBase64.startsWith('blob:')) {
                 const uploadTask = (async () => {
                   try {
-                    const file = makeWhiteTransparent(el.picBase64, `image_${Date.now()}.png`)
+                    const file = await makeWhiteTransparent(el.picBase64, `image_${Date.now()}.png`)
                     if (file) {
                       const url = await uploadFileToS3(file)
                       element.src = url

+ 1 - 1
src/views/Editor/Canvas/index.vue

@@ -305,7 +305,7 @@ const getCourseDetail = async () => {
               }
             }
           }
-          readJSON(jsonObj, true)
+          readJSON(jsonObj, true, true)
           if (typeof window !== 'undefined') {
             const win = window as any
             win.pptLoading = 2