diff --git a/src/api/axios.config.ts b/src/api/axios.config.ts index 9a6f2ee2..c42121c0 100644 --- a/src/api/axios.config.ts +++ b/src/api/axios.config.ts @@ -2,7 +2,10 @@ import { ModuleTypeEnum } from '@/enums/httpEnum' // 接口白名单(免登录) export const fetchAllowList = [ - `${ModuleTypeEnum.SYSTEM}/login` + // 登录 + `${ModuleTypeEnum.SYSTEM}/login`, + // 预览获取数据 + `${ModuleTypeEnum.PROJECT}/getData`, ] // 接口黑名单 diff --git a/src/api/path/photo.ts b/src/api/path/photo.ts deleted file mode 100644 index 986fec7f..00000000 --- a/src/api/path/photo.ts +++ /dev/null @@ -1,3 +0,0 @@ -import { http } from '@/api/http' -import { httpErrorHandle } from '@/utils' -import { RequestHttpEnum, ModuleTypeEnum } from '@/enums/httpEnum' diff --git a/src/api/path/project.ts b/src/api/path/project.ts index 69899dde..6d05ced8 100644 --- a/src/api/path/project.ts +++ b/src/api/path/project.ts @@ -5,7 +5,7 @@ import { ContentTypeEnum, RequestHttpEnum, ModuleTypeEnum } from '@/enums/httpEn // * 项目列表 export const projectListApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.PROJECT}/list`, data); + const res = await http(RequestHttpEnum.GET)(`/api/goview/${ModuleTypeEnum.PROJECT}/list`, data); return res; } catch { httpErrorHandle(); @@ -15,7 +15,7 @@ export const projectListApi = async (data: object) => { // * 新增项目 export const createProjectApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/create`, data); + const res = await http(RequestHttpEnum.POST)(`/api/goview/${ModuleTypeEnum.PROJECT}/create`, data); return res; } catch { httpErrorHandle(); @@ -25,7 +25,7 @@ export const createProjectApi = async (data: object) => { // * 获取项目 export const fetchProjectApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.PROJECT}/getData`, data); + const res = await http(RequestHttpEnum.GET)(`/api/goview/${ModuleTypeEnum.PROJECT}/getData`, data); return res; } catch { httpErrorHandle(); @@ -35,7 +35,7 @@ export const fetchProjectApi = async (data: object) => { // * 保存项目 export const saveProjectApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/save/data`, data, ContentTypeEnum.FORM_URLENCODED); + const res = await http(RequestHttpEnum.POST)(`/api/goview/${ModuleTypeEnum.PROJECT}/save/data`, data, ContentTypeEnum.FORM_URLENCODED); return res; } catch { httpErrorHandle(); @@ -45,7 +45,7 @@ export const saveProjectApi = async (data: object) => { // * 修改项目基础信息 export const updateProjectApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/edit`, data); + const res = await http(RequestHttpEnum.POST)(`/api/goview/${ModuleTypeEnum.PROJECT}/edit`, data); return res; } catch { httpErrorHandle(); @@ -56,7 +56,7 @@ export const updateProjectApi = async (data: object) => { // * 删除项目 export const deleteProjectApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.DELETE)(`${ModuleTypeEnum.PROJECT}/delete`, data); + const res = await http(RequestHttpEnum.DELETE)(`/api/goview/${ModuleTypeEnum.PROJECT}/delete`, data); return res; } catch { httpErrorHandle(); @@ -66,7 +66,17 @@ export const deleteProjectApi = async (data: object) => { // * 修改发布状态 [-1未发布,1发布] export const changeProjectReleaseApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.PUT)(`${ModuleTypeEnum.PROJECT}/publish`, data); + const res = await http(RequestHttpEnum.PUT)(`/api/goview/${ModuleTypeEnum.PROJECT}/publish`, data); + return res; + } catch { + httpErrorHandle(); + } +} + +// * 上传文件 +export const uploadFile = async (data: object) => { + try { + const res = await http(RequestHttpEnum.POST)(`oss/object/v2-cloud`, data, ContentTypeEnum.FORM_DATA); return res; } catch { httpErrorHandle(); diff --git a/src/api/path/system.api.ts b/src/api/path/system.api.ts index 1197fd39..eaf0f9a9 100644 --- a/src/api/path/system.api.ts +++ b/src/api/path/system.api.ts @@ -5,7 +5,7 @@ import { RequestHttpEnum, ModuleTypeEnum } from '@/enums/httpEnum' // * 登录 export const loginApi = async (data: object) => { try { - const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.SYSTEM}/login`, data); + const res = await http(RequestHttpEnum.POST)(`/api/goview/${ModuleTypeEnum.SYSTEM}/login`, data); return res; } catch { httpErrorHandle(); @@ -15,7 +15,7 @@ export const loginApi = async (data: object) => { // * 登出 export const logoutApi = async () => { try { - const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.SYSTEM}/logout`); + const res = await http(RequestHttpEnum.GET)(`/api/goview/${ModuleTypeEnum.SYSTEM}/logout`); return res; } catch(err) { httpErrorHandle(); diff --git a/src/settings/httpSetting.ts b/src/settings/httpSetting.ts index 2dfd2c3a..7b3962d4 100644 --- a/src/settings/httpSetting.ts +++ b/src/settings/httpSetting.ts @@ -1,2 +1,2 @@ // 请求前缀 -export const axiosPre = '/goview/api/goview/' \ No newline at end of file +export const axiosPre = '/goview' \ No newline at end of file diff --git a/src/utils/file.ts b/src/utils/file.ts index 0ce0978f..9691a90a 100644 --- a/src/utils/file.ts +++ b/src/utils/file.ts @@ -1,3 +1,49 @@ +import { Buffer } from "buffer" + +/** + * * file转url + */ + export const fileToUrl = (file: File): string => { + const Url = URL || window.URL || window.webkitURL + const ImageUrl = Url.createObjectURL(file) + return ImageUrl +} + +/** + * * url转file + */ + export const urlToFile = (fileUrl: string, fileName = new Date().getTime()): File => { + const dataArr = fileUrl.split(',') + const mime = (dataArr as any[])[0].match(/:(.*);/)[1] + const originStr = atob(dataArr[1]) + return new File([originStr], `${fileName}`, { type: mime }) +} + +/** + * * file转base64 + * @param file 文件数据 + * @param callback 回调函数 + */ +export const fileTobase64 = (file: File, callback: Function) => { + let reader = new FileReader() + reader.readAsDataURL(file) + reader.onload = function (e: ProgressEvent) { + if (e.target) { + let base64 = e.target.result + callback(base64) + } + } +} + +/** + * * canvas转file + * @param canvas + */ +export const canvastoFile = (canvas: HTMLCanvasElement) => { + const dataurl = canvas.toDataURL('image/png') + return urlToFile(dataurl) +} + /** * *获取上传的文件数据 * @param { File } file 文件对象 @@ -38,7 +84,7 @@ export const downloadByA = (url: string, filename = new Date().getTime(), fileSu } /** - * 下载数据 + * * 下载数据 * @param { string } content 数据内容 * @param { ?string } filename 文件名称(默认随机字符) * @param { ?string } fileSuffix 文件名称(默认随机字符) @@ -51,4 +97,4 @@ export const downloadTextFile = ( // 字符内容转变成blob地址 const blob = new Blob([content]) downloadByA(URL.createObjectURL(blob), filename, fileSuffix) -} +} \ No newline at end of file diff --git a/src/utils/utils.ts b/src/utils/utils.ts index e8db216c..e81e2443 100644 --- a/src/utils/utils.ts +++ b/src/utils/utils.ts @@ -111,29 +111,6 @@ export const isMac = () => { return /macintosh|mac os x/i.test(navigator.userAgent) } -/** - * * file转url - */ -export const fileToUrl = (file: File): string => { - const Url = URL || window.URL || window.webkitURL - const ImageUrl = Url.createObjectURL(file) - return ImageUrl -} - -/** - * * file转base64 - */ -export const fileTobase64 = (file: File, callback: Function) => { - let reader = new FileReader() - reader.readAsDataURL(file) - reader.onload = function (e: ProgressEvent) { - if (e.target) { - let base64 = e.target.result - callback(base64) - } - } -} - /** * * 挂载监听 */ diff --git a/src/views/chart/hooks/useSync.hook.ts b/src/views/chart/hooks/useSync.hook.ts index b2549910..cd9b5325 100644 --- a/src/views/chart/hooks/useSync.hook.ts +++ b/src/views/chart/hooks/useSync.hook.ts @@ -1,5 +1,6 @@ import { onUnmounted } from 'vue'; -import { getUUID, httpErrorHandle, fetchRouteParamsLocation } from '@/utils' +import html2canvas from 'html2canvas' +import { getUUID, httpErrorHandle, fetchRouteParamsLocation, canvastoFile } 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' @@ -9,7 +10,7 @@ import { saveInterval } from '@/settings/designSetting' // 接口状态 import { ResultEnum } from '@/enums/httpEnum' // 接口 -import { saveProjectApi, fetchProjectApi } from '@/api/path/project' +import { saveProjectApi, fetchProjectApi, uploadFile } from '@/api/path/project' // 画布枚举 import { SyncEnum } from '@/enums/editPageEnum' @@ -84,7 +85,7 @@ export const useSync = () => { chartEditStore.setProjectInfo(ProjectInfoEnum.THUMBNAIL, indexImage) } - // 数据获取 + // * 数据获取 const dataSyncFetch = async () => { chartEditStore.setEditCanvas(EditCanvasTypeEnum.SAVE_STATUS, SyncEnum.START) try { @@ -108,11 +109,20 @@ export const useSync = () => { } } - // 数据保存 + // * 数据保存 const dataSyncUpdate = async () => { if(!fetchRouteParamsLocation()) return chartEditStore.setEditCanvas(EditCanvasTypeEnum.SAVE_STATUS, SyncEnum.START) - + + // 获取缩略图片 + const range = document.querySelector('.go-edit-range') as HTMLElement + const canvasImage: HTMLCanvasElement = await html2canvas(range) + const canvasFile = canvastoFile(canvasImage) + let uploadParams = new FormData() + uploadParams.append('object', canvasFile) + const uploadRes = await uploadFile(uploadParams) + console.log(uploadRes) + let params = new FormData() params.append('projectId', fetchRouteParamsLocation()) params.append('content', JSON.stringify(chartEditStore.getStorageInfo || {})) @@ -129,7 +139,7 @@ export const useSync = () => { chartEditStore.setEditCanvas(EditCanvasTypeEnum.SAVE_STATUS, SyncEnum.FAILURE) } - // 定时处理 + // * 定时处理 const intervalDataSyncUpdate = () => { // 定时获取数据 const syncTiming = setInterval(() => {