fix: 修改类型报错

src/packages/components/Informations/Mores/Image/index.ts

@@ -6,11 +6,12 @@ import { ChatCategoryEnum,ChatCategoryEnumName } from '../../index.d'
 
 export const ImageConfig: ConfigType = {
   key: 'VImage',
+  conKey: 'VCImage',
   title: '图片',
   category: ChatCategoryEnum.MORE,
   categoryName: ChatCategoryEnumName.MORE,
   package: PackagesCategoryEnum.INFORMATION,
-  node: Image,
+  node: () => Image,
   conNode: () => Configuration,
   image
 }

src/packages/components/Informations/Mores/TextCloud/index.ts

@@ -6,11 +6,12 @@ import { ChatCategoryEnum,ChatCategoryEnumName } from '../../index.d'
 
 export const TextCloudConfig: ConfigType = {
   key: 'VTextCloud',
+  conKey: 'VCTextCloud',
   title: '词云',
   category: ChatCategoryEnum.MORE,
   categoryName: ChatCategoryEnumName.MORE,
   package: PackagesCategoryEnum.INFORMATION,
-  node: TextCloud,
+  node: () => TextCloud,
   conNode: () => Configuration,
   image
 }

src/packages/components/Informations/Texts/TextCommon/index.ts

@@ -6,11 +6,12 @@ import { ChatCategoryEnum,ChatCategoryEnumName } from '../../index.d'
 
 export const TextCommonConfig: ConfigType = {
   key: 'VText',
+  conKey: 'VCText',
   title: '文字',
   category: ChatCategoryEnum.TEXT,
   categoryName: ChatCategoryEnumName.TEXT,
   package: PackagesCategoryEnum.INFORMATION,
-  node: TextCommon,
+  node: () => TextCommon,
   conNode: () => Configuration,
   image
 }

src/packages/components/Informations/Titles/TitleBevelAngle/index.ts

@@ -6,11 +6,12 @@ import { ChatCategoryEnum,ChatCategoryEnumName } from '../../index.d'
 
 export const TitleBevelAngleConfig: ConfigType = {
   key: 'VTitleBevelAngle',
+  conKey: 'VCTitleBevelAngle',
   title: '斜角标题',
   category: ChatCategoryEnum.TITLE,
   categoryName: ChatCategoryEnumName.TITLE,
   package: PackagesCategoryEnum.INFORMATION,
-  node: TitleBevelAngle,
+  node: () => TitleBevelAngle,
   conNode: () => Configuration,
   image
 }

src/packages/components/Informations/Titles/TitleCommon/index.ts

@@ -6,11 +6,12 @@ import { ChatCategoryEnum,ChatCategoryEnumName } from '../../index.d'
 
 export const TitleCommonConfig: ConfigType = {
   key: 'VText',
+  conKey: 'VCText',
   title: '普通标题',
   category: ChatCategoryEnum.TITLE,
   categoryName: ChatCategoryEnumName.TITLE,
   package: PackagesCategoryEnum.INFORMATION,
-  node: TitleCommon,
+  node: () => TitleCommon,
   conNode: () => Configuration,
   image
 }

src/packages/components/Informations/Titles/TitlePro/index.ts

@@ -6,11 +6,12 @@ import { ChatCategoryEnum,ChatCategoryEnumName } from '../../index.d'
 
 export const TitleProConfig: ConfigType = {
   key: 'VTitlePro',
+  conKey: 'VCTitlePro',
   title: '中心标题',
   category: ChatCategoryEnum.TITLE,
   categoryName: ChatCategoryEnumName.TITLE,
   package: PackagesCategoryEnum.INFORMATION,
-  node: TitlePro,
+  node: () => TitlePro,
   conNode: () => Configuration,
   image
 }

src/packages/components/Tables/Tables/TableCategory/index.ts

@@ -6,11 +6,12 @@ import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d'
 
 export const TableCategoryConfig: ConfigType = {
   key: 'VTableCategory',
+  conKey: 'VCableCategory',
   title: '归类表格',
   category: ChatCategoryEnum.TABLE,
   categoryName: ChatCategoryEnumName.TABLE,
   package: PackagesCategoryEnum.TABLES,
-  node: TableCategory,
+  node: () => TableCategory,
   conNode: () => Configuration,
   image
 }

src/packages/components/Tables/Tables/tableCommon/index.ts

@@ -6,11 +6,12 @@ import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d'
 
 export const TableCommonConfig: ConfigType = {
   key: 'VTableCommon',
+  conKey: 'VCTableCommon',
   title: '表格',
   category: ChatCategoryEnum.TABLE,
   categoryName: ChatCategoryEnumName.TABLE,
   package: PackagesCategoryEnum.TABLES,
-  node: TableCommon,
+  node: () => TableCommon,
   conNode: () => Configuration,
   image
 }

