721 lines
26 KiB
JavaScript
721 lines
26 KiB
JavaScript
'use strict';
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
|
|
|
|
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
|
|
|
|
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
|
|
var _react = require('react');
|
|
|
|
var _react2 = _interopRequireDefault(_react);
|
|
|
|
var _propTypes = require('prop-types');
|
|
|
|
var _propTypes2 = _interopRequireDefault(_propTypes);
|
|
|
|
var _reactModal = require('react-modal');
|
|
|
|
var _reactModal2 = _interopRequireDefault(_reactModal);
|
|
|
|
var _Const = require('../Const');
|
|
|
|
var _Const2 = _interopRequireDefault(_Const);
|
|
|
|
var _Notification = require('../Notification.js');
|
|
|
|
var _InsertModal = require('./InsertModal');
|
|
|
|
var _InsertModal2 = _interopRequireDefault(_InsertModal);
|
|
|
|
var _InsertButton = require('./InsertButton');
|
|
|
|
var _InsertButton2 = _interopRequireDefault(_InsertButton);
|
|
|
|
var _DeleteButton = require('./DeleteButton');
|
|
|
|
var _DeleteButton2 = _interopRequireDefault(_DeleteButton);
|
|
|
|
var _ExportCSVButton = require('./ExportCSVButton');
|
|
|
|
var _ExportCSVButton2 = _interopRequireDefault(_ExportCSVButton);
|
|
|
|
var _ShowSelectedOnlyButton = require('./ShowSelectedOnlyButton');
|
|
|
|
var _ShowSelectedOnlyButton2 = _interopRequireDefault(_ShowSelectedOnlyButton);
|
|
|
|
var _SearchField = require('./SearchField');
|
|
|
|
var _SearchField2 = _interopRequireDefault(_SearchField);
|
|
|
|
var _ClearSearchButton = require('./ClearSearchButton');
|
|
|
|
var _ClearSearchButton2 = _interopRequireDefault(_ClearSearchButton);
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
|
|
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
|
|
|
|
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /* eslint no-console: 0 */
|
|
|
|
// import classSet from 'classnames';
|
|
|
|
// import editor from '../Editor';
|
|
|
|
|
|
var ToolBar = function (_Component) {
|
|
_inherits(ToolBar, _Component);
|
|
|
|
function ToolBar(props) {
|
|
_classCallCheck(this, ToolBar);
|
|
|
|
var _this = _possibleConstructorReturn(this, (ToolBar.__proto__ || Object.getPrototypeOf(ToolBar)).call(this, props));
|
|
|
|
_this.displayCommonMessage = function () {
|
|
return _this.__displayCommonMessage__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.handleSaveBtnClick = function () {
|
|
return _this.__handleSaveBtnClick__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.afterHandleSaveBtnClick = function () {
|
|
return _this.__afterHandleSaveBtnClick__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.handleModalClose = function () {
|
|
return _this.__handleModalClose__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.handleModalOpen = function () {
|
|
return _this.__handleModalOpen__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.handleShowOnlyToggle = function () {
|
|
return _this.__handleShowOnlyToggle__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.handleDropRowBtnClick = function () {
|
|
return _this.__handleDropRowBtnClick__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.handleDebounce = function () {
|
|
return _this.__handleDebounce__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.handleKeyUp = function () {
|
|
return _this.__handleKeyUp__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.handleExportCSV = function () {
|
|
return _this.__handleExportCSV__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.handleClearBtnClick = function () {
|
|
return _this.__handleClearBtnClick__REACT_HOT_LOADER__.apply(_this, arguments);
|
|
};
|
|
|
|
_this.timeouteClear = 0;
|
|
_this.modalClassName;
|
|
_this.state = {
|
|
isInsertModalOpen: false,
|
|
validateState: null,
|
|
shakeEditor: false,
|
|
showSelected: false
|
|
};
|
|
return _this;
|
|
}
|
|
|
|
_createClass(ToolBar, [{
|
|
key: '__handleClearBtnClick__REACT_HOT_LOADER__',
|
|
value: function __handleClearBtnClick__REACT_HOT_LOADER__() {
|
|
return this.__handleClearBtnClick__REACT_HOT_LOADER__.apply(this, arguments);
|
|
}
|
|
}, {
|
|
key: '__handleExportCSV__REACT_HOT_LOADER__',
|
|
value: function __handleExportCSV__REACT_HOT_LOADER__() {
|
|
return this.__handleExportCSV__REACT_HOT_LOADER__.apply(this, arguments);
|
|
}
|
|
}, {
|
|
key: '__handleKeyUp__REACT_HOT_LOADER__',
|
|
value: function __handleKeyUp__REACT_HOT_LOADER__() {
|
|
return this.__handleKeyUp__REACT_HOT_LOADER__.apply(this, arguments);
|
|
}
|
|
}, {
|
|
key: '__handleDebounce__REACT_HOT_LOADER__',
|
|
value: function __handleDebounce__REACT_HOT_LOADER__(func, wait, immediate) {
|
|
var _this2 = this,
|
|
_arguments = arguments;
|
|
|
|
var timeout = void 0;
|
|
|
|
return function () {
|
|
var later = function later() {
|
|
timeout = null;
|
|
|
|
if (!immediate) {
|
|
func.apply(_this2, _arguments);
|
|
}
|
|
};
|
|
|
|
var callNow = immediate && !timeout;
|
|
|
|
clearTimeout(timeout);
|
|
|
|
timeout = setTimeout(later, wait || 0);
|
|
|
|
if (callNow) {
|
|
func.appy(_this2, _arguments);
|
|
}
|
|
};
|
|
}
|
|
}, {
|
|
key: '__handleDropRowBtnClick__REACT_HOT_LOADER__',
|
|
value: function __handleDropRowBtnClick__REACT_HOT_LOADER__() {
|
|
return this.__handleDropRowBtnClick__REACT_HOT_LOADER__.apply(this, arguments);
|
|
}
|
|
}, {
|
|
key: '__handleShowOnlyToggle__REACT_HOT_LOADER__',
|
|
value: function __handleShowOnlyToggle__REACT_HOT_LOADER__() {
|
|
return this.__handleShowOnlyToggle__REACT_HOT_LOADER__.apply(this, arguments);
|
|
}
|
|
}, {
|
|
key: '__handleModalOpen__REACT_HOT_LOADER__',
|
|
value: function __handleModalOpen__REACT_HOT_LOADER__() {
|
|
return this.__handleModalOpen__REACT_HOT_LOADER__.apply(this, arguments);
|
|
}
|
|
}, {
|
|
key: '__handleModalClose__REACT_HOT_LOADER__',
|
|
value: function __handleModalClose__REACT_HOT_LOADER__() {
|
|
return this.__handleModalClose__REACT_HOT_LOADER__.apply(this, arguments);
|
|
}
|
|
}, {
|
|
key: '__afterHandleSaveBtnClick__REACT_HOT_LOADER__',
|
|
value: function __afterHandleSaveBtnClick__REACT_HOT_LOADER__() {
|
|
return this.__afterHandleSaveBtnClick__REACT_HOT_LOADER__.apply(this, arguments);
|
|
}
|
|
}, {
|
|
key: '__handleSaveBtnClick__REACT_HOT_LOADER__',
|
|
value: function __handleSaveBtnClick__REACT_HOT_LOADER__() {
|
|
return this.__handleSaveBtnClick__REACT_HOT_LOADER__.apply(this, arguments);
|
|
}
|
|
}, {
|
|
key: '__displayCommonMessage__REACT_HOT_LOADER__',
|
|
value: function __displayCommonMessage__REACT_HOT_LOADER__() {
|
|
return this.__displayCommonMessage__REACT_HOT_LOADER__.apply(this, arguments);
|
|
}
|
|
}, {
|
|
key: 'componentWillMount',
|
|
value: function componentWillMount() {
|
|
var _this3 = this;
|
|
|
|
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());
|
|
}, delay);
|
|
}
|
|
}, {
|
|
key: 'componentWillReceiveProps',
|
|
value: function componentWillReceiveProps(nextProps) {
|
|
if (nextProps.reset) {
|
|
this.setSearchInput('');
|
|
}
|
|
}
|
|
}, {
|
|
key: 'componentWillUnmount',
|
|
value: function componentWillUnmount() {
|
|
this.clearTimeout();
|
|
}
|
|
}, {
|
|
key: 'setSearchInput',
|
|
value: function setSearchInput(text) {
|
|
var seachInput = this.refs.seachInput;
|
|
|
|
if (seachInput && seachInput.value !== text) {
|
|
seachInput.value = text;
|
|
}
|
|
}
|
|
}, {
|
|
key: 'clearTimeout',
|
|
value: function (_clearTimeout) {
|
|
function clearTimeout() {
|
|
return _clearTimeout.apply(this, arguments);
|
|
}
|
|
|
|
clearTimeout.toString = function () {
|
|
return _clearTimeout.toString();
|
|
};
|
|
|
|
return clearTimeout;
|
|
}(function () {
|
|
if (this.timeouteClear) {
|
|
clearTimeout(this.timeouteClear);
|
|
this.timeouteClear = 0;
|
|
}
|
|
})
|
|
}, {
|
|
key: '__displayCommonMessage__REACT_HOT_LOADER__',
|
|
value: function __displayCommonMessage__REACT_HOT_LOADER__() {
|
|
(0, _Notification.notice)('error', this.props.insertFailIndicator, '');
|
|
}
|
|
}, {
|
|
key: 'validateNewRow',
|
|
value: function validateNewRow(newRow) {
|
|
var _this4 = this;
|
|
|
|
var validateState = {};
|
|
var isValid = true;
|
|
var tempMsg = void 0;
|
|
var responseType = void 0;
|
|
|
|
this.props.columns.forEach(function (column) {
|
|
if (column.isKey && column.keyValidator) {
|
|
// key validator for checking exist key
|
|
tempMsg = _this4.props.isValidKey(newRow[column.field]);
|
|
if (tempMsg) {
|
|
_this4.displayCommonMessage();
|
|
isValid = false;
|
|
validateState[column.field] = tempMsg;
|
|
}
|
|
} else if (column.editable && column.editable.validator) {
|
|
// process validate
|
|
tempMsg = column.editable.validator(newRow[column.field], newRow);
|
|
responseType = typeof tempMsg === 'undefined' ? 'undefined' : _typeof(tempMsg);
|
|
if (responseType !== 'object' && tempMsg !== true) {
|
|
_this4.displayCommonMessage();
|
|
isValid = false;
|
|
validateState[column.field] = tempMsg;
|
|
} else if (responseType === 'object' && tempMsg.isValid !== true) {
|
|
(0, _Notification.notice)(tempMsg.notification.type, tempMsg.notification.msg, tempMsg.notification.title);
|
|
isValid = false;
|
|
validateState[column.field] = tempMsg.notification.msg;
|
|
}
|
|
}
|
|
});
|
|
|
|
if (isValid) {
|
|
return true;
|
|
} else {
|
|
this.clearTimeout();
|
|
// show error in form and shake it
|
|
this.setState(function () {
|
|
return { validateState: validateState, shakeEditor: true };
|
|
});
|
|
this.timeouteClear = setTimeout(function () {
|
|
_this4.setState(function () {
|
|
return { shakeEditor: false };
|
|
});
|
|
}, 300);
|
|
return null;
|
|
}
|
|
}
|
|
}, {
|
|
key: '__handleSaveBtnClick__REACT_HOT_LOADER__',
|
|
value: function __handleSaveBtnClick__REACT_HOT_LOADER__(newRow) {
|
|
if (!this.validateNewRow(newRow)) {
|
|
// validation fail
|
|
return;
|
|
}
|
|
var msg = this.props.onAddRow(newRow);
|
|
if (msg !== false) {
|
|
this.afterHandleSaveBtnClick(msg);
|
|
}
|
|
}
|
|
}, {
|
|
key: '__afterHandleSaveBtnClick__REACT_HOT_LOADER__',
|
|
value: function __afterHandleSaveBtnClick__REACT_HOT_LOADER__(msg) {
|
|
var _this5 = this;
|
|
|
|
if (msg) {
|
|
(0, _Notification.notice)('error', msg, '');
|
|
this.clearTimeout();
|
|
// shake form and hack prevent modal hide
|
|
this.setState(function () {
|
|
return {
|
|
shakeEditor: true,
|
|
validateState: 'this is hack for prevent bootstrap modal hide'
|
|
};
|
|
});
|
|
// clear animate class
|
|
this.timeouteClear = setTimeout(function () {
|
|
_this5.setState(function () {
|
|
return { shakeEditor: false };
|
|
});
|
|
}, 300);
|
|
} else {
|
|
// reset state and hide modal hide
|
|
this.setState(function () {
|
|
return {
|
|
validateState: null,
|
|
shakeEditor: false,
|
|
isInsertModalOpen: false
|
|
};
|
|
});
|
|
}
|
|
}
|
|
}, {
|
|
key: '__handleModalClose__REACT_HOT_LOADER__',
|
|
value: function __handleModalClose__REACT_HOT_LOADER__() {
|
|
this.setState(function () {
|
|
return { isInsertModalOpen: false };
|
|
});
|
|
}
|
|
}, {
|
|
key: '__handleModalOpen__REACT_HOT_LOADER__',
|
|
value: function __handleModalOpen__REACT_HOT_LOADER__() {
|
|
this.setState(function () {
|
|
return { isInsertModalOpen: true };
|
|
});
|
|
}
|
|
}, {
|
|
key: '__handleShowOnlyToggle__REACT_HOT_LOADER__',
|
|
value: function __handleShowOnlyToggle__REACT_HOT_LOADER__() {
|
|
var _this6 = this;
|
|
|
|
this.setState(function () {
|
|
return {
|
|
showSelected: !_this6.state.showSelected
|
|
};
|
|
});
|
|
this.props.onShowOnlySelected();
|
|
}
|
|
}, {
|
|
key: '__handleDropRowBtnClick__REACT_HOT_LOADER__',
|
|
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) {
|
|
event.persist();
|
|
this.debounceCallback(event);
|
|
}
|
|
}, {
|
|
key: '__handleExportCSV__REACT_HOT_LOADER__',
|
|
value: function __handleExportCSV__REACT_HOT_LOADER__() {
|
|
this.props.onExportCSV();
|
|
}
|
|
}, {
|
|
key: '__handleClearBtnClick__REACT_HOT_LOADER__',
|
|
value: function __handleClearBtnClick__REACT_HOT_LOADER__() {
|
|
var seachInput = this.refs.seachInput;
|
|
|
|
seachInput && seachInput.setValue('');
|
|
this.props.onSearch('');
|
|
}
|
|
}, {
|
|
key: 'render',
|
|
value: function render() {
|
|
this.modalClassName = 'bs-table-modal-sm' + ToolBar.modalSeq++;
|
|
var toolbar = null;
|
|
var btnGroup = null;
|
|
var insertBtn = null;
|
|
var deleteBtn = null;
|
|
var exportCSVBtn = null;
|
|
var showSelectedOnlyBtn = null;
|
|
|
|
if (this.props.enableInsert) {
|
|
if (this.props.insertBtn) {
|
|
insertBtn = this.renderCustomBtn(this.props.insertBtn, [this.handleModalOpen], _InsertButton2.default.name, 'onClick', this.handleModalOpen);
|
|
} else {
|
|
insertBtn = _react2.default.createElement(_InsertButton2.default, { btnText: this.props.insertText,
|
|
onClick: this.handleModalOpen });
|
|
}
|
|
}
|
|
|
|
if (this.props.enableDelete) {
|
|
if (this.props.deleteBtn) {
|
|
deleteBtn = this.renderCustomBtn(this.props.deleteBtn, [this.handleDropRowBtnClick], _DeleteButton2.default.name, 'onClick', this.handleDropRowBtnClick);
|
|
} else {
|
|
deleteBtn = _react2.default.createElement(_DeleteButton2.default, { btnText: this.props.deleteText,
|
|
onClick: this.handleDropRowBtnClick });
|
|
}
|
|
}
|
|
|
|
if (this.props.enableShowOnlySelected) {
|
|
if (this.props.showSelectedOnlyBtn) {
|
|
showSelectedOnlyBtn = this.renderCustomBtn(this.props.showSelectedOnlyBtn, [this.handleShowOnlyToggle, this.state.showSelected], _ShowSelectedOnlyButton2.default.name, 'onClick', this.handleShowOnlyToggle);
|
|
} else {
|
|
showSelectedOnlyBtn = _react2.default.createElement(_ShowSelectedOnlyButton2.default, { toggle: this.state.showSelected,
|
|
onClick: this.handleShowOnlyToggle });
|
|
}
|
|
}
|
|
|
|
if (this.props.enableExportCSV) {
|
|
if (this.props.exportCSVBtn) {
|
|
exportCSVBtn = this.renderCustomBtn(this.props.exportCSVBtn, [this.handleExportCSV], _ExportCSVButton2.default.name, 'onClick', this.handleExportCSV);
|
|
} else {
|
|
exportCSVBtn = _react2.default.createElement(_ExportCSVButton2.default, { btnText: this.props.exportCSVText,
|
|
onClick: this.handleExportCSV });
|
|
}
|
|
}
|
|
|
|
if (this.props.btnGroup) {
|
|
btnGroup = this.props.btnGroup({
|
|
exportCSVBtn: exportCSVBtn,
|
|
insertBtn: insertBtn,
|
|
deleteBtn: deleteBtn,
|
|
showSelectedOnlyBtn: showSelectedOnlyBtn
|
|
});
|
|
} else {
|
|
btnGroup = _react2.default.createElement(
|
|
'div',
|
|
{ className: 'btn-group btn-group-sm', role: 'group' },
|
|
exportCSVBtn,
|
|
insertBtn,
|
|
deleteBtn,
|
|
showSelectedOnlyBtn
|
|
);
|
|
}
|
|
|
|
var _renderSearchPanel = this.renderSearchPanel(),
|
|
_renderSearchPanel2 = _slicedToArray(_renderSearchPanel, 3),
|
|
searchPanel = _renderSearchPanel2[0],
|
|
searchField = _renderSearchPanel2[1],
|
|
clearBtn = _renderSearchPanel2[2];
|
|
|
|
var modal = this.props.enableInsert ? this.renderInsertRowModal() : null;
|
|
|
|
if (this.props.toolBar) {
|
|
toolbar = this.props.toolBar({
|
|
components: {
|
|
exportCSVBtn: exportCSVBtn,
|
|
insertBtn: insertBtn,
|
|
deleteBtn: deleteBtn,
|
|
showSelectedOnlyBtn: showSelectedOnlyBtn,
|
|
searchPanel: searchPanel,
|
|
btnGroup: btnGroup,
|
|
searchField: searchField,
|
|
clearBtn: clearBtn
|
|
},
|
|
event: {
|
|
openInsertModal: this.handleModalOpen,
|
|
closeInsertModal: this.handleModalClose,
|
|
dropRow: this.handleDropRowBtnClick,
|
|
showOnlyToogle: this.handleShowOnlyToggle,
|
|
exportCSV: this.handleExportCSV,
|
|
search: this.props.onSearch
|
|
}
|
|
});
|
|
} else {
|
|
toolbar = [_react2.default.createElement(
|
|
'div',
|
|
{ key: 'toolbar-left', className: 'col-xs-6 col-sm-6 col-md-6 col-lg-8' },
|
|
this.props.searchPosition === 'left' ? searchPanel : btnGroup
|
|
), _react2.default.createElement(
|
|
'div',
|
|
{ key: 'toolbar-right', className: 'col-xs-6 col-sm-6 col-md-6 col-lg-4' },
|
|
this.props.searchPosition === 'left' ? btnGroup : searchPanel
|
|
)];
|
|
}
|
|
|
|
return _react2.default.createElement(
|
|
'div',
|
|
{ className: 'row' },
|
|
toolbar,
|
|
modal
|
|
);
|
|
}
|
|
}, {
|
|
key: 'renderSearchPanel',
|
|
value: function renderSearchPanel() {
|
|
if (this.props.enableSearch) {
|
|
var classNames = 'form-group form-group-sm react-bs-table-search-form';
|
|
var clearBtn = null;
|
|
var searchField = null;
|
|
var searchPanel = null;
|
|
if (this.props.clearSearch) {
|
|
if (this.props.clearSearchBtn) {
|
|
clearBtn = this.renderCustomBtn(this.props.clearSearchBtn, [this.handleClearBtnClick], _ClearSearchButton2.default.name, 'onClick', this.handleClearBtnClick); /* eslint max-len: 0*/
|
|
} else {
|
|
clearBtn = _react2.default.createElement(_ClearSearchButton2.default, { onClick: this.handleClearBtnClick });
|
|
}
|
|
classNames += ' input-group input-group-sm';
|
|
}
|
|
|
|
if (this.props.searchField) {
|
|
searchField = this.props.searchField({
|
|
search: this.handleKeyUp,
|
|
defaultValue: this.props.defaultSearch,
|
|
placeholder: this.props.searchPlaceholder
|
|
});
|
|
if (searchField.type.name === _SearchField2.default.name) {
|
|
searchField = _react2.default.cloneElement(searchField, {
|
|
ref: 'seachInput',
|
|
onKeyUp: this.handleKeyUp
|
|
});
|
|
} else {
|
|
searchField = _react2.default.cloneElement(searchField, {
|
|
ref: 'seachInput'
|
|
});
|
|
}
|
|
} else {
|
|
searchField = _react2.default.createElement(_SearchField2.default, { ref: 'seachInput',
|
|
defaultValue: this.props.defaultSearch,
|
|
placeholder: this.props.searchPlaceholder,
|
|
onKeyUp: this.handleKeyUp });
|
|
}
|
|
if (this.props.searchPanel) {
|
|
searchPanel = this.props.searchPanel({
|
|
searchField: searchField, clearBtn: clearBtn,
|
|
search: this.props.onSearch,
|
|
defaultValue: this.props.defaultSearch,
|
|
placeholder: this.props.searchPlaceholder,
|
|
clearBtnClick: this.handleClearBtnClick
|
|
});
|
|
} else {
|
|
searchPanel = _react2.default.createElement(
|
|
'div',
|
|
{ className: classNames },
|
|
searchField,
|
|
_react2.default.createElement(
|
|
'span',
|
|
{ className: 'input-group-btn' },
|
|
clearBtn
|
|
)
|
|
);
|
|
}
|
|
return [searchPanel, searchField, clearBtn];
|
|
} else {
|
|
return [];
|
|
}
|
|
}
|
|
}, {
|
|
key: 'renderInsertRowModal',
|
|
value: function renderInsertRowModal() {
|
|
var validateState = this.state.validateState || {};
|
|
var _props = this.props,
|
|
version = _props.version,
|
|
columns = _props.columns,
|
|
ignoreEditable = _props.ignoreEditable,
|
|
insertModalHeader = _props.insertModalHeader,
|
|
insertModalBody = _props.insertModalBody,
|
|
insertModalFooter = _props.insertModalFooter,
|
|
insertModal = _props.insertModal;
|
|
|
|
|
|
var modal = void 0;
|
|
modal = insertModal && insertModal(this.handleModalClose, this.handleSaveBtnClick, columns, validateState, ignoreEditable);
|
|
|
|
if (!modal) {
|
|
modal = _react2.default.createElement(_InsertModal2.default, {
|
|
version: version,
|
|
columns: columns,
|
|
validateState: validateState,
|
|
ignoreEditable: ignoreEditable,
|
|
onModalClose: this.handleModalClose,
|
|
onSave: this.handleSaveBtnClick,
|
|
headerComponent: insertModalHeader,
|
|
bodyComponent: insertModalBody,
|
|
footerComponent: insertModalFooter });
|
|
}
|
|
|
|
return _react2.default.createElement(
|
|
_reactModal2.default,
|
|
{ className: 'react-bs-insert-modal modal-dialog',
|
|
isOpen: this.state.isInsertModalOpen,
|
|
onRequestClose: this.handleModalClose,
|
|
contentLabel: 'Modal' },
|
|
modal
|
|
);
|
|
}
|
|
}, {
|
|
key: 'renderCustomBtn',
|
|
value: function renderCustomBtn(cb, params, componentName, eventName, event) {
|
|
var element = cb.apply(null, params);
|
|
if (element.type.name === componentName && !element.props[eventName]) {
|
|
var props = {};
|
|
props[eventName] = event;
|
|
element = _react2.default.cloneElement(element, props);
|
|
}
|
|
return element;
|
|
}
|
|
}]);
|
|
|
|
return ToolBar;
|
|
}(_react.Component);
|
|
|
|
ToolBar.modalSeq = 0;
|
|
|
|
|
|
ToolBar.propTypes = {
|
|
version: _propTypes2.default.string,
|
|
onAddRow: _propTypes2.default.func,
|
|
onDropRow: _propTypes2.default.func,
|
|
onShowOnlySelected: _propTypes2.default.func,
|
|
enableInsert: _propTypes2.default.bool,
|
|
enableDelete: _propTypes2.default.bool,
|
|
enableSearch: _propTypes2.default.bool,
|
|
enableShowOnlySelected: _propTypes2.default.bool,
|
|
columns: _propTypes2.default.array,
|
|
searchPlaceholder: _propTypes2.default.string,
|
|
exportCSVText: _propTypes2.default.string,
|
|
insertText: _propTypes2.default.string,
|
|
deleteText: _propTypes2.default.string,
|
|
saveText: _propTypes2.default.string,
|
|
closeText: _propTypes2.default.string,
|
|
clearSearch: _propTypes2.default.bool,
|
|
ignoreEditable: _propTypes2.default.bool,
|
|
defaultSearch: _propTypes2.default.string,
|
|
insertModalHeader: _propTypes2.default.func,
|
|
insertModalBody: _propTypes2.default.func,
|
|
insertModalFooter: _propTypes2.default.func,
|
|
insertModal: _propTypes2.default.func,
|
|
insertBtn: _propTypes2.default.func,
|
|
deleteBtn: _propTypes2.default.func,
|
|
showSelectedOnlyBtn: _propTypes2.default.func,
|
|
exportCSVBtn: _propTypes2.default.func,
|
|
clearSearchBtn: _propTypes2.default.func,
|
|
searchField: _propTypes2.default.func,
|
|
searchPanel: _propTypes2.default.func,
|
|
btnGroup: _propTypes2.default.func,
|
|
toolBar: _propTypes2.default.func,
|
|
searchPosition: _propTypes2.default.string,
|
|
reset: _propTypes2.default.bool,
|
|
isValidKey: _propTypes2.default.func,
|
|
insertFailIndicator: _propTypes2.default.string
|
|
};
|
|
|
|
ToolBar.defaultProps = {
|
|
reset: false,
|
|
enableInsert: false,
|
|
enableDelete: false,
|
|
enableSearch: false,
|
|
enableShowOnlySelected: false,
|
|
clearSearch: false,
|
|
ignoreEditable: false,
|
|
exportCSVText: _Const2.default.EXPORT_CSV_TEXT,
|
|
insertText: _Const2.default.INSERT_BTN_TEXT,
|
|
deleteText: _Const2.default.DELETE_BTN_TEXT,
|
|
saveText: _Const2.default.SAVE_BTN_TEXT,
|
|
closeText: _Const2.default.CLOSE_BTN_TEXT
|
|
};
|
|
|
|
var _default = ToolBar;
|
|
exports.default = _default;
|
|
;
|
|
|
|
var _temp = function () {
|
|
if (typeof __REACT_HOT_LOADER__ === 'undefined') {
|
|
return;
|
|
}
|
|
|
|
__REACT_HOT_LOADER__.register(ToolBar, 'ToolBar', '/Users/allen/Node/react-bootstrap-table-new/react-bootstrap-table/src/toolbar/ToolBar.js');
|
|
|
|
__REACT_HOT_LOADER__.register(_default, 'default', '/Users/allen/Node/react-bootstrap-table-new/react-bootstrap-table/src/toolbar/ToolBar.js');
|
|
}();
|
|
|
|
; |