本文导读
通过华为云Astro轻应用工作流中的用户任务实现优先审批功能
应用场景
在企业运营过程中，经常会遇到一些需要快速处理或者特殊关注的任务。例如，某些紧急项目需要快速审批，以便尽快启动。当企业重要客户提出需求时，需要快速响应以满足客户需求。或者在某些特殊情况下，高层领导需要具有优先审批权。
在华为云Astro轻应用的工作流中，通过设置用户任务的优先审批功能，可轻松实现上述功能。用户任务用来表示业务流程中由用户参与完成的工作。当引擎处理到该节点时，给指定的用户或者一组用户创建待处理的任务项，等待用户的处理。关于用户任务图元的详细介绍，可参见为华为云Astro轻应用工作流添加活动类图元。
本实践将为您介绍在华为云Astro轻应用工作流中，如何通过配置用户任务的审批动作和终止动作，在会签过程中实现优先级审批功能。
方案优势
华为云Astro轻应用工作流中内置了实现顺序审批、或签和会签等任务分派规则，可基于用户任务实现复杂的任务分派规则，应对复杂的交互流程。
步骤一：创建审批流对象
创建一个审批流对象，用于存储用户提交的申请数据。
- 创建一个低代码应用。
- 参考授权用户使用华为云Astro轻应用并购买实例中操作，申请华为云Astro轻应用免费试用或购买商业实例。
- 实例购买后，在华为云Astro轻应用服务控制台的“主页”中，单击“进入首页”，进入应用开发页面。
- 在“应用”中，单击“新建低代码应用”或单击
，进入新建低代码应用页面。 - 在新建低代码应用页面，应用类型选择“标准应用”，单击“确定”。
- 输入应用的标签和名称，单击“新建”，即可进入应用设计器。
图2 创建一个空白应用
- 在应用设计器的左侧导航栏中，选择“数据”，单击对象中的“+”。
- 设置对象的名称和唯一标识，单击“确定”。
图3 创建对象processDemo
- 在已创建的对象中，单击
，进入对象详情页面。 - 在“字段”页签，单击“添加”，为对象添加apply字段。
图4 添加apply字段
表3 添加apply字段参数说明 参数
说明
示例
显示名称
新建字段的名称，创建后可修改。
取值范围：1~63个字符。
申请标题
唯一标识
新建字段在系统中的标识，创建后不支持修改。命名要求如下：
- 长度不能超过63个字符，包括前缀命名空间的长度。
- 必须以英文字母开头，只能由英文字母，数字和单下划线组成，且不能以下划线结尾。
apply
字段类型
单击
，在弹出的页面中，根据页面提供的参数解释，选择新建字段所属的类型。文本
数据长度
允许输入字段的长度。
64
- 在“字段”页签，再次单击“添加”按钮，添加表4中字段。
图5 processDemo对象中包含字段
步骤二：创建脚本
- 创建脚本submit，用于启动工作流。
- 在应用设计器中，选择“逻辑”，单击脚本后的“+”。
- 新建一个空白的脚本，名称设置为“submit”，单击“添加”。
图6 创建脚本submit
- 在脚本编辑器中，输入示例代码。
import * as bpm from 'bp'; @action.object({ type: "param" }) export class ActionInput { @action.param({ type: 'Object', required: true, label: 'tripData' }) applicationData: object; } @action.object({ type: "param" }) export class ActionOutput { @action.param({ type: 'String', required: true, label: 'interviewID' }) interviewID: string; } @action.object({ type: "method" }) export class SubmitTrip { @action.method({ input: 'ActionInput', output: 'ActionOutput' }) public run(input: ActionInput): ActionOutput { let out = new ActionOutput(); out.interviewID = bpm.newClientV1().start('命名空间__bpm1', { data: input.applicationData }).interviewId; return out; } }其中，“命名空间__bpm1”为待创建工作流的名称，即步骤六：创建审批工作流中设置的值。
- 单击
，保存脚本，保存成功后单击
，激活脚本。
- 创建脚本createApplication，用于提交审批流数据，并将数据写入步骤一：创建审批流对象中创建的对象。
- 在应用设计器中，选择“逻辑”，单击脚本后的“+”。
- 新建一个空白的脚本，名称设置为“createApplication”，单击“添加”。
- 在脚本编辑器中，输入示例代码。
import * as db from 'db'; @useObject(['命名空间__processDemo__CST']) @action.object({ type: "param" }) export class ActionInput { @action.param({ type: 'object', required: true, label: 'applicationData' }) applicationData: object; @action.param({ type: 'string', required: true, label: 'interviewID' }) interviewID: string; } @action.object({ type: "param" }) export class ActionOutput { @action.param({ type: 'string', required: true, label: 'id' }) id: string; } @action.object({ type: "method" }) export class CreateBusiTrip { @action.method({ input: 'ActionInput', output: 'ActionOutput' }) public run(input: ActionInput): ActionOutput { const out = new ActionOutput(); let engine = db.object('命名空间__processDemo__CST'); input.applicationData['命名空间__bpmId__CST'] = input.interviewID; out.id = engine.insert(input.applicationData); return out; } }其中，“命名空间__processDemo__CST”为步骤一：创建审批流对象中创建的对象，“命名空间__bpmId__CST”为对象中添加的字段。
- 单击
，保存脚本，保存成功后单击
，激活脚本。
- 创建脚本queryApplication，用于根据bpmId查询审批流数据。
- 在应用设计器中，选择“逻辑”，单击脚本后的“+”。
- 新建一个空白的脚本，名称设置为“queryApplication”，单击“添加”。
- 在脚本编辑器中，输入示例代码。
import * as bpm from 'bp'; import * as db from 'db'; @useObject(['命名空间__processDemo__CST']) @action.object({ type: "param" }) export class ActionInput { @action.param({ type: 'String', required: true, label: 'interviewID' }) interviewID: string; } @action.object({ type: "param" }) export class ActionOutput { @action.param({ type: 'Object', required: true }) detail: object; } @action.object({ type: "method" }) export class QueryMyApproDetail { @action.method({ input: 'ActionInput', output: 'ActionOutput' }) public run(input: ActionInput): ActionOutput { let out = new ActionOutput(); out.detail = {}; let instanceId = input.interviewID; const bp = bpm.newInstanceClient(); let appliObj = db.object('命名空间__processDemo__CST'); let conditions = [{ "field": "命名空间__bpmId__CST", "operator": db.Operator.eq, "value": input.interviewID }]; let applications = appliObj.queryByCondition({ "conjunction": "AND", "conditions": conditions }); if (applications.length > 0) { input.interviewID; out.detail = { 命名空间__apply__CST: applications[0].命名空间__apply__CST, 命名空间__deadline__CST: applications[0].命名空间__deadline__CST, 命名空间__type__CST: applications[0].命名空间__type__CST, 命名空间__bpmId__CST: input.interviewID }; } return out; } }其中，“命名空间__processDemo__CST”为步骤一：创建审批流对象中创建的对象，“命名空间__bpmId__CST”、“命名空间__apply__CST”、“命名空间__deadline__CST”和“命名空间__type__CST”为对象中添加的字段。
- 单击
，保存脚本，保存成功后单击
，激活脚本。
- 创建脚本approve，用于处理审批任务。
- 在应用设计器中，选择“逻辑”，单击脚本后的“+”。
- 新建一个空白的脚本，名称设置为“approve”，单击“添加”。
- 在脚本编辑器中，输入示例代码。
import * as bpm from 'bp'; import * as context from 'context'; import * as db from 'db'; @action.object({ type: "param" }) export class ActionInput { @action.param({ type: 'String', required: true, label: 'state' }) state: string; @action.param({ type: 'String', required: true, label: 'interviewID' }) interviewID: string; } @action.object({ type: "method" }) export class ApproveTrip { @action.method({ input: 'ActionInput', output: 'ActionOutput' }) public run(input: ActionInput) { let instanceId = input.interviewID; let taskClient = bpm.newTaskClient(); let res = taskClient.queryByCondition({ condition: { conjunction: db.Conjunction.AND, conditions: [ { field: "processInsID", operator: db.Operator.eq, value: instanceId }, { field: "assigneeID", operator: db.Operator.eq, value: context.getUserId() } ] }, }); if (res.length) { const taskId = res[0].id; var count; let vars = taskClient.getVars(taskId, ["pass"]); if (vars["pass"]) { count = vars["pass"]; } else { count = 0; } if (input.state == "PASS") { bpm.newTaskClient().complete(taskId, '', { pass: count + 1 }) } else { bpm.newTaskClient().complete(taskId, '', {}) } } } } - 单击
，保存脚本，保存成功后单击
，激活脚本。
- 创建脚本getTask，用于获取审批流中的任务id。
- 在应用设计器中，选择“逻辑”，单击脚本后的“+”。
- 新建一个空白的脚本，名称设置为“getTask”，单击“添加”。
- 在脚本编辑器中，输入示例代码。
import * as db from 'db'; import * as bp from 'bp'; import * as context from 'context'; @action.object({ type: "param" }) export class ActionInput { @action.param({ type: 'String', required: true, label: 'interviewID' }) interviewID: string; } export class ActionOutput { @action.param({ type: 'String', required: true, label: 'taskId' }) taskId: string; } @action.object({ type: "method" }) export class ApproveTrip { @action.method({ input: 'ActionInput', output: 'ActionOutput' }) public run(input: ActionInput): ActionOutput { let out = new ActionOutput(); let instanceId = input.interviewID; let taskClient = bp.newTaskClient() let res = taskClient.queryByCondition({ condition: { conjunction: db.Conjunction.AND, conditions: [ { field: "processInsID", operator: db.Operator.eq, value: instanceId }, { field: "assigneeID", operator: db.Operator.eq, value: context.getUserId() } ] }, }); if (res.length > 0) { let taskId = res[0]['id']; out.taskId = taskId; console.log(taskId) return out; } return out; } } - 单击
，保存脚本，保存成功后单击
，激活脚本。
- 创建脚本getUserName，用于获取用户名。
- 在应用设计器中，选择“逻辑”，单击脚本后的“+”。
- 新建一个空白的脚本，名称设置为“getTask”，单击“添加”。
- 在脚本编辑器中，输入示例代码。
import * as objectstorage from 'objectstorage'; import * as buffer from 'buffer'; import * as excel from 'excel'; import * as context from 'context'; import * as db from 'db';//导入处理object相关的标准库 //定义入参结构 @action.object({ type: "param" }) export class ActionInput { } //定义出参结构，出参包含1个参数，workOrder的记录id @action.object({ type: "param" }) export class ActionOutput { @action.param({ type: 'string', required: false, label: 'string' }) res: string; } //使用数据对象命名空间__processDemo__CST @useObject(['User']) @action.object({ type: "method" }) export class CreateWorkOrder { //定义接口类，接口的入参为ActionInput，出参为ActionOutput @action.method({ input: 'ActionInput', output: 'ActionOutput' }) public createWorkOrder(input: ActionInput): ActionOutput { let out = new ActionOutput(); try { let s = db.object('User'); //查询User表 let condition = { "conjunction": "AND", "conditions": [{ "field": "id", "operator": "eq", "value": context.getUserId() }] }; let userRecod = s.queryByCondition(condition); if (userRecod) { out.res = userRecod[0].usrName; return out; } } catch (error) { console.error(error.name, error.message); } return out; } } - 单击
，保存脚本，保存成功后单击
，激活脚本。
步骤三：创建提交申请页面
创建一个提交申请的标准页面，页面中包括申请标题、申请类型和申请时间三个字段，用于用户提交申请。
- 创建一个空白标准页面。
- 在应用设计器中，选择“界面”，单击页面后的“+”。
- 输入页面的标签和名称，单击“添加”，新建一个标准页面。
图7 创建提交申请标准页面
- 新建对象模型apply。
- 在标准页面底部，单击“模型视图”，将页面从设计视图切换到模型视图。
- 单击“新增模型”，输入模型名称（如apply）、“来源”选择“对象”，单击“下一步”。
图8 新建对象模型
- 选择步骤一：创建审批流对象中创建的对象并选中apply、type和deadline字段，单击“下一步”，再单击“确定”，完成模型的创建。
图9 选择对象和字段
- 新建服务模型submit_bpm。
- 在模型视图页面，单击“新增模型”，输入模型名称（如submit_bpm）、“来源”选择“服务”，单击“下一步”。
图10 新建服务模型
- 选择1中创建的脚本，单击“确定”。
图11 选择提交脚本
图12 选择脚本后效果
- 单击“下一步”，再单击“确定”，完成模型的创建。
- 在模型视图页面，单击“新增模型”，输入模型名称（如submit_bpm）、“来源”选择“服务”，单击“下一步”。
- 返回设计视图页面，拖入输入框、日期选择框和下拉框，并绑定对应的对象模型。
- 在标准页面底部，单击“设计视图”，将页面从模型视图切换到设计视图。
- 在中，拖拽输入框、日期选择框、下拉框和按钮组件到画布中，布局图13。
- 选中组件，修改输入框、日期选择框、下拉框组件的标签为申请标题、申请时间和申请类型。
图14 修改组件标题
- 选中输入框组件，在中单击“值(value)绑定”后的
，为组件绑定2中对象模型的“命名空间__apply__CST”字段。
图15 为组件绑定对象模型中的apply字段
- 按照上述操作，分别为日期选择框和下拉框组件绑定2中对象模型的“命名空间__deadline__CST”字段和“命名空间__type__CST”字段。
图16 为组件绑定对象模型中的deadline字段
图17 为组件绑定对象模型中的type字段
- 选中下拉框组件，将的值设置为“出差”和“报销”。
图18 设置选项值
- 选中按钮组件，将“显示名称”修改为“提交申请”。
- 在“事件”页签，单击“点击”后的“+”，为按钮添加如下事件。
var apply = $model.ref("apply").getData(); var submit = $model.ref("submit_bpm").getData(); submit.inputParam.applicationData = apply; $model.ref("submit_bpm").run().then(function(data){ context.$message.success('Submitted successfully.'); closeCurrentTab(); }) .catch(function (err) { console.log('error is', error); context.$message.error('Submission failed:' + error.resMsg); }); function closeCurrentTab() { if (parent.bingo) { var removeTab = parent.bingo.removeTab; var getCurrentTab = parent.bingo.getCurrentTab; if (removeTab && getCurrentTab) { return removeTab(getCurrentTab()); } } if (window.parent != window) { window.parent.close(); } else { window.close(); } }
- 单击页面上方的
，保存页面。 - 保存成功后，单击页面上方的
，预览效果。
步骤四：创建审批数据表页面
创建一个标准页面，用于呈现用户提交的审批数据，并在操作列中增加一个审批按钮，单击该按钮可进入审批页面。
- 创建一个空白标准页面。
- 在应用设计器中，选择“界面”，单击页面后的“+”。
- 输入页面的标签和名称（如processBpm），单击“添加”，新建一个标准页面。
图19 创建审批数据表标准页面
- 新建对象模型processBpm。
- 在标准页面底部，单击“模型视图”，将页面从设计视图切换到模型视图。
- 单击“新增模型”，输入模型名称（如processBpm）、“来源”选择“对象”，单击“下一步”。
- 选择步骤一：创建审批流对象中创建的对象并选中apply、type、deadline、bpmId和bpmState字段，单击“下一步”，再单击“确定”，完成模型的创建。
图20 选择对象和字段
- 返回设计视图页面，拖入表格组件，并为组件绑定对象模型。
- 在中，拖拽表格组件到画布中。
图21 提交审批标准页面布局
- 选中表格组件，在中单击“值(value)绑定”后的
，为组件绑定2中对象模型processBpm。
图22 为组件绑定对象模型processBpm
- 选中表格组件，在中，单击
，为表格添加操作列。
图23 选择添加操作列
- 单击新增操作列Operation1后的
，修改列标题为“操作”。
图24 修改列标题为操作
- 在“操作按钮”中，单击“添加操作按钮”，修改“标签”为“审批”。
- 单击审批按钮后的
，再单击动作列表后的“+”，
图25 为审批按钮添加自定义动作
context.$page.openStdPage('命名空间__Approval', 'interviewID=' + $current.$attrs.row.命名空间__bpmId__CST);其中，“命名空间__Approval”为步骤五：创建审批处理页面中创建的标准页面，“命名空间__bpmId__CST”为步骤一：创建审批流对象中添加的字段。
- 在“禁用”中，输入如下代码，即审批通过后将审批的按钮置灰。
图26 禁用设置
$row.命名空间__bpmState__CST == "PASS" || $row. 命名空间__bpmState__CST == "FAIL"其中，“命名空间__bpmState__CST”为6中添加的对象字段。
- 在中，拖拽表格组件到画布中。
- 单击页面上方的
，保存页面。
步骤五：创建审批处理页面
创建一个审批申请的标准页面，页面中包含申请标题、申请类型和申请时间三个字段，同时包括通过、不通过、经理通过和经理不通过四个按钮。
- 创建一个空白标准页面。
- 在应用设计器中，选择“界面”，单击页面后的“+”。
- 输入页面的标签和名称（如Approval），单击“添加”，新建一个标准页面。
图27 创建审批数据表标准页面
- 新建脚本模型queryApplication，用于查询对应bpmId的审批数据。
- 在标准页面底部，单击“模型视图”，将页面从设计视图切换到模型视图。
- 单击“新增模型”，输入模型名称（如queryApplication）、“来源”选择“服务”，单击“下一步”。
- 选择3中创建的脚本，单击“下一步”，再单击“确定”，完成模型的创建。
图28 选中脚本
图29 选中脚本后效果
- 新建对象模型process。
- 在模型视图页面，再次单击“新增模型”，输入模型名称（如process）、“来源”选择“对象”，单击“下一步”。
- 选择步骤一：创建审批流对象中创建的对象并选中apply、type和deadline字段，单击“下一步”，再单击“确定”，完成模型的创建。
图30 选择对象和字段
- 新建脚本模型approve，用于提交审批结果。
- 在模型视图页面，再次单击“新增模型”，输入模型名称（如approve）、“来源”选择“服务”，单击“下一步”。
- 选择4中创建的脚本，单击“下一步”，再单击“确定”，完成模型的创建。
图31 选择所需的脚本
图32 设置后效果
- 新建脚本模型getTask，用于某个领导审批同意后该节点自动完成，忽略其他人的意见提交审批结果。
- 在模型视图页面，再次单击“新增模型”，输入模型名称（如getTask）、“来源”选择“服务”，单击“下一步”。
- 选择5中创建的脚本，单击“下一步”，再单击“确定”，完成模型的创建。
图33 选择所需的脚本
图34 设置后效果
- 新建脚本模型getUserName，用于获取用户名。
- 在模型视图页面，再次单击“新增模型”，输入模型名称（如getUserName）、“来源”选择“服务”，单击“下一步”。
- 选择6中创建的脚本，单击“下一步”，再单击“确定”，完成模型的创建。
图35 选择所需的脚本
图36 设置后效果
- 新增自定义模型managerFlag和approverFlag，用于控制按钮回显。
- 在模型视图页面，单击“新增模型”，输入模型名称（如managerFlag）、“来源”选择“自定义”，单击“下一步”。
- 单击“下一步”，再单击“确定”，完成模型的创建。
- 按照上述操作，创建自定义模型“approverFlag”。
图37 查看创建的模型
- 返回设计视图页面，拖入组件，并为组件绑定对象模型。
- 在中，拖拽2个输入框和1个日期选择框组件到画布中。
图38 审批处理标准页面布局
- 选中组件，修改组件标签为申请标题、申请时间和申请类型。
图39 修改组件标签
- 选中第一个输入框组件，在中单击“值(value)绑定”后的
，为组件绑定3中对象模型的“命名空间__apply__CST”字段。
图40 为组件绑定对象模型中的apply字段
- 按照同样方法，为日期选择框组件绑定“命名空间__deadline__CST”字段，为第二个输入框绑定“命名空间__type__CST”字段。
- 再拖入四个按钮组件到画布中，并修改按钮名称为“通过”、“驳回”、“经理通过”和“经理驳回”。
图41 修改按钮名称
- 选中页面组件，在“事件”中，单击加载后的“+”。
图42 为页面添加事件
- 在自定义动作中，输入如下代码。
图43 输入事件代码
var bpTaskId = context.$page.params.interviewID; if (bpTaskId) { var model = $model.ref('queryApplication'); var data = model.getData(); data.inputParam.interviewID = bpTaskId; model.run().then(function (data) { var result = data.detail; $model.ref("process").setData(result); }).catch(function (err) { context.$message.error(err.resMsg || err.message || err); }); } //审批人列表 var approver = ["user_name1","user_name2"] //经理列表 var manager = ["user_name3"] $model.ref('getUserName').run().then(function(data){ if (!approver.includes(data['res'])) { $model.ref("approverFlag").setData(true); } if (!manager.includes(data['res'])) { $model.ref("managerFlag").setData(true); } else { //如果是经理，把审批人的按钮也隐藏了 $model.ref("approverFlag").setData(true); } }).catch(function(error){ console.log('error is', error); context.$message.error('Submission failed:' + error.resMsg); });其中，“queryApplication”为2中创建的脚本模型，“user_name1”、“user_name2”为审批人名称，“user_name3”为经理审批人名称。
- 选中“通过”按钮，在事件页签中，单击“点击”后的“+”，为按钮添加自定义动作。
var data = $model.ref('process').getData(); var approve = $model.ref('approve').getData(); approve.inputParam.interviewID = data['命名空间__bpmId__CST']; approve.inputParam.state = 'PASS'; $model.ref('approve').run().then(function(data){ context.$message.success('Submitted successfully.'); closeCurrentTab(); }).catch(function(error){ console.log('error is', error); context.$message.error('Submission failed:' + error.resMsg); }); function closeCurrentTab() { if (parent.bingo) { var removeTab = parent.bingo.removeTab; var getCurrentTab = parent.bingo.getCurrentTab; if (removeTab && getCurrentTab) { return removeTab(getCurrentTab()); } } if (window.parent != window) { window.parent.close(); } else { window.close(); } }其中，“process”为3中创建的对象模型，“approve”为4创建的脚本模型。“命名空间__bpmId__CST”为步骤一：创建审批流对象中添加的字段。
- 再次选中“通过”按钮，在中单击“属性值绑定”后的“+”，为组件绑定7中自定义的模型“approverFlag”。
图44 为通过按钮绑定approverFlag模型
- 选中“驳回”按钮，在事件页签中，单击“点击”后的“+”，为按钮添加自定义动作。
var data = $model.ref('process').getData(); var approve = $model.ref('approve').getData(); approve.inputParam.interviewID = data['命名空间__bpmId__CST']; approve.inputParam.state = 'FAIL'; $model.ref('approve').run().then(function(data){ context.$message.success('Submitted successfully.'); closeCurrentTab(); }).catch(function(error){ console.log('error is', error); context.$message.error('Submission failed:' + error.resMsg); }); function closeCurrentTab() { if (parent.bingo) { var removeTab = parent.bingo.removeTab; var getCurrentTab = parent.bingo.getCurrentTab; if (removeTab && getCurrentTab) { return removeTab(getCurrentTab()); } } if (window.parent != window) { window.parent.close(); } else { window.close(); } }其中，“process”为3中创建的对象模型，“approve”为4创建的脚本模型。“命名空间__bpmId__CST”为步骤一：创建审批流对象中添加的字段。
- 再次选中“驳回”按钮，在中单击“属性值绑定”后的“+”，为组件绑定7中自定义的模型“approverFlag”。
图45 为驳回按钮绑定approverFlag模型
- 选中“经理通过”按钮，在事件页签中，单击“点击”后的“+”，为按钮添加自定义动作。
var dataTask = $model.ref('getTask').getData(); dataTask.inputParam.interviewID= context.$page.params.interviewID; $model.ref('getTask').run().then(function(data){ context.$message.success('Submitted successfully.'); console.log(data); var taskId = data.taskId; var _url = `/u-route/baas/bp/v2.0/runtime/tasks/${taskId}`; var _inputParam = {action:'经理审批', variables:{pass:2}}; var _method = 'PUT'; var _header = {'Content-Type':'application/json'}; context.service(_url).run(_inputParam,_method,_header).then(function(response){ console.log("success"); }); closeCurrentTab(); }).catch(function(error){ console.log('error is', error); context.$message.error('Submission failed:' + error.resMsg); }); function closeCurrentTab() { if (parent.bingo) { var removeTab = parent.bingo.removeTab; var getCurrentTab = parent.bingo.getCurrentTab; if (removeTab && getCurrentTab) { return removeTab(getCurrentTab()); } } if (window.parent != window) { window.parent.close(); } else { window.close(); } }其中，“getTask”为5中创建的脚本模型。
- 再次选中“经理通过”按钮，在中单击“属性值绑定”后的“+”，为组件绑定7中自定义的模型“managerFlag”。
图46 为经理通过按钮选择managerFlag模型
- 选中“经理驳回”按钮，在事件页签中，单击“点击”后的“+”，为按钮添加自定义动作。
var dataTask = $model.ref('getTask').getData(); dataTask.inputParam.interviewID= context.$page.params.interviewID; $model.ref('getTask').run().then(function(data){ context.$message.success('Submitted successfully.'); console.log(data); var taskId = data.taskId; var _url = `/u-route/baas/bp/v2.0/runtime/tasks/${taskId}`; var _inputParam = {action:'经理审批', variables:{pass:0}}; var _method = 'PUT'; var _header = {'Content-Type':'application/json'}; context.service(_url).run(_inputParam,_method,_header).then(function(response){ console.log("success"); }); closeCurrentTab(); }).catch(function(error){ console.log('error is', error); context.$message.error('Submission failed:' + error.resMsg); }); function closeCurrentTab() { if (parent.bingo) { var removeTab = parent.bingo.removeTab; var getCurrentTab = parent.bingo.getCurrentTab; if (removeTab && getCurrentTab) { return removeTab(getCurrentTab()); } } if (window.parent != window) { window.parent.close(); } else { window.close(); } }其中，“getTask”为5中创建的脚本模型。
- 再次选中“经理驳回”按钮，在中单击“属性值绑定”后的“+”，为组件绑定7中自定义的模型“managerFlag”。
图47 为经理驳回按钮选择managerFlag模型
- 在中，拖拽2个输入框和1个日期选择框组件到画布中。
- 单击页面上方的
，保存页面。
步骤六：创建审批工作流
创建一个审批申请的工作流，通过配置用户任务的审批动作和终止动作，实现优先级审批功能。
- 在应用设计器的左侧导航栏中，选择“流程”，单击工作流后的“+”。
- 输入工作流的标签和名称（如bpm1），单击“添加”。
- 创建变量和对象变量。
- 单击
，进入全局上下文页面。 - 单击变量后的“+”，创建一个变量variable0。
- 单击变量后的
，选择“设置”，修改“名称”为“pass”，“数据类型”选择“数字”。
图48 创建变量pass
- 在全局上下文中，单击对象变量后的“+”，创建一个对象变量。
图49 创建对象变量data
表5 新建data对象变量 参数
说明
示例
名称
新建对象变量的名称，变量名是变量在流程中引用的唯一标识。修改变量名不会改变图元中的引用，但是可能导致流程不可用。
取值范围：1~80个字符。
data
对象
在下拉框中，选择具体的对象，本示例选择步骤一：创建审批流对象中创建的对象。
命名空间__processDems__CST
图50 查看已创建变量
- 单击
- 创建审批工作流。
- 配置工作流中的图元。
- 选中脚本图元，单击
，按照图54设置脚本图元。
- 选中用户任务图元，单击
，按照图55设置用户图元。
图56 审批配置
表6 用户任务参数说明 参数
说明
示例
界面 > 任务标题
显示在任务界面的标题。
申请审批
界面 > 渲染类型
用户处理的界面，可以是标准页面、标准表单或高级页面。
标准页面
界面 > 页面
根据渲染类型，选择具体的页面。
选择步骤五：创建审批处理页面中创建的页面“命名空间__Approval”。
接收人 > 类型
待处理任务的用户类型。
名称和表达式
接收人 > 参与者 > 类型
当“类型”为“名称和表达式”时，该参数才会显示。参与者类型可以是用户、业务用户、组或者表达式。
用户
接收人 > 参与者 > 取值
选择接收该任务的用户，不包括业务用户。
user_name1
user_name2
user_name3
审批配置 > 审批类型
选择审批的类型。
会签：每个分配人都需要审批
审批配置 > 投票结果门槛
该参数取值表示百分比，如果达到设置的百分比，审批结果中最高的得票结果将覆盖 “$BP.TaskOutcome”系统变量，即将执行最高得票的审批结果。
66
审批配置 > 默认结果
审批百分比（已审批的人数/总的有效审批人数）未达到“投票结果门槛”百分比时，默认的审批结果。当审批类型为“会签：每个分配人都需要审批”时，该参数才会显示。
审批通过
审批配置 > 审批动作
设定一些候选的动作，作为默认审批结果。
审批通过,经理审批
审批配置 > 当存在如下动作时立即终止任务
当存在设定的某个或者某些动作时，立即终止任务。
经理审批
- 选中排他网关和成功图元之间的连接，并作如下设置。
图57 设置排他网关和成功图元之间的连线
- 选中排他网关和失败图元之间的连接，并作如下设置。
图58 设置排他网关和失败图元之间的连线
- 选中成功图元，按照图59设置成功图元。
- 选中失败图元，按照图60设置失败图元。
- 选中脚本图元，单击
- 单击页面上方的
，保存工作流。 - 保存成功后，单击
，启用工作流。
步骤七：设置应用菜单并验证功能
为应用添加一个“我要出差”和“我要待办”菜单，并验证工作流是否按照预设的流程执行。
- 应用导航栏设置。
- 进入应用设计器，在“开始”中，单击“应用导航设置”。
- 在主导航设置页签中，单击“新建”，新建一个“我要出差”菜单。
图61 添加我要出差菜单
- 按照上述操作，添加一个我的待办菜单。
图62 添加我的待办菜单
- 员工提交出差申请。
- 在应用主菜单中，单击“运行 > 立即运行”，进入应用预览页面。
- 在“我要出差”菜单中，提交出差申请。
图63 提交出差申请
提交成功后，界面会提示“Submitted successfully”。
- 主管审批申请。
- 在应用主菜单中，单击“运行 > 立即运行”，进入应用预览页面。
- 在“我的待办”菜单中，单击待审批数据后的“审批”，进入审批页面。
图64 单击审批
- 审批申请。
本实践中提交的申请，需要5.b中配置的user_name1、user_name2和user_name3三个用户审批。其中，user_name3为经理角色，具有优先审批权，即user_name3审批后无需user_name1、user_name2再审批。
假设，张三提交了一个出差申请，正常情况下user_name1审批后，user_name2再审批，最后user_name3（经理）审批，user_name3审批后整个流程审批结束。如果张三申请后，user_name3（经理）直接进行了审批，则审批流程结束，无需user_name1和user_name2再审批，因为user_name3具有优先审批权。图65 正常审批界面
图66 经理审批界面
父主题： 工作流专项
