表单引擎设计实现的三大范式

表单引擎三大范式与驰骋双轨实现

文档版本：2026-06
依据代码：CCFlow/Components/BP.WF、CCFlow/Components/BP.En30、Vue3/src/WF
在线演示：http://ccflow.org
说明：本文阐述业界表单实现的三种主流设计范式，并结合驰骋 BPM/CCFlow 源码说明平台如何以「低代码表单 + 高代码表单」双轨落地，供技术选型与方案宣传使用。

一、引言：同一道题，多种解法

在企业信息化建设中，「表单」是最常见、也最核心的交互载体——从一张请假单，到一份合同、一套主从业务单据，都离不开表单的采集、展示与校验。

纵观三十余年企业软件演进，表单实现逐渐沉淀为三种主流设计范式：

三种范式都能完成「录入—校验—存储—展现」这一完整闭环。没有绝对的对错，只有不同的角度与立场——如同同一道数学题可以有代数解、几何解与图解法，选型取决于团队技能、变更频率、性能要求与交付周期。

驰骋 BPM 在表单领域采取双轨并行策略：

• 低代码表单（基于数据库）：通过设计器将表单元素与交互逻辑写入数据库，由通用解析器渲染；
• 高代码表单（基于规则）：通过 TypeScript/C# 实体类定义字段、查询、主从关系，由固定解析组件渲染。

下文逐一展开三种范式，并深入驰骋的具体实现。

二、范式一：基于文件的表单

2.1 核心思想

这是传统、也是最直觉的解决方案：由数据模型驱动，生成静态页面文件。

典型流程：

数据模型（表结构） → 代码/页面生成器 → .html / .jsp / .aspx 文件 → 浏览器渲染

每个表单对应一份（或一组）页面文件，文件内硬编码或通过模板填充字段标签、输入框、列表列定义。修改表单布局，通常意味着重新生成或手工改文件，再部署到 Web 容器。

2.2 优势与局限

优势：

• 技术栈成熟，与宿主框架（Servlet、ASP.NET）天然契合；
• 单页性能可控，无运行时元数据解析开销；
• 适合表单结构极少变更、由开发团队全权维护的场景。

局限：

• 业务人员无法自助调整字段与布局；
• 多端（PC / 移动）需维护多套文件或额外适配层；
• 表单逻辑（级联、显隐）散落在页面脚本中，难以统一治理与复用。

2.3 在驰骋体系中的位置

驰骋主路径已演进为「数据库元数据 + 规则代码」双轨，但文件范式仍作为补充能力存在：

• 嵌入式表单（FrmType.Url = 3）：节点绑定外部 URL 页面，由第三方系统自行实现 UI；
• 开发者表单（FrmType.Develop = 8）：富文本 HTML 模板存入Sys_MapData.HtmlTemplateFile，运行时直接输出；
• VSTO Word/Excel 表单：以 Office 文件为「表单模板文件」，本地 Office 程序加载展现。

这些场景的本质仍是「规则固化在文件中」，与经典 JSP/ASPX 一脉相承，适用于版式复杂、需借助 Office 排版能力的文档类业务。

三、范式二：基于数据库的表单（低代码）

3.1 核心思想

将表单的全部描述信息存储到数据库，运行时由通用解析器读取元数据，动态拼装 PC 端、移动端、列表查询与表单展现。

驰骋低代码表单遵循经典的四步链路：

梳理规则 → 定义规则（设计器） → 存储规则（数据库） → 解析规则（解析器组件）

3.2 元数据模型：存什么？

驰骋将表单元数据拆分为多张系统表，职责清晰、可独立演进：

表单元素（用户可见的控件）在驰骋中统一称为MapAttr，类型丰富。前端设计器FoolFormDesigner的DBEnums枚举涵盖：

• 输入类：文本框、下拉框、复选框、单选按钮、日期、评分……
• 附件类：图片附件、手写签名、公文正文、多附件……
• 展示类：大块 HTML 文本、流程进度图、图标、超链接……
• 业务类：关联流程、关联单据、子表（从表）……

交互逻辑与元素分离，存入Sys_MapExt。例如：

• GPE_ActiveDDL：两个下拉框的级联联动；
• GPE_AutoFull：字段自动计算；
• GPE_Cascader：级联选择器；
• 单选按钮控制其他字段显示/隐藏（UIkeyRef机制）。

设计器侧可在字段属性面板直接配置上述扩展，无需写代码。

3.3 解析器：怎么渲染？

元数据写入数据库后，由统一解析器在不同终端、不同场景下渲染：

后端WF_CCForm.cs在运行时会遍历Sys_MapAttr，结合Sys_MapExt处理下拉框数据范围、自动填充等逻辑——一份库表元数据，多端多场景复用。

3.4 低代码表单的五类设计器

驰骋低代码表单并非「一种设计器打天下」，而是针对五类典型应用场景，提供专用设计器（入口：GPN_NewFrm新建表单向导）：

五类设计器的共性：设计成果全部落入数据库（或关联的模板存储），运行时由平台解析器统一加载，业务人员可在设计器中自助完成大部分配置。

补充：平台还支持 WPS 表单、AI 大文本表单、嵌入式 URL 表单等扩展类型，可按需选用。

经典表单设计器一览

经典表单是使用最广的类型，GPE_FrmType帮助文档概括其特点：

• 字段顺序支持拖拽移动；
• 栅栏格（Grid）布局；
• 文本属性可配置为文本、单选、多选、定位、评分、多附件、地图、身份证识别等丰富控件。

章节表单结构

章节表单将「分组」语义升级为「章」，每个字段默认为大块文本（节），天然适合层次化文档：

章（GroupField, CtrlType=Dir） └─ 节（MapAttr, 大块文本 / 多字段 / 附件 / 从表 / 自定义 URL）

新建章节表单时，系统自动初始化章节树（见GPN_NewFrm中pageNo == '10'的初始化逻辑）。

四、范式三：基于规则的表单（高代码）

4.1 核心思想

不再将字段与布局逐条写入数据库，而是在代码中声明实体规则，借助 ORM 的Map/Attr体系描述：

• 物理表与主键；
• 字段类型、标签、默认值、校验；
• 分组、查询条件、主从关系；
• 权限（UAC）、生命周期钩子（beforeInsert/beforeUpdate）。

运行时由少量固定解析组件读取实体EnMap，渲染 UI 并分发事件——一份实体定义，多种视图模式。

驰骋高代码表单遵循三步链路（无独立「存储到库表」环节）：

梳理规则 → 定义规则（.ts 实体类） → 解析规则（Search / EnOnly / Group 组件）

4.2 示例：Student.ts实体

Vue3/src/App/Demo/Student.ts是官方演示实体，完整展示了高代码表单的声明式写法：

exportclassStudentextendsEntityNoName{publicoverridegetEnMap(){constmap=newMap('Demo_Student','学生');// 分组map.AddGroupAttr('基本字段');map.AddTBStringPK('No',null,'编号',true,true,4,4,80);map.AddTBString('Name',null,'名称',true,false,0,200,80);map.AddImgAth('AthICon','头像',true,false,3);map.AddGroupAttr('枚举');map.AddDDLSysEnum(