一种网页报表模板的生成方法、装置、设备和介质制造方法及图纸

技术编号:38128474 阅读:12 留言:0更新日期:2023-07-08 09:34
本申请提供了一种网页报表模板的生成方法、装置、设备和介质,该方法包括:获取目标报表模板的表格样式数据和表格字段数据;基于表格样式数据在画布区域进行渲染,得到目标报表模板的初始表格;基于表格字段数据中的每个字段,生成每个字段的字段图标,并将字段图标显示在字段显示区域;针对字段显示区域中的每个字段图标,响应针对字段图标的拖拽操作,控制字段图标随着拖拽操作进行移动;针对字段显示区域中的每个字段图标,响应拖拽操作的结束,根据拖拽操作所控制的字段图标所在的位置,将字段图标的字段与目标单元格进行关联;根据画布区域中每个单元格所关联的字段和目标报表模板的表格样式数据,生成目标报表模板的模板数据。数据。数据。

【技术实现步骤摘要】
一种网页报表模板的生成方法、装置、设备和介质


[0001]本申请涉及报表设计领域,具体而言,涉及一种网页报表模板的生成方法、装置、设备和介质。

技术介绍

[0002]随着互联网技术的普及,各行各业的企业用户往往会通过超级文本标记语言(Hyper Text Markup Language,HTML)页面中的HTML报表来展示不同类型数据。在现有技术中,网页报表通常需要开发人员根据用户需求,手动编写代码来生成的,并需要为不同的单元格配置不同的字段(比如,表头、编辑功能等),然而在实际应用场景中,不同的企业、同一企业的不同部门、甚至是不同的运行设备,所需要的网页报表的形式可能会存在差异,通常都会需要开发人员提供符合不同形式的网页报表,而由于不同的网页报表需要编写不同的代码,这对开发人员的专业性有较高的要求,而且开发人员需要编写的代码会很多,因此工作效率较低。

技术实现思路

