feat: 合并标题名称功能, 解决冲突

src/store/modules/chartEditStore/chartEditStore.d.ts

@@ -75,6 +75,7 @@ export type EditCanvasType = {
 
 // 画布数据/滤镜/背景色/宽高主题等
 export enum EditCanvasConfigEnum {
+  PROJECT_NAME = 'projectName',
   WIDTH = 'width',
   HEIGHT = 'height',
   CHART_THEME_COLOR = 'chartThemeColor',
@@ -112,6 +113,8 @@ export type EditCanvasConfigType = {
   [FilterEnum.SKEW_X]: number
   [FilterEnum.SKEW_Y]: number
   [FilterEnum.BLEND_MODE]: string
+  // 大屏名称
+  [EditCanvasConfigEnum.PROJECT_NAME]?: string
   // 大屏宽度
   [EditCanvasConfigEnum.WIDTH]: number
   // 大屏高度

src/store/modules/chartEditStore/chartEditStore.ts

@@ -93,6 +93,8 @@ export const useChartEditStore = defineStore({
     // -----------------------
     // 画布属性（需存储给后端）
     editCanvasConfig: {
+      // 项目名称
+      projectName: undefined,
       // 默认宽度
       width: 1920,
       // 默认高度

src/utils/utils.ts

@@ -302,3 +302,11 @@ export const JSONParse = (data: string) => {
     return v
   })
 }
+
+/**
+ * * 修改顶部标题
+ * @param title
+ */
+export const setTitle = (title?: string) => {
+  title && (document.title = title)
+}

src/views/chart/ContentHeader/headerTitle/index.vue

@@ -29,9 +29,9 @@
 <script setup lang="ts">
 import { ref, nextTick, computed, watchEffect } from 'vue'
 import { ResultEnum } from '@/enums/httpEnum'
-import { fetchRouteParamsLocation, httpErrorHandle } from '@/utils'
+import { fetchRouteParamsLocation, httpErrorHandle, setTitle } from '@/utils'
 import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
-import { ProjectInfoEnum } from '@/store/modules/chartEditStore/chartEditStore.d'
+import { ProjectInfoEnum, EditCanvasConfigEnum } from '@/store/modules/chartEditStore/chartEditStore.d'
 import { updateProjectApi } from '@/api/path'
 import { useSync } from '../../hooks/useSync.hook'
 import { icon } from '@/plugins'
@@ -50,8 +50,12 @@ watchEffect(() => {
 })
 
 const comTitle = computed(() => {
-  title.value = title.value && title.value.replace(/\s/g, '')
+  // eslint-disable-next-line vue/no-side-effects-in-computed-properties
-  return title.value.length ? title.value : fetchRouteParamsLocation()
+  title.value = title.value.replace(/\s/g, '')
+  const newTitle = title.value.length ? title.value : '新项目'
+  setTitle(`工作空间-${newTitle}`)
+  chartEditStore.setEditCanvasConfig(EditCanvasConfigEnum.PROJECT_NAME, newTitle)
+  return newTitle
 })
 
 const handleFocus = () => {

src/views/edit/index.vue

@@ -26,7 +26,7 @@
             lineNumbers: 'on',
             minimap: { enabled: true }
           }"
-      />
+        />
       </n-layout-content>
     </n-layout>
   </div>
@@ -38,7 +38,7 @@ 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, fetchRouteParamsLocation, JSONStringify, JSONParse } from '@/utils'
+import { setSessionStorage, fetchRouteParamsLocation, JSONStringify, JSONParse, setTitle } from '@/utils'
 import { StorageEnum } from '@/enums/storageEnum'
 import { icon } from '@/plugins'
 import { useSync } from '@/views/chart/hooks/useSync.hook'
@@ -51,7 +51,8 @@ const showOpenFilePicker: Function = (window as any).showOpenFilePicker
 const content = ref('')
 // 从sessionStorage 获取数据
 async function getDataBySession() {
-  const localStorageInfo: ChartEditStorageType = await getSessionStorageInfo() as unknown as ChartEditStorageType
+  const localStorageInfo: ChartEditStorageType = (await getSessionStorageInfo()) as unknown as ChartEditStorageType
+  setTitle(`编辑-${localStorageInfo.editCanvasConfig.projectName}`)
   content.value = JSONStringify(localStorageInfo)
 }
 setTimeout(getDataBySession)

src/views/preview/suspenseIndex.vue

@@ -35,7 +35,7 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 import { PreviewRenderList } from './components/PreviewRenderList'
-import { getFilterStyle, routerTurnByName, getSessionStorage } from '@/utils'
+import { getFilterStyle, routerTurnByName, getSessionStorage, setTitle } from '@/utils'
 import { getEditCanvasConfigStyle, getSessionStorageInfo } from './utils'
 import { PageEnum } from '@/enums/pageEnum'
 import { StorageEnum } from '@/enums/storageEnum'
@@ -50,6 +50,7 @@ const storageList: ChartEditStorageType[] = getSessionStorage(
 )
 
 const localStorageInfo = await getSessionStorageInfo() as unknown as ChartEditStorageType
+setTitle(`预览-${localStorageInfo.editCanvasConfig.projectName}`)
 
 // @ts-ignore
 if(localStorageInfo.isRelease === false) {