手把手教会使用O2OA(翱途)开发应用平台(2)- 如何做流程

需求

今天我们以报销审批流程为例来讲一下流程应用管理,即从零开始搭建一个流程应用。首先我们先介绍一下报销流程的需求,分两部分,表单和流程。

表单

表单就是用户起草的时候看到的界面信息

包含标题、申请人、申请部门、费用发生地、项目名称、报销种类、单据张数、账户名称、收款账号、开户银行、公务描述和报销明细等

1.png

流程

报销流程根据金额的大小需要经过不同的领导审批,所以分两种情况:报销金额<=3000元时,审批路径为:【提交报销】-【部门领导审核】-【会计初审】-【分管领导审批】-【会计核定】;报销金额>3000元时,审批路径为:【提交报销】-【部门领导审核】-【会计初审】-【公司领导审批】-【会计核定】

2.png

分析完需求,就直接开始操作

流程开发

首先打开流程应用管理新建一个流程应用,我们取名报销管理

3.png

“应用名称”(必填):填写“报销管理”;

“应用别名”:可随意填写;

“应用描述”:可随意填写;

“应用类型”:可随意填写;

填写完后点击“完成”即可,如下图所示:

点击打开报销管理应用,可以看到下面的界面

4.png

左侧包含六种设计元素

表单配置:设计和开发流程中需要使用的表单。

流程配置:设计和开发流程各审核环节的信息。

数据配置:设计和管理流程中需要使用的数据,比如报销类型、请假类型等固定可选的数据等。

脚本配置:设计和开发流程中需要调用的脚本。

资源文件:提供流程中可以直接访问的固定的文档、图片,便于直接以URL方式访问。

应用属性:对应用的信息,权限进行管理和设定。

我们今天主要讲流程和表单的配置,其他的元素会在后续的高阶课程中陆续讲到

PC表单开发

在“表单配置”导航中,点击新建图标新建一个表单,然后弹出模板可供选择

5.png

这里我们点击“通用表单模板”,新建一个表单,并将表单名称改为“报销申请表单”。如下图:

6.png

在“基本信息”表格中修改字段标题为我们需要的字段

7.png

行数不够时,可以选中一个单元格增加行

8.png

新增的行标题单元格设置样式为“标题单元格”,内容单元格设置样式为“内容单元格”

9.png

拖动左侧“文本”控件到新增的标题单元格中

10.png

删除多余的内容控件,重新拖入左侧符合业务需求的内容控件并修改相应的配置

标题:“文本字段”subject,设置默认值和非空校验return this.workContext.getWork().title;

这边前端脚本我们在api里面有很清楚的用法介绍啊,地址是:http://px.o2oa.net/api,大家可以自己去看一看了解一下,我们这里就不详细再去介绍了。

11.png

申请人:“人员组织” creatorPerson ,设置默认值return this.workContext.getWork().creatorIdentityDn;

申请部门:“人员组织” creatorUnit ,设置默认值return this.workContext.getWork().creatorUnitDn;

费用发生地:“地址” place

项目名称:“文本字段” projectName

报销种类:“下拉框” type ,可选值:差旅报销、雇员报销。默认值:return "差旅报销";

12.png

单据张数:“数字字段” number

账户名称:“文本字段” account

收款账号:“文本字段” receivingAccount

开户银行:“文本字段” bankAccount

公务描述:“多行文本” description

修改“订单列表”为“报销明细”,报销明细列改为序号、科目名称、开始日期、结束日期、费用描述、发票金额

13.png

删除多余的内容控件,重新拖入左侧符合业务需求的内容控件并修改相应的配置

科目名称:“下拉框” subjectName ,可选值:火车票、飞机票、住宿、餐费、其他

14.png

开始日期:“日期选择” startDate

结束日期:“日期选择” endDate

费用描述:“文本字段” costDescription

发票金额:“数字字段” amount

设置“发票金额”列合计数值,其他列都为不需要

15.png

设置报销明细:不能为空。报销明细使用的是“数据表格”控件,内容存储为数组,所以这里配置时需要选择“值长度”

16.png

删除审批信息模块

流程图开发

新建默认流程

17.png

首先我们修改流程名字为“报销审批流程”,然后按照需求我们把所有的节点活动先拖过来,然后修改一下名字

18.png

接下来我们就要画上面的路由了,双击活动节点出现路由,然后修改一下路由的名称。这里的路由就是我们的审批过程指向,按照业务需求从哪个环节到哪个环节

19.png

然后呢我们要给每个活动配置对应的处理人,首先“提交报销”环节,系统自动判断当处理人为空时默认处理人为拟稿人,所以我们这个环节可以不做配置

然后到“部门领导审核”环节,这个环节的处理人应该是拟稿人所在的部门领导,正副职可供选择,那么我们来配置一下

在“请审核”路由上配置选择人员creatorLeader,选择范围为拟稿人所在部门的部门正副职,我们可以用职务来做到这个功能

20.png

好,刚刚我们是配置了路由上的选择人员,那么要怎么把这个选择到的人跟“部门领导审核”关联起来呢,这个就需要配置“部门领导审核”环节处理人为creatorLeader,这里选择流程数据为刚刚我们路由上配置的creatorLeader

21.png

“财务领导审核”环节,我们来默认它的处理人应该是财务部部门正职领导,可以直接在处理人环节选择到这个职务

22.png

选择职务后有个弹框让我们添加职务参数,这个意思呢就是我们前面选择了职务名称,但是每个组织都可以有相同的职务,比如说部门正职,那我们这个环节到底是要取到哪个组织的部门正职呢,这里的参数就是这个意思,我们可以选择组织“财务部”然后确定

23.png

需要注意的是,这边的“选择”环节我们不需要配置处理人,但是选择环节出去的两条路由我们需要配置一下条件,因为要根据金额的不同而走到不同的环节。

选中小于等于3000的这条路由,可以看到条件这个页签,在里面输入 return parseFloat(this.data.datatable.total.amount) <=3000; 同样的在大于3000的路由条件里输入 return parseFloat(this.data.datatable.total.amount) >3000;

24.png

同样的“分管领导审批”和“公司领导审批”也是指定的职务,指定公司下的公司领导和分管领导职务,我们去组织里添加一下。

25.png

最后一个环节“会计核定”,用户呢说,我有两个会计,我需要AB角去处理,那么我们怎么办呢?首先我们一样要去配置会计的职务,这里我们需要把两个会计都配置上,然后在“会计核定”环节选择上这个职务

26.png

这里我们需要说明一下“会计核定”环节的处理方式问题了,这个呢是一个知识点,大家需要重点记一下啊

27.png

处理方式分为四种

单人:单人是可以多人同时收到待办,但是其中一个人处理后另一个人的待办会消失掉

并行:并行是可以多人同时收到待办,多人可以同时处理,所有待办人都处理完后流转到下一环节

串行:串行是多人顺序收到待办,比如ABC三个人,A先收到待办处理完后B收到待办,再C收到待办,然后到下一环节

抢办:抢办是多人同时收到待办,但是其中一个人打开文件后另一个人再打开会提示当前文件已经被锁定,等其中一个人处理后另一个人的待办会消失掉

默认处理方式都是单人啊,可以按照业务需求去修改,我们这里AB角呢就不需要修改的,单人就可以实现的。

现在呢我们处理人就配置完了,还剩下最后一步我们需要把前面做的表单跟当前流程关联起来

这个需要在“提交报销”环节配置表单“报销申请表单”就好,后面的环节可以配置也可以不配置,如果没有配置表单就会沿用上一个环节的表单

28.png

结束环节增加给拟稿人发送待阅的功能。待阅人脚本:return this.workContext.getWork().creatorIdentity;

29.png

使用

PC流转

首页发起流程,选择报销审批流程后会自动生成并打开一个报销流程实例

30.png

标题默认流程名称+无标题,申请人、申请部门默认拟稿人信息。将数据信息补充完整后点击上方继续流程按钮,如果必填项没有填写完整会出现红色提示填写,不能继续流转,将数据补全后再点击继续流转按钮。

31.png

校验通过后会弹出流转意见和处理人的选择框,在上方输入意见并选择人员后点击确定按钮提交到下一环节。如果意见不填,默认把决策名称作为流转意见。

32.png

提交成功后右上方会有流转成功提示,提示下一个活动名称和下一环节处理人是谁

33.png

这里下一环节处理人为谢玲巧,那我们注销使用谢玲巧登录看一下,登录后首页工作区域可以看到刚刚我们提交的报销审批流程,打开看一下。

34.png

谢玲巧打开这个审批单,点击上方继续流转按钮,可以选择同意和退回两个决策

35.png

这边我们选择同意,同意后到财务领导审核,财务领导审核环节我们自动计算了财务部的部门正职职务下的人,可以看到确实是这个人生成了待办,当前财务领导审核环节我们做了一个选择判断,如果总金额大于3000就走公司领导,如果总金额小于等于3000就走分管领导,我们这里是小于3000,那么提交后会到分管领导审批环节。我们提交一下,可以看到右上角提示了,下一环节为“分管领导审批”。

36.png

那我们现在继续下一处理人登录将文件流转下去。

37.png

到下一个环节“会计核定”,因为我们会计职务是配置了两个人的,所以我们看提示可以看到这两个人都收到了待办,那么我们先登录一个人进去处理看一下结果,我们可以看到这个流程实例已经流转结束了。

我们来看一下流程记录,流程记录包含了这个报销实例从起草到最终完成归档的一个完整的生命周期,包括处理过程中的处理人、处理部门、处理时间、处理意见等等信息。

这里可以看出来“会计核定”环节虽然我们是两个人生成了待办,但是最终只需要一个人去处理的,实现了我们的AB角处理方式。

38.png

再看一下流程监控,流程监控以图形化的方式显示了这个报销实例的流程记录,节点上的数字代表在这个环节流转了几次,我们这边是流转了一次,所以都是1。

39.png

好,刚刚我们是测试了报销金额小于等于3000的情况,流程走向是走到了分管领导审批,现在我们来走一个报销金额大于3000的,看一下是不是自动走到了公司领导审批环节。

40.png

前面的流转步骤我们就不再赘述了,我们流转到财务领导审核看一下效果

41.png

报销金额3200,大于3000,提示下一活动公司领导审核,处理人于光豪。我们再看一下流程监控,当前环节处理公司领导审批活动,流转正常。

42.png

接下来就再继续流转到结束环节。

附加功能

默认值

这个其实我们已经使用过了,像标题,姓名,部门我们都写了默认值的脚本

表单必填字段校验

普通字段校验

人员组织字段校验

数据表格校验

退回

之前我们整个流程流转都是同意一步一步下去的,没有不同意退回的功能,那比如说领导想要退回怎么办呢?

一个是通过路由退回

另一个是通过环节配置允许退回来实现

重置处理人

部门领导审核环节想要给另一个领导处理,可以选择重置一下处理人

加签

部门说部门领导自己处理完还想要给另外的领导处理一下,可以使用加签功能给另外一个领导生成待办

终止

部门领导想要直接终止这个文件,可以放开权限,点击按钮终止文件

打印表单设计

43.png

用户呢一般还会有打印的需求,尤其是这种费用报销,还会有特定的格式,跟我们审批的表单是不一样的,所以不能复用,需要按照客户需求重做一个表单,那表单的创建上面我们讲流程的审批表单的时候已经讲过了,我们这里就不讲了,都是一些css的调整,我们的O2OA演示服务器上有一个类似的报销流程,上面有打印表单的,我们直接拷贝过来稍作修改使用

流程数据维护

这个是什么呢?从流程-应用点进去,可以看到一个维护界面,普通用户可以查看我的工作,即当前应用所有我有权限看的工单,还可以查看我的待办已办待阅已阅和草稿,每个导航右边内容区域都带有搜索功能,可以方便的查找到与之相关的工作。

管理员用户会多一块维护管理,里面有当前应用所有流转中的工作,已完成工作,已删除工作,还有数据配置和编号配置

Mobile表单设计

那之前我们流转都是在PC端进行,如果想要在手机端使用这个流程,显然PC端的表单界面是不合适的,那就需要设计一个mobile端的表单

点击右上方“Mobile”按钮切换到Mobile表单

44.png

Moblie表单没有编辑保存过时会默认自动把PC端的表单带过来,我们可以看到这里的表单内容跟PC端是一样的,但是样式是有不同,因为我们Mobile表单默认表单样式是“手机样式”。

首先我们从上往下来看,移动端的操作按钮会自动生成,所以是不需要操作条的,我们这里把操作条控件删除,最底部也有一个操作条控件,我们也要删掉。

因为是PC端带过来的表单,PC端给表单信息做了固定宽度,Mobile端是不需要的,所以我们把对应的div上的固定宽度删掉让它自适应手机宽度

45.png

保存一下即可

这样我们mobile端的表单就设计好了,使用我们官方发布的APP,或者您自己打包的APP去发起或者审批这个流程使用的表单界面就是这个。接下来我们就在PC端模拟流转一下

地址:http://px.o2oa.net/x_desktop/workmobilewithaction.html?workId=4fd3e229-dbf6-42f0-869b-b7b8a8f38d6d

可以F12模拟手机端样式查看,下方有保存和继续流转的操作按钮

46.png

这个就是手机端看到的表单界面了,流转一下没有问题

这样这个报销流程在PC端和手机端都可以使用了

以上就是关于流程应用管理用法的讲解,更多详细的内容在后续的课程会继续讲解。

  • 24
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值