import { h, Component } from 'preact';

import styles from './css/index.less';


export default class CountDown extends Component<any, any> {
  render() {
    const { countDown, onClickClose } = this.props;
    const countDownLottieUrl = 'https://image-1251917893.file.myqcloud.com/Esports/pix/lottie/time-lottie2.json';
    // const countDown = '00:22';
    return (
      <div className={styles['count-down-box']}>
        <div className={styles['count-down']}>
          <lottie
            className={styles['count-down-lottie']}
            src={countDownLottieUrl}
            autoPlay="true"
            speed="2"
            // eslint-disable-next-line react/no-unknown-property
            loop={true}
            direction="1"
          >
          </lottie>
          <div className={styles['count-down-text']}>
            匹配中
          </div>
          <div className={styles['count-down-num']}>
            {countDown}
          </div>
          <div
            className={styles['btn-close']}
            onClick={onClickClose}
          />
        </div>
      </div>
    );
  }
}