choerodon-ui
Version:
An enterprise-class UI design language and React-based implementation
207 lines (184 loc) • 7.06 kB
JavaScript
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _extends from "@babel/runtime/helpers/extends";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _inherits from "@babel/runtime/helpers/inherits";
import _createSuper from "@babel/runtime/helpers/createSuper";
import React, { Component } from 'react';
import classNames from 'classnames';
import Checkbox from '../checkbox';
import Dropdown from '../dropdown';
import Menu from '../menu';
import Icon from '../icon';
var SelectionCheckboxAll = /*#__PURE__*/function (_Component) {
_inherits(SelectionCheckboxAll, _Component);
var _super = _createSuper(SelectionCheckboxAll);
function SelectionCheckboxAll(props) {
var _this;
_classCallCheck(this, SelectionCheckboxAll);
_this = _super.call(this, props);
_this.handleSelectAllChagne = function (e) {
var checked = e.target.checked;
var onSelect = _this.props.onSelect;
onSelect(checked ? 'all' : 'removeAll', 0, null);
};
_this.defaultSelections = props.hideDefaultSelections ? [] : [{
key: 'all',
text: props.locale.selectAll,
onSelect: function onSelect() {}
}, {
key: 'invert',
text: props.locale.selectInvert,
onSelect: function onSelect() {}
}];
_this.state = {
checked: _this.getCheckState(props),
indeterminate: _this.getIndeterminateState(props)
};
return _this;
}
_createClass(SelectionCheckboxAll, [{
key: "componentDidMount",
value: function componentDidMount() {
this.subscribe();
}
}, {
key: "componentWillReceiveProps",
value: function componentWillReceiveProps(nextProps) {
this.setCheckState(nextProps);
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.unsubscribe) {
this.unsubscribe();
}
}
}, {
key: "subscribe",
value: function subscribe() {
var _this2 = this;
var store = this.props.store;
this.unsubscribe = store.subscribe(function () {
_this2.setCheckState(_this2.props);
});
}
}, {
key: "checkSelection",
value: function checkSelection(data, type, byDefaultChecked) {
var _this$props = this.props,
store = _this$props.store,
getCheckboxPropsByItem = _this$props.getCheckboxPropsByItem,
getRecordKey = _this$props.getRecordKey; // type should be 'every' | 'some'
if (type === 'every' || type === 'some') {
return byDefaultChecked ? data[type](function (item, i) {
return getCheckboxPropsByItem(item, i).defaultChecked;
}) : data[type](function (item, i) {
return store.getState().selectedRowKeys.indexOf(getRecordKey(item, i)) >= 0;
});
}
return false;
}
}, {
key: "setCheckState",
value: function setCheckState(props) {
var checked = this.getCheckState(props);
var indeterminate = this.getIndeterminateState(props);
this.setState(function (prevState) {
var newState = {};
if (indeterminate !== prevState.indeterminate) {
newState.indeterminate = indeterminate;
}
if (checked !== prevState.checked) {
newState.checked = checked;
}
return newState;
});
}
}, {
key: "getCheckState",
value: function getCheckState(props) {
var store = props.store,
data = props.data;
var checked;
if (!data.length) {
checked = false;
} else {
checked = store.getState().selectionDirty ? this.checkSelection(data, 'every', false) : this.checkSelection(data, 'every', false) || this.checkSelection(data, 'every', true);
}
return checked;
}
}, {
key: "getIndeterminateState",
value: function getIndeterminateState(props) {
var store = props.store,
data = props.data;
var indeterminate;
if (!data.length) {
indeterminate = false;
} else {
indeterminate = store.getState().selectionDirty ? this.checkSelection(data, 'some', false) && !this.checkSelection(data, 'every', false) : this.checkSelection(data, 'some', false) && !this.checkSelection(data, 'every', false) || this.checkSelection(data, 'some', true) && !this.checkSelection(data, 'every', true);
}
return indeterminate;
}
}, {
key: "renderMenus",
value: function renderMenus(selections) {
var onSelect = this.props.onSelect;
return selections.map(function (selection, index) {
return /*#__PURE__*/React.createElement(Menu.Item, {
key: selection.key || index
}, /*#__PURE__*/React.createElement("div", {
onClick: function onClick() {
return onSelect(selection.key, index, selection.onSelect);
}
}, selection.text));
});
}
}, {
key: "render",
value: function render() {
var _this$props2 = this.props,
disabled = _this$props2.disabled,
prefixCls = _this$props2.prefixCls,
checkboxPrefixCls = _this$props2.checkboxPrefixCls,
selections = _this$props2.selections,
getPopupContainer = _this$props2.getPopupContainer,
menuProps = _this$props2.menuProps,
dropdownProps = _this$props2.dropdownProps;
var _this$state = this.state,
checked = _this$state.checked,
indeterminate = _this$state.indeterminate;
var selectionPrefixCls = "".concat(prefixCls, "-selection");
var customSelections = null;
if (selections) {
var newSelections = Array.isArray(selections) ? this.defaultSelections.concat(selections) : this.defaultSelections;
var menu = /*#__PURE__*/React.createElement(Menu, _extends({}, menuProps, {
className: "".concat(selectionPrefixCls, "-menu"),
selectedKeys: []
}), this.renderMenus(newSelections));
customSelections = newSelections.length > 0 ? /*#__PURE__*/React.createElement(Dropdown, _extends({}, dropdownProps, {
overlay: menu,
getPopupContainer: getPopupContainer
}), /*#__PURE__*/React.createElement("div", {
className: "".concat(selectionPrefixCls, "-down")
}, /*#__PURE__*/React.createElement(Icon, {
type: "expand_more"
}))) : null;
}
return /*#__PURE__*/React.createElement("div", {
className: selectionPrefixCls
}, /*#__PURE__*/React.createElement(Checkbox, {
prefixCls: checkboxPrefixCls,
className: classNames(_defineProperty({}, "".concat(selectionPrefixCls, "-select-all-custom"), customSelections)),
checked: checked,
indeterminate: indeterminate,
disabled: disabled,
onChange: this.handleSelectAllChagne
}), customSelections);
}
}]);
return SelectionCheckboxAll;
}(Component);
export { SelectionCheckboxAll as default };
//# sourceMappingURL=SelectionCheckboxAll.js.map