权限管理系统-0.6.0

七、员工端审批

员工端审批的大致流程如下图：
在这里插入图片描述
这个模块目的是实现员工在微信端的审批提交和处理功能，为了与之前的管理系统区分开，新建一个controller完成这些功能。

7.1 查询审批分类和审批模板

7.1.1 后端接口

//controller
@Api(tags = "员工端审批")
@RestController
@RequestMapping("/admin/process")
//@CrossOrigin注解用于实现跨域，之前管理页面在前端配置了跨域，微信端在控制器上实现跨域
@CrossOrigin
public class WChatProcessController {@Autowiredprivate OaProcessTypeService processTypeService;/*** 查询审批类型和对应模板*/@ApiOperation("查询审批类型和对应模板")@GetMapping("/getAllProcessTypeAndTemplate")public Result getAllProcessTypeAndTemplate(){return Result.ok(processTypeService.getAllProcessTypeAndTemplate());}}

//ProcessTypeService/*** 查询所有审批类型和对应模板* @return*/@Overridepublic List<ProcessType> getAllProcessTypeAndTemplate() {//查询所有审批类型List<ProcessType> processTypes = baseMapper.selectList(null);//遍历审批类型for(ProcessType processType : processTypes){//根据审批类型的id查询审批模板LambdaQueryWrapper<ProcessTemplate> processTemplateLambdaQueryWrapper = new LambdaQueryWrapper<>();processTemplateLambdaQueryWrapper.eq(ProcessTemplate::getProcessTypeId,processType.getId());List<ProcessTemplate> processTemplates = processTemplateMapper.selectList(processTemplateLambdaQueryWrapper);//将结果保存在processType中processType.setProcessTemplateList(processTemplates);}return processTypes;}

7.1.2 前端

首先将本文所带资源下载后和管理端前端放在一个目录下。该文件包含了静态资源页面，直接使用。导入了这个文件后，只需要做一点小小修改就能使用了，大部分代码已经写好了。
下载依赖：npm install。
更改配置：src/utils/request.js文件
将App.vue文件中如图内容注释：
使用命令npm run serve运行项目进行测试：

7.2 审批申请

当用户选择了模板要提交审批信息时，需要从后端查询模板相应信息并返回给前端。

    /*** 根据id查询模板信息*/@ApiOperation("查询模板信息")@GetMapping("/getProcessTemplate/{id}")public Result getProcessTemplate(@PathVariable Long id){return Result.ok(processTemplateService.getById(id));}

在这里插入图片描述

可以看到表单信息是以JSON形式发送给后端的。

7.3 启动流程实例

先创建一个工具类，将当前登录人的id和name通过ThreadLocal与当前线程绑定起来，方便在其他地方使用登陆人信息。

/*** 获取当前用户信息帮助类*/
public class UserInfoHelper {private static ThreadLocal<Long> userId = new ThreadLocal<Long>();private static ThreadLocal<String> username = new ThreadLocal<String>();public static void setUserId(Long _userId) {userId.set(_userId);}public static Long getUserId() {return userId.get();}public static void removeUserId() {userId.remove();}public static void setUsername(String _username) {username.set(_username);}public static String getUsername() {return username.get();}public static void removeUsername() {username.remove();}
}

//接着修改TokenAuthenticationFilter中的getAuthentication方法，获取用户名和id后，将他们存入线程变量private UsernamePasswordAuthenticationToken getAuthentication(HttpServletRequest request){String token = request.getHeader("token");if(!StringUtils.isEmpty(token)){//获取用户名String username = JWTHelper.getUsername(token);//从redis中查询用户权限String s = (String) redisTemplate.opsForValue().get(username);//将用户名和id存为线程变量UserInfoHelper.setUserId(JWTHelper.getUserId(token));UserInfoHelper.setUsername(username);//将字符串转换为对象List<SimpleGrantedAuthority> simpleGrantedAuthorities = JSON.parseArray(s, SimpleGrantedAuthority.class);return new UsernamePasswordAuthenticationToken(username,null, simpleGrantedAuthorities);}return null;}

启动审批流程controller接口：

//ProcessFormVo：用于提交表单信息
@Data
@ApiModel(description = "流程表单")
public class ProcessFormVo {@ApiModelProperty(value = "审批模板id")private Long processTemplateId;@ApiModelProperty(value = "审批类型id")private Long processTypeId;@ApiModelProperty(value = "表单值")private String formValues;}

//controller/*** 启动审批流程*/@ApiOperation("启动审批流程")@PostMapping("/startUp")public Result startUp(@RequestBody ProcessFormVo processFormVo){processService.startUp(processFormVo);return Result.ok();}

启动审批流程的service方法：

    /*** 启动流程实例* @param processFormVo*/@Overridepublic void startUp(ProcessFormVo processFormVo) {//1.查询用户信息SysUser sysUser = sysUserMapper.selectById(UserInfoHelper.getUserId());//2.查询模板信息ProcessTemplate processTemplate = processTemplateMapper.selectById(processFormVo.getProcessTemplateId());//3.封装要向oa_process添加的数据Process process = new Process();BeanUtils.copyProperties(processFormVo,process);process.setProcessCode(System.currentTimeMillis()+"");process.setUserId(UserInfoHelper.getUserId());process.setFormValues(processFormVo.getFormValues());process.setTitle(sysUser.getName() + "发起" + processTemplate.getName() + "申请");//状态：0：默认  1：审批中  2：审批完成  -1：驳回process.setStatus(1);processMapper.insert(process);//4.启动流程实例//得到业务id和表单数据String businessKey = process.getId().toString();String formValues = processFormVo.getFormValues();//将formValues转换成JSONObjectJSONObject jsonObject = JSON.parseObject(formValues);JSONObject formData = jsonObject.getJSONObject("formData");//JSONObject类似MAp，所以可以使用遍历map的方式遍历，再将得到的数据存在map中HashMap<String, Object> stringObjectHashMap = new HashMap<>();for(Map.Entry<String,Object> entry : formData.entrySet()){stringObjectHashMap.put(entry.getKey(),entry.getValue());}//启动流程实例ProcessInstance processInstance = runtimeService.startProcessInstanceByKey(processTemplate.getProcessDefinitionKey(),businessKey, stringObjectHashMap);//业务表关联流程实例idprocess.setProcessInstanceId(processInstance.getProcessInstanceId());//5.查询下一个审批人，有可能是多个//根据流程实例id获取当前任务，有可能返回多条任务，因为流程可能有分支List<Task> list = taskService.createTaskQuery().processInstanceId(processInstance.getProcessInstanceId()).list();//遍历任务列表，得到审批人名单ArrayList<String> strings = new ArrayList<>();for(Task task : list){LambdaQueryWrapper<SysUser> sysUserLambdaQueryWrapper = new LambdaQueryWrapper<>();sysUserLambdaQueryWrapper.eq(SysUser::getUsername,task.getAssignee());SysUser sysUser1 = sysUserMapper.selectOne(sysUserLambdaQueryWrapper);strings.add(task.getAssignee());//6.推送消息给审批人：后续实现}//设置流程描述信息process.setDescription("等待"+ StringUtils.join(strings.toArray(),',')+"审批");//向oa_process添加数据processMapper.insert(process);}

7.4 保存审批记录

建表，用于记录每个审批流程的每一步操作：

CREATE TABLE `oa_process_record` (`id` bigint(20) NOT NULL AUTO_INCREMENT COMMENT 'id',`process_id` bigint(20) NOT NULL DEFAULT '0' COMMENT '审批流程id',`description` varchar(255) DEFAULT NULL COMMENT '审批描述',`status` tinyint(3) DEFAULT '0' COMMENT '状态',`operate_user_id` bigint(20) NOT NULL DEFAULT '0' COMMENT '操作用户id',`operate_user` varchar(20) DEFAULT NULL COMMENT '操作用户',`create_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',`update_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新时间',`is_deleted` tinyint(3) NOT NULL DEFAULT '0' COMMENT '删除标记（0:不可用 1:可用）',PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=utf8 COMMENT='审批记录';

新建一个实体类，用于记录每个审批流程的每一步操作：

@Data
@ApiModel(description = "ProcessRecord")
@TableName("oa_process_record")
public class ProcessRecord extends BaseEntity {private static final long serialVersionUID = 1L;@ApiModelProperty(value = "审批流程id")@TableField("process_id")private Long processId;@ApiModelProperty(value = "审批描述")@TableField("description")private String description;@ApiModelProperty(value = "状态")@TableField("status")private Integer status;@ApiModelProperty(value = "操作用户id")@TableField("operate_user_id")private Long operateUserId;@ApiModelProperty(value = "操作用户")@TableField("operate_user")private String operateUser;}

使用代码生成器，生成相应代码，删掉生成的控制器，因为对操作的记录由后端来完成，不需要和前端交互；
定义service方法：

/*** <p>* 审批记录 服务实现类* </p>** @author beiluo* @since 2024-03-21*/
@Service
public class OaProcessRecordServiceImpl extends ServiceImpl<OaProcessRecordMapper, ProcessRecord> implements OaProcessRecordService {@Autowiredprivate SysUserMapper sysUserMapper;@Autowiredprivate OaProcessRecordMapper processRecordMapper;@Overridepublic void processOperationRecord(Long processId, Integer status, String description) {//首先创建一个ProcessRecord实例ProcessRecord processRecord = new ProcessRecord();//获取操作用户SysUser sysUser = sysUserMapper.selectById(UserInfoHelper.getUserId());//向对象中添加数据processRecord.setProcessId(processId);processRecord.setStatus(status);processRecord.setDescription(description);processRecord.setOperateUserId(sysUser.getId());//下面添加用户的真实姓名而不是用户名processRecord.setOperateUser(sysUser.getName());//保存数据到数据库processRecordMapper.insert(processRecord);}
}

修改启动流程实例方法：

//加入下面代码//向oa_process_record添加数据processRecordService.processOperationRecord(process.getId(),process.getStatus(),process.getDescription());

7.5 审批人查询待办任务

控制器方法：

    /*** 审批人查询待办任务*/@ApiOperation("审批人查询待办任务")@GetMapping("/getToDoList/{page}/{limit}")public Result getToDoList(@PathVariable Long page, @PathVariable Long limit){Page<ProcessVo> processVoPage = new Page<>(page, limit);return Result.ok(processService.getToDoList(processVoPage));}

service方法

    /*** 审批人查询待办任务* @param processVoPage* @return*/@Overridepublic IPage<ProcessVo> getToDoList(Page<ProcessVo> processVoPage) {//获取审人待办任务TaskQuery asc = taskService.createTaskQuery().taskAssignee(UserInfoHelper.getUsername()).orderByTaskCreateTime().asc();//第一个参数为记录起始位置，第二个参数为每页记录数//getCurrent表示页码，getSize表示每页记录数List<Task> tasks = asc.listPage((int) ((processVoPage.getCurrent() - 1) * processVoPage.getSize()), (int) processVoPage.getSize());//遍历任务列表，将其转换成processVo的列表ArrayList<ProcessVo> processVos = new ArrayList<>();for(Task task : tasks){//首先获得流程idString processInstanceId = task.getProcessInstanceId();//通过流程实例id查询相应流程ProcessInstance processInstance = runtimeService.createProcessInstanceQuery().processInstanceId(processInstanceId).singleResult();//通过流程实例获取业务id，也就是oa_process表的主键String businessKey = processInstance.getBusinessKey();//通过主键查询process表Process process = processMapper.selectById(businessKey);//向processVo中添加数据ProcessVo processVo = new ProcessVo();BeanUtils.copyProperties(process,processVo);processVo.setTaskId(task.getId());processVos.add(processVo);}IPage<ProcessVo> processVoPage1 = new Page<>(processVoPage.getCurrent(), processVoPage.getSize(), tasks.size());return processVoPage1.setRecords(processVos);}

7.6 测试

首先启动项目；
接着进入到审批模板添加页面，添加一个新的模板：

注意在上传文件这里，对文件的命名有要求：压缩包的名称必须为流程的DefinitionKey，以便后端获取，xml文件的名称中间必须加上.bpmn20，命名可以是压缩包名.bpmn20.xml。流程图的绘制在Activiti7入门这篇文章中有。
这里上传文件的时候有个bug，注意controller接口中的上传方法的参数名一定要与前端发送的数据名一致，也就是形参MultipartFile的变量名要为file，否则会接收不到上传文件。

并且之前这个流程定义上传接口没写完全，还需要在方法结尾加上如下代码：

        Map<String, Object> map = new HashMap<>();//根据上传地址后续部署流程定义，文件名称为流程定义的默认keymap.put("processDefinitionPath", "processes/" + originalFilename);map.put("processDefinitionKey", originalFilename.substring(0, originalFilename.lastIndexOf(".")));return Result.ok(map);

上传流程是：前端填写好信息并上传文件后，后端接口将文件放在指定位置后，返回流程定义键和流程定义文件存放路径给前端，之后前端将本次模板的相关信息封装发送给后端，后端调用接口将模板信息存储在数据库中。
3. 然后点击发布：
在这里插入图片描述
4. 接着在oa-web/views/test.vue页面进行修改，将如下图中的token改成绘制的流程图中指定负责人的token，这个负责人必须存在与数据库中。再将之前用于测试在request.js中添加的token删掉。

5. 修改完成后，访问test页面，进行测试：
在这里插入图片描述
6. 先选择admin提交请假申请，在测试页点击admin之后，返回http://localhost:9090/#/页面，刷新后提交请假申请：

接着在测试页面点击张三，然后返回http://localhost:9090/#/页面，刷新后就能看到需要审批的任务：

这里因为我把获取审批任务的接口写在了OaProcessController中，所以在请求时出现了跨域问题，只需要在类上添加@CrossOrigin注解就可以解决这个问题了。
这里需要提醒一下注意检查前端api的请求路径中的名称与自己的controller上的请求路径是否一致。

7.7 显示审批详情

创建一个接口用于返回审批的详细信息：

    /**** @param id 流程实例id* @return*/@ApiOperation("返回审批详细信息")@GetMapping("showProcessDetails/{id}")public Result showProcessDetails(@PathVariable Long id){return Result.ok(processService.getProcessDetails(id));}

//OaProcessServiceImpl方法@Overridepublic Map<String, Object> getProcessDetails(Long id) {//根据流程实例id获取实例信息Process process = processMapper.selectById(id);//有流程实例id获取当前流程操作记录LambdaQueryWrapper<ProcessRecord> processRecordLambdaQueryWrapper = new LambdaQueryWrapper<>();processRecordLambdaQueryWrapper.eq(ProcessRecord::getProcessId,id);List<ProcessRecord> list = processRecordService.list(processRecordLambdaQueryWrapper);//获取模板信息Long processTemplateId = process.getProcessTemplateId();ProcessTemplate processTemplate = processTemplateMapper.selectById(processTemplateId);//判断当前用户是否可以审批//先获取当前流程实例下的所有任务List<Task> list1 = taskService.createTaskQuery().processInstanceId(process.getProcessInstanceId()).list();//如果有任务的负责人是当前用户，那么就设置标记为trueboolean isApprove = false;for (Task task : list1) {if(task.getAssignee().equals(UserInfoHelper.getUsername())){isApprove = true;break;}}//将数据封装在map中返回HashMap<String, Object> stringObjectHashMap = new HashMap<>();stringObjectHashMap.put("process",process);stringObjectHashMap.put("processRecordList",list);stringObjectHashMap.put("processTemplate",processTemplate);stringObjectHashMap.put("isApprove",isApprove);return stringObjectHashMap;}

在这里插入图片描述

7.8 审批任务

//先创建一个审批条件类，用于接收前端的数据
@Data
public class ApprovalVo {private Long processId;private String taskId;@ApiModelProperty(value = "状态")private Integer status;@ApiModelProperty(value = "审批描述")private String description;
}

//控制器方法/*** 审批任务*/@ApiOperation("审批任务")@PostMapping("approve")public Result approveTask(ApprovalVo approvalVo){processService.approveTask(approvalVo);return Result.ok();}

    /*** 审批任务* @param approvalVo*/@Overridepublic void approveTask(ApprovalVo approvalVo) {//获取任务idString taskId = approvalVo.getTaskId();String assignee = taskService.createTaskQuery().taskId(taskId).singleResult().getAssignee();if(approvalVo.getStatus() == 1){//如果状态值为1，说明审批通过taskService.complete(taskId);}else{this.endTask(taskId);}//记录操作processRecordService.processOperationRecord(approvalVo.getProcessId(),approvalVo.getStatus(),assignee+(approvalVo.getStatus()==1?"通过了":"驳回了")+"申请");//查询下一个审批人Process process = processMapper.selectById(approvalVo.getProcessId());List<Task> list = taskService.createTaskQuery().processInstanceId(process.getProcessInstanceId()).list();if(CollectionUtils.isEmpty(list)){//如果集合为空，则说明流程已经审批结束if(approvalVo.getStatus()==1){process.setDescription("审评通过");process.setStatus(2);}else{process.setDescription("审批驳回");process.setStatus(-1);}}else{//如果任务列表不为空，则查询下一个负责人ArrayList<String> strings = new ArrayList<>();for (Task task : list) {LambdaQueryWrapper<SysUser> sysUserLambdaQueryWrapper = new LambdaQueryWrapper<>();sysUserLambdaQueryWrapper.eq(SysUser::getUsername,task.getAssignee());SysUser sysUser = sysUserMapper.selectOne(sysUserLambdaQueryWrapper);//添加用户真实姓名strings.add(sysUser.getName());//推送消息}process.setStatus(1);process.setDescription("等待" + StringUtils.join(strings.toArray(), ",") + "审批");}processMapper.updateById(process);}private void endTask(String taskId) {//查询当前任务Task task = taskService.createTaskQuery().taskId(taskId).singleResult();//查询bpmn模型，参数为流程定义idBpmnModel bpmnModel = repositoryService.getBpmnModel(task.getProcessDefinitionId());//获取结束事件列表List<EndEvent> endEventList = bpmnModel.getMainProcess().findFlowElementsOfType(EndEvent.class);//假设只有一个结束事件，下面获得结束节点FlowNode endEvent = endEventList.get(0);//获取当前节点FlowNode currentFlow = (FlowNode) bpmnModel.getMainProcess().getFlowElement(task.getTaskDefinitionKey());//清理当前节点的流向currentFlow.getOutgoingFlows().clear();//创建新的流向SequenceFlow sequenceFlow = new SequenceFlow();sequenceFlow.setId("newSequenceFlow");sequenceFlow.setSourceFlowElement(currentFlow);sequenceFlow.setTargetFlowElement(endEvent);ArrayList<SequenceFlow> sequenceFlows = new ArrayList<>();sequenceFlows.add(sequenceFlow);//向当前节点加入下面流程currentFlow.setOutgoingFlows(sequenceFlows);//完成当前任务taskService.complete(taskId);}

//再show.vue的approve方法中加入如下代码let approvalVo = {processId: this.process.id,taskId: this.taskId,status: status}api.approve(approvalVo).then(response => {this.$router.push({ path: '/list/1' })})

这里解决一个bug，审批任务的controller接口方法的参数要加上@RequestBody注解，因为数据是以JSON形式发送的。

7.9 已处理任务

//控制器方法/*** 查询已处理任务*/@ApiOperation("查询已处理任务")@GetMapping("/getApprovedTasks/{page}/{limit}")public Result getApprovedTasks(@PathVariable Long page,@PathVariable Long limit){Page<ProcessVo> processVoPage = new Page<>(page, limit);return Result.ok(processService.getApprovedTasks(processVoPage));}

//service方法/*** 查询已处理任务* @param processVoPage* @return*/@Overridepublic IPage<ProcessVo> getApprovedTasks(Page<ProcessVo> processVoPage) {//首先跟据用户名获取已处理任务列表List<HistoricTaskInstance> historicTaskInstances = historyService.createHistoricTaskInstanceQuery().taskAssignee(UserInfoHelper.getUsername()).finished().orderByTaskCreateTime().desc().listPage((int) ((processVoPage.getCurrent() - 1) * processVoPage.getSize()), (int) processVoPage.getSize());int count = historicTaskInstances.size();//得到历史任务后，遍历任务列表，将其转换为返回信息ArrayList<ProcessVo> processVos = new ArrayList<>();for (HistoricTaskInstance historicTaskInstance : historicTaskInstances) {//根据任务id得到processLambdaQueryWrapper<Process> processLambdaQueryWrapper = new LambdaQueryWrapper<>();processLambdaQueryWrapper.eq(Process::getProcessInstanceId,historicTaskInstance.getProcessInstanceId());Process process = processMapper.selectOne(processLambdaQueryWrapper);ProcessVo processVo = new ProcessVo();BeanUtils.copyProperties(process,processVo);processVos.add(processVo);}//封装返回对象IPage<ProcessVo> processVoIPage = new Page<ProcessVo>(processVoPage.getCurrent(), processVoPage.getSize(), count);processVoIPage.setRecords(processVos);return processVoIPage;}

在这里插入图片描述

7.10 已提交任务

//控制器方法/*** 查询已提交任务，已提交任务包括未完成的和已完成的*/@ApiOperation("查询已提交审批")@GetMapping("/getSubmittedTasks/{page}/{limit}")public Result getSubmittedTasks(@PathVariable Long page,@PathVariable Long limit){Page<ProcessVo> processVoPage = new Page<>(page, limit);return Result.ok(processService.getSubmittedTasks(processVoPage));}

//service方法@Overridepublic IPage<ProcessVo> getSubmittedTasks(Page<ProcessVo> processVoPage) {//调用ProcessMapper的selectPageList方法实现//首先设置查询条件ProcessQueryVo processQueryVo = new ProcessQueryVo();processQueryVo.setUserId(UserInfoHelper.getUserId());//根据查询条件调用mapper方法IPage<ProcessVo> processVoIPage = processMapper.selectPageList(processVoPage,processQueryVo);return processVoIPage;}

在这里插入图片描述

7.11 获取当前登录用户信息

    /*** 获取当前登录用户信息*/@ApiOperation("获取当前登录用户信息")@GetMapping("/getCurrentUser")public Result getCurrentUser(){SysUser byId = sysUserService.getById(UserInfoHelper.getUserId());//封装结果并返回HashMap<String, Object> stringObjectHashMap = new HashMap<>();stringObjectHashMap.put("name",byId.getName());stringObjectHashMap.put("phone",byId.getPhone());return Result.ok(stringObjectHashMap);}