innov
/
bee-table
1
0
Fork 0
Code Issues Pull Requests 3 Projects Releases Wiki Activity

fix:错行问题

This commit is contained in:
yangchch6 2019-08-17 11:36:55 +08:00
parent ca50a4c766
commit de7450e50b
4 changed files with 27 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
build/Table.js
View File

@ -462,7 +462,7 @@ var Table = function (_Component) {
this.domWidthDiff = this.contentDomWidth - this.contentWidth;
}
if (this.computeWidth <= this.contentWidth) {
if (this.computeWidth < this.contentWidth) {
var contentWidthDiff = this.scrollbarWidth ? this.contentWidth - this.computeWidth - this.scrollbarWidth : this.contentWidth - this.computeWidth;
//bordered的表格需要减去边框的差值1
if (this.props.bordered) {
@ -1097,7 +1097,7 @@ var Table = function (_Component) {
if (fixed) {
if (this.domWidthDiff > 0) {
headStyle.overflow = 'hidden';
innerBodyStyle.overflowX = 'scroll'; //兼容expand场景、子表格含有固定列的场景
innerBodyStyle.overflowX = 'auto'; //兼容expand场景、子表格含有固定列的场景
} else {
bodyStyle.marginBottom = '-' + scrollbarWidth + 'px';
}

37
dist/demo.js vendored
View File

@ -34405,7 +34405,7 @@
return this.props.expandedRowKeys || this.state.expandedRowKeys;
};
Table.prototype.getHeader = function getHeader(columns, fixed) {
Table.prototype.getHeader = function getHeader(columns, fixed, leftFixedWidth, rightFixedWidth) {
var _props = this.props,
filterDelay = _props.filterDelay,
onFilterChange = _props.onFilterChange,
@ -34470,7 +34470,9 @@
contentDomWidth: this.contentDomWidth,
scrollbarWidth: this.scrollbarWidth,
headerScroll: headerScroll,
bordered: bordered
bordered: bordered,
leftFixedWidth: leftFixedWidth,
rightFixedWidth: rightFixedWidth
})) : null;
};
@ -34893,6 +34895,8 @@
var bodyStyle = _extends({}, this.props.bodyStyle);
var headStyle = {};
var innerBodyStyle = {};
var leftFixedWidth = this.columnManager.getLeftColumnsWidth(this.contentWidth);
var rightFixedWidth = this.columnManager.getRightColumnsWidth(this.contentWidth);
var tableClassName = '';
//表格元素的宽度大于容器的宽度也显示滚动条
@ -34945,7 +34949,7 @@
if (fixed) {
if (this.domWidthDiff > 0) {
headStyle.overflow = 'hidden';
innerBodyStyle.overflowX = 'auto'; //兼容expand场景、子表格含有固定列的场景
innerBodyStyle.overflowX = 'scroll'; //兼容expand场景、子表格含有固定列的场景
} else {
bodyStyle.marginBottom = '-' + scrollbarWidth + 'px';
}
@ -34993,7 +34997,7 @@
'table',
{ className: ' ' + tableClassName + ' table-bordered ' + _drag_class + ' ', style: tableStyle },
_this4.getColGroup(columns, fixed),
hasHead ? _this4.getHeader(columns, fixed) : null,
hasHead ? _this4.getHeader(columns, fixed, leftFixedWidth, rightFixedWidth) : null,
tableBody
);
};
@ -35062,8 +35066,8 @@
)
);
}
var leftFixedWidth = this.columnManager.getLeftColumnsWidth(this.contentWidth);
var rightFixedWidth = this.columnManager.getRightColumnsWidth(this.contentWidth);
// const leftFixedWidth = this.columnManager.getLeftColumnsWidth(this.contentWidth);
// const rightFixedWidth = this.columnManager.getRightColumnsWidth(this.contentWidth);
var expandIconWidth = expandIconAsCell ? 33 : 0;
var parStyle = {};
if (!fixed) {
@ -37592,7 +37596,9 @@
contentTable = _this$props2.contentTable,
headerScroll = _this$props2.headerScroll,
lastShowIndex = _this$props2.lastShowIndex,
onDraggingBorder = _this$props2.onDraggingBorder;
onDraggingBorder = _this$props2.onDraggingBorder,
leftFixedWidth = _this$props2.leftFixedWidth,
rightFixedWidth = _this$props2.rightFixedWidth;
_utils.Event.stopPropagation(e);
var event = _utils.Event.getEvent(e);
@ -37624,11 +37630,11 @@
_this.table.cols[lastShowIndex].style.width = lastWidth + "px"; //同步表头
_this.table.tableBodyCols[lastShowIndex].style.width = lastWidth + "px"; //同步表体
}
var showScroll = contentDomWidth - (_this.drag.tableWidth + diff) - scrollbarWidth;
var showScroll = contentDomWidth - (leftFixedWidth + rightFixedWidth) - (_this.drag.tableWidth + diff) - scrollbarWidth;
//表头滚动条处理
if (headerScroll) {
if (showScroll < 0) {
//小于 0 出现滚动条
//找到固定列表格，设置表头的marginBottom值为scrollbarWidth;
_this.table.contentTableHeader.style.overflowX = 'scroll';
_this.optTableMargin(_this.table.fixedLeftHeaderTable, scrollbarWidth);
@ -37637,20 +37643,20 @@
// fixedRighHeadertTable && (fixedRighHeadertTable.style.marginBottom = scrollbarWidth + "px");
//todo inner scroll-x去掉；outer marginbottom 设置成-15px】
} else {
//大于 0 不显示滚动条
_this.table.contentTableHeader.style.overflowX = 'hidden';
_this.optTableMargin(_this.table.fixedLeftHeaderTable, 0);
_this.optTableMargin(_this.table.fixedRighHeadertTable, 0);
}
} else {
console.log('showScroll: ', showScroll);
if (showScroll < 0) {
// this.optTableMargin( this.table.fixedLeftBodyTable,'-'+scrollbarWidth);
// this.optTableMargin( this.table.fixedRightBodyTable,'-'+scrollbarWidth);
_this.optTableMargin(_this.table.fixedLeftBodyTable, 0);
_this.optTableMargin(_this.table.fixedRightBodyTable, 0);
_this.table.tableBody.style.overflowX = 'auto';
_this.optTableMargin(_this.table.fixedLeftBodyTable, '-' + scrollbarWidth);
_this.optTableMargin(_this.table.fixedRightBodyTable, '-' + scrollbarWidth);
_this.optTableScroll(_this.table.fixedLeftBodyTable, { x: 'scroll' });
_this.optTableScroll(_this.table.fixedRightBodyTable, { x: 'scroll' });
} else {
_this.table.tableBody.style.overflowX = 'hidden';
_this.optTableMargin(_this.table.fixedLeftBodyTable, 0);
_this.optTableMargin(_this.table.fixedRightBodyTable, 0);
_this.optTableScroll(_this.table.fixedLeftBodyTable, { x: 'auto' });
@ -37701,7 +37707,7 @@
var innerTable = table.querySelector('.u-table-body-inner');
if (innerTable) {
//fixbug: 拖拽列宽后，滚动条滚到表格底部，会导致固定列和非固定列错行
// overflow.x && (innerTable.style.overflowX = overflow.x);
overflow.x && (innerTable.style.overflowX = overflow.x);
overflow.y && (innerTable.style.overflowY = overflow.y);
}
}
@ -37969,6 +37975,7 @@
table.cols = tableDome.getElementsByTagName("col");
table.ths = tableDome.getElementsByTagName("th");
table.tr = tableDome.getElementsByTagName("tr");
table.tableBody = contentTable.querySelector('.u-table-scroll .u-table-body') && contentTable.querySelector('.u-table-scroll .u-table-body');
table.tableBodyCols = contentTable.querySelector('.u-table-scroll .u-table-body') && contentTable.querySelector('.u-table-scroll .u-table-body').getElementsByTagName("col");
}

2
dist/demo.js.map vendored
View File

File diff suppressed because one or more lines are too long

4
src/Table.js
View File

@ -298,7 +298,7 @@ class Table extends Component {
this.domWidthDiff = this.contentDomWidth - this.contentWidth;
}
if (this.computeWidth <= this.contentWidth) {
if (this.computeWidth < this.contentWidth) {
let contentWidthDiff = this.scrollbarWidth?this.contentWidth - this.computeWidth-this.scrollbarWidth:this.contentWidth - this.computeWidth;
//bordered的表格需要减去边框的差值1
if(this.props.bordered){
@ -942,7 +942,7 @@ class Table extends Component {
if(fixed){
if(this.domWidthDiff > 0){
headStyle.overflow = 'hidden';
innerBodyStyle.overflowX = 'scroll'; //兼容expand场景、子表格含有固定列的场景
innerBodyStyle.overflowX = 'auto'; //兼容expand场景、子表格含有固定列的场景
}else{
bodyStyle.marginBottom = `-${scrollbarWidth}px`;
}