import React, { useContext } from 'react'; import PropTypes from 'prop-types'; import classNames from 'classnames'; import { Input, Tree, Divider, ConfigProvider } from 'antd'; import { SearchOutlined } from '@ant-design/icons'; import Empty from '@wisdom-components/empty'; import './index.less'; const DeviceTree = (props) => { const { prefix, placeholder, treeData, onSearch } = props; const { getPrefixCls } = useContext(ConfigProvider.ConfigContext); const prefixCls = getPrefixCls('device-tree'); return ( <div className={classNames(prefixCls)}> <Input prefix={prefix} placeholder={placeholder} bordered={false} onChange={onSearch} onPressEnter={onSearch} /> <Divider /> <div className={classNames(`${prefixCls}-content`)}> {!!treeData.length && <Tree {...props} />} {!treeData.length && <Empty />} </div> </div> ); }; DeviceTree.defaultProps = { prefix: <SearchOutlined />, placeholder: '搜索设备名称', treeData: [], onSearch: () => {}, }; DeviceTree.propTypes = { prefix: PropTypes.node, placeholder: PropTypes.string, treeData: PropTypes.array, onSearch: PropTypes.func, }; export default DeviceTree;