一种客户端网页的生成方法技术

本申请提供了一种客户端网页的生成方法，方法包括：显示网页编辑界面；通过针对至少一个目标网页组件所执行的拖拽操作，将至少一个目标网页组件放置在画布区域；针对每个目标网页组件，响应于针对该目标网页组件执行的选择操作，在组件属性配置区域显示与该目标网页组件对应的多个属性配置项；响应于针对每个属性配置项执行的配置操作，生成与该目标网页组件对应的属性配置数据并保存；根据各目标网页组件对应的属性配置数据，在画布区域上渲染出各目标网页组件，以形成客户端网页。本申请通过对不同类型网页组件针对性提供不同的属性配置项，以按需求对不同网页组件进行个性化配置形成针对不同活动的客户端页面，实现无代码的个性化页面定制。个性化页面定制。个性化页面定制。

【技术实现步骤摘要】
一种客户端网页的生成方法


[0001]本申请涉及网页设计
，尤其涉及一种客户端网页的生成方法。

技术介绍

[0002]在当前技术中，开发网页页面时，每个客户针对页面设计的业务需求是不同的，具体开发实施中，往往需要在了解用户实际需求后，编写大量的代码以完成页面开发，降低开发效率的同时，也存在较高的开发成本。

技术实现思路

[0003]有鉴于此，本申请的目的在于至少提供一种客户端网页的生成方法，通过针对不同类型网页组件针对性提供不同的属性配置项，以按需求对不同网页组件进行个性化配置形成针对不同活动的客户端页面，实现无代码的个性化页面定制。
[0004]本申请主要包括以下几个方面：
[0005]第一方面，本申请实施例提供一种客户端网页的生成方法，方法包括：
[0006]响应于针对目标网页节点发出的网页创建请求，显示网页编辑界面，网页编辑界面包括画布区域、组件库区域以及组件属性配置区域，组件库区域包括多个网页组件；通过针对至少一个目标网页组件所执行的拖拽操作，将至少一个目标网页组件放置在画布区域；针对每个目标网页组件，响应于针对该目标网页组件执行的选择操作，在组件属性配置区域显示与该目标网页组件对应的多个属性配置项；针对每个目标网页组件，响应于针对每个属性配置项执行的配置操作，生成与该目标网页组件对应的属性配置数据并保存；根据各目标网页组件对应的属性配置数据，在画布区域上渲染出各目标网页组件，以形成客户端网页并保存。
[0007]在一种可能的实施方式中，属性配置数据包括外观显示数据，多个属性配置项包括组件尺寸配置项、组件位置配置项、组件颜色配置项以及组件界面样式配置项，其中，通过以下方式确定每个目标网页组件对应的外观显示数据：响应于对组件尺寸配置项执行的配置操作，确定该目标网页组件对应的尺寸信息；通过对组件位置配置项执行的配置操作，确定该目标网页组件在画布区域中所处的位置；响应于针对组件颜色配置项执行的配置操作，确定该目标网页组件对应的显示颜色；响应于针对组件界面样式配置项执行的配置操作，确定该目标网页组件对应的界面样式；由配置好的尺寸信息、在画布区域所处的位置、显示颜色以及界面样式，形成该目标网页组件对应的外观显示数据。
[0008]在一种可能的实施方式中，属性配置数据还包括特殊属性数据，多个网页组件包括用于进行表单制作的输入型组件，特殊属性数据还包括网页字段名称以及用于指示网页组件唯一性的唯一性标签，多个属性配置项还包括网页字段名称配置项及唯一性标签配置项，其中，通过以下方式确定每个目标输入型组件对应的网页字段名称以及唯一性标签：响应于针对网页字段名称配置项执行的网页字段名称输入配置操作，确定该目标输入型组件对应的网页字段名称；获取对唯一性标签配置项执行的唯一性标签添加操作，生成该网页
字段名称对应的唯一性标签。
[0009]在一种可能的实施方式中，通过以下方式完成对每个目标输入型组件对应的属性配置数据的保存：判断该目标输入型组件对应的属性配置数据中是否存在唯一性标签；若该目标输入型组件存在唯一性标签，则将该目标输入型组件对应的网页字段名称分别与创建完成的其它网页字段名称进行比较；若其它网页字段名称内不存在该目标输入型组件对应的网页字段名称，则保存该目标输入型组件对应的属性配置数据；若其它网页字段名称内存在该目标输入型组件对应的网页字段名称，则对该目标输入型组件对应的网页字段名称进行修改，并返回执行将该目标输入型组件对应的网页字段名称分别与创建完成的其它网页字段名称进行比较。
[0010]在一种可能的实施方式中，特殊属性数据还包括用于对输入型组件进行输入约束的限制映射关系，多个属性配置项还包括限制开关配置项，其中，通过以下方式确定每个目标输入型组件对应的限制映射关系：响应于针对限制开关配置项执行的限制开启配置操作，显示限制表单选择配置项以及限制字段映射配置项，限制字段映射配置项包括限制表单中的表单字段配置项以及与该目标输入型组件对应的网页字段配置项；接收对限制表单选择配置项执行的选择操作，从预先存储的多个限制表单中确定目标限制表单；响应于针对表单字段配置项执行的选择操作，显示目标限制表单所包括的多个表单字段选择项；响应于对目标表单字段选择项执行的选择操作，确定该目标输入型组件对应的限制字段；获取该目标输入型组件对应的网页字段名称并填入网页字段配置项，以建立所确定的限制字段与该目标输入型组件之间的限制映射关系。
[0011]在一种可能的实施方式中，多个属性配置项还包括跳转类型配置项、跳转地址配置项以及跳转条件配置项，属性配置数据还包括页面跳转数据，其中，通过以下方式确定每个目标网页组件对应的页面跳转数据：响应于针对跳转条件配置项执行的跳转条件配置操作，确定该目标网页组件对应的跳转触发条件；响应于针对跳转类型配置项执行的配置操作，确定该目标网页组件对应的目标跳转类型；响应于针对跳转地址配置项执行的配置操作，确定该目标网页组件对应的跳转地址；由配置好的跳转触发条件、目标跳转类型以及跳转地址，形成该网页组件对应的页面跳转数据。
[0012]在一种可能的实施方式中，响应于针对跳转地址配置项执行的配置操作，确定该目标网页组件对应的跳转地址的步骤包括：若目标跳转类型为外部链接跳转，则响应于在跳转地址配置项输入的外部网页链接，将输入的外部网页链接确定为该目标网页组件对应的跳转地址；若目标跳转类型为网页节点内部跳转，则响应于对跳转地址配置项执行的选择操作，显示目标网页组件所在的目标网页节点内的每个网页对应的网页名称；响应于针对目标网页名称执行的选择操作，将该目标网页名称所指示的网页地址确定为该目标网页组件对应的跳转地址；若目标跳转类型为网页活动内部跳转，则响应于对跳转地址配置项执行的选择操作，显示目标网页组件所在的目标活动内的每个网页节点对应的网页节点名称；响应于针对目标网页节点名称执行的选择操作，将该目标网页节点中的首网页所在地址确定为该目标网页组件对应的跳转地址。
[0013]第二方面，本申请实施例还提供一种客户端网页的生成方法，方法包括：
[0014]响应于针对目标网页的显示触发事件，调用目标网页对应的各目标网页组件对应的属性配置数据；按照各目标网页组件对应的属性配置数据，渲染客户端网页并进行显示；
接收用户针对客户端网页上的各目标网页组件执行的操作，获取与每个目标网页组件对应的操作数据并提交至数据库。
[0015]在一种可能的实施方式中，若目标网页组件为输入型组件，通过以下方式获取与每个目标网页组件对应的操作数据并提交至数据库：从客户端网页中获取携带输入标记的目标网页组件，输入标记用于指示网页组件为输入型组件，针对每个携带输入标记的目标网页组件，获取用户针对该目标网页组件执行输入操作所形成的输入数据值；若输入数据值为空，则在客户端网页上进行提示；若输入数据值不为空，则按照该目标网页组件所对应的属性配置数据中的特殊属性数据对该输入数据值进行校验；将校验通过的每个输入数据值，建立该输入数据值、及其对应的目标网页组件、用户身份标识之间的本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种客户端网页的生成方法，其特征在于，所述方法包括：响应于针对目标网页节点发出的网页创建请求，显示网页编辑界面，所述网页编辑界面包括画布区域、组件库区域以及组件属性配置区域，所述组件库区域包括多个网页组件；通过针对至少一个目标网页组件所执行的拖拽操作，将所述至少一个目标网页组件放置在所述画布区域；针对每个目标网页组件，响应于针对该目标网页组件执行的选择操作，在组件属性配置区域显示与该目标网页组件对应的多个属性配置项；针对每个目标网页组件，响应于针对每个属性配置项执行的配置操作，生成与该目标网页组件对应的属性配置数据并保存；根据各目标网页组件对应的属性配置数据，在所述画布区域上渲染出各目标网页组件，以形成客户端网页并保存。2.根据权利要求1所述的方法，其特征在于，所述属性配置数据包括外观显示数据，所述多个属性配置项包括组件尺寸配置项、组件位置配置项、组件颜色配置项以及组件边框样式配置项，其中，通过以下方式确定每个目标网页组件对应的外观显示数据：响应于对组件尺寸配置项执行的配置操作，确定该目标网页组件对应的尺寸信息；通过对组件位置配置项执行的配置操作，确定该目标网页组件在所述画布区域中所处的位置；响应于针对组件颜色配置项执行的配置操作，确定该目标网页组件对应的显示颜色；响应于针对组件边框样式配置项执行的配置操作，确定该目标网页组件对应的边框样式；由配置好的尺寸信息、在所述画布区域所处的位置、显示颜色以及界面样式，形成该目标网页组件对应的外观显示数据。3.根据权利要求1所述的方法，其特征在于，所述属性配置数据还包括特殊属性数据，所述多个网页组件包括用于进行表单制作的输入型组件，所述特殊属性数据还包括网页字段名称以及用于指示网页组件唯一性的唯一性标签，所述多个属性配置项还包括网页字段名称配置项及唯一性标签配置项，其中，通过以下方式确定每个目标输入型组件对应的网页字段名称以及唯一性标签：响应于针对网页字段名称配置项执行的网页字段名称输入配置操作，确定该目标输入型组件对应的网页字段名称；获取对唯一性标签配置项执行的唯一性标签添加操作，生成该网页字段名称对应的唯一性标签。4.根据权利要求3所述的方法，其特征在于，通过以下方式完成对每个目标输入型组件对应的所述属性配置数据的保存：判断该目标输入型组件对应的属性配置数据中是否存在唯一性标签；若该目标输入型组件存在唯一性标签，则将该目标输入型组件对应的网页字段名称分别与创建完成的其它网页字段名称进行比较；若其它网页字段名称内不存在该目标输入型组件对应的网页字段名称，则保存该目标输入型组件对应的属性配置数据；
若其它网页字段名称内存在该目标输入型组件对应的网页字段名称，则对该目标输入型组件对应的网页字段名称进行修改，并返回执行将该目标输入型组件对应的网页字段名称分别与创建完成的其它网页字段名称进行比较。5.根据权利要求3所述的方法，其特征在于，所述特殊属性数据还包括用于对输入型组件进行输入约束的限制映射关系，所述多个属性配置项还包括限制开关配置项，其中，通过以下方式确定每个目标输入型组件对应的限制映射关系：响应于针对限制开关配置项执行的限制开启配置操作，显示限制表单选择配置项以及限制字段映射配置项，所述限制字段映射配置项包括限制表单中的表单字段配置项以及与该目标输入型组件对应的网页字段配置项；接收对限制表单选择配置项执行的选择操作，从预先存储的多个限制表单中确定目标限制表单；响应于针对表单字段配置项执行的选择操作，显示目标限制表单所包括的多个表单字段选择项；响应于对目标表单字段选择项执行的选择操作，确定该目标输入型组件对应的限制字段；获取该目标输入型组件对应的网页字段名称并填入网页字段配置项，以建立所确...

【专利技术属性】
技术研发人员：郭燕萍，于建华，杨晓龙，史晓宇，
申请(专利权)人：中电金信软件有限公司，
类型：发明
国别省市：