diff --git a/src/views/preview/components/PreviewRenderGroup/index.vue b/src/views/preview/components/PreviewRenderGroup/index.vue index d5bdf767..62b9b22a 100644 --- a/src/views/preview/components/PreviewRenderGroup/index.vue +++ b/src/views/preview/components/PreviewRenderGroup/index.vue @@ -7,7 +7,8 @@ :style="{ ...getComponentAttrStyle(item.attr, groupIndex), ...getFilterStyle(item.styles), - ...getTransformStyle(item.styles) + ...getTransformStyle(item.styles), + ...getStatusStyle(item.status) }" > @@ -38,7 +39,7 @@ 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' +import { getSizeStyle, getComponentAttrStyle, getStatusStyle } from '../../utils' const props = defineProps({ localStorageInfo: { diff --git a/src/views/preview/utils/style.ts b/src/views/preview/utils/style.ts index 8392c348..6cd25cba 100644 --- a/src/views/preview/utils/style.ts +++ b/src/views/preview/utils/style.ts @@ -2,7 +2,7 @@ import { PickCreateComponentType } from '@/packages/index.d' import { EditCanvasConfigType } from '@/store/modules/chartEditStore/chartEditStore.d' type AttrType = PickCreateComponentType<'attr'> -type StylesType = PickCreateComponentType<'styles'> +type StatusType = PickCreateComponentType<'status'> // 设置位置 export const getComponentAttrStyle = (attr: AttrType, index: number) => { @@ -16,10 +16,17 @@ export const getComponentAttrStyle = (attr: AttrType, index: number) => { // 设置大小 export const getSizeStyle = (attr: AttrType, scale?: number) => { - return ({ + return { width: `${scale ? scale * attr.w : attr.w}px`, height: `${scale ? scale * attr.h : attr.h}px` - }) + } +} + +// 设置状态样式 +export const getStatusStyle = (attr: StatusType) => { + return { + display: attr.hide ? 'none' : 'block' + } } // 全局样式