import { Divider, Flex, Space } from 'antd'
import BaseCard from '@/pages/Common/components/BaseCard'
import styles from './index.less'

const StatisticsCard = () => {
  return (
    <BaseCard>
      <Space direction='vertical' size={10} className={styles.content}>
        <div className={styles.title}>
          当前&nbsp;<span>160</span>&nbsp;件疑难问题待解决
        </div>
        <div className={styles.collect}>
          <span>
            历史共计&nbsp;<span className={styles.count}>112</span>&nbsp;件
          </span>
          <Divider type="vertical" style={{ background: '#BAC8D6' }} />
          <span>
            已解决&nbsp;<span className={styles.count}>12</span>&nbsp;件
          </span>
        </div>
        <Flex gap={10} className={styles.cardContent}>
          <div className={styles.cardItem}>
            <span>
              <img
                className={styles.img}
                src={require('@/assets/images/event/yinanAddIcon.png')}
                alt=""
              />
              &nbsp;今日新增
            </span>
            <span className={styles.count}>
              6
            </span>
            <span>个</span>
          </div>

          <div className={styles.cardItem}>
            <span>
              <img
                className={styles.img}
                src={require('@/assets/images/event/yinanDispIcon.png')}
                alt=""
              />
              &nbsp;今日解决
            </span>
            <span className={styles.count} style={{ color: '#5895FB' }}>
              6
            </span>
            <span>个</span>
          </div>
        </Flex>
      </Space>

    </BaseCard>
  )
}

export default StatisticsCard