// 设备管理 导航条的右侧
import React, { useState, useEffect } from 'react';

import cx from 'classnames';
import styles from './index.less';

export default ({}) => {
  const [allList] = useState([
    {
      name: '运行中',
      id: 'run',
      num: 7,
    },
    {
      name: '加班/超时运行',
      id: 'overtime',
      num: 60,
    },
    {
      name: '不在运行时间',
      id: 'nottime',
      num: 33,
    },
  ]);

  return (
    <>
      <div className={styles.right}>
        <div className={styles.allList}>
          <div className={styles.item}>
            <div className={cx(styles.run, styles.circle)}></div>
            <div className={styles.title}>运行中</div>
            <div className={styles.num}>22</div>
          </div>
          <div className={styles.item}>
            <div className={cx(styles.overtime, styles.circle)}></div>
            <div className={styles.title}>加班/超时运行</div>
            <div className={styles.num}>5</div>
          </div>
          <div className={styles.item}>
            <div className={cx(styles.nottime, styles.circle)}></div>
            <div className={styles.title}>不在运行时间</div>
            <div className={styles.num}>15</div>
          </div>
        </div>
      </div>
    </>
  );
};
