Prechádzať zdrojové kódy

feat: 优化导出流程

bill 1 mesiac pred
rodič
commit
fef27d7a01

+ 12 - 4
src/example/components/header/actions.ts

@@ -30,10 +30,10 @@ const rotateView = (draw: Draw) => {
 
 export const getImage = (draw: Draw, format: string) => 
   draw.stage!.toBlob({
-    pixelRatio: 1,
+    pixelRatio: 2,
     mimeType: format,
     quality: 1,
-  }) as Promise<Blob>;
+  }) as Promise<Blob | null>;
 
 export const getHeaderActions = (draw: Draw) => {
   
@@ -98,7 +98,11 @@ export const getHeaderActions = (draw: Draw) => {
               draw.config.showGrid = false
               const pop = draw.mode.push(Mode.readonly)
               await nextTick()
-              saveAs(await getImage(draw, 'image/jpeg'), `${filename}.jpg`);
+              const blob = await getImage(draw, 'image/jpeg')
+              if (!blob) {
+                throw '截图失败'
+              }
+              saveAs(blob, `${filename}.jpg`);
               pop()
               draw.config.showGrid = oldShowGrid
             })
@@ -115,7 +119,11 @@ export const getHeaderActions = (draw: Draw) => {
               draw.config.showGrid = false
               draw.config.back = undefined
               await nextTick()
-              await saveAs(await getImage(draw, 'image/png'), `${filename}.png`);
+              const blob = await getImage(draw, 'image/png')
+              if (!blob) {
+                throw '截图失败'
+              }
+              await saveAs(blob, `${filename}.png`);
               pop()
               draw.config.back = oldBack
               draw.config.showGrid = oldShowGrid

+ 16 - 6
src/example/fuse/views/overview/header.vue

@@ -80,8 +80,12 @@ const actions = [
               await nextTick();
               return blob;
             });
-            await saveAs(blob, `${props.title}.${format}`);
-            ElMessage.success("导出成功");
+            if (!blob) {
+              ElMessage.error("导出失败");
+            } else {
+              await saveAs(blob, `${props.title}.${format}`);
+              ElMessage.success("导出成功");
+            }
           } else {
             await item.handler(props.title);
           }
@@ -174,10 +178,16 @@ const saveHandler = repeatedlyOnly(async () => {
     return [tabBlob, listBlob, scale, rect] as const;
   });
 
-  const [tabUrl, listUrl] = await Promise.all([
-    window.platform.uploadResourse(new File([tabBlob], `tabulation-cover.png`)),
-    window.platform.uploadResourse(new File([listBlob], `list-cover.png`)),
-  ]);
+  let tabUrl = null;
+  let listUrl = null;
+  if (!tabBlob || !listBlob) {
+    ElMessage.error("截图保存失败");
+  } else {
+    [tabUrl, listUrl] = await Promise.all([
+      window.platform.uploadResourse(new File([tabBlob], `tabulation-cover.png`)),
+      window.platform.uploadResourse(new File([listBlob], `list-cover.png`)),
+    ]);
+  }
 
   overviewId.value = await window.platform.saveOverviewData(overviewId.value, {
     ...overviewData.value,