index.jsx 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. // 设备管理 导航条的右侧
  2. import React, { useState, useEffect } from 'react';
  3. import cx from 'classnames';
  4. import styles from './index.less';
  5. export default ({}) => {
  6. const [allList] = useState([
  7. {
  8. name: '运行中',
  9. id: 'run',
  10. num: 7,
  11. },
  12. {
  13. name: '加班/超时运行',
  14. id: 'overtime',
  15. num: 60,
  16. },
  17. {
  18. name: '不在运行时间',
  19. id: 'nottime',
  20. num: 33,
  21. },
  22. ]);
  23. return (
  24. <>
  25. <div className={styles.right}>
  26. <div className={styles.allList}>
  27. <div className={styles.item}>
  28. <div className={cx(styles.run, styles.circle)}></div>
  29. <div className={styles.title}>运行中</div>
  30. <div className={styles.num}>22</div>
  31. </div>
  32. <div className={styles.item}>
  33. <div className={cx(styles.overtime, styles.circle)}></div>
  34. <div className={styles.title}>加班/超时运行</div>
  35. <div className={styles.num}>5</div>
  36. </div>
  37. <div className={styles.item}>
  38. <div className={cx(styles.nottime, styles.circle)}></div>
  39. <div className={styles.title}>不在运行时间</div>
  40. <div className={styles.num}>15</div>
  41. </div>
  42. </div>
  43. </div>
  44. </>
  45. );
  46. };