1、首先创建一个“报销单审批的”流程,然后定义不同的url页面和对应的逻辑流;
2、具体案例实现如下:
3、表单录入页面:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" session="false" %>
<%@page import="com.eos.data.datacontext.UserObject" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<!--
- Author(s): Administrator
- Date: 2018-08-27 17:13:12
- Description:
-->
<head>
<title>报销单录入</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script src="<%= request.getContextPath() %>/common/nui/nui.js" type="text/javascript"></script>
</head>
<%
UserObject userObject =(UserObject)request.getSession().getAttribute("userObject");
//通过页面的workItemID获取工作项详细信息workItem
Long workItemID = (Long)request.getAttribute("workItemID");
%>
<body>
<fieldset style="border:solid 1px #aaa;position:relative;margin:5px 2px 0px 2px;">
<legend>
操作员
</legend>
<div id="dataform1" style="padding-top:5px;">
<!-- hidden域 -->
<input class="nui-hidden" name="trainexpenseinfo.pid"/>
<div class="nui-hidden" name="trainexpenseinfo.empid" value="<%=userObject.getUserId() %>"></div>
<div class="nui-hidden" name="trainexpenseinfo.processinstid" ></div>
<div class="nui-hidden" name="workItemID" id="workItemID"></div>
<table style="width:100%;height:95%;table-layout:fixed;" class="nui-form-table">
<tr>
<td class="form_label">
报销单编号:
</td>
<td colspan="1">
<input class="nui-textbox" name="trainexpenseinfo.expcode"/>
</td>
</tr>
<tr>
<td class="form_label">
报销人姓名:
</td>
<td colspan="1">
<input class="nui-textbox" name="trainexpenseinfo.empname" value='<%=userObject.getUserName() %>'/>
</td>
</tr>
<tr>
<td class="form_label">
报销金额:
</td>
<td colspan="1">
<input class="nui-textbox" name="trainexpenseinfo.expmoney"/>
</td>
</tr>
<tr>
<td class="form_label">
报销日期:
</td>
<td colspan="1">
<input class="nui-datepicker" name="trainexpenseinfo.expdate"/>
</td>
<td class="form_label">
是否是预算内项目:
</td>
<td colspan="1">
<input class="nui-dictcombobox" dictTypeId="TRAIN_YESNO" name="trainexpenseinfo.isbugetitem"/>
</td>
</tr>
<tr>
<td class="form_label">
部门经理:
</td>
<td colspan="1">
<input id="manager" class="nui-textbox" name="trainexpenseinfo.manager" enabled="false"/>
</td>
<td class="form_label">
部门经理意见:
</td>
<td colspan="1">
<input class="nui-textarea" name="trainexpenseinfo.manageradvice" enabled="false"/>
</td>
</tr>
<tr>
<td class="form_label">
财务经理:
</td>
<td colspan="1">
<input id="auditor" class="nui-textbox" name="trainexpenseinfo.auditor" enabled="false"/>
</td>
<td class="form_label">
财务经理意见:
</td>
<td colspan="1">
<input class="nui-textarea" name="trainexpenseinfo.auditoradvice" enabled="false"/>
</td>
</tr>
</table>
</div>
</fieldset>
<div class="nui-toolbar" style="padding:0px;" borderStyle="border:0;">
<table width="100%">
<tr>
<td style="text-align:center;" colspan="4">
<a class="nui-button" iconCls="icon-save" onclick="onOk()">
保存
</a>
<span style="display:inline-block;width:25px;">
</span>
<a class="nui-button" iconCls="icon-save" onclick="onConfirm()">
提交
</a>
<span style="display:inline-block;width:25px;">
</span>
<a class="nui-button" iconCls="icon-cancel" onclick="onCancel()">
取消
</a>
</td>
</tr>
</table>
</div>
<script type="text/javascript">
nui.parse();
var form = new nui.Form("#dataform1");
form.setChanged(false);
//debugger;
var workitemid = <%=workItemID %>;
if(workitemid !== null){
loadData();
}
function onConfirm(){
confirmData();
}
function onOk(){
saveData();
}
function setData(data){
data = nui.clone(data);
var json = nui.encode({trainexpenseinfo:data});
$.ajax({
url:"com.primeton.train.bps.expenseService.getExpense.biz.ext",
type:'POST',
data:json,
cache:false,
contentType:'text/json',
success:function(text){
obj = nui.decode(text);
form.setData(obj);
form.setChanged(false);
}
});
}
function loadData(){
var form = new nui.Form("#dataform1");
var json = nui.encode({workItemID:<%=workItemID %>});
$.ajax({
url:"com.primeton.train.bps.expenseService.getExpenseByWID.biz.ext",
type:'POST',
data:json,
cache:false,
contentType:'text/json',
success:function(text){
obj = nui.decode(text);
form.setData(obj);
nui.get("workItemID").setValue(<%=workItemID %>);
var empid = nui.get("empid").getValue();
if(empid == null || empid == undefined || empid == ""){
nui.get("empid").setValue(<%=userObject.getUserId() %>);
nui.get("expname").setValue("<%=userObject.getUserName() %>");
}
}
});
}
function confirmData(){
form.validate();
if(form.isValid()==false) return;
var data = form.getData(false,true);
var json = nui.encode(data);
$.ajax({
url:"com.primeton.train.bps.expenseService.confirmExpense.biz.ext",
type:'POST',
data:json,
cache:false,
contentType:'text/json',
success:function(text){
var returnJson = nui.decode(text);
if(returnJson.exception == null){
CloseWindow("saveSuccess");
}else{
nui.alert("保存失败", "系统提示", function(action){
if(action == "ok" || action == "close"){
//CloseWindow("saveFailed");
}
});
}
}
});
}
function saveData(){
form.validate();
if(form.isValid()==false) return;
var data = form.getData(false,true);
var json = nui.encode(data);
$.ajax({
url:"com.primeton.train.bps.expenseService.updateExpense.biz.ext",
type:'POST',
data:json,
cache:false,
contentType:'text/json',
success:function(text){
var returnJson = nui.decode(text);
if(returnJson.exception == null){
CloseWindow("saveSuccess");
}else{
nui.alert("保存失败", "系统提示", function(action){
if(action == "ok" || action == "close"){
//CloseWindow("saveFailed");
}
});
}
}
});
}
function onReset(){
form.reset();
form.setChanged(false);
}
function onCancel(){
CloseWindow("cancel");
}
function CloseWindow(action){
if(action=="close"){
}else if(window.CloseOwnerWindow)
return window.CloseOwnerWindow(action);
else
return window.close();
}
</script>
</body>
</html>
4、对应的逻辑流
获取工作项明细:通过页面传入的workItemID,使用BPS API的构件queryWorkItemDetail4SDO查询workitem工作项详细信息;
赋值:workitem查询出来后,将其包含的processinstid赋值给业务表的processinstid,便于查询业务表信息;
获取表单信息:通过processinstid与业务表的关联,可以查询业务表信息。
获取报销单编号:表单录入成功后,点击提交,转向下一活动“提交审批流程”,获取报销单编号是为了创建流程实例时,为流程名称和描述起名赋值;在这一活动中存在一个流程是否启动的判断,通过业务表数据中的processinstid是否为null或empty来判断流程是否启动;
赋值流程实例描述和名称:将expcode作为后缀,为创建的流程实例描述和名称赋值;
创建流程实例:BPS API构件库中的组件,是用来创建流程实例,需要传入三个参数,分别是:流程实例名称,流程实例描述,流程实例路径(即要提交的流程全名),返回一个流程实例id;
赋值流程实例id:将创建好的流程实例id赋值给业务表中的processinstid,便于后期查询业务表数据信息;
空操作:一个过渡图元,用来连接流程启动后的下一活动。流程启动后,通过流程实例id判断业务表中是否存在该条数据记录,存在,则走update的逻辑流,不存在,则走add的逻辑流;
构造相关数据:通过业务表单的信息,赋值给流程活动中需要的相关数据(即条件数据);
设置相关数据:调用BPS API的相关构件setRelativeDataBatch(批量设置相关数据),参数是通过processinstid,设置relativeData;
启动流程实例并完成第一个工作项:相关数据设置完成后,通过判断workItemID是否为null或empty,判断若流程未启动,则调用startProcessInstAndFinishFirstWorkItem构件,入参为processinstid,事务操作设置为false,没有其他的参数null;
流程已启动直接完成工作项:相关数据设置完成后,若流程已启动,则调用finishWorkItem构件,入参为workItemID,事务操作仍设置为false。
5、审批页面
<div class="nui-toolbar" style="padding:0px;" borderStyle="border:0;">
<table width="100%">
<tr>
<td style="text-align:center;" colspan="4">
<a class="nui-button" iconCls="icon-save" onclick="onAgree()">
同意
</a>
<span style="display:inline-block;width:25px;">
</span>
<a class="nui-button" iconCls="icon-save" onclick="unAgree()">
不同意
</a>
<span style="display:inline-block;width:25px;">
</span>
<a class="nui-button" iconCls="icon-cancel" onclick="onCancel()">
取消
</a>
</td>
</tr>
</table>
</div>
<script type="text/javascript">
nui.parse();
var form = new nui.Form("#dataform1");
form.setChanged(false);
loadData();
function onAgree(){
approvalData("1");
}
function unAgree(){
approvalData("0");
}
function setData(data){
data = nui.clone(data);
var json = nui.encode({trainexpenseinfo:data});
$.ajax({
url:"com.primeton.train.bps.expenseService.getExpense.biz.ext",
type:'POST',
data:json,
cache:false,
contentType:'text/json',
success:function(text){
obj = nui.decode(text);
form.setData(obj);
form.setChanged(false);
}
});
}
function loadData(){
var form = new nui.Form("#dataform1");
var json = nui.encode({workItemID:<%=workItemID %>});
$.ajax({
url:"com.primeton.train.bps.expenseService.getExpenseByWID.biz.ext",
type:'POST',
data:json,
cache:false,
contentType:'text/json',
success:function(text){
obj = nui.decode(text);
form.setData(obj);
nui.get("workItemID").setValue(<%=workItemID %>);
var empid = nui.get("empid").getValue();
if(empid == null || empid == undefined || empid == ""){
nui.get("empid").setValue(<%=userObject.getUserId() %>);
nui.get("expname").setValue("<%=userObject.getUserRealName() %>");
}
}
});
}
function approvalData(dealResult){
var form = new nui.Form("#dataform1");
form.setChanged(false);
form.validate();
if(form.isValid()==false) return;
var data = form.getData();
data.dealResult = dealResult;
var json = nui.encode(data);
$.ajax({
url:"com.primeton.train.bps.expenseService.approvalExpense.biz.ext",
type:'POST',
data:json,
cache:false,
contentType:"text/json",
success:function(text){
var returnJson = nui.decode(text);
if(returnJson.exception==null){
CloseWindow("ok");
}else{
nui.alert("提交失败","系统提示",function(action){
if(action == "ok" || action == "close"){
//CloseWindow("saveFailed");
}
});
}
}
});
}
function saveData(){
form.validate();
if(form.isValid()==false) return;
var data = form.getData(false,true);
var json = nui.encode(data);
$.ajax({
url:"com.primeton.train.bps.expenseService.updateExpense.biz.ext",
type:'POST',
data:json,
cache:false,
contentType:'text/json',
success:function(text){
var returnJson = nui.decode(text);
if(returnJson.exception == null){
CloseWindow("saveSuccess");
}else{
nui.alert("保存失败", "系统提示", function(action){
if(action == "ok" || action == "close"){
//CloseWindow("saveFailed");
}
});
}
}
});
}
function onReset(){
form.reset();
form.setChanged(false);
}
function onCancel(){
CloseWindow("cancel");
}
function CloseWindow(action){
if(action=="close"){
}else if(window.CloseOwnerWindow)
return window.CloseOwnerWindow(action);
else
return window.close();
}
</script>
</body>
</html>
6、经理审批逻辑流
经理审批流程:
首先,需要将表单信息查询出来并展示,将业务表信息赋值给页面上对应的字段,点击同意或不同意之后,重新获取表单信息,将页面上需要传递的信息赋值给业务表;
然后,调用更新逻辑流,仅更新被修改的内容;
设置相关数据:将所需要的条件数据进行设置完成后,调用finishWorkItem构件完成工作项。
7、财务审批逻辑流
财务审批流程:
首先,需要将表单信息查询出来并展示,将业务表信息赋值给页面上对应的字段,点击记账之后,重新获取表单信息,将页面上需要传递的信息赋值给业务表;
然后,调用更新逻辑流,仅更新被修改的内容;
完成工作项:由于财务审批流程是最后一项活动,没有分支且只需要一个自动活动完成记账状态的修改即可,所以无需设置相关数据,直接调用finishWorkItem构件完成工作项。
对于最后一项活动设置为自动活动,即修改一个字段的值,可以通过自动活动的“应用配置”tab页进行设置。