数据大屏

1. 业务场景

数据大屏是利用相应的系统来分析数据,通过图形的形式为企业提供客观、直接的数据分析结果,让业务人员和企业决策者直观面对数据背后的信息,实时监测企业数据,给予更直观的决策场景体验,助力企业数字化运营升级。

2. 操作流程

1)进入数据可视化,进入数据大屏tab,维护分组信息;

2)在二级分组名称后点击“+”【添加数据大屏】,对数据大屏进行设计;

3)创建完成后可以【编辑】数据大屏;

4)数据大屏完善后,可以点击【发布】数据大屏,则数据大屏此时可以被显示器引用播放;

5)如果数据大屏有更新,则可以点击【更新发布】;

6)如果数据大屏数据不再可以公开使用,则需要通过【隐藏】功能将数据大屏的引用权限收起,但不影响已被使用的数据大屏;

7)隐藏后可以【取消隐藏】,数据大屏恢复隐藏前的状态和功能,可以被引用 。

3. 操作流程图解

3.1 创建分组

1)操作流程:创建分组

2)操作路径:数据可视化-数据大屏-创建分组

3)点击搜索框后的「+」创建一级分组,输入一级分组名称后,点击一级分组后的「+」创建二级分组,输入二级分组名称后,此时分组创建完成,可以在二级分组下创建数据大屏

3.2 编辑分组名称

1)操作流程:选择分组-编辑分组名称

2)操作路径:数据可视化-数据大屏-编辑分组名称

3)鼠标移动至需要修改的分组上,点击出现的「编辑图标」,可以修改分组名称,修改后分组名称实时更新

3.3 删除分组

1)操作流程:选择分组-删除分组

2)操作路径:数据可视化-数据大屏-删除分组

3)鼠标移动至需要删除的分组上,当分组下无报表时出现「删除图标」,可以点击图标后删除分组,删除一级分组时对应所有的二级分组也会被删除,删除后消失,只有分组下没有数据大屏的分组才能直接删除成功

3.4 创建数据大屏

1)操作流程:选择二级分组-创建数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-创建数据大屏

3)鼠标移动至需要创建数据大屏的二级分组上,出现「+」,点击图标后=需要填写数据大屏标题

a数据大屏标题:最大支持20个字,支持汉字、数字、大小写字母、-;同个一级分组下不允许重复;

4)输入标题后进入设计页面

image.png

3.5 编辑数据大屏

1)操作流程:选择数据大屏-编辑数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-编辑数据大屏

3)只能编辑未发布或者已发布但没有被隐藏的数据大屏,且存在三种编辑情况

a. 第一种:点击数据大屏标题后的编辑图标,仅能编辑数据大屏标题;

b. 第二种:点击数据大屏中的数据大屏标题、备注后的编辑图标,可以直接编辑数据大屏标题;

c. 第三种:点击【编辑】按钮,进入数据大屏设计页面,带出已有的组件内容,编辑时的规则与创建时一致,编辑后可以点击保存进行更新,如果未保存直接返回,则编辑无效;

4)编辑后实时生效,数据大屏信息保持展示最新效果

3.6 删除数据大屏

1)操作流程:选择数据大屏-删除数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-删除数据大屏

3)未发布或者已发布但没有被隐藏的数据大屏,并且没被引用,才展示数据大屏菜单名称后的删除图标

4)删除后数据大屏消失

3.7 复制

1)操作流程:选择数据大屏-复制数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-复制数据大屏

3)点击【复制】按钮,复制成功,名称为copy of 原数据大屏标题,展示在原数据大屏分组的最后一个

3.8 发布

1)操作流程:选择数据大屏-发布数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-发布

3)选择单个未发布且没有被隐藏的数据大屏,点击【发布】按钮,数据大屏状态变为已发布,展示最近发布时间;

4)如果数据大屏发布后有更新内容,会展示的更新类型:更新数据大屏信息/更新数据大屏内容

3.9 查看最近一次发布的版本

1)操作流程:选择数据大屏-查看最近一次发布的版本

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-更新发布数据大屏

3)当数据大屏发布后有更新,在最近发布时间左侧展示【查看】,在最近发布时间下展示更新的类型,点击查看可以查看最近发布的版本

3.10 更新发布

1)操作流程:选择数据大屏-更新发布数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-更新发布数据大屏

3)选择单个已发布且没有被隐藏的数据大屏,并且该数据大屏在上次发布后有所更新,可以点击【更新发布】按钮,将最新的数据大屏内容发布至业务系统,业务系统引用的数据大屏为最新内容;

