快速开发申请加班工资审批流程系统（1）_bpmprocessinstanceserviceimpl haspermi

二次开发：快速开发申请加班工资审批流程系统（1）

很多时候在公司内部，都要手动填写一些表格，久了之后，也没能去数字化流程化，将一些流程简化和自动化。网上有很多自动化OA的开源流程快速搭建和实现方案，例如springboot开源项目中集成了activity和Flowable 工作流，能够快速开始从页面建立一个流程，建立独立的公司级别租户，完成对应节点的任务，流程全程自动化和可视化，体验较好。项目的开发可以参考该文档https://doc.iocoder.cn/，二开github地址

系统需求

基于上述开源项目，快速开发一个常见的工作中的具体流程，程序员申请加班工资流程，该流程需要经过项目经理pm审批（审批加班合理性）、hr审批（审批加班加班是否符合公司规定）以及财务审批（审批加班工资），然后美滋滋的加班工资久到手了，这里为了简化流程，设计了如下流程图，基于flowable的bpmn2.0的规则设计。这里简化加班申报，需要满足审批完全部流程才能申请到加班工资，如果不满足加班的项目或者加班小于1天，则默认不会走完全流程，拿不到加班工资，这里设计的是走排他网关，只有满足条件表达式中的项目或者加班时长才能走完整个审批流程，否则，整个申请走向结束流程，走不到财务审批流程。下面看看如何实现这个加班工资审批系统。

定于流程业务表和流程页面

加班申请表字段定义

DROP TABLE IF EXISTS `bpm_oa_wop`;
CREATE TABLE `bpm_oa_wop` (
  `id` bigint NOT NULL AUTO_INCREMENT COMMENT '加班工资申请表单主键',
  `user_id` bigint NOT NULL COMMENT '申请人的用户编号',
  `type` tinyint NOT NULL COMMENT '加班项目',
  `reason` varchar(200) CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci NOT NULL COMMENT '加班原因',
  `start_time` datetime NOT NULL COMMENT '加班开始时间',
  `end_time` datetime NOT NULL COMMENT '加班结束时间',
  `day` tinyint NOT NULL COMMENT '加班天数',
  `result` tinyint NOT NULL COMMENT '申请结果',
  `process_instance_id` varchar(64) CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci DEFAULT NULL COMMENT '流程实例的编号',
  `creator` varchar(64) CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci DEFAULT '' COMMENT '创建者',
  `create_time` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',
  `updater` varchar(64) CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci DEFAULT '' COMMENT '更新者',
  `update_time` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新时间',
  `deleted` bit(1) NOT NULL DEFAULT b'0' COMMENT '是否删除',
  `tenant_id` bigint NOT NULL DEFAULT '0' COMMENT '租户编号',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDB AUTO_INCREMENT=26 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci COMMENT='申请加班工资业务表单';
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

有了业务表后，利用项目中代码生成器，快速生成页面和controller、service、sql以及测试用例代码，可以帮助我们节省50%左右的代码开发时间。生成代码和页面见如图所示。主要搞定对该表的简单增删查改，以及页面的表格化展示和搜索。

初始化流程角色和账号

很明显需求中需要不同的部门、角色、岗位等，该开源项目支持租户，可以通过初始化一个公司类型的租户，定义一个租户套餐（套餐页面可以自定义），制定租户的角色可以有多少菜单的权限。在租户基础上新增四种职位，研发人员、Pm、hr和财务，归属于研发、hr和财务部门。角色权限上也做不同的限制。这些开源项目也帮你做好了，开箱即用，下面我们快速创建公司租户、部门、角色以及岗位。这些创建的数据只有该租户可以看到和修改。对租户方案想要更了解的可以移步这里看看 该开源项目租户方案如何设计，短短几分钟就能创建部门下不同岗位的用户和角色，不得不说这个角色权限和数据权限的设计很不错，对应模型也简单易懂。

前面将了流程图的设计，有了上述角色就可以将流程的关键审批人规则制定，下面从申请到不同的审批正好对应上述四个用户，因为框架现在只支持单人审批，所以只设置了一个用户就可以演练，后续会针对这个进行改进，完成多人审批。

开始发起加班申请

流程的发起可以发起和查看，这就需要三个页面和两个接口，页面分别是填写表单页面用于发起加班流程，该加班流程查看页面和用户加班列表页面。接口是创建流程接口、查看流程接口以及取消流程接口。加班流程页面和查看页面还用来设计流程中表单路由模式，只需将两个页面的地址加入到vue中即可路由跳转，方便流程的快速申请和查看，这点也是框架定义的，非常好的功能设计。

我们利用自动生成的列表代码，可以快速修改下页面，加上申请的按钮操作以及跳转申请页面以及取消申请操作。其中vue.directive是设计的内置的指令（如v-model和v-show）之外的自定义指令。设计了v-hasPermi指令来判断用户对应角色是否可以调用接口权限。

<!-- 新增操作操作工具栏 -->
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
                   v-hasPermi="['bpm:oa-wop:create']">发起申请</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
  /** 新增按钮操作 */
    handleAdd() {
      this.$router.push({ path: "/bpm/oa/wop/create"});
    }


<!-- 表数据操作工具栏 -->
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleCancel(scope.row)"
                     v-hasPermi="['bpm:oa-wop:delete']" v-if="scope.row.result === 1">取消申请</el-button>
          <el-button size="mini" type="text" icon="el-icon-view" @click="handleDetail(scope.row)"
                     v-hasPermi="['bpm:oa-wop:query']">详情</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleProcessDetail(scope.row)">审批进度</el-button>
        </template>
      </el-table-column>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

表单展示申请加班工资的记录，左上角可以发起申请，进入表达路由，主要是表单的填写和接口的调用，操作可以取消申请和查看详情及进度。

审批进度详情页面服用的框架的页面，主要包含三部分，第一部分申请详情的路由，第二部分审批记录，第三部分进度图。第二是获取的flowable的任务审批记录，框架包了一层表结构得到的结果，流程详情这个也是flowable原始表+框架自己的包装的表合起来返回的结果。可以在不同流程中快速复用这个页面。

后端代码主要是申请流程接口，其他主要都是借助的flowable开放的接口来实现功能的拓展。

@Override
@Transactional(rollbackFor = Exception.class)
public Long createOaWop(OaWopCreateReqVO createReqVO) {
    Long userID = getLoginUserId();
    // 插入业务表
    long day = DateUtil.betweenDay(createReqVO.getStartTime(), createReqVO.getEndTime(), false);
    OaWopDO oaWop = OaWopConvert.INSTANCE.convert(createReqVO).setUserId(userID).setDay((int) day)
            .setResult(BpmProcessInstanceResultEnum.PROCESS.getResult());
    oaWopMapper.insert(oaWop);

    // 发起 BPM 流程 生成流程实例
    Map<String, Object> processInstanceVariables = new HashMap<>();
    // 放入条件参数，流程图条件表达式会用到改变量
    processInstanceVariables.put("workTime ", day);
    processInstanceVariables.put("project", createReqVO.getType());
    // 调用flowable api
    
    封装接口
    String processInstanceId = processInstanceApi.createProcessInstance(userID,
            new BpmProcessInstanceCreateReqDTO().setProcessDefinitionKey(PROCESS_KEY)
                    .setVariables(processInstanceVariables).setBusinessKey(String.valueOf(oaWop.getId())));

    // 将工作流的编号，更新到 OA 请假单中
    oaWopMapper.updateById(new OaWopDO().setId(oaWop.getId()).setProcessInstanceId(processInstanceId));

    return oaWop.getId();
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

下面的代码流程详细描述了每个类的工作流程，二开框架结合flowable框架用来大量的监听模式来完成业务的耦合。

上述式创建加班流程的开发，后面会继续完成流程的流转开发，以及flowable相应的开发流程原理。