<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib tagdir="/WEB-INF/tags/simpletable" prefix="simpletable"%>
<%@ include file="/commons/taglibs.jsp"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!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">
<head>
	<%@ include file="/commons/meta.jsp"%>
	<base href="<%=basePath%>">
	<title>流程总览</title>
	<script language="javascript" type="text/javascript" src="${ctx}/resource/js/plugins/My97DatePicker/WdatePicker.js"></script>
	<link href="${ctx}/resource/js/plugins/loadmask/jquery.loadmask.css" rel="stylesheet" type="text/css" />
	<script type='text/javascript' src='${ctx}/resource/js/plugins/loadmask/jquery.loadmask.js'></script>
	<link href="${ctx_js_plugins}/simpletable/simpletable.css" type="text/css" rel="stylesheet">
	<script type="text/javascript" src="${ctx_js_plugins}/simpletable/simpletable.js"></script>

	<script type="text/javascript">
		function openSysDialog(ctx, appId, col){
			var height1 = window.parent.document.documentElement.clientHeight;
			var height = (parseInt(height1)-45)+"px";
			var url = "${ctx}/sysMgr/getAppName.do?appId="+appId;
			$.ajax({
				type: "get",
				url: url, //Servlet请求地址
				async: true,
				dataType: "json",
				success: function (data) {
//                     	var List = data; 
//         				for(var actDef in List){
//         					var showContent = "";//添加内容变量
//         					showContent += "<tr class='children"+num+"'>";
//         	                showContent += "<td style='padding-left:50px'>"+List[actDef].ACTDEFNAME+"</td>";
//         	                showContent += "<td><span class='label label-warning'>"+List[actDef].EFFICIENCY+"</span></td>";
//         	                showContent += "</tr>";
//         	                $("#procDefId"+num).after(showContent);
//         				} 
//     					$(".loadmask").remove();
//     					$(".loadmask-msg").remove();
					var title = '流程总览--' + data +"--"+ col;
					showDiaLog(ctx,title,'1400px',height);
				},
				error: function (XMLHttpRequest, textStatus, errorThrown) {
					alert(errorThrown);
					console.info("数据请求异常 请查看控制台错误 或者检查servlet配置")
				}
			});
		}
		function query(){
			setMask("main-container");
			document.getElementById("queryForm").submit();
		}
	</script>
</head>
<body>
<%@ include file="/commons/messages.jsp"%>
<form id="queryForm" name="queryForm" method="post" style="display: inline;" action="${ctx}/sysMgr/appProcessList.do">
	<div class="main-container" id="main-container">
		<div class="panel panel-primary">
			<div class="panel-heading">
				<h8>流程总览</h8>
			</div>
			<div class="panel-body" id="panel-body" style="padding:3px;">
				<div class="well well-sm" style="margin-bottom: 2px;">

					<table border="0" cellspacing="0" cellpadding="0"
						   class="table-search">
						<tr>
							<td>应用名称：</td>
							<td>
								<select name="appId">
									<option value="">--请选择--</option>
									<c:forEach items="${applicationList}" var="item">
										<option ${params.appId==item.appId?"selected":""} value="${item.appId }">${item.appName}</option>
									</c:forEach>
								</select>
							</td>
							<td>创建年度：</td>
							<td><input value="${params.searchYear}" id="searchYear" name="searchYear" onClick="WdatePicker({dateFmt:'yyyy'})" autocomplete="off"/></td>
							<td>创建月份：</td>
							<td><input value="${params.searchMouth}" id="searchMouth" name="searchMouth" onClick="WdatePicker({dateFmt:'MM'})" autocomplete="off"/></td>
							<td>
								<input id="toSearchYear" name="toSearchYear" value="ALL" type="hidden"/>
								<button type="submit" onclick="query()" class="btn btn-xs btn-primary">
									查询<i class="ace-icon fa fa-search bigger-110"></i>
								</button>
							</td>
						</tr>
					</table>
				</div>
				<div class="row">
					<div class="col-xs-12">
						<div class="table-responsive">
							<table id="sample-table-1"
								   class="table table-striped table-bordered table-hover">
								<thead>
								<tr>
									<th sortColumn="appName">应用名称(${params.appSum })</th>
									<th sortColumn="runTaskNum">流程定义(${params.runtaskSum })</th>
									<th sortColumn="procinstOneNum">流程实例(运行中)(${params.procinstOneSum })</th>
									<th sortColumn="procinstFiveNum">流程历史(已办结)(${params.procinstFiveSum })</th>
									<th sortColumn="procdefNum">流程待办(${params.procdefSum })</th>
								</tr>
								</thead>
								<tbody>
								<c:forEach items="${resultMap}" var="item" varStatus="status">
									<tr class="${status.count % 2 == 0 ? 'odd' : 'even'}">
										<td>${item.APPNAME}&nbsp;</td>
										<td>
											<a href="javascript:void(0);" onclick="openSysDialog('${ctx}/procDefMgr/list.do?appId=${item.APPID }', '${item.APPID }' , '流程定义');">
													${item.RUNTASKNUM == null ? 0 : item.RUNTASKNUM}&nbsp;
											</a>
										</td>
										<td>
											<a href="javascript:void(0);" onclick="openSysDialog('${ctx}/sysMgr/sysProcessInstList.do?appId=${item.APPID }&toProcState=1&toSearchYear=${params.searchYear}', '${item.APPID }' , '流程实例(运行中)');">
													${item.PROCINSTONENUM == null ? 0 : item.PROCINSTONENUM}&nbsp;
											</a>
										</td>
										<td>
											<a href="javascript:void(0);" onclick="openSysDialog('${ctx}/sysMgr/sysProcessInstList.do?appId=${item.APPID }&toProcState=5&toSearchYear=${params.searchYear}', '${item.APPID }' , '流程历史(已办结)');">
													${item.PROCINSTFIVENUM == null ? 0 : item.PROCINSTFIVENUM}&nbsp;
											</a>
										</td>
										<td>
											<a href="javascript:void(0);" onclick="openSysDialog('${ctx}/sysMgr/sysTaskList.do?appId=${item.APPID }&toSearchYear=${params.searchYear}', '${item.APPID }' , '流程待办');">
													${item.PROCDEFNUM == null ? 0 : item.PROCDEFNUM}&nbsp;
											</a>
										</td>
									</tr>
								</c:forEach>
								</tbody>
							</table>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</form>
</body>
</html>

