From bc6841b82d0a02429a13b01838d19a6aab62b416 Mon Sep 17 00:00:00 2001 From: wanghaoo Date: Tue, 26 Feb 2019 16:57:47 +0800 Subject: [PATCH] =?UTF-8?q?fix(fix:=E6=8B=96=E6=8B=BD=E5=88=97=E5=AE=BD?= =?UTF-8?q?=EF=BC=8C=E6=BB=9A=E5=8A=A8=E6=9D=A1=E5=8A=A8=E6=80=81=E6=94=B9?= =?UTF-8?q?=E5=8F=98=EF=BC=9Bfix:=E4=B8=A4=E4=B8=AA=E6=BB=9A=E5=8A=A8?= =?UTF-8?q?=E6=9D=A1=E8=81=94=E5=8A=A8bug=EF=BC=9Bfix:=E6=8B=96=E6=8B=BD?= =?UTF-8?q?=E8=BF=BD=E5=90=8E=E4=B8=80=E5=88=97=E8=B6=85=E5=87=BA=E5=86=85?= =?UTF-8?q?=E5=AE=B9=E9=9A=90=E8=97=8F):?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- build/Table.css | 4 +-- build/Table.js | 10 ++----- build/TableHeader.js | 67 ++++++++++++++++++++++++++++++++++---------- package.json | 2 +- 4 files changed, 57 insertions(+), 26 deletions(-) diff --git a/build/Table.css b/build/Table.css index baa96e6..7c57191 100644 --- a/build/Table.css +++ b/build/Table.css @@ -199,8 +199,6 @@ .u-table td { padding: 12px 8px; word-break: break-all; } - .u-table tr th:last-child { - overflow: hidden; } .u-table tr.filterable th { padding-top: 4px; padding-bottom: 4px; } @@ -221,6 +219,8 @@ .u-table-bordered td { border-right: 1px solid rgb(233,233,233); box-sizing: border-box; } + .u-table-drag-border tr th.th-can-not-drag { + overflow: hidden; } .u-table-header { overflow: hidden; background: rgb(247,247,247); diff --git a/build/Table.js b/build/Table.js index 23fecab..ef1e5ec 100644 --- a/build/Table.js +++ b/build/Table.js @@ -144,8 +144,7 @@ var defaultProps = { syncHover: true, setRowHeight: function setRowHeight() {}, setRowParentIndex: function setRowParentIndex() {}, - tabIndex: '0', - noExpandedRowKeys: [] + tabIndex: '0' }; var Table = function (_Component) { @@ -729,11 +728,6 @@ var Table = function (_Component) { if (rootIndex == -1) { index = i + lazyParentIndex; } - var noexpandable = void 0; - if (props.noExpandedRowKeys.indexOf(key) >= 0) { - noexpandable = true; - isHiddenExpandIcon = true; - } rst.push(_react2["default"].createElement(_TableRow2["default"], _extends({ indent: indent, indentSize: props.indentSize, @@ -746,7 +740,7 @@ var Table = function (_Component) { visible: visible, expandRowByClick: expandRowByClick, onExpand: this.onExpanded, - expandable: !noexpandable && (childrenColumn || expandedRowRender), + expandable: childrenColumn || expandedRowRender, expanded: isRowExpanded, clsPrefix: props.clsPrefix + '-row', childrenColumnName: childrenColumnName, diff --git a/build/TableHeader.js b/build/TableHeader.js index c217aac..e66d843 100644 --- a/build/TableHeader.js +++ b/build/TableHeader.js @@ -50,6 +50,24 @@ var TableHeader = function (_Component) { var _this = _possibleConstructorReturn(this, _Component.call(this, props)); + _this.optTableMargin = function (table, scrollbarWidth) { + if (table) { + table.style.marginBottom = scrollbarWidth + "px"; + } + }; + + _this.optTableScroll = function (table) { + var overflow = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; + + if (table) { + var innerTable = table.querySelector('.u-table-body-inner'); + if (innerTable) { + overflow.x && (innerTable.style.overflowX = overflow.x); + overflow.y && (innerTable.style.overflowY = overflow.y); + } + } + }; + _this.onLineMouseMove = function (e) { var _this$props = _this.props, clsPrefix = _this$props.clsPrefix, @@ -77,30 +95,43 @@ var TableHeader = function (_Component) { if (_this.fixedTable.cols) { _this.fixedTable.cols[_this.drag.currIndex].style.width = newWidth + "px"; } + var oldTableWidth = parseInt(_this.table.table.style.width ? _this.table.table.style.width : _this.table.table.scrollWidth); + var newTableWidth = oldTableWidth + diff; + _this.table.table.style.width = newTableWidth; //改变table的width + + var showScroll = contentDomWidth - newTableWidth - scrollbarWidth; + var fixedLeftHeaderTable = contentTable.querySelector('.u-table-fixed-left .u-table-header'); + var fixedRighHeadertTable = contentTable.querySelector('.u-table-fixed-right .u-table-header'); + var contentTableHeader = contentTable.querySelector('.u-table-scroll .u-table-header'); + var fixedLeftBodyTable = contentTable.querySelector('.u-table-fixed-left .u-table-body-outer'); + var fixedRightBodyTable = contentTable.querySelector('.u-table-fixed-right .u-table-body-outer'); //表头滚动条处理 if (headerScroll) { - var oldTableWidth = parseInt(_this.table.table.style.width ? _this.table.table.style.width : _this.table.table.scrollWidth); - var newTableWidth = oldTableWidth + diff; - _this.table.table.style.width = newTableWidth; //改变table的width - - var showScroll = contentDomWidth - newTableWidth - scrollbarWidth; - // if(bordered){ - // showScroll = showScroll -1; - // } - var fixedLeftHeaderTable = contentTable.querySelector('.u-table-fixed-left .u-table-header'); - var fixedRighHeadertTable = contentTable.querySelector('.u-table-fixed-right .u-table-header'); - var contentTableHeader = contentTable.querySelector('.u-table-scroll .u-table-header'); if (showScroll < 0) { //找到固定列表格，设置表头的marginBottom值为scrollbarWidth; contentTableHeader.style.overflowX = 'scroll'; - fixedLeftHeaderTable && (fixedLeftHeaderTable.style.marginBottom = scrollbarWidth + "px"); - fixedRighHeadertTable && (fixedRighHeadertTable.style.marginBottom = scrollbarWidth + "px"); + _this.optTableMargin(fixedLeftHeaderTable, scrollbarWidth); + _this.optTableMargin(fixedRighHeadertTable, scrollbarWidth); + // fixedLeftHeaderTable && (fixedLeftHeaderTable.style.marginBottom = scrollbarWidth + "px"); + // fixedRighHeadertTable && (fixedRighHeadertTable.style.marginBottom = scrollbarWidth + "px"); //todo inner scroll-x去掉；outer marginbottom 设置成-15px】 } else { contentTableHeader.style.overflowX = 'hidden'; - fixedLeftHeaderTable && (fixedLeftHeaderTable.style.marginBottom = '0px'); - fixedRighHeadertTable && (fixedRighHeadertTable.style.marginBottom = '0px'); + _this.optTableMargin(fixedLeftHeaderTable, 0); + _this.optTableMargin(fixedRighHeadertTable, 0); + } + } else { + if (showScroll < 0) { + _this.optTableMargin(fixedLeftBodyTable, '-' + scrollbarWidth); + _this.optTableMargin(fixedRightBodyTable, '-' + scrollbarWidth); + _this.optTableScroll(fixedLeftBodyTable, { x: 'scroll' }); + _this.optTableScroll(fixedRightBodyTable, { x: 'scroll' }); + } else { + _this.optTableMargin(fixedLeftBodyTable, 0); + _this.optTableMargin(fixedRightBodyTable, 0); + _this.optTableScroll(fixedLeftBodyTable, { x: 'auto' }); + _this.optTableScroll(fixedRightBodyTable, { x: 'auto' }); } } } @@ -460,6 +491,12 @@ var TableHeader = function (_Component) { } } }; + /** + *相关滚动条联动操作 + * + * @memberof TableHeader + */ + /** * 调整列宽的move事件 diff --git a/package.json b/package.json index df3b517..6fb4ea7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bee-table", - "version": "1.6.43", + "version": "1.6.44", "description": "Table ui component for react", "keywords": [ "react",