finish.tsx 2.16 KB
import React from 'react';
import { Button } from 'antd';
import { CheckCircleFilled, CloseCircleFilled } from '@ant-design/icons';
import { handleDownload } from '@/libs/htmlHandle';

interface FinishProps {
  changeFinish: any;
  importData: any;
}

const Finish: React.FC<FinishProps> = (props) => {
  const { changeFinish = () => {}, importData } = props;
  const downloadError = () => {
    handleDownload(importData?.downloadUrl, '错误文件.xlsx');
  };
  return (
    <>
      <div className={'qx-import-finish'}>
        <div className={'qx-import-finish-main'}>
          <div className={'qx-import-finish-icon'}>
            <CheckCircleFilled />
          </div>
          <div className={'qx-import-finish-text'}>导入成功</div>
          <div className={'qx-import-finish-success'}>
            <CheckCircleFilled />
            成功导入主表数据{' '}
            <span>{importData?.finalMsg?.mainTable || 0} </span>条
            {(importData?.finalMsg?.childTable || []).map((el: any) => {
              return (
                <>
                  ;{el.name}数据 <span>{el.count || 0} </span> 条
                </>
              );
            })}
            {importData?.finalMsg?.childTable?.count && (
              <>
                ;子表数据{' '}
                <span>{importData?.finalMsg?.childTable?.count || 0} </span>条
              </>
            )}
          </div>
          <div className={'qx-import-finish-error'}>
            <CloseCircleFilled />
            未导入错误数据 <span>{importData?.finalMsg?.error || 0} </span>条
            {importData?.downloadUrl && (
              <>
                ,请{' '}
                <span
                  style={{ color: '#3499FF', cursor: 'pointer' }}
                  onClick={() => downloadError()}
                >
                  下载错误文件{' '}
                </span>
                修改后重新导入
              </>
            )}
          </div>
        </div>
      </div>
      <div className={'qx-import-button'}>
        <Button type="primary" onClick={changeFinish}>
          完成
        </Button>
      </div>
    </>
  );
};

export default Finish;