zent
Version:
一套前端设计语言和基于React的实现
54 lines (53 loc) • 3.29 kB
JavaScript
import { __assign, __extends } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cx from 'classnames';
import { Component } from 'react';
import Popover from '../../popover';
import { Checkbox } from '../../checkbox';
import BlockLoading from '../../loading/BlockLoading';
import { getNodeKey } from '../node-fns';
import { getPathValue } from '../path-fns';
var withPopover = Popover.withPopover;
var SearchContent = (function (_super) {
__extends(SearchContent, _super);
function SearchContent() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.closePopup = function () { var _a; return (_a = _this.props.popover) === null || _a === void 0 ? void 0 : _a.close(); };
return _this;
}
SearchContent.prototype.onOptionClick = function (path) {
var onOptionClick = this.props.onOptionClick;
onOptionClick(path, this.closePopup);
};
SearchContent.prototype.renderSearchingOrEmpty = function () {
var _a = this.props, isSearching = _a.isSearching, i18n = _a.i18n;
return (_jsx("div", __assign({ className: "zent-cascader-v2--search-empty", "data-zv": '10.0.17' }, { children: isSearching ? (_jsx(BlockLoading, { height: 32, iconSize: 18, loading: true, colorPreset: "grey", icon: "circle" }, void 0)) : (i18n.searchEmpty) }), void 0));
};
SearchContent.prototype.renderPanels = function () {
var _this = this;
var _a = this.props, searchList = _a.searchList, multiple = _a.multiple, highlight = _a.highlight, keyword = _a.keyword, selectionMap = _a.selectionMap;
return (_jsx("ul", __assign({ className: "zent-cascader-v2--search-list", "data-zv": '10.0.17' }, { children: searchList.map(function (path) {
var leafNode = path[path.length - 1];
var searchItemCls = cx('zent-cascader-v2--search-item', {
'zent-cascader-v2--search-item--multiple': multiple,
});
var checkState;
if (multiple) {
checkState = selectionMap.get(getNodeKey(leafNode));
}
return (_jsxs("li", __assign({ className: searchItemCls, onClick: leafNode.disabled || multiple
? undefined
: function () { return _this.onOptionClick(path); }, "data-zv": '10.0.17' }, { children: [multiple && (_jsx(Checkbox, { value: leafNode.value, onChange: function (e) {
return _this.props.onOptionToggle(path, e.target.checked);
}, checked: checkState === 'on', disabled: leafNode.disabled }, void 0)), highlight(keyword, path)] }), getPathValue(path)));
}) }), void 0));
};
SearchContent.prototype.render = function () {
var _a = this.props, isSearching = _a.isSearching, searchList = _a.searchList;
return (_jsx("div", __assign({ className: "zent-cascader-v2__popup-inner zent-cascader-v2__popup-inner-search", "data-zv": '10.0.17' }, { children: isSearching || !searchList.length
? this.renderSearchingOrEmpty()
: this.renderPanels() }), void 0));
};
return SearchContent;
}(Component));
export default withPopover(SearchContent);