CN112199626A - 基于dsl布局引擎的动态表单生成方法 - Google Patents
基于dsl布局引擎的动态表单生成方法 Download PDFInfo
- Publication number
- CN112199626A CN112199626A CN202011232987.1A CN202011232987A CN112199626A CN 112199626 A CN112199626 A CN 112199626A CN 202011232987 A CN202011232987 A CN 202011232987A CN 112199626 A CN112199626 A CN 112199626A
- Authority
- CN
- China
- Prior art keywords
- component
- dsl
- layout engine
- generation method
- data
- 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 18
- 238000009877 rendering Methods 0.000 claims abstract description 11
- 238000013461 design Methods 0.000 claims description 3
- 238000011161 development Methods 0.000 abstract description 3
- 230000006978 adaptation Effects 0.000 description 1
- 230000007547 defect Effects 0.000 description 1
- 230000007812 deficiency Effects 0.000 description 1
- 238000010586 diagram Methods 0.000 description 1
- 238000012545 processing Methods 0.000 description 1
- 238000012827 research and development Methods 0.000 description 1
- 238000012795 verification Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
- G06F16/986—Document structures and storage, e.g. HTML extensions
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Document Processing Apparatus (AREA)
Abstract
本发明提出一种基于DSL布局引擎的动态表单生成方法，包括以下步骤：步骤S1：为每个组件定义组件元数据，所述组件元数据包括渲染组件所需要的所有属性；步骤S2：由所有组件元数据的集合构成表单元数据；所述表单元数据为可被持久化，保存至数据库中的结构化数据；步骤S3：通过数据解析渲染引擎将表单元数据转化为HTML表单。其运用DSL动态布局引擎，可高效的配置生成样式统一的表单，节省了很大一部分开发时间与经费，对于庞大的政务生态系统非常适用。
Description
技术领域
本发明涉及信息科学、大数据处理、互联网技术领域，尤其涉及一种基于DSL布局引擎的动态表单生成方法，以及基于JSX在VUE前端框架上根据元数据动态渲染表单的解决方案。
背景技术
目前，公知的主流表单渲染方案是研发原生的HTML5页面，加上javascript脚本与css样式的控制，或使用当下主流的前端技术框架(例如Bootstrap、Angular、Backbone、React),研发得到一个可见可用的表单。这样的开发过程费时费力，有很大一部分的工作量属于机械劳动，并且两个或以上团队开发的表单样式极可能不一致，对于集成一套完整的政务生态系统，效果不是很理想。
发明内容
为了解决现有技术存在的缺陷和不足的问题，为了解决目前研发政务表单效率不高，样式不统一的现状，本发明提出一种基于DSL布局引擎的动态表单生成方法，其提供了一种可动态渲染表单的布局引擎，该引擎实现将表单内元素数据化、组件化，根据给定的JSON数据集合有序的渲染表单，基于此引擎，还可支持一些简单的计算、逻辑校验、外部接口数据获取和多终端数据同步。该方案的核心在于如何定义元数据和如何去循环遍历渲染表单组件。
具体采用以下技术方案：
一种基于DSL布局引擎的动态表单生成方法，其特征在于，包括以下步骤：
步骤S1：为每个组件定义组件元数据，所述组件元数据包括渲染组件所需要的所有属性；
步骤S2：由所有组件元数据的集合构成表单元数据；所述表单元数据为可被持久化，保存至数据库中的结构化数据；
步骤S3：通过数据解析渲染引擎将表单元数据转化为HTML表单。
优选地，还包括步骤S4：将HTML表单经过三端CSS样式的适配，得到可供多终端填报的定制表单。
优选地，步骤S3具体包括以下过程：
步骤S31：从配置好的组件元数据集合中，读取约定好的固定字段，循环遍历Dom字典，遍历所有设计数据；
步骤S32：用字符串匹配去判断每个节点的key与值，指引Dom去匹配相关组件模块的代码，匹配出input就创建单行文本，匹配出image就创建文件附件。
优选地，当匹配到的是带有子节点的组件时，相同于步骤S31和步骤S32的操作，循环遍历子节点，再读取约定好的固定字段，再匹配到对应模块的子组件，最后渲染得到带子节点的组件。
优选地，所述三端CSS样式包括：标准样式、WEB样式和APP样式。
优选地，所述渲染组件所需要的所有属性包括：组件标题、组件类型、组件编码、是否必填、默认值、描述、排列方式、是否隐藏、是否可编辑、是否联动、联动规则、扩展属性、填报值、是否子表单、子表单ID。
优选地，所述组件元数据为JSON格式。
本发明及其优选方案运用DSL动态布局引擎，可高效的配置生成样式统一的表单，节省了很大一部分开发时间与经费，对于庞大的政务生态系统非常适用。
附图说明
下面结合附图和具体实施方式对本发明进一步详细的说明：
图1为本发明实施例整体流程示意图；
图2为本发明实施例单行文本的元数据示例图。
具体实施方式
为让本专利的特征和优点能更明显易懂，下文特举实施例，并配合附图，作详细说明如下：
DSL 是 Domain Specific Language 的缩写，意思就是特定领域下的语言，与DSL对应的就是通用编程语言，如Java/C/C++。换个通俗易懂的说法，DSL是为了解决某些特定场景下的任务而专门设计的语言。而本实施例提供的DSL动态表单布局引擎(后统称为DSL)就是为了解决动态定制表单而专门设计的数据流语言，其工作原理流程图如如图1所示：
首先是DSL重要组成部件-组件元数据:对于DSL，每个组件都有它的组件元数据(JSON格式)，它涵盖了渲染组件所需要的所有属性(组件标题、组件类型、组件编码、是否必填、默认值、描述、排列方式、是否隐藏、是否可编辑、是否联动、联动规则、扩展属性、填报值、是否子表单、子表单ID),例如单行文本的元数据(如图2所示)。
表单元数据则是本实施例需要设计的表单内所有组件元数据的集合，他是可以被持久化，保存至数据库中的结构化数据；其通过DSL的数据解析渲染引擎数据转换成所需要的表单。
数据解析渲染引擎所执行的任务包括:
从配置好的组件元数据集合中，读取约定好的固定字段，循环遍历Dom字典，遍历所有设计数据，然后用字符串匹配去判断每个节点的key与值，指引Dom去匹配相关组件模块的代码，匹配出input就创建单行文本，匹配出image就创建文件附件；
当匹配到的是带有子节点的组件时(比如:表格、交叉表格)，相同于之前的操作，循环遍历子节点，再读取约定好的固定字段，再匹配到对应模块的子组件，最后渲染得到带子节点的组件。
最后渲染后得到的HTML代码再经过三端(标准样式、WEB样式、APP样式)CSS样式的适配，最后得到可供多终端填报的定制表单。
本专利不局限于上述最佳实施方式，任何人在本专利的启示下都可以得出其它各种形式的基于DSL布局引擎的动态表单生成方法，凡依本发明申请专利范围所做的均等变化与修饰，皆应属本专利的涵盖范围。
Claims (7)
1.一种基于DSL布局引擎的动态表单生成方法，其特征在于，包括以下步骤：
步骤S1：为每个组件定义组件元数据，所述组件元数据包括渲染组件所需要的所有属性；
步骤S2：由所有组件元数据的集合构成表单元数据；所述表单元数据为可被持久化，保存至数据库中的结构化数据；
步骤S3：通过数据解析渲染引擎将表单元数据转化为HTML表单。
2.根据权利要求1所述基于DSL布局引擎的动态表单生成方法，其特征在于：还包括步骤S4：将HTML表单经过三端CSS样式的适配，得到可供多终端填报的定制表单。
3.根据权利要求1或2所述基于DSL布局引擎的动态表单生成方法，其特征在于：步骤S3具体包括以下过程：
步骤S31：从配置好的组件元数据集合中，读取约定好的固定字段，循环遍历Dom字典，遍历所有设计数据；
步骤S32：用字符串匹配去判断每个节点的key与值，指引Dom去匹配相关组件模块的代码，匹配出input就创建单行文本，匹配出image就创建文件附件。
4.根据权利要求3所述基于DSL布局引擎的动态表单生成方法，其特征在于：当匹配到的是带有子节点的组件时，相同于步骤S31和步骤S32的操作，循环遍历子节点，再读取约定好的固定字段，再匹配到对应模块的子组件，最后渲染得到带子节点的组件。
5.根据权利要求2所述基于DSL布局引擎的动态表单生成方法，其特征在于：所述三端CSS样式包括：标准样式、WEB样式和APP样式。
6.根据权利要求1所述基于DSL布局引擎的动态表单生成方法，其特征在于：所述渲染组件所需要的所有属性包括：组件标题、组件类型、组件编码、是否必填、默认值、描述、排列方式、是否隐藏、是否可编辑、是否联动、联动规则、扩展属性、填报值、是否子表单、子表单ID。
7.根据权利要求1所述基于DSL布局引擎的动态表单生成方法，其特征在于：所述组件元数据为JSON格式。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011232987.1A CN112199626A (zh) | 2020-11-06 | 2020-11-06 | 基于dsl布局引擎的动态表单生成方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011232987.1A CN112199626A (zh) | 2020-11-06 | 2020-11-06 | 基于dsl布局引擎的动态表单生成方法 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN112199626A true CN112199626A (zh) | 2021-01-08 |
Family
ID=74033992
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202011232987.1A Pending CN112199626A (zh) | 2020-11-06 | 2020-11-06 | 基于dsl布局引擎的动态表单生成方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN112199626A (zh) |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN115238218A (zh) * | 2022-09-26 | 2022-10-25 | 北京美络克思科技有限公司 | 网页设计方法及网页设计装置 |
| CN117743346A (zh) * | 2024-02-20 | 2024-03-22 | 神州医疗科技股份有限公司 | 数据表单生成系统 |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20160132304A1 (en) * | 2014-11-12 | 2016-05-12 | International Business Machines Corporation | Contraction aware parsing system for domain-specific languages |
| CN108496154A (zh) * | 2017-11-30 | 2018-09-04 | 深圳市大疆创新科技有限公司 | 网站内容服务架构方法及系统 |
| CN108664245A (zh) * | 2018-04-27 | 2018-10-16 | 厦门南讯软件科技有限公司 | 一种基于json自描述结构的网页界面生成方法及装置 |
| CN109614088A (zh) * | 2018-12-07 | 2019-04-12 | 北京知道创宇信息技术有限公司 | 表单组件生成方法及装置 |
-
2020
- 2020-11-06 CN CN202011232987.1A patent/CN112199626A/zh active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20160132304A1 (en) * | 2014-11-12 | 2016-05-12 | International Business Machines Corporation | Contraction aware parsing system for domain-specific languages |
| CN108496154A (zh) * | 2017-11-30 | 2018-09-04 | 深圳市大疆创新科技有限公司 | 网站内容服务架构方法及系统 |
| CN108664245A (zh) * | 2018-04-27 | 2018-10-16 | 厦门南讯软件科技有限公司 | 一种基于json自描述结构的网页界面生成方法及装置 |
| CN109614088A (zh) * | 2018-12-07 | 2019-04-12 | 北京知道创宇信息技术有限公司 | 表单组件生成方法及装置 |
Non-Patent Citations (1)
| Title |
|---|
| GAME3108: "动态界面：DSL&布局引擎", 《HTTPS://BLOG.CSDN.NET/GAME3108/ARTICLE/DETAILS/71525610?》 * |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN115238218A (zh) * | 2022-09-26 | 2022-10-25 | 北京美络克思科技有限公司 | 网页设计方法及网页设计装置 |
| CN117743346A (zh) * | 2024-02-20 | 2024-03-22 | 神州医疗科技股份有限公司 | 数据表单生成系统 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN104461484B (zh) | 前端模板的实现方法和装置 | |
| CN101968817B (zh) | 网页模板配置方法 | |
| CN102184184B (zh) | 一种网页动态信息获取方法 | |
| CN106648662B (zh) | 基于工程造价计算描述语言bcl的报表生成装置及生成方法 | |
| CN105447099A (zh) | 日志结构化信息提取方法及装置 | |
| CN107391153B (zh) | 一种基于Spring与MyBatis框架整合的代码生成方法及装置 | |
| CN101714133A (zh) | 一种基于web的数学公式编辑系统及方法 | |
| CN109710260B (zh) | 一种基于多平台的小程序代码转换方法 | |
| CN111309313A (zh) | 一种快速生成html以及存储表单数据的方法 | |
| CN112199626A (zh) | 基于dsl布局引擎的动态表单生成方法 | |
| CN113609820A (zh) | 基于可扩展标记语言文件生成word文件的方法、装置及设备 | |
| CN108170409B (zh) | Web前端控件的开发方法和系统 | |
| CN108664546B (zh) | Xml数据结构转换方法和装置 | |
| CN103593277A (zh) | 日志处理方法及系统 | |
| CN111124380A (zh) | 一种前端代码生成方法 | |
| CN109284088B (zh) | 一种信令大数据处理方法及电子设备 | |
| CN106775826B (zh) | 一种使用注解方式加载代码文件的方法及系统 | |
| CN113127442A (zh) | 数据模型的可视化的方法、装置及存储介质 | |
| CN107632831B (zh) | 快速规范前端代码的方法及装置 | |
| CN102609505A (zh) | 基于数据操作语言的动态网页方法 | |
| CN102937910A (zh) | 控制算法跨平台转换系统及方法 | |
| CN106991144B (zh) | 一种定制数据爬取工作流的方法及系统 | |
| CN115202756A (zh) | 基于Vue的组件加载方法、系统和电子设备 | |
| CN110554860B (zh) | 一种软件项目自然语言编程接口nli的构造方法及代码生成方法 | |
| CN112685435A (zh) | 一种基于Vue和Mybatis的表格查询方法及系统 |
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 | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20210108 |
|
| RJ01 | Rejection of invention patent application after publication |