Completely updated React, fixed #11, (hopefully)

This commit is contained in:
2018-03-04 19:11:49 -05:00
parent 6e0afd6e2a
commit 34e5f5139a
13674 changed files with 333464 additions and 473223 deletions

View File

@@ -1,3 +1,49 @@
<a name="v4.3.0"></a>
# [v4.3.0](https://github.com/AllenFang/react-bootstrap-table/compare/v4.2.0...v4.3.0) (2017-12-12)
## Bug fixes
* Fixed passing wrong key for custom `prePage`, `nextPage`, `firstPage` and `lastPage`([02363a9](https://github.com/AllenFang/react-bootstrap-table/commit/02363a9981a428632ba90b6403aabaef9010b5bf))
## Enhancements
* Upgrade `react-modal` to `3.1.7`
## Features
* Expand/Collapse all rows
* [Example](https://github.com/AllenFang/react-bootstrap-table/blob/master/examples/js/expandRow/expand-indicator.js#L74)
* [Customization](https://github.com/AllenFang/react-bootstrap-table/blob/master/examples/js/expandRow/custom-expand-indicator.js#L107)
* Support hide parent row when expanding([24c8556](https://github.com/AllenFang/react-bootstrap-table/commit/24c8556cde36cf5aaa337ebc39ac600a0a1b31d5))
* [Example](hideRowOnExpand)
<a name="v4.2.0"></a>
# [v4.2.0](https://github.com/AllenFang/react-bootstrap-table/compare/v4.1.5...v4.2.0) (2017-12-04)
## Bug fixes
* Fix bug about text filter for null value([a9eb1d0](https://github.com/AllenFang/react-bootstrap-table/commit/a9eb1d010ab75efe4abd84a5e23f09114f8d8b7b))
* Fix `expandParentClass` option concat classNames([64915a0](https://github.com/AllenFang/react-bootstrap-table/pull/1777/commits/64915a0efc535c98eba60137746fc65f72f86ec6))
## Enhancements
* No String ref([7c18851](https://github.com/AllenFang/react-bootstrap-table/commit/7c188513f73788e0556e2023b13f38de51a69288))
* Support `renderAlert` to specified if render the `react-s-alert`([ed57ab4](https://github.com/AllenFang/react-bootstrap-table/commit/ed57ab40c29cc326f0c5abff6763ef667b5498d8))
* Please check [#1771](https://github.com/AllenFang/react-bootstrap-table/issues/1771)
* The event object will be pass at least argument for `options.onExpand`, `options.onRowClick` and `options.onRowDoubleClick`([64915a0](https://github.com/AllenFang/react-bootstrap-table/commit/64915a0efc535c98eba60137746fc65f72f86ec6))
<a name="v4.1.5"></a>
# [v4.1.5](https://github.com/AllenFang/react-bootstrap-table/compare/v4.1.3...v4.1.5) (2017-11-20)
## Bug fixes
* Fixed the sort status doesn't updated internally when remote sort enable([06b3560](https://github.com/AllenFang/react-bootstrap-table/commit/06b356021e3364d0048f8aba8e934e07bb7a02fc))
## Enhancements
* `beforeSaveCell` and `afterSaveCell` will pass additional information on last one argument([db634db](https://github.com/AllenFang/react-bootstrap-table/commit/db634db0573995427b743cf3919b7b2f5824b1de))
## Features
* Support press ENTER to select row when enable keyboard navigation([b52e065](https://github.com/AllenFang/react-bootstrap-table/commit/b52e065397221d50a5a824ea6def990bb49e352c))
* Check [this](https://github.com/AllenFang/react-bootstrap-table/blob/master/examples/js/keyboard-nav/enter-to-select-row-with-nav-table.js) example
<a name="v4.1.2"></a>
<a name="v4.1.3"></a>
<a name="v4.1.4"></a>
# [v4.1.1](https://github.com/AllenFang/react-bootstrap-table/compare/v4.1.1...v4.1.3) (2017-11-11)
## Bug fixes
* Fixed data get sorted locally even with remote sorting([509e31a](https://github.com/AllenFang/react-bootstrap-table/commit/509e31ae3dee1c3cfc5024dcec15f0e14001f7e0),[0d57d95](https://github.com/AllenFang/react-bootstrap-table/commit/0d57d957f35d65b80dbace55036c0d4d61064f9f))
<a name="v4.1.1"></a>
# [v4.1.1](https://github.com/AllenFang/react-bootstrap-table/compare/v4.1.0...v4.1.1) (2017-10-25)
## Bug fixes

View File

@@ -261,6 +261,11 @@ td.react-bs-table-expand-cell {
cursor: pointer;
}
th.react-bs-table-expand-cell > div {
cursor: pointer;
}
@keyframes shake {
from, to {
transform: translate3d(0, 0, 0);

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -202,11 +202,19 @@ var BootstrapTable = function (_Component) {
_this._adjustHeaderWidth = _this._adjustHeaderWidth.bind(_this);
_this._adjustHeight = _this._adjustHeight.bind(_this);
_this._adjustTable = _this._adjustTable.bind(_this);
_this.toggleExpandAllChilds = _this.toggleExpandAllChilds.bind(_this);
var expandedKeys = [];
if (_this.props.options.expandAllChilds !== null && _this.props.options.expandAllChilds !== undefined && _this.props.options.expandAllChilds) {
expandedKeys = _this.store.getAllRowkey();
} else if (_this.props.options.expanding !== undefined && _this.props.options.expanding !== null) {
expandedKeys = _this.props.options.expanding;
}
_this.state = {
data: _this.getTableData(),
currPage: currPage,
expanding: _this.props.options.expanding || [],
expanding: expandedKeys,
sizePerPage: _this.props.options.sizePerPage || _Const2.default.SIZE_PER_PAGE_LIST[0],
selectedRowKeys: _this.store.getSelectedRowKeys(),
reset: false,
@@ -524,7 +532,7 @@ var BootstrapTable = function (_Component) {
var pageStartIndex = this.props.options.pageStartIndex;
this.store.clean();
this.refs.body.setState({ currEditCell: null });
this.body.setState({ currEditCell: null });
this.setState(function () {
return {
data: _this4.getTableData(),
@@ -577,8 +585,16 @@ var BootstrapTable = function (_Component) {
} else {
if (!this.allowRemote(_Const2.default.REMOTE_SORT)) {
data = this.store.sort().get();
newState.data = data;
} else {
var currentOptions = this.props.options;
var sortName = options.sortName;
var sortOrder = options.sortOrder;
if (currentOptions.sortName !== sortName || currentOptions.sortOrder !== sortOrder) {
this.store.setSortInfo(sortOrder, options.sortName);
}
}
newState.data = data;
}
this.setState(function () {
return newState;
@@ -591,9 +607,9 @@ var BootstrapTable = function (_Component) {
}
var sortList = this.store.getSortInfo();
var sortField = options.sortName;
var sortOrder = options.sortOrder;
if (sortField && sortOrder) {
this.store.setSortInfo(sortOrder, sortField);
var _sortOrder = options.sortOrder;
if (sortField && _sortOrder) {
this.store.setSortInfo(_sortOrder, sortField);
this.store.sort();
} else if (sortList.length > 0) {
this.store.sort();
@@ -647,9 +663,9 @@ var BootstrapTable = function (_Component) {
value: function componentDidMount() {
this._adjustTable();
window.addEventListener('resize', this._adjustTable);
this.refs.body.refs.container.addEventListener('scroll', this._scrollHeader);
this.body.container.addEventListener('scroll', this._scrollHeader);
if (this.props.footer) {
this.refs.body.refs.container.addEventListener('scroll', this._scrollFooter);
this.body.container.addEventListener('scroll', this._scrollFooter);
}
if (this.props.scrollTop) {
this._scrollTop();
@@ -659,10 +675,10 @@ var BootstrapTable = function (_Component) {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
window.removeEventListener('resize', this._adjustTable);
if (this.refs && this.refs.body && this.refs.body.refs) {
this.refs.body.refs.container.removeEventListener('scroll', this._scrollHeader);
if (this.body && this.body.container) {
this.body.container.removeEventListener('scroll', this._scrollHeader);
if (this.props.footer) {
this.refs.body.refs.container.removeEventListener('scroll', this._scrollFooter);
this.body.container.removeEventListener('scroll', this._scrollFooter);
}
}
if (this.filter) {
@@ -720,6 +736,8 @@ var BootstrapTable = function (_Component) {
}, {
key: 'render',
value: function render() {
var _this5 = this;
var style = {
height: this.props.height,
maxHeight: this.props.maxHeight
@@ -755,6 +773,8 @@ var BootstrapTable = function (_Component) {
var showToolbarOnTop = toolbarPosition !== _Const2.default.TOOLBAR_POS_BOTTOM;
var showToolbarOnBottom = toolbarPosition !== _Const2.default.TOOLBAR_POS_TOP;
var _props$options$hideRo = this.props.options.hideRowOnExpand,
hideRowOnExpand = _props$options$hideRo === undefined ? false : _props$options$hideRo;
return _react2.default.createElement(
'div',
@@ -764,7 +784,9 @@ var BootstrapTable = function (_Component) {
showPaginationOnTop ? pagination : null,
_react2.default.createElement(
'div',
{ ref: 'table',
{ ref: function ref(node) {
return _this5.table = node;
},
className: (0, _classnames2.default)('react-bs-table', { 'react-bs-table-bordered': this.props.bordered }, this.props.tableContainerClass),
style: _extends({}, style, this.props.tableStyle),
onMouseEnter: this.handleMouseEnter,
@@ -772,7 +794,9 @@ var BootstrapTable = function (_Component) {
_react2.default.createElement(
_TableHeader2.default,
{
ref: 'header',
ref: function ref(node) {
return _this5.header = node;
},
version: this.props.version,
colGroups: colGroups,
headerContainerClass: this.props.headerContainerClass,
@@ -792,10 +816,17 @@ var BootstrapTable = function (_Component) {
reset: this.state.reset,
expandColumnVisible: expandColumnOptions.expandColumnVisible,
expandColumnComponent: expandColumnOptions.expandColumnComponent,
expandedColumnHeaderComponent: expandColumnOptions.expandedColumnHeaderComponent,
noAnyExpand: this.state.expanding.length === 0,
expandAll: this.props.options.expandAll,
toggleExpandAllChilds: this.toggleExpandAllChilds,
expandColumnBeforeSelectColumn: expandColumnOptions.expandColumnBeforeSelectColumn },
this.props.children
),
_react2.default.createElement(_TableBody2.default, { ref: 'body',
_react2.default.createElement(_TableBody2.default, {
ref: function ref(node) {
return _this5.body = node;
},
bodyContainerClass: this.props.bodyContainerClass,
tableBodyClass: this.props.tableBodyClass,
style: _extends({}, style, this.props.bodyStyle),
@@ -835,13 +866,14 @@ var BootstrapTable = function (_Component) {
x: this.state.x,
y: this.state.y,
withoutTabIndex: this.props.withoutTabIndex,
hideRowOnExpand: hideRowOnExpand,
onEditCell: this.handleEditCell }),
tableFooter
),
tableFilter,
showPaginationOnBottom ? pagination : null,
showToolbarOnBottom ? toolBar : null,
_react2.default.createElement(_reactSAlert2.default, { stack: { limit: 3 } })
this.props.renderAlert ? _react2.default.createElement(_reactSAlert2.default, { stack: { limit: 3 } }) : null
);
}
}, {
@@ -936,20 +968,43 @@ var BootstrapTable = function (_Component) {
}
}, {
key: '__handleExpandRow__REACT_HOT_LOADER__',
value: function __handleExpandRow__REACT_HOT_LOADER__(expanding, rowKey, isRowExpanding) {
var _this5 = this;
value: function __handleExpandRow__REACT_HOT_LOADER__(expanding, rowKey, isRowExpanding, event) {
var _this6 = this;
var onExpand = this.props.options.onExpand;
if (onExpand) {
onExpand(rowKey, !isRowExpanding);
onExpand(rowKey, !isRowExpanding, event);
}
this.setState(function () {
return { expanding: expanding, reset: false };
}, function () {
_this5._adjustHeaderWidth();
_this6._adjustHeaderWidth();
});
}
}, {
key: 'toggleExpandAllChilds',
value: function toggleExpandAllChilds() {
var _this7 = this;
var expanding = this.state.expanding;
if (expanding.length > 0) {
this.setState(function () {
return {
expanding: [],
reset: false
};
});
} else {
this.setState(function () {
return {
expanding: _this7.store.getAllRowkey(),
reset: false
};
});
}
}
}, {
key: '__handlePaginationData__REACT_HOT_LOADER__',
value: function __handlePaginationData__REACT_HOT_LOADER__(page, sizePerPage) {
@@ -1031,7 +1086,7 @@ var BootstrapTable = function (_Component) {
if (y >= visibleRowSize) {
currPage++;
var lastPage = pagination ? this.refs.pagination.getLastPage() : -1;
var lastPage = pagination ? this.pagination.getLastPage() : -1;
if (currPage <= lastPage) {
this.handlePaginationData(currPage, this.state.sizePerPage);
} else {
@@ -1049,7 +1104,7 @@ var BootstrapTable = function (_Component) {
} else if (x >= visibleColumnSize) {
if (y + 1 === visibleRowSize) {
currPage++;
var _lastPage = pagination ? this.refs.pagination.getLastPage() : -1;
var _lastPage = pagination ? this.pagination.getLastPage() : -1;
if (currPage <= _lastPage) {
this.handlePaginationData(currPage, this.state.sizePerPage);
} else {
@@ -1082,13 +1137,13 @@ var BootstrapTable = function (_Component) {
}
}, {
key: '__handleRowClick__REACT_HOT_LOADER__',
value: function __handleRowClick__REACT_HOT_LOADER__(row, rowIndex, columnIndex) {
value: function __handleRowClick__REACT_HOT_LOADER__(row, rowIndex, columnIndex, event) {
var _props3 = this.props,
options = _props3.options,
keyBoardNav = _props3.keyBoardNav;
if (options.onRowClick) {
options.onRowClick(row, columnIndex, rowIndex);
options.onRowClick(row, columnIndex, rowIndex, event);
}
if (keyBoardNav) {
var _ref5 = (typeof keyBoardNav === 'undefined' ? 'undefined' : _typeof(keyBoardNav)) === 'object' ? keyBoardNav : {},
@@ -1108,9 +1163,9 @@ var BootstrapTable = function (_Component) {
}
}, {
key: '__handleRowDoubleClick__REACT_HOT_LOADER__',
value: function __handleRowDoubleClick__REACT_HOT_LOADER__(row) {
value: function __handleRowDoubleClick__REACT_HOT_LOADER__(row, event) {
if (this.props.options.onRowDoubleClick) {
this.props.options.onRowDoubleClick(row);
this.props.options.onRowDoubleClick(row, event);
}
}
}, {
@@ -1242,7 +1297,7 @@ var BootstrapTable = function (_Component) {
}, {
key: '__handleEditCell__REACT_HOT_LOADER__',
value: function __handleEditCell__REACT_HOT_LOADER__(newVal, rowIndex, colIndex) {
var _this6 = this;
var _this8 = this;
var beforeSaveCell = this.props.cellEdit.beforeSaveCell;
@@ -1250,9 +1305,9 @@ var BootstrapTable = function (_Component) {
var fieldName = columns[colIndex].name;
var invalid = function invalid() {
_this6.setState(function () {
_this8.setState(function () {
return {
data: _this6.store.get(),
data: _this8.store.get(),
reset: false
};
});
@@ -1261,14 +1316,15 @@ var BootstrapTable = function (_Component) {
if (beforeSaveCell) {
var beforeSaveCellCB = function beforeSaveCellCB(result) {
_this6.refs.body.cancelEditCell();
_this8.body.cancelEditCell();
if (result || result === undefined) {
_this6.editCell(newVal, rowIndex, colIndex);
_this8.editCell(newVal, rowIndex, colIndex);
} else {
invalid();
}
};
var isValid = beforeSaveCell(this.state.data[rowIndex], fieldName, newVal, beforeSaveCellCB);
var props = { rowIndex: rowIndex, colIndex: colIndex };
var isValid = beforeSaveCell(this.state.data[rowIndex], fieldName, newVal, beforeSaveCellCB, props);
if (isValid === false && typeof isValid !== 'undefined') {
return invalid();
} else if (isValid === _Const2.default.AWAIT_BEFORE_CELL_EDIT) {
@@ -1286,13 +1342,14 @@ var BootstrapTable = function (_Component) {
var columns = this.getColumnsDescription(this.props);
var fieldName = columns[colIndex].name;
var props = { rowIndex: rowIndex, colIndex: colIndex };
if (onCellEdit) {
newVal = onCellEdit(this.state.data[rowIndex], fieldName, newVal);
}
if (this.allowRemote(_Const2.default.REMOTE_CELL_EDIT)) {
if (afterSaveCell) {
afterSaveCell(this.state.data[rowIndex], fieldName, newVal);
afterSaveCell(this.state.data[rowIndex], fieldName, newVal, props);
}
return;
}
@@ -1306,7 +1363,7 @@ var BootstrapTable = function (_Component) {
});
if (afterSaveCell) {
afterSaveCell(this.state.data[rowIndex], fieldName, newVal);
afterSaveCell(this.state.data[rowIndex], fieldName, newVal, props);
}
}
}, {
@@ -1322,7 +1379,7 @@ var BootstrapTable = function (_Component) {
}, {
key: '__handleAddRow__REACT_HOT_LOADER__',
value: function __handleAddRow__REACT_HOT_LOADER__(newObj) {
var _this7 = this;
var _this9 = this;
var isAsync = false;
var onAddRow = this.props.options.onAddRow;
@@ -1330,7 +1387,7 @@ var BootstrapTable = function (_Component) {
var afterHandleAddRow = function afterHandleAddRow(errMsg) {
if (isAsync) {
_this7.refs.toolbar.afterHandleSaveBtnClick(errMsg);
_this9.toolbar.afterHandleSaveBtnClick(errMsg);
} else {
return errMsg;
}
@@ -1338,19 +1395,19 @@ var BootstrapTable = function (_Component) {
var afterAddRowCB = function afterAddRowCB(errMsg) {
if (typeof errMsg !== 'undefined' && errMsg !== '') return afterHandleAddRow(errMsg);
if (_this7.allowRemote(_Const2.default.REMOTE_INSERT_ROW)) {
if (_this7.props.options.afterInsertRow) {
_this7.props.options.afterInsertRow(newObj);
if (_this9.allowRemote(_Const2.default.REMOTE_INSERT_ROW)) {
if (_this9.props.options.afterInsertRow) {
_this9.props.options.afterInsertRow(newObj);
}
return afterHandleAddRow();
}
try {
_this7.store.add(newObj);
_this9.store.add(newObj);
} catch (e) {
return afterHandleAddRow(e.message);
}
_this7._handleAfterAddingRow(newObj, false);
_this9._handleAfterAddingRow(newObj, false);
return afterHandleAddRow();
};
@@ -1404,14 +1461,14 @@ var BootstrapTable = function (_Component) {
}, {
key: '__handleDropRow__REACT_HOT_LOADER__',
value: function __handleDropRow__REACT_HOT_LOADER__(rowKeys) {
var _this8 = this;
var _this10 = this;
var dropRowKeys = rowKeys ? rowKeys : this.store.getSelectedRowKeys();
// add confirm before the delete action if that option is set.
if (dropRowKeys && dropRowKeys.length > 0) {
if (this.props.options.handleConfirmDeleteRow) {
this.props.options.handleConfirmDeleteRow(function () {
_this8.deleteRow(dropRowKeys);
_this10.deleteRow(dropRowKeys);
}, dropRowKeys);
} else if (confirm('Are you sure you want to delete?')) {
this.deleteRow(dropRowKeys);
@@ -1421,7 +1478,7 @@ var BootstrapTable = function (_Component) {
}, {
key: 'deleteRow',
value: function deleteRow(dropRowKeys) {
var _this9 = this;
var _this11 = this;
var dropRow = this.store.getRowByKey(dropRowKeys);
var _props$options2 = this.props.options,
@@ -1458,7 +1515,7 @@ var BootstrapTable = function (_Component) {
this.setState(function () {
return {
data: result,
selectedRowKeys: _this9.store.getSelectedRowKeys(),
selectedRowKeys: _this11.store.getSelectedRowKeys(),
currPage: currPage,
reset: false
};
@@ -1469,7 +1526,7 @@ var BootstrapTable = function (_Component) {
return {
data: result,
reset: false,
selectedRowKeys: _this9.store.getSelectedRowKeys()
selectedRowKeys: _this11.store.getSelectedRowKeys()
};
});
}
@@ -1581,8 +1638,8 @@ var BootstrapTable = function (_Component) {
value: function __handleSearch__REACT_HOT_LOADER__(searchText) {
// Set search field if this function being called outside
// but it's not necessary if calling fron inside.
if (this.refs.toolbar) {
this.refs.toolbar.setSearchInput(searchText);
if (this.toolbar) {
this.toolbar.setSearchInput(searchText);
}
var search = this.props.autoCollapse.search;
var _props$options4 = this.props.options,
@@ -1639,6 +1696,8 @@ var BootstrapTable = function (_Component) {
}, {
key: 'renderPagination',
value: function renderPagination() {
var _this12 = this;
if (this.props.pagination) {
var dataSize = void 0;
if (this.allowRemote(_Const2.default.REMOTE_PAGE)) {
@@ -1654,7 +1713,10 @@ var BootstrapTable = function (_Component) {
'div',
{ className: 'react-bs-table-pagination' },
_react2.default.createElement(_PaginationList2.default, {
ref: 'pagination',
ref: function ref(node) {
return _this12.pagination = node;
},
version: this.props.version,
withFirstAndLast: withFirstAndLast,
alwaysShowAllBtns: options.alwaysShowAllBtns,
currPage: this.state.currPage,
@@ -1687,6 +1749,8 @@ var BootstrapTable = function (_Component) {
}, {
key: 'renderToolBar',
value: function renderToolBar() {
var _this13 = this;
var _props5 = this.props,
exportCSV = _props5.exportCSV,
selectRow = _props5.selectRow,
@@ -1738,7 +1802,9 @@ var BootstrapTable = function (_Component) {
'div',
{ className: 'react-bs-table-tool-bar ' + (print ? '' : 'hidden-print') },
_react2.default.createElement(_ToolBar2.default, {
ref: 'toolbar',
ref: function ref(node) {
return _this13.toolbar = node;
},
version: this.props.version,
defaultSearch: this.props.options.defaultSearch,
clearSearch: this.props.options.clearSearch,
@@ -1797,6 +1863,8 @@ var BootstrapTable = function (_Component) {
}, {
key: 'renderTableFooter',
value: function renderTableFooter(footerData, footerFormatterReturnData, columns, colGroups) {
var _this14 = this;
if (this.props.footer) {
var hideSelectColumn = true;
var mode = this.props.selectRow.mode;
@@ -1808,7 +1876,9 @@ var BootstrapTable = function (_Component) {
return _react2.default.createElement(
_TableFooter2.default,
{
ref: 'footer',
ref: function ref(node) {
return _this14.footer = node;
},
columns: columns,
colGroups: colGroups,
footerFormatterReturnData: footerFormatterReturnData,
@@ -1831,23 +1901,23 @@ var BootstrapTable = function (_Component) {
var scrollTop = this.props.scrollTop;
if (scrollTop === _Const2.default.SCROLL_TOP) {
this.refs.body.refs.container.scrollTop = 0;
this.body.container.scrollTop = 0;
} else if (scrollTop === _Const2.default.SCROLL_BOTTOM) {
this.refs.body.refs.container.scrollTop = this.refs.body.refs.container.scrollHeight;
this.body.container.scrollTop = this.body.container.scrollHeight;
} else if (typeof scrollTop === 'number' && !isNaN(scrollTop)) {
this.refs.body.refs.container.scrollTop = scrollTop;
this.body.container.scrollTop = scrollTop;
}
}
}, {
key: '___scrollHeader__REACT_HOT_LOADER__',
value: function ___scrollHeader__REACT_HOT_LOADER__(e) {
this.refs.header.refs.container.scrollLeft = e.currentTarget.scrollLeft;
this.header.container.scrollLeft = e.currentTarget.scrollLeft;
}
}, {
key: '___scrollFooter__REACT_HOT_LOADER__',
value: function ___scrollFooter__REACT_HOT_LOADER__(e) {
if (this.props.footer) {
this.refs.footer.refs.container.scrollLeft = e.currentTarget.scrollLeft;
this.footer.container.scrollLeft = e.currentTarget.scrollLeft;
}
}
}, {
@@ -1861,9 +1931,9 @@ var BootstrapTable = function (_Component) {
}, {
key: '_adjustHeaderWidth',
value: function _adjustHeaderWidth() {
var header = this.refs.header.getHeaderColGrouop();
var tbody = this.refs.body.refs.tbody;
var bodyHeader = this.refs.body.getHeaderColGrouop();
var header = this.header.getHeaderColGrouop();
var tbody = this.body.tbody;
var bodyHeader = this.body.getHeaderColGrouop();
var firstRow = tbody.childNodes[0];
var isScroll = tbody.parentNode.getBoundingClientRect().height > tbody.parentNode.parentNode.getBoundingClientRect().height;
@@ -1923,12 +1993,12 @@ var BootstrapTable = function (_Component) {
var maxHeight = this.props.maxHeight;
if (typeof height === 'number' && !isNaN(height) || height.indexOf('%') === -1) {
this.refs.body.refs.container.style.height = parseFloat(height, 10) - this.refs.header.refs.container.offsetHeight + 'px';
this.body.container.style.height = parseFloat(height, 10) - this.header.container.offsetHeight + 'px';
}
if (maxHeight) {
maxHeight = typeof maxHeight === 'number' ? maxHeight : parseInt(maxHeight.replace('px', ''), 10);
this.refs.body.refs.container.style.maxHeight = maxHeight - this.refs.header.refs.container.offsetHeight + 'px';
this.body.container.style.maxHeight = maxHeight - this.header.container.offsetHeight + 'px';
}
}
}, {
@@ -2126,11 +2196,14 @@ BootstrapTable.propTypes = {
beforeShowError: _propTypes2.default.func,
printToolBar: _propTypes2.default.bool,
insertFailIndicator: _propTypes2.default.string,
noAutoBOM: _propTypes2.default.bool
noAutoBOM: _propTypes2.default.bool,
expandAll: _propTypes2.default.bool,
hideRowOnExpand: _propTypes2.default.bool
}),
fetchInfo: _propTypes2.default.shape({
dataTotalSize: _propTypes2.default.number
}),
renderAlert: _propTypes2.default.bool,
exportCSV: _propTypes2.default.bool,
csvFileName: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func]),
ignoreSinglePage: _propTypes2.default.bool,
@@ -2145,6 +2218,7 @@ BootstrapTable.propTypes = {
columnWidth: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.string]),
expandColumnVisible: _propTypes2.default.bool,
expandColumnComponent: _propTypes2.default.func,
expandedColumnHeaderComponent: _propTypes2.default.func,
expandColumnBeforeSelectColumn: _propTypes2.default.bool
}),
footer: _propTypes2.default.bool
@@ -2158,6 +2232,7 @@ BootstrapTable.defaultProps = {
expandColumnOptions: {
expandColumnVisible: false,
expandColumnComponent: undefined,
expandedColumnHeaderComponent: undefined,
expandColumnBeforeSelectColumn: true
},
height: '100%',
@@ -2293,11 +2368,14 @@ BootstrapTable.defaultProps = {
beforeShowError: undefined,
printToolBar: true,
insertFailIndicator: _Const2.default.INSERT_FAIL_INDICATOR,
noAutoBOM: true
noAutoBOM: true,
expandAll: false,
hideRowOnExpand: false
},
fetchInfo: {
dataTotalSize: 0
},
renderAlert: true,
exportCSV: false,
csvFileName: 'spreadsheet.csv',
ignoreSinglePage: false,

View File

@@ -25,21 +25,42 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
var ExpandRowHeaderColumn = function (_Component) {
_inherits(ExpandRowHeaderColumn, _Component);
function ExpandRowHeaderColumn() {
function ExpandRowHeaderColumn(props) {
_classCallCheck(this, ExpandRowHeaderColumn);
return _possibleConstructorReturn(this, (ExpandRowHeaderColumn.__proto__ || Object.getPrototypeOf(ExpandRowHeaderColumn)).apply(this, arguments));
var _this = _possibleConstructorReturn(this, (ExpandRowHeaderColumn.__proto__ || Object.getPrototypeOf(ExpandRowHeaderColumn)).call(this, props));
_this.toggleExpandAllChilds = _this.toggleExpandAllChilds.bind(_this);
return _this;
}
_createClass(ExpandRowHeaderColumn, [{
key: 'toggleExpandAllChilds',
value: function toggleExpandAllChilds() {
this.props.toggleExpandAllChilds();
}
}, {
key: 'render',
value: function render() {
var _props = this.props,
expandedColumnHeaderComponent = _props.expandedColumnHeaderComponent,
noAnyExpand = _props.noAnyExpand,
expandAll = _props.expandAll;
var expandedHeaderComponent = noAnyExpand ? _react2.default.createElement('span', { className: 'fa fa-plus glyphicon glyphicon-plus' }) : _react2.default.createElement('span', { className: 'fa fa-minus glyphicon glyphicon-minus' });
var ExpandedColumnHeaderComponent = expandedColumnHeaderComponent;
return _react2.default.createElement(
'th',
{ rowSpan: this.props.rowCount, style: { textAlign: 'center' },
className: 'react-bs-table-expand-cell',
'data-is-only-head': false },
this.props.children
expandAll ? _react2.default.createElement(
'div',
{ onClick: this.toggleExpandAllChilds },
expandedColumnHeaderComponent ? _react2.default.createElement(ExpandedColumnHeaderComponent, {
anyExpand: !noAnyExpand }) : expandedHeaderComponent
) : null
);
}
}]);
@@ -48,8 +69,11 @@ var ExpandRowHeaderColumn = function (_Component) {
}(_react.Component);
ExpandRowHeaderColumn.propTypes = {
children: _propTypes2.default.node,
rowCount: _propTypes2.default.number
expandedColumnHeaderComponent: _propTypes2.default.func,
rowCount: _propTypes2.default.number,
noAnyExpand: _propTypes2.default.bool,
expandAll: _propTypes2.default.bool,
toggleExpandAllChilds: _propTypes2.default.func
};
var _default = ExpandRowHeaderColumn;
exports.default = _default;

View File

@@ -197,6 +197,8 @@ var TableBody = function (_Component) {
}, {
key: 'render',
value: function render() {
var _this2 = this;
var _props = this.props,
cellEdit = _props.cellEdit,
beforeShowError = _props.beforeShowError,
@@ -337,14 +339,15 @@ var TableBody = function (_Component) {
var expandedRowColumn = this.renderExpandRowColumn(this.props.expandableRow && this.props.expandableRow(data), this.props.expanding.indexOf(key) > -1, ExpandColumnCustomComponent, r);
var haveExpandContent = this.props.expandableRow && this.props.expandableRow(data);
var isExpanding = haveExpandContent && this.props.expanding.indexOf(key) > -1;
var hideRowOnExpand = this.props.hideRowOnExpand;
// add by bluespring for className customize
var trClassName = this.props.trClassName;
if (_util2.default.isFunction(this.props.trClassName)) {
trClassName = this.props.trClassName(data, r);
}
if (isExpanding && this.props.expandParentClass) {
trClassName += _util2.default.isFunction(this.props.expandParentClass) ? this.props.expandParentClass(data, r) : this.props.expandParentClass;
trClassName += _util2.default.isFunction(this.props.expandParentClass) ? ' ' + this.props.expandParentClass(data, r) : ' ' + this.props.expandParentClass;
}
var result = [_react2.default.createElement(
_TableRow2.default,
@@ -361,6 +364,7 @@ var TableBody = function (_Component) {
onExpandRow: this.handleClickCell,
unselectableRow: disable,
style: trStyle,
hidden: isExpanding && hideRowOnExpand,
dbClickToEdit: cellEdit.mode === _Const2.default.CELL_EDIT_DBCLICK },
this.props.expandColumnOptions.expandColumnVisible && this.props.expandColumnOptions.expandColumnBeforeSelectColumn && expandedRowColumn,
selectRowColumn,
@@ -405,16 +409,23 @@ var TableBody = function (_Component) {
return _react2.default.createElement(
'div',
{ ref: 'container',
{
ref: function ref(node) {
return _this2.container = node;
},
className: (0, _classnames2.default)('react-bs-container-body', this.props.bodyContainerClass),
style: this.props.style },
_react2.default.createElement(
'table',
{ className: tableClasses },
_react2.default.cloneElement(tableHeader, { ref: 'header' }),
_react2.default.cloneElement(tableHeader, { ref: function ref(node) {
return _this2.header = node;
} }),
_react2.default.createElement(
'tbody',
{ ref: 'tbody' },
{ ref: function ref(node) {
return _this2.tbody = node;
} },
tableRows
)
)
@@ -427,7 +438,8 @@ var TableBody = function (_Component) {
var _props2 = this.props,
keyBoardNav = _props2.keyBoardNav,
onNavigateCell = _props2.onNavigateCell,
cellEdit = _props2.cellEdit;
cellEdit = _props2.cellEdit,
selectedRowKeys = _props2.selectedRowKeys;
var offset = void 0;
if (e.keyCode === 37) {
@@ -444,15 +456,22 @@ var TableBody = function (_Component) {
} else if (e.keyCode === 40) {
offset = { x: 0, y: 1 };
} else if (e.keyCode === 13) {
var rowIndex = e.target.parentElement.rowIndex + 1;
var enterToEdit = (typeof keyBoardNav === 'undefined' ? 'undefined' : _typeof(keyBoardNav)) === 'object' ? keyBoardNav.enterToEdit : false;
var enterToExpand = (typeof keyBoardNav === 'undefined' ? 'undefined' : _typeof(keyBoardNav)) === 'object' ? keyBoardNav.enterToExpand : false;
var enterToSelect = (typeof keyBoardNav === 'undefined' ? 'undefined' : _typeof(keyBoardNav)) === 'object' ? keyBoardNav.enterToSelect : false;
if (cellEdit && enterToEdit) {
this.handleEditCell(e.target.parentElement.rowIndex + 1, e.currentTarget.cellIndex, '', e);
this.handleEditCell(rowIndex, e.currentTarget.cellIndex, '', e);
}
if (enterToExpand) {
this.handleClickCell(this.props.y + 1, this.props.x);
this.handleClickCell(e, this.props.y + 1, this.props.x);
}
if (enterToSelect) {
var isSelected = selectedRowKeys.indexOf(this.props.data[rowIndex - 1][this.props.keyField]) !== -1;
this.handleSelectRow(rowIndex, !isSelected, e);
}
}
if (offset && keyBoardNav) {
@@ -473,22 +492,22 @@ var TableBody = function (_Component) {
}
}, {
key: '__handleRowClick__REACT_HOT_LOADER__',
value: function __handleRowClick__REACT_HOT_LOADER__(rowIndex, cellIndex) {
value: function __handleRowClick__REACT_HOT_LOADER__(rowIndex, cellIndex, event) {
var _props3 = this.props,
onRowClick = _props3.onRowClick,
selectRow = _props3.selectRow;
if (_util2.default.isSelectRowDefined(selectRow.mode)) cellIndex--;
if (this._isExpandColumnVisible()) cellIndex--;
onRowClick(this.props.data[rowIndex - 1], rowIndex - 1, cellIndex);
onRowClick(this.props.data[rowIndex - 1], rowIndex - 1, cellIndex, event);
}
}, {
key: '__handleRowDoubleClick__REACT_HOT_LOADER__',
value: function __handleRowDoubleClick__REACT_HOT_LOADER__(rowIndex) {
value: function __handleRowDoubleClick__REACT_HOT_LOADER__(rowIndex, event) {
var onRowDoubleClick = this.props.onRowDoubleClick;
var targetRow = this.props.data[rowIndex];
onRowDoubleClick(targetRow);
onRowDoubleClick(targetRow, event);
}
}, {
key: '__handleSelectRow__REACT_HOT_LOADER__',
@@ -515,8 +534,8 @@ var TableBody = function (_Component) {
}
}, {
key: '__handleClickCell__REACT_HOT_LOADER__',
value: function __handleClickCell__REACT_HOT_LOADER__(rowIndex) {
var columnIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : -1;
value: function __handleClickCell__REACT_HOT_LOADER__(event, rowIndex) {
var columnIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : -1;
var _props5 = this.props,
columns = _props5.columns,
keyField = _props5.keyField,
@@ -549,7 +568,7 @@ var TableBody = function (_Component) {
// expand
if (onlyOneExpanding) expanding = [rowKey];else expanding.push(rowKey);
}
this.props.onExpand(expanding, rowKey, isRowExpanding);
this.props.onExpand(expanding, rowKey, isRowExpanding, event);
}
}
}, {
@@ -661,7 +680,7 @@ var TableBody = function (_Component) {
var unselectable = this.props.selectRow.unselectable || [];
if (unselectable.indexOf(row[this.props.keyField]) === -1) {
this.handleSelectRow(rowIndex + 1, isSelect, e);
this.handleClickCell(rowIndex + 1);
this.handleClickCell(e, rowIndex + 1);
}
}
}
@@ -670,7 +689,7 @@ var TableBody = function (_Component) {
value: function renderSelectRowColumn(selected, inputType, disabled) {
var CustomComponent = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
var _this2 = this;
var _this3 = this;
var rowIndex = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
var row = arguments[5];
@@ -678,22 +697,22 @@ var TableBody = function (_Component) {
return _react2.default.createElement(
'td',
{ onClick: function onClick(e) {
_this2.handleClickonSelectColumn(e, !selected, rowIndex, row);
_this3.handleClickonSelectColumn(e, !selected, rowIndex, row);
}, style: { textAlign: 'center' } },
CustomComponent ? _react2.default.createElement(CustomComponent, { type: inputType, checked: selected, disabled: disabled,
rowIndex: rowIndex,
onChange: function onChange(e) {
return _this2.handleSelectRowColumChange(e, rowIndex);
return _this3.handleSelectRowColumChange(e, rowIndex);
} }) : _react2.default.createElement('input', { type: inputType, checked: selected, disabled: disabled,
onChange: function onChange(e) {
return _this2.handleSelectRowColumChange(e, rowIndex);
return _this3.handleSelectRowColumChange(e, rowIndex);
} })
);
}
}, {
key: 'renderExpandRowColumn',
value: function renderExpandRowColumn(isExpandableRow, isExpanded, CustomComponent) {
var _this3 = this;
var _this4 = this;
var rowIndex = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
@@ -710,8 +729,8 @@ var TableBody = function (_Component) {
'td',
{
className: 'react-bs-table-expand-cell',
onClick: function onClick() {
return _this3.handleClickCell(rowIndex + 1);
onClick: function onClick(e) {
return _this4.handleClickCell(e, rowIndex + 1);
} },
content
);
@@ -724,7 +743,7 @@ var TableBody = function (_Component) {
}, {
key: '__getHeaderColGrouop__REACT_HOT_LOADER__',
value: function __getHeaderColGrouop__REACT_HOT_LOADER__() {
return this.refs.header.childNodes;
return this.header.childNodes;
}
}]);
@@ -763,7 +782,8 @@ TableBody.propTypes = {
x: _propTypes2.default.number,
y: _propTypes2.default.number,
onNavigateCell: _propTypes2.default.func,
withoutTabIndex: _propTypes2.default.bool
withoutTabIndex: _propTypes2.default.bool,
hideRowOnExpand: _propTypes2.default.bool
};
var _default = TableBody;
exports.default = _default;

View File

@@ -144,7 +144,7 @@ var TableColumn = function (_Component) {
} catch (err) {} /* eslint no-empty: 0 */
this.props.onEdit(this.props.rIndex + 1, e.currentTarget.cellIndex, e);
if (this.props.cellEdit.mode !== _Const2.default.CELL_EDIT_DBCLICK) {
this.props.onClick(this.props.rIndex + 1, e.currentTarget.cellIndex, e);
this.props.onClick(e, this.props.rIndex + 1, e.currentTarget.cellIndex);
}
}
}, {
@@ -155,7 +155,7 @@ var TableColumn = function (_Component) {
rIndex = _props.rIndex;
if (onClick) {
onClick(rIndex + 1, e.currentTarget.cellIndex, e);
onClick(e, rIndex + 1, e.currentTarget.cellIndex);
}
}
}, {

View File

@@ -396,8 +396,7 @@ var TableEditColumn = function (_Component) {
return _react2.default.createElement(
'td',
_extends({ ref: 'td'
}, attrs, {
_extends({}, attrs, {
style: style,
className: className,
onClick: this.handleClick }),

View File

@@ -51,7 +51,12 @@ var TableFooter = function (_Component) {
}, this.props.tableFooterClass);
return _react2.default.createElement(
'div',
{ ref: 'container', className: containerClasses, style: this.props.style },
{
ref: function ref(node) {
return _this2.container = node;
},
className: containerClasses,
style: this.props.style },
this.props.children.map(function (footerItem, footerItemIndex) {
return _react2.default.createElement(
'span',
@@ -65,7 +70,9 @@ var TableFooter = function (_Component) {
null,
_react2.default.createElement(
'tr',
{ ref: 'footer' },
{ ref: function ref(node) {
return _this2.footer = node;
} },
hideSelectColumn ? null : _this2.renderSelectionOrExpandCol(),
!expandColumnVisible ? null : _this2.renderSelectionOrExpandCol(),
_this2.props.columns.map(function (columnItem, colIndex) {

View File

@@ -126,6 +126,8 @@ var TableHeader = function (_Component2) {
}, {
key: 'render',
value: function render() {
var _this4 = this;
var _props = this.props,
sortIndicator = _props.sortIndicator,
sortList = _props.sortList,
@@ -133,7 +135,11 @@ var TableHeader = function (_Component2) {
reset = _props.reset,
version = _props.version,
condensed = _props.condensed,
bordered = _props.bordered;
bordered = _props.bordered,
expandedColumnHeaderComponent = _props.expandedColumnHeaderComponent,
noAnyExpand = _props.noAnyExpand,
toggleExpandAllChilds = _props.toggleExpandAllChilds,
expandAll = _props.expandAll;
var containerClasses = (0, _classnames2.default)('react-bs-container-header', 'table-header-wrapper', this.props.headerContainerClass);
var customTableClasses = {
@@ -152,7 +158,15 @@ var TableHeader = function (_Component2) {
var rowKey = 0;
rows[0] = [];
rows[0].push([this.props.expandColumnVisible && this.props.expandColumnBeforeSelectColumn && _react2.default.createElement(_ExpandRowHeaderColumn2.default, { key: 'expandCol', rowCount: rowCount + 1 })], [this.renderSelectRowHeader(rowCount + 1, rowKey++)], [this.props.expandColumnVisible && !this.props.expandColumnBeforeSelectColumn && _react2.default.createElement(_ExpandRowHeaderColumn2.default, { key: 'expandCol', rowCount: rowCount + 1 })]);
rows[0].push([this.props.expandColumnVisible && this.props.expandColumnBeforeSelectColumn && _react2.default.createElement(_ExpandRowHeaderColumn2.default, { key: 'expandCol', rowCount: rowCount + 1,
expandedColumnHeaderComponent: expandedColumnHeaderComponent,
noAnyExpand: noAnyExpand,
expandAll: expandAll,
toggleExpandAllChilds: toggleExpandAllChilds })], [this.renderSelectRowHeader(rowCount + 1, rowKey++)], [this.props.expandColumnVisible && !this.props.expandColumnBeforeSelectColumn && _react2.default.createElement(_ExpandRowHeaderColumn2.default, { key: 'expandCol', rowCount: rowCount + 1,
expandedColumnHeaderComponent: expandedColumnHeaderComponent,
noAnyExpand: noAnyExpand,
expandAll: expandAll,
toggleExpandAllChilds: toggleExpandAllChilds })]);
_react2.default.Children.forEach(this.props.children, function (elm) {
if (elm === null || elm === undefined) {
@@ -186,14 +200,23 @@ var TableHeader = function (_Component2) {
return _react2.default.createElement(
'div',
{ ref: 'container', className: containerClasses, style: this.props.style },
{
ref: function ref(node) {
return _this4.container = node;
},
className: containerClasses,
style: this.props.style },
_react2.default.createElement(
'table',
{ className: tableClasses },
_react2.default.cloneElement(this.props.colGroups, { ref: 'headerGrp' }),
_react2.default.cloneElement(this.props.colGroups, { ref: function ref(node) {
return _this4.headerGrp = node;
} }),
_react2.default.createElement(
'thead',
{ ref: 'header' },
{ ref: function ref(node) {
return _this4.header = node;
} },
trs
)
)
@@ -202,7 +225,7 @@ var TableHeader = function (_Component2) {
}, {
key: '__getHeaderColGrouop__REACT_HOT_LOADER__',
value: function __getHeaderColGrouop__REACT_HOT_LOADER__() {
return this.refs.headerGrp.childNodes;
return this.headerGrp.childNodes;
}
}, {
key: 'renderSelectRowHeader',
@@ -256,8 +279,12 @@ TableHeader.propTypes = {
reset: _propTypes2.default.bool,
expandColumnVisible: _propTypes2.default.bool,
expandColumnComponent: _propTypes2.default.func,
expandedColumnHeaderComponent: _propTypes2.default.func,
expandColumnBeforeSelectColumn: _propTypes2.default.bool,
version: _propTypes2.default.string
version: _propTypes2.default.string,
noAnyExpand: _propTypes2.default.bool,
expandAll: _propTypes2.default.bool,
toggleExpandAllChilds: _propTypes2.default.func
};
var _default = TableHeader;

View File

@@ -93,7 +93,7 @@ var TableHeaderColumn = function (_Component) {
var filter = currentFilter[nextProps.dataField];
var value = filter ? filter.value : '';
var _ref = this.getFilters() || {},
var _ref = this.getFilters(nextProps) || {},
ref = _ref.ref;
if (this.refs[ref]) {
@@ -120,48 +120,62 @@ var TableHeaderColumn = function (_Component) {
}, {
key: 'getFilters',
value: function getFilters() {
var _props = this.props,
headerText = _props.headerText,
children = _props.children;
var _this2 = this;
switch (this.props.filter.type) {
var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
var headerText = props.headerText,
children = props.children;
switch (props.filter.type) {
case _Const2.default.FILTER_TYPE.TEXT:
{
return _react2.default.createElement(_Text2.default, _extends({ ref: 'textFilter' }, this.props.filter, {
return _react2.default.createElement(_Text2.default, _extends({ ref: function ref(n) {
return _this2.textFilter = n;
} }, props.filter, {
columnName: headerText || children, filterHandler: this.handleFilter }));
}
case _Const2.default.FILTER_TYPE.REGEX:
{
return _react2.default.createElement(_Regex2.default, _extends({ ref: 'regexFilter' }, this.props.filter, {
return _react2.default.createElement(_Regex2.default, _extends({ ref: function ref(n) {
return _this2.regexFilter = n;
} }, props.filter, {
columnName: headerText || children, filterHandler: this.handleFilter }));
}
case _Const2.default.FILTER_TYPE.SELECT:
{
return _react2.default.createElement(_Select2.default, _extends({ ref: 'selectFilter' }, this.props.filter, {
return _react2.default.createElement(_Select2.default, _extends({ ref: function ref(n) {
return _this2.selectFilter = n;
} }, props.filter, {
columnName: headerText || children, filterHandler: this.handleFilter }));
}
case _Const2.default.FILTER_TYPE.NUMBER:
{
return _react2.default.createElement(_Number2.default, _extends({ ref: 'numberFilter' }, this.props.filter, {
return _react2.default.createElement(_Number2.default, _extends({ ref: function ref(n) {
return _this2.numberFilter = n;
} }, props.filter, {
columnName: headerText || children, filterHandler: this.handleFilter }));
}
case _Const2.default.FILTER_TYPE.DATE:
{
return _react2.default.createElement(_Date2.default, _extends({ ref: 'dateFilter' }, this.props.filter, {
return _react2.default.createElement(_Date2.default, _extends({ ref: function ref(n) {
return _this2.dateFilter = n;
} }, props.filter, {
columnName: headerText || children, filterHandler: this.handleFilter }));
}
case _Const2.default.FILTER_TYPE.CUSTOM:
{
var elm = this.props.filter.getElement(this.handleFilter, this.props.filter.customFilterParameters);
var elm = props.filter.getElement(this.handleFilter, props.filter.customFilterParameters);
return _react2.default.cloneElement(elm, { ref: 'customFilter' });
return _react2.default.cloneElement(elm, { ref: function ref(n) {
return _this2.customFilter = n;
} });
}
}
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
this.refs['header-col'].setAttribute('data-field', this.props.dataField);
this.headerCol.setAttribute('data-field', this.props.dataField);
}
}, {
key: 'renderDefaultCaret',
@@ -190,26 +204,28 @@ var TableHeaderColumn = function (_Component) {
}, {
key: 'render',
value: function render() {
var _this3 = this;
var defaultCaret = void 0;
var sortCaret = void 0;
var sortClass = void 0;
var _props2 = this.props,
headerText = _props2.headerText,
dataAlign = _props2.dataAlign,
dataField = _props2.dataField,
headerAlign = _props2.headerAlign,
headerTitle = _props2.headerTitle,
hidden = _props2.hidden,
sort = _props2.sort,
dataSort = _props2.dataSort,
sortIndicator = _props2.sortIndicator,
children = _props2.children,
caretRender = _props2.caretRender,
className = _props2.className,
isOnlyHead = _props2.isOnlyHead,
version = _props2.version,
customSortClass = _props2.sortHeaderColumnClassName,
style = _props2.thStyle;
var _props = this.props,
headerText = _props.headerText,
dataAlign = _props.dataAlign,
dataField = _props.dataField,
headerAlign = _props.headerAlign,
headerTitle = _props.headerTitle,
hidden = _props.hidden,
sort = _props.sort,
dataSort = _props.dataSort,
sortIndicator = _props.sortIndicator,
children = _props.children,
caretRender = _props.caretRender,
className = _props.className,
isOnlyHead = _props.isOnlyHead,
version = _props.version,
customSortClass = _props.sortHeaderColumnClassName,
style = _props.thStyle;
var thStyle = _extends({
textAlign: headerAlign || dataAlign,
@@ -241,7 +257,9 @@ var TableHeaderColumn = function (_Component) {
}
return _react2.default.createElement(
'th',
_extends({ ref: 'header-col',
_extends({ ref: function ref(node) {
return _this3.headerCol = node;
},
className: classes,
style: thStyle,
onClick: this.handleColumnClick,
@@ -268,32 +286,32 @@ var TableHeaderColumn = function (_Component) {
switch (this.props.filter.type) {
case _Const2.default.FILTER_TYPE.TEXT:
{
this.refs.textFilter.cleanFiltered();
this.textFilter.cleanFiltered();
break;
}
case _Const2.default.FILTER_TYPE.REGEX:
{
this.refs.regexFilter.cleanFiltered();
this.regexFilter.cleanFiltered();
break;
}
case _Const2.default.FILTER_TYPE.SELECT:
{
this.refs.selectFilter.cleanFiltered();
this.selectFilter.cleanFiltered();
break;
}
case _Const2.default.FILTER_TYPE.NUMBER:
{
this.refs.numberFilter.cleanFiltered();
this.numberFilter.cleanFiltered();
break;
}
case _Const2.default.FILTER_TYPE.DATE:
{
this.refs.dateFilter.cleanFiltered();
this.dateFilter.cleanFiltered();
break;
}
case _Const2.default.FILTER_TYPE.CUSTOM:
{
this.refs.customFilter.cleanFiltered();
this.customFilter.cleanFiltered();
break;
}
}
@@ -305,27 +323,27 @@ var TableHeaderColumn = function (_Component) {
switch (this.props.filter.type) {
case _Const2.default.FILTER_TYPE.TEXT:
{
this.refs.textFilter.applyFilter(val);
this.textFilter.applyFilter(val);
break;
}
case _Const2.default.FILTER_TYPE.REGEX:
{
this.refs.regexFilter.applyFilter(val);
this.regexFilter.applyFilter(val);
break;
}
case _Const2.default.FILTER_TYPE.SELECT:
{
this.refs.selectFilter.applyFilter(val);
this.selectFilter.applyFilter(val);
break;
}
case _Const2.default.FILTER_TYPE.NUMBER:
{
this.refs.numberFilter.applyFilter(val);
this.numberFilter.applyFilter(val);
break;
}
case _Const2.default.FILTER_TYPE.DATE:
{
this.refs.dateFilter.applyFilter(val);
this.dateFilter.applyFilter(val);
break;
}
}

View File

@@ -97,7 +97,7 @@ var TableRow = function (_Component) {
var rowIndex = this.props.index + 1;
var cellIndex = e.target.cellIndex;
if (this.props.onRowClick) this.props.onRowClick(rowIndex, cellIndex);
if (this.props.onRowClick) this.props.onRowClick(rowIndex, cellIndex, e);
var _props = this.props,
selectRow = _props.selectRow,
unselectableRow = _props.unselectableRow,
@@ -118,26 +118,26 @@ var TableRow = function (_Component) {
setTimeout(function () {
if (_this2.clickNum === 1) {
onSelectRow(rowIndex, !isSelected, e);
onExpandRow(rowIndex, cellIndex);
onExpandRow(e, rowIndex, cellIndex);
}
_this2.clickNum = 0;
}, 200);
} else {
if (dbClickToEdit) {
this.expandRow(rowIndex, cellIndex);
this.expandRow(e, rowIndex, cellIndex);
}
}
}
}
}, {
key: '__expandRow__REACT_HOT_LOADER__',
value: function __expandRow__REACT_HOT_LOADER__(rowIndex, cellIndex) {
value: function __expandRow__REACT_HOT_LOADER__(event, rowIndex, cellIndex) {
var _this3 = this;
this.clickNum++;
setTimeout(function () {
if (_this3.clickNum === 1) {
_this3.props.onExpandRow(rowIndex, cellIndex);
_this3.props.onExpandRow(event, rowIndex, cellIndex);
}
_this3.clickNum = 0;
}, 200);
@@ -147,7 +147,7 @@ var TableRow = function (_Component) {
value: function __rowDoubleClick__REACT_HOT_LOADER__(e) {
if (e.target.tagName !== 'INPUT' && e.target.tagName !== 'SELECT' && e.target.tagName !== 'TEXTAREA') {
if (this.props.onRowDoubleClick) {
this.props.onRowDoubleClick(this.props.index);
this.props.onRowDoubleClick(this.props.index, e);
}
}
}
@@ -176,7 +176,8 @@ var TableRow = function (_Component) {
row = _props2.row,
isSelected = _props2.isSelected,
className = _props2.className,
index = _props2.index;
index = _props2.index,
hidden = _props2.hidden;
var style = this.props.style;
var backgroundColor = null;
@@ -208,6 +209,7 @@ var TableRow = function (_Component) {
onMouseOver: this.rowMouseOver,
onMouseOut: this.rowMouseOut,
onClick: this.rowClick,
hidden: hidden,
onDoubleClick: this.rowDoubleClick }),
this.props.children
);
@@ -229,11 +231,13 @@ TableRow.propTypes = {
onExpandRow: _propTypes2.default.func,
onRowMouseOut: _propTypes2.default.func,
onRowMouseOver: _propTypes2.default.func,
unselectableRow: _propTypes2.default.bool
unselectableRow: _propTypes2.default.bool,
hidden: _propTypes2.default.bool
};
TableRow.defaultProps = {
onRowClick: undefined,
onRowDoubleClick: undefined
onRowDoubleClick: undefined,
hidden: false
};
var _default = TableRow;
exports.default = _default;

View File

@@ -63,7 +63,7 @@ var DateFilter = function (_Component) {
}, {
key: 'onChangeComparator',
value: function onChangeComparator(event) {
var date = this.refs.inputDate.value;
var date = this.inputDate.value;
var comparator = event.target.value;
if (date === '') {
return;
@@ -88,7 +88,7 @@ var DateFilter = function (_Component) {
}, {
key: 'filter',
value: function filter(event) {
var comparator = this.refs.dateFilterComparator.value;
var comparator = this.dateFilterComparator.value;
var dateValue = event.target.value;
if (dateValue) {
this.props.filterHandler({ date: new Date(dateValue), comparator: comparator }, _Const2.default.FILTER_TYPE.DATE);
@@ -104,8 +104,8 @@ var DateFilter = function (_Component) {
this.setState(function () {
return { isPlaceholderSelected: value === '' };
});
this.refs.dateFilterComparator.value = comparator;
this.refs.inputDate.value = value;
this.dateFilterComparator.value = comparator;
this.inputDate.value = value;
this.props.filterHandler({ date: new Date(value), comparator: comparator }, _Const2.default.FILTER_TYPE.DATE);
}
}, {
@@ -117,15 +117,15 @@ var DateFilter = function (_Component) {
this.setState(function () {
return { isPlaceholderSelected: date === '' };
});
this.refs.dateFilterComparator.value = comparator;
this.refs.inputDate.value = dateParser(date);
this.dateFilterComparator.value = comparator;
this.inputDate.value = dateParser(date);
this.props.filterHandler({ date: date, comparator: comparator }, _Const2.default.FILTER_TYPE.DATE);
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
var comparator = this.refs.dateFilterComparator.value;
var dateValue = this.refs.inputDate.value;
var comparator = this.dateFilterComparator.value;
var dateValue = this.inputDate.value;
if (comparator && dateValue) {
this.props.filterHandler({ date: new Date(dateValue), comparator: comparator }, _Const2.default.FILTER_TYPE.DATE);
}
@@ -133,6 +133,8 @@ var DateFilter = function (_Component) {
}, {
key: 'render',
value: function render() {
var _this2 = this;
var _props = this.props,
defaultValue = _props.defaultValue,
_props$style = _props.style,
@@ -144,14 +146,18 @@ var DateFilter = function (_Component) {
{ className: 'filter date-filter' },
_react2.default.createElement(
'select',
{ ref: 'dateFilterComparator',
{ ref: function ref(n) {
return _this2.dateFilterComparator = n;
},
style: comparator,
className: 'date-filter-comparator form-control',
onChange: this.onChangeComparator,
defaultValue: defaultValue ? defaultValue.comparator : '' },
this.getComparatorOptions()
),
_react2.default.createElement('input', { ref: 'inputDate',
_react2.default.createElement('input', { ref: function ref(n) {
return _this2.inputDate = n;
},
className: 'filter date-filter-input form-control',
style: date,
type: 'date',

View File

@@ -56,7 +56,7 @@ var NumberFilter = function (_Component) {
value: function onChangeNumber(event) {
var _this2 = this;
var comparator = this.refs.numberFilterComparator.value;
var comparator = this.numberFilterComparator.value;
if (comparator === '') {
return;
}
@@ -71,7 +71,7 @@ var NumberFilter = function (_Component) {
}, {
key: 'onChangeNumberSet',
value: function onChangeNumberSet(event) {
var comparator = this.refs.numberFilterComparator.value;
var comparator = this.numberFilterComparator.value;
var value = event.target.value;
this.setState(function () {
@@ -85,7 +85,7 @@ var NumberFilter = function (_Component) {
}, {
key: 'onChangeComparator',
value: function onChangeComparator(event) {
var value = this.refs.numberFilter.value;
var value = this.numberFilter.value;
var comparator = event.target.value;
if (value === '') {
return;
@@ -100,8 +100,8 @@ var NumberFilter = function (_Component) {
this.setState(function () {
return { isPlaceholderSelected: value === '' };
});
this.refs.numberFilterComparator.value = comparator;
this.refs.numberFilter.value = value;
this.numberFilterComparator.value = comparator;
this.numberFilter.value = value;
this.props.filterHandler({ number: value, comparator: comparator }, _Const2.default.FILTER_TYPE.NUMBER);
}
}, {
@@ -113,8 +113,8 @@ var NumberFilter = function (_Component) {
this.setState(function () {
return { isPlaceholderSelected: number === '' };
});
this.refs.numberFilterComparator.value = comparator;
this.refs.numberFilter.value = number;
this.numberFilterComparator.value = comparator;
this.numberFilter.value = number;
this.props.filterHandler({ number: number, comparator: comparator }, _Const2.default.FILTER_TYPE.NUMBER);
}
}, {
@@ -162,8 +162,8 @@ var NumberFilter = function (_Component) {
}, {
key: 'componentDidMount',
value: function componentDidMount() {
var comparator = this.refs.numberFilterComparator.value;
var number = this.refs.numberFilter.value;
var comparator = this.numberFilterComparator.value;
var number = this.numberFilter.value;
if (comparator && number) {
this.props.filterHandler({ number: number, comparator: comparator }, _Const2.default.FILTER_TYPE.NUMBER);
}
@@ -176,6 +176,8 @@ var NumberFilter = function (_Component) {
}, {
key: 'render',
value: function render() {
var _this3 = this;
var selectClass = (0, _classnames2.default)('select-filter', 'number-filter-input', 'form-control', { 'placeholder-selected': this.state.isPlaceholderSelected });
return _react2.default.createElement(
@@ -183,7 +185,9 @@ var NumberFilter = function (_Component) {
{ className: 'filter number-filter' },
_react2.default.createElement(
'select',
{ ref: 'numberFilterComparator',
{ ref: function ref(n) {
return _this3.numberFilterComparator = n;
},
style: this.props.style.comparator,
className: 'number-filter-comparator form-control',
onChange: this.onChangeComparator,
@@ -192,12 +196,16 @@ var NumberFilter = function (_Component) {
),
this.props.options ? _react2.default.createElement(
'select',
{ ref: 'numberFilter',
{ ref: function ref(n) {
return _this3.numberFilter = n;
},
className: selectClass,
onChange: this.onChangeNumberSet,
defaultValue: this.props.defaultValue ? this.props.defaultValue.number : '' },
this.getNumberOptions()
) : _react2.default.createElement('input', { ref: 'numberFilter',
) : _react2.default.createElement('input', { ref: function ref(n) {
return _this3.numberFilter = n;
},
type: 'number',
style: this.props.style.number,
className: 'number-filter-input form-control',

View File

@@ -56,19 +56,19 @@ var RegexFilter = function (_Component) {
key: 'cleanFiltered',
value: function cleanFiltered() {
var value = this.props.defaultValue ? this.props.defaultValue : '';
this.refs.inputText.value = value;
this.inputText.value = value;
this.props.filterHandler(value, _Const2.default.FILTER_TYPE.TEXT);
}
}, {
key: 'applyFilter',
value: function applyFilter(filterRegx) {
this.refs.inputText.value = filterRegx;
this.inputText.value = filterRegx;
this.props.filterHandler(filterRegx, _Const2.default.FILTER_TYPE.REGEX);
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
var value = this.refs.inputText.value;
var value = this.inputText.value;
if (value) {
this.props.filterHandler(value, _Const2.default.FILTER_TYPE.REGEX);
}
@@ -81,13 +81,17 @@ var RegexFilter = function (_Component) {
}, {
key: 'render',
value: function render() {
var _this3 = this;
var _props = this.props,
defaultValue = _props.defaultValue,
placeholder = _props.placeholder,
columnName = _props.columnName,
style = _props.style;
return _react2.default.createElement('input', { ref: 'inputText',
return _react2.default.createElement('input', { ref: function ref(n) {
return _this3.inputText = n;
},
className: 'filter text-filter form-control',
type: 'text',
style: style,

View File

@@ -58,7 +58,7 @@ var SelectFilter = function (_Component) {
_createClass(SelectFilter, [{
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps() {
var currentSelectValue = this.refs.selectInput.value;
var currentSelectValue = this.selectInput.value;
var isPlaceholderSelected = !currentSelectValue || currentSelectValue === '';
this.setState(function () {
return {
@@ -76,7 +76,7 @@ var SelectFilter = function (_Component) {
needFilter = true;
}
if (needFilter) {
var value = this.refs.selectInput.value;
var value = this.selectInput.value;
if (value) {
this.props.filterHandler(value, _Const2.default.FILTER_TYPE.SELECT);
}
@@ -99,7 +99,7 @@ var SelectFilter = function (_Component) {
this.setState(function () {
return { isPlaceholderSelected: value === '' };
});
this.refs.selectInput.value = value;
this.selectInput.value = value;
this.props.filterHandler(value, _Const2.default.FILTER_TYPE.SELECT);
}
}, {
@@ -109,7 +109,7 @@ var SelectFilter = function (_Component) {
this.setState(function () {
return { isPlaceholderSelected: filterOption === '' };
});
this.refs.selectInput.value = filterOption;
this.selectInput.value = filterOption;
this.props.filterHandler(filterOption, _Const2.default.FILTER_TYPE.SELECT);
}
}, {
@@ -143,7 +143,7 @@ var SelectFilter = function (_Component) {
}, {
key: 'componentDidMount',
value: function componentDidMount() {
var value = this.refs.selectInput.value;
var value = this.selectInput.value;
if (value) {
this.props.filterHandler(value, _Const2.default.FILTER_TYPE.SELECT);
}
@@ -151,11 +151,15 @@ var SelectFilter = function (_Component) {
}, {
key: 'render',
value: function render() {
var _this2 = this;
var selectClass = (0, _classnames2.default)('filter', 'select-filter', 'form-control', { 'placeholder-selected': this.state.isPlaceholderSelected });
return _react2.default.createElement(
'select',
{ ref: 'selectInput',
{ ref: function ref(n) {
return _this2.selectInput = n;
},
style: this.props.style,
className: selectClass,
onChange: this.filter,

View File

@@ -78,7 +78,7 @@ var TextFilter = function (_Component) {
}, {
key: 'componentDidMount',
value: function componentDidMount() {
var defaultValue = this.refs.inputText.value;
var defaultValue = this.inputText.value;
if (defaultValue) {
this.props.filterHandler(defaultValue, _Const2.default.FILTER_TYPE.TEXT);
}
@@ -98,12 +98,16 @@ var TextFilter = function (_Component) {
}, {
key: 'render',
value: function render() {
var _this3 = this;
var _props = this.props,
placeholder = _props.placeholder,
columnName = _props.columnName,
style = _props.style;
return _react2.default.createElement('input', { ref: 'inputText',
return _react2.default.createElement('input', { ref: function ref(n) {
return _this3.inputText = n;
},
className: 'filter text-filter form-control',
type: 'text',
style: style,

View File

@@ -50,7 +50,7 @@ var PageButton = function (_Component) {
key: '__pageBtnClick__REACT_HOT_LOADER__',
value: function __pageBtnClick__REACT_HOT_LOADER__(e) {
e.preventDefault();
this.props.changePage(e.currentTarget.textContent);
this.props.changePage(this.props.pageNumber);
}
}, {
key: 'render',
@@ -82,7 +82,8 @@ PageButton.propTypes = {
active: _propTypes2.default.bool,
disable: _propTypes2.default.bool,
hidden: _propTypes2.default.bool,
children: _propTypes2.default.node
children: _propTypes2.default.node,
pageNumber: _propTypes2.default.number
};
var _default = PageButton;

View File

@@ -278,25 +278,42 @@ var PaginationList = function (_Component) {
}
if (dropdownProps || !dropdown) {
var isBootstrap4 = _util2.default.isBootstrap4(this.props.version);
var sizePerPageOptions = sizePerPageList.map(function (_sizePerPage) {
var pageText = _sizePerPage.text || _sizePerPage;
var pageNum = _sizePerPage.value || _sizePerPage;
if (sizePerPage === pageNum) sizePerPageText = pageText;
return _react2.default.createElement(
'li',
{ key: pageText, role: 'presentation', className: 'dropdown-item' },
_react2.default.createElement(
if (isBootstrap4) {
return _react2.default.createElement(
'a',
{ role: 'menuitem',
tabIndex: '-1', href: '#',
'data-page': pageNum,
{
href: '#',
tabIndex: '-1',
key: pageText,
className: 'dropdown-item',
onMouseDown: function onMouseDown(e) {
e.preventDefault();
_this3.changeSizePerPage(pageNum);
} },
pageText
)
);
);
} else {
return _react2.default.createElement(
'li',
{ key: pageText, role: 'presentation', className: 'dropdown-item' },
_react2.default.createElement(
'a',
{ role: 'menuitem',
tabIndex: '-1', href: '#',
'data-page': pageNum,
onMouseDown: function onMouseDown(e) {
e.preventDefault();
_this3.changeSizePerPage(pageNum);
} },
pageText
)
);
}
});
dropdown = _react2.default.createElement(_SizePerPageDropDown2.default, _extends({
open: this.state.open,
@@ -304,7 +321,8 @@ var PaginationList = function (_Component) {
currSizePerPage: String(sizePerPageText),
options: sizePerPageOptions,
onClick: this.toggleDropDown,
onBlur: this.closeDropDown
onBlur: this.closeDropDown,
isBootstrap4: isBootstrap4
}, dropdownProps));
}
return dropdown;
@@ -335,28 +353,34 @@ var PaginationList = function (_Component) {
return true;
}
return isStart(page, this.props) || isEnd(page, this.props) ? false : true;
}, this).map(function (page) {
}, this).map(function (page, index) {
var isActive = page === this.props.currPage;
var isDisabled = isStart(page, this.props) || isEnd(page, this.props) ? true : false;
var title = page + '';
var pageNumber = page;
if (page === this.props.nextPage) {
title = this.props.nextPageTitle;
pageNumber = this.props.currPage + 1;
} else if (page === this.props.prePage) {
title = this.props.prePageTitle;
pageNumber = this.props.currPage - 1;
} else if (page === this.props.firstPage) {
title = this.props.firstPageTitle;
pageNumber = this.props.pageStartIndex;
} else if (page === this.props.lastPage) {
title = this.props.lastPageTitle;
pageNumber = this.getLastPage();
}
return _react2.default.createElement(
_PageButton2.default,
{ key: page,
{ key: index,
title: title,
changePage: this.changePage,
active: isActive,
disable: isDisabled },
disable: isDisabled,
pageNumber: pageNumber },
page
);
}, this);
@@ -421,7 +445,10 @@ PaginationList.propTypes = {
paginationShowsTotal: _propTypes2.default.oneOfType([_propTypes2.default.bool, _propTypes2.default.func]),
paginationSize: _propTypes2.default.number,
onSizePerPageList: _propTypes2.default.func,
prePage: _propTypes2.default.string,
prePage: _propTypes2.default.any,
nextPage: _propTypes2.default.any,
firstPage: _propTypes2.default.any,
lastPage: _propTypes2.default.any,
pageStartIndex: _propTypes2.default.number,
hideSizePerPage: _propTypes2.default.bool,
alwaysShowAllBtns: _propTypes2.default.bool,

View File

@@ -45,21 +45,35 @@ var SizePerPageDropDown = function (_Component) {
className = _props.className,
variation = _props.variation,
btnContextual = _props.btnContextual,
isBootstrap4 = _props.isBootstrap4,
currSizePerPage = _props.currSizePerPage;
if (hidden) return null;
var openClass = open ? 'open show' : '';
var dropDownStyle = { visibility: hidden ? 'hidden' : 'visible' };
var renderOptions = function renderOptions() {
var attrs = {
className: 'dropdown-menu ' + openClass,
role: 'menu',
'aria-labelledby': 'pageDropDown'
};
var type = isBootstrap4 ? 'div' : 'ul';
return _react2.default.createElement(type, attrs, options);
};
return _react2.default.createElement(
'span',
{ style: dropDownStyle,
{
className: variation + ' ' + openClass + ' ' + className + ' ' + sizePerPageDefaultClass },
_react2.default.createElement(
'button',
{ className: 'btn ' + btnContextual + ' dropdown-toggle',
id: 'pageDropDown', 'data-toggle': 'dropdown',
'aria-expanded': open,
'aria-haspopup': !open,
onClick: onClick,
onBlur: onBlur },
currSizePerPage,
@@ -70,11 +84,7 @@ var SizePerPageDropDown = function (_Component) {
_react2.default.createElement('span', { className: 'caret' })
)
),
_react2.default.createElement(
'ul',
{ className: 'dropdown-menu', role: 'menu', 'aria-labelledby': 'pageDropDown' },
options
)
renderOptions()
);
}
}]);

View File

@@ -503,10 +503,12 @@ var TableDataStore = function () {
}
}, {
key: 'filterText',
value: function filterText(targetVal, filterVal) {
value: function filterText() {
var targetVal = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
var filterVal = arguments[1];
var cond = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : _Const2.default.FILTER_COND_LIKE;
targetVal = targetVal.toString();
targetVal = targetVal === null ? '' : targetVal.toString();
filterVal = filterVal.toString();
if (cond === _Const2.default.FILTER_COND_EQ) {
return targetVal === filterVal;

View File

@@ -55,7 +55,7 @@ var ClearSearchButton = function (_Component) {
);
return _react2.default.createElement(
'button',
_extends({ ref: 'btn',
_extends({
className: 'btn ' + btnContextual + ' ' + className + ' ' + clearBtnDefaultClass,
type: 'button',
onClick: onClick

View File

@@ -67,9 +67,8 @@ var InsertModal = function (_Component) {
}, {
key: '__handleSave__REACT_HOT_LOADER__',
value: function __handleSave__REACT_HOT_LOADER__() {
var bodyRefs = this.refs.body;
if (bodyRefs.getFieldValue) {
this.props.onSave(bodyRefs.getFieldValue());
if (this.body.getFieldValue) {
this.props.onSave(this.body.getFieldValue());
} else {
console.error('Custom InsertModalBody should implement getFieldValue function\n and should return an object presented as the new row that user input.');
}
@@ -77,6 +76,8 @@ var InsertModal = function (_Component) {
}, {
key: 'render',
value: function render() {
var _this3 = this;
var _props = this.props,
headerComponent = _props.headerComponent,
footerComponent = _props.footerComponent,
@@ -96,7 +97,9 @@ var InsertModal = function (_Component) {
footerComponent = footerComponent && footerComponent(onModalClose, this.handleSave);
if (bodyComponent) {
bodyComponent = _react2.default.cloneElement(bodyComponent, { ref: 'body' });
bodyComponent = _react2.default.cloneElement(bodyComponent, { ref: function ref(node) {
return _this3.body = node;
} });
}
if (headerComponent && headerComponent.type.name === _InsertModalHeader2.default.name) {
@@ -144,7 +147,9 @@ var InsertModal = function (_Component) {
version: this.props.version,
className: 'react-bs-table-inser-modal-header',
onModalClose: onModalClose }),
bodyComponent || _react2.default.createElement(_InsertModalBody2.default, _extends({ ref: 'body' }, bodyAttr)),
bodyComponent || _react2.default.createElement(_InsertModalBody2.default, _extends({ ref: function ref(node) {
return _this3.body = node;
} }, bodyAttr)),
footerComponent || _react2.default.createElement(_InsertModalFooter2.default, {
className: 'react-bs-table-inser-modal-footer',
onModalClose: onModalClose,

View File

@@ -217,9 +217,7 @@ var ToolBar = function (_Component) {
var delay = this.props.searchDelayTime ? this.props.searchDelayTime : 0;
this.debounceCallback = this.handleDebounce(function () {
var seachInput = _this3.refs.seachInput;
seachInput && _this3.props.onSearch(seachInput.getValue());
_this3.seachInput && _this3.props.onSearch(_this3.seachInput.getValue());
}, delay);
}
}, {
@@ -237,10 +235,8 @@ var ToolBar = function (_Component) {
}, {
key: 'setSearchInput',
value: function setSearchInput(text) {
var seachInput = this.refs.seachInput;
if (seachInput && seachInput.value !== text) {
seachInput.value = text;
if (this.seachInput && this.seachInput.value !== text) {
this.seachInput.value = text;
}
}
}, {
@@ -392,11 +388,6 @@ var ToolBar = function (_Component) {
value: function __handleDropRowBtnClick__REACT_HOT_LOADER__() {
this.props.onDropRow();
}
}, {
key: 'handleCloseBtn',
value: function handleCloseBtn() {
this.refs.warning.style.display = 'none';
}
}, {
key: '__handleKeyUp__REACT_HOT_LOADER__',
value: function __handleKeyUp__REACT_HOT_LOADER__(event) {
@@ -411,9 +402,7 @@ var ToolBar = function (_Component) {
}, {
key: '__handleClearBtnClick__REACT_HOT_LOADER__',
value: function __handleClearBtnClick__REACT_HOT_LOADER__() {
var seachInput = this.refs.seachInput;
seachInput && seachInput.setValue('');
this.seachInput && this.seachInput.setValue('');
this.props.onSearch('');
}
}, {
@@ -532,6 +521,8 @@ var ToolBar = function (_Component) {
}, {
key: 'renderSearchPanel',
value: function renderSearchPanel() {
var _this7 = this;
if (this.props.enableSearch) {
var classNames = 'form-group form-group-sm react-bs-table-search-form';
var clearBtn = null;
@@ -554,16 +545,22 @@ var ToolBar = function (_Component) {
});
if (searchField.type.name === _SearchField2.default.name) {
searchField = _react2.default.cloneElement(searchField, {
ref: 'seachInput',
ref: function ref(node) {
return _this7.seachInput = node;
},
onKeyUp: this.handleKeyUp
});
} else {
searchField = _react2.default.cloneElement(searchField, {
ref: 'seachInput'
ref: function ref(node) {
return _this7.seachInput = node;
}
});
}
} else {
searchField = _react2.default.createElement(_SearchField2.default, { ref: 'seachInput',
searchField = _react2.default.createElement(_SearchField2.default, { ref: function ref(node) {
return _this7.seachInput = node;
},
defaultValue: this.props.defaultSearch,
placeholder: this.props.searchPlaceholder,
onKeyUp: this.handleKeyUp });
@@ -627,6 +624,7 @@ var ToolBar = function (_Component) {
_reactModal2.default,
{ className: 'react-bs-insert-modal modal-dialog',
isOpen: this.state.isInsertModalOpen,
ariaHideApp: false,
onRequestClose: this.handleModalClose,
contentLabel: 'Modal' },
modal

View File

@@ -21,9 +21,7 @@
"saveSpec": null,
"fetchSpec": "3.1.2"
},
"_requiredBy": [
"/react-bootstrap-table"
],
"_requiredBy": [],
"_resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.2.tgz",
"_spec": "3.1.2",
"_where": "C:\\Users\\deranjer\\go\\src\\github.com\\deranjer\\goTorrent\\goTorrentWebUI",

View File

@@ -1,31 +1,31 @@
{
"_args": [
[
"react-bootstrap-table@4.1.2",
"react-bootstrap-table@4.3.1",
"C:\\Users\\deranjer\\go\\src\\github.com\\deranjer\\goTorrent\\goTorrentWebUI"
]
],
"_from": "react-bootstrap-table@4.1.2",
"_id": "react-bootstrap-table@4.1.2",
"_from": "react-bootstrap-table@4.3.1",
"_id": "react-bootstrap-table@4.3.1",
"_inBundle": false,
"_integrity": "sha1-AOyg/TGeNqcIwbpuvLPPyqGfM9M=",
"_integrity": "sha1-9wS+Vbf2vwVX0vxb7G0l/TB9DN4=",
"_location": "/react-bootstrap-table",
"_phantomChildren": {},
"_requested": {
"type": "version",
"registry": true,
"raw": "react-bootstrap-table@4.1.2",
"raw": "react-bootstrap-table@4.3.1",
"name": "react-bootstrap-table",
"escapedName": "react-bootstrap-table",
"rawSpec": "4.1.2",
"rawSpec": "4.3.1",
"saveSpec": null,
"fetchSpec": "4.1.2"
"fetchSpec": "4.3.1"
},
"_requiredBy": [
"/"
],
"_resolved": "https://registry.npmjs.org/react-bootstrap-table/-/react-bootstrap-table-4.1.2.tgz",
"_spec": "4.1.2",
"_resolved": "https://registry.npmjs.org/react-bootstrap-table/-/react-bootstrap-table-4.3.1.tgz",
"_spec": "4.3.1",
"_where": "C:\\Users\\deranjer\\go\\src\\github.com\\deranjer\\goTorrent\\goTorrentWebUI",
"author": {
"name": "AllenFang"
@@ -36,8 +36,8 @@
"dependencies": {
"classnames": "^2.1.2",
"prop-types": "^15.5.10",
"react-modal": "^3.0.3",
"react-s-alert": "^1.3.0"
"react-modal": "^3.1.7",
"react-s-alert": "^1.3.2"
},
"description": "It's a react table for bootstrap",
"devDependencies": {
@@ -65,9 +65,9 @@
"jest-cli": "^19.0.2",
"jquery": "^2.1.4",
"jsx-loader": "^0.13.2",
"react": "^16.0.0",
"react-bootstrap": "^0.31.3",
"react-dom": "^16.0.0",
"react": "16.0.0",
"react-bootstrap": "0.31.3",
"react-dom": "16.0.0",
"react-hot-loader": "^3.0.0-beta.6",
"react-router": "^3.2.0",
"style-loader": "^0.13.0",
@@ -115,5 +115,5 @@
"tags": [
"react"
],
"version": "4.1.2"
"version": "4.3.1"
}