Conflux BPM动态表单设计说明.docx
2021年2月8日 更新
开启更多功能,提升办公效能

BPM动态表单设计


  1. 系统简介

本项目采用SpringCloud微服务架构,基于SpringBoot实现微服务。

动态表单是本项目核心功能之一,可直接在页面进行设计实现应用。使用动态表单创建应用简单快捷,步骤逻辑清晰;用户可直接在系统设计表单及列表,根据所设计的表单直接在数据库生成对应的表。

  1. 页面整体布局

表单整体布局如下图:

  1. 表名:表单名称,并且为生成的数据库表名称(如:demo_office)
  1. 说明:填写表名对应中文(如:机构示例)
  1. 模块:该表单所属模块(其中admin为系统模块,模块名称跟随前端生成代码路径)
  1. 类型:选择表单类型,包括:列表、树表及左树右表
  1. 主表:涉及主子表时,需要填写该部分,填写主表表名
  1. 外键:涉及主子表时,跟随主表填写内容填写,一般为parent_id
  1. 合约地址:下拉选择即可
  1. 流程上链:下拉选择流程是否上链(审批过程)
  1. 快速创建:填写自己所需要内容,使用‘,’或空格进行分隔
  1. 数据项:点击将其选择到表单设计区
  1. 自由表单:表单页面设计区域
  1. 隐藏区域:无需显示到页面上但需存在的字段放到该部分,默认有六个隐藏空间
  1. 属性配置:点击自由表单部分空间,对其进行字段名(对应数据库字段名)、说明(对应数据库字段注释)、默认值、窗格等内容设置。注意:每个控件配置完成后需点击‘应用’按钮该配置才生效
  1. 表单设计步骤

通过五(六)个步骤即可完成一个模块的具体内容。其中包括:

  1. 表单设计
  1. 列表设计

(自定义表单)(若不需要可不设计)

  1. 新建菜单
  1. 同步数据库
  1. 表单发布。

下面以项目管理及合同审批为例,分别创建普通表单和流程表单。

  1. 普通表单

以项目管理为例,分步骤创建普通表单,实现项目信息的增删改查、组合查询条件及分页功能。

  1. 表单设计

1.登录Bpm平台,菜单栏中表单管理--表单设计,点击添加新建表单;

2.在表单设计tab页下,填写表名(project_manage)、说明(项目管理),英文说明点击说明后面的‘译’按钮即可,选择表单类型为列表,合约地址选择系统测试合约;如下图所示:

3.点击快速创建,填写自己所需要的内容,使用空格分隔

:快速创建的内容默认为单行文本组件,如需设计下拉框,人员选择等内容,需在领域管理--通用领域部分将所要快速创建的字段进行设计添加;

否则添加之后对部分内容进行手动添加控件进行设计(点击相应组件,即可添加该组件)

4.点击需要设计的组件,右侧可对其进行属性配置

具体可配置内容如下:

  1. 字段名:数据库字段名(建议把默认的s01等改为日常写代码用的数据库字段名,可以参考翻译结果)
  1. 说明:数据库字段注释,英文说明点击说明后面的‘译’按钮即可
  1. 是否可编辑
  1. 默认值
  1. Java类型:String、long、Integer、Double等(根据需要自行选择)
  1. 物理类型:文本、整型、日期、长文本等(根据需要自行选择)
  1. 窗格:在表单中占一整行,选择x12,占据半行则选择x6即可
  1. 可空:若未必填项,则选择必填,否则选择可空
  1. 校验:对组件内容进行校验,可选择字符串、电子邮件、日期、银行卡号、身份证号等
  1. 最大长度/最小长度,最大值/最小值
  1. Java属性名称:该名称在表单中唯一,不能重复
  1. 显示表单类型:单行文本、多行文本、下拉框、多文本编辑器等
  1. 区块链:对某字段设置其是否为区块链以及区块链是否加密,如下图所示

注意:对组件进行配置之后一定要点击‘应用’按钮才可修改生效。每个字段改完了,直接点应用,再改下一个字段。直接点下一个字段,上一个字段的修改会消失。


  1. 自定义表单

若需要导出单据类内容,则可在自定义表单部分根据表单设计的内容自定义表单内容,如下图所示;点击“生成自定义表单”按钮,生成自定义表单。


  1. 列表设计

在列表设计tab页下。组合查询条件设计:拖拽左侧数据项到自由表单列表选择其作为查询条件;如下图:


点击齿轮选择其查询匹配方式(=,>,<,like等),点击应用配置完成。如下图:

列定制选择列表展示内容,如下图:

之后选择对表单进行保存。

  1. 新建菜单

列表搜索表单project_manage,点击设计。在创建菜单的tab页下点击添加菜单,选择上级菜单和图标,之后进行保存。如下图:

  1. 同步数据库

列表搜索表单project_manage,列表可以看到该表单数据库同步状态,显示未同步,点击同步数据库按钮进行同步数据库操作(即在数据库中创建该表)。

  1. 表单发布

列表搜索表单project_manage,勾选表单,点击列表页的发布按钮对代码进行发布(生成前端页面代码),选择表单风格(动态表单物理表),填写功能描述及功能名。

  1. 刷新缓存

系统设置的菜单下找到缓存管理,分别点击“刷新字典缓存”、“刷新菜单缓存”,“刷新表单缓存”。如下图所示:

  1. 模块演示
  1. 添加项目信息

如下图所示:可以看到项目姓名、项目编号、项目负责人等单行文本及人员选择内容,日期选择显示正常,项目目标、项目描述等为多行文本;项目名称、项目编号设置其上链(区块链);

  1. 项目信息查看

