冻结列适配固定高度

master
RuoYi 5 years ago committed by Limy
parent 7adbffd54a
commit 0462fb89cd

@ -108,12 +108,10 @@ public class SysDeptController extends BaseController
{ {
return error("修改部门'" + dept.getDeptName() + "'失败,部门名称已存在"); return error("修改部门'" + dept.getDeptName() + "'失败,部门名称已存在");
} }
else if (dept.getParentId().equals(dept.getDeptId()))
if(dept.getParentId().equals(dept.getDeptId()))
{ {
return error("修改部门'" + dept.getDeptName() + "'失败,上级部门不能是自己"); return error("修改部门'" + dept.getDeptName() + "'失败,上级部门不能是自己");
} }
dept.setUpdateBy(ShiroUtils.getLoginName()); dept.setUpdateBy(ShiroUtils.getLoginName());
return toAjax(deptService.updateDept(dept)); return toAjax(deptService.updateDept(dept));
} }

@ -1,6 +1,6 @@
/** /**
* 基于bootstrap-table-fixed-columns修改 * 基于bootstrap-table-fixed-columns修改
* 支持左右列冻结 * 支持左右列冻结支持固定高度
* Copyright (c) 2019 ruoyi * Copyright (c) 2019 ruoyi
*/ */
(function ($) { (function ($) {
@ -22,17 +22,25 @@
this.timeoutHeaderColumns_ = 0; this.timeoutHeaderColumns_ = 0;
this.timeoutBodyColumns_ = 0; this.timeoutBodyColumns_ = 0;
if (this.options.fixedColumns) { if (this.options.fixedColumns) {
this.$fixedBody = $([ this.$fixedHeader = $([
'<div class="left-fixed-table-columns">', '<div class="left-fixed-table-columns">',
'<table>', '<table>',
'<thead></thead>', '<thead></thead>',
'<tbody></tbody>',
'</table>', '</table>',
'</div>'].join('')); '</div>'].join(''));
this.$fixedHeader.find('table').attr('class', this.$el.attr('class'));
this.$fixedHeaderColumns = this.$fixedHeader.find('thead');
this.$tableHeader.before(this.$fixedHeader);
this.$fixedBody = $([
'<div class="left-fixed-body-columns">',
'<table>',
'<tbody></tbody>',
'</table>',
'</div>'].join(''));
this.$fixedBody.find('table').attr('class', this.$el.attr('class')); this.$fixedBody.find('table').attr('class', this.$el.attr('class'));
this.$fixedHeaderColumns = this.$fixedBody.find('thead');
this.$fixedBodyColumns = this.$fixedBody.find('tbody'); this.$fixedBodyColumns = this.$fixedBody.find('tbody');
this.$tableBody.before(this.$fixedBody); this.$tableBody.before(this.$fixedBody);
} }
@ -167,12 +175,11 @@
if (that.options.detailView && !that.options.cardView) { if (that.options.detailView && !that.options.cardView) {
index = i - 1; index = i - 1;
} }
that.$fixedHeader.find('thead th[data-field="' + visibleFields[index] + '"]')
that.$fixedBody.find('thead th[data-field="' + visibleFields[index] + '"]') .find('.fht-cell').width($this.innerWidth());
.find('.fht-cell').width($this.innerWidth() - 1);
headerWidth += $this.outerWidth(); headerWidth += $this.outerWidth();
}); });
this.$fixedBody.width(headerWidth - 1).show(); this.$fixedHeader.width(headerWidth + 2).show();
} }
if (that.options.rightFixedColumns) { if (that.options.rightFixedColumns) {
this.$body.find('tr:first-child:not(.no-records-found) > *').each(function (i) { this.$body.find('tr:first-child:not(.no-records-found) > *').each(function (i) {
@ -197,8 +204,8 @@
BootstrapTable.prototype.fitBodyColumns = function () { BootstrapTable.prototype.fitBodyColumns = function () {
var that = this, var that = this,
top = -(parseInt(this.$el.css('margin-top')) - 2), top = -(parseInt(this.$el.css('margin-top'))),
height = this.$tableBody.height() - 2; height = this.$tableBody.height();
if (that.options.fixedColumns) { if (that.options.fixedColumns) {
if (!this.$body.find('> tr[data-index]').length) { if (!this.$body.find('> tr[data-index]').length) {
@ -206,8 +213,23 @@
return; return;
} }
if (!this.options.height) {
top = this.$fixedHeader.height()- 1;
height = height - top;
}
this.$fixedBody.css({
width: this.$fixedHeader.width(),
height: height,
top: top + 1
}).show();
this.$body.find('> tr').each(function (i) { this.$body.find('> tr').each(function (i) {
that.$fixedBody.find('tbody tr:eq(' + i + ')').height($(this).height()); that.$fixedBody.find('tr:eq(' + i + ')').height($(this).height() - 0.5);
var thattds = this;
that.$fixedBody.find('tr:eq(' + i + ')').find('td').each(function (j) {
$(this).width($($(thattds).find('td')[j]).width() + 1);
});
}); });
$.btTable.on("check.bs.table uncheck.bs.table", function (e, rows, $element) { $.btTable.on("check.bs.table uncheck.bs.table", function (e, rows, $element) {

@ -816,14 +816,31 @@ label {
} }
/** 表格冻结列样式 **/ /** 表格冻结列样式 **/
.left-fixed-table-columns{ .left-fixed-table-columns, .left-fixed-body-columns {
position: absolute; position: absolute;
background-color: #fff; background-color: #fff;
display: none; display: none;
border-right:1px solid #ddd; box-sizing: border-box;
overflow: hidden; overflow: hidden;
} }
.left-fixed-table-columns .table, .left-fixed-body-columns .table {
border-right: 1px solid #ddd;
}
.left-fixed-table-columns .table.table-no-bordered, .left-fixed-body-columns .table.table-no-bordered {
border-right: 1px solid transparent;
}
.left-fixed-body-columns table {
position: absolute;
animation: none;
}
.bootstrap-table .table-hover > tbody > tr.hover > td {
background-color: #f5f5f5;
}
.right-fixed-table-columns{ .right-fixed-table-columns{
position: absolute; position: absolute;
right:63px; right:63px;

@ -74,7 +74,7 @@
下面这个示例展示了如何在表单向导中使用 jQuery Validation 插件 下面这个示例展示了如何在表单向导中使用 jQuery Validation 插件
</p> </p>
<form id="form" action="http://www.zi-han.net/theme/hplus/form_wizard.html#" class="wizard-big"> <form id="form" action="" class="wizard-big">
<h1>账户</h1> <h1>账户</h1>
<fieldset> <fieldset>
<h2>账户信息</h2> <h2>账户信息</h2>

Loading…
Cancel
Save