web软件开发框架 WebBuilder 的流程设计器使用

流程设计器

流程设计器用于设计工作流流程模板文件，该流程文件可以被运行以发起工作流。流程文件是以json格式组织的文件，默认存储在服务器端WebBuilder的资源目录wb/system/resource下。

流程设计器顶部是操作工具条，右侧是设置流程、节点和连接的属性编辑器，客户区是流程文件打开后的设计器。

我们可以在主页面中，点击[开发套件]->[流程设计器]来打开该模块。

功能操作

• 新建：打开文件对话框，并创建新的流程文件。
• 打开：打开文件对话框，并打开已经存在的流程文件。
• 保存：保存当前打开的文件。
• 保存全部：保存所有已经被修改的文件。该菜单位于保存按钮的下拉菜单中。
• 另存为：打开文件对话框，并把当前文件另存为一个新的文件。该菜单位于保存按钮的下拉菜单中。
• 剪切：复制并删除当前流程设计器中选择的节点。
• 复制：复制当前流程设计器中选择的节点。
• 粘贴：把剪切或复制的节点粘贴到当前流程设计器中。
• 滚动条：流程设计器是否显示/隐藏滚动条，当设计具有很多节点的流程时可以选择显示滚动条。
• 网格线：流程设计器是否显示/隐藏网格线，网格线用于对齐流程节点。
• 添加节点：用于创建新的节点。点击该按钮后，再点击流程设计器中的界面，即可在流程设计器被点击处创建新的节点。
• 添加连线：用于连接两个节点并创建连接线。在流程设计器中选择一个源节点，然后点击该按钮，最后选择一个目标节点，即可在源节点和目标节点之间创建连接线。

设置流程、节点和连接的属性

在流程设计器中点击流程设计器的空白处将在属性编辑器中显示当前流程的流程属性，点击节点将在属性编辑器中显示该节点的属性，点击连接线将在属性编辑器中显示当前连线的属性。

流程属性

属性名称	说明
背景色	设置整个流程设计器使用的背景色。
流程名称	用于标识流程。
处理对话框	在[我的流程]模块中，点击[处理]按钮时弹出的对话框。
查看对话框	在[我的流程]模块中，点击[查看]按钮时弹出的对话框。
前置模块	在服务器端执行流程的动作之前运行的模块。
后置模块	在服务器端执行流程的动作之后运行的模块。
按钮宽度	默认生成的动作按钮的最小宽度。
备注	提示性说明文本。

节点属性

属性名称	说明
样式	预置的节点类型和样式。
字体色	节点的标签字体色。
字体大小	节点的标签字体大小。
背景色	节点的背景色。
图标	节点的图标。
名称	节点的标识。
处理人员	流程流转到该节点，指定由哪些用户处理。详见后述人员选择对话框说明。
抄送人员	流程流转到该节点，指定哪些用户可以查看。详见后述人员选择对话框说明。
通过人数	指定当该节点的处理人数达到该值后，流程即可以往下继续流转。人数可以为绝对值或百分比数，例如6或100%等，分别表示处理人员中有6人或100%通过时流程继续往下流转。
动作类型	设置单个或多个默认的动作类型，并把动作类型对应的按钮添加到对话框底部。详见后述动作类型说明。
处理对话框	在[我的流程]模块中，点击[处理]按钮时弹出的对话框。如果缺省设置默认将使用流程的[处理对话框]属性的设置。
查看对话框	在[我的流程]模块中，点击[查看]按钮时弹出的对话框。如果缺省设置默认将使用流程的[查看对话框]属性的设置。
按钮宽度	生成的动作按钮的最小宽度。如果缺省设置默认将使用流程的[按钮宽度]属性的设置。
标题	在[我的流程]模块中，当流程处理到该节点时显示的提示性文本，例如“{#flow.userDispName#}已经完成报销”。
备注	提示性说明文本。

连线属性

属性名称	说明
使用直线	指定该连线对两个节点之间是否采用直线连接，默认使用折线连接。
字体色	连线上的标签字体色。
字体大小	连线上的标签字体大小。
背景色	连线使用的颜色。
图标	节点的标签边上的图标。
标题	节点的标签。
条件	一段ServerScript脚本，如果该脚本return true，执行通过动作时将转到目标节点。
备注	提示性说明文本。

人员选择对话框

当设置处理人员或抄送人员属性时将打开该对话框，选择的人员为所有子项选择人员的并集。

选择人员的子项包括：

• 指定人员：选择具体的人员个体。
• 指定人员所属角色：选择包含指定角色的所有人员。
• 指定人员所属部门：选择部门直属的所有人员，不包含子部门所属人员。
• 通过自定义模块指定人员：指定模块，并获得模块运行后返回的人员列表，返回的人员列表以数组表示，比如return ['userId1','userId2'];。

流程动作类型

流程动作是指对流程执行预定义的某种操作。当设置动作类型属性时，将打开动作类型设置对话框。

预定义的动作类型包括：

• pass：通过动作，使当前节点流转到连线所连接的目标结点。流转时必须满足连线所设置的条件。
• reject：退回动作，弹出退回对话框，由用户选择退回到指定的节点。
• beforeSign：前加签动作，在当前节点之前动态加入一个新的节点，并指定处理人员。
• plusSign：并加签动作，在当前节点动态添加新的处理人员。
• afterSign：后加签动作，在当前节点之后动态加入一个新的节点，并指定处理人员。
• turn：转办动作，把当前节点的处理人员中的本人替换为另一个用户。
• cancel：取消动作，关闭对话框，不执行任何动作。

动作类型的其他一些属性：

• 选择：勾选该项，表示该动作按钮显示在指定的处理对话框中。
• 按钮标题：动作按钮上的标签。
• 按钮图标：动作按钮上的图标。
• 执行模块：动作执行后在后台执行的模块。可以在该模块中把相关的流程数据和参数保存到数据库中。
• 前置方法：点击动作按钮发起动作之前，在客户端触发的方法名称。该方法需在对应对话框的app中定义。方法如果返回false将取消动作的执行。
• 后置方法：点击动作按钮发起动作之后，在客户端触发的方法名称。该方法需在对应对话框的app中定义。

开发工作流应用

在WebBuilder中可以方便和快速地开发复杂的工作流应用，开发工作流应用可以通过以下步骤来进行：

1. 通过[开发套件]->[流程设计器]设计工作流模板文件；
2. 发起指定流程模板文件的流程。可以通过以下方法发起：
   • 在[我的应用]->[资源管理器]中双击指定的流程文件发起流程。
   • 在前台使用客户端js方法Flow.startFlow发起流程，需要引用wb/script/flow.js。
   • 在后台使用后台Java方法com.wb.tool.Flow.start发起流程。

   详细的方法使用说明请参考API文档。

3. 在[我的应用]->[我的工作流]中查看和处理流程。

流程的运行

流程的运行从开始节点开始，从结束节点结束。流程发起后，首先调用开始节点指定的处理对话框，并在该对话框底部的按钮栏中自动生成根据动作类型属性指定的按钮。 点击指定的动作按钮时将执行对应的动作类型，如果点击通过动作按钮，流程将流转到下一个节点。

在[我的应用]->[我的工作流]模块中可以处理和查看我的流程，这些流程包括当前节点需要我处理的流程、抄送给我的流程或我处理过的历史流程。 流程的当前节点的处理人员由[处理人员]属性定义，流程的抄送人员在[抄送人员]属性中定义，其中抄送人员只能查看不能处理。 在[我的工作流]模块中点击[处理]按钮将打开由处理对话框属性指定的对话框，点击[查看]按钮将打开由查看对话框属性指定的对话框。

当流程流转到结束节点后，流程结束。

流程的参数

流程的参数包括以下几类：

• 流程的系统参数，如flow.lastUserId等
• 处理对话框中提交到后台的所有控件值
• 处理对话框所在模块app.extraParams对象中的值
• 使用Flow.startFlow方法发起流程带的参数

以上的参数均会被自动保存到流程实例中，并在每次打开对话框模块或其他模块时自动传递这些参数值。

在执行非对话框模块时，系统将传递流程中所有参数JSONObject对象到request attribute的sys.params属性中，使用该对象可用于增加、修改或删除流程参数值。

如以下代码可以修改流程参数值：

 

1 var flowParams = app.get('sys.params'); //获取存放流程参数的JSONObject对象

2 var myParam = flowParams.get('myParam'); //获取某个流程参数值

3 flowParams.put('myParam', myParam + otherValue); //设置某个流程参数值

当我们需要把流程或对话框中的参数保存到业务数据库表时，可以在指定动作的[执行模块]属性中完成。

系统流程参数

预定义的系统流程参数包括：

• flow.id：流程的id号
• flow.nodeName：流程的当前节点名称
• flow.nodeTitle：流程的当前节点标题
• flow.startDate：流程的发起日期
• flow.userId：流程发起的用户id
• flow.userName：流程发起的用户名称
• flow.userDispName：流程发起的用户显示名称
• flow.flowName：流程名称
• flow.action：流程的当前执行动作
• flow.lastDate：流程最后的执行日期
• flow.lastUserId：最后处理流程的用户id
• flow.lastUserName：最后处理流程的用户名称
• flow.lastUserDispName：最后处理流程的用户显示名称
• flow.lastNodeName：流程在流转之前的节点名称

WebBuilder官网：http://www.geejing.com

WebBuilder社区：http://www.putdb.com