259 lines
9.8 KiB
Plaintext
259 lines
9.8 KiB
Plaintext
<%@ page contentType="text/html;charset=UTF-8"%>
|
||
<%@ include file="/commons/taglibs.jsp"%>
|
||
<%@page import="com.blueland.bpm.manage.util.*"%>
|
||
<%
|
||
String processInstanceId=request.getParameter("processInstanceId");
|
||
%>
|
||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||
<html xmlns="http://www.w3.org/1999/xhtml" style="overflow-y: auto;overflow-x auto;">
|
||
|
||
<head>
|
||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||
<%@ include file="/commons/meta.jsp"%>
|
||
<style type="text/css">
|
||
div#rMenu {position:absolute; visibility:hidden; top:0; background-color: #555;text-align: left;padding: 2px;}
|
||
div#rMenu ul li{
|
||
margin: 1px 0;
|
||
padding: 0 5px;
|
||
cursor: pointer;
|
||
list-style: none outside none;
|
||
background-color: #DFDFDF;
|
||
}
|
||
</style>
|
||
|
||
<link href="${ctx}/resource/js/plugins/loadmask/jquery.loadmask.css" rel="stylesheet" type="text/css" />
|
||
<link href="${ctx}/resource/js/plugins/zTree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" media="screen" />
|
||
<script type="text/javascript" src="${ctx }/resource/js/plugins/zTree/js/jquery-1.4.4.min.js"></script>
|
||
<script type="text/javascript" src="${ctx }/resource/js/plugins/zTree/js/jquery.ztree.core-3.4.js"></script>
|
||
<script type='text/javascript' src='${ctx}/resource/js/plugins/loadmask/jquery.loadmask.js'></script>
|
||
<script type="text/javascript">
|
||
/*function $(id){
|
||
return document.getElementById(id);
|
||
}*/
|
||
function changeHref(id,srcStr,currentType){
|
||
|
||
//if("image"==currentType){
|
||
//var height="${height}";
|
||
|
||
//}
|
||
document.getElementById(id).src=srcStr;
|
||
}
|
||
function selectTag(showContent,selfObj,currentType,fileId){
|
||
//当前展示的是文本监控还是图形监控页面标记，text为文本监控页面 image为图形监控页面
|
||
$("#currentType").val(currentType);
|
||
var currentProcessInstanceId = $("#currentProcessInstanceId").val();
|
||
showContent = showContent+(showContent.indexOf("?")!=-1?'&':'?') + "processInstanceId="+currentProcessInstanceId+"&fileId="+fileId ;
|
||
setMask("main-container");
|
||
// 操作标签
|
||
var tag = document.getElementById("tags").getElementsByTagName("li");
|
||
var taglength = tag.length;
|
||
for(i=0; i<taglength; i++){
|
||
tag[i].className = "";
|
||
}
|
||
selfObj.parentNode.className = "selectTag";
|
||
changeHref("frmrightChild",showContent,currentType);
|
||
}
|
||
function busiProcess(arisCode){
|
||
var url = "<%=MyContants.BPM_FRONT_PATH%>"+"/ebpm-bpa-front/#/detail?fileId="+arisCode+"&type=.bpmn&isMenu=false";
|
||
var iframeHeight = $("#frmrightChild").contents().find("body").height()<500?500:$("#frmrightChild").contents().find("body").height();
|
||
$("#frmrightChild").height(iframeHeight);
|
||
changeHref("frmrightChild",url,"");
|
||
}
|
||
function moveLeft(){
|
||
var left = $("tags").style.left;
|
||
left = left && parseInt(left) || 0;
|
||
if(left<0){
|
||
$("tags").style.left = left + 95 + "px";
|
||
}
|
||
}
|
||
|
||
function moveRight(){
|
||
var left = $("tags").style.left;
|
||
left = left && parseInt(left) || 0;
|
||
$("tags").style.left = left - 95 + "px";
|
||
}
|
||
|
||
var zNodes ;
|
||
var setting = {
|
||
view: {
|
||
dblClickExpand : false,
|
||
selectedMulti: false
|
||
},
|
||
edit: {
|
||
enable: false,
|
||
drag:{isMove:false}
|
||
},
|
||
data: {
|
||
simpleData: {
|
||
enable : true,
|
||
idKey : "id",
|
||
pIdKey : "pId"
|
||
}
|
||
},async: {
|
||
enable: true,
|
||
url:"${ctx}/workflow/trace/allProcessInstance.do?processInstanceId=${processInstanceId}",
|
||
autoParam:["id", "name=n"],
|
||
dataFilter: filter
|
||
},callback: {
|
||
beforeClick: beforeClick,
|
||
onAsyncSuccess:onAsyncSuccess
|
||
}
|
||
|
||
};
|
||
|
||
function onAsyncSuccess (){
|
||
zTree = $.fn.zTree.getZTreeObj("treeDemo");
|
||
var nodes=zTree.getNodes();
|
||
var allnodes = zTree.transformToArray(nodes);
|
||
if(1<allnodes.length){//左边树有多个节点时，展示左边树
|
||
$("#leftPart").show();
|
||
}
|
||
|
||
//在树上标志出当前节点
|
||
var currentProcessInstanceId = $("#currentProcessInstanceId").val();
|
||
var node = zTree.getNodeByParam("id",currentProcessInstanceId);
|
||
zTree.selectNode(node,false);
|
||
}
|
||
|
||
function filter(treeId, parentNode, childNodes) {
|
||
//alert(childNodes);
|
||
//默认加载第一个或者根节点
|
||
if(typeof(parentNode)=="undefined"||parentNode==null||parentNode==""){
|
||
//alert(childNodes[2].id);
|
||
}
|
||
|
||
return childNodes;
|
||
}
|
||
function beforeClick(treeId, treeNode) {
|
||
flushFlowLog(treeNode.id);
|
||
return true;
|
||
}
|
||
|
||
|
||
$(function(){
|
||
var height = window.screen.height;
|
||
$("#frmrightChild").height(parseInt(height)-290);
|
||
$("#treeDemo").height(parseInt(height)-218);
|
||
//默认跳转文本监控
|
||
var currentProcessInstanceId = $("#currentProcessInstanceId").val();
|
||
$("#frmrightChild").attr("src","${ctx}/workflow/trace/traceByText.do?"+ "processInstanceId="+currentProcessInstanceId);
|
||
$.fn.zTree.init($("#treeDemo"), setting);
|
||
//setMask("main-container");
|
||
});
|
||
|
||
function flushFlowLog(processInstanceId){
|
||
setMask("main-container");
|
||
$("#currentProcessInstanceId").val(processInstanceId);
|
||
var currentType = $("#currentType").val();
|
||
if("text" == currentType){
|
||
document.getElementById("frmrightChild").src="${ctx}/workflow/trace/traceByText.do?processInstanceId="+processInstanceId;
|
||
}else{
|
||
document.getElementById("frmrightChild").src="${ctx}/workflow/trace/traceByImage.do?processInstanceId="+processInstanceId;
|
||
}
|
||
|
||
}
|
||
function changiframheight(){
|
||
$("#main-container").unmask();
|
||
}
|
||
function showFlowImage(arisCode){
|
||
if($("#currentType").val()=="image"){
|
||
return;
|
||
}
|
||
setMask("main-container");
|
||
|
||
var currentProcessInstanceId = $("#currentProcessInstanceId").val();
|
||
$("#currentType").val("image");
|
||
var url="<%=MyContants.BPM_PROCESS_MODELER_PATH%>";
|
||
$("#frmrightChild").attr("src",url+"#/processMonitor?"+ "processInstanceId="+currentProcessInstanceId+"&arisCode");
|
||
}
|
||
</script>
|
||
<title>流程监控</title>
|
||
</head>
|
||
<body class="no-skin white-page" >
|
||
<input type="hidden" id="currentProcessInstanceId" value="${processInstanceId}"/>
|
||
<input type="hidden" id="currentType" value="text"/>
|
||
<div class="main-container" id="main-container">
|
||
<script type="text/javascript">
|
||
try{ace.settings.check('main-container' , 'fixed')}catch(e){}
|
||
</script>
|
||
<div class="main-content">
|
||
<!-- /section:basics/content.breadcrumbs -->
|
||
<div class="page-content" style="padding:2px;">
|
||
<!-- #section:settings.box -->
|
||
|
||
<!-- /section:settings.box -->
|
||
<div class="page-content-area">
|
||
|
||
<div class="row">
|
||
<div class="col-xs-12">
|
||
<!-- PAGE CONTENT BEGINS -->
|
||
|
||
<table width="100%">
|
||
<tr>
|
||
<td colspan="2">
|
||
<div class="panel-heading" style="margin:0 15px;background: #f5f5f5 !important;color: #18191A;border: 0 !important;padding: 10px 20px;">
|
||
<span id="headingSpan" style="font-size: 14px;"><b>流程标题：</b>${processInstance.procTitle}，<b>流程状态：</b>${processInstance.procState==1?'运行中':(processInstance.procState==5?'已结束':'已作废')}，<b>流程定义名称：</b>${processInstance.procDefName}</span>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td id="leftPart" valign="top" class="centerleft" style="width:250px;display:none; ">
|
||
<div class="panel panel-primary" style="width:250px;">
|
||
<div class="ztree" id="treeDemo" style="width:250px; height:474px; overflow:auto"></div>
|
||
</div>
|
||
</td>
|
||
<td valign="top" align="left" id="rightPart" >
|
||
<div class="tabbable" style="margin-left: 0; margin-right: 0;">
|
||
<ul class="nav nav-tabs padding-12 tab-color-blue background-blue"
|
||
id="tags">
|
||
<li class="active"><a id="UserContract" data-toggle="tab"
|
||
onclick="selectTag('${ctx}/workflow/trace/traceByText.do',this,'text','${arisCode}');"
|
||
href="" target="frmrightChild" class="current"><i class="ace-icon fa fa-file-text-o bigger-125"></i>
|
||
文本监控</a></li>
|
||
|
||
<%-- <li><a id="UserEvent" href=""
|
||
data-toggle="tab"
|
||
onclick="selectTag('${ctx}/workflow/trace/traceByImage.do',this,'image','${arisCode}');"
|
||
target="frmrightChild"><i class="ace-icon fa fa-picture-o bigger-125"></i>
|
||
图形监控</a></li> --%>
|
||
<li><a id="UserEvent" href=""
|
||
data-toggle="tab"
|
||
onclick="selectTag('${ctx}/workflow/trace/traceByImage.do',this,'image','${arisCode}');"
|
||
target="frmrightChild"><i class="ace-icon fa fa-picture-o bigger-125"></i>
|
||
图形监控</a></li>
|
||
<%-- <li><a id="UserEvent" href=""
|
||
data-toggle="tab"
|
||
onclick="showFlowImage('${arisCode}');"
|
||
target="frmrightChild"><i class="ace-icon fa fa-picture-o bigger-125"></i>
|
||
图形监控</a></li> --%>
|
||
<c:if test="${arisCode != null }">
|
||
<li><a id="busiEvent" href=""
|
||
data-toggle="tab"
|
||
onclick="busiProcess('${arisCode}');"
|
||
target="frmrightChild"><i class="ace-icon fa fa-sitemap bigger-125"></i>业务流程梳理</a></li>
|
||
</c:if>
|
||
|
||
</ul>
|
||
|
||
<div class="tab-content" style="width: 100%; height: 100%;" id="firea">
|
||
<IFRAME scrolling="auto" frameBorder=0 id="frmrightChild"
|
||
onload="changiframheight();"
|
||
name="frmrightChild" style="width:100%;"
|
||
allowTransparency="true">
|
||
</div>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
<!-- PAGE CONTENT ENDS -->
|
||
</div><!-- /.col -->
|
||
</div><!-- /.row -->
|
||
</div><!-- /.page-content-area -->
|
||
</div><!-- /.page-content -->
|
||
|
||
|
||
|
||
</div><!-- /.main-container -->
|
||
</body>
|
||
|
||
</html> |