如下图所示:列表页可以看到设计好的相关显示字段,每条数据操作列部分查看相关操作按钮,点击实现对数据的查看、编辑、删除操作。

  1. 组合查询条件及分页

如下图所示,根据名称内容进行查询,列表仅展示查询条件的数据,且可在列表页右下角看到分页信息。

  1. 编辑删除项目信息

编辑删除学生信息不做说明,自行测试即可。

  1. 流程表单

以合同管理为例,分别进行上链流程申请-审批演示。增加、查看、编辑、删除信息、分页、组合查询条件等功能同非流程表单,以下内容对该部分不做记录。

  1. 表单设计

1.登录Bpm平台,菜单栏中表单管理--表单设计,点击添加新建表单;

2.在表单设计tab页下,填写表名(contract_manage)、说明(合同管理),英文说明点击说明后面的‘译’按钮即可,选择表单类型为列表;

3.点击快速创建,填写自己所需要的内容,使用空格分隔

:快速创建的内容默认为单行文本组件,如需设计下拉框,人员选择等内容,需在领域管理--通用领域部分将所要快速创建的字段进行设计添加;

否则添加之后对部分内容进行手动添加控件进行设计(点击相应组件,即可添加该组件)

4.点击需要设计的组件,右侧可对其进行属性配置

具体可配置内容如下:

  1. 字段名:数据库字段名
  1. 说明:数据库字段注释,英文说明点击说明后面的‘译’按钮即可
  1. 是否可编辑
  1. 默认值
  1. Java类型:String、long、Integer、Double等(根据需要自行选择)
  1. 物理类型:文本、整型、日期、长文本等(根据需要自行选择)
  1. 窗格:在表单中占一整行,选择x12,占据半行则选择x6即可
  1. 可空:若未必填项,则选择必填,否则选择可空
  1. 校验:对组件内容进行校验,可选择字符串、电子邮件、日期、银行卡号、身份证号等
  1. 最大长度/最小长度,最大值/最小值
  1. Java属性名称:该名称在表单中唯一,不能重复
  1. 显示表单类型:单行文本、多行文本、下拉框、多文本编辑器等
  1. 区块链:对某字段设置其是否为区块链以及区块链是否加密,如下图所示

注意:对组件进行配置之后一定要点击应用才可修改生效。

  1. 自定义表单

若需要导出单据类内容,则可在自定义表单部分根据表单设计的内容自定义表单内容,如下图所示;点击“生成自定义表单”按钮,生成自定义表单。

  1. 列表设计

在列表设计tab页下。组合查询条件设计:拖拽左侧数据项到自由表单列表选择其作为查询条件;如下图:

点击齿轮选择其查询匹配方式(=,>,<,like等),点击应用配置完成。如下图:

列定制选择列表展示内容,如下图:

  1. 流程定义

1.在流程定义tab页下,点击添加新建流程,填写相关内容并保存,如下图:

2.选中要设计的流程,在操作列部分选择在线设计,对流程进行设计,如下图所示:

3.选中某一节点,点击权限配置,如下图所示:

4.人员范围部分设置流程中该流程相关人员,(注:第一节点人员必须选择相对角色中的发起者)如下图所示:

4.权限规则中,选择表单按钮,表示流程中该节点所拥有按钮(可对当前申请进行暂存、提交到下一节点等);规则变量中设置该节点用户是否可对当前表单的内容进行修改或填写,并设置其是否显示、是否必填等内容;如下图所示:

5.之后进行保存,并对流程中涉及到的节点分别按照需求进行设计,之后点击部署,进行部署,并将该流程选中到该表单设计中,如下图所示:

之后对表单进行保存。

  1. 新建菜单

列表搜索表单contract_manage,点击设计。在创建菜单的tab页下点击添加菜单,选择上级菜单和图标,之后进行保存。如下图:

  1. 同步数据库

列表搜索表单contract_manage,列表可以看到该表单数据库同步状态,显示未同步,点击同步数据库按钮进行同步数据库操作(即在数据库中创建该表),同步之后可以看到同步数据库状态为‘已同步’,如下图:。

  1. 表单发布

列表搜索表单contract_manage,勾选表单,点击列表页的发布按钮对代码进行发布(生成前端页面代码),选择表单风格(动态表单物理表),填写功能描述及功能名。

  1. 刷新缓存

系统设置的菜单下找到缓存管理,分别点击“刷新字典缓存”、“刷新菜单缓存”,“刷新表单缓存”。如下图所示:

  1. 模块演示
  1. 填写合同申请

点击添加合同申请按钮(待发Tab页),填写相关内容;如下图:

点击提交,即可提交到流程下一节点,如下图所示:

  1. 流程审批

根据流程配置,上一节点用户对当前申请提交之后,下一节点用户(即当前登陆用户)可在待办(待办Tab页)中查看自己需要办理的流程,选中需要办理的申请单,点击办理,填写审批意见,并可查看流程日志,根据流程配置选择是否可对当前表单内容进行修改。详情如下:


A.下一节点用户在待办中可以看到自己待办的内容(即:当前情况下,上一节点用户提交的内容);如下图所示:

B.点击办理,即可填写审批意见继续选择提交或回退(当前申请不会提交到下一节点,而是回退到上一节点,上一节点的用户可在其待办中看到),最后一个节点的人员提交后,该流程结束;如下图所示:

  1. 查看流程日志

每一个表单在查看或编辑时都可查看流程日志,并可查看当前审批流程已经走到了哪个节点(当前为了方便操作,使用同一人进行申请审批,具体实际应用要根据需求决定)。如下图所示: