
import { Flex, Space, Statistic } from 'antd'
import styles from './index.less'

/**
 * 
 * @description 办理质效顶部部分
 */


const TotalCard = () => {
  return (
    <div className={styles.wrap}>
      <div className={styles.top}>
        <span className={styles.title}>整体态势</span>
      </div>
      <Flex justify='space-between'>
        <Space direction='vertical' size={0}>
          <Space>
            <Statistic value={89.6} />
            <span className={styles.unit}>%</span>
          </Space>
          <span className={styles.name}>按时办结率</span>
        </Space>
        <Space direction='vertical' size={0}>
          <Space>
            <Statistic value={89.6} />
            <span className={styles.unit}>%</span>
          </Space>
          <span className={styles.name}>超期率</span>
        </Space>
        <Space direction='vertical' size={0}>
          <Space>
            <Statistic value={89.6} />
            <span className={styles.unit}>%</span>
          </Space>
          <span className={styles.name}>延期率</span>
        </Space>
        <Space direction='vertical' size={0}>
          <Space>
            <Statistic value={89.6} />
            <span className={styles.unit}>%</span>
          </Space>
          <span className={styles.name}>重办率</span>
        </Space>
        <Space direction='vertical' size={0}>
          <Space>
            <Statistic value={89.6} />
            <span className={styles.unit}>h</span>
          </Space>
          <span className={styles.name}>平均回复周期</span>
        </Space>
        <Space direction='vertical' size={0}>
          <Space>
            <Statistic value={89.6} />
            <span className={styles.unit}>%</span>
          </Space>
          <span className={styles.name}>满意率</span>
        </Space>
      </Flex>
    </div>
  )
}

export default TotalCard