From 8b4ea053913e65d013e5baaf6f5480ec7c639e7d Mon Sep 17 00:00:00 2001 From: RuoYi Date: Fri, 5 Oct 2018 18:43:41 +0800 Subject: [PATCH] =?UTF-8?q?=E9=83=A8=E9=97=A8/=E8=8F=9C=E5=8D=95=E6=94=AF?= =?UTF-8?q?=E6=8C=81=EF=BC=88=E5=B1=95=E5=BC=80/=E6=8A=98=E5=8F=A0?= =?UTF-8?q?=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../bootstrap-treetable.css | 8 +- .../bootstrap-treetable.js | 971 ++++++++++++------ src/main/resources/static/ruoyi/js/common.js | 11 + src/main/resources/static/ruoyi/js/ry-ui.js | 33 +- src/main/resources/templates/main.html | 2 + .../resources/templates/monitor/job/job.html | 12 +- .../templates/monitor/online/online.html | 2 +- .../templates/system/config/config.html | 14 +- .../resources/templates/system/dept/dept.html | 23 +- .../templates/system/dict/data/data.html | 10 +- .../templates/system/dict/type/type.html | 12 +- .../resources/templates/system/menu/menu.html | 26 +- .../templates/system/notice/notice.html | 5 +- .../resources/templates/system/post/post.html | 10 +- .../resources/templates/system/role/role.html | 12 +- .../resources/templates/system/user/user.html | 12 +- .../resources/templates/vm/html/list.html.vm | 5 +- 17 files changed, 812 insertions(+), 356 deletions(-) diff --git a/src/main/resources/static/ajax/libs/bootstrap-treetable/bootstrap-treetable.css b/src/main/resources/static/ajax/libs/bootstrap-treetable/bootstrap-treetable.css index 18d304ca..12577e89 100644 --- a/src/main/resources/static/ajax/libs/bootstrap-treetable/bootstrap-treetable.css +++ b/src/main/resources/static/ajax/libs/bootstrap-treetable/bootstrap-treetable.css @@ -4,7 +4,11 @@ .bootstrap-tree-table .treetable-table{border:0 !important;margin-bottom:0} .bootstrap-tree-table .treetable-table tbody {display:block;height:auto;overflow-y:auto;} .bootstrap-tree-table .treetable-table thead, .treetable-table tbody tr {display:table;width:100%;table-layout:fixed;} -.bootstrap-tree-table .treetable-thead th{line-height:24px;border: 0 !important;border-radius: 4px;border-left:0px solid #e7eaec !important;border-bottom:1px solid #ccc!important;text-align: center;} +.bootstrap-tree-table .treetable-thead th{line-height:24px;border: 0 !important;border-radius: 4px;border-left:0px solid #e7eaec !important;border-bottom:1px solid #ccc!important;text-align: left;} .bootstrap-tree-table .treetable-thead tr :first-child{border-left:0 !important} .bootstrap-tree-table .treetable-tbody td{border: 0 !important;border-left:0px solid #e7eaec !important;border-bottom:1px solid #e7eaec!important;overflow: hidden; white-space: nowrap; text-overflow: ellipsis;} -.bootstrap-tree-table .treetable-tbody tr :first-child{border-left:0 !important} \ No newline at end of file +.bootstrap-tree-table .treetable-tbody tr :first-child{border-left:0 !important} +.bootstrap-tree-table .treetable-bars .tool-left, .bootstrap-tree-table .treetable-bars .tool-right{margin-top: 10px; margin-bottom: 10px;} +.bootstrap-tree-table .treetable-bars .tool-left{float: left;} +.bootstrap-tree-table .treetable-bars .tool-right{float: right;} +.bootstrap-tree-table .treetable-bars .columns li label{display: block;padding: 3px 20px;clear: both;font-weight: 400;line-height: 1.428571429;max-width: 100%;margin-bottom: 5px;cursor:pointer;} diff --git a/src/main/resources/static/ajax/libs/bootstrap-treetable/bootstrap-treetable.js b/src/main/resources/static/ajax/libs/bootstrap-treetable/bootstrap-treetable.js index c05c92b3..d14121e7 100644 --- a/src/main/resources/static/ajax/libs/bootstrap-treetable/bootstrap-treetable.js +++ b/src/main/resources/static/ajax/libs/bootstrap-treetable/bootstrap-treetable.js @@ -4,320 +4,667 @@ * @author swifly */ (function($) { - "use strict"; + "use strict"; - $.fn.bootstrapTreeTable = function(options, param) { - var allData = null;//用于存放格式化后的数据 - // 如果是调用方法 - 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 = $("
"); - target.before(_main_div); - _main_div.append(target); - target.addClass("table table-hover treetable-table"); - if (options.striped) { - target.addClass('table-striped'); - } - // 工具条在外层包装一下div,样式用的bootstrap-table的 - if(options.toolbar){ - var _tool_div = $("
"); - var _tool_left_div = $("
"); - _tool_left_div.append($(options.toolbar)); - _tool_div.append(_tool_left_div); - _main_div.before(_tool_div); - } - // 格式化数据,优化性能 - target.formatData=function(data){ - var _root = options.rootCodeValue?options.rootCodeValue:null - $.each(data, function(index, item) { - // 添加一个默认属性,用来判断当前节点有没有被显示 - item.isShow = false; - // 这里兼容几种常见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)){ - if(!allData["_root_"]){allData["_root_"]=[];} - allData["_root_"].push(item); - }else{ - if(!allData["_n_"+item[options.parentCode]]){allData["_n_"+item[options.parentCode]]=[];} - allData["_n_"+item[options.parentCode]].push(item); - } - }); - data=null;//回收 - } - // 得到根节点 - target.getRootNodes = function() { - return allData["_root_"]; - }; - // 递归获取子节点并且设置子节点 - target.handleNode = function(parentNode, lv, row_id, p_id, tbody) { - var _ls = allData["_n_"+parentNode[options.code]]; - var tr = target.renderRow(parentNode,_ls?true:false,lv,row_id,p_id); - tbody.append(tr); - if(_ls){ - $.each(_ls, function(i, item) { - var _row_id = row_id+"_"+i - target.handleNode(item, (lv + 1), _row_id,row_id, tbody) - }); - } - }; - // 绘制行 - target.renderRow = function(item,isP,lv,row_id,p_id){ - // 标记已显示 - item.isShow = true; - var tr = $(''); - var _icon = options.expanderCollapsedClass; - if(options.expandAll){ - tr.css("display","table"); - _icon = options.expanderExpandedClass; - }else if(options.expandFirst&&lv<=1){ - tr.css("display","table"); - _icon=(lv==0)?options.expanderExpandedClass:options.expanderCollapsedClass; - }else{ - tr.css("display","none"); - _icon = options.expanderCollapsedClass; - } - $.each(options.columns, function(index, column) { - // 判断有没有选择列 - if(column.field=='selectItem'){ - hasSelectItem = true; - var td = $(''); - if(column.radio){ - var _ipt = $(''); - td.append(_ipt); - } - if(column.checkbox){ - var _ipt = $(''); - td.append(_ipt); - } - tr.append(td); - }else{ - var td = $(''); - // 增加formatter渲染 - if (column.formatter) { - td = $(''); - td.html(column.formatter.call(this, item[column.field], item, index)); - } else { - td.text(item[column.field]); - } - if(options.expandColumn==index){ - if(!isP){ - td.prepend('') - }else{ - td.prepend('') - } - for (var int = 0; int < (lv-1); int++) { - td.prepend('') - } - } - tr.append(td); - } - }); - return tr; - } - // 加载数据 - target.load = function(parms){ - // 加载数据前先清空 - allData = {}; - // 加载数据前先清空 - target.html(""); - // 构造表头 - var thr = $(''); - $.each(options.columns, function(i, item) { - var th = null; - // 判断有没有选择列 - if(i==0 && item.field=='selectItem'){ - hasSelectItem = true; - th = $(''); - }else{ - th = $(''); - } - th.text(item.title); - thr.append(th); - }); - var thead = $(''); - thead.append(thr); - target.append(thead); - // 构造表体 - var tbody = $(''); - target.append(tbody); - // 添加加载loading - var _loading = '
正在努力地加载数据中,请稍候……
' - 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 = '
没有找到匹配的记录
' - tbody.html(_empty); - return; - } - // 格式化数据 - target.formatData(data); - // 开始绘制 - var rootNode = target.getRootNodes(); - if(rootNode){ - $.each(rootNode, function(i, item) { - var _row_id = "row_id_"+i - target.handleNode(item, 1, _row_id,"row_root", tbody); - }); - } - // 下边的操作主要是为了查询时让一些没有根节点的节点显示 - $.each(data, function(i, item) { - if(!item.isShow){ - var tr = target.renderRow(item,false,1); - tbody.append(tr); - } - }); - target.append(tbody); - //动态设置表头宽度 - 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("treetable-selected"); - $(this).addClass("treetable-selected"); - }else{ - if(_ipt.prop('checked')){ - _ipt.prop('checked',false); - $(this).removeClass("treetable-selected"); - }else{ - _ipt.prop('checked',true); - $(this).addClass("treetable-selected"); - } - } - } - }); - // 小图标点击事件--展开缩起 - target.find("tbody").find("tr").find(".treetable-expander").click(function(){ - var _flag = $(this).hasClass(options.expanderExpandedClass); - var tr = $(this).parent().parent(); - var row_id = tr.attr("id"); - if(_flag){ - var _ls = target.find("tbody").find("tr[id^='"+row_id+"_']");//下所有 - if(_ls&&_ls.length>0){ - $.each(_ls, function(index, item) { - $(item).css("display","none"); - var _icon = $(item).children().eq(options.expandColumn).find(".treetable-expander"); - if(_icon.hasClass(options.expanderExpandedClass)){ - _icon.removeClass(options.expanderExpandedClass) - _icon.addClass(options.expanderCollapsedClass) - } - }); - } - $(this).removeClass(options.expanderExpandedClass) - $(this).addClass(options.expanderCollapsedClass) - }else{ - var _ls = target.find("tbody").find("tr[pid='"+row_id+"']");//下一级 - if(_ls&&_ls.length>0){ - $.each(_ls, function(index, item) { - $(item).css("display","table"); - }); - } - $(this).removeClass(options.expanderCollapsedClass) - $(this).addClass(options.expanderExpandedClass) - } - }); - }, - error:function(xhr,textStatus){ - var _errorMsg = '
'+xhr.responseText+'
' - tbody.html(_errorMsg); - debugger; - }, - }); - } - if (options.url) { - target.load(); - } else { - // 也可以通过defaults里面的data属性通过传递一个数据集合进来对组件进行初始化....有兴趣可以自己实现,思路和上述类似 - } - - return target; - }; + $.fn.bootstrapTreeTable = function(options, param) { + var target = $(this).data('bootstrap.tree.table'); + target = target ? target : $(this); + // 如果是调用方法 + if (typeof options == 'string') { + return $.fn.bootstrapTreeTable.methods[options](target, param); + } + // 如果是初始化组件 + options = $.extend({}, $.fn.bootstrapTreeTable.defaults, options || {}); + target.hasSelectItem = false;// 是否有radio或checkbox + target.data_list = null; //用于缓存格式化后的数据-按父分组 + target.data_obj = null; //用于缓存格式化后的数据-按id存对象 + target.hiddenColumns = []; //用于存放被隐藏列的field + target.lastAjaxParams; //用户最后一次请求的参数 + target.isFixWidth=false; //是否有固定宽度 + // 初始化 + var init = function() { + // 初始化容器 + initContainer(); + // 初始化工具栏 + initToolbar(); + // 初始化表头 + initHeader(); + // 初始化表体 + initBody(); + // 初始化数据服务 + initServer(); + // 动态设置表头宽度 + autoTheadWidth(true); + // 缓存target对象 + target.data('bootstrap.tree.table', target); + } + // 初始化容器 + var initContainer = function() { + // 在外层包装一下div,样式用的bootstrap-table的 + var $main_div = $("
"); + var $treetable = $("
"); + target.before($main_div); + $main_div.append($treetable); + $treetable.append(target); + target.addClass("table"); + if (options.striped) { + target.addClass('table-striped'); + } + if (options.bordered) { + target.addClass('table-bordered'); + } + if (options.hover) { + target.addClass('table-hover'); + } + if (options.condensed) { + target.addClass('table-condensed'); + } + target.html(""); + } + // 初始化工具栏 + var initToolbar = function() { + var $toolbar = $("
"); + if (options.toolbar) { + $(options.toolbar).addClass('tool-left'); + $toolbar.append($(options.toolbar)); + } + var $rightToolbar = $('
'); + $toolbar.append($rightToolbar); + target.parent().before($toolbar); + // 是否显示刷新按钮 + if (options.showRefresh) { + var $refreshBtn = $(''); + $rightToolbar.append($refreshBtn); + registerRefreshBtnClickEvent($refreshBtn); + } + // 是否显示列选项 + if (options.showColumns) { + var $columns_div = $('
'); + var $columns_ul = $(''); + $.each(options.columns, function(i, column) { + if (column.field != 'selectItem') { + var _li = null; + if(typeof column.visible == "undefined"||column.visible==true){ + _li = $('
  • '); + }else{ + _li = $('
  • '); + target.hiddenColumns.push(column.field); + } + $columns_ul.append(_li); + } + }); + $columns_div.append($columns_ul); + $rightToolbar.append($columns_div); + // 注册列选项事件 + registerColumnClickEvent(); + }else{ + $.each(options.columns, function(i, column) { + if (column.field != 'selectItem') { + if(!(typeof column.visible == "undefined"||column.visible==true)){ + target.hiddenColumns.push(column.field); + } + } + }); + } + } + // 初始化隐藏列 + var initHiddenColumns = function(){ + $.each(target.hiddenColumns, function(i, field) { + target.find("."+field+"_cls").hide(); + }); + } + // 初始化表头 + var initHeader = function() { + var $thr = $(''); + $.each(options.columns, function(i, column) { + var $th = null; + // 判断有没有选择列 + if (i == 0 && column.field == 'selectItem') { + target.hasSelectItem = true; + $th = $(''); + } else { + $th = $(''); + } + if((!target.isFixWidth)&& column.width){ + target.isFixWidth = column.width.indexOf("px")>-1?true:false; + } + $th.text(column.title); + $thr.append($th); + }); + var $thead = $(''); + $thead.append($thr); + target.append($thead); + } + // 初始化表体 + var initBody = function() { + var $tbody = $(''); + target.append($tbody); + // 默认高度 + if (options.height) { + $tbody.css("height", options.height); + } + } + // 初始化数据服务 + var initServer = function(parms) { + // 加载数据前先清空 + target.data_list = {}; + target.data_obj = {}; + var $tbody = target.find("tbody"); + // 添加加载loading + var $loading = '
    正在努力地加载数据中,请稍候……
    ' + $tbody.html($loading); + if (options.url) { + $.ajax({ + type: options.type, + url: options.url, + data: parms ? parms : options.ajaxParams, + dataType: "JSON", + success: function(data, textStatus, jqXHR) { + renderTable(data); + }, + error: function(xhr, textStatus) { + var _errorMsg = '
    ' + xhr.responseText + '
    ' + $tbody.html(_errorMsg); + }, + }); + } else { + renderTable(options.data); + } + } + // 加载完数据后渲染表格 + var renderTable = function(data) { + var $tbody = target.find("tbody"); + // 先清空 + $tbody.html(""); + if (!data || data.length <= 0) { + var _empty = '
    没有找到匹配的记录
    ' + $tbody.html(_empty); + return; + } + // 缓存并格式化数据 + formatData(data); + // 获取所有根节点 + var rootNode = target.data_list["_root_"]; + // 开始绘制 + if (rootNode) { + $.each(rootNode, function(i, item) { + var _child_row_id = "row_id_" + i + recursionNode(item, 1, _child_row_id, "row_root"); + }); + } + // 下边的操作主要是为了查询时让一些没有根节点的节点显示 + $.each(data, function(i, item) { + if (!item.isShow) { + var tr = renderRow(item, false, 1, "", ""); + $tbody.append(tr); + } + }); + target.append($tbody); + registerExpanderEvent(); + registerRowClickEvent(); + initHiddenColumns(); + // 动态设置表头宽度 + autoTheadWidth() + } + // 动态设置表头宽度 + var autoTheadWidth = function(initFlag) { + if(options.height>0){ + var $thead = target.find("thead"); + var $tbody = target.find("tbody"); + var borderWidth = parseInt(target.css("border-left-width")) + parseInt(target.css("border-right-width")) + + $thead.css("width", $tbody.children(":first").width()); + if(initFlag){ + var resizeWaiter = false; + $(window).resize(function() { + if(!resizeWaiter){ + resizeWaiter = true; + setTimeout(function(){ + if(!target.isFixWidth){ + $tbody.css("width", target.parent().width()-borderWidth); + } + $thead.css("width", $tbody.children(":first").width()); + resizeWaiter = false; + }, 300); + } + }); + } + } + + } + // 缓存并格式化数据 + var formatData = function(data) { + var _root = options.rootIdValue ? options.rootIdValue : null + $.each(data, function(index, item) { + // 添加一个默认属性,用来判断当前节点有没有被显示 + item.isShow = false; + // 这里兼容几种常见Root节点写法 + // 默认的几种判断 + var _defaultRootFlag = item[options.parentId] == '0' || + item[options.parentId] == 0 || + item[options.parentId] == null || + item[options.parentId] == ''; + if (!item[options.parentId] || (_root ? (item[options.parentId] == options.rootIdValue) : _defaultRootFlag)) { + if (!target.data_list["_root_"]) { + target.data_list["_root_"] = []; + } + if (!target.data_obj["id_" + item[options.id]]) { + target.data_list["_root_"].push(item); + } + } else { + if (!target.data_list["_n_" + item[options.parentId]]) { + target.data_list["_n_" + item[options.parentId]] = []; + } + if (!target.data_obj["id_" + item[options.id]]) { + target.data_list["_n_" + item[options.parentId]].push(item); + } + } + target.data_obj["id_" + item[options.id]] = item; + }); + } + // 递归获取子节点并且设置子节点 + var recursionNode = function(parentNode, lv, row_id, p_id) { + var $tbody = target.find("tbody"); + var _ls = target.data_list["_n_" + parentNode[options.id]]; + var $tr = renderRow(parentNode, _ls ? true : false, lv, row_id, p_id); + $tbody.append($tr); + if (_ls) { + $.each(_ls, function(i, item) { + var _child_row_id = row_id + "_" + i + recursionNode(item, (lv + 1), _child_row_id, row_id) + }); + } + }; + // 绘制行 + var renderRow = function(item, isP, lv, row_id, p_id) { + // 标记已显示 + item.isShow = true; + item.row_id = row_id; + item.p_id = p_id; + item.lv = lv; + var $tr = $(''); + var _icon = options.expanderCollapsedClass; + if (options.expandAll) { + $tr.css("display", "table"); + _icon = options.expanderExpandedClass; + } else if (lv == 1) { + $tr.css("display", "table"); + _icon = (options.expandFirst) ? options.expanderExpandedClass : options.expanderCollapsedClass; + } else if (lv == 2) { + if (options.expandFirst) { + $tr.css("display", "table"); + } else { + $tr.css("display", "none"); + } + _icon = options.expanderCollapsedClass; + } else { + $tr.css("display", "none"); + _icon = options.expanderCollapsedClass; + } + $.each(options.columns, function(index, column) { + // 判断有没有选择列 + if (column.field == 'selectItem') { + target.hasSelectItem = true; + var $td = $(''); + if (column.radio) { + var _ipt = $(''); + $td.append(_ipt); + } + if (column.checkbox) { + var _ipt = $(''); + $td.append(_ipt); + } + $tr.append($td); + } else { + var $td = $(''); + if(column.width){ + $td.css("width",column.width); + } + if(column.align){ + $td.css("text-align",column.align); + } + if(options.expandColumn == index){ + $td.css("text-align","left"); + } + if(column.valign){ + $td.css("vertical-align",column.valign); + } + if(options.showTitle){ + $td.addClass("ellipsis"); + } + // 增加formatter渲染 + if (column.formatter) { + $td.html(column.formatter.call(this, item[column.field], item, index)); + } else { + if(options.showTitle){ + // 只在字段没有formatter时才添加title属性 + $td.attr("title",item[column.field]); + } + $td.text(item[column.field]); + } + if (options.expandColumn == index) { + if (!isP) { + $td.prepend('') + } else { + $td.prepend('') + } + for (var int = 0; int < (lv - 1); int++) { + $td.prepend('') + } + } + $tr.append($td); + } + }); + return $tr; + } + // 注册刷新按钮点击事件 + var registerRefreshBtnClickEvent = function(btn) { + $(btn).off('click').on('click', function () { + target.refresh(); + }); + } + // 注册列选项事件 + var registerColumnClickEvent = function() { + $(".bootstrap-tree-table .treetable-bars .columns label input").off('click').on('click', function () { + var $this = $(this); + if($this.prop('checked')){ + target.showColumn($(this).val()); + }else{ + target.hideColumn($(this).val()); + } + }); + } + // 注册行点击选中事件 + var registerRowClickEvent = function() { + target.find("tbody").find("tr").unbind(); + target.find("tbody").find("tr").click(function() { + if (target.hasSelectItem) { + var _ipt = $(this).find("input[name='select_item']"); + if (_ipt.attr("type") == "radio") { + _ipt.prop('checked', true); + target.find("tbody").find("tr").removeClass("treetable-selected"); + $(this).addClass("treetable-selected"); + } else { + if (_ipt.prop('checked')) { + _ipt.prop('checked', false); + $(this).removeClass("treetable-selected"); + } else { + _ipt.prop('checked', true); + $(this).addClass("treetable-selected"); + } + } + } + }); + } + // 注册小图标点击事件--展开缩起 + var registerExpanderEvent = function() { + target.find("tbody").find("tr").find(".treetable-expander").unbind(); + target.find("tbody").find("tr").find(".treetable-expander").click(function() { + var _isExpanded = $(this).hasClass(options.expanderExpandedClass); + var _isCollapsed = $(this).hasClass(options.expanderCollapsedClass); + if (_isExpanded || _isCollapsed) { + var tr = $(this).parent().parent(); + var row_id = tr.attr("id"); + var _ls = target.find("tbody").find("tr[id^='" + row_id + "_']"); //下所有 + if (_isExpanded) { + $(this).removeClass(options.expanderExpandedClass); + $(this).addClass(options.expanderCollapsedClass); + if (_ls && _ls.length > 0) { + $.each(_ls, function(index, item) { + $(item).css("display", "none"); + }); + } + } else { + $(this).removeClass(options.expanderCollapsedClass); + $(this).addClass(options.expanderExpandedClass); + if (_ls && _ls.length > 0) { + $.each(_ls, function(index, item) { + // 父icon + var _p_icon = $("#" + $(item).attr("pid")).children().eq(options.expandColumn).find(".treetable-expander"); + if (_p_icon.hasClass(options.expanderExpandedClass)) { + $(item).css("display", "table"); + } + }); + } + } + } + }); + } + // 刷新数据 + target.refresh = function(parms) { + if(parms){ + target.lastAjaxParams=parms; + } + initServer(target.lastAjaxParams); + } + // 添加数据刷新表格 + target.appendData = function(data) { + // 下边的操作主要是为了查询时让一些没有根节点的节点显示 + $.each(data, function(i, item) { + var _data = target.data_obj["id_" + item[options.id]]; + var _p_data = target.data_obj["id_" + item[options.parentId]]; + var _c_list = target.data_list["_n_" + item[options.parentId]]; + var row_id = ""; //行id + var p_id = ""; //父行id + var _lv = 1; //如果没有父就是1默认显示 + var tr; //要添加行的对象 + if (_data && _data.row_id && _data.row_id != "") { + row_id = _data.row_id; // 如果已经存在了,就直接引用原来的 + } + if (_p_data) { + p_id = _p_data.row_id; + if (row_id == "") { + var _tmp = 0 + if (_c_list && _c_list.length > 0) { + _tmp = _c_list.length; + } + row_id = _p_data.row_id + "_" + _tmp; + } + _lv = _p_data.lv + 1; //如果有父 + // 绘制行 + tr = renderRow(item, false, _lv, row_id, p_id); - // 组件方法封装........ - $.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"){ - var _data = {id:_ipt.val()}; - var _tds = _ipt.parent().parent().find("td"); - _tds.each(function(_i,_item){ - if(_i!=0){ - _data[$(_item).attr("name")]=$(_item).attr("title"); - } - }); - chk_value.push(_data); - }else{ - _ipt.each(function(_i,_item){ - var _data = {id:$(_item).val()}; - var _tds = $(_item).parent().parent().find("td"); - _tds.each(function(_ii,_iitem){ - if(_ii!=0){ - _data[$(_iitem).attr("name")]=$(_iitem).attr("title"); - } - }); - chk_value.push(_data); - }); - } - return chk_value; - }, - // 刷新记录 - refresh : function(target, parms) { - if(parms){ - target.load(parms); - }else{ - target.load(); - } - }, - // 组件的其他方法也可以进行类似封装........ - }; + var _p_icon = $("#" + _p_data.row_id).children().eq(options.expandColumn).find(".treetable-expander"); + var _isExpanded = _p_icon.hasClass(options.expanderExpandedClass); + var _isCollapsed = _p_icon.hasClass(options.expanderCollapsedClass); + // 父节点有没有展开收缩按钮 + if (_isExpanded || _isCollapsed) { + // 父节点展开状态显示新加行 + if (_isExpanded) { + tr.css("display", "table"); + } + } else { + // 父节点没有展开收缩按钮则添加 + _p_icon.addClass(options.expanderCollapsedClass); + } - $.fn.bootstrapTreeTable.defaults = { - id : 'id',// 选取记录返回的值 - code : 'id',// 用于设置父子关系 - parentCode : 'parentId',// 用于设置父子关系 - rootCodeValue: null,//设置根节点code值----可指定根节点,默认为null,"",0,"0" - data : [], // 构造table的数据集合 - type : "GET", // 请求数据的ajax类型 - url : null, // 请求数据的ajax的url - ajaxParams : {}, // 请求数据的ajax的data属性 - expandColumn : 0,// 在哪一列上面显示展开按钮 - expandAll : false, // 是否全部展开 - expandFirst : true, // 是否默认第一级展开--expandAll为false时生效 - striped : false, // 是否各行渐变色 - columns : [], - toolbar: '#toolbar',//顶部工具条 - height: 0, - expanderExpandedClass : 'glyphicon glyphicon-chevron-down',// 展开的按钮的图标 - expanderCollapsedClass : 'glyphicon glyphicon-chevron-right'// 缩起的按钮的图标 + if (_data) { + $("#" + _data.row_id).before(tr); + $("#" + _data.row_id).remove(); + } else { + // 计算父的同级下一行 + var _tmp_ls = _p_data.row_id.split("_"); + var _p_next = _p_data.row_id.substring(0, _p_data.row_id.length - 1) + (parseInt(_tmp_ls[_tmp_ls.length - 1]) + 1); + // 画上 + $("#" + _p_next).before(tr); + } + } else { + tr = renderRow(item, false, _lv, row_id, p_id); + if (_data) { + $("#" + _data.row_id).before(tr); + $("#" + _data.row_id).remove(); + } else { + // 画上 + var tbody = target.find("tbody"); + tbody.append(tr); + } + } + item.isShow = true; + // 缓存并格式化数据 + formatData([item]); + }); + registerExpanderEvent(); + registerRowClickEvent(); + initHiddenColumns(); + } - }; + // 展开/折叠指定的行 + target.toggleRow=function(id) { + var _rowData = target.data_obj["id_" + id]; + var $row_expander = $("#"+_rowData.row_id).find(".treetable-expander"); + $row_expander.trigger("click"); + } + // 展开指定的行 + target.expandRow=function(id) { + var _rowData = target.data_obj["id_" + id]; + var $row_expander = $("#"+_rowData.row_id).find(".treetable-expander"); + var _isCollapsed = $row_expander.hasClass(target.options.expanderCollapsedClass); + if (_isCollapsed) { + $row_expander.trigger("click"); + } + } + // 折叠 指定的行 + target.collapseRow=function(id) { + var _rowData = target.data_obj["id_" + id]; + var $row_expander = $("#"+_rowData.row_id).find(".treetable-expander"); + var _isExpanded = $row_expander.hasClass(target.options.expanderExpandedClass); + if (_isExpanded) { + $row_expander.trigger("click"); + } + } + // 展开所有的行 + target.expandAll=function() { + target.find("tbody").find("tr").find(".treetable-expander").each(function(i,n){ + var _isCollapsed = $(n).hasClass(options.expanderCollapsedClass); + if (_isCollapsed) { + $(n).trigger("click"); + } + }) + } + // 折叠所有的行 + target.collapseAll=function() { + target.find("tbody").find("tr").find(".treetable-expander").each(function(i,n){ + var _isExpanded = $(n).hasClass(options.expanderExpandedClass); + if (_isExpanded) { + $(n).trigger("click"); + } + }) + } + // 显示指定列 + target.showColumn=function(field,flag) { + var _index = $.inArray(field, target.hiddenColumns); + if (_index > -1) { + target.hiddenColumns.splice(_index, 1); + } + target.find("."+field+"_cls").show(); + //是否更新列选项状态 + if(flag&&options.showColumns){ + var $input = $(".bootstrap-tree-table .treetable-bars .columns label").find("input[value='"+field+"']") + $input.prop("checked", 'checked'); + } + } + // 隐藏指定列 + target.hideColumn=function(field,flag) { + target.hiddenColumns.push(field); + target.find("."+field+"_cls").hide(); + //是否更新列选项状态 + if(flag&&options.showColumns){ + var $input = $(".bootstrap-tree-table .treetable-bars .columns label").find("input[value='"+field+"']") + $input.prop("checked", ''); + } + } + // 初始化 + init(); + return target; + }; + + // 组件方法封装........ + $.fn.bootstrapTreeTable.methods = { + // 为了兼容bootstrap-table的写法,统一返回数组,这里返回了表格显示列的数据 + 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") { + var _data = target.data_obj["id_" + _ipt.val()]; + chk_value.push(_data); + } else { + _ipt.each(function(_i, _item) { + var _data = target.data_obj["id_" + $(_item).val()]; + chk_value.push(_data); + }); + } + return chk_value; + }, + // 刷新记录 + refresh: function(target, parms) { + if (parms) { + target.refresh(parms); + } else { + target.refresh(); + } + }, + // 添加数据到表格 + appendData: function(target, data) { + if (data) { + target.appendData(data); + } + }, + // 展开/折叠指定的行 + toggleRow: function(target, id) { + target.toggleRow(id); + }, + // 展开指定的行 + expandRow: function(target, id) { + target.expandRow(id); + }, + // 折叠 指定的行 + collapseRow: function(target, id) { + target.collapseRow(id); + }, + // 展开所有的行 + expandAll: function(target) { + target.expandAll(); + }, + // 折叠所有的行 + collapseAll: function(target) { + target.collapseAll(); + }, + // 显示指定列 + showColumn: function(target,field) { + target.showColumn(field,true); + }, + // 隐藏指定列 + hideColumn: function(target,field) { + target.hideColumn(field,true); + } + // 组件的其他方法也可以进行类似封装........ + }; + + $.fn.bootstrapTreeTable.defaults = { + id: 'id', // 选取记录返回的值,用于设置父子关系 + parentId: 'parentId', // 用于设置父子关系 + rootIdValue: null, // 设置根节点id值----可指定根节点,默认为null,"",0,"0" + data: null, // 构造table的数据集合 + type: "GET", // 请求数据的ajax类型 + url: null, // 请求数据的ajax的url + ajaxParams: {}, // 请求数据的ajax的data属性 + expandColumn: 0, // 在哪一列上面显示展开按钮 + expandAll: false, // 是否全部展开 + expandFirst: false, // 是否默认第一级展开--expandAll为false时生效 + striped: false, // 是否各行渐变色 + bordered: true, // 是否显示边框 + hover: true, // 是否鼠标悬停 + condensed: false, // 是否紧缩表格 + columns: [], // 列 + toolbar: null, // 顶部工具条 + height: 0, // 表格高度 + showTitle: true, // 是否采用title属性显示字段内容(被formatter格式化的字段不会显示) + showColumns: true, // 是否显示内容列下拉框 + showRefresh: true, // 是否显示刷新按钮 + expanderExpandedClass: 'glyphicon glyphicon-chevron-down', // 展开的按钮的图标 + expanderCollapsedClass: 'glyphicon glyphicon-chevron-right' // 缩起的按钮的图标 + + }; })(jQuery); \ No newline at end of file diff --git a/src/main/resources/static/ruoyi/js/common.js b/src/main/resources/static/ruoyi/js/common.js index 47403985..d6e9d5f5 100644 --- a/src/main/resources/static/ruoyi/js/common.js +++ b/src/main/resources/static/ruoyi/js/common.js @@ -85,7 +85,18 @@ $(function() { $("#bootstrap-table").on("check.bs.table uncheck.bs.table check-all.bs.table uncheck-all.bs.table", function () { var ids = $("#bootstrap-table").bootstrapTable("getSelections"); $('#toolbar .btn-del').toggleClass('disabled', !ids.length); + $('#toolbar .btn-edit').toggleClass('disabled', ids.length!=1);; }); + // tree表格树 展开/折叠 + var expandFlag = false; + $("#expandAllBtn").click(function() { + if (expandFlag) { + $('#bootstrap-table').bootstrapTreeTable('expandAll'); + } else { + $('#bootstrap-table').bootstrapTreeTable('collapseAll'); + } + expandFlag = expandFlag ? false: true; + }) }); /** 创建选项卡 */ diff --git a/src/main/resources/static/ruoyi/js/ry-ui.js b/src/main/resources/static/ruoyi/js/ry-ui.js index 8ad92031..b2156cbe 100644 --- a/src/main/resources/static/ruoyi/js/ry-ui.js +++ b/src/main/resources/static/ruoyi/js/ry-ui.js @@ -132,14 +132,15 @@ init: function(options) { $.table._option = options; var treeTable = $('#bootstrap-table').bootstrapTreeTable({ - code : options.id, // 用于设置父子关系 - parentCode : options.parentId, // 用于设置父子关系 + id : options.id, // 用于设置父子关系 + parentId : options.parentId, // 用于设置父子关系 type: 'get', // 请求方式(*) url: options.url, // 请求后台的URL(*) ajaxParams : {}, // 请求数据的ajax的data属性 - expandColumn : '0', // 在哪一列上面显示展开按钮 + expandColumn : '1', // 在哪一列上面显示展开按钮 striped : false, // 是否各行渐变色 bordered : true, // 是否显示边框 + toolbar: '#toolbar', // 指定工作栏 expandAll : $.common.visible(options.expandAll), // 是否全部展开 columns: options.columns }); @@ -462,9 +463,25 @@ }, // 修改信息 edit: function(id) { - var url = $.table._option.updateUrl.replace("{id}", id); + var url = "/404.html"; + if ($.common.isNotEmpty(id)) { + url = $.table._option.updateUrl.replace("{id}", id); + } else { + var id = $.common.isEmpty($.table._option.id) ? $.table.selectFirstColumns() : $.table.selectColumns($.table._option.id); + url = $.table._option.updateUrl.replace("{id}", id); + } $.modal.open("修改" + $.table._option.modalName, url); }, + // 工具栏表格树修改 + editTree: function() { + var row = $('#bootstrap-table').bootstrapTreeTable('getSelections')[0]; + if ($.common.isEmpty(row)) { + $.modal.alertWarning("请至少选择一条记录"); + return; + } + var url = $.table._option.updateUrl.replace("{id}", row[$.table._option.id]); + $.modal.open("修改" + $.table._option.modalName, url); + }, // 添加信息 全屏 addFull: function(id) { var url = $.common.isEmpty(id) ? $.table._option.createUrl : $.table._option.createUrl.replace("{id}", id); @@ -472,7 +489,13 @@ }, // 修改信息 全屏 editFull: function(id) { - var url = $.table._option.updateUrl.replace("{id}", id); + var url = "/404.html"; + if ($.common.isNotEmpty(id)) { + url = $.table._option.updateUrl.replace("{id}", id); + } else { + var row = $.common.isEmpty($.table._option.id) ? $.table.selectFirstColumns() : $.table.selectColumns($.table._option.id); + url = $.table._option.updateUrl.replace("{id}", row); + } $.modal.openFull("修改" + $.table._option.modalName, url); }, // 保存信息 diff --git a/src/main/resources/templates/main.html b/src/main/resources/templates/main.html index 7c108dbb..7d202429 100644 --- a/src/main/resources/templates/main.html +++ b/src/main/resources/templates/main.html @@ -105,6 +105,7 @@
      +
    1. 升级SpringBoot到最新版本2.0.5
    2. 升级poi到最新版3.17
    3. 导出修改临时目录绝对路径
    4. 升级laydate升级到最新版5.0.9
    5. @@ -116,6 +117,7 @@
    6. 新增表格检索折叠按钮
    7. 新增清空(登录、操作、调度)日志
    8. 固定按钮位置(提交/关闭)
    9. +
    10. 部门/菜单支持(展开/折叠)
    11. 部分细节调整优化
    12. 项目采用分模块
    diff --git a/src/main/resources/templates/monitor/job/job.html b/src/main/resources/templates/monitor/job/job.html index 73f7aa50..2ac1b420 100644 --- a/src/main/resources/templates/monitor/job/job.html +++ b/src/main/resources/templates/monitor/job/job.html @@ -25,7 +25,7 @@
  •  搜索 -  导出 +  重置
  • @@ -33,15 +33,21 @@
    diff --git a/src/main/resources/templates/monitor/online/online.html b/src/main/resources/templates/monitor/online/online.html index 1adb9d0b..34cf0e2a 100644 --- a/src/main/resources/templates/monitor/online/online.html +++ b/src/main/resources/templates/monitor/online/online.html @@ -28,7 +28,7 @@ diff --git a/src/main/resources/templates/system/config/config.html b/src/main/resources/templates/system/config/config.html index 098a5632..38fb9804 100644 --- a/src/main/resources/templates/system/config/config.html +++ b/src/main/resources/templates/system/config/config.html @@ -30,7 +30,7 @@
  •  搜索 -  导出 +  重置
  • @@ -38,12 +38,18 @@
    diff --git a/src/main/resources/templates/system/dept/dept.html b/src/main/resources/templates/system/dept/dept.html index ae8ee10b..2c1d1322 100644 --- a/src/main/resources/templates/system/dept/dept.html +++ b/src/main/resources/templates/system/dept/dept.html @@ -29,8 +29,14 @@
    @@ -56,18 +62,23 @@ removeUrl: prefix + "/remove/{id}", modalName: "部门", columns: [{ + field: 'selectItem', + radio: true + }, + { field: 'deptName', title: '部门名称', + align: "left" }, { field: 'orderNum', title: '排序', - align: "center" + align: "left" }, { field: 'status', title: '状态', - align: "center", + align: "left", formatter: function(value, item, index) { return $.table.selectDictLabel(datas, item.status); } @@ -75,11 +86,11 @@ { field: 'createTime', title: '创建时间', - align: "center" + align: "left" }, { title: '操作', - align: 'center', + align: 'left', formatter: function(value, row, index) { if (row.parentId != 0) { var actions = []; diff --git a/src/main/resources/templates/system/dict/data/data.html b/src/main/resources/templates/system/dict/data/data.html index 2fa836bf..f38313cd 100644 --- a/src/main/resources/templates/system/dict/data/data.html +++ b/src/main/resources/templates/system/dict/data/data.html @@ -27,7 +27,7 @@
  •  搜索 -  导出 +  重置
  • @@ -36,11 +36,17 @@
    diff --git a/src/main/resources/templates/system/dict/type/type.html b/src/main/resources/templates/system/dict/type/type.html index cd3daa6c..fa1353d8 100644 --- a/src/main/resources/templates/system/dict/type/type.html +++ b/src/main/resources/templates/system/dict/type/type.html @@ -31,7 +31,7 @@
  •  搜索 -  导出 +  重置
  • @@ -39,12 +39,18 @@
    diff --git a/src/main/resources/templates/system/menu/menu.html b/src/main/resources/templates/system/menu/menu.html index f3e49c45..aee80197 100644 --- a/src/main/resources/templates/system/menu/menu.html +++ b/src/main/resources/templates/system/menu/menu.html @@ -29,8 +29,14 @@
    @@ -58,6 +64,10 @@ removeUrl: prefix + "/remove/{id}", modalName: "菜单", columns: [{ + field: 'selectItem', + radio: true + }, + { title: '菜单名称', field: 'menuName', width: '20%', @@ -73,19 +83,19 @@ field: 'orderNum', title: '排序', width: '10%', - align: "center" + align: "left" }, { field: 'url', title: '请求地址', width: '15%', - align: "center" + align: "left" }, { title: '类型', field: 'menuType', width: '10%', - align: "center", + align: "left", formatter: function(value, item, index) { if (item.menuType == 'M') { return '目录'; @@ -102,7 +112,7 @@ field: 'visible', title: '可见', width: '10%', - align: "center", + align: "left", formatter: function(value, row, index) { return $.table.selectDictLabel(datas, row.visible); } @@ -111,12 +121,12 @@ field: 'perms', title: '权限标识', width: '15%', - align: "center", + align: "left", }, { title: '操作', width: '20%', - align: "center", + align: "left", formatter: function(value, row, index) { var actions = []; actions.push('编辑 '); diff --git a/src/main/resources/templates/system/notice/notice.html b/src/main/resources/templates/system/notice/notice.html index d5cbc646..e66158e4 100644 --- a/src/main/resources/templates/system/notice/notice.html +++ b/src/main/resources/templates/system/notice/notice.html @@ -32,9 +32,12 @@
    @@ -33,12 +33,18 @@
    diff --git a/src/main/resources/templates/system/role/role.html b/src/main/resources/templates/system/role/role.html index 7f8213e5..7c20e75c 100644 --- a/src/main/resources/templates/system/role/role.html +++ b/src/main/resources/templates/system/role/role.html @@ -31,7 +31,7 @@
  •  搜索 -  导出 +  重置
  • @@ -39,12 +39,18 @@
    diff --git a/src/main/resources/templates/system/user/user.html b/src/main/resources/templates/system/user/user.html index a227a85c..e0484f13 100644 --- a/src/main/resources/templates/system/user/user.html +++ b/src/main/resources/templates/system/user/user.html @@ -56,7 +56,7 @@
  •  搜索 -  导出 +  重置
  • @@ -64,12 +64,18 @@
    diff --git a/src/main/resources/templates/vm/html/list.html.vm b/src/main/resources/templates/vm/html/list.html.vm index 18d6e305..2f9605d8 100644 --- a/src/main/resources/templates/vm/html/list.html.vm +++ b/src/main/resources/templates/vm/html/list.html.vm @@ -5,9 +5,12 @@