树形表格使用bootstrap-table方案

src/main/resources/static/js/base/area/list.js

@@ -130,7 +130,7 @@ var vm = new Vue({
 				title : '新增区域',
 				url : 'base/area/add.html?_' + $.now(),
 				width : '500px',
-				height : '445px',
+				height : '450px',
 				success : function(iframeId) {
 					top.frames[iframeId].vm.area.parentCode = vm.parentCode;
 					top.frames[iframeId].vm.area.parentName = vm.parentName;
@@ -147,7 +147,7 @@ var vm = new Vue({
 					title : '编辑区域',
 					url : 'base/area/edit.html?_' + $.now(),
 					width : '500px',
-					height : '445px',
+					height : '450px',
 					success : function(iframeId) {
 						top.frames[iframeId].vm.area.areaId = ck[0].areaId;
 						top.frames[iframeId].vm.setForm();

src/main/resources/static/js/base/macro/list.js

@@ -9,28 +9,62 @@ $(function () {
 
 function initialPage() {
 	$(window).resize(function() {
-		TreeGrid.table.resetHeight({height: $(window).height()-100});
+        $('#dataGrid').bootstrapTable('resetView', {
+            height : $(window).height() - 56
+        });
 	});
 }
 
 function getGrid() {
-	var colunms = TreeGrid.initColumn();
-    var table = new TreeTable(TreeGrid.id, '../../sys/macro/list?_' + $.now(), colunms);
-    table.setExpandColumn(2);
-    table.setIdField("macroId");
-    table.setCodeField("macroId");
-    table.setParentCodeField("typeId");
-    table.setExpandAll(false);
-    table.setHeight($(window).height()-100);
-    table.init();
-    TreeGrid.table = table;
+    $('#dataGrid').bootstrapTreeTableEx({
+        url: '../../sys/macro/list?_' + $.now(),
+        height: $(window).height() - 56,
+        idField: 'macroId',
+        treeShowField: 'name',
+        parentIdField: 'typeId',
+        columns: [
+            {checkbox: true},
+            {title: '编号', field: 'macroId', visible: false, width: '50px'},
+            {title: '参数名', field: 'name', width: '180px'},
+            {title: '参数值', field: 'value', width: '180px'},
+            {title: '所属类别', field: 'typeName', width: '100px'},
+            {
+                title: '类型',
+                field: 'type',
+                width: '60px',
+                formatter: function (value, row, index) {
+                    if (row.type === 0) {
+                        return '<span class="label label-primary">目录</span>';
+                    }
+                    if (row.type === 1) {
+                        return '<span class="label label-warning">参数</span>';
+                    }
+                }
+            },
+            {title: '排序', field: 'orderNum', align: 'center', valign: 'middle', width: '50px'},
+            {
+                title: '可用',
+                field: 'status',
+                width: '60px',
+                formatter: function (value, row, index) {
+                    if (row.status === 0) {
+                        return '<i class="fa fa-toggle-off"></i>';
+                    }
+                    if (row.status === 1) {
+                        return '<i class="fa fa-toggle-on"></i>';
+                    }
+                }
+            },
+            {title: '备注', field: 'remark'}
+        ]
+    });
 }
 
 var vm = new Vue({
 	el:'#dpLTE',
 	methods : {
 		load: function() {
-			TreeGrid.table.refresh();
+            $('#dataGrid').bootstrapTable('refresh');
 		},
 		save: function() {
 			dialogOpen({
@@ -45,7 +79,7 @@ var vm = new Vue({
 			});
 		},
 		edit: function() {
-			var ck = TreeGrid.table.getSelectedRow();
+			var ck = $('#dataGrid').bootstrapTable('getSelections');
 			if(checkedRow(ck)){
 				dialogOpen({
 					title: '编辑字典',
@@ -54,7 +88,7 @@ var vm = new Vue({
 					height: '420px',
 					scroll : true,
 					success: function(iframeId){
-						top.frames[iframeId].vm.macro.macroId = ck[0].id;
+						top.frames[iframeId].vm.macro.macroId = ck[0].macroId;
 						top.frames[iframeId].vm.setForm();
 					},
 					yes : function(iframeId) {
@@ -64,10 +98,10 @@ var vm = new Vue({
 			}
 		},
 		remove: function() {
-			var ck = TreeGrid.table.getSelectedRow(), ids = [];
+			var ck = $('#dataGrid').bootstrapTable('getSelections'), ids = [];
 			if(checkedArray(ck)){
 				$.each(ck, function(idx, item){
-					ids[idx] = item.id;
+					ids[idx] = item.macroId;
 				});
 				$.RemoveForm({
 					url: '../../sys/macro/remove?_' + $.now(),
@@ -79,42 +113,4 @@ var vm = new Vue({
 			}
 		}
 	}
-})
-
-var TreeGrid = {
-    id: "dataGrid",
-    table: null,
-    layerIndex: -1
-};
-
-/**
- * 初始化表格的列
- */
-TreeGrid.initColumn = function () {
-    var columns = [
-        {field: 'selectItem', radio: true},
-        {title: '编号', field: 'macroId', visible: false, align: 'center', valign: 'middle', width: '50px'},
-        {title: '参数名', field: 'name', align: 'center', valign: 'middle', width: '180px'},
-        {title: '参数值', field: 'value', align: 'center', valign: 'middle', width: '180px'},
-        {title: '所属类别', field: 'typeName', align: 'center', valign: 'middle', width: '100px'},
-        {title: '类型', field: 'type', align: 'center', valign: 'middle', width: '60px', formatter: function(item, index){
-        	 if(item.type === 0){
-                 return '<span class="label label-primary">目录</span>';
-             }
-             if(item.type === 1){
-                 return '<span class="label label-warning">参数</span>';
-             }
-        }},
-        {title: '排序', field: 'orderNum', align: 'center', valign: 'middle', width: '50px'},
-        {title: '可用', field: 'status', align: 'center', valign: 'middle', width: '60px', formatter: function(item, index){
-            if(item.status === 0){
-                return '<i class="fa fa-toggle-off"></i>';
-            }
-            if(item.status === 1){
-                return '<i class="fa fa-toggle-on"></i>';
-            }
-        }},
-        {title: '备注', field: 'remark', align: 'left', valign: 'middle'}
-    ]
-    return columns;
-};
+})

src/main/resources/static/js/base/menu/list.js

@@ -9,28 +9,60 @@ $(function () {
 
 function initialPage() {
 	$(window).resize(function() {
-		TreeGrid.table.resetHeight({height: $(window).height()-100});
+        $('#dataGrid').bootstrapTable('resetView', {
+            height : $(window).height() - 56
+        });
 	});
 }
 
 function getGrid() {
-	var colunms = TreeGrid.initColumn();
-    var table = new TreeTable(TreeGrid.id, '../../sys/menu/list?_' + $.now(), colunms);
-    table.setExpandColumn(2);
-    table.setIdField("menuId");
-    table.setCodeField("menuId");
-    table.setParentCodeField("parentId");
-    table.setExpandAll(false);
-    table.setHeight($(window).height()-100);
-    table.init();
-    TreeGrid.table = table;
+    $('#dataGrid').bootstrapTreeTableEx({
+        url: '../../sys/menu/list?_' + $.now(),
+        height: $(window).height() - 56,
+        idField: 'menuId',
+        treeShowField: 'name',
+        parentIdField: 'parentId',
+        columns: [
+            {checkbox: true},
+            {title: '编号', field: 'menuId', visible: false, width: '50px'},
+            {title: '名称', field: 'name', width: '180px'},
+            {title: '上级菜单', field: 'parentName', width: '100px'},
+            {
+                title: '图标',
+                field: 'icon',
+                width: '50px',
+                formatter: function (value, row, index) {
+                    return row.icon == null ? '' : '<i class="' + row.icon + ' fa-lg"></i>';
+                }
+            },
+            {
+                title: '类型',
+                field: 'type',
+                width: '60px',
+                formatter: function (value, row, index) {
+                    if (row.type === 0) {
+                        return '<span class="label label-primary">目录</span>';
+                    }
+                    if (row.type === 1) {
+                        return '<span class="label label-success">菜单</span>';
+                    }
+                    if (row.type === 2) {
+                        return '<span class="label label-warning">按钮</span>';
+                    }
+                }
+            },
+            {title: '排序', field: 'orderNum', width: '50px'},
+            {title: '菜单URL', field: 'url', width: '200px'},
+            {title: '授权标识', field: 'perms'}
+        ]
+    });
 }
 
 var vm = new Vue({
 	el:'#dpLTE',
 	methods : {
 		load: function() {
-			TreeGrid.table.refresh();
+            $('#dataGrid').bootstrapTable('refresh');
 		},
 		save: function() {
 			dialogOpen({
@@ -45,7 +77,7 @@ var vm = new Vue({
 			});
 		},
 		edit: function() {
-			var ck = TreeGrid.table.getSelectedRow();
+			var ck = $('#dataGrid').bootstrapTable('getSelections');
 			if(checkedRow(ck)){
 				dialogOpen({
 					title: '编辑菜单',
@@ -54,7 +86,7 @@ var vm = new Vue({
 					height: '420px',
 					scroll : true,
 					success: function(iframeId){
-						top.frames[iframeId].vm.menu.menuId = ck[0].id;
+						top.frames[iframeId].vm.menu.menuId = ck[0].menuId;
 						top.frames[iframeId].vm.setForm();
 					},
 					yes : function(iframeId) {
@@ -64,10 +96,10 @@ var vm = new Vue({
 			}
 		},
 		remove: function() {
-			var ck = TreeGrid.table.getSelectedRow(), ids = [];
+			var ck = $('#dataGrid').bootstrapTable('getSelections'), ids = [];
 			if(checkedArray(ck)){
 				$.each(ck, function(idx, item){
-					ids[idx] = item.id;
+					ids[idx] = item.menuId;
 				});
 				$.RemoveForm({
 					url: '../../sys/menu/remove?_' + $.now(),
@@ -80,38 +112,3 @@ var vm = new Vue({
 		}
 	}
 })
-
-var TreeGrid = {
-    id: "dataGrid",
-    table: null,
-    layerIndex: -1
-};
-
-/**
- * 初始化表格的列
- */
-TreeGrid.initColumn = function () {
-    var columns = [
-        {field: 'selectItem', radio: true},
-        {title: '编号', field: 'menuId', visible: false, align: 'center', valign: 'middle', width: '50px'},
-        {title: '名称', field: 'name', align: 'center', valign: 'middle', width: '180px'},
-        {title: '上级菜单', field: 'parentName', align: 'center', valign: 'middle', width: '100px'},
-        {title: '图标', field: 'icon', align: 'center', valign: 'middle', width: '50px', formatter: function(item, index){
-            return item.icon == null ? '' : '<i class="'+item.icon+' fa-lg"></i>';
-        }},
-        {title: '类型', field: 'type', align: 'center', valign: 'middle', width: '60px', formatter: function(item, index){
-            if(item.type === 0){
-                return '<span class="label label-primary">目录</span>';
-            }
-            if(item.type === 1){
-                return '<span class="label label-success">菜单</span>';
-            }
-            if(item.type === 2){
-                return '<span class="label label-warning">按钮</span>';
-            }
-        }},
-        {title: '排序', field: 'orderNum', align: 'center', valign: 'middle', width: '50px'},
-        {title: '菜单URL', field: 'url', align: 'center', valign: 'middle', width: '200px'},
-        {title: '授权标识', field: 'perms', align: 'center', valign: 'middle'}]
-    return columns;
-};

src/main/resources/static/js/base/org/list.js

@@ -9,50 +9,65 @@ $(function () {
 
 function initialPage() {
 	$(window).resize(function() {
-		TreeGrid.table.resetHeight({height: $(window).height()-100});
+        $('#dataGrid').bootstrapTable('resetView', {
+            height : $(window).height() - 56
+        });
 	});
 }
 
 function getGrid() {
-	var colunms = TreeGrid.initColumn();
-    var table = new TreeTable(TreeGrid.id, '../../sys/org/list?_' + $.now(), colunms);
-    table.setExpandColumn(2);
-    table.setIdField("orgId");
-    table.setCodeField("orgId");
-    table.setParentCodeField("parentId");
-    table.setExpandAll(false);
-    table.setHeight($(window).height()-100);
-    table.init();
-    TreeGrid.table = table;
+    $('#dataGrid').bootstrapTreeTableEx({
+        url: '../../sys/org/list?_' + $.now(),
+        height: $(window).height() - 56,
+        idField: 'orgId',
+        treeShowField: 'name',
+        parentIdField: 'parentId',
+        columns: [
+            {field: 'selectItem', radio: true},
+            {title: '编号', field: 'orgId', visible: false, width: '80px'},
+            {title: '名称', field: 'name'},
+            {title: '机构编码', field: 'code', width: '200px'},
+            {title: '上级机构', field: 'parentName', width: '300px'},
+            {title: '可用', field: 'status', width: '60px', formatter: function(value, row, index){
+                    if(row.status === 0){
+                        return '<i class="fa fa-toggle-off"></i>';
+                    }
+                    if(row.status === 1){
+                        return '<i class="fa fa-toggle-on"></i>';
+                    }
+                }},
+            {title: '排序', field: 'orderNum', width: '80px'}
+        ]
+    });
 }
 
 var vm = new Vue({
 	el:'#dpLTE',
 	methods : {
 		load: function() {
-			TreeGrid.table.refresh();
+            $('#dataGrid').bootstrapTable('refresh');
 		},
 		save: function() {
 			dialogOpen({
 				title: '新增机构',
 				url: 'base/org/add.html?_' + $.now(),
 				width: '500px',
-				height: '315px',
+				height: '320px',
 				yes : function(iframeId) {
 					top.frames[iframeId].vm.acceptClick();
 				},
 			});
 		},
 		edit: function() {
-			var ck = TreeGrid.table.getSelectedRow();
+			var ck = $('#dataGrid').bootstrapTable('getSelections');
 			if(checkedRow(ck)){
 				dialogOpen({
 					title: '编辑机构',
 					url: 'base/org/edit.html?_' + $.now(),
 					width: '500px',
-					height: '315px',
+					height: '320px',
 					success: function(iframeId){
-						top.frames[iframeId].vm.org.orgId = ck[0].id;
+						top.frames[iframeId].vm.org.orgId = ck[0].orgId;
 						top.frames[iframeId].vm.setForm();
 					},
 					yes : function(iframeId) {
@@ -62,10 +77,10 @@ var vm = new Vue({
 			}
 		},
 		remove: function() {
-			var ck = TreeGrid.table.getSelectedRow(), ids = [];
+			var ck = $('#dataGrid').bootstrapTable('getSelections'), ids = [];
 			if(checkedArray(ck)){
 				$.each(ck, function(idx, item){
-					ids[idx] = item.id;
+					ids[idx] = item.orgId;
 				});
 				$.RemoveForm({
 					url: '../../sys/org/remove?_' + $.now(),
@@ -78,31 +93,3 @@ var vm = new Vue({
 		}
 	}
 })
-
-var TreeGrid = {
-    id: "dataGrid",
-    table: null,
-    layerIndex: -1
-};
-
-/**
- * 初始化表格的列
- */
-TreeGrid.initColumn = function () {
-    var columns = [
-        {field: 'selectItem', radio: true},
-        {title: '编号', field: 'orgId', visible: false, align: 'center', valign: 'middle', width: '80px'},
-        {title: '名称', field: 'name', align: 'center', valign: 'middle'},
-        {title: '机构编码', field: 'code', align: 'center', valign: 'middle', width: '200px'},
-        {title: '上级机构', field: 'parentName', align: 'center', valign: 'middle', width: '300px'},
-        {title: '可用', field: 'status', align: 'center', valign: 'middle', width: '60px', formatter: function(item, index){
-        	if(item.status === 0){
-                return '<i class="fa fa-toggle-off"></i>';
-            }
-            if(item.status === 1){
-                return '<i class="fa fa-toggle-on"></i>';
-            }
-        }},
-        {title: '排序', field: 'orderNum', align: 'center', valign: 'middle', width: '80px'}]
-    return columns;
-};

src/main/resources/static/js/base/quartz/list.js

@@ -81,7 +81,7 @@ var vm = new Vue({
 				title : '新增任务',
 				url : 'base/quartz/add.html?_' + $.now(),
 				width : '450px',
-				height : '380px',
+				height : '392px',
 				scroll : true,
 				yes : function(iframeId) {
 					top.frames[iframeId].vm.acceptClick();
@@ -95,7 +95,7 @@ var vm = new Vue({
 					title : '编辑任务',
 					url : 'base/quartz/edit.html?_' + $.now(),
 					width : '450px',
-					height : '380px',
+					height : '392px',
 					scroll : true,
 					success : function(iframeId) {
 						top.frames[iframeId].vm.job.jobId = ck[0].jobId;

src/main/resources/static/js/base/test/add.js

@@ -1,25 +0,0 @@
-/**
- * 新增-代码生成测试js
- */
-var vm = new Vue({
-	el:'#dpLTE',
-	data: {
-		test: {
-			rowId: 0
-		}
-	},
-	methods : {
-		acceptClick: function() {
-			if (!$('#form').Validform()) {
-		        return false;
-		    }
-		    $.SaveForm({
-		    	url: '../../sys/test/save?_' + $.now(),
-		    	param: vm.test,
-		    	success: function(data) {
-		    		$.currentIframe().vm.load();
-		    	}
-		    });
-		}
-	}
-})

src/main/resources/static/js/base/test/edit.js

@@ -1,34 +0,0 @@
-/**
- * 编辑-代码生成测试js
- */
-var vm = new Vue({
-	el:'#dpLTE',
-	data: {
-		test: {
-			rowId: 0
-		}
-	},
-	methods : {
-		setForm: function() {
-			$.SetForm({
-				url: '../../sys/test/info?_' + $.now(),
-		    	param: vm.test.rowId,
-		    	success: function(data) {
-		    		vm.test = data;
-		    	}
-			});
-		},
-		acceptClick: function() {
-			if (!$('#form').Validform()) {
-		        return false;
-		    }
-		    $.ConfirmForm({
-		    	url: '../../sys/test/update?_' + $.now(),
-		    	param: vm.test,
-		    	success: function(data) {
-		    		$.currentIframe().vm.load();
-		    	}
-		    });
-		}
-	}
-})

src/main/resources/static/js/base/test/list.js

@@ -1,88 +0,0 @@
-/**
- * 代码生成测试js
- */
-
-$(function () {
-	initialPage();
-	getGrid();
-});
-
-function initialPage() {
-	$(window).resize(function() {
-		$('#dataGrid').bootstrapTable('resetView', {height: $(window).height()-54});
-	});
-}
-
-function getGrid() {
-	$('#dataGrid').bootstrapTableEx({
-		url: '../../sys/test/list?_' + $.now(),
-		height: $(window).height()-54,
-		queryParams: function(params){
-			params.name = vm.keyword;
-			return params;
-		},
-		columns: [
-			{checkbox: true},
-			{field : "name", title : "名称", width : "100px"}, 
-			{field : "code", title : "编码", width : "100px"}, 
-			{field : "gmtCreate", title : "创建时间", width : "100px"}, 
-			{field : "gmtModified", title : "修改时间", width : "100px"}
-		]
-	})
-}
-
-var vm = new Vue({
-	el:'#dpLTE',
-	data: {
-		keyword: null
-	},
-	methods : {
-		load: function() {
-			$('#dataGrid').bootstrapTable('refresh');
-		},
-		save: function() {
-			dialogOpen({
-				title: '新增代码生成测试',
-				url: 'base/test/add.html?_' + $.now(),
-				width: '420px',
-				height: '350px',
-				yes : function(iframeId) {
-					top.frames[iframeId].vm.acceptClick();
-				},
-			});
-		},
-		edit: function() {
-			var ck = $('#dataGrid').bootstrapTable('getSelections');
-			if(checkedRow(ck)){
-				dialogOpen({
-					title: '编辑代码生成测试',
-					url: 'base/test/edit.html?_' + $.now(),
-					width: '420px',
-					height: '350px',
-					success: function(iframeId){
-						top.frames[iframeId].vm.test.rowId = ck[0].rowId;
-						top.frames[iframeId].vm.setForm();
-					},
-					yes: function(iframeId){
-						top.frames[iframeId].vm.acceptClick();
-					}
-				});
-			}
-		},
-		remove: function() {
-			var ck = $('#dataGrid').bootstrapTable('getSelections'), ids = [];	
-			if(checkedArray(ck)){
-				$.each(ck, function(idx, item){
-					ids[idx] = item.rowId;
-				});
-				$.RemoveForm({
-					url: '../../sys/test/remove?_' + $.now(),
-			    	param: ids,
-			    	success: function(data) {
-			    		vm.load();
-			    	}
-				});
-			}
-		}
-	}
-})

src/main/resources/static/js/base/user/list.js

@@ -81,7 +81,7 @@ var vm = new Vue({
 				title : '新增用户',
 				url : 'base/user/add.html?_' + $.now(),
                 width : '620px',
-                height : '510px',
+                height : '524px',
 				scroll : true,
 				yes : function(iframeId) {
 					top.frames[iframeId].vm.acceptClick();
@@ -95,7 +95,7 @@ var vm = new Vue({
 					title : '编辑用户',
 					url : 'base/user/edit.html?_' + $.now(),
                     width : '620px',
-                    height : '510px',
+                    height : '524px',
 					scroll : true,
 					success : function(iframeId) {
 						top.frames[iframeId].vm.user.userId = ck[0].userId;

src/main/resources/static/js/common.js

@@ -70,6 +70,30 @@ $.fn.bootstrapTableEx = function(opt){
 	$(this).bootstrapTable(option);
 }
 
+$.fn.bootstrapTreeTableEx = function(opt) {
+    var $table = $(this);
+    var defaults = {
+        url: '',
+        striped: true,
+        sidePagination: 'server',
+        clickToSelect: true,
+        idField: '',
+        columns: [],
+        treeShowField: '',
+        parentIdField: '',
+        onLoadSuccess: function(data) {
+            $table.treegrid({
+                treeColumn: 1,
+                onChange: function() {
+                    $table.bootstrapTable('resetWidth');
+                }
+            });
+        }
+    }
+    var option = $.extend({}, defaults, opt);
+    $(this).bootstrapTable(option);
+}
+
 formatDate = function (v, format) {
     if (!v) return "";
     var d = v;
@@ -106,7 +130,11 @@ function today() {
 
 function countDay(dayCount) {
     var dd = new Date();
-    dd.setDate(dd.getDate()+dayCount);//获取AddDayCount天后的日期
+    if (dayCount < 0) {
+        dd.setDate(dd.getDate()+dayCount+1);//获取AddDayCount天前的日期
+    } else {
+        dd.setDate(dd.getDate()+dayCount-1);//获取AddDayCount天后的日期
+    }
     var y = dd.getFullYear();
     var m = (dd.getMonth()+1)<10?"0"+(dd.getMonth()+1):(dd.getMonth()+1);//获取当前月份的日期，不足10补0
     var d = dd.getDate()<10?"0"+dd.getDate():dd.getDate();//获取当前几号，不足10补0

src/main/resources/static/plugins/bootstrap-table/bootstrap-treegrid.js

@@ -1,497 +0,0 @@
-(function ($) {
-    'use strict';
-
-    var sprintf = function (str) {
-        var args = arguments,
-            flag = true,
-            i = 1;
-
-        str = str.replace(/%s/g, function () {
-            var arg = args[i++];
-
-            if (typeof arg === 'undefined') {
-                flag = false;
-                return '';
-            }
-            return arg;
-        });
-        return flag ? str : '';
-    };
-
-    var getFieldIndex = function (columns, field) {
-        var index = -1;
-
-        $.each(columns, function (i, column) {
-            if (column.field === field) {
-                index = i;
-                return false;
-            }
-            return true;
-        });
-        return index;
-    };
-
-    var calculateObjectValue = function (self, name, args, defaultValue) {
-        var func = name;
-
-        if (typeof name === 'string') {
-            var names = name.split('.');
-
-            if (names.length > 1) {
-                func = window;
-                $.each(names, function (i, f) {
-                    func = func[f];
-                });
-            } else {
-                func = window[name];
-            }
-        }
-        if (typeof func === 'object') {
-            return func;
-        }
-        if (typeof func === 'function') {
-            return func.apply(self, args);
-        }
-        if (!func && typeof name === 'string' && sprintf.apply(this, [name].concat(args))) {
-            return sprintf.apply(this, [name].concat(args));
-        }
-        return defaultValue;
-    };
-
-    var getItemField = function (item, field) {
-        var value = item;
-
-        if (typeof field !== 'string' || item.hasOwnProperty(field)) {
-            return item[field];
-        }
-        var props = field.split('.');
-        for (var p in props) {
-            value = value[props[p]];
-        }
-        return value;
-    };
-
-    var getParent = function (node, source, field) {
-        var data = [];
-        var items = $.grep(source, function (item, index) {
-            return node.parentId == item[field];
-        });
-        $.each(items, function (index, item) {
-            data.splice(0, 0, item);
-            var child = getParent(item, source, field);
-            $.each(child, function (i, n) {
-                data.splice(0, 0, n);
-            });
-        });
-        return data;
-    };
-
-    var getChild = function (node, source, field) {
-        var data = [];
-        var items = $.grep(source, function (item, index) {
-            return item.parentId == node[field];
-        });
-
-        $.each(items, function (index, item) {
-            data.push(item);
-            var child = getChild(item, source, field);
-            $.each(child, function (i, n) {
-                data.push(n);
-            });
-        });
-        return data;
-    };
-
-    //调用bootstrapTable组件的构造器得到对象
-    var BootstrapTable = $.fn.bootstrapTable.Constructor,
-        _initData = BootstrapTable.prototype.initData,
-        _initPagination = BootstrapTable.prototype.initPagination,
-        _initBody = BootstrapTable.prototype.initBody;
-
-    //重写bootstrapTable的initData方法
-    BootstrapTable.prototype.initData = function () {
-        _initData.apply(this, Array.prototype.slice.apply(arguments));
-        var that = this;
-        if (that.options.treeView && this.data.length > 0) {
-            var rows = [];
-            var roots = $.grep(this.data, function (row, index) {
-                return row.Level == that.options.treeRootLevel;
-            });
-            $.each(roots, function (index, item) {
-                rows.push(item);
-                var child = getChild(item, that.data, that.options.treeId);
-                $.each(child, function (i, n) {
-                    if (that.options.treeCollapseAll) {
-                        n.hidden = true;
-                    }
-                    rows.push(n);
-                });
-            });
-            that.options.data = that.data = rows;
-        }
-    };
-
-    //重写bootstrapTable的initPagination方法
-    BootstrapTable.prototype.initPagination = function () {
-        //理论情况下，treegrid是不支持分页的，所以默认分页参数为false
-        this.options.pagination = false;
-         //调用“父类”的“虚方法”
-        _initPagination.apply(this, Array.prototype.slice.apply(arguments));
-    };
-
-    //重写bootstrapTable的initBody方法
-    BootstrapTable.prototype.initBody = function (fixedScroll) {
-        var that = this,
-            html = [],
-            data = this.getData();
-        this.trigger('pre-body', data);
-
-        this.$body = this.$el.find('tbody');
-        if (!this.$body.length) {
-            this.$body = $('<tbody></tbody>').appendTo(this.$el);
-        }
-
-        if (!this.options.pagination || this.options.sidePagination === 'server') {
-            this.pageFrom = 1;
-            this.pageTo = data.length;
-        }
-
-        for (var i = this.pageFrom - 1; i < this.pageTo; i++) {
-            var key,
-                item = data[i],
-                style = {},
-                csses = [],
-                data_ = '',
-                attributes = {},
-                htmlAttributes = [];
-            if (item.hidden) continue;
-
-            style = calculateObjectValue(this.options, this.options.rowStyle, [item, i], style);
-
-            if (style && style.css) {
-                for (key in style.css) {
-                    csses.push(key + ': ' + style.css[key]);
-                }
-            }
-
-            attributes = calculateObjectValue(this.options,
-                this.options.rowAttributes, [item, i], attributes);
-
-            if (attributes) {
-                for (key in attributes) {
-                    htmlAttributes.push(sprintf('%s="%s"', key, escapeHTML(attributes[key])));
-                }
-            }
-
-            if (item._data && !$.isEmptyObject(item._data)) {
-                $.each(item._data, function (k, v) {
-                    if (k === 'index') {
-                        return;
-                    }
-                    data_ += sprintf(' data-%s="%s"', k, v);
-                });
-            }
-
-            html.push('<tr',
-                sprintf(' %s', htmlAttributes.join(' ')),
-                sprintf(' id="%s"', $.isArray(item) ? undefined : item._id),
-                sprintf(' class="%s"', style.classes || ($.isArray(item) ? undefined : item._class)),
-                sprintf(' data-index="%s"', i),
-                sprintf(' data-uniqueid="%s"', item[this.options.uniqueId]),
-                sprintf('%s', data_),
-                '>'
-            );
-
-            if (this.options.cardView) {
-                html.push(sprintf('<td colspan="%s">', this.header.fields.length));
-            }
-
-            if (!this.options.cardView && this.options.detailView) {
-                html.push('<td>',
-                    '<a class="detail-icon" href="javascript:">',
-                    sprintf('<i class="%s %s"></i>', this.options.iconsPrefix, this.options.icons.detailOpen),
-                    '</a>',
-                    '</td>');
-            }
-
-            $.each(this.header.fields, function (j, field) {
-                var text = '',
-                    value = getItemField(item, field),
-                    type = '',
-                    cellStyle = {},
-                    id_ = '',
-                    class_ = that.header.classes[j],
-                    data_ = '',
-                    rowspan_ = '',
-                    title_ = '',
-                    column = that.columns[getFieldIndex(that.columns, field)];
-
-                if (!column.visible) {
-                    return;
-                }
-
-                style = sprintf('style="%s"', csses.concat(that.header.styles[j]).join('; '));
-
-                value = calculateObjectValue(column,
-                    that.header.formatters[j], [value, item, i], value);
-
-                if (item['_' + field + '_id']) {
-                    id_ = sprintf(' id="%s"', item['_' + field + '_id']);
-                }
-                if (item['_' + field + '_class']) {
-                    class_ = sprintf(' class="%s"', item['_' + field + '_class']);
-                }
-                if (item['_' + field + '_rowspan']) {
-                    rowspan_ = sprintf(' rowspan="%s"', item['_' + field + '_rowspan']);
-                }
-                if (item['_' + field + '_title']) {
-                    title_ = sprintf(' title="%s"', item['_' + field + '_title']);
-                }
-                cellStyle = calculateObjectValue(that.header,
-                    that.header.cellStyles[j], [value, item, i], cellStyle);
-                if (cellStyle.classes) {
-                    class_ = sprintf(' class="%s"', cellStyle.classes);
-                }
-                if (cellStyle.css) {
-                    var csses_ = [];
-                    for (var key in cellStyle.css) {
-                        csses_.push(key + ': ' + cellStyle.css[key]);
-                    }
-                    style = sprintf('style="%s"', csses_.concat(that.header.styles[j]).join('; '));
-                }
-
-                if (item['_' + field + '_data'] && !$.isEmptyObject(item['_' + field + '_data'])) {
-                    $.each(item['_' + field + '_data'], function (k, v) {
-                        if (k === 'index') {
-                            return;
-                        }
-                        data_ += sprintf(' data-%s="%s"', k, v);
-                    });
-                }
-
-                if (column.checkbox || column.radio) {
-                    type = column.checkbox ? 'checkbox' : type;
-                    type = column.radio ? 'radio' : type;
-
-                    text = [that.options.cardView ?
-                        '<div class="card-view">' : '<td class="bs-checkbox">',
-                        '<input' +
-                        sprintf(' data-index="%s"', i) +
-                        sprintf(' name="%s"', that.options.selectItemName) +
-                        sprintf(' type="%s"', type) +
-                        sprintf(' value="%s"', item[that.options.idField]) +
-                        sprintf(' checked="%s"', value === true ||
-                        (value && value.checked) ? 'checked' : undefined) +
-                        sprintf(' disabled="%s"', !column.checkboxEnabled ||
-                        (value && value.disabled) ? 'disabled' : undefined) +
-                        ' />',
-                        that.header.formatters[j] && typeof value === 'string' ? value : '',
-                        that.options.cardView ? '</div>' : '</td>'
-                    ].join('');
-
-                    item[that.header.stateField] = value === true || (value && value.checked);
-                } else {
-                    
-                    value = typeof value === 'undefined' || value === null ?
-                        that.options.undefinedText : value;
-                    var indent, icon;
-                    if (that.options.treeView && column.field == that.options.treeField) {
-                        var indent = item.Level == that.options.Level ? '' : sprintf('<span style="margin-left: %spx;"></span>', (item.Level - that.options.treeRootLevel) * 15);
-                        var child = $.grep(data, function (d, i) {
-                            return d.parentId == item[that.options.treeId] && !d.hidden;
-                        });
-                        icon = sprintf('<span class="tree-icon %s" style="cursor: pointer; margin: 0px 5px;"></span>', child.length > 0 ? that.options.expandIcon : that.options.collapseIcon);
-                        //icon = sprintf('<span class="tree-icon %s" style="cursor: pointer; margin: 0px 5px;"></span>', child.length > 0 ? that.options.expandIcon : "");
-                    }
-                    text = that.options.cardView ? ['<div class="card-view">',
-                        that.options.showHeader ? sprintf('<span class="title" %s>%s</span>', style,
-                            getPropertyFromOther(that.columns, 'field', 'title', field)) : '',
-                        sprintf('<span class="value">%s</span>', value),
-                        '</div>'
-                    ].join('') : [sprintf('<td%s %s %s %s %s %s>', id_, class_, style, data_, rowspan_, title_),
-                        indent,
-                        icon,
-                        value,
-                        '</td>'
-                    ].join('');
-
-                    if (that.options.cardView && that.options.smartDisplay && value === '') {
-                        text = '';
-                    }
-                }
-
-                html.push(text);
-            });
-
-            if (this.options.cardView) {
-                html.push('</td>');
-            }
-
-            html.push('</tr>');
-        }
-
-        if (!html.length) {
-            html.push('<tr class="no-records-found">',
-                sprintf('<td colspan="%s">%s</td>',
-                    this.$header.find('th').length, this.options.formatNoMatches()),
-                '</tr>');
-        }
-
-        this.$body.html(html.join(''));
-
-        if (!fixedScroll) {
-            this.scrollTo(0);
-        }
-
-        this.$body.find('> tr[data-index] > td').off('click dblclick').on('click dblclick', function (e) {
-            var $td = $(this),
-                $tr = $td.parent(),
-                item = that.data[$tr.data('index')],
-                index = $td[0].cellIndex,
-                field = that.header.fields[that.options.detailView && !that.options.cardView ? index - 1 : index],
-                column = that.columns[getFieldIndex(that.columns, field)],
-                value = getItemField(item, field);
-
-            if ($td.find('.detail-icon').length) {
-                return;
-            }
-
-            that.trigger(e.type === 'click' ? 'click-cell' : 'dbl-click-cell', field, value, item, $td);
-            that.trigger(e.type === 'click' ? 'click-row' : 'dbl-click-row', item, $tr);
-
-            if (e.type === 'click' && that.options.clickToSelect && column.clickToSelect) {
-                var $selectItem = $tr.find(sprintf('[name="%s"]', that.options.selectItemName));
-                if ($selectItem.length) {
-                    $selectItem[0].click();
-                }
-            }
-        });
-
-        this.$body.find('> tr[data-index] > td > .detail-icon').off('click').on('click', function () {
-            debugger;
-            var $this = $(this),
-                $tr = $this.parent().parent(),
-                index = $tr.data('index'),
-                row = data[index]; 
-
-            if ($tr.next().is('tr.detail-view')) {
-                $this.find('i').attr('class', sprintf('%s %s', that.options.iconsPrefix, that.options.icons.detailOpen));
-                $tr.next().remove();
-                that.trigger('collapse-row', index, row);
-            } else {
-                $this.find('i').attr('class', sprintf('%s %s', that.options.iconsPrefix, that.options.icons.detailClose));
-                $tr.after(sprintf('<tr class="detail-view"><td colspan="%s">%s</td></tr>',
-                    $tr.find('td').length, calculateObjectValue(that.options,
-                        that.options.detailFormatter, [index, row], '')));
-                that.trigger('expand-row', index, row, $tr.next().find('td'));
-            }
-            that.resetView();
-        });
-
-        this.$body.find('> tr[data-index] > td > .tree-icon').off('click').on('click', function (e) {
-            debugger;
-            e.stopPropagation();
-            var $this = $(this),
-                $tr = $this.parent().parent(),
-                index = $tr.data('index'),
-                row = data[index];
-            var icon = $(this);
-            var child = getChild(data[index], data, that.options.treeId);
-            $.each(child, function (i, c) {
-                $.each(that.data, function (index, item) {
-                    if (item[that.options.treeId] == c[that.options.treeId]) {
-                        item.hidden = icon.hasClass(that.options.expandIcon);
-                        that.uncheck(index);
-                        return;
-                    }
-                });
-            });
-            if (icon.hasClass(that.options.expandIcon)) {
-                icon.removeClass(that.options.expandIcon).addClass(that.options.collapseIcon);
-            } else {
-                icon.removeClass(that.options.collapseIcon).addClass(that.options.expandIcon);
-            }
-            that.options.data = that.data;
-            that.initBody(true);
-        });
-
-        this.$selectItem = this.$body.find(sprintf('[name="%s"]', this.options.selectItemName));
-        this.$selectItem.off('click').on('click', function (event) {
-            event.stopImmediatePropagation();
-
-            var $this = $(this),
-                checked = $this.prop('checked'),
-                row = that.data[$this.data('index')];
-
-            if (that.options.maintainSelected && $(this).is(':radio')) {
-                $.each(that.options.data, function (i, row) {
-                    row[that.header.stateField] = false;
-                });
-            }
-
-            row[that.header.stateField] = checked;
-
-            if (that.options.singleSelect) {
-                that.$selectItem.not(this).each(function () {
-                    that.data[$(this).data('index')][that.header.stateField] = false;
-                });
-                that.$selectItem.filter(':checked').not(this).prop('checked', false);
-            }
-
-            that.updateSelected();
-            that.trigger(checked ? 'check' : 'uncheck', row, $this);
-        });
-
-        $.each(this.header.events, function (i, events) {
-            if (!events) {
-                return;
-            }
-            if (typeof events === 'string') {
-                events = calculateObjectValue(null, events);
-            }
-
-            var field = that.header.fields[i],
-                fieldIndex = $.inArray(field, that.getVisibleFields());
-
-            if (that.options.detailView && !that.options.cardView) {
-                fieldIndex += 1;
-            }
-
-            for (var key in events) {
-                that.$body.find('tr').each(function () {
-                    var $tr = $(this),
-                        $td = $tr.find(that.options.cardView ? '.card-view' : 'td').eq(fieldIndex),
-                        index = key.indexOf(' '),
-                        name = key.substring(0, index),
-                        el = key.substring(index + 1),
-                        func = events[key];
-
-                    $td.find(el).off(name).on(name, function (e) {
-                        var index = $tr.data('index'),
-                            row = that.data[index],
-                            value = row[field];
-
-                        func.apply(this, [e, value, row, index]);
-                    });
-                });
-            }
-        });
-
-        this.updateSelected();
-        this.resetView();
-
-        this.trigger('post-body');
-    };
-
-
-    //给组件增加默认参数列表
-    $.extend($.fn.bootstrapTable.defaults, {
-        treeView: false,//treeView视图
-        treeField: "id",//treeView视图字段
-        treeId: "id",
-        treeRootLevel: 0,//根节点序号
-        treeCollapseAll: false,//是否全部展开
-        collapseIcon: "glyphicon glyphicon-chevron-right",//折叠样式
-        expandIcon: "glyphicon glyphicon-chevron-down"//展开样式
-    });
-})(jQuery);

src/main/resources/static/plugins/bootstrap-table/treegrid/bootstrap-table-treegrid.js

@@ -0,0 +1,109 @@
+/**
+ * @author: YL
+ * @version: v1.0.0
+ */
+!function ($) {
+    'use strict';
+    $.extend($.fn.bootstrapTable.defaults, {
+        treeShowField: null,
+        idField: 'id',
+        parentIdField: 'pid',
+        onGetNodes: function (row, data) {
+            var that = this;
+            var nodes = [];
+            $.each(data, function (i, item) {
+                if (row[that.options.idField] === item[that.options.parentIdField]) {
+                    nodes.push(item);
+                }
+            });
+            return nodes;
+        },
+        onCheckRoot: function (row, data) {
+            var that = this;
+            return !row[that.options.parentIdField];
+        }
+    });
+
+    var BootstrapTable = $.fn.bootstrapTable.Constructor,
+        _init = BootstrapTable.prototype.init,
+        _initRow = BootstrapTable.prototype.initRow,
+        _initHeader = BootstrapTable.prototype.initHeader,
+        _rowStyle = null;
+
+    BootstrapTable.prototype.init = function () {
+        _rowStyle = this.options.rowStyle;
+        _init.apply(this, Array.prototype.slice.apply(arguments));
+    };
+
+    // td
+    BootstrapTable.prototype.initHeader = function () {
+        var that = this;
+        _initHeader.apply(that, Array.prototype.slice.apply(arguments));
+        var treeShowField = that.options.treeShowField;
+        if (treeShowField) {
+            $.each(this.header.fields, function (i, field) {
+                if (treeShowField === field) {
+                    that.treeEnable = true;
+                    return false;
+                }
+            });
+        }
+    };
+
+    var initTr = function (item, idx, data, parentDom) {
+        var that = this;
+        var nodes = that.options.onGetNodes.apply(that, [item, data]);
+        item._nodes = nodes;
+        parentDom.append(_initRow.apply(that, [item, idx, data, parentDom]));
+
+        // init sub node
+        var len = nodes.length - 1;
+        for (var i = 0; i <= len; i++) {
+            var node = nodes[i];
+            node._level = item._level + 1;
+            node._parent = item;
+            if (i === len)
+                node._last = 1;
+            // jquery.treegrid.js
+            that.options.rowStyle = function (item, idx) {
+                var res = _rowStyle.apply(that, Array.prototype.slice.apply(arguments));
+                var id = item[that.options.idField] ? item[that.options.idField] : 0;
+                var pid = item[that.options.parentIdField] ? item[that.options.parentIdField] : 0;
+                res.classes = [
+                    res.classes || '',
+                    'treegrid-' + id,
+                    'treegrid-parent-' + pid
+                ].join(' ');
+                return res;
+            };
+            initTr.apply(that, [node, $.inArray(node, data), data, parentDom]);
+        }
+    };
+
+    // tr
+    BootstrapTable.prototype.initRow = function (item, idx, data, parentDom) {
+        var that = this;
+        if (that.treeEnable) {
+            // init root node
+            if (that.options.onCheckRoot.apply(that, [item, data])) {
+                if (item._level === undefined) {
+                    item._level = 0;
+                }
+                // jquery.treegrid.js
+                that.options.rowStyle = function (item, idx) {
+                    var res = _rowStyle.apply(that, Array.prototype.slice.apply(arguments));
+                    var x = item[that.options.idField] ? item[that.options.idField] : 0;
+                    res.classes = [
+                        res.classes || '',
+                        'treegrid-' + x
+                    ].join(' ');
+                    return res;
+                };
+                initTr.apply(that, [item, idx, data, parentDom]);
+                return true;
+            }
+            return false;
+        }
+        return _initRow.apply(that, Array.prototype.slice.apply(arguments));
+    };
+}(jQuery);

src/main/resources/static/plugins/bootstrap-table/treegrid/jquery-treegird.min.css

@@ -0,0 +1 @@
+.treegrid-indent{width:16px;height:16px;display:inline-block;position:relative}.treegrid-expander{width:16px;height:16px;display:inline-block;position:relative;cursor:pointer}.treegrid-expander-expanded{background-image:url(collapse.png)}.treegrid-expander-collapsed{background-image:url(expand.png)}

src/main/resources/static/plugins/treegrid/jquery.treegrid.bootstrap3.js

@@ -1,4 +0,0 @@
-$.extend($.fn.treegrid.defaults, {
-    expanderExpandedClass: 'glyphicon glyphicon-chevron-down',
-    expanderCollapsedClass: 'glyphicon glyphicon-chevron-right'
-});

src/main/resources/static/plugins/treegrid/jquery.treegrid.css

@@ -1,17 +0,0 @@
-.treegrid-indent {width:16px; height: 16px; display: inline-block; position: relative;}
-
-.treegrid-expander {width:16px; height: 16px; display: inline-block; position: relative; cursor: pointer;}
-
-.treegrid-expander-expanded{background-image: url(img/collapse.png); }
-.treegrid-expander-collapsed{background-image: url(img/expand.png);}
-.treegrid-selected{background: #f5f5f5 !important;}
-.treegrid-table{border:0 !important;margin-bottom:0}
-.treegrid-table tbody {display:block;height:auto;overflow-y:auto;}
-.treegrid-table thead, .treegrid-table tbody tr {display:table;width:100%;table-layout:fixed;}
-.treegrid-thead th{line-height:40px;border: 0 !important;background:#fff !important;border-radius: 4px;border-left:1px solid #e7eaec !important;border-bottom:2px solid #e7eaec !important;text-align: center;}
-.treegrid-thead tr :first-child{border-left:0 !important}
-.treegrid-tbody td{border: 0 !important;border-left:1px solid #e7eaec !important;border-bottom:1px solid #e7eaec !important;overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;}
-.treegrid-tbody tr :first-child{border-left:0 !important}
-

src/main/resources/static/plugins/treegrid/jquery.treegrid.extension.js

@@ -1,258 +0,0 @@
-(function($) {
-    "use strict";
-
-    $.fn.bootstrapTreeTable = function(options, param) {
-        // 如果是调用方法
-        if (typeof options == 'string') {
-            return $.fn.bootstrapTreeTable.methods[options](this, param);
-        }
-
-        // 如果是初始化组件
-        options = $.extend({}, $.fn.bootstrapTreeTable.defaults, options || {});
-        // 是否有radio或checkbox
-        var hasSelectItem = false;
-        var target = $(this);
-        // 在外层包装一下div，样式用的bootstrap-table的
-        var _main_div = $("<div class='fixed-table-container'></div>");
-        target.before(_main_div);
-        _main_div.append(target);
-        target.addClass("table table-hover treegrid-table table-bordered");
-        if (options.striped) {
-            target.addClass('table-striped');
-        }
-        // 工具条在外层包装一下div，样式用的bootstrap-table的
-        if(options.toolbar){
-            var _tool_div = $("<div class='fixed-table-toolbar' style='display:none;'></div>");
-            var _tool_left_div = $("<div class='bs-bars pull-left'></div>");
-            _tool_left_div.append($(options.toolbar));
-            _tool_div.append(_tool_left_div);
-            _main_div.before(_tool_div);
-        }
-        // 得到根节点
-        target.getRootNodes = function(data) {
-            // 指定Root节点值
-            var _root = options.rootCodeValue?options.rootCodeValue:null
-            var result = [];
-            $.each(data, function(index, item) {
-                // 这里兼容几种常见Root节点写法
-                // 默认的几种判断
-                var _defaultRootFlag = item[options.parentCode] == '0'
-                    || item[options.parentCode] == 0
-                    || item[options.parentCode] == null
-                    || item[options.parentCode] == '';
-                if (!item[options.parentCode] || (_root?(item[options.parentCode] == options.rootCodeValue):_defaultRootFlag)){
-                    result.push(item);
-                }
-                // 添加一个默认属性，用来判断当前节点有没有被显示
-                item.isShow = false;
-            });
-            return result;
-        };
-        var j = 0;
-        // 递归获取子节点并且设置子节点
-        target.getChildNodes = function(data, parentNode, parentIndex, tbody) {
-            $.each(data, function(i, item) {
-                if (item[options.parentCode] == parentNode[options.code]) {
-                    var tr = $('<tr></tr>');
-                    var nowParentIndex = (parentIndex + (j++) + 1);
-                    tr.addClass('treegrid-' + nowParentIndex);
-                    tr.addClass('treegrid-parent-' + parentIndex);
-                    target.renderRow(tr,item);
-                    item.isShow = true;
-                    tbody.append(tr);
-                    target.getChildNodes(data, item, nowParentIndex, tbody)
-
-                }
-            });
-        };
-        // 绘制行
-        target.renderRow = function(tr,item){
-            $.each(options.columns, function(index, column) {
-                // 判断有没有选择列
-                if(index==0&&column.field=='selectItem'){
-                    hasSelectItem = true;
-                    var td = $('<td style="text-align:center;width:36px"></td>');
-                    if(column.radio){
-                        var _ipt = $('<input name="select_item" type="radio" value="'+item[options.id]+'"></input>');
-                        td.append(_ipt);
-                    }
-                    if(column.checkbox){
-                        var _ipt = $('<input name="select_item" type="checkbox" value="'+item[options.id]+'"></input>');
-                        td.append(_ipt);
-                    }
-                    tr.append(td);
-                }else{
-                    var td = $('<td style="'+((column.width)?('width:'+column.width):'')+'"></td>');
-                    // 增加formatter渲染
-                    if (column.formatter) {
-                        td.html(column.formatter.call(this, item, index));
-                    } else {
-                        td.text(item[column.field]);
-                    }
-                    tr.append(td);
-                }
-            });
-        }
-        // 加载数据
-        target.load = function(parms){
-            // 加载数据前先清空
-            target.html("");
-            // 构造表头
-            var thr = $('<tr></tr>');
-            $.each(options.columns, function(i, item) {
-                var th = null;
-                // 判断有没有选择列
-                if(i==0&&item.field=='selectItem'){
-                    hasSelectItem = true;
-                    th = $('<th style="width:36px"></th>');
-                }else{
-                    th = $('<th style="padding:10px;'+((item.width)?('width:'+item.width):'')+'"></th>');
-                }
-                th.text(item.title);
-                thr.append(th);
-            });
-            var thead = $('<thead class="treegrid-thead"></thead>');
-            thead.append(thr);
-            target.append(thead);
-            // 构造表体
-            var tbody = $('<tbody class="treegrid-tbody"></tbody>');
-            target.append(tbody);
-            // 添加加载loading
-            var _loading = '<tr><td colspan="'+options.columns.length+'"><div style="display: block;text-align: center;">正在努力地加载数据中，请稍候……</div></td></tr>'
-            tbody.html(_loading);
-            // 默认高度
-            if(options.height){
-                tbody.css("height",options.height);
-            }
-            $.ajax({
-                type : options.type,
-                url : options.url,
-                data : parms?parms:options.ajaxParams,
-                dataType : "JSON",
-                success : function(data, textStatus, jqXHR) {
-                    // 加载完数据先清空
-                    tbody.html("");
-                    if(!data||data.length<=0){
-                        var _empty = '<tr><td colspan="'+options.columns.length+'"><div style="display: block;text-align: center;">没有记录</div></td></tr>'
-                        tbody.html(_empty);
-                        return;
-                    }
-                    var rootNode = target.getRootNodes(data);
-                    $.each(rootNode, function(i, item) {
-                        var tr = $('<tr></tr>');
-                        tr.addClass('treegrid-' + (j + "_" + i));
-                        target.renderRow(tr,item);
-                        item.isShow = true;
-                        tbody.append(tr);
-                        target.getChildNodes(data, item, (j + "_" + i), tbody);
-                    });
-                    // 下边的操作主要是为了查询时让一些没有根节点的节点显示
-                    $.each(data, function(i, item) {
-                        if(!item.isShow){
-                            var tr = $('<tr></tr>');
-                            tr.addClass('treegrid-' + (j + "_" + i));
-                            target.renderRow(tr,item);
-                            tbody.append(tr);
-                        }
-                    });
-                    target.append(tbody);
-                    // 初始化treegrid
-                    target.treegrid({
-                        treeColumn: options.expandColumn?options.expandColumn:(hasSelectItem?1:0),//如果有radio或checkbox默认第二列层级显示，当前是在用户未设置的提前下
-                        expanderExpandedClass : options.expanderExpandedClass,
-                        expanderCollapsedClass : options.expanderCollapsedClass
-                    });
-                    if (!options.expandAll) {
-                        target.treegrid('collapseAll');
-                    }
-                    //动态设置表头宽度
-                    //thead.css("width", tbody.children(":first").css("width"));
-                    // 行点击选中事件
-                    target.find("tbody").find("tr").click(function(){
-                        if(hasSelectItem){
-                            var _ipt = $(this).find("input[name='select_item']");
-                            if(_ipt.attr("type")=="radio"){
-                                _ipt.prop('checked',true);
-                                target.find("tbody").find("tr").removeClass("treegrid-selected");
-                                $(this).addClass("treegrid-selected");
-                            }else{
-                                if(_ipt.prop('checked')){
-                                    _ipt.prop('checked',false);
-                                    $(this).removeClass("treegrid-selected");
-                                }else{
-                                    _ipt.prop('checked',true);
-                                    $(this).addClass("treegrid-selected");
-                                }
-                            }
-                        }
-                    });
-                },
-                error:function(xhr,textStatus){
-                    var _errorMsg = '<tr><td colspan="'+options.columns.length+'"><div style="display: block;text-align: center;">'+xhr.responseText+'</div></td></tr>'
-                    tbody.html(_errorMsg);
-                    debugger;
-                },
-            });
-        }
-        if (options.url) {
-            target.load();
-        } else {
-            // 也可以通过defaults里面的data属性通过传递一个数据集合进来对组件进行初始化....有兴趣可以自己实现，思路和上述类似
-        }
-
-        return target;
-    };
-
-    // 组件方法封装........
-    $.fn.bootstrapTreeTable.methods = {
-        // 返回选中记录的id（返回的id由配置中的id属性指定）
-        // 为了兼容bootstrap-table的写法，统一返回数组，这里只返回了指定的id
-        getSelections : function(target, data) {
-            // 所有被选中的记录input
-            var _ipt = target.find("tbody").find("tr").find("input[name='select_item']:checked");
-            var chk_value =[];
-            // 如果是radio
-            if(_ipt.attr("type")=="radio"){
-                chk_value.push({id:_ipt.val()});
-            }else{
-                _ipt.each(function(_i,_item){
-                    chk_value.push({id:$(_item).val()});
-                });
-            }
-            return chk_value;
-        },
-        // 刷新记录
-        refresh : function(target, parms) {
-            if(parms){
-                target.load(parms);
-            }else{
-                target.load();
-            }
-        },
-        // 重置表格视图
-        resetHeight : function(target, height) {
-        	target.find("tbody").css("height", height + 'px');
-        }
-        // 组件的其他方法也可以进行类似封装........
-    };
-
-    $.fn.bootstrapTreeTable.defaults = {
-        id : 'menuId',// 选取记录返回的值
-        code : 'menuId',// 用于设置父子关系
-        parentCode : 'parentId',// 用于设置父子关系
-        rootCodeValue: null,//设置根节点code值----可指定根节点，默认为null,"",0,"0"
-        data : [], // 构造table的数据集合
-        type : "GET", // 请求数据的ajax类型
-        url : null, // 请求数据的ajax的url
-        ajaxParams : {}, // 请求数据的ajax的data属性
-        expandColumn : null,// 在哪一列上面显示展开按钮
-        expandAll : true, // 是否全部展开
-        striped : false, // 是否各行渐变色
-        columns : [],
-        toolbar: null,//顶部工具条
-        height: 0,
-        expanderExpandedClass : 'glyphicon glyphicon-chevron-down',// 展开的按钮的图标
-        expanderCollapsedClass : 'glyphicon glyphicon-chevron-right'// 缩起的按钮的图标
-
-    };
-})(jQuery);

src/main/resources/static/plugins/treegrid/tree.table.js

@@ -1,154 +0,0 @@
-/**
- * 初始化 Tree Table 的封装
- *
- * @author cyf
- */
-(function () {
-    var TreeTable = function (tableId, url, columns) {
-        this.btInstance = null;					//jquery和bootstrapTreeTable绑定的对象
-        this.bstableId = tableId;
-        this.url = url;
-        this.method = "GET";
-        this.columns = columns;
-        this.data = {};// ajax的参数
-        this.expandColumn = null;// 展开显示的列 
-        this.id = 'menuId';// 选取记录返回的值
-        this.code = 'menuId';// 用于设置父子关系
-        this.parentCode = 'parentId';// 用于设置父子关系
-        this.expandAll = false;// 是否默认全部展开
-        this.toolbarId = tableId + "Toolbar";
-        this.height = 430;
-    };
-
-    TreeTable.prototype = {
-        /**
-         * 初始化bootstrap table
-         */
-        init: function () {
-            var tableId = this.bstableId;
-            this.btInstance =
-                $('#'+tableId).bootstrapTreeTable({
-                    id: this.id,// 选取记录返回的值
-                    code: this.code,// 用于设置父子关系
-                    parentCode: this.parentCode,// 用于设置父子关系
-                    rootCodeValue: this.rootCodeValue,//设置根节点code值----可指定根节点，默认为null,"",0,"0"
-                    type: this.method, //请求数据的ajax类型
-                    url: this.url,   //请求数据的ajax的url
-                    ajaxParams: this.data, //请求数据的ajax的data属性
-                    expandColumn: this.expandColumn,//在哪一列上面显示展开按钮,从0开始
-                    striped: true,   //是否各行渐变色
-                    expandAll: this.expandAll,  //是否全部展开
-                    columns: this.columns,		//列数组
-                    toolbar: "#" + this.toolbarId,//顶部工具条
-                    height: this.height,
-                });
-            return this;
-        },
-
-        /**
-         * 设置在哪一列上面显示展开按钮,从0开始
-         */
-        setExpandColumn: function (expandColumn) {
-            this.expandColumn = expandColumn;
-        },
-        /**
-         * 设置记录返回的id值
-         */
-        setIdField: function (id) {
-            this.id = id;
-        },
-        /**
-         * 设置记录分级的字段
-         */
-        setCodeField: function (code) {
-            this.code = code;
-        },
-        /**
-         * 设置记录分级的父级字段
-         */
-        setParentCodeField: function (parentCode) {
-            this.parentCode = parentCode;
-        },
-        /**
-         * 设置根节点code值----可指定根节点，默认为null,"",0,"0"
-         */
-        setRootCodeValue: function (rootCodeValue) {
-            this.rootCodeValue = rootCodeValue;
-        },
-        /**
-         * 设置是否默认全部展开
-         */
-        setExpandAll: function (expandAll) {
-        	this.expandAll = expandAll;
-        },
-        /**
-         * 设置表格高度
-         */
-        setHeight: function (height) {
-        	this.height = height;
-        },
-        /**
-         * 设置ajax post请求时候附带的参数
-         */
-        set: function (key, value) {
-            if (typeof key == "object") {
-                for (var i in key) {
-                    if (typeof i == "function")
-                        continue;
-                    this.data[i] = key[i];
-                }
-            } else {
-                this.data[key] = (typeof value == "undefined") ? $("#" + key).val() : value;
-            }
-            return this;
-        },
-
-        /**
-         * 设置ajax get请求时候附带的参数
-         */
-        setData: function (data) {
-            this.data = data;
-            return this;
-        },
-
-        /**
-         * 清空ajax post请求参数
-         */
-        clear: function () {
-            this.data = {};
-            return this;
-        },
-
-        /**
-         * 刷新表格
-         */
-        refresh: function (parms) {
-            if (typeof parms != "undefined") {
-                this.btInstance.bootstrapTreeTable('refresh', parms.query);// 为了兼容bootstrap-table的写法
-            } else {
-                this.btInstance.bootstrapTreeTable('refresh');
-            }
-        },
-        
-        /**
-         * 设置高度
-         */
-        resetHeight: function(parms) {
-        	if (typeof parms != "undefined") {
-                this.btInstance.bootstrapTreeTable('resetHeight', parms.height);// 为了兼容bootstrap-table的写法
-            } else {
-                this.btInstance.bootstrapTreeTable('resetHeight');
-            }
-        },
-        
-        /**
-         * 获取选中行
-         */
-        getSelectedRow: function() {
-            return this.btInstance.bootstrapTreeTable('getSelections');
-        }
-    };
-
-    window.TreeTable = TreeTable;
-
-}());

src/main/resources/templates/error/404.html

@@ -2,7 +2,7 @@
 <html>
 <head>
 <meta charset="UTF-8"></meta>
-<title>400错误</title>
+<title>404错误</title>
 <style type="text/css">
 .middle-box {
 	max-width: 400px;
@@ -23,7 +23,7 @@
 </head>
 <body>
 	<div class="middle-box text-center">
-		<h1>400</h1>
+		<h1>404</h1>
 		<h3 class="font-bold">页面未找到！</h3>
 		<div class="error-desc">
 			抱歉，页面好像去火星了~

src/main/resources/templates/include/footer_js.html

@@ -9,10 +9,8 @@
 		<script th:src="@{../../plugins/ztree/jquery.ztree.all.min.js}"></script>
 		<script th:src="@{../../plugins/bootstrap-table/bootstrap-table.min.js}"></script>
 		<script th:src="@{../../plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script>
-		<script th:src="@{../../plugins/treegrid/jquery.treegrid.min.js}"></script>
-		<script th:src="@{../../plugins/treegrid/jquery.treegrid.bootstrap3.js}"></script>
-		<script th:src="@{../../plugins/treegrid/jquery.treegrid.extension.js}"></script>
-		<script th:src="@{../../plugins/treegrid/tree.table.js}"></script>
+		<script th:src="@{../../plugins/bootstrap-table/treegrid/bootstrap-table-treegrid.js}"></script>
+		<script th:src="@{../../plugins/bootstrap-table/treegrid/jquery-treegrid.min.js}"></script>
 		<script th:src="@{../../plugins/validator/validator.js}"></script>
 		<script th:src="@{../../plugins/laydate/laydate.js}"></script>
 		<script th:src="@{../../plugins/double-box/doublebox-bootstrap.js}"></script>

src/main/resources/templates/include/header_css.html

@@ -2,13 +2,13 @@
 <html xmlns:th="http://www.thymeleaf.org">
 <head th:fragment="header(title)">
 	<title th:text="${title}"></title>
-	<meta charset="UTF-8"></meta>
-	<meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>
-	<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"></meta>
+	<meta charset="UTF-8"/>
+	<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
+	<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"/>
 	<link th:href="@{../../css/bootstrap.min.css}" rel="stylesheet"/>
 	<link th:href="@{../../css/font-awesome.min.css}" rel="stylesheet"/>
 	<link th:href="@{../../plugins/bootstrap-table/bootstrap-table.min.css}" rel="stylesheet"/>
-	<link th:href="@{../../plugins/treegrid/jquery.treegrid.css}" rel="stylesheet"/>
+	<link th:href="@{../../plugins/bootstrap-table/treegrid/jquery-treegird.min.css}" rel="stylesheet"/>
 	<link th:href="@{../../plugins/ztree/css/metroStyle/metroStyle.css}" rel="stylesheet"/>
 	<link th:href="@{../../plugins/double-box/doublebox-bootstrap.css}" rel="stylesheet"/>
 	<link th:href="@{../../css/style.min.css}" rel="stylesheet"/>