CN113569548A - 一种线上赛事报名表单生成方法及系统 - Google Patents
一种线上赛事报名表单生成方法及系统 Download PDFInfo
- Publication number
- CN113569548A CN113569548A CN202110548499.XA CN202110548499A CN113569548A CN 113569548 A CN113569548 A CN 113569548A CN 202110548499 A CN202110548499 A CN 202110548499A CN 113569548 A CN113569548 A CN 113569548A
- Authority
- CN
- China
- Prior art keywords
- component
- mouse
- user
- form component
- module
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 32
- 230000009471 action Effects 0.000 claims abstract description 21
- 238000012544 monitoring process Methods 0.000 claims description 18
- 238000009877 rendering Methods 0.000 claims description 10
- 230000000712 assembly Effects 0.000 claims description 9
- 238000000429 assembly Methods 0.000 claims description 9
- 238000004364 calculation method Methods 0.000 claims description 3
- 238000013500 data storage Methods 0.000 claims description 3
- 238000001514 detection method Methods 0.000 claims description 3
- 230000008676 import Effects 0.000 claims description 3
- 238000012546 transfer Methods 0.000 claims description 3
- 238000013461 design Methods 0.000 abstract description 6
- 238000012800 visualization Methods 0.000 abstract description 3
- 230000008569 process Effects 0.000 description 8
- 238000012986 modification Methods 0.000 description 4
- 230000004048 modification Effects 0.000 description 4
- 230000008878 coupling Effects 0.000 description 3
- 238000010168 coupling process Methods 0.000 description 3
- 238000005859 coupling reaction Methods 0.000 description 3
- 238000004891 communication Methods 0.000 description 2
- 238000011161 development Methods 0.000 description 2
- 230000000007 visual effect Effects 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 239000003086 colorant Substances 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 238000012545 processing Methods 0.000 description 1
- 230000009467 reduction Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
- 230000001960 triggered effect Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/166—Editing, e.g. inserting or deleting
- G06F40/177—Editing, e.g. inserting or deleting of tables; using ruled lines
- G06F40/18—Editing, e.g. inserting or deleting of tables; using ruled lines of spreadsheets
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
- G06F3/0483—Interaction with page-structured environments, e.g. book metaphor
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
- G06F3/04845—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/166—Editing, e.g. inserting or deleting
- G06F40/186—Templates
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06Q—INFORMATION AND COMMUNICATION TECHNOLOGY [ICT] SPECIALLY ADAPTED FOR ADMINISTRATIVE, COMMERCIAL, FINANCIAL, MANAGERIAL OR SUPERVISORY PURPOSES; SYSTEMS OR METHODS SPECIALLY ADAPTED FOR ADMINISTRATIVE, COMMERCIAL, FINANCIAL, MANAGERIAL OR SUPERVISORY PURPOSES, NOT OTHERWISE PROVIDED FOR
- G06Q50/00—Information and communication technology [ICT] specially adapted for implementation of business processes of specific business sectors, e.g. utilities or tourism
- G06Q50/10—Services
- G06Q50/20—Education
- G06Q50/205—Education administration or guidance
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Business, Economics & Management (AREA)
- Physics & Mathematics (AREA)
- General Health & Medical Sciences (AREA)
- Health & Medical Sciences (AREA)
- Tourism & Hospitality (AREA)
- Artificial Intelligence (AREA)
- Computational Linguistics (AREA)
- Audiology, Speech & Language Pathology (AREA)
- Human Computer Interaction (AREA)
- Educational Administration (AREA)
- Strategic Management (AREA)
- Educational Technology (AREA)
- General Business, Economics & Management (AREA)
- Economics (AREA)
- Human Resources & Organizations (AREA)
- Primary Health Care (AREA)
- Marketing (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本申请公开的一种线上赛事报名表单生成方法及系统，包括以下步骤：构建表单组件并将所述表单组件导入到组件列表；根据用户的拖拽动作将表单组件移动到表单编辑页面；根据用户的拖拽动作调整表单组件在表单编辑页面的位置，当上下方向的两个表单组件左边、中间或右边对齐时显现竖直标线，当左右方向的两个表单组件上边、中间或下边对齐时会显现水平标线；表单编辑完成后将表单数据保存为html文件，将所述html文件解析成版式数据流文件。通过可视化拖拽表单组件，实现快速地绘制规范化报名表单，表单组件在编辑不同赛事的报名表单时均可以使用，避免重复设计表单组件。
Description
技术领域
本申请涉及赛事报名表单生成技术领域，尤其涉及一种线上赛事报名表单生成方法及系统。
背景技术
随着经济发展，人们越来越注重文化教育，教育领域的线上赛事是指通过网络举办的比赛。参赛成员直接在网上填写报名表单报名，上传个人信息。
现有的线上赛事报名表单可通过html、js、css等源码编写生成，每一种赛事都要单独编写表单代码和构建表单样式，工作内容繁杂。在一些现有技术中，为提高表单生成效率采用可视化编辑器来生成表单，如中国专利CN102360296A公开了一种基于WEB的在线表单开发工具，包括：可视化表单设计器，用于供用户在该界面上设计待生成表单，所述界面上设置有多个表单控件以及至少一个代码编辑器；保存模块，其以HTML页面文件的格式保存生成的表单，将表单保存在数据库中；数据库，其中设置有保存表单的子数据库和保存业务数据的子数据库；数据集控件，其中建立有表单控件与数据库中的业务数据的对应关系数据；其中，在保存生成的表单时，所述代码编辑器编辑出的业务逻辑与通过表单控件设定的表单页面元素一同保存，并且表单在展现时，通过数据集控件中的对应关系，将数据库中的业务数据显示在表单控件中。但是现有技术中调整表单位置时不方便对齐不同表单组件，并且生成的表单在参赛者输入个人信息时不够便捷，不能够根据用户的输入历史提供输入文字填写表单。
发明内容
本申请实施例提供一种线上赛事报名表单生成方法及系统，能够方便对齐不同表单组件，提高设计效率，并且生成的报名表单能够根据用户的输入历史提供输入文字进行报名表单的填写，使用方便。
有鉴于此，本申请提供了一种线上赛事报名表单生成方法，包括以下步骤：构建表单组件并将所述表单组件导入到组件列表；根据用户的拖拽动作将表单组件移动到表单编辑页面；根据用户的拖拽动作调整表单组件在表单编辑页面的位置，当上下方向的两个表单组件左边、中间或右边对齐时显现竖直标线，当左右方向的两个表单组件上边、中间或下边对齐时会显现水平标线；表单编辑完成后将表单数据保存为html文件，将所述html文件解析成版式数据流文件；其中，所述表单组件包括文本框组件、下拉框组件、选择框组件和加载组件，每一个文本框组件都包含组件ID、组件名称和输入框，在用户从所述输入框中输入信息后将输入的信息与所述组件ID绑定并储存，当检测到用户再次在所述输入框中输入信息时，按储存时间分行显示包含与所述组件ID绑定的输入信息的下拉文本，用户通过点击所述下拉文本将点击的文本内容输入到所述输入框。
可选地，所述根据用户的拖拽动作将表单组件移动到表单编辑页面包括：监听用户是否在所述表单组件上按下鼠标，当用户在所述表单组件上按下鼠标时，将组件信息传递给表单编辑页面；监听用户是否在所述表单组件上松开鼠标，当用户在所述表单组件上松开鼠标时，拖拽结束，此时接收拖拽的表单组件信息并根据所述表单组件信息在表单编辑页面渲染表单组件。
可选地，所述根据用户的拖拽动作调整表单组件在表单编辑页面的位置包括：记录用户在所述表单组件上按下鼠标时表单组件的初始位置坐标；当鼠标拖拽所述表单组件移动时，检测鼠标的实时位置坐标；用实时位置坐标减去初始位置坐标，计算移动距离和移动方向并改变表单组件的位置；
检测鼠标是否抬起，当检测到鼠标抬起时结束拖拽事件。
可选地，在所述调整表单组件在表单编辑页面的位置时，保存在当前调整时间下的表单组件设置状态数据，通过选取还原时间点下的表单组件设置状态数据还原表单设置状态。
可选地，还包括：根据当前表单组件设置状态数据生成表单模板；将所述表单模板按编号储存在模板库中；通过调用所述表单模板自动生成表单。
本申请还提供了一种线上赛事报名表单生成系统，包括：构建模块，用于构建表单组件，所述表单组件包括文本框组件、下拉框组件、选择框组件和加载组件，每一个文本框组件都包含组件ID、组件名称和输入框；导入模块，用于将所述表单组件导入到组件列表；移动模块，用于根据用户的拖拽动作将表单组件移动到表单编辑页面；调整模块，用于根据用户的拖拽动作调整表单组件在表单编辑页面的位置；标线模块，用于当上下方向的两个表单组件左边、中间或右边对齐时显现竖直标线，当左右方向的两个表单组件上边、中间或下边对齐时会显现水平标线；保存模块，用于将编辑完成后的表单数据保存为html文件；解析模块，用于将所述html文件解析成版式数据流文件；储存模块，用于将用户从所述输入框输入的信息与所述组件ID绑定并将所述输入信息储存；显示模块，用于在检测到用户再次在相同组件ID的输入框中输入信息时，按储存时间分行显示包含与所述组件ID绑定的输入信息的下拉文本；输入模块，用于将用户点击的下拉文本中的文本内容输入到所述输入框。
可选地，所述移动模块包括：第一监听单元，用于监听用户是否在所述表单组件上按下鼠标；传递单元，用于当用户在所述表单组件上按下鼠标时，将组件信息传递给表单编辑页面；第二监听单元，用于监听用户是否在所述表单组件上松开鼠标；接收模块，用于当用户在所述表单组件上松开鼠标时，接收拖拽的表单组件信息；渲染单元，用于根据表单组件信息在表单编辑页面渲染表单组件。
可选地，所述调整模块包括：记录单元，用于记录用户在所述表单组件上按下鼠标时表单组件的初始位置坐标；检测单元，用于当鼠标拖拽所述表单组件移动时，检测鼠标的实时位置坐标；计算单元，用于用实时位置坐标减去初始位置坐标，计算移动距离和移动方向并改变表单组件的位置；结束单元，用于当检测到鼠标抬起时结束拖拽事件。
可选地，还包括：操作数据保存模块，用于在所述调整表单组件在表单编辑页面的位置时，保存在当前调整时间下的表单组件设置状态数据；还原模块，用于通过选取还原时间点下的表单组件设置状态数据还原表单设置状态。
可选地，还包括：模板生成模块，用于根据当前表单组件设置状态数据生成表单模板；模板保存模块，将所述表单模板按编号储存在模板库中；调用模块，用于通过调用所述表单模板自动生成表单。
从以上技术方案可以看出，本申请实施例具有以下优点：
1、通过可视化拖拽表单组件，实现快速地绘制规范化报名表单，表单组件在编辑不同赛事的报名表单时均可以使用，避免重复设计表单组件。
2、通过将表单生成的html文件规范，再解析规范化的html文件从而得到版式数据流文件，无需直接通过html来构建表单，从而避免了对源码中修改过程中出现层级混乱。
3、通过生成竖直标线和水平标线，便于对齐不同的表单组件，提高设计效率。
4、当报名用户输入个人信息时，根据用户历史输入数据显示下拉文本，可以通过点击下拉文本将点击的文本内容输入到输入框，使用户能够快捷地输入信息。
附图说明
为了更清楚地表达说明本发明实施例的技术方案，下面将对实施例描述所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
图1为本说明书实施例中一线上赛事报名表单生成方法的流程图。
具体实施方式
为了使本技术领域的人员更好地理解本申请方案，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。
请参照图1，本申请实施例的一种线上赛事报名表单生成方法，包括以下步骤：
构建表单组件并将所述表单组件导入到组件列表；
根据用户的拖拽动作将表单组件移动到表单编辑页面；
根据用户的拖拽动作调整表单组件在表单编辑页面的位置，当上下方向的两个表单组件左边、中间或右边对齐时显现竖直标线，当左右方向的两个表单组件上边、中间或下边对齐时会显现水平标线；
表单编辑完成后将表单数据保存为html文件，将所述html文件解析成版式数据流文件。
在本实施例中，所述表单组件包括文本框组件、下拉框组件、选择框组件和加载组件。每一个文本框组件都包含组件ID、组件名称和输入框，在用户从所述输入框中输入信息后将输入的信息与所述组件ID绑定并储存，当检测到用户再次在所述输入框中输入信息时，按储存时间分行显示包含与所述组件ID绑定的输入信息的下拉文本，用户通过点击所述下拉文本将点击的文本内容输入到所述输入框。下拉框组件用于供参赛报名用户从下拉选项中选取类型输入；选择框组件能够提供多个选项，参赛报名用户从这些选项中勾选符合的内容；加载组件用于供用户上传图片、文档等附件。每个组件都可以根据需要设定组件样式，设置成适合的长度、宽度、颜色、线条类型等。
在本实施例中，报名表单设计者通过可视化拖拽表单组件，自由选择表单组件进行组合排布，实现快速地绘制规范化报名表单，表单组件在编辑不同赛事的报名表单时均可以使用，避免每种比赛都要重复设计表单组件。通过将表单生成的html文件规范，再解析规范化的html文件从而得到版式数据流文件，无需直接通过html来构建表单，从而避免了对源码中修改过程中出现层级混乱。当拖拽表单组件使其对齐时，会生成竖直标线和水平标线，便于对齐不同的表单组件，提高设计效率。根据本实施例构建的表单组件，当报名用户输入个人信息时，根据用户历史输入数据显示下拉文本，可以通过点击下拉文本将点击的文本内容输入到输入框，使用户能够快捷地输入信息。
在本申请的进一步实施例中，所述根据用户的拖拽动作将表单组件移动到表单编辑页面包括：监听用户是否在所述表单组件上按下鼠标，当用户在所述表单组件上按下鼠标时，将组件信息传递给表单编辑页面；监听用户是否在所述表单组件上松开鼠标，当用户在所述表单组件上松开鼠标时，拖拽结束，此时接收拖拽的表单组件信息并根据所述表单组件信息在表单编辑页面渲染表单组件。具体的，每个表单组件均设有可拖拽属性，当拖拽触发，既在所述表单组件上按下鼠标时，触发事件，将组件信息传递给表单编辑页面，组件信息包括组件样式、组件的长度、宽度、颜色、线条类型等。然后在松开鼠标时接收传输的数据并在渲染表单组件，完成将表单组件添加到表单编辑页面的操作。
在本申请的进一步实施例中，所述根据用户的拖拽动作调整表单组件在表单编辑页面的位置包括：记录用户在所述表单组件上按下鼠标时表单组件的初始位置坐标；当鼠标拖拽所述表单组件移动时，检测鼠标的实时位置坐标；用实时位置坐标减去初始位置坐标，计算移动距离和移动方向并改变表单组件的位置；检测鼠标是否抬起，当检测到鼠标抬起时结束拖拽事件。通过拖拽表单组件实现表单组件在表单编辑页面的移动，能够实时显示表单组件位置，方便布局。
进一步，在本申请的一个实施例中，在上述方案的基础上，还包括，在所述调整表单组件在表单编辑页面的位置时，保存在当前调整时间下的表单组件设置状态数据，通过选取还原时间点下的表单组件设置状态数据还原表单设置状态。在调整过程中，每一个调整步骤都会自动保存，当用户需要返回某个操作步骤时，通过还原该操作步骤时间点下的表单组件设置状态数据就能实现还原操作过程，有利于用户对表单操作做出不同尝试，进行反复修改达成用户所需的报名表单的样式。
进一步，在本申请的一个实施例中，在上述方案的基础上，还包括：根据当前表单组件设置状态数据生成表单模板；将所述表单模板按编号储存在模板库中；通过调用所述表单模板自动生成表单。在设计完成好报名表单后，通过生成表单模板，在后续编辑时可以直接使用当前表单，在一些线上教育赛事中报名所需填写的信息往往是相似的，因此有时候可以直接使用编辑过的表单进行较小的改动就能再次使用，另外还可以设计通用模板保存使用，将一些通用的表单组件设计成表单模板，在设计时直接调用模板编辑，使用方便。
本申请实施例还提出一种线上赛事报名表单生成系统，包括：构建模块，用于构建表单组件，所述表单组件包括文本框组件、下拉框组件、选择框组件和加载组件，每一个文本框组件都包含组件ID、组件名称和输入框；导入模块，用于将所述表单组件导入到组件列表；移动模块，用于根据用户的拖拽动作将表单组件移动到表单编辑页面；调整模块，用于根据用户的拖拽动作调整表单组件在表单编辑页面的位置；标线模块，用于当上下方向的两个表单组件左边、中间或右边对齐时显现竖直标线，当左右方向的两个表单组件上边、中间或下边对齐时会显现水平标线；保存模块，用于将编辑完成后的表单数据保存为html文件；解析模块，用于将所述html文件解析成版式数据流文件；储存模块，用于将用户从所述输入框输入的信息与所述组件ID绑定并将所述输入信息储存；显示模块，用于在检测到用户再次在相同组件ID的输入框中输入信息时，按储存时间分行显示包含与所述组件ID绑定的输入信息的下拉文本；输入模块，用于将用户点击的下拉文本中的文本内容输入到所述输入框。
进一步，所述移动模块包括：第一监听单元，用于监听用户是否在所述表单组件上按下鼠标；传递单元，用于当用户在所述表单组件上按下鼠标时，将组件信息传递给表单编辑页面；第二监听单元，用于监听用户是否在所述表单组件上松开鼠标；接收模块，用于当用户在所述表单组件上松开鼠标时，接收拖拽的表单组件信息；渲染单元，用于根据表单组件信息在表单编辑页面渲染表单组件。
进一步，所述调整模块包括：记录单元，用于记录用户在所述表单组件上按下鼠标时表单组件的初始位置坐标；检测单元，用于当鼠标拖拽所述表单组件移动时，检测鼠标的实时位置坐标；计算单元，用于用实时位置坐标减去初始位置坐标，计算移动距离和移动方向并改变表单组件的位置；结束单元，用于当检测到鼠标抬起时结束拖拽事件。
进一步，还包括：操作数据保存模块，用于在所述调整表单组件在表单编辑页面的位置时，保存在当前调整时间下的表单组件设置状态数据；还原模块，用于通过选取还原时间点下的表单组件设置状态数据还原表单设置状态。
进一步，还包括：模板生成模块，用于根据当前表单组件设置状态数据生成表单模板；模板保存模块，将所述表单模板按编号储存在模板库中；调用模块，用于通过调用所述表单模板自动生成表单。
所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的系统具体工作过程，可以参考前述方法实施例中的对应过程，作用和效果也相同，在此不再赘述。
本申请的说明书及上述附图中的术语“第一”、“第二”、“第三”、“第四”等(如果存在)是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本申请的实施例例如能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
在本申请所提供的几个实施例中，应该理解到，所揭露的系统，装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，装置或单元的间接耦合或通信连接，可以是电性，机械或其它的形式。
作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外，在本申请各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。
集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(英文全称：Read-OnlyMemory，英文缩写：ROM)、随机存取存储器(英文全称：Random Access Memory，英文缩写：RAM)、磁碟或者光盘等各种可以存储程序代码的介质。
以上所述，以上实施例仅用以说明本申请的技术方案，而非对其限制；尽管参照前述实施例对本申请进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本申请各实施例技术方案的精神和范围。
Claims (10)
1.一种线上赛事报名表单生成方法，其特征在于，包括以下步骤：
构建表单组件并将所述表单组件导入到组件列表；
根据用户的拖拽动作将表单组件移动到表单编辑页面；
根据用户的拖拽动作调整表单组件在表单编辑页面的位置，当上下方向的两个表单组件左边、中间或右边对齐时显现竖直标线，当左右方向的两个表单组件上边、中间或下边对齐时会显现水平标线；
表单编辑完成后将表单数据保存为html文件，将所述html文件解析成版式数据流文件；
其中，所述表单组件包括文本框组件、下拉框组件、选择框组件和加载组件，每一个文本框组件都包含组件ID、组件名称和输入框，在用户从所述输入框中输入信息后将输入的信息与所述组件ID绑定并储存，当检测到用户再次在所述输入框中输入信息时，按储存时间分行显示包含与所述组件ID绑定的输入信息的下拉文本，用户通过点击所述下拉文本将点击的文本内容输入到所述输入框。
2.根据权利要求1所述的一种线上赛事报名表单生成方法，其特征在于，所述根据用户的拖拽动作将表单组件移动到表单编辑页面包括：
监听用户是否在所述表单组件上按下鼠标，当用户在所述表单组件上按下鼠标时，将组件信息传递给表单编辑页面；
监听用户是否在所述表单组件上松开鼠标，当用户在所述表单组件上松开鼠标时，拖拽结束，此时接收拖拽的表单组件信息并根据所述表单组件信息在表单编辑页面渲染表单组件。
3.根据权利要求1所述的一种线上赛事报名表单生成方法，其特征在于，所述根据用户的拖拽动作调整表单组件在表单编辑页面的位置包括：
记录用户在所述表单组件上按下鼠标时表单组件的初始位置坐标；
当鼠标拖拽所述表单组件移动时，检测鼠标的实时位置坐标；
用实时位置坐标减去初始位置坐标，计算移动距离和移动方向并改变表单组件的位置；
检测鼠标是否抬起，当检测到鼠标抬起时结束拖拽事件。
4.根据权利要求1所述的一种线上赛事报名表单生成方法，其特征在于，在所述调整表单组件在表单编辑页面的位置时，保存在当前调整时间下的表单组件设置状态数据，通过选取还原时间点下的表单组件设置状态数据还原表单设置状态。
5.根据权利要求1所述的一种线上赛事报名表单生成方法，其特征在于，还包括：
根据当前表单组件设置状态数据生成表单模板；
将所述表单模板按编号储存在模板库中；
通过调用所述表单模板自动生成表单。
6.一种线上赛事报名表单生成系统，其特征在于，包括：
构建模块，用于构建表单组件，所述表单组件包括文本框组件、下拉框组件、选择框组件和加载组件，每一个文本框组件都包含组件ID、组件名称和输入框；
导入模块，用于将所述表单组件导入到组件列表；
移动模块，用于根据用户的拖拽动作将表单组件移动到表单编辑页面；
调整模块，用于根据用户的拖拽动作调整表单组件在表单编辑页面的位置；
标线模块，用于当上下方向的两个表单组件左边、中间或右边对齐时显现竖直标线，当左右方向的两个表单组件上边、中间或下边对齐时会显现水平标线；
保存模块，用于将编辑完成后的表单数据保存为html文件；
解析模块，用于将所述html文件解析成版式数据流文件；
储存模块，用于将用户从所述输入框输入的信息与所述组件ID绑定并将所述输入信息储存；
显示模块，用于在检测到用户再次在相同组件ID的输入框中输入信息时，按储存时间分行显示包含与所述组件ID绑定的输入信息的下拉文本；
输入模块，用于将用户点击的下拉文本中的文本内容输入到所述输入框。
7.根据权利要求6所述的一种线上赛事报名表单生成系统，其特征在于，所述移动模块包括：
第一监听单元，用于监听用户是否在所述表单组件上按下鼠标；
传递单元，用于当用户在所述表单组件上按下鼠标时，将组件信息传递给表单编辑页面；
第二监听单元，用于监听用户是否在所述表单组件上松开鼠标；
接收模块，用于当用户在所述表单组件上松开鼠标时，接收拖拽的表单组件信息；
渲染单元，用于根据表单组件信息在表单编辑页面渲染表单组件。
8.根据权利要求6所述的一种线上赛事报名表单生成系统，其特征在于，所述调整模块包括：
记录单元，用于记录用户在所述表单组件上按下鼠标时表单组件的初始位置坐标；
检测单元，用于当鼠标拖拽所述表单组件移动时，检测鼠标的实时位置坐标；
计算单元，用于用实时位置坐标减去初始位置坐标，计算移动距离和移动方向并改变表单组件的位置；
结束单元，用于当检测到鼠标抬起时结束拖拽事件。
9.根据权利要求6所述的一种线上赛事报名表单生成系统，其特征在于，还包括：
操作数据保存模块，用于在所述调整表单组件在表单编辑页面的位置时，保存在当前调整时间下的表单组件设置状态数据；
还原模块，用于通过选取还原时间点下的表单组件设置状态数据还原表单设置状态。
10.根据权利要求6所述的一种线上赛事报名表单生成系统，其特征在于，还包括：
模板生成模块，用于根据当前表单组件设置状态数据生成表单模板；
模板保存模块，将所述表单模板按编号储存在模板库中；
调用模块，用于通过调用所述表单模板自动生成表单。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110548499.XA CN113569548A (zh) | 2021-05-19 | 2021-05-19 | 一种线上赛事报名表单生成方法及系统 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110548499.XA CN113569548A (zh) | 2021-05-19 | 2021-05-19 | 一种线上赛事报名表单生成方法及系统 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN113569548A true CN113569548A (zh) | 2021-10-29 |
Family
ID=78161484
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202110548499.XA Pending CN113569548A (zh) | 2021-05-19 | 2021-05-19 | 一种线上赛事报名表单生成方法及系统 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113569548A (zh) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114063869A (zh) * | 2021-11-30 | 2022-02-18 | 中国建设银行股份有限公司 | 一种表单配置方法、装置和电子设备 |
Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101963844A (zh) * | 2010-09-26 | 2011-02-02 | 百度在线网络技术（北京）有限公司 | 一种表单输入的方法和设备 |
| CN102736837A (zh) * | 2011-05-10 | 2012-10-17 | 新奥特（北京）视频技术有限公司 | 一种基于网格的字幕编辑方法 |
| CN103581212A (zh) * | 2012-07-18 | 2014-02-12 | 百度在线网络技术（北京）有限公司 | 基于云端分析的表单自动填充方法、系统及装置 |
| CN105302550A (zh) * | 2015-10-12 | 2016-02-03 | 江苏中威科技软件系统有限公司 | 将页面转为版式数据流文件的方法及系统 |
| CN106528736A (zh) * | 2016-10-27 | 2017-03-22 | 中企动力科技股份有限公司 | 一种拖拽页面组件时显示对齐线的方法及装置 |
| CN106775271A (zh) * | 2016-11-29 | 2017-05-31 | 中电科华云信息技术有限公司 | 基于可视化操作表单实现系统集成自定义参数传递的方法 |
| CN107544806A (zh) * | 2017-09-04 | 2018-01-05 | 江苏中威科技软件系统有限公司 | 可视化表单绘制方法 |
| CN108205744A (zh) * | 2016-12-19 | 2018-06-26 | 成都鼎桥通信技术有限公司 | 工作流流程表单的实现方法及装置 |
-
2021
- 2021-05-19 CN CN202110548499.XA patent/CN113569548A/zh active Pending
Patent Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101963844A (zh) * | 2010-09-26 | 2011-02-02 | 百度在线网络技术（北京）有限公司 | 一种表单输入的方法和设备 |
| CN102736837A (zh) * | 2011-05-10 | 2012-10-17 | 新奥特（北京）视频技术有限公司 | 一种基于网格的字幕编辑方法 |
| CN103581212A (zh) * | 2012-07-18 | 2014-02-12 | 百度在线网络技术（北京）有限公司 | 基于云端分析的表单自动填充方法、系统及装置 |
| CN105302550A (zh) * | 2015-10-12 | 2016-02-03 | 江苏中威科技软件系统有限公司 | 将页面转为版式数据流文件的方法及系统 |
| CN106528736A (zh) * | 2016-10-27 | 2017-03-22 | 中企动力科技股份有限公司 | 一种拖拽页面组件时显示对齐线的方法及装置 |
| CN106775271A (zh) * | 2016-11-29 | 2017-05-31 | 中电科华云信息技术有限公司 | 基于可视化操作表单实现系统集成自定义参数传递的方法 |
| CN108205744A (zh) * | 2016-12-19 | 2018-06-26 | 成都鼎桥通信技术有限公司 | 工作流流程表单的实现方法及装置 |
| CN107544806A (zh) * | 2017-09-04 | 2018-01-05 | 江苏中威科技软件系统有限公司 | 可视化表单绘制方法 |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114063869A (zh) * | 2021-11-30 | 2022-02-18 | 中国建设银行股份有限公司 | 一种表单配置方法、装置和电子设备 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10521486B2 (en) | Method and apparatus for using proxies to interact with webpage analytics | |
| CN108628741A (zh) | 网页页面测试方法、装置、电子设备和介质 | |
| CN1932803B (zh) | 文档编辑方法和装置 | |
| CN111125560B (zh) | 数据可视化处理方法、装置及计算机系统 | |
| CN110781423A (zh) | 网页生成方法、装置及电子设备 | |
| CN109408764B (zh) | 页面区域划分方法、装置、计算设备和介质 | |
| CN109062567A (zh) | 基于b/s结构的信息管理系统快速开发平台 | |
| CN104391625A (zh) | 一种聊天内容显示方法和装置 | |
| WO2002046969A2 (en) | Graphical user interface and evaluation tool for customizing web sites | |
| CN107133001A (zh) | 一种面单打印方法、装置及客户端 | |
| CN105867820A (zh) | 用于触摸屏的文本编辑方法和装置 | |
| CN110598021B (zh) | 获取图片的知识图谱的方法、装置和系统 | |
| CN108170497A (zh) | 一种页面渲染的方法及装置 | |
| Wagner | Web Performance in Action: Building Fast Web Pages | |
| US20060225091A1 (en) | Customizing and personalizing views in content aggregation frameworks | |
| Natarajan et al. | P2A: A tool for converting pixels to animated mobile application user interfaces | |
| CN107391656A (zh) | 基于蒙版的web表单设计方法 | |
| US8121900B1 (en) | Facilitating review of products considered for purchase | |
| CN113569548A (zh) | 一种线上赛事报名表单生成方法及系统 | |
| CN108153465A (zh) | 基于企业SaaS应用的标签设置方法及装置 | |
| CN105940370A (zh) | 提供用于在基于网络的应用中编辑的文档的打印视图 | |
| CN110333853A (zh) | 活动卡片的应用方法、装置、设备及可读存储介质 | |
| CN114416056A (zh) | 页面生成方法、系统、计算机设备及可读存储介质 | |
| US7472355B2 (en) | Computer-implemented method for managing commands for a terminal session | |
| CN111435300A (zh) | web系统开发方法、装置、设备及存储介质 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination |