import React, { useEffect, useState } from 'react'
import { Box, AutoRollComponent } from '$components';
import './style.less';

function CitySafty(props) {

    const getContent = () => {
        return <div className='_city_safty'>
            <div className='alarm_handle'>
                <div className='handle_img' />
                <div className='alarm_content'>
                    <div className='alarm_bg'>
                        <div className='alarm_title1'>2023-06-20 17：00：00</div>
                        <div className='alarm_title2'>已处理</div>
                    </div>
                    <div className='alarm_text'>萌萌小区25栋305等等等等等发生等等火灾扥大哥大呢个</div>
                </div>
            </div>
            <div className='alarm_unhandle'>
                <div className='handle_img' />
                <div className='alarm_content'>
                    <div className='alarm_bg'>
                        <div className='alarm_title1'>2023-06-20 17：00：00</div>
                        <div className='alarm_title2' style={{ color: '#24DCF7' }}>处理中</div>
                    </div>
                    <div className='alarm_text'>萌萌小区25栋305等等等等等发生等等火灾扥大哥大呢个</div>
                </div>
            </div>
            <div className='alarm_unhandle'>
                <div className='handle_img' />
                <div className='alarm_content'>
                    <div className='alarm_bg'>
                        <div className='alarm_title1'>2023-06-20 17：00：00</div>
                        <div className='alarm_title2' style={{ color: '#24DCF7' }}>处理中</div>
                    </div>
                    <div className='alarm_text'>萌萌小区25栋305等等等等等发生等等火灾扥大哥大呢个</div>
                </div>
            </div>
        </div>
    }
    return <Box title={"城市安全"} >
        <AutoRollComponent canScroll={true} content={getContent()} divHeight={240} divId={`community-right-top`} />
    </Box>
}

export default CitySafty;