linkmore-design
Version:
🌈 🚀lm组件库。🚀
88 lines (86 loc) • 3.43 kB
JavaScript
import _extends from "@babel/runtime/helpers/esm/extends";
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import { useDebounceEffect, useMemoizedFn } from 'ahooks';
import omit from 'lodash/omit';
import pick from 'lodash/pick';
import React, { useRef, useState } from 'react';
import Button from "../../button";
import Cascader from "../../cascader";
import DelayInput from "./DelayInput";
// 重置级联弹框
var DropdownRender = function DropdownRender(props) {
var dom = props.dom,
setSearchValue = props.setSearchValue,
onCancel = props.onCancel,
locale = props.locale,
multiple = props.multiple,
onOk = props.onOk;
var inputRef = useRef(null);
useDebounceEffect(function () {
var _inputRef$current, _inputRef$current$foc;
(_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : (_inputRef$current$foc = _inputRef$current.focus) === null || _inputRef$current$foc === void 0 ? void 0 : _inputRef$current$foc.call(_inputRef$current, {
cursor: 'all'
});
}, [], {
wait: 200
});
return /*#__PURE__*/React.createElement("div", {
className: "filter_dropdown"
}, /*#__PURE__*/React.createElement("div", {
className: "filter_header"
}, /*#__PURE__*/React.createElement(DelayInput, {
ref: inputRef,
onSearch: setSearchValue,
onChange: setSearchValue
})), dom, !!multiple && /*#__PURE__*/React.createElement("div", {
className: "filter_footer"
}, /*#__PURE__*/React.createElement("div", {
className: "footer_clear",
onClick: onCancel
}, locale.cancel), /*#__PURE__*/React.createElement(Button, {
type: "primary",
size: "small",
onClick: onOk
}, locale.ok)));
};
var CascaderFilter = function CascaderFilter(props) {
var _props$value = props.value,
value = _props$value === void 0 ? [] : _props$value,
onChange = props.onChange,
onCancel = props.onCancel;
var _useState = useState(value),
_useState2 = _slicedToArray(_useState, 2),
checkedValues = _useState2[0],
setCheckedValues = _useState2[1];
var _useState3 = useState(''),
_useState4 = _slicedToArray(_useState3, 2),
searchValue = _useState4[0],
setSearchValue = _useState4[1];
var handleChange = function handleChange(item) {
setCheckedValues(item);
if (!props.multiple) {
onChange === null || onChange === void 0 ? void 0 : onChange(item);
}
};
// 确定
var onOk = function onOk() {
var resetValue = checkedValues !== null && checkedValues !== void 0 && checkedValues.length ? checkedValues : undefined;
onChange === null || onChange === void 0 ? void 0 : onChange(resetValue);
onCancel === null || onCancel === void 0 ? void 0 : onCancel(false);
};
var dropdownRender = useMemoizedFn(function (dom) {
return /*#__PURE__*/React.createElement(DropdownRender, _extends({
dom: dom,
onOk: onOk,
setSearchValue: setSearchValue
}, pick(props, ['onCancel', 'locale', 'multiple'])));
});
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Cascader, _extends({}, omit(props, ['value', 'onChange', 'onCancel', 'children']), {
onChange: handleChange,
defaultValue: value,
showSearch: true,
searchValue: searchValue,
dropdownRender: dropdownRender
}), /*#__PURE__*/React.createElement("div", null)));
};
export default CascaderFilter;