ProgressDiy.js 2.0 KB
Newer Older
钟是志's avatar
钟是志 committed
1
import React, { useEffect, useState, useRef, useMemo } from 'react';
2 3 4
import { Progress, message } from 'antd';
import styles from './ImportUtil.less';
import { connect } from 'dva';
5 6
import { getServicesNomal } from '../Services/services';
import { importProcessApi } from '../Services/apiConfig';
7 8

function ProgressDiy(props) {
钟是志's avatar
钟是志 committed
9 10 11 12 13
  const {
    fileCacheKey,
    changeOpenProgress = () => {
    },
  } = props;
14 15 16 17
  const interv = useRef();
  const [speedData, setData] = useState({ ...props });
  useEffect(() => {
    interv.current = setInterval(() => {
18 19 20 21
      getServicesNomal(importProcessApi, {
        cacheKey: fileCacheKey,
      }).then(res => {
        setData(res);
22 23
          if (res.finished) {
            clearInterval(interv.current);
钟是志's avatar
钟是志 committed
24 25
            // message.success('导入完成');
            changeOpenProgress(false); // 导入成功
26 27 28 29 30
          }
      });
    }, 1000);
  }, []);

钟是志's avatar
钟是志 committed
31 32 33 34 35 36 37 38 39 40 41 42 43 44
  const percent = useMemo(() => {
    const {
      success,
      total,
      fail,
    } = speedData;
    const r = success + fail;
    if (total === 0) {
      return 0;
    } else if (r > total) {
      return 100;
    }
    return Math.floor(r / total * 100);
  }, [speedData.success]);
45 46 47 48 49 50 51 52 53
  return (
    <div className={styles.juzhongSpin}>
      <div style={{ textAlign: 'center' }}>
        <Progress
          type="circle"
          strokeColor={{
            '0%': '#108ee9',
            '100%': '#87d068',
          }}
钟是志's avatar
钟是志 committed
54
          percent={percent}
55
          status={speedData.finished ? 'success ' : 'active'}
钟是志's avatar
钟是志 committed
56
          // format={percent => `${speedData.success + speedData.fail}/${speedData.total}`}
57 58
        />
        <div className={styles.textCenter}>
钟是志's avatar
钟是志 committed
59
          正在处理导入数据: 共计 {speedData.total} 已处理{speedData.success + speedData.fail}.
60
          请勿关闭弹窗!
61 62 63 64 65 66
        </div>
      </div>
    </div>
  );
}

钟是志's avatar
钟是志 committed
67 68 69 70
export default connect(({
                          DataObj,
                          loading
                        }) => ({
71 72
  DataObj,
}))(ProgressDiy);