4)如果更新了内容,但未点击更新发布,则展示的仍是上次发布的数据大屏

3.11 隐藏

1)操作流程:选择数据大屏-隐藏数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-隐藏数据大屏

3)数据大屏默认不隐藏,点击数据大屏左侧的是否隐藏可以切换

a. 未发布的数据大屏,较隐藏前,不可以操作【发布】,可以【取消隐藏】;

b. 已发布的数据大屏,较隐藏前,只能操作【导出图片、导出excel、取消隐藏】;

4)隐藏后的数据大屏不可以被用于展示在其他大屏上,但不影响已经被引用的数据

3.12 取消隐藏

1)操作流程:选择数据大屏-取消隐藏数据大屏

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-取消隐藏数据大屏

3)隐藏后的数据大屏可以取消隐藏,切换是否隐藏=否,取消隐藏后,数据大屏恢复隐藏前的状态和功能,可以被引用

3.13 查看引用

1)流程:选择图表-查看被哪些报表/数据大屏/页面引用

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-更多-查看引用

3)选择具体的数据大屏,查看当前数据大屏被引用的所有信息

3.14 不允许别人编辑

1)流程:选择数据大屏-不允许别人编辑

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-更多-不允许别人编辑

3)选择自己创建的数据大屏,对数据大屏是否允许其他人编辑进行设置;如果设置为不允许,则其他人无法编辑数据大屏

3.15 不允许别人引用

1)流程:选择图表-更多-不允许别人引用

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-更多-不允许别人引用

3)选择自己创建的数据大屏,对数据大屏是否允许他人引用进行设置;如果设置为不允许,则其他人无法选择到

3.16 导出图片

1)操作流程:选择数据大屏-导出图片

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-导出图片

3)选择数据大屏后,点击【导出图片】按钮可以将当前数据大屏导出为图片

3.17 导出EXCEL

1)操作流程:选择数据大屏-导出EXCEL

2)操作路径:数据可视化-数据大屏-二级分组-数据大屏-数据大屏导出EXCEL

3)选择数据大屏后,点击【导出EXCEL】按钮可以将当前数据大屏包含的图表导出为EXCEL

4. 数据大屏设计页面

4.1 缩放自适应

1)流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)进入页面后,默认按照当前屏幕展示最适合的数据大屏尺寸,可以通过+、-进行自定义缩放,每次缩放10%

4.2 全屏

1)流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)进入页面后,设置完成,可以【全屏】查看效果,按esc退出全屏

4.3 保存

1) 流程:创建数据大屏-进入数据大屏设计页面

2) 操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3) 进入页面后,设置完成后进行保存,数据大屏保持最新内容

4.4 添加、编辑、删除组件

1)流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)可以添加图表、文本、通用标题、倒计时、时间器、图片、轮播图、视频、边框等组件;图表组件中,一个图表只能添加一次,其他组件不限制数量;

4)所有组件添加后均可进行设置样式,有编辑权限的图表组件可以通过【编辑】图标直接进入图表设计页面;

5)添加后均可删除,删除后组件不再展示在数据大屏画布中,可以重新添加

4.5 数据大屏设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)设置数据大屏时可以设置屏幕的宽高、背景颜色、背景图片、主题

a. 宽高:根据数据大屏需要投放的屏幕大小进行设置;

b. 背景颜色:当数据大屏无图片背景时可以调整背景颜色;

c. 背景图片:支持为数据大屏上传一张图片作为背景;

d. 主题模版:可任选其一,需要先选定模版后再进行设计,不然设计完后再修改模版,会清空已选组件。

image.png

4.6 图表组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)拖入图表组件,可与边框合为一体,可以设置图表的显示内容、边框信息、动画效果、刷新频率

a. 图表显示内容:展示标题、副标题、描述、标签、图例,一屏展示条数,原图表有的内容在设置展示后展示在数据大屏,原图表没有的内容设置展示后不生效;

b. 边框信息:包括边框样式、背景颜色、边框线条颜色、展示边框标题、边框标题内容、边框标题颜色、边框标题字体大小;

c. 动画效果:可以设置自动轮播,为是时可以设置结束后停顿时长、速度、切换形式;

d. 刷新频率:设置图表获取数据的频率,自动刷新、刷新频率。

4.7 文本组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)拖入文本组件后,可以输入多行文本,可以设置内容、对齐方式、字体大小、字体加粗、字体颜色、背景颜色、边框样式、文字滚动、结束后停顿、速度

4)当文字滚动开启时,文字会按照一行展示,通过设置结束后停顿和速度来控制文字滚动的效果