src/plugins/customComponents.ts

@@ -10,15 +10,16 @@ import { CreateComponentType } from '@/packages/index.d'
  * @param app
  */
 export const setupPreviewPackages = (app: App) => {
-  if(!document.location.hash.includes('preview')) return
-  const localStorageInfo = getLocalStorageInfo()
-  if(!localStorageInfo) return
-  localStorageInfo.componentList.forEach(async (e: CreateComponentType) => {
-    if (!app.component(e.key)) {
-      const chart = fetchChartComponent(e.chartConfig)
-      app.component(e.key, chart)
-    }
-  })
+  if (document.location.hash.includes('preview')) {
+    const localStorageInfo = getLocalStorageInfo()
+    if (!localStorageInfo) return
+    localStorageInfo.componentList.forEach(async (e: CreateComponentType) => {
+      if (!app.component(e.key)) {
+        const chart = fetchChartComponent(e.chartConfig)
+        app.component(e.key, chart)
+      }
+    })
+  }
 }
 
 /**

src/views/chart/HeaderLeftBtn/index.vue

@@ -24,16 +24,16 @@
 import { toRefs, Ref, reactive } from 'vue'
 import { renderIcon, goDialog, goHome } from '@/utils'
 import { icon } from '@/plugins'
-const { LayersIcon, BarChartIcon, PrismIcon, HomeIcon } = icon.ionicons5
 import { useChartLayoutStore } from '@/store/modules/chartLayoutStore/chartLayoutStore'
 import { ChartLayoutStoreEnum } from '@/store/modules/chartLayoutStore/chartLayoutStore.d'
 import { useRemoveKeyboard } from '../hooks/useKeyboard.hook'
 
+const { LayersIcon, BarChartIcon, PrismIcon, HomeIcon } = icon.ionicons5
 const { setItem } = useChartLayoutStore()
 const { getLayers, getCharts, getDetails } = toRefs(useChartLayoutStore())
 
-type ItemType = {
-  key: string
+interface ItemType {
+  key: ChartLayoutStoreEnum
   select: Ref<boolean> | boolean
   title: string
   icon: any

src/views/preview/hooks/useStyle.hook.ts

@@ -1,4 +1,5 @@
 import { PickCreateComponentType } from '@/packages/index.d'
+import { EditCanvasConfigType } from '@/store/modules/chartEditStore/chartEditStore.d'
 
 type AttrType = PickCreateComponentType<'attr'>
 
@@ -19,3 +20,12 @@ export const useSizeStyle = (attr: AttrType, scale?: number) => {
   }
   return sizeStyle
 }
+
+export const useEditCanvasConfigStyle = (canvas: EditCanvasConfigType) => {
+  return {
+    position: 'relative',
+    width: canvas.width ? `${canvas.width || 100}px` : '100%',
+    height: canvas.height ? `${canvas.height}px` : '100%',
+    border: '1px solid red'
+  }
+}

src/views/preview/index.vue

@@ -17,6 +17,7 @@ import { usePreviewScale } from '@/hooks/index'
 import { RenderList } from './components/RenderList/index'
 import { ChartEditStorageType } from './index.d'
 import { getLocalStorageInfo } from './utils/index'
+import { useEditCanvasConfigStyle } from './hooks/useStyle.hook'
 
 const previewRef = ref()
 
@@ -25,13 +26,8 @@ const localStorageInfo: ChartEditStorageType = getLocalStorageInfo() as ChartEdi
 const width = ref(localStorageInfo?.editCanvasConfig.width)
 const height = ref(localStorageInfo?.editCanvasConfig.height)
 
-const previewRefStyle = computed(() => {
-  return {
-    position: 'relative',
-    width: width.value ? `${width.value || 100}px` : '100%',
-    height: height.value ? `${height.value}px` : '100%',
-    border: '1px solid red'
-  }
+const previewRefStyle: any = computed(() => {
+  return useEditCanvasConfigStyle(localStorageInfo.editCanvasConfig)
 })
 
 if (!localStorageInfo) {

src/views/preview/utils/index.ts

@@ -6,6 +6,7 @@ export interface ChartEditStorageType extends ChartEditStorage {
   id: string
 }
 
+// 根据路由 id 获取存储数据的信息
 export const getLocalStorageInfo = () => {
   const urlHash = document.location.hash
   const toPathArray = urlHash.split('/')