增强 table height 选项,支持函数 (#1437)

pull/1442/head
贤心 1 year ago committed by GitHub
commit a8cecfc2a0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -123,6 +123,17 @@
- `height: 'full-30'` 设置相对可视屏幕的高度铺满。这是一个特定的语法格式:`full` 表示铺满;后面的数字表示当前 table 之外的元素占用的高度,如:表格头部到页面最顶部*加*表格底部距离页面最底部的“距离和” - `height: 'full-30'` 设置相对可视屏幕的高度铺满。这是一个特定的语法格式:`full` 表示铺满;后面的数字表示当前 table 之外的元素占用的高度,如:表格头部到页面最顶部*加*表格底部距离页面最底部的“距离和”
- `height: '#id-30'` 设置相对父元素的高度铺满,其中 `#id` 即父元素的 ID 选择器,其计算原理和上述 `full` 相同。 - `height: '#id-30'` 设置相对父元素的高度铺满,其中 `#id` 即父元素的 ID 选择器,其计算原理和上述 `full` 相同。
**函数写法** <sup>2.9.1+</sup>
当需要动态改变表格高度时建议使用,如下以等效 `full-xx` 的写法为例:
```
height: function(){
var otherHeight = $('#search-content').outerHeight(); // 自定义其他区域的高度
return $(window).height() - otherHeight; // 返回 number 类型
}
```
</td> </td>
<td>number<br>string</td> <td>number<br>string</td>
<td>-</td> <td>-</td>

@ -360,6 +360,9 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
that.parentHeightGap = parentDiv.pop(); that.parentHeightGap = parentDiv.pop();
that.parentDiv = parentDiv.join("-"); that.parentDiv = parentDiv.join("-");
options.height = $(that.parentDiv).height() - (parseFloat(that.parentHeightGap) || 0); options.height = $(that.parentDiv).height() - (parseFloat(that.parentHeightGap) || 0);
} else if (typeof options.height === "function"){
that.customHeightFunc = options.height;
options.height = that.customHeightFunc();
} }
// 开始插入替代元素 // 开始插入替代元素
@ -1727,15 +1730,19 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
var options = that.config; var options = that.config;
var height = options.height; var height = options.height;
var bodyHeight; var bodyHeight;
var MIN_HEIGHT = 135;
if(that.fullHeightGap){ if(that.fullHeightGap){
height = _WIN.height() - that.fullHeightGap; height = _WIN.height() - that.fullHeightGap;
if(height < 135) height = 135; if(height < MIN_HEIGHT) height = MIN_HEIGHT;
// that.elem.css('height', height); // that.elem.css('height', height);
} else if (that.parentDiv && that.parentHeightGap) { } else if (that.parentDiv && that.parentHeightGap) {
height = $(that.parentDiv).height() - that.parentHeightGap; height = $(that.parentDiv).height() - that.parentHeightGap;
if (height < 135) height = 135; if(height < MIN_HEIGHT) height = MIN_HEIGHT;
// that.elem.css("height", height); // that.elem.css("height", height);
} else if (that.customHeightFunc) {
height = that.customHeightFunc();
if(height < MIN_HEIGHT) height = MIN_HEIGHT;
} }
// 如果多级表头,则填补表头高度 // 如果多级表头,则填补表头高度

Loading…
Cancel
Save