perf: 编辑JSON兼容后端优化

src/views/chart/ContentEdit/components/EditTools/hooks/useSyncUpdate.hook.ts

@@ -6,7 +6,7 @@ import { ChartEnum } from '@/enums/pageEnum'
 import { SavePageEnum } from '@/enums/editPageEnum'
 import { editToJsonInterval } from '@/settings/designSetting'
 
-const { updateComponent } = useSync()
+const { updateComponent, dataSyncUpdate } = useSync()
 const chartEditStore = useChartEditStore()
 
 // 侦听器更新
@@ -15,6 +15,7 @@ const useSyncUpdateHandle = () => {
   let timer: any
   const updateFn = (e: any) => updateComponent(e!.detail, true, false)
   const syncData = async () => {
+    dataSyncUpdate && (await dataSyncUpdate())
     dispatchEvent(new CustomEvent(SavePageEnum.CHART, { detail: chartEditStore.getStorageInfo }))
   }
 

src/views/chart/hooks/useSync.hook.ts

@@ -238,7 +238,7 @@ export const useSync = () => {
   }
 
   // * 数据保存
-  const dataSyncUpdate = throttle(async () => {
+  const dataSyncUpdate = throttle(async (updateImg = true) => {
     if(!fetchRouteParamsLocation()) return
 
     let projectId = chartEditStore.getProjectInfo[ProjectInfoEnum.PROJECT_ID];
@@ -249,6 +249,9 @@ export const useSync = () => {
 
     chartEditStore.setEditCanvas(EditCanvasTypeEnum.SAVE_STATUS, SyncEnum.START)
 
+    // 异常处理：缩略图上传失败不影响JSON的保存
+    try {
+      if (updateImg) {
         // 获取缩略图片
         const range = document.querySelector('.go-edit-range') as HTMLElement
         // 生成图片
@@ -269,6 +272,10 @@ export const useSync = () => {
             indexImage: `${systemStore.getFetchInfo.OSSUrl}${uploadRes.data.fileName}`
           })
         }
+      }
+    } catch (e) {
+      console.log(e)
+    }
 
     // 保存数据
     let params = new FormData()

src/views/edit/index.vue

@@ -38,10 +38,14 @@ import { MonacoEditor } from '@/components/Pages/MonacoEditor'
 import { SavePageEnum } from '@/enums/editPageEnum'
 import { getSessionStorageInfo } from '../preview/utils'
 import type { ChartEditStorageType } from '../preview/index.d'
-import { setSessionStorage } from '@/utils'
+import { setSessionStorage, fetchRouteParamsLocation } from '@/utils'
 import { StorageEnum } from '@/enums/storageEnum'
 import { icon } from '@/plugins'
-
+import { useSync } from '@/views/chart/hooks/useSync.hook'
+import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
+import { ProjectInfoEnum } from '@/store/modules/chartEditStore/chartEditStore.d'
+const chartEditStore = useChartEditStore()
+const { dataSyncUpdate } = useSync()
 const { ChevronBackOutlineIcon, DownloadIcon } = icon.ionicons5
 const showOpenFilePicker: Function = (window as any).showOpenFilePicker
 const content = ref('')
@@ -93,6 +97,11 @@ async function updateSync() {
     const detail = JSON.parse(content.value)
     delete detail.id
     // 保持id不变
+    // 带后端版本额外处理请求
+    if (dataSyncUpdate) {
+      chartEditStore.setProjectInfo(ProjectInfoEnum.PROJECT_ID, fetchRouteParamsLocation())
+      await dataSyncUpdate(false) // JSON界面保存不上传缩略图
+    }
     window.opener.dispatchEvent(new CustomEvent(SavePageEnum.JSON, { detail }))
   } catch (e) {
     window['$message'].error('内容格式有误')