image.png

4.8 通用标题组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)默认根据主题展示标题的样式,可选择自定义,选择后,需要设置标题的字体大小、对齐方式、字体颜色、字体背景颜色等内容

image.png

image.png

4.9 倒计时组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)倒计时需要选择一个未来的时间

4.10 时间器组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)拖入后可以设置组件名称、字体大小等

image.png

4.11 图片组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)选择图表组件后,需要上传图片,支持上传的图片格式:bmp、jpg、jpeg、png、gif,可以为图片设置链接,点击即可跳转

image.png

4.12 轮播图组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)拖入后需要按照轮播图的图片数量上传图片,支持上传的图片格式:bmp、jpg、jpeg、png、gif,每张图都可以贴对应的链接

4)如果设置非自动轮播则需要手动切换,设置自动轮播则需要设置轮播速度和效果

image.png

4.13 视频组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)需要上传视频,支持上传的视频格式:AVI、WMV、MPEG、QuickTime、RealVideo、Flash、Mpeg-4、mkv

image.png

4.14 样式组件设置

1)操作流程:创建数据大屏-进入数据大屏设计页面

2)操作路径:数据可视化-数据大屏-创建/编辑-设计页面

3)包括边框一、二、三,以及线条、圆形、矩形的设置,用于不使用主题模版时自定义数据大屏

Oinone社区 作者:史, 昂原创文章,如若转载,请注明出处:https://doc.oinone.top/oio4/9424.html

访问Oinone官网:https://www.oinone.top获取数式Oinone低代码应用平台体验

(0)
史, 昂的头像史, 昂数式管理员
上一篇 2024年6月20日 am9:49
下一篇 2024年6月20日

