activiti自定义流程之Spring整合activiti-modeler实例（二）：创建流程模型

1.maven导包，这里就没有什么多的好说了，直接代码：

[html]  view plain  copy

 

1. <dependencies>  
2.     <dependency>  
3.       <groupId>junit</groupId>  
4.       <artifactId>junit</artifactId>  
5.       <version>4.11</version>  
6.     </dependency>  
7.     <dependency>  
8.         <groupId>org.springframework</groupId>  
9.         <artifactId>spring-beans</artifactId>  
10.         <version>4.0.9.RELEASE</version>  
11.     </dependency>  
12.     <dependency>  
13.         <groupId>org.springframework</groupId>  
14.         <artifactId>spring-core</artifactId>  
15.         <version>4.0.9.RELEASE</version>  
16.     </dependency>  
17.     <dependency>  
18.         <groupId>org.springframework</groupId>  
19.         <artifactId>spring-aop</artifactId>  
20.         <version>4.0.9.RELEASE</version>  
21.     </dependency>  
22.     <dependency>  
23.         <groupId>org.springframework</groupId>  
24.         <artifactId>spring-context</artifactId>  
25.         <version>4.0.9.RELEASE</version>  
26.     </dependency>  
27.     <dependency>  
28.         <groupId>org.springframework</groupId>  
29.         <artifactId>spring-webmvc</artifactId>  
30.         <version>4.0.9.RELEASE</version>  
31.     </dependency>  
32.     <dependency>  
33.         <groupId>org.springframework</groupId>  
34.         <artifactId>spring-web</artifactId>  
35.         <version>4.0.9.RELEASE</version>  
36.     </dependency>  
37.     <dependency>  
38.         <groupId>org.springframework</groupId>  
39.         <artifactId>spring-aspects</artifactId>  
40.         <version>4.0.9.RELEASE</version>  
41.     </dependency>  
42.     <dependency>  
43.         <groupId>org.springframework</groupId>  
44.         <artifactId>spring-expression</artifactId>  
45.         <version>4.0.9.RELEASE</version>  
46.     </dependency>  
47.     <dependency>  
48.         <groupId>org.springframework</groupId>  
49.         <artifactId>spring-tx</artifactId>  
50.         <version>4.0.9.RELEASE</version>  
51.     </dependency>  
52.     <dependency>  
53.         <groupId>javax.servlet</groupId>  
54.         <artifactId>javax.servlet-api</artifactId>  
55.         <version>3.1.0</version>  
56.     </dependency>  
57.     <dependency>  
58.         <groupId>com.fasterxml.jackson.core</groupId>  
59.         <artifactId>jackson-annotations</artifactId>  
60.         <version>2.2.3</version>  
61.     </dependency>  
62.     <dependency>  
63.         <groupId>com.fasterxml.jackson.core</groupId>  
64.         <artifactId>jackson-core</artifactId>  
65.         <version>2.2.3</version>  
66.     </dependency>  
67.     <dependency>  
68.         <groupId>com.fasterxml.jackson.core</groupId>  
69.         <artifactId>jackson-databind</artifactId>  
70.         <version>2.2.3</version>  
71.     </dependency>  
72.     <dependency>  
73.         <groupId>org.activiti</groupId>  
74.         <artifactId>activiti-modeler</artifactId>  
75.         <version>5.16</version>  
76.     </dependency>  
77.     <dependency>  
78.         <groupId>org.activiti</groupId>  
79.         <artifactId>activiti-engine</artifactId>  
80.         <version>5.16</version>  
81.     </dependency>  
82.     <dependency>  
83.         <groupId>org.activiti</groupId>  
84.         <artifactId>activiti-explorer</artifactId>  
85.         <version>5.16</version>  
86.     </dependency>  
87.     <dependency>  
88.         <groupId>org.activiti</groupId>  
89.         <artifactId>activiti-rest</artifactId>  
90.         <version>5.16</version>  
91.     </dependency>  
92.     <dependency>  
93.         <groupId>org.springframework</groupId>  
94.         <artifactId>spring-context-support</artifactId>  
95.         <version>4.0.9.RELEASE</version>  
96.     </dependency>  
97.     <dependency>  
98.         <groupId>mysql</groupId>  
99.         <artifactId>mysql-connector-java</artifactId>  
100.         <version>5.1.34</version>  
101.     </dependency>  
102.   
103.     <dependency>  
104.         <groupId>org.activiti</groupId>  
105.         <artifactId>activiti-spring</artifactId>  
106.         <version>5.16</version>  
107.     </dependency>  
108.     <dependency>  
109.         <groupId>org.springframework</groupId>  
110.         <artifactId>spring-jdbc</artifactId>  
111.         <version>4.0.9.RELEASE</version>  
112.     </dependency>  
113.     <dependency>  
114.         <groupId>org.springframework</groupId>  
115.         <artifactId>spring-test</artifactId>  
116.         <version>4.0.9.RELEASE</version>  
117.     </dependency>  
118.     <dependency>  
119.         <groupId>org.activiti</groupId>  
120.         <artifactId>activiti-bpmn-converter</artifactId>  
121.         <version>5.16</version>  
122.     </dependency>  
123.     <dependency>  
124.         <groupId>org.codehaus.jackson</groupId>  
125.         <artifactId>jackson-core-asl</artifactId>  
126.         <version>1.9.11</version>  
127.     </dependency>  
128.     <dependency>  
129.         <groupId>org.codehaus.jackson</groupId>  
130.         <artifactId>jackson-mapper-asl</artifactId>  
131.         <version>1.9.11</version>  
132.     </dependency>  
133.   </dependencies>  

2.基础配置：web.xml，这个也主要是spring相关的东西，不多说了:

[html]  view plain  copy

 

1. <?xml version="1.0" encoding="UTF-8"?>  
2. <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"  
3.     xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"  
4.     xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"  
5.     id="WebApp_ID" version="2.5">      
6.     <filter>  
7.         <description>字符集过滤器</description>  
8.         <filter-name>encodingFilter</filter-name>  
9.         <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>  
10.         <init-param>  
11.             <description>字符集编码</description>  
12.             <param-name>encoding</param-name>  
13.             <param-value>UTF-8</param-value>  
14.         </init-param>  
15.     </filter>  
16.     <filter-mapping>  
17.         <filter-name>encodingFilter</filter-name>  
18.         <url-pattern>/*</url-pattern>  
19.     </filter-mapping>  
20.   
21.     <servlet>  
22.     <servlet-name>RestletServlet</servlet-name>  
23.     <servlet-class>org.restlet.ext.servlet.ServerServlet</servlet-class>  
24.     <init-param>  
25.       <param-name>org.restlet.application</param-name>  
26.       <param-value>org.activiti.rest.editor.application.ModelerRestApplication</param-value>  
27.     </init-param>  
28.   </servlet>  
29.   <servlet-mapping>  
30.     <servlet-name>RestletServlet</servlet-name>  
31.     <url-pattern>/service/*</url-pattern>  
32.   </servlet-mapping>  
33.       
34.       
35.     <servlet>    
36.         <servlet-name>springMVC</servlet-name>    
37.         <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>    
38.         <init-param>    
39.             <param-name>contextConfigLocation</param-name>    
40.             <param-value>classpath:spring.xml</param-value>    
41.         </init-param>      
42.     </servlet>    
43.     <servlet-mapping>    
44.         <servlet-name>springMVC</servlet-name>    
45.         <url-pattern>*.do</url-pattern>    
46.     </servlet-mapping>  
47.     <welcome-file-list>  
48.         <welcome-file>activiti.html</welcome-file>  
49.         <welcome-file>activiti.htm</welcome-file>  
50.         <welcome-file>activiti.jsp</welcome-file>  
51.         <welcome-file>default.html</welcome-file>  
52.         <welcome-file>default.htm</welcome-file>  
53.         <welcome-file>default.jsp</welcome-file>  
54.     </welcome-file-list>    
55. </web-app>    

3.基础配置spring.xml:

[html]  view plain  copy

 

1. <?xml version="1.0" encoding="UTF-8"?>    
2. <beans xmlns="http://www.springframework.org/schema/beans"    
3.     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:p="http://www.springframework.org/schema/p"    
4.     xmlns:context="http://www.springframework.org/schema/context"    
5.     xmlns:mvc="http://www.springframework.org/schema/mvc"      
6.     xsi:schemaLocation="    
7.         http://www.springframework.org/schema/beans     
8.         http://www.springframework.org/schema/beans/spring-beans-3.0.xsd    
9.         http://www.springframework.org/schema/context     
10.         http://www.springframework.org/schema/context/spring-context-3.0.xsd  
11.         http://www.springframework.org/schema/mvc   
12.         http://www.springframework.org/schema/mvc/spring-mvc.xsd">    
13.   
14.     <context:annotation-config />    
15.     <mvc:annotation-driven />  
16.     <context:component-scan base-package="controllers" />    
17.     <bean id="dataSource" class="org.springframework.jdbc.datasource.SimpleDriverDataSource">  
18.          
19.        <property name="driverClass" value="com.mysql.jdbc.Driver"></property>  
20.        <property name="url" value="jdbc:mysql://192.168.0.201:3306/testtu?useUnicode=true&characterEncoding=utf8" ></property>  
21.        <property name="username" value="root" ></property>   
22.        <property name="password" value="123456" ></property>   
23.     </bean>  
24.       
25.     <bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">  
26.        <property name="dataSource" ref="dataSource"></property>  
27.     </bean>  
28.       
29.     <bean id="processEngineConfiguration" class="org.activiti.spring.SpringProcessEngineConfiguration">  
30.         <property name="dataSource" ref="dataSource" />  
31.         <property name="databaseSchemaUpdate" value="true" />  
32.         <property name="jobExecutorActivate" value="false"/>  
33.         <property name="history" value="full"/>  
34.         <property name="transactionManager" ref="transactionManager" />  
35.         <!-- 配置事务管理器，统一事务 -->  
36.           
37.         <!-- 设置建表策略，如果没有表，自动创建表 -->  
38.     </bean>  
39.     <!-- 创建流程引擎对象 -->  
40.     <bean id="processEngine" class="org.activiti.spring.ProcessEngineFactoryBean">  
41.         <property name="processEngineConfiguration" ref="processEngineConfiguration" />  
42.     </bean>  
43.   
44.     <!-- 由流程引擎对象，提供的方法，创建项目中使用的Activiti工作流的Service -->  
45.     <bean id="repositoryService" factory-bean="processEngine" factory-method="getRepositoryService" />  
46.     <bean id="runtimeService" factory-bean="processEngine" factory-method="getRuntimeService" />  
47.     <bean id="taskService" factory-bean="processEngine" factory-method="getTaskService" />  
48.     <bean id="historyService" factory-bean="processEngine" factory-method="getHistoryService" />  
49.     <bean id="formService" factory-bean="processEngine" factory-method="getFormService" />  
50.        
51.     <!-- 避免IE执行AJAX时,返回JSON出现下载文件 -->  
52.     <bean id="mappingJacksonHttpMessageConverter"  
53.         class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter">  
54.         <property name="supportedMediaTypes">  
55.             <list>  
56.                 <value>text/html;charset=utf-8</value>  
57.             </list>  
58.         </property>  
59.     </bean>  
60.   
61.     <!-- 启动Spring MVC的注解功能，完成请求和注解POJO的映射 -->  
62.     <bean  
63.         class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">  
64.         <property name="messageConverters">  
65.             <list>  
66.                 <ref bean="mappingJacksonHttpMessageConverter" /><!-- json转换器 -->  
67.             </list>  
68.         </property>  
69.     </bean>  
70.       
71. </beans>    

4.模型实体类：

[java]  view plain  copy

 

1. package model;  
2.   
3. import java.util.Date;  
4.   
5. public class ActivitiModel {  
6.     private String id;  
7.     private String name;  
8.     private String key;  
9.     private String description;  
10.     private Date createTime;  
11.     private Date lastUpdateTime;  
12.     private int version;  
13.   
14.     public String getId() {  
15.         return id;  
16.     }  
17.   
18.     public void setId(String id) {  
19.         this.id = id;  
20.     }  
21.   
22.     public Date getCreateTime() {  
23.         return createTime;  
24.     }  
25.   
26.     public void setCreateTime(Date createTime) {  
27.         this.createTime = createTime;  
28.     }  
29.   
30.     public Date getLastUpdateTime() {  
31.         return lastUpdateTime;  
32.     }  
33.   
34.     public void setLastUpdateTime(Date lastUpdateTime) {  
35.         this.lastUpdateTime = lastUpdateTime;  
36.     }  
37.   
38.     public int getVersion() {  
39.         return version;  
40.     }  
41.   
42.     public void setVersion(int version) {  
43.         this.version = version;  
44.     }  
45.   
46.     public String getName() {  
47.         return name;  
48.     }  
49.   
50.     public void setName(String name) {  
51.         this.name = name;  
52.     }  
53.   
54.     public String getKey() {  
55.         return key;  
56.     }  
57.   
58.     public void setKey(String key) {  
59.         this.key = key;  
60.     }  
61.   
62.     public String getDescription() {  
63.         return description;  
64.     }  
65.   
66.     public void setDescription(String description) {  
67.         this.description = description;  
68.     }  
69.   
70.     @Override  
71.     public String toString() {  
72.         return "ActivitiModel [id=" + id + ", name=" + name + ", key=" + key  
73.                 + ", description=" + description + ", createTime=" + createTime  
74.                 + ", lastUpdateTime=" + lastUpdateTime + ", version=" + version  
75.                 + "]";  
76.     }  
77.   
78. }  

5.后台业务代码，这里最后的操作是把跳转到acitiviti-modeler流程图设计界面的路径返回到了前端，然后让前端再跳转到流程图设计界面。

在我操作过程中，必须这样做才能实现设想的结果，因为我的前端使用的是angular js，页面上的路由跳转也都是由angular ui来控制，所以像第一篇spring整合activiti-modeler中那样从后台直接重定向的话就没有任何反应：

[java]  view plain  copy

 

1. /** 
2.      * 创建模型 
3.      *  
4.      * @author：tuzongxun 
5.      * @Title: create 
6.      * @param @param activiti 
7.      * @param @param request 
8.      * @param @param response 
9.      * @param @return 
10.      * @return Object 
11.      * @date Mar 17, 2016 12:30:29 PM 
12.      * @throws 
13.      */  
14.     @RequestMapping(value = "/create.do", method = RequestMethod.POST, produces = "application/json;charset=utf-8")  
15.     @ResponseBody  
16.     public Object create(@RequestBody ActivitiModel activiti,  
17.             HttpServletRequest request, HttpServletResponse response) {  
18.         Map<String, String> map = new HashMap<String, String>();  
19.         Boolean isLogin = this.isLogin(request);  
20.         if (isLogin) {  
21.             Model newModel = repositoryService.newModel();  
22.             try {  
23.   
24.                 ObjectMapper objectMapper = new ObjectMapper();  
25.                 ObjectNode modelObjectNode = objectMapper.createObjectNode();  
26.                 modelObjectNode.put(ModelDataJsonConstants.MODEL_NAME,  
27.                         activiti.getName());  
28.                 modelObjectNode.put(ModelDataJsonConstants.MODEL_REVISION, 1);  
29.                 modelObjectNode.put(ModelDataJsonConstants.MODEL_DESCRIPTION,  
30.                         StringUtils.defaultString(activiti.getDescription()));  
31.                 newModel.setMetaInfo(modelObjectNode.toString());  
32.                 newModel.setName(activiti.getName());  
33.                 newModel.setKey(StringUtils.defaultString(activiti.getKey()));  
34.                 repositoryService.saveModel(newModel);  
35.                 ObjectNode editorNode = objectMapper.createObjectNode();  
36.                 editorNode.put("id", "canvas");  
37.                 editorNode.put("resourceId", "canvas");  
38.                 ObjectNode stencilSetNode = objectMapper.createObjectNode();  
39.                 stencilSetNode.put("namespace",  
40.                         "http://b3mn.org/stencilset/bpmn2.0#");  
41.                 editorNode.put("stencilset", stencilSetNode);  
42.                 repositoryService.addModelEditorSource(newModel.getId(),  
43.                         editorNode.toString().getBytes("utf-8"));  
44.             } catch (Exception e) {  
45.                 e.getStackTrace();  
46.             }  
47.             // response.sendRedirect(request.getContextPath() +  
48.             // "/service/editor?id="  
49.             // + newModel.getId());  
50.             map.put("isLogin", "yes");  
51.             map.put("userName",  
52.                     (String) request.getSession().getAttribute("userName"));  
53.             map.put("path", "/service/editor?id=");  
54.             map.put("modelId", newModel.getId());  
55.         } else {  
56.             map.put("isLogin", "no");  
57.         }  
58.         return map;  
59.     }  

6.angular js前台代码，路由控制页面跳转：

  （1）.app.js:

       

[javascript]  view plain  copy

 

1. $stateProvider    
2.     .state('create', {    
3.     url: "/create",    
4.     views: {    
5.        'view': {    
6.         templateUrl: 'activi_views/create.html',    
7.         controller: 'createCtr'    
8.        }    
9.     }    
10.    });    

   (2).createCtr.js，angular js中的控制器，和后台交互，按我们公司前端现在的标准做法，应该还要服务层service，但是我运用还不太熟练，就暂且都放在controller中了:

 

[javascript]  view plain  copy

 

1. angular.module('activitiApp')    
2. .controller('createCtr', ['$rootScope','$scope','$http','$location','$state', function($rootScope,$scope,$http,$location,$state){    
3.     //创建模型  
4.     $http.post("createFlush.do").success(function(result){  
5.         if(result.isLogin==="yes"){  
6.             $rootScope.userName=result.userName;  
7.         }else{  
8.             $location.path("/login");  
9.         }  
10.     });  
11.     $scope.createTo=function(activiti){  
12.         //向后台提交数据  
13.       $http.post("./create.do",activiti,{headers:'Content-Type:application/json'}).success(function(createResult){  
14.           console.log(createResult);  
15.           $location.path("/modelList");  
16.         window.open("http://localhost:8080/activitiTest1"+createResult.path+createResult.modelId);  
17.       });  
18.   
19.     }    
20.     
21. }])    

  (3).index.html:

[html]  view plain  copy

 

1. <!DOCTYPE html>  
2. <html ng-app="activitiApp">  
3. <head>  
4.   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
5.   <link href="./activi_css/activi.css" rel="stylesheet"/>   
6.   <link href="css/bootstrap/css/bootstrap.css?2023" rel="stylesheet" type="text/css" />  
7.   <link href="css/site.css?2023" rel="stylesheet" type="text/css" />  
8.   <script type="text/javascript">  
9.         var _root='http://form/index.php?s=/',_controller = 'index';  
10.   </script>  
11.   <script src="./angular-1.4.0-rc.2/angular.js"></script>  
12.   <script src='./angular-1.4.0-rc.2/angular-ui-router.js'></script>  
13.   <script src='./activi_js/app.js'></script>  
14.   <script src='./activi_js/createCtr.js'></script>  
15.   <script src='./activi_js/modelCtr.js'></script>  
16.   <script src='./activi_js/processCtr.js'></script>  
17.   <script src='./activi_js/taskCtr.js'></script>  
18.   <script src='./activi_js/loginCtr.js'></script>  
19.   <script src='./activi_js/hisTaskCtr.js'></script>  
20.   <script src='./activi_js/startProcessCtr.js'></script>  
21.   <script src='./activi_js/completeTaskCtr.js'></script>  
22. </head>  
23. <body style="width:100%;height:300px;margin:0;background-color:#fff">  
24.  <div style="height:70px;width:100%;border:1px solid #ccf">  
25.     <img id="rdiv" src="./images/activiti.png" style="width:30%;height:98%"/>  
26.      <a href="script:;" ng-show="userName!=undefined" style="margin-right:10px;float:right;margin-top:25px;" ng-click="logOut();">  
27.      [退出登陆]  
28.     </a>  
29.     <font ng-show="userName!=undefined" style="margin-right:10px;float:right;margin-top:25px;">当前登陆用户：{{userName}}</font>  
30.  </div>  
31.  <div style="width:100%;position: absolute;height:auto">  
32.  <div style="height:580px;width:12%;font-size:36px;position:relative;float:left;border:1px solid #ccf" ng-show="userName!=undefined">  
33.     <table style="width:100%;text-align:center;margin-top:0px" cellSpacing="5px" cellPadding="0px">  
34.       <tr>  
35.          <td style="background-color:#caf;"><a href="#/create">创建模型</a></td>  
36.       </tr>  
37.       <tr>  
38.          <td style="background-color:#ccf;"> <a href="#/modelList">模型列表</a></td>  
39.       </tr>  
40.       <tr>  
41.          <td style="background-color:#cef;"><a href="#/processList">流程列表</a></td>  
42.       </tr>  
43.       <tr>  
44.          <td style="background-color:#aef;"><a href="#/taskList">当前任务</a></td>  
45.       </tr>  
46.        <tr>  
47.          <td style="background-color:#fef;"><a href="#/hisTask">历史任务</a></td>  
48.       </tr>  
49.     </table>  
50.  </div>  
51.    
52.  <div ui-view="view" ></div>  
53.  </div>  
54. </body>  
55. </html>  

   

(4).create.html:

[html]  view plain  copy

 

1. <center>    
2. <div style="margin-top:100px;margin-left:200px;background-color:#9cc;height:350px;width:40%;font-size:26px;position:relative;float:left;">    
3.     <p style="font-size:30px">创建模型</p>  
4.     Name   :<input type="text" name="name" ng-model="activiti.name"/>   
5.     </br>    
6.     </br>    
7.     Key    :<input type="text" name="key" ng-model="activiti.key"/>    
8.     </br>    
9.     </br>    
10.     Description:<input type="text" name="description" ng-model="activiti.description"/>    
11.     </br>    
12.     </br>    
13.     <input style="font-size:28px;cursor:pointer" type="button" value="创建模型" ng-click="createTo(activiti);">    
14.              
15.     <input style="font-size:28px;cursor:pointer" type="button" value="返回">    
16. </div>    
17. </center>    

7.如果模型创建成功，则可以看到数据库act_re_model中会出现一条数据，如下：

同时在act_ge_bytearray表中会出现两条数据，如下图：

并且可以看到，在model表中会有两个字段把bytearray表中两条数据的id保存起来。