<%@page import="org.activiti.engine.repository.ProcessDefinition"%>
<%@page import="org.activiti.engine.repository.Model"%>
<%@page import="com.blueland.bpm.engine.config.model.*"%>
<%@page import="com.blueland.bpm.common.page.*"%>
<%@page import="com.blueland.bpm.common.util.*"%>
<%@page import="com.blueland.bpm.manage.util.*"%>
<%@page import="java.util.*"%>
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib tagdir="/WEB-INF/tags/simpletable" prefix="simpletable"%>
<%@ include file="/commons/taglibs.jsp"%>
<jsp:include page="/pages/sysGlType/selectTypeTree.jsp" flush="false" />
<%
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>
<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">
		$(document).ready(function() {
			// 分页需要依赖的初始化动作
			window.simpleTable = new SimpleTable('procDefForm','${page.thisPageNumber}','${page.pageSize}','${pageRequest.sortColumns}');
			
		});
		
		function getItemsProcDefId(){
			var chk_value =[]; 
			var procDefId="";
			$("input[name='items']:checkbox:checked").each(function(){ 
				chk_value.push($(this).val());
			})
			if(chk_value.length==0){
				alert("请选择一项流程定义数据！");
			}else{
				if(chk_value.length>1){
					alert("不能同时查看多条记录的流程图！");
					return false;
				}
				var items=chk_value[0].split("=");
				for(var i=0;i<items.length;i++){
					if(items[0]=="processDefinitionId"){
						procDefId=items[1];
					}
				}
				
			}
			return procDefId;
		}
		

		//获取选中的所有流程定义id值,返回的流程定义id数组
		function chooseFlowModel(){
			var chk_value =[]; 
			var procDefKey=new Array();
			$("input[name='items']:radio:checked").each(function(){ 
				chk_value.push($(this).val());
			})
			if(chk_value.length==0){
				alert("请选择一条流程数据！");
				return;
			}else{
				var items=chk_value[0].split("=");
				for(var i=0;i<items.length;i++){
					if(items[0]=="procDefKey"){
						procDefKey=items[1];
					}
				}
				
			}
			//发给父页面消息
	      window.parent.postMessage(
	        {
	          cmd: "flow",
	          params: {"procDefKey":procDefKey}
	        },
	        '*'
	      )
		}
	</script>
</head>
<body>
	<%@ include file="/commons/messages.jsp"%>
	<form id="procDefForm" name="procDefForm"
		action="${ctx}/procDefModelMgr/model/list.do?appId=${appId}" method="post"
		style="display: inline;">
		<!-- <input value="${query.processTypeId}" id="processTypeId"
			name="processTypeId" maxlength="30" type="hidden" /> -->
		<div class="main-container" id="main-container">
			<div class="panel panel-primary">
				<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>流程定义KEY：</td>
								<td><input value="${query.processDefKey}"
									id="processDefKey" name="processDefKey" maxlength="30" /></td>
								<td>流程定义名称：</td>
								<td><input value="${query.processDefName}"
									id="processDefName" name="processDefName" maxlength="30" /></td>
								<td><button type="submit" class="btn btn-xs btn-primary">查&nbsp;&nbsp;询
								<i class="ace-icon fa fa-search bigger-110"></i></button></td>
							</tr>
							<tr>
								<td colspan="7">
									
								   
									<button type="button" onclick="chooseFlowModel();"
										class="btn btn-xs btn-yellow">选择流程流程模型
										<i class="ace-icon fa fa-cloud-download 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 style="width: 25px;">
												<!-- <input type="checkbox" id="selectAll"
												onclick="setAllCheckboxState('items',this.checked)"> -->
											</th>
											<!-- 排序时为th增加sortColumn即可,new SimpleTable('sortColumns')会为tableHeader自动增加排序功能; -->
											<th>流程定义KEY</th>
											<th style="width: 60px;">版本号</th>
											<th sortColumn="procDefName" style="width: 150px"> 流程定义名称</th>
											<!-- <th style="width: 150px;">流程类型</th> -->
											<th sortColumn="deployTime" style="width: 120px;">创建时间</th>
										</tr>
									</thead>
									<tbody>
										<c:forEach items="${page.result}" var="item" varStatus="status">
											<tr class="${status.count % 2 == 0 ? 'odd' : 'even'}">
												<td><input type="radio" name="items" id="items"
													value="procDefKey=${fn:split(item.processDefId,":")[0]}"></td>
												<td class="td" title="${fn:split(item.processDefId,":")[0]}">${fn:split(item.processDefId,":")[0]}&nbsp;</td>
												<td class="td" title="${fn:split(item.processDefId,":")[1]}" align="center">${fn:split(item.processDefId,":")[1]}&nbsp;</td>
												<td>${item.processDefName}&nbsp;</td>
												<%-- <td>${item.processTypeName}&nbsp;</td> --%>
												
												<td><fmt:formatDate value="${item.createTime}" pattern="yyyy-MM-dd HH:mm:ss"/>
									
											</tr>
										</c:forEach>
									</tbody>
								</table>
								<simpletable:pageToolbar page="${page}">
								</simpletable:pageToolbar>
							</div>
							<!-- /.table-responsive -->
						</div>
						<!-- /span -->
					</div>
				</div>
			</div>

		</div>
	</form>
</body>
</html>
