fix: 处理 TS 报错

src/packages/index.d.ts

@@ -90,12 +90,8 @@ export interface CreateComponentType extends PublicConfigType, requestConfig {
   option: GlobalThemeJsonType
 }
 
-// 组件成组实例类 (部分属性用不到设置为 any)
+// 组件成组实例类
-export interface CreateComponentGroupType extends PublicConfigType {
+export interface CreateComponentGroupType extends CreateComponentType {
-  // 保持结构一致, 设置组件名称
-  chartConfig: {
-    title: ConfigType.title
-  }
   groupList: Array<CreateComponentType>
 }
 

src/packages/public/publicConfig.ts

@@ -1,5 +1,5 @@
 import { getUUID } from '@/utils'
-import { PublicConfigType, CreateComponentType, CreateComponentGroupType } from '@/packages/index.d'
+import { ChartFrameEnum, PublicConfigType, CreateComponentType, CreateComponentGroupType } from '@/packages/index.d'
 import { RequestConfigType } from '@/store/modules/chartEditStore/chartEditStore.d'
 import { groupTitle } from '@/settings/designSetting'
 import {
@@ -79,48 +79,30 @@ export class publicConfig implements PublicConfigType {
 }
 
 // 成组类 (部分属性不需要, 不继承 publicConfig)
-export class PublicGroupConfigClass implements CreateComponentGroupType {
+export class PublicGroupConfigClass extends publicConfig implements CreateComponentGroupType {
   // 成组
   public isGroup = true
   // 名称
   public chartConfig = {
-    title: groupTitle
+    key: 'group',
+    chartKey: 'group',
+    conKey: 'group',
+    category: 'group',
+    categoryName: 'group',
+    package: 'group',
+    chartFrame: ChartFrameEnum.COMMON,
+    title: groupTitle,
+    image: ''
   }
   // 组成员列表
   public groupList: Array<CreateComponentType> = []
   // ---- 原有 ---
+  // key
+  public key = 'group'
+  // 配置
+  public option = {}
   // 标识
   public id = getUUID()
   // 基本信息
   public attr = { w: 0, h: 0, x: 0, y: 0, zIndex: -1 }
-  // 基本样式
-  public styles = {
-    // 色相
-    hueRotate: 0,
-    // 饱和度
-    saturate: 1,
-    // 对比度
-    contrast: 1,
-    // 亮度
-    brightness: 1,
-    // 透明
-    opacity: 1,
-
-    // 旋转
-    rotateZ: 0,
-    rotateX: 0,
-    rotateY: 0,
-
-    // 倾斜
-    skewX: 0,
-    skewY: 0,
-
-    // 动画
-    animations: []
-  }
-  // 设置坐标
-  public setPosition(x: number, y: number): void {
-    this.attr.x = x
-    this.attr.y = y
-  }
 }

src/views/chart/ContentEdit/components/EditHistory/index.vue

@@ -24,8 +24,8 @@
         <n-scrollbar style="max-height: 500px">
           <div
             class="list-item go-flex-items-center go-ellipsis-1"
-            v-for="item in options"
+            v-for="(item, index) in options"
-            :key="item.key"
+            :key="index"
             :title="item.label"
           >
             <n-icon
@@ -66,6 +66,7 @@ import {
   HistoryTargetTypeEnum,
   HistoryActionTypeEnum,
 } from '@/store/modules/chartHistoryStore/chartHistoryStore.d'
+import { isArray } from 'node_modules/_@types_lodash@4.14.182@@types/lodash'
 
 const {
   DesktopOutlineIcon,
@@ -127,7 +128,6 @@ const options = computed(() => {
   const options = backStack.map((e: HistoryItemType) => {
     return {
       label: labelHandle(e),
-      key: e.id,
       icon: iconHandle(e),
     }
   })

src/views/chart/ContentEdit/index.vue

@@ -24,11 +24,11 @@
           <!-- 图表 -->
           <div v-for="(item, index) in chartEditStore.getComponentList" :key="item.id">
             <!-- 分组 -->
-            <edit-group v-if="item.isGroup" :groupData="item" :groupIndex="index"></edit-group>
+            <edit-group v-if="item.isGroup" :groupData="(item as CreateComponentGroupType)" :groupIndex="index"></edit-group>
             
             <!-- 单组件 -->
             <edit-shape-box
-              v-if="!item.isGroup"
+              v-else
               :data-id="item.id"
               :index="index"
               :style="useComponentStyle(item.attr, index)"

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

@@ -51,7 +51,7 @@ export const useSync = () => {
           // 重新创建是为了处理类种方法消失的问题
           const create = async (e: CreateComponentType, callBack?: (e: CreateComponentType) => void) => {
             // 补充 class 上的方法
-            let newComponent: CreateComponentType = await createComponent(e.chartConfig as ConfigType)
+            let newComponent: CreateComponentType = await createComponent(e.chartConfig)
             if (callBack) {
               callBack(Object.assign(newComponent, { ...e, id: getUUID() }))
             } else {
@@ -82,7 +82,7 @@ export const useSync = () => {
       } else {
         // 非组件(顺便排除脏数据)
         if (key !== 'editCanvasConfig' && key !== 'requestGlobalConfig') return
-        Object.assign((chartEditStore as any)[key], projectData[key])
+        Object.assign(chartEditStore[key], projectData[key])
       }
     }
   }

src/views/preview/components/PreviewRenderGroup/index.vue

@@ -44,8 +44,6 @@ const props = defineProps({
     required: true
   }
 })
-
-console.log(props.groupData)
 </script>
 
 <style lang="scss" scoped>

src/views/preview/components/PreviewRenderList/index.vue

@@ -13,7 +13,7 @@
     <!-- 分组 -->
     <preview-render-group
       v-if="item.isGroup"
-      :groupData="item"
+      :groupData="(item as CreateComponentGroupType)"
       :groupIndex="index"
       :themeSetting="themeSetting"
       :themeColor="themeColor"
@@ -21,6 +21,7 @@
 
     <!-- 单组件 -->
     <component
+      v-else
       :is="item.chartConfig.chartKey"
       :chartConfig="item"
       :themeSetting="themeSetting"
@@ -34,6 +35,7 @@
 import { PropType, computed } from 'vue'
 import { ChartEditStorageType } from '../../index.d'
 import { PreviewRenderGroup } from '../PreviewRenderGroup/index'
+import { CreateComponentGroupType } from '@/packages/index.d'
 import { chartColors } from '@/settings/chartThemes/index'
 import { animationsClass, getFilterStyle, getTransformStyle } from '@/utils'
 import { getSizeStyle, getComponentAttrStyle } from '../../utils'