流程表单开发设计器设计方案

目 录

前言

设计功能
使用场景模拟
快速开发表单

表单使用

主要功能
表单设计器功能

其他相关功能

数据存储设计

Demo界面及功能
表单设计器
表单设计器功能界面整体原型

定义数据项目

表单字段属性定义

前言

原办公业务流程平台审批单使用业务数据（横向）表纵向存储的思路，所有流程所使用的业务表单的数据都存在一张物理表中，表中每条数据记录包含列的（Column）定义和值（Value），列（Column）所对应的字段信息，通过定义表来定义。这种设计需要使用代码进行数据组装，比较繁琐。当表单内容较大时，界面展现速度较慢，而且此方案很难支撑查询统计需求。

为了满足用户可自定义快速开发流程表单的需求，并解决上述方案的不足，采用NoSQL技术来优化设计，因为NoSQL无需事先为要存储的数据建立字段，随时可以存储自定义的数据格式。按NoSQL的特性，可以灵活进行schema结构（列的定义）的修改，理论上应该可以很好支持这些动态表单的持久化保存。

基于上述文档数据库管理思路，采用审批单（表单）模版，以及NoSQL与关系型数据库相结合的方案，设计目标如下：

使用用户化工具设计审批单（模版）

按规范规则，定义审批单关键数据项，例如如下统一命名关键数据项，标题、部门、关键数值（例如统计、流程流转规则所需要的）、时间等

审批单（模版）通过业务信息管理进行版本化管理

审批单数据存储分为两部分：一是关键字段内容，随同流程数据存储到关系型数据库中；整个表单（含HTML、CSS、JavaScript、图标等）连同数据内容，以文档整体对象存储到NoSQL数据库中

审批单上所涉及到的CSS、JS、图标等资源性文件，需要进行版本管理（在数据库中只保存他们的URL）；

注：“模版”为管理概念，通过业务信息管理上线使用的表单可以定义为模版，依赖业务信息进行版本管理。

设计功能

使用场景模拟

1.快速开发表单

Created with Raphaël 2.1.2运维人员运维人员表单设计器表单设计器MongoDBMongoDB表单信息管理表单信息管理1.按需求绘制表单（）2.定义表单数据项（）3.生成HTML文档（）4.保存文档到数据集（）5.发布开发完成表单（）

2.表单使用

Created with Raphaël 2.1.2运维人员运维人员业务信息管理业务信息管理表单信息管理表单信息管理流程等其他环节流程等其他环节MongoDBMongoDB1.新建业务（）2.添加表单（）3.展现表单列表（）4.选择表单（）5.略......（）6.提取表单文档并形成缩略图（）7.解析表单关键信息（）8.保存业务信息（）9.更新表单使用状态（）

主要功能

表单设计器功能

布局管理：增加/删除表单布局区块

编辑表单标题：

表单内容管理：在区块内按行管理，增加1行1栏、1行2栏、1行3栏、1行4栏，删除行

添加表单字段：定义表单字段名称、显示名称、数据i类型、验证等

表单样式管理：选择预设CSS样式

获取界面源码文档：

保存表单：保存表单文档到MongoDB数据库中

表单信息管理：发布表单到表单信息表中（MongoDB中的ID、时间、标题、创建人、状态、描述等）

其他相关功能

解析表单关键字功能：解析按规范规则所定义的字段关键字，以及将来所提供统计数据接口的数据定于

生成表单缩略图：生产静态表单或图片

表单预览：预览所设计表单，可以与“生成表单缩略图”通用

数据存储设计

业务文档的数据一般情况下分为三部分：业务文档数据、意见数据和附件。三部分数据在本项目中保存在MongoDB数据中，表单文档和意见文档保存在collections集合中，其中附件保存的db.fs.files集合中，三部分数据以内嵌文档方式保存。

附近存储使用GridFS。GridFS是一种将大型文件存储在MongoDB的文件规范。

Demo界面及功能

表单设计器

表单设计器功能界面整体原型

定义数据项目

表单字段属性定义

属性类型：

单行文本

多行文本

下拉列表

日期时间

复选控件

单选控件

表格控件

格式化类型

字符(abc)

数字(3.14)

电子邮件(admin@163.com)

网址(www.10010.com)

注：下拉列表数据内容，最好来自数据库事先定义。

参考：

从原理分析审批流表单配置功能使用的问题 肖永威 2014.2

在BPM动态可配置表单中使用NoSQL技术可行性分析——通用流程化应用审批单设计思路（二） 肖永威 2014.12

用MongoDB数据库来管理办公系统中文档型的表单和信息——通用流程化应用审批单设计思路（二，续） 肖永威 2015.1