[0003]有鉴于此,本申请的目的在于提供一种网页报表模板的生成方法、装置、设备和介质,用于解决现有技术中生成网页报表的效率较低的问题。
[0004]第一方面,本申请实施例提供了一种网页报表模板的生成方法,应用于终端设备,所述终端设备中包括一网页界面,所述网页界面包括画布区域和字段显示区域,包括:获取目标报表模板的表格样式数据和表格字段数据;基于所述表格样式数据在画布区域进行渲染,得到目标报表模板的初始表格;所述初始表格中包括多个单元格;基于所述表格字段数据中的每个字段,生成每个字段的字段图标,并将所述字段图标显示在所述字段显示区域;针对所述字段显示区域中的每个字段图标,响应针对所述字段图标的拖拽操作,控制所述字段图标随着所述拖拽操作进行移动;针对所述字段显示区域中的每个字段图标,响应所述拖拽操作的结束,根据所述拖拽操作所控制的字段图标所在的位置,确定所述字段图标的字段需要关联的目标单元格,并将所述字段图标的字段与所述目标单元格进行关联;根据所述画布区域中每个单元格所关联的字段和所述目标报表模板的表格样式数据,生成所述目标报表模板的模板数据。
[0005]可选的,针对所述字段显示区域中的每个字段图标,响应针对所述字段图标的拖拽操作,控制所述字段图标随着所述拖拽操作进行移动,包括:针对所述字段显示区域中的每个字段图标,响应所述拖拽操作选中所述字段图标,根据所述字段图标的字段的属性信息在所述画布区域中确定推荐关联单元格,并将所述推荐关联单元格进行突出显示。
[0006]可选的,根据所述画布区域中每个单元格所关联的字段和所述目标报表模板的表格样式数据,生成所述目标报表模板的模板数据,包括:根据所述画布区域中每个单元格所关联的字段的属性信息,将所述画布区域中的每个单元格划分为不同的渲染层级;以所述画布区域中的每个单元格为最小节点,根据每个单元格所属的渲染层级,构建所述画布区域的图层渲染结构;根据所述画布区域中每个单元格所关联的字段、所述目标报表模板的表格样式数据和所述画布区域的图层渲染结构,生成所述目标报表模板的模板数据。
[0007]可选的,针对所述字段显示区域中的每个字段图标,响应所述拖拽操作的结束,根据所述拖拽操作所控制的字段图标所在的位置,确定所述字段图标的字段需要关联的目标单元格,包括:针对所述字段显示区域中的每个字段图标,响应所述拖拽操作的结束,根据所述拖拽操作所控制的字段图标所在的位置,以及所述字段图标的字段对应属性信息中的计算规则,确定所述字段图标的字段需要关联的目标单元格;所述计算规则涉及到至少两个单元格对应数据之间的运算。
[0008]可选的,所述方法还包括:响应所述字段图标的字段与所述目标单元格的关联完成,则在所述字段显示区域中为所述字段图标设置已用标识;响应针对设置有已用标识的字段图标的拖拽操作,所述字段图标不随所述拖拽操作进行移动。
[0009]可选的,所述方法还包括:响应所述字段图标的字段与所述目标单元格的关联取消,则在所述字段显示区域中将设置已用标识的所述字段图标恢复为原始状态。
[0010]可选的,所述表格字段数据包括多个字段,每个字段有对应的属性信息;所述属性信息包括以下信息中的任意一种或多种:字段标签、字段所对应的计算规则、字段所对应的数据显示区域。
[0011]第二方面,本申请实施例提供了一种网页报表模板的生成装置,应用于终端设备,所述终端设备中包括一图形用户界面,所述图形用户界面包括画布区域和字段显示区域,包括:获取模块,用于获取目标网页报表的表格样式数据和表格字段数据;渲染模块,用于基于所述表格样式数据在画布区域进行渲染,得到目标网页报表的初始表格;所述初始表格中包括多个单元格;生成模块,用于基于所述表格字段数据中的每个字段,生成每个字段的字段图标,并将所述字段图标显示在所述字段显示区域;拖拽模块,用于针对所述字段显示区域中的每个字段图标,响应针对所述字段图标的拖拽操作,控制所述字段图标随着所述拖拽操作进行移动;关联模块,用于针对所述字段显示区域中的每个字段图标,响应所述拖拽操作的结束,根据所述拖拽操作所控制的字段图标所在的位置,确定所述字段图标的字段需要关联的目标单元格,并将所述字段图标的字段与所述目标单元格进行关联;
生成模块,用于根据所述画布区域中每个单元格所关联的字段,生成所述目标网页报表的网页报表模板。
[0012]第三方面,本申请实施例提供了一种计算机设备,包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序,所述处理器执行所述计算机程序时实现上述方法的步骤。
[0013]第四方面,本申请实施例提供了一种计算机可读存储介质,所述计算机可读存储介质上存储有计算机程序,所述计算机程序被处理器运行时执行上述方法的步骤。
[0014]本申请实施例提出的网页报表模板的生成方法,首先,获取目标报表模板的表格样式数据和表格字段数据;基于所述表格样式数据在画布区域进行渲染,得到目标报表模板的初始表格;所述初始表格中包括多个单元格;基于所述表格字段数据中的每个字段,生成每个字段的字段图标,并将所述字段图标显示在所述字段显示区域;其次,针对所述字段显示区域中的每个字段图标,响应针对所述字段图标的拖拽操作,控制所述字段图标随着所述拖拽操作进行移动;针对所述字段显示区域中的每个字段图标,响应所述拖拽操作的结束,根据所述拖拽操作所控制的字段图标所在的位置,确定所述字段图标的字段需要关联的目标单元格,并将所述字段图标的字段与所述目标单元格进行关联;最后,根据所述画布区域中每个单元格所关联的字段和所述目标报表模板的表格样式数据,生成所述目标报表模板的模板数据。
[0015]在某些实施例中,通过视图化的方式显示出需要进行添加字段的空白表格,以及需要向空白表格中添加的字段,然后通过拖拽操作,实现字段与表格的单元格的关联,最后形成网页报表对应的数据,不需要开发人员在编辑代码的过程中通过手动编辑代码将字段与单元格进行关联,减少了因开发人员的失误而导致的报表显示出问题的情况,且通过这种方式生成目标报表模板,不需要开发人员编辑所有的代码,对开发本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种网页报表模板的生成方法,其特征在于,应用于终端设备,所述终端设备中包括一网页界面,所述网页界面包括画布区域和字段显示区域,包括:获取目标报表模板的表格样式数据和表格字段数据;基于所述表格样式数据在画布区域进行渲染,得到目标报表模板的初始表格;所述初始表格中包括多个单元格;基于所述表格字段数据中的每个字段,生成每个字段的字段图标,并将所述字段图标显示在所述字段显示区域;针对所述字段显示区域中的每个字段图标,响应针对所述字段图标的拖拽操作,控制所述字段图标随着所述拖拽操作进行移动;针对所述字段显示区域中的每个字段图标,响应所述拖拽操作的结束,根据所述拖拽操作所控制的字段图标所在的位置,确定所述字段图标的字段需要关联的目标单元格,并将所述字段图标的字段与所述目标单元格进行关联;根据所述画布区域中每个单元格所关联的字段和所述目标报表模板的表格样式数据,生成所述目标报表模板的模板数据。2.根据权利要求1所述的方法,其特征在于,针对所述字段显示区域中的每个字段图标,响应针对所述字段图标的拖拽操作,控制所述字段图标随着所述拖拽操作进行移动,包括:针对所述字段显示区域中的每个字段图标,响应所述拖拽操作选中所述字段图标,根据所述字段图标的字段的属性信息在所述画布区域中确定推荐关联单元格,并将所述推荐关联单元格进行突出显示。3.根据权利要求1所述的方法,其特征在于,根据所述画布区域中每个单元格所关联的字段和所述目标报表模板的表格样式数据,生成所述目标报表模板的模板数据,包括:根据所述画布区域中每个单元格所关联的字段的属性信息,将所述画布区域中的每个单元格划分为不同的渲染层级;以所述画布区域中的每个单元格为最小节点,根据每个单元格所属的渲染层级,构建所述画布区域的图层渲染结构;根据所述画布区域中每个单元格所关联的字段、所述目标报表模板的表格样式数据和所述画布区域的图层渲染结构,生成所述目标报表模板的模板数据。4.根据权利要求1所述的方法,其特征在于,针对所述字段显示区域中的每个字段图标,响应所述拖拽操作的结束,根据所述拖拽操作所控制的字段图标所在的位置,确定所述字段图标的字段需要关联的目标单元格,包括:针对所述字段显示区域中的每个字段图标,响应所述拖拽操作的结束,根据所述拖拽操作所控制的字段图标所在的位置,以及所述字段图标的字段对应属性信息中的计算规则,确定所述字...

【专利技术属性】
技术研发人员:贾新胡道光郝康
申请(专利权)人:北京拓普丰联信息科技股份有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1