ssm实现查看流程图

jsp

<!--显示数据列表-->

<tbody id="TableData" class="dataContainer" datakey="processDefList">

<c:forEach items="${pdList}" var="pd">

<tr class="TableDetail1 template">

<td>${pd.name}&nbsp;</td>

<td align="CENTER">${pd.version}&nbsp;</td>

<td>

<a onclick="return window.confirm('确定删除当前记录吗？')" href="${pageContext.request.contextPath}/pd/deleteByKey?key=${pd.key}">删除</a>

<a href="javascript:void(0);" onclick="showPng('${pd.id}','${pd.name}')">查看流程图</a>

</td>

</tr>

</c:forEach>

</tbody>

js

<script type="text/javascript">

function showPng(pid,pname){

$.ajax({

type:"POST",

data:{

"lcdyId":pid

},

dataType:'json',

url:"${pageContext.request.contextPath}/pd/showPng",

async:true,

cache:false,

beforeSend:function(){

return true;

},

success:function(list){

var imgSrc="data:image/png;base64,";

for(var i=0;i<list.length;i++){

imgSrc+=list[i];

}

var img="<img src='"+imgSrc+"'>";

layer.open({

type:1,

area:['800px','400px'],

title:pname,

shade:0.6,

anim:1,

shadeClose:true,//点击阴影处关闭

content:img

});

},

error:function(){

layer.msg("流程图加载失败",{time:1000, icon:5, shift:6});

}

});

}

</script>

controller

/**

* 显示png图片（文件下载）

*/

@RequestMapping("/showPng")

@ResponseBody

public List showPng(String lcdyId){

InputStream inputStream = processDefinitionService.findPngStream(lcdyId);

byte[] data=null;

try {

data=new byte[inputStream.available()];

inputStream.read(data);

} catch (IOException e) {

e.printStackTrace();

}

List<byte[]> list=new ArrayList<byte[]>();

list.add(data);

return list;

}

service

/**

* 根据流程定义id获得png的输入流

*/

@Override

public InputStream findPngStream(String lcdyId) {

return processEngine.getRepositoryService().getProcessDiagram(lcdyId);

}