Skip to content

交互相关

简介

交互相关控件列表提供了一套丰富的界面元素,旨在满足不同场景下的用户交互需求。这些控件包括用于数据输入、选择、导航、链接以及日期处理的工具,它们共同构成了一个多功能的界面设计工具集,旨在提升用户的操作便利性和系统的响应效率。通过这些控件,开发者可以构建直观、高效的用户界面,以适应各种应用场景。
容器内配备了多种独特的显示控件,您可以通过点击或拖拽操作将它们放置到页面上,并根据需要调整它们的大小和样式,以实现多样化的功能。 交互相关

基础属性

以下图为例,每种控件都配备了基础属性,这些属性可以根据具体需求进行调整。除此之外,每种控件还拥有一些特定的属性,它们的功能和用途通常可以通过属性名称直观理解。对于那些前面带有⊙符号的属性,您既可以为它们设定一个固定的值,也可以将它们与变量进行绑定(点击⊙进入变量绑定界面),以实现动态的数据交互和显示。 交互属性
在基础属性部分,我们设计了一个“更多配置”的折叠按钮。当您点击并展开这个按钮时,可以对控件的权限进行细致的设置,包括控制权限和查看权限两种类型。此外,您还可以在这里调整一些其他的基本信息属性。这样的设计旨在提供更灵活的权限管理,同时保持界面的整洁和用户操作的便捷性。 交互更多配置
每个控件都支持添加组件,以实现特定的属性和功能。为了更深入地了解如何使用这些组件,请参考 动态组件 部分内容。 交互添加组件

交互控件/数据集联动图表

交互控件和图表可以相互关联,通过交互内容的选择动态切换图表显示的内容。常用的有通过日期选择器在图表中显示某天的历史数据、通过下拉框选择不同设备的数据在图表中的数据显示等。
通过现有的数据集表或原始数据处理后的数据集表,绑定到图表中显示,数据集表表头有多种分类选项,这些选项都和交互控件绑定作为数据在图表中显示的筛选值使用。操作流程可以参照如下内容:
1、以“数据源”上传表为例,也可以选择“数据集”内处理好后的表格,详细可参考 数据处理导入数据源表 2、打开画面编辑器,创建数据图表,并绑定数据集。 创建数据图表 3、添加交互控件,并绑定数据集,完成联动。 交互控件和图表联动 通过以上操作,可以完成交互控件和图表之间的联动显示。

控件列表

输入框

单行输入框允许用户输入或编辑单个数据项。

使用场景:

数据输入: 用户可以通过单行输入框输入特定的参数或命令,比如设置温度、压力等工艺参数的阈值。
命令执行: 操作员可以输入控制命令,如启动或停止设备,这些命令会被系统解析并执行相应的操作。
状态查询: 用户可能需要输入特定的查询条件,如设备ID或时间戳,以检索历史数据或监控记录。
配置修改: 在系统配置或参数设置中,单行输入框可以用来修改设备的配置参数,如设定报警级别或调整自动化流程的参数。
用户验证: 在需要身份验证的场景中,单行输入框可以用于输入用户名、密码或其他身份验证信息。
手动数据录入: 在自动化程度不高的环节,操作员可能需要手动输入数据,如设备维护记录或异常事件的描述。
快速搜索: 在有大量数据需要浏览时,单行输入框可以作为搜索框,帮助用户快速定位到特定的数据条目。

单行输入框

多行输入框

多行输入框通常用于输入或编辑较长的文本数据。

使用场景:

数据输入与编辑: 允许用户输入多行文本,例如在配置设备参数或编写程序时输入较长的命令或脚本。
日志记录: 在SCADA系统中,多行输入框可以用来显示或输入系统日志,方便用户查看系统运行状态和故障诊断。
配置信息: 用户可以通过多行输入框输入或修改系统的配置信息,如网络设置、设备连接参数等。
用户指令: 在需要用户输入复杂指令或多条指令的场景下,多行输入框提供了足够的空间来输入这些信息。
数据显示: 多行输入框还可以用于显示从设备或传感器收集的大量数据,如温度、压力、流量等参数的实时数据。
交互式编程: 在某些SCADA系统中,用户可能需要编写或修改控制逻辑,多行输入框为此提供了一个交互式的编程环境。
报警和事件处理: 在处理报警和事件时,多行输入框可以用来记录详细的事件信息,包括时间、地点、原因和处理措施。
用户反馈: 用户可以通过多行输入框提供反馈或建议,这对于系统的改进和优化非常有用。

多行输入框

单选列表

单选列表的作用主要是提供一组互斥的选项供用户选择。

使用场景:

状态选择: 允许用户选择设备的当前状态,如“启动”或“停止”。
模式设置: 用户可以通过单选列表选择不同的操作模式,如“自动”或“手动”。
参数配置: 在配置参数时,单选列表可以用来选择不同的参数值,如“高”、“中”、“低”。
故障诊断: 在记录或报告故障时,单选列表可以用来选择故障类型或原因。

单选列表

多选列表

选列表的作用是允许用户从一组选项中选择多个项目。

使用场景:

批量监控设备状态: 用户可以通过多选列表选择多个设备,以便同时监控这些设备的运行状态。
配置多个参数: 在需要设置多个参数或条件时,用户可以利用多选列表快速选择所需的选项,例如选择多个报警阈值或配置多个设备的启动参数。
数据筛选: 在处理大量数据时,多选列表可以用于筛选特定的数据集,如选择特定的传感器数据进行分析。
批量控制操作: 用户可以通过多选列表选择多个控制对象,然后执行批量控制命令,如同时开启或关闭多个设备。
灵活的数据处理: 在需要对不同的数据点进行不同处理的情况下,多选列表提供了一种灵活的方式来选择特定的数据点。
用户权限管理: 在设置用户权限时,多选列表可以用于选择用户可以访问或操作的多个系统功能或数据点。
事件日志管理: 在查看系统事件日志时,多选列表可以用于选择多个事件类型,以便快速定位和分析特定类型的事件。

多选列表

复选框

复选框的作用是允许用户从一组选项中选择一个或多个项目。与单选列表不同,复选框支持多重选择,使得用户能够根据需要进行灵活的选择。

使用场景:

功能启用/禁用: 用户可以通过复选框选择启用或禁用特定功能,例如开启报警、日志记录或数据采集。
设备选择: 在需要对多个设备进行操作时,复选框可以让用户选择多个设备,以便同时进行监控或控制。
参数设置: 用户可以通过复选框选择多个参数配置选项,如选择多个传感器类型或数据采集频率。
报警管理: 在设置报警条件时,复选框可以用于选择多个报警类型或条件,以便用户自定义报警策略。
数据筛选: 在数据分析或报告生成时,复选框可以让用户选择多个数据项进行筛选和显示。
用户权限管理: 在设置用户权限时,复选框可以用于选择用户可以访问的多个功能或模块。
事件记录: 用户可以选择多个事件类型进行记录或查看,方便进行故障分析和管理。

复选框

单选框

单选框允许用户在一组选项中选择一个或多个选项,与复选框不同的是,单选框通常用于表示二元状态,即“选中”或“未选中”。

使用场景:

二元状态控制: 单选框可以用来控制设备的二元状态,例如开启或关闭某个设备,或者启用某个功能。
配置设置: 用户可以通过单选框来配置系统的某些设置,比如启用或禁用报警通知、数据记录等。
条件选择: 在某些情况下,单选框可以用来选择特定的条件或参数,比如选择特定的数据采集间隔或报警阈值。
状态指示: 单选框可以用来显示某个设备或系统的状态,比如是否在线、是否在运行等。
用户偏好: 用户可以通过单选框来设置个人偏好,比如选择是否在界面上显示某些信息或图表。
权限管理: 在权限设置中,单选框可以用来授予或撤销用户对特定资源的访问权限。
数据标记: 在处理数据时,单选框可以用来标记特定的数据点,比如选择需要进一步分析的数据记录。

单选框

竖向菜单栏

竖向菜单栏垂直排列了一系列的菜单项或选项,允许用户通过点击来访问不同的功能、数据视图或系统设置。

使用场景:

数功能导航: 竖向菜单栏提供了一种直观的方式来组织和访问系统的不同功能模块,如实时监控、历史数据、报警管理等。
数据视图切换: 用户可以通过竖向菜单栏快速切换不同的数据视图,例如,从当前的设备状态视图切换到趋势图或事件日志视图。
设备和传感器管理: 在需要管理大量设备和传感器的SCADA系统中,竖向菜单栏可以帮助用户快速定位和选择特定的设备或传感器进行监控或配置。
系统配置和设置: 竖向菜单栏可以包含系统设置的快捷方式,如用户权限、系统参数配置、报警阈值设置等,方便用户进行系统级的配置。
帮助和支持: 竖向菜单栏还可以提供对系统帮助文档、在线支持或用户手册的快速访问。
状态和信息显示: 在某些设计中,竖向菜单栏可以包含状态指示器或信息显示,如当前系统状态、用户登录信息等。
操作记录: 在需要记录用户操作的SCADA系统中,竖向菜单栏可以包含操作日志的访问选项,方便审计和监控用户活动。

竖向菜单栏

横向菜单栏

横向菜单栏提供了一种直观的方式来组织和访问系统的不同功能模块。

使用场景和介绍:

快速导航: 横向菜单栏允许用户快速切换到系统的不同部分,如实时监控、历史趋势、报警列表、配置设置等。
功能访问: 用户可以通过点击菜单栏上的不同选项来访问相应的功能,例如启动或停止设备、查看报表、执行诊断等。
状态指示: 横向菜单栏上的某些菜单项可以显示系统状态,如当前的运行模式、系统健康状态或者是否有待处理的报警。
用户友好: 水平布局的菜单栏符合大多数用户从左到右的阅读习惯,使得操作更加直观和用户友好。
空间利用: 横向菜单栏可以有效地利用屏幕的顶部或底部空间,尤其是在宽屏显示器上,这样可以避免过多的垂直滚动。
多任务处理: 在需要同时处理多个任务或监控多个数据流时,横向菜单栏可以让用户轻松地在不同任务之间切换。
定制和扩展: 横向菜单栏可以根据需要定制和扩展,以包含更多的功能模块或适应特定的业务流程。

横向菜单栏

下拉框

下拉框允许用户从一组预定义的选项中选择一个。下拉框通过提供一个可展开的列表,使得用户可以选择一个选项,同时保持界面的整洁。

使用场景:

选择设备或传感器: 用户可以通过下拉框选择要监控或控制的具体设备或传感器。
参数配置: 在需要设置设备参数时,下拉框可以提供一组预设的参数值供用户选择,如选择不同的采样率或操作模式。
数据视图切换: 用户可以通过下拉框选择不同的数据视图,例如在实时监控界面和历史数据界面之间切换。
时间范围选择: 在需要对数据进行时间筛选时,下拉框可以提供常见的时间范围选项,如“过去1小时”、“过去24小时”等。
报警级别设置: 用户可以通过下拉框选择报警的级别,如“低”、“中”、“高”,以配置报警系统。
用户权限管理: 在设置用户权限时,下拉框可以用于选择用户可以访问的资源或操作的权限级别。
单位转换: 在需要进行单位转换的情况下,下拉框可以提供不同的单位选项,如从摄氏度转换为华氏度。
语言和地区设置: 下拉框还可以用于选择界面语言或地区设置,以适应不同用户的需求。

下拉框

多选下拉框

多选下拉框允许用户从一组选项中选择多个项目。

使用场景:

批量操作: 用户可以一次性选择多个设备或传感器进行监控、配置或控制,例如同时启动或停止多个设备。
数据筛选: 在处理大量数据时,多选下拉框可以用于选择多个数据类别或参数,以便用户可以快速筛选出感兴趣的数据集。
配置多个参数: 用户可以通过多选下拉框选择多个配置参数,例如在设置系统报警时选择多个报警条件。
用户权限设置: 在用户权限管理中,多选下拉框可以用于选择用户可以访问的多个资源或操作,从而简化权限分配过程。
事件和报警管理: 用户可以利用多选下拉框选择多个事件或报警类型,以便于查看、分析或响应。
报表生成: 在生成报表时,多选下拉框可以让用户选择多个数据字段或时间范围,以定制报表内容。
界面定制: 多选下拉框可以根据用户的需求和界面设计进行定制,以适应不同的操作和显示要求。

多选下拉框

超链接

超链接是允许用户通过点击文本跳转到另一个页面。

使用场景:

快速访问: 超链接可以提供快速访问系统的不同部分或外部资源,如操作手册、在线帮助、技术支持等。
文档和报表: 用户可以通过点击超链接直接打开或下载相关的技术文档、用户手册、报表或分析结果。
远程资源: 超链接可以用来链接到远程服务器上的资源,如云存储中的备份数据、在线数据库或实时信息源。
系统诊断: 在系统出现故障时,超链接可以指向故障诊断工具或故障排除指南,帮助用户快速定位和解决问题。
配置和更新: 超链接可以用于访问系统的配置页面或软件更新,方便用户进行系统维护和升级。
用户指南: 超链接可以链接到用户指南或最佳实践文档,帮助新用户快速熟悉系统操作。
报警和通知: 在报警或通知发生时,超链接可以提供更多详细信息,或直接链接到报警处理页面。
集成第三方服务: 超链接可以用于集成第三方服务,如天气预报、市场分析等,为SCADA系统提供额外的信息支持。

超链接

年 / 年月 / 年月日

年 / 年月 / 年月日这三种时间选择器限制用户只能选择特定的日期或日期范围。

使用场景:

特定时间点数据访问: 固定日期选择器可以用于访问特定日期的数据,例如,用户可能只能查看或操作某个特定日期的设备记录或监控数据。
历史数据分析: 在需要分析特定日期或日期范围的历史数据时,固定日期选择器可以确保用户选择的是正确的时间点或时间段。
事件和报警处理: 在处理特定日期发生的事件或报警时,固定日期选择器可以帮助用户精确地定位到这些事件,以便进行进一步的分析和响应。
维护和校验: 在设备维护和校验过程中,如果需要回顾特定日期的运行数据,固定日期选择器可以确保用户只能选择这些特定的日期。
数据一致性: 在进行数据比较或趋势分析时,固定日期选择器可以确保用户在不同的数据集中选择相同的日期,从而保持数据的一致性。
用户界面友好性: 即使日期是固定的,提供选择器界面仍然比让用户直接输入日期更加友好,因为它减少了输入错误的可能性。
自动化任务调度: 在自动化任务需要在特定日期执行时,固定日期选择器可以用于设置这些任务的执行时间。

年月日

年区间 / 年月区间 /年月日区间

年区间 / 年月区间 /年月日区间这三种时间区间选择器主要用于用户在特定时间范围内进行数据查询、报表生成、事件记录和分析等操作。

使用场景:

数据查询: 用户可以通过这些日期选择器来选择特定的时间范围,从而查询在该时间段内收集的监控数据或事件日志,帮助用户快速定位到感兴趣的数据段进行分析。
报表生成: 在生成日报表、月报表或年报表时,用户可以通过日期选择器来指定报表的时间范围,以便系统能够提供精确的数据分析和统计信息。
事件记录: SCADA系统会记录各种操作和报警事件,用户可以通过日期选择器来筛选特定日期或时间段的事件记录,以便于进行事后分析和审计。
时间序列分析: 在进行时间序列分析时,用户可能需要查看特定日期或时间段内的数据趋势,日期选择器提供了一种方便的方式来选择这些时间点。
维护和校验: 在设备维护和校验过程中,可能需要回顾特定日期的运行数据,日期选择器可以帮助用户快速定位到这些数据。
用户界面友好性: 提供直观的日期选择界面,提高用户操作的便捷性和用户体验,用户可以通过简单的点击和选择来输入日期,而不需要手动输入日期格式。
自动化处理: 在某些自动化处理流程中,可能需要根据日期来触发特定的任务或工作流程,日期选择器可以作为用户输入界面的一部分,以设定这些自动化任务的执行时间。

年月日区间

树形控件

树形控件是一个始终可见的界面元素,主要是以结构化的方式展示层次化的数据,使得复杂的系统信息更加直观和易于管理。

使用场景:

设备和传感器管理: 树形控件可以展示工厂中不同设备和传感器的层次结构,允许用户快速导航到特定的设备或传感器进行监控或配置。
数据视图组织: 在处理大量数据时,树形控件可以帮助用户组织和分类数据视图,使用户能够轻松地找到并查看特定数据集。
系统状态导航: 树形控件可以用于展示系统状态的不同层面,如系统、子系统、设备等,用户可以通过展开或折叠树节点来查看详细的状态信息。
操作日志和审计: 在需要记录用户操作和系统事件时,树形控件可以展示操作日志的层次结构,便于用户进行审计和回溯。
配置和设置: 树形控件可以用于系统配置和设置,允许用户通过树形结构来访问和修改系统参数,提高配置的效率和准确性。
报警和事件管理: 在报警和事件管理中,树形控件可以展示不同级别的报警和事件,使用户能够快速识别和响应关键问题

树形控件

树形下拉框

树形下拉框是一种节省空间的下拉菜单,仅在点击时展开显示层级数据,主要是以结构化的方式展示层次化的数据,使得复杂的系统信息更加直观和易于管理。

使用场景:

层次化数据展示: 树形下拉框可以展示具有父子关系的数据,如设备层级、组织结构等,使用户能够清晰地看到数据之间的层级关系。
数据选择与操作: 用户可以通过树形下拉框选择特定的数据节点进行操作,如配置、监控或控制,这种结构化的选择方式提高了操作的准确性和效率。
状态监控: 在监控系统中,树形下拉框可以展示设备的运行状态,用户可以通过展开不同的节点来查看具体设备的状态信息。
导航与定位: 树形下拉框可以作为导航工具,帮助用户在复杂的系统中快速定位到特定的数据或功能模块。
配置管理: 在需要对系统或设备进行配置时,树形下拉框可以提供清晰的路径,引导用户进行设置,如网络参数、用户权限等。
报警和事件管理: 在处理报警和事件时,树形下拉框可以帮助用户快速识别和响应不同级别或类别的报警。
数据筛选: 用户可以通过树形下拉框筛选特定的数据集,如选择特定的传感器数据进行分析。

树形下拉框

SCADA帮助文档