import { Flex, Space } from 'antd'
import styles from './index.less'
import Quality from './Quality'
import Problem from './Problem'
import Security from './Security'
import Focus from './Focus'

/**
 * 
 * @description 城市实况模块
 */

const UrbanSituation = () => {
  return (
    <div className={styles.wrap}>
      <Flex justify='space-between' align='center' className={styles.top}>
        <span className={styles.title}>城市实况</span>
        <span className={styles.right}>城市管理实况报告</span>
      </Flex>
      <Flex className={styles.main} gap={23}>
        <Quality />
        <Space direction='vertical' size={29}>
          <Problem />
          <Security />
        </Space>
        <Focus />
      </Flex>
    </div>
  )
}

export default UrbanSituation