import React, { useContext } from 'react'; import PropTypes from 'prop-types'; import classNames from 'classnames'; import { Input, Radio, ConfigProvider } from 'antd'; import BasicTable from '@wisdom-components/basictable'; import './index.less'; const RealTimeInfo = (props) => { const { getPrefixCls } = useContext(ConfigProvider.ConfigContext); const prefixCls = getPrefixCls('realtime-info'); const { placeholder, targetValue, guid, updateTime, onSearch, onRadioChange } = props; return ( <div className={classNames(prefixCls)}> <div className={classNames(`${prefixCls}-search-wrap`)}> <div className={classNames(`${prefixCls}-search`)}> <div className={classNames(`${prefixCls}-label`)}>搜索:</div> <Input placeholder={placeholder} onChange={onSearch} onPressEnter={onSearch} /> </div> <div className={classNames(`${prefixCls}-target`)}> <div className={classNames(`${prefixCls}-label`)}>指标:</div> <Radio.Group onChange={onRadioChange} defaultValue={targetValue}> <Radio.Button value="emphasis">重点指标</Radio.Button> <Radio.Button value="all">全部</Radio.Button> </Radio.Group> </div> </div> <div className={classNames(`${prefixCls}-code-wrap`)}> <div>采集编码:{guid}</div> <div>更新时间:{updateTime}</div> </div> <BasicTable {...props} /> </div> ); }; RealTimeInfo.defaultProps = { placeholder: '输入指标名称等', guid: '--', targetValue: 'emphasis', updateTime: '--', onSearch: () => {}, onRadioChange: () => {}, }; RealTimeInfo.propTypes = { placeholder: PropTypes.string, guid: PropTypes.string, targetValue: PropTypes.string, updateTime: PropTypes.string, onSearch: PropTypes.func, onRadioChange: PropTypes.func, }; export default RealTimeInfo;