diff --git a/src/datax-designlib-config.ts b/src/datax-designlib-config.ts index 47c6a78..1e09e63 100644 --- a/src/datax-designlib-config.ts +++ b/src/datax-designlib-config.ts @@ -8,7 +8,7 @@ interface DesignTemplate { description?: string; // 模板描述 previewImage?: string; // 模板预览图 // 模板包含的组件 - components: ScreenDesignTimeConfig["components"]; + components: ScreenDesignTimeConfig["dataComponents"]; // 模板包含的分组信息 groups: ScreenDesignTimeConfig["groups"]; // 模板可能依赖的变量 diff --git a/src/datax-screen-config.ts b/src/datax-screen-config.ts index e0623bb..6e41986 100644 --- a/src/datax-screen-config.ts +++ b/src/datax-screen-config.ts @@ -1,5 +1,7 @@ // 大屏设计时的配置,可以被导出/导入 +// 由于设计了反馈组件,因此大屏需要携带id字段 export interface ScreenDesignTimeConfig { + id: string; // 大屏样式 style: { width: number; @@ -7,16 +9,16 @@ export interface ScreenDesignTimeConfig { background: string; stretchMode: string; // 拉伸模式 }; - // 组件配置 + // 数据组件配置 // 可以支持组件包含子组件 - components: Array<{ + dataComponents: Array<{ id: string; // 组件id(唯一) type: string; // 组件类型 name: string; // 组件名称(可由用户定义) groupId?: string; // 组件所在分组ID(如果存在) zIndex?: number; // 组件在分组中的层级 parentId?: string; // 组件的父组件ID(如果存在) - children: ScreenDesignTimeConfig["components"]; // 子组件 + children: ScreenDesignTimeConfig["dataComponents"]; // 子组件 // 设计时属性,运行时会忽略 design: { hidden: boolean; @@ -140,6 +142,18 @@ export interface ScreenDesignTimeConfig { name: string; payload: string; // (data: any, variables: any) => Promise }>; + // 反馈组件配置 + // 可以认为反馈组件也是一个大屏,不过反馈组件在设计时不会直接显示到大屏上,而是在图层面板中会有“数据组件”、“反馈组件”等多个Tab, + // “反馈组件”Tab面板中会显示所有的反馈组件,当用户点击某个反馈组件时,会进入一个新的大屏设计器(反馈组件设计器), + // 用户可以在反馈组件设计器中设计反馈组件的样式和行为。 + // 反馈组件设计器中也会有一个“保存”按钮,用户可以点击该按钮将设计好的反馈组件保存到当前大屏中。 + feedbackComponents: Array<{ + id: string; + name: string; + style: ScreenDesignTimeConfig['style']; + dataComponents: ScreenDesignTimeConfig['dataComponents']; + // feedbackComponents: ScreenDesignTimeConfig['feedbackComponents']; // 是否允许反馈组件中包含反馈组件,即实现类似多对话框的效果 + }>; } // 组件的分类: @@ -147,4 +161,4 @@ export interface ScreenDesignTimeConfig { // 2. 控制组件:大屏中的悬浮组件,可拖拽,贴边时可隐藏,比如一个控制面版用于操作摄像机/录像机等设备 // 3. 反馈组件:弹窗(全局,带遮罩) -export interface ScreenRuntimeConfig {} +export interface ScreenRuntimeConfig { }