相关推荐

  • 登录日志

    1. 登录日志 登录日志:记录企业成员/用户登录平台的历史明细,包括登录时间、位置、IP、登录设备、登录平台等信息,登录平台包括:PC Web、小程序、H5、APP。登录日志不需要通过审计规则订阅,平台会记录每位用户的登录日志。 操作支持导出、查看详情。

    2024年6月20日
    71100
  • 4.1.19 框架之网关协议-后端占位符

    在我们日常开发中会有碰到一些特殊场景,需要由前端来传一些如“当前用户Id”、“当前用户code”诸如此类只有后端才知道值的参数,那么后端占位符就是来解决类似问题的。如前端传${currentUserId},后端会自动替换为当前用户Id。 Step1 后端定义占位符 我们新建一个UserPlaceHolder继承AbstractPlaceHolderParser,用namespace来定义一个“currentUserId”的占位符,其对应值由value()决定为“PamirsSession.getUserId().toString()”,active要为真才有效,priority为优先级 package pro.shushi.pamirs.demo.core.placeholder; import org.springframework.stereotype.Component; import pro.shushi.pamirs.meta.api.session.PamirsSession; import pro.shushi.pamirs.user.api.AbstractPlaceHolderParser; @Component public class UserPlaceHolder extends AbstractPlaceHolderParser { @Override protected String value() { return PamirsSession.getUserId().toString(); } @Override public Integer priority() { return 10; } @Override public Boolean active() { return Boolean.TRUE; } @Override public String namespace() { return "currentUserId"; } } 图4-1-19-1 后端定义占位符 Step2 前端使用后端占位符 我们经常在o2m和m2m中会设置domain来过滤数据,这里案例就是在field中设置来过滤条件,domain="createUid == $#{currentUserId}",注意这里用的是$#{currentUserId} 而不是${currentUserId},这是前端为了区分真正变量和后端占位符,提交的时候会把#过滤掉提交。修改宠物达人表格视图的Template中search部分 <template slot="search" cols="4"> <field data="name" label="达人"/> <field data="petTalentSex" multi="true" label="达人性别"/> <field data="creater" /> <!– <field data="petShops" label="宠物商店" domain="createUid == ${activeRecord.creater.id}"/>–> <field data="petShops" label="宠物商店" domain="createUid == $#{currentUserId}"/> <field data="dataStatus" label="数据状态" multi="true"> <options> <option name="DRAFT" displayName="草稿" value="DRAFT" state="ACTIVE"/> <option name="NOT_ENABLED" displayName="未启用" value="NOT_ENABLED" state="ACTIVE"/> <option name="ENABLED" displayName="已启用" value="ENABLED" state="ACTIVE"/> <option name="DISABLED" displayName="已禁用" value="DISABLED" state="ACTIVE"/> </options> </field> <field data="createDate" label="创建时间"/> <field data="unStore" /> </template> 图4-1-19-2 前端使用后端占位符 Step3 重启看效果 请求上都带上了createUid==${currentUserId} 图4-1-19-3 示例效果

    2024年5月23日
    72800
  • 流程触发

    1. 流程触发 新增的流程设计页面默认包含两个节点,一个是流程的触发节点:确定流程开始的条件;另一个是流程结束的节点。 流程触发方式有模型触发、定时触发、日期触发三种方式,未设置流程触发方式时无法继续添加后续流程节点,同时无法进行流程发布,如左下图。触发方式设置完成后,可从左侧菜单栏拖入或流程箭头中的加号点击添加节点动作,如右下图。 1.1 模型触发 模型触发适用于模型中的数据字段变化开始流程的场景,比如员工请假审批流程。 模型触发的场景有数据的增删改,也可以对模型中的单个或多个字段进行条件筛选,若包含更新数据的场景可以设置选择更新字段,只有设置的字段更新才会触发流程,若不设置选择更新字段或者筛选条件,则模型中任一字段发生设置场景的变化时都会触发流程。 1.2 定时触发 定时触发适用于周期性调用流程的场景,比如仓库周期性盘点的流程。 需要设置一个流程第一次执行的时间,配置好循环的周期间隔。特殊的是选择周为周期时,当前周选中的日期也会执行流程。例:开始时间:2022-01-14(周四) 循环周期间隔:1周 自定义设置为周一到周五,则2022-01-15(本周五)也会执行流程操作。 1.3 日期触发 日期触发适用于模型中的日期时间字段引发流程的场景,比如给员工发生日祝福短信的流程。 设置日期触发时,若指定字段只包含日期,则必须要指定时刻,如左下图。例如给员工发生日祝福短信时根据模型中的员工生日数据获取到了执行流程的日期,需要制定开始该流程执行的具体时刻。若指定字段包含日期和时间,则不填写指定时刻时默认按照字段中的时刻开始执行流程,如右下图。例如办理业务后短信回访收集评价时根据模型中的业务完成时间,立即或延时发送短息。

    2024年6月20日
    78000
  • 4.1.4 模块之元数据详解

    介绍Module相关元数据,以及对应代码注解方式。大家还是可以通读下,以备不时之需 如您还不了解Module的定义,可以先看下2.3【oinone独特之源,元数据与设计原则】一文对Module的描述,本节主要带大家了解Module元数据构成,能让小伙伴非常清楚oinone从哪些维度来描述Module, 一、元数据说明 ModuleDefinition 元素数据构成 含义 对应注解 备注 displayName 显示名称 @Module( displayName=””, name=””, version=””, category=””, summary=””, dependencies={“”,””}, exclusions={“”,””}, priority=1L ) name 技术名称 latestVersion 安装版本 category 分类编码 summary 描述摘要 moduleDependencies 依赖模块编码列表 moduleExclusions 互斥模块编码列表 priority 排序 module 模块编码 @Module.module(“”) dsKey 逻辑数据源名 @Module.Ds(“”) excludeHooks 排除拦截器列表 @Module.Hook(excludes={“”,””}) website 站点 @Module.Advanced( website=”http://www.oinone.top”, author=”oinone”, description=”oinone”, application=false, demo=false, web=false, toBuy=false, selfBuilt=true, license=SoftwareLicenseEnum.PEEL1, maintainer=”oinone”, contributors=”oinone”, url=”http://git.com” ) author module的作者 description 描述 application 是否应用 demo 是否演示应用 web 是否web应用 toBuy 是否需要跳转到website去购买 selfBuilt 自建应用 license 许可证 默认PEEL1 可选范围: GPL2 GPL2ORLATER GPL3 GPL3ORLATER AGPL3 LGPL3 ORTHEROSI PEEL1 PPL1 ORTHERPROPRIETARY maintainer 维护者 contributors 贡献者列表 url 代码库的地址 boot 是否自动安装的引导启动项 @Boot 加上该注解代表: 启动时会自动安装,不管yml文件的modules是否配置 moduleClazz 模块定义所在类 只有用代码编写的模块才有 packagePrefix 包路径,用于扫描该模块下的其他元数据 dependentPackagePrefix 依赖模块列对应的扫描路径 state 状态 系统自动计算,无需配置 metaSource 元数据来源 publishCount 发布总次数 platformVersion 最新平台版本 本地与中心平台的版本对应。做远程更新时会用到 publishedVersion 最新发布版本 表4-1-4-1 ModuleDefinition UeModule 是对ModuleDefinition的继承,并扩展了跟前端交互相关的元数据 元素数据构成 含义 对应注解 备注 homePage Model 跳转模型编码 @UxHomepage(@UxRoute() 对应一个ViewAction,如果UxRoute只配置了模型,则默认到该模型的列表页 homePage Name 视图动作或者链接动作名称 logo 图标 @UxAppLogo(logo=””) 表4-1-4-2 UeModule 二、元数据,代码注解方式 Module Module ├── displayName 显示名称 ├── name 技术名称 ├── version 安装版本 ├── category 分类编码 ├── summary 描述摘要 ├── dependencies 依赖模块编码列表 ├── exclusions 互斥模块编码列表 ├── priority 排序 ├── module 模块编码 │ └── value ├── Ds 逻辑数据源名 │ └── value ├── Hook 排除拦截器列表…

  • 4.1.23 框架之信息传递

    在4.1.13【Action之校验】、3.4.1【构建第一个Function】等文章中,都用到PamirsSession.getMessageHub()来设置返回消息,基本上都是在传递后端逻辑判断的异常信息,而且在系统报错时也会通过它来返回错误信息,前端接收到错误信息则会以提示框的方式进行错误提示。其实后端除了可以返回错误信息以外,还可以返回调试、告警、成功、信息等级别的信息给前端。但是默认情况下前端只提示错误信息,可以通过前端的统一配置放开提示级别,有点类似后端的日志级别。 一、不同信息类型的举例 Step1 新建PetTypeAction 借用PetType模型的表格页做为信息传递的测试入口,为PetType模型新增一个ServerAction,在代码中对信息的所有类型进行模拟 package pro.shushi.pamirs.demo.core.action; import org.springframework.stereotype.Component; import pro.shushi.pamirs.demo.api.model.PetCatItem; import pro.shushi.pamirs.demo.api.model.PetType; import pro.shushi.pamirs.meta.annotation.Action; import pro.shushi.pamirs.meta.annotation.Model; import pro.shushi.pamirs.meta.api.dto.common.Message; import pro.shushi.pamirs.meta.api.session.PamirsSession; import pro.shushi.pamirs.meta.enmu.ActionContextTypeEnum; import pro.shushi.pamirs.meta.enmu.InformationLevelEnum; import pro.shushi.pamirs.meta.enmu.ViewTypeEnum; @Model.model(PetType.MODEL_MODEL) @Component public class PetTypeAction { @Action(displayName = "消息",bindingType = ViewTypeEnum.TABLE,contextType = ActionContextTypeEnum.CONTEXT_FREE) public PetType message(PetType data){ PamirsSession.getMessageHub().info("info1"); PamirsSession.getMessageHub().info("info2"); PamirsSession.getMessageHub().error("error1"); PamirsSession.getMessageHub().error("error2"); PamirsSession.getMessageHub().msg(new Message().msg("success1").setLevel(InformationLevelEnum.SUCCESS)); PamirsSession.getMessageHub().msg(new Message().msg("success2").setLevel(InformationLevelEnum.SUCCESS)); PamirsSession.getMessageHub().msg(new Message().msg("debug1").setLevel(InformationLevelEnum.DEBUG)); PamirsSession.getMessageHub().msg(new Message().msg("debug2").setLevel(InformationLevelEnum.DEBUG)); PamirsSession.getMessageHub().msg(new Message().msg("warn1").setLevel(InformationLevelEnum.WARN)); PamirsSession.getMessageHub().msg(new Message().msg("warn2").setLevel(InformationLevelEnum.WARN)); return data; } } 图4-1-23-1 为PetType模型新增一个ServerAction Step2 (前端)修改提示级别 在项目初始化时使用CLI构建初始化前端工程,在src/middleware有拦截器的默认实现,修改信息提示的默认级别为【ILevel.SUCCESS】 图4-1-23-2(前端)修改提示级别 const DEFAULT_MESSAGE_LEVEL = ILevel.SUCCESS; 图4-1-23-3(前端)修改提示级别 Step3 重启系统看效果 从页面效果中看到已经不在是只提示错误信息。从协议端看错误级别的信息是在errors下,其他级别的信息是在extensions下。 图4-1-23-4 示例效果 图4-1-23-5 系统提示的返回结果 二、MessageHub的其他说明 是实现上看MessageHub是基于GQL协议,前后端都有配套实现。同时前端还提供了订阅MessageHub的信息功能,以满足前端更多交互要求,前端MessageHub提供的订阅能力使用教程详见4.2.2前端高级特性之【框架之MessageHub】一文。

    2024年5月23日
    60500

Leave a Reply

登录后才能评论