冻结列适配固定高度

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() + "'失败,部门名称已存在");
}
if(dept.getParentId().equals(dept.getDeptId()))
else if (dept.getParentId().equals(dept.getDeptId()))
{
return error("修改部门'" + dept.getDeptName() + "'失败,上级部门不能是自己");
}
dept.setUpdateBy(ShiroUtils.getLoginName());
return toAjax(deptService.updateDept(dept));
}

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

@ -816,14 +816,31 @@ label {
}
/** 表格冻结列样式 **/
.left-fixed-table-columns{
.left-fixed-table-columns, .left-fixed-body-columns {
position: absolute;
background-color: #fff;
display: none;
border-right:1px solid #ddd;
box-sizing: border-box;
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{
position: absolute;
right:63px;

@ -74,7 +74,7 @@
下面这个示例展示了如何在表单向导中使用 jQuery Validation 插件
</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>
<fieldset>
<h2>账户信息</h2>

Loading…
Cancel
Save