import { Flex } from 'antd';
import React from 'react';
import DescriptionItem from '../../../../components/DescriptionItem';
import RealtimeIndex from '../RealtimeIndex';
import styles from './index.less';

const GarbageSorting: React.FC = () => {
  return (
    <div className={styles.container}>
      <div className={styles.container}>
        <Flex justify="space-between">
          <RealtimeIndex
            riskNum={3}
            value={77.2}
            compareOneHour={-1.3}
          ></RealtimeIndex>
          <div className={styles.rightWrap}>
            <DescriptionItem value={48} name="生活垃圾回收利用率" unit="%" />
            <DescriptionItem
              value={156}
              style={{
                marginTop: 20,
              }}
              name="居民小区生活垃圾分类覆盖率"
              unit="%"
            />
          </div>
        </Flex>
      </div>
    </div>
  );
};

export default GarbageSorting;
