diff --git a/src/utils/file.ts b/src/utils/file.ts index 3529dff7..4a10bd38 100644 --- a/src/utils/file.ts +++ b/src/utils/file.ts @@ -1,4 +1,20 @@ -import { Buffer } from "buffer" +/** + * * base64转file + * @param dataurl + * @param fileName + * @returns + */ +export const base64toFile = (dataurl: string, fileName: string) => { + let dataArr = dataurl.split(","), + mime = (dataArr as any[])[0].match(/:(.*?);/)[1], + bstr = atob(dataArr[1]), + n = bstr.length, + u8arr = new Uint8Array(n); + while (n--) { + u8arr[n] = bstr.charCodeAt(n); + } + return new File([u8arr], fileName, { type: mime }); +} /** * * file转url @@ -16,7 +32,7 @@ import { Buffer } from "buffer" const dataArr = fileUrl.split(',') const mime = (dataArr as any[])[0].match(/:(.*);/)[1] const originStr = atob(dataArr[1]) - return new File([originStr], `${fileName}.png`, { type: mime }) + return new File([originStr], `${fileName}`, { type: mime }) } /** diff --git a/src/views/chart/hooks/useSync.hook.ts b/src/views/chart/hooks/useSync.hook.ts index 59a35c9c..d73ecf9d 100644 --- a/src/views/chart/hooks/useSync.hook.ts +++ b/src/views/chart/hooks/useSync.hook.ts @@ -1,6 +1,6 @@ import { onUnmounted } from 'vue'; import html2canvas from 'html2canvas' -import { getUUID, httpErrorHandle, fetchRouteParamsLocation, canvastoFile } from '@/utils' +import { getUUID, httpErrorHandle, fetchRouteParamsLocation, base64toFile } from '@/utils' import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { EditCanvasTypeEnum, ChartEditStoreEnum, ProjectInfoEnum, ChartEditStorage } from '@/store/modules/chartEditStore/chartEditStore.d' import { useChartHistoryStore } from '@/store/modules/chartHistoryStore/chartHistoryStore' @@ -117,19 +117,16 @@ export const useSync = () => { // 获取缩略图片 const range = document.querySelector('.go-edit-range') as HTMLElement const canvasImage: HTMLCanvasElement = await html2canvas(range) - const canvasFile = canvastoFile(canvasImage, `${fetchRouteParamsLocation()}_index_preview`) // 上传预览图 let uploadParams = new FormData() - uploadParams.append('object', canvasFile) + uploadParams.append('object', base64toFile(canvasImage.toDataURL(), `${fetchRouteParamsLocation()}_index_preview.png`)) const uploadRes:any = await uploadFile(uploadParams) - console.log(uploadRes) - // 保存预览图 - if(uploadRes?.data === ResultEnum.SUCCESS) { + if(uploadRes.code === ResultEnum.SUCCESS) { await updateProjectApi({ id: fetchRouteParamsLocation(), - updateProjectApi: uploadRes.url + indexImage: uploadRes.data.objectContent.httpRequest.uri }) }