import classNames from 'classnames';
import React from 'react';

import styles from './style.less';

type Props = {
  text?: string | React.ReactNode;
  style?: React.CSSProperties;
  theme?: 'white' | 'black';
  icon?: any;
};
export default function EasyvNoData(props: Props) {
  const { text = '没有相应的可视化应用', style, theme = 'black', icon } = props;
  return (
    <div
      style={style}
      className={classNames(styles.nodata, {
        [styles.black]: theme === 'black',
        [styles.white]: theme === 'white',
      })}>
      {icon ? (
        <div>
          <img src={icon} />
        </div>
      ) : (
        <div
          className={classNames(styles.nodataImg, {
            [styles.nodataBlackBc]: theme === 'black',
            [styles.nodataWhiteBc]: theme === 'white',
          })}
        />
      )}
      <p
        className={styles.text}
        style={{ color: theme === 'black' ? '#757881' : '#888', marginTop: '5px' }}>
        {text}
      </p>
    </div>
  );
}
