一种自动搭建页面并即时发布的方法及系统
文献发布时间:2023-06-19 11:35:49
技术领域
本发明涉及Web系统领域,具体涉及一种能够快速搭建系统页面及大屏页面,并绑定数据即时发布的方法,一种自动搭建页面并即时发布的方法及系统。
背景技术
应用系统软件模式主要有两种,一种是Client/Server客户端与服务器模式(以下简称“CS模式”),此种模式的具体形式是在手机或者计算机上安装客户端程序,然后通过客户端与服务器间的通讯来实现软件的功能。另一种是Browser/Server浏览器与服务器模式(以下简称“BS模式”),具体的形式就是通过使用浏览器打开网页,通过网页的形式实现软件的功能,一个核心的点就是通过浏览器作为代理进行交互。因为BS模式不用安装程序,并且可以跨平台使用,所以是目前应用软件的主要形式。
目前的应用管理系统都是按照用户的前期需求定制化开发的,因此,一旦开发完成,是不能自定义修改功能,即如果用户产生需求变化或者有新的需求,则需要重新开发系统,这样在无形之中都会给用户增加额外的成本,并且降低了用户的工作效率,当应用系统用户需求变化就需要重新开发或者修改系统。已有的快速搭建页面的方式大部分为搭建完成后再引用页面的方式,或者生成页面,再打包部署的方式,这样虽然已经简化了开发流程,但是还是存在一定局限性,并不能即时搭建即时使用。
因此,研制一种用户能够自主定制业务页面,并连接数据即时就可在应用系统使用,对于需求可能产生变化或者经常会有新需求的应用系统用户有着重要的意义。
发明内容
本发明的目的在于克服上述技术缺陷,提供即时搭建即时使用的系统。
为了实现上述目的,本发明提出了一种自动搭建页面并即时发布的方法,所述方法包括:
连接数据源,获得需求应用数据;
搭建页面,并将业务组件和数据源进行绑定;
发布搭建好的页面,并根据需求设置页面用户权限。
作为上述方法的一种改进,所述连接数据源,获得需求应用数据,具体包括:
选择数据库类型;
选择数据库配置信息,包括数据库主机名称、端口号、数据库名称、用户名和密码;
连接数据库,判断是否连接成功,未连接成功,则需要重新选择数据库配置信息;否则,选择数据库中的多个数据表;
选择设计选项,查看上述选择的数据表列表,以及每个列表的字段名称及中文解释。
作为上述方法的一种改进,所述方法还包括:查看数据表信息:选择详情中的查询选项,通过sql语句,进行数据库查询,并在页面显示即时结果。
作为上述方法的一种改进,所述连接数据源,获得需求应用数据,具体包括:
选择服务注册方式;所述服务注册方式包括:通过web服务方式导入,通过配置文件方式导入和通过手动添加方式导入;
当选择通过web服务方式导入,则填写获得所有接口信息的web服务接口,测试成功后,可成功导入;
当选择通过配置文件方式导入,则上传符合文件格式的接口信息json文件,读取成功后,可成功导入;
当选择通过手动添加方式导入,则手工添加所需数据接口信息,一次性添加多个接口,成功保存到数据接口信息;
导入成功后,选择导入的数据接口,进行接口测试,填写相应的数据接口请求信息,在页面查看到接口反馈数据结果。
作为上述方法的一种改进,所述搭建页面,并将业务组件和数据源进行绑定,具体包括:
输入新建页面名称,选择页面背景,或者选择导入模板;
选择页面布局,创建页面;
配置页面的背景及样式属性;
根据需求,拖入布局组件,配置页面详细布局,这里的布局组件为响应式组件,保证生成页面可适配不同浏览器大小;
根据业务需求,通过拖拉拽的方式,在布局的网格中,拖入封装好的业务组件;
在页面脚本中,按照需求编写详细的响应事件函数;
根据用户需求,详细修改配置每个组件的样式属性,还可以绑定响应事件,即选择上述编写的事件函数;
对于需要请求数据的业务组件,选择获取到的数据源并进行配置绑定,详细选择需要展示的数据源的具体字段。
作为上述方法的一种改进,所述发布搭建好的页面,具体包括:
选择配置发布页面选项,包括发布页面的目录层级、页面的节点ID、发布页面的标题和图标;
对配置好的页面进行发布。
作为上述方法的一种改进,所述根据需求设置页面用户权限,具体包括:
配置每个角色所应有的页面权限;
为用户配置不同权限角色;
对于发布的页面,根据配置结果,不同用户具有不同的展示权限。
本发明还提供了一种自动搭建页面并即时发布的系统,所述系统包括:数据连接管理模块、页面搭建模块、页面发布模块和权限控制模块,
所述数据连接管理模块,用于连接数据库及数据接口,作为页面搭建模块的数据源;
所述页面搭建模块,用于搭建页面,并将业务组件和数据源进行绑定;
所述页面发布模块,用于发布搭建好的页面;
所述权限控制功能模块,用于实现已经发布投入使用的页面的权限管理,包括:用户自身的发布页面权限控制和用户管理员发布页面权限控制,用户自身的发布页面权限控制包括已发布页面的发布、下架及删除;用户管理员发布页面权限控制包括:管理多个用户,并对每个用户的页面权限应用权限进行控制。
作为上述系统的一种改进,数据连接管理模块包括:
数据库连接管理子模块,用于连接指定的数据库,并选择数据库中具体的数据表,以及表中的数据字段,作为页面搭建模块的数据源;
接口连接管理子模块,用于查看已注册的数据接口,根据接口的要求,配置数据接口的请求参数和请求类型,在页面中即时显示测试结果;还用于将数据接口注册到本系统中,有两种注册方式,第一种是导入配置文件的方式,将规定格式的接口服务配置文件直接导入到系统中,第二种是通过数据接口的方式,连接可获取数据接口信息的数据服务,将获得的数据解析存入到系统中。
作为上述系统的一种改进,所述页面搭建模块包括:
页面管理功能子模块,用于实现对页面包括创建、模板选择、已创建页面管理在内的基础管理功能;
小工具功能子模块,用于实现页面搭建组件选择功能,包含容器部件、通用部件、数据展示、基础部件、图表部件、地图部件、三维模型七大类组件;
行业应用功能子模块,用于实现快速搭建成熟的行业应用页面,包括时空云、林业云、航天信息、大为交通、贵州农业、海南旅游、装备监测云、人脸识别八大类的行业应用;
页面搭建子功能,用于实现页面可视化布局搭建功能,组件样式属性及事件属性更改功能。
本发明的优点在于:
1、本发明的方法在页面搭建功能方面,利用已封装好的各类组件,以及封装好的行业内成熟的应用,可快速搭建出符合用户需求的应用页面,并且采用图形化的方式,避免了代码编写开发,即使非开发人员也能根据需求自行搭建,极大的节约了时间成本与开发成本;
2、本发明的方法在页面发布功能方面,不同于传统的将页面搭建完成之后,在其它系统再引用的方式,或者打包重新发布的方式,而是在应用页面搭建完成之后可直接在系统内发布使用,并可根据需求设置制作的应用页面的目录层级,这使得的应用页面使用更加方便,避免了专业开发人员或者运维人员的工作;
3、本发明在数据连接功能方面,采用两种数据获得方式,一是数据库数据获取的方式,二是数据接口获取的方式,兼容性更强,数据绑定选择更加多样化。
附图说明
图1是本发明的数据库数据源获取流程图;
图2是本发明的数据接口数据源获取流程图;
图3是本发明的页面搭建流程图;
图4是本发明的用户对页面权限控制流程图;
图5是本发明的系统管理员对页面权限控制流程图。
具体实施方式
现结合附图对本发明的叫技术方案作进一步的描述。
本发明提供了一种自动搭建页面并即时发布的方法,包括:
第一步,连接数据源,获得需求应用数据;
数据源获取流程分为两种,一种是通过连接数据库获得,一种是通过连接数据库接口获得。
如图1所示,通过数据库获取数据源包括如下步骤:
步骤1-1、点击创建数据库按钮,选择数据库类型;
步骤1-2、选择数据库配置信息,包括数据库主机名称、端口号、数据库名称、用户名、密码等;
步骤1-3、连接数据库,判断是否连接成功,如不成功,需要重新填写配置信息;
步骤1-4、选择数据库中的数据表,可选择多个表;
步骤1-5、等待读取完成,确认后提交;
步骤1-6、选择创建数据库,选择查看详情;
步骤1-7、选择设计选项、可查看上述选择的数据表列表,以及每个列表的字段名称及中文解释。
如需要查看更加详细的数据表信息,可以选择详情中的查询选项,通过些sql语句,来做简单的数据库查询,可在页面显示即时结果。
如图2所示,通过数据接口获取数据源包括如下步骤:
步骤2-1、选择服务注册,选择服务注册方式;
步骤2-2、共有三种注册方式可供选择,分别为通过web服务方式导入,通过配置文件方式导入,通过手动添加服务。选择通过web服务方式,需要填写获得所有接口信息的web服务接口,测试成功后,可成功导入;选择配置文件方式,需要上传符合文件格式的接口信息json文件,读取成功后,可成功导入;选择手动添加方式导入,可手工添加所需数据接口信息,可一次性添加多个接口,成功保存到数据接口信息。
步骤2-3、导入成功后,选择导入的数据接口,可进行接口测试,填写相应的数据接口请求信息,可及时在页面查看到接口反馈数据结果。
通过两种方式都可以获取数据,从而作为下一步页面搭建过程数据组件的数据源。
第二步,页面搭建,并将数据组件绑定数据源;
页面搭建流程是本发明的核心之一,这里列举主要步骤,其详细配置信息不一一解释,如图3所示,具体包括如下步骤:
步骤3-1、点击创建网页页面;
步骤3-2、输入新建页面名称,选择页面背景,或者选择导入模板;
步骤3-3、选择页面布局,创建页面;
步骤3-4、可配置页面的背景及样式属性;
步骤3-5、根据需求,拖入布局组件,配置页面详细布局,这里的布局组件为响应式组件,保证生成页面可适配不同浏览器大小;
步骤3-6、根据业务需求,通过拖拉拽的方式,在布局的网格中,拖入封装好的工具组件,例如数据展示组件,图表组件等;
步骤3-7、可以在页面脚本中,按照需求编写详细的响应事件函数;
步骤3-8、根据用户需求,可详细修改配置每个组件的样式属性,例如颜色、大小等,也可以绑定响应事件,即选择上述编写的事件函数;
步骤3-9、对于需要请求数据的组件,例如图表等,可配置绑定数据源,有两种数据源,分别为数据库以及数据接口,选择前面已经获取到的数据源,可详细选择需要展示的数据源的具体字段;
步骤3-10、对于整体页面,需要更加详细的样式修改,可通过样式面板,编写样式函数,绑定页面中具体的模块;
步骤3-11、可点击预览按钮,查看整体搭建页面的效果。
第三步,页面搭建完成之后,发布页面,并根据需求设置页面用户权限。
页面搭建完成之后,可对搭建页面进行保存及发布操作,本发明是即时创建即时发布的模式,操作简单方便用户。其主要流程分为两个层面,首先是用户内部,对单个页面显示、隐藏、删除操作,其次是用户管理员,对多个用户的页面权限控制。先介绍用户内部控制页面的具体步骤,如图4所示,具体步骤如下:
步骤4-1、点击保存已搭建好的页面;
步骤4-2、点击发布需要使用的页面;
步骤4-3、选择配置发布页面选项,包括发布页面的目录层级、页面的节点ID、发布页面的标题、图标等内容;
步骤4-4、点击发布;
步骤4-5、配置页面是否显示,隐藏或者删除。
页面发布之后,用户管理员,可根据需求,对不同的用户设置不同的展示权限,如图5所示,具体步骤如下:
步骤5-1、点击角色管理;
步骤5-2、点击权限管理,选择对应角色所应有的页面功能权限;
步骤5-3、点击用户管理,可为用户配置不同权限角色;
步骤5-4、确定修改,则新发布的页面,根据配置结果,对不同用户具有不同的展示权限。
本发明还提供了一种自动搭建页面并即时发布的系统,实现快速搭建,并能够即时使用,同时能够控制已搭建页面的权限的功能,包括:数据连接管理模块、页面搭建模块和权限控制模块,其中,
数据连接管理模块用于连接数据库及数据接口,作为页面搭建组件的数据源,主要分为两大部分。一是数据库连接管理功能模块,主要包括:数据库连接管理功能,用于已连接数据库的连接查看、删除以及增加数据表的功能;数据库连接功能,用于连接指定的数据库,并选择数据库中具体的数据表,以及表中的数据字段,作为页面搭建组件的数据源。二是接口连接管理功能模块,主要包括:接口服务连接管理功能,用于已注册的数据接口的查看,删除以及测试连接的功能,在测试连接功能中,可以根据接口的要求,配置数据接口的请求参数,请求类型,可在页面中即时显示测试结果;服务注册功能,用于数据接口注册到本系统中,有两种注册方式,第一种是导入配置文件的方式,将规定格式的接口服务配置文件直接导入到系统中,第二种是通过数据接口的方式,连接可获取数据接口信息的数据服务,将获得的数据解析存入到系统中。
所述页面搭建模块包括:页面管理功能模块,用于实现对页面包括创建、模板选择、已创建页面管理在内的基础管理功能;小工具功能模块,用于实现页面搭建组件选择功能,包含容器部件、通用部件、数据展示、基础部件、图表部件、地图部件、三维模型七大类组件;行业应用功能模块,用于实现快速搭建成熟的行业应用页面,包括时空云、林业云、航天信息、大为交通、贵州农业、海南旅游、装备监测云、人脸识别八大类的行业应用;页面搭建功能,包括页面可视化布局搭建功能,组件样式属性及事件属性更改功能,页面基本编辑修改功能,页面在线样式属性编写功能,页面在线事件编写功能,以及保存及发布功能。
权限控制功能模块用于已经发布投入使用的页面的权限管理,主要分为两部分,一是用户自身的发布页面权限控制,包括已发布页面的发布、下架及删除功能;二是用户管理员发布页面权限控制,作为用户管理员,管理多个用户,对于每个用户的页面权限应用权限可进行控制。
最后所应说明的是,以上实施例仅用以说明本发明的技术方案而非限制。尽管参照实施例对本发明进行了详细说明,本领域的普通技术人员应当理解,对本发明的技术方案进行修改或者等同替换,都不脱离本发明技术方案的精神和范围,其均应涵盖在本发明的权利要求范围当中。
- 一种自动搭建页面并即时发布的方法及系统
- 基于Html5的可视化展示页面自动发布方法及系统