update

ebpm-process-manage/webapp/resource/js/plugins/simpletable/simpletable.css

@@ -0,0 +1,77 @@
+.gridTable {
+	margin: 0;
+	padding: 0;
+	font-size: 12px;
+}
+
+/** grid body */
+.gridBody {
+	border-right: 1px solid silver;
+	border-top: 1px solid silver;
+}
+.gridBody th {
+	border-left: 1px solid silver;
+	border-bottom: 1px solid silver;
+	vertical-align: middle;
+	background-color: #E5E5E5;
+	padding:0 10px 0 0;
+	
+	font-size: 14px;
+}
+.gridBody td {
+	border-left: 1px solid silver;
+	border-bottom: 1px solid silver;
+	color: black;
+	font-size: 14px;
+}
+
+/** grid header sort */
+.gridBody th.sort {
+}
+.gridBody th.sort.desc {
+	background:#c5c5c5 url(images/sort_desc.gif) center right no-repeat
+}
+.gridBody th.sort.asc {
+	background:#c5c5c5 url(images/sort_asc.gif) center right no-repeat
+}
+
+/** mouse hove over sort header */
+.gridBody .tableHeaderSortHover {
+	background-color: #f5f5f5 !important;
+	text-decoration: underline;
+	cursor: pointer;
+}
+
+/** gridBody row colors */
+.gridBody .odd {
+	background-color: #FFFFFF;
+}
+.gridBody .even {
+	background-color: #F8F8F8;
+}
+.gridBody .highlight {
+	background-color: #fdeccf !important;
+}
+
+/** grid toolbar */
+.gridToolbar .leftControls {
+}
+.gridToolbar .paginationControls .buttonLabel{
+	margin:0 0 0 12px
+}
+.gridToolbar .box div {
+	display:inline;
+	float:left;
+}
+.gridToolbar .box .paginationControls {
+	float:right;
+	font-size: 13px;
+}
+.gridToolbar td{
+	background-color: #F4F4F4;
+}
+
+.gridBody .odd a, .even a {
+	font-size: 13px;
+	color: 005C9C !important;
+}

ebpm-process-manage/webapp/resource/js/plugins/simpletable/simpletable.js

@@ -0,0 +1,118 @@
+/**
+ * author: badqiu
+ * depend on JQuery
+ */
+var SimpleTable = function(formId,pageNumber,pageSize,sortColumns,pageNumberKey,pageSizeKey,sortColumnsKey) {
+	this.form = formId;
+	this.pageNumber = pageNumber;
+	this.pageSize = pageSize;
+	this.sortColumns = sortColumns;
+	this.pageNumberKey = pageNumberKey || 'pageNumber';
+	this.pageSizeKey = pageSizeKey || 'pageSize';
+	this.sortColumnsKey = sortColumnsKey || 'sortColumns';
+	
+	//handle sort
+	_this = this;
+	$("#"+formId+" .gridBody th[sortColumn]").click(function() {
+		//handle click sort header
+		var column = $(this).attr('sortColumn');
+		if(SimpleTableUtils.getSortDirection(sortColumns,column) == 'asc') {
+			_this.toggleSort("");
+		}else if(SimpleTableUtils.getSortDirection(sortColumns,column) == 'desc') {
+			_this.toggleSort(column + " asc");
+		}else {
+			_this.toggleSort(column + " desc");
+		}
+	}).mouseover(function() {
+		$(this).toggleClass('tableHeaderSortHover',true);
+	}).mouseout(function() {
+		$(this).toggleClass('tableHeaderSortHover',false);
+	});
+	
+	// add 'desc' or 'asc' class to sorted tableHeader
+	var sortInfos = SimpleTableUtils.getSortInfos(sortColumns);
+	for(var i = 0; i < sortInfos.length; i++) {
+		var info = sortInfos[i];
+		var selector = "#"+formId+' .gridBody th[sortColumn="'+info.column+'"]';
+		var order = info.order ? info.order : 'asc';
+		$(selector).addClass("sort " + order.toLowerCase());
+	}
+	
+	//handle highlight on mouseover
+	$("#"+formId+" .gridBody tbody tr").mouseover(function() {
+		$(this).toggleClass('highlight',true);
+	}).mouseout(function() {
+		$(this).toggleClass('highlight',false);
+	});
+	
+};
+SimpleTable.prototype = {
+	doJump : function(pageNumber,pageSize,sortColumns) {
+		//alert("pageNumber:"+pageNumber+" pageSize:"+pageSize+" sortColumns:"+sortColumns+" this.form:"+this.form);
+		var pair = function(k,v) {return ' <input type="hidden" name="'+k+'" value="'+v+'" />'};
+		var params = pair(this.pageNumberKey,this.pageNumber)+pair(this.pageSizeKey,this.pageSize)+pair(this.sortColumnsKey,this.sortColumns)
+		$('#'+this.form).append(params);
+		SimpleTableUtils.fireSubmit(this.form);
+	},
+	togglePage : function(pageNumber) {
+		this.pageNumber = pageNumber;
+		this.doJump(pageNumber,null,null);
+	},
+	togglePageSize : function(pageSize) {
+		this.pageSize = pageSize;
+		this.doJump(null,pageSize,null);
+	},
+	toggleSort : function(sortColumns) {
+		this.sortColumns = sortColumns;
+		this.doJump(null,null,sortColumns);
+	}
+};
+
+// static methods
+var SimpleTableUtils = {
+	getSortInfos : function(sortColumns) {
+		if(!sortColumns) return []; 
+		var results = [];
+		var sorts = sortColumns.split(",");
+		for(var i = 0; i < sorts.length; i++) {
+			var columnAndOrder = sorts[i].split(/\s+/);
+			var column = columnAndOrder[0];
+			var order = columnAndOrder.length > 1 ? columnAndOrder[1] : null;
+			
+			var sortInfo = new Object();
+			sortInfo.column = $.trim(column);
+			sortInfo.order = $.trim(order);
+			
+			results.push(sortInfo);
+		}
+		return results;
+	},
+	getSortDirection : function(defaultSortColumns,currentColumn) {
+		var infos = SimpleTableUtils.getSortInfos(defaultSortColumns);
+		for(var i = 0; i < infos.length; i++) {
+			var info = infos[i];
+			var order = info.order ? info.order : 'asc';
+			if(info.column == currentColumn) {
+				return order;
+			}
+		}
+		return null;
+	},
+	fireSubmit : function(form) {
+		var form = document.getElementById(form);
+	    if (form.fireEvent) { //for ie
+	    	if(form.fireEvent('onsubmit')){
+	    		form.submit();
+	    	}
+	    } else if (document.createEvent) { // for dom level 2
+			var evt = document.createEvent("HTMLEvents");
+	      	//true for can bubble, true for cancelable
+	      	evt.initEvent('submit', false, true); 
+	      	form.dispatchEvent(evt);
+	      	if(navigator.userAgent.indexOf('Chrome') >= 0 || "ActiveXObject" in window) {
+	      		//"ActiveXObject" in window 用来判断是否是ie11 
+	      		form.submit();
+	      	}
+	    }
+	}
+}