SlickMaster.NET 开源表单设计器快速使用指南

前言：在企业数据处理过程中，经常需要通过定制表单来输入业务数据。由于涉及的数据比较离散，并不同于ERP系统的紧密关联数据。假如由开发人员每个增加页面，工作量会比较大，后期后期的维护很升级也耗费时间和精力。所以表单设计器是一个实现动态表单的解决办法，用户无需重复编写表单代码就可以管理表单和存储表单数据。

1. 表单设计器

表单设计器是一款基于Bootstrap3风格的WEB应用，操作过程描述主要是将左侧面板控件拖动到表单编辑区域进行排版，每个控件可以编辑对应的数据库字段属性，常见属性有：字段类型，输入格式，控件名称等。等所有界面字段编辑保存后，生成表单模板的HTML文本。从而可以预览正式的表单加载页面。这样在表单集成业务应用系统中，生成正式的运行页面。在运行阶段，页面控件的输入数值可以被保存在后端对应的数据库表中。

1.1 控件类型

常见的控件类型主要有：输入文本框，下拉框，单选按钮，复选按钮，多选列表，命令按钮和数据表格等。其中如文本等类型的控件对应数据库的输入字段，而如按钮类型的控件只是在界面上显示而已，并不对应于数据库的字段。

1.2 HTML内容

表单定义内容被存储成HTML内容，便于表单后期解析加载。其中HTML的Bootstrap框架样式和脚本文件只需要记录路径就可以。通过表的设计器上的预览功能界面上，就可以看到完整的HTML输出内容和页面布局。

1.3 高级控件功能实现

a) 文件上传组件

表单附件是依附于表单的文档数据，比如WORD、EXCEL、PDF和JPEG文件等。在表单设计器控件中，文件上传组件采用了第三方组件FineUpload完成这一控件功能。表单定义的HTML内容中包含了上传组件类型，在表单解析器中将会加载FineUpload控件的样式和脚本，并通过上传页面完整实现文件上传到后端服务器的过程。

文件上传到服务器端后，可以对接用户自有的文件系统，也可以比如阿里云或其它云端存储系统。

b) 数据表格组件

在一个表单中为了展现关联数据，可以设置数据表格控件来读取数据库其它表单实体数据。数据表格采用ag-grid控件，主要是考虑复杂数据格式的处理和编辑。

1.4 表单解析器

表单解析器是把表单定义的HTML内容重新加载到页面DIV控件中，对于简单控件类型，直接加载预留的控件格式定义就可以，但是对于高级控件，如文件上传和数据表格控件，则需要额外读取这些控件的样式或者脚本，或者其它标准定义好的页面，从而完成这些控件的所实现的表单高级功能。

2. 表单数据存储

常见的表单数据存储有XML格式，或者预留的多列数据库结构定义以及EAV模型存储。在SlickMaster表单设计器项目中，优先采用了EVA模型，主要考虑的是系统的数据存储和后期读取效率的平衡。EAV模型也被知名电商公司Magento应用于产品数据定义，确实很好地解决了表单定义、表单数据存储和表单数据查询等关键问题。

2.1 EAV模型解释

EAV是Entity-Attribute-Value的缩写，用于存储表单实体、属性定义和属性数值。跟传统关系型数据库不同的是：实际表数据库存储时是key-value格式的行记录存储，而关系型数据库是多列数据存储。

2.2 表单数据行列转置

数据读取虽然可以通过行记录方法读取出来，其中一行读取一条属性名称和属性数值。但是通常的行记录是希望包含多列数据同时拼凑出一条。所以数据库记录需要行列转置(Pivot)来实现表单数据实体的读取。虽然属性不是固定对象字段类型，但是仍然可以通过.NET的dynamic类型来操作处理。再有，这些动态类型的实体数据，在前端展现也可以通过每次动态生成的列标题来加载展现，最终实现了数据的用户友好体验展现。

3. 表单和工作流引擎的集成

表单可以跟引擎组件集成在一起完成文档的审批流转。其中表单数据的保存、接收、流转、撤销、退回、废弃和结束等通用按钮都是可以被标准化定义出来。而表单解析器则是通过把表单设计器定义好的表单HTML内容加载在动态表单的展现区域。

4. 总结：

表单设计器用于解决常见的比如调查问卷填写，或企业管理数据的录入和维护，其主要功能是渲染生成HTML表单，存储结构化数据。在高级应用功能是集成工作流引擎组件，完成表单审批流转。

5. DEMO

演示地址：http://demo.slickflow.com/smd/

6. 社区版源代码

SlickMaster项目开源地址:

http://github.com/besley/slickmaster

7. 企业版授权说明

1) Demo仅作为功能演示使用，如需获取产品完整源代码和开发文档，请申请企业版商业授权。

2) QQ群：233248778

3) EMail: sales@ruochisoft.com