[发明专利]一种基于浏览器的可视化页面生成和浏览方法

说明书

本发明公开了一种基于浏览器的可视化页面生成和浏览方法，包括步骤：1）数据集配置，配置基于浏览器的可视化页面需要的数据集，确定数据集数据结构、获取来源及动态参数；2）可视化界面设计，配置页面布局组件和展示组件；3）脚本编写，编写页面交互逻辑和业务处理逻辑脚本，完成交互响应处理；4）页面生成，保存并生成页面模板文件；5）页面浏览，解析页面模板文件生成应用页面。本发明页面编辑基于浏览器操作无需安装，可视化操作减少编码工作；简化页面组件联动实现方法，将传统通过编码方式实现事件的方法，转变为通过配置组件间联动关系实现，快速高效、无需编码。

技术领域

本发明涉及电网调度自动化技术领域，具体涉及一种基于浏览器的可视化页面生成和浏览方法。

背景技术

随着浏览器技术的发展，在现今的电网调度自动化系统中，传统的C/S架构的页面编辑和浏览方式，难以满足业务需求的快速变化，以及对运行环境的轻量化要求。电网调度自动化系统基于Web的应用功能，在现场投运时，往往需要根据本地化用户需求，对页面布局、样式等展示效果进行适应调整，传统编码方式面临开发周期长、功能代码固化、现场工程难以维护等问题，需要开发人员根据现场需求修改原有代码和重新调试，再投运现场进行测试，很难快速响应用户本地化需求，也加重了产品研发人员的负担。

发明内容

为解决现有技术中的不足，本发明提供一种基于浏览器的可视化页面生成和浏览方法，产品研发人员可以基于拖拽以可视化方式实现页面设计，工程人员可以在现场以可视化方式调整页面布局和样式，快速响应用户本地化需求，满足电网调度自动化系统Web应用的高效开发和易于维护的要求，解决了传统编码方式面临开发周期长、功能代码固化、现场工程难以维护的问题。

为了实现上述目标，本发明采用如下技术方案：一种基于浏览器的可视化页面生成和浏览方法，其特征在于：包括步骤：

1）数据集配置，配置基于浏览器的可视化页面需要的数据集，确定数据集数据结构、获取来源及动态参数；

2）基于浏览器实现可视化界面设计，配置页面布局组件和展示组件；

3）脚本编写，编写页面交互逻辑和业务处理逻辑脚本，完成交互响应处理；

4）页面生成，保存并生成页面模板文件；

5）页面浏览，解析页面模板文件生成应用页面。

前述的一种基于浏览器的可视化页面生成和浏览方法，其特征是：所述数据集数据结构确定了数据集的数据模型；所述数据集获取来源包括静态数据、异步请求动态数据、数据库数据；所述动态参数包括数据获取的动态参数变量名称、数据类型信息。

前述的一种基于浏览器的可视化页面生成和浏览方法，其特征是：所述步骤2）具体步骤为：拖拽页面布局组件，完成页面布局设计；拖拽页面展示组件到布局组件中相应位置，配置展示组件属性，关联数据集，设置交互事件和联动事件，实现页面多组件间联动；配置页面展示组件显示，设计页面整体样式。

前述的一种基于浏览器的可视化页面生成和浏览方法，其特征是：所述页面多组件间联动实现方法为：配置组件联动事件及其输出参数，关联组件输入参数映射关系，组件发生变化时，触发关联组件刷新操作，实现页面不同组件间的联动。

前述的一种基于浏览器的可视化页面生成和浏览方法，其特征是：所述页面模板文件包括显示模板区、逻辑脚本区、显示样式区；显示模板区按照组件层次结构保存；逻辑脚本区保存数据集配置、组件模型定义、组件数据关联、组件界面交互逻辑脚本，显示样式区，保存页面模板内各组件展示样式配置。

前述的一种基于浏览器的可视化页面生成和浏览方法，其特征是：所述步骤5）具体步骤为：

1）解析显示模板区组件层次结构，实现对布局组件和展示组件的解析；生成组件树静态对象模型，组件树静态对象模型用于描述页面模板文件显示模板区组件层次结构；