function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; } function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } } function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } import React, { useState } from 'react'; import { Button, Card, Flex, Input, Tree } from 'antd'; import theme from 'antd/es/theme'; import "./index.less"; import { DeleteOutlined, DoubleRightOutlined, SearchOutlined } from '@ant-design/icons'; import { getAllRootKeyById } from "./treeTransferHelper"; var componentName = 'zhst-biz-treeTransfer'; var useToken = theme.useToken; var TreeTransfer = function TreeTransfer(_ref) { var dataSource = _ref.dataSource, treeProps = _ref.treeProps, searchInputProps = _ref.searchInputProps, _ref$targetItems = _ref.targetItems, targetItems = _ref$targetItems === void 0 ? [] : _ref$targetItems, _ref$checkedKeys = _ref.checkedKeys, checkedKeys = _ref$checkedKeys === void 0 ? [] : _ref$checkedKeys, onTreeCheck = _ref.onTreeCheck, onTreeSelect = _ref.onTreeSelect, onItemDelete = _ref.onItemDelete, onOk = _ref.onOk, onReset = _ref.onReset; var _useToken = useToken(), token = _useToken.token; var _useState = useState(''), _useState2 = _slicedToArray(_useState, 2), keyWords = _useState2[0], setKeyWords = _useState2[1]; function findNodesWithKeyword(_keyWords, _treeData) { // @ts-ignore function dfs(node) { return node.filter(function (item) { return item.title.includes(_keyWords); }); } var data = dfs(_treeData); return data || []; } return /*#__PURE__*/React.createElement(Flex, { gap: 20, className: componentName, align: "center", justify: "center" }, /*#__PURE__*/React.createElement("div", { className: "".concat(componentName, "-left") }, /*#__PURE__*/React.createElement(Card, { className: "".concat(componentName, "-left_card"), title: /*#__PURE__*/React.createElement("div", { style: { textAlign: 'center' } }, "\u53EF\u9009\u62E9\u7684\u8303\u56F4"), bodyStyle: { padding: 12 } }, /*#__PURE__*/React.createElement(Input, _extends({ prefix: /*#__PURE__*/React.createElement(SearchOutlined, null), onChange: function onChange(e) { return setKeyWords(e.target.value); }, placeholder: "\u8BF7\u8F93\u5165\u8BBE\u5907\u540D\u79F0" }, searchInputProps)), /*#__PURE__*/React.createElement(Tree, _extends({ style: { marginTop: '6px' }, height: 420, blockNode: true, checkable: true, checkedKeys: checkedKeys, treeData: findNodesWithKeyword(keyWords, dataSource), onCheck: function onCheck(keys, info) { return onTreeCheck === null || onTreeCheck === void 0 ? void 0 : onTreeCheck(keys, info); }, onSelect: function onSelect(keys, info) { return onTreeSelect === null || onTreeSelect === void 0 ? void 0 : onTreeSelect(keys, info); } }, treeProps)))), /*#__PURE__*/React.createElement(DoubleRightOutlined, null), /*#__PURE__*/React.createElement("div", { className: "".concat(componentName, "-right") }, /*#__PURE__*/React.createElement(Card, { className: "".concat(componentName, "-right_card"), title: /*#__PURE__*/React.createElement("div", { style: { textAlign: 'center' } }, "\u5DF2\u9009\u62E9\u7684\u8303\u56F4"), bodyStyle: { padding: 0 } }, /*#__PURE__*/React.createElement("div", { className: "".concat(componentName, "-right_card__items") }, targetItems.map(function (item) { return /*#__PURE__*/React.createElement("div", { className: "".concat(componentName, "-right_card__items___item"), key: item.key, onMouseEnter: function onMouseEnter(e) { e.target.style.backgroundColor = token.colorPrimaryBg; e.target.style.color = token.colorPrimary; }, onMouseLeave: function onMouseLeave(e) { e.target.style.color = token.colorText; e.target.style.backgroundColor = null; } }, item.title, /*#__PURE__*/React.createElement("div", { style: { float: 'right' } }, /*#__PURE__*/React.createElement(DeleteOutlined, { onClick: function onClick() { var _getAllRootKeyById = getAllRootKeyById(item.key, dataSource), root = _getAllRootKeyById.root, keys = _getAllRootKeyById.keys; onItemDelete === null || onItemDelete === void 0 || onItemDelete(item.key, { root: root, keys: keys }); } }))); })), /*#__PURE__*/React.createElement(Flex, { className: "".concat(componentName, "-right_card__btns") }, /*#__PURE__*/React.createElement(Button, { style: { marginRight: 8, width: '50%' }, disabled: targetItems.length <= 0, onClick: onReset }, "\u91CD\u7F6E"), /*#__PURE__*/React.createElement(Button, { style: { width: '50%' }, type: "primary", onClick: function onClick() { return onOk === null || onOk === void 0 ? void 0 : onOk(targetItems); } }, "\u786E\u5B9A"))))); }; export default TreeTransfer;