Merge branch 'dev'

src/views/chart/ContentConfigurations/components/ChartData/components/ChartDataMonacoEditor/index.vue

@@ -150,7 +150,7 @@ const filterRes = computed(() => {
   } catch (error) {
     // eslint-disable-next-line vue/no-side-effects-in-computed-properties
     errorFlag.value = true
-    return '过滤函数错误'
+    return `过滤函数错误，日志：${error}`
   }
 })
 

src/views/chart/index.vue

@@ -14,8 +14,10 @@
         </template>
       </layout-header-pro>
       <n-layout-content content-style="overflow:hidden; display: flex">
-        <content-charts></content-charts>
-        <content-layers></content-layers>
+        <div style="overflow:hidden; display: flex">
+          <content-charts></content-charts>
+          <content-layers></content-layers>
+        </div>
         <content-configurations></content-configurations>
       </n-layout-content>
     </n-layout>

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

@@ -9,6 +9,7 @@
       ...getFilterStyle(item.styles),
       ...getTransformStyle(item.styles),
       ...getStatusStyle(item.status),
+      ...getPreviewConfigStyle(item.preview),
       ...getBlendModeStyle(item.styles) as any
     }"
   >
@@ -28,7 +29,7 @@
 import { PropType } from 'vue'
 import { CreateComponentGroupType } from '@/packages/index.d'
 import { animationsClass, getFilterStyle, getTransformStyle, getBlendModeStyle } from '@/utils'
-import { getSizeStyle, getComponentAttrStyle, getStatusStyle } from '../../utils'
+import { getSizeStyle, getComponentAttrStyle, getStatusStyle, getPreviewConfigStyle } from '../../utils'
 import { useLifeHandler } from '@/hooks'
 
 const props = defineProps({
@@ -54,6 +55,5 @@ const props = defineProps({
 <style lang="scss" scoped>
 .chart-item {
   position: absolute;
-  overflow: hidden;
 }
 </style>

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

@@ -2,13 +2,14 @@
   <div
     class="chart-item"
     v-for="(item, index) in localStorageInfo.componentList"
-    :class="[animationsClass(item.styles.animations), !item.isGroup && 'hidden']"
+    :class="animationsClass(item.styles.animations)"
     :key="item.id"
     :style="{
       ...getComponentAttrStyle(item.attr, index),
       ...getFilterStyle(item.styles),
       ...getTransformStyle(item.styles),
       ...getStatusStyle(item.status),
+      ...getPreviewConfigStyle(item.preview),
       ...getBlendModeStyle(item.styles) as any
     }"
   >
@@ -43,7 +44,7 @@ import { PreviewRenderGroup } from '../PreviewRenderGroup/index'
 import { CreateComponentGroupType } from '@/packages/index.d'
 import { chartColors } from '@/settings/chartThemes/index'
 import { animationsClass, getFilterStyle, getTransformStyle, getBlendModeStyle } from '@/utils'
-import { getSizeStyle, getComponentAttrStyle, getStatusStyle } from '../../utils'
+import { getSizeStyle, getComponentAttrStyle, getStatusStyle, getPreviewConfigStyle } from '../../utils'
 import { useLifeHandler } from '@/hooks'
 
 // 初始化数据池
@@ -78,8 +79,5 @@ onMounted(() => {
 <style lang="scss" scoped>
 .chart-item {
   position: absolute;
-  &.hidden {
-    overflow: hidden;
-  }
 }
 </style>

src/views/preview/utils/style.ts

@@ -3,6 +3,7 @@ import { EditCanvasConfigType } from '@/store/modules/chartEditStore/chartEditSt
 
 type AttrType = PickCreateComponentType<'attr'>
 type StatusType = PickCreateComponentType<'status'>
+type PreviewConfig = PickCreateComponentType<'preview'>
 
 // 设置位置
 export const getComponentAttrStyle = (attr: AttrType, index: number) => {
@@ -29,6 +30,17 @@ export const getStatusStyle = (attr: StatusType) => {
   }
 }
 
+// 设置预览配置样式
+export const getPreviewConfigStyle = (previewConfig: PreviewConfig) => {
+  const previewStyle: Partial<CSSStyleDeclaration> = {}
+  if (previewConfig) {
+    if (previewConfig.overFlowHidden) {
+      previewStyle.overflow = 'hidden'
+    }
+  }
+  return previewStyle
+}
+
 // 全局样式
 export const getEditCanvasConfigStyle = (canvas: EditCanvasConfigType) => {
   // 背景