使用activiti工作流引擎显示流程图时高亮显示流程图中已执行节点和已执行路径方法（AutoEE_V2实现方式）

 

1 AutoEE-自动智能开发平台

 

 

  AutoEE-自动智能快速开发平台官网：http://www.autoee.org

  最新版本：AutoEE_V3.0.4

 

AutoEE_V2版本是在V1版本的基础上进行的升级改造，集成Activiti_5.18.0工作流引擎，引入activiti-explorer在线流程设计器，同时实现流程图中高亮显示流程图中已执行节点和已执行路径，并加亮显示当前执行中的节点，效果如下：

 

2 实现方法

（1）jsp页面中显示“流程状态”超链接，对应js方法如下：

        // 工作流申请模块操作列对应事件
        function getWorkFlowApplyOperateHandler(pProcessInstanceId) {
        return "流程状态";
        }
        //打开流程图显示界面
        function openActivitiProccessImagePage(pProcessInstanceId) {
        jDialog("ProccessImagePage", "流程图", "900px", "400px", "url:activitiController.do?openActivitiProccessImagePage&pProcessInstanceId="+pProcessInstanceId);
        }

（2）后台ActivitiController.java打开流程图显示页面方法

        /** 
         * 打开流程图显示页面
         **/
        @RequestMapping(params = "openActivitiProccessImagePage")
        public ModelAndView openActivitiProccessImagePage(String pProcessInstanceId) throws Exception {
        logger.info("[开始]-打开流程图显示页面");
        ModelAndView modelAndView = new ModelAndView();
        modelAndView.addObject("processInstanceId", pProcessInstanceId);
        modelAndView.setViewName("common/jsp/ActivitiProccessImagePage.jsp");
        logger.info("[完成]-打开流程图显示页面");
        return modelAndView;
        }

（3）前台显示流程图ActivitiProccessImagePage.jsp代码

        <%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
        <%@ page language="java" import="java.util.*"%>
        <%@ page isELIgnored="false"%>
        <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
        
        
        
        
        
        
        

        
        

        
        

（4）后台ActivitiController.java获取流程图像，已执行节点和流程线高亮显示方法

        /** 
         * 获取流程图像，已执行节点和流程线高亮显示
         */
        @RequestMapping(params = "getActivitiProccessImage")
        public void getActivitiProccessImage(String pProcessInstanceId, HttpServletResponse response) throws Exception {
        logger.info("[开始]-获取流程图图像");
        // 设置页面不缓存
        response.setHeader("Pragma", "No-cache");
        response.setHeader("Cache-Control", "no-cache");
        response.setDateHeader("Expires", 0);
        try {
        //  获取历史流程实例
        HistoricProcessInstance historicProcessInstance = historyService.createHistoricProcessInstanceQuery()
        .processInstanceId(pProcessInstanceId).singleResult();
        
        if (historicProcessInstance == null) {
        throw new BusinessException("获取流程实例ID[" + pProcessInstanceId + "]对应的历史流程实例失败！");
        } else {
        // 获取流程定义
        ProcessDefinitionEntity processDefinition = (ProcessDefinitionEntity) ((RepositoryServiceImpl) repositoryService)
        .getDeployedProcessDefinition(historicProcessInstance.getProcessDefinitionId());
        
        // 获取流程历史中已执行节点，并按照节点在流程中执行先后顺序排序
        List historicActivityInstanceList = historyService.createHistoricActivityInstanceQuery()
        .processInstanceId(pProcessInstanceId).orderByHistoricActivityInstanceId().asc().list();
        
        // 已执行的节点ID集合
        List executedActivityIdList = new ArrayList();
        int index = 1;
        logger.info("获取已经执行的节点ID");
        for (HistoricActivityInstance activityInstance : historicActivityInstanceList) {
        executedActivityIdList.add(activityInstance.getActivityId());
        logger.info("第[" + index + "]个已执行节点=" + activityInstance.getActivityId() + " : " +activityInstance.getActivityName());
        index++;
        }
        
        // 获取流程图图像字符流
        InputStream imageStream = ProcessDiagramGenerator.generateDiagram(processDefinition, "png", executedActivityIdList);
        
        response.setContentType("image/png");
        OutputStream os = response.getOutputStream();
        int bytesRead = 0;
        byte[] buffer = new byte[8192];
        while ((bytesRead = imageStream.read(buffer, 0, 8192)) != -1) {
        os.write(buffer, 0, bytesRead);
        }
        os.close();
        imageStream.close();
        }
        logger.info("[完成]-获取流程图图像");
        } catch (Exception e) {
        logger.error("【异常】-获取流程图失败！" + e.getMessage());
        throw new BusinessException("获取流程图失败！" + e.getMessage());
        }
        }

（5）工程中添加ProcessDiagramCanvas.java和ProcessDiagramGenerator.java，并修改原流程图绘制方法，实现流程图中高亮显示流程图中已执行节点和已执行路径，并加亮显示当前执行中的节点

 

          源代码ActivitiProccessImagePage.jsp，ActivitiController.java，ProcessDiagramCanvas.java和ProcessDiagramGenerator.java请在以下CSDN地址中下载：

        http://download.csdn.net/detail/heishuang/9232955

 

        AutoEE_V2.0.0-自动智能开发平台技术文档地址：

        http://blog.csdn.net/heishuang/article/details/49583107