import { Button } from 'antd';
import { useState, useEffect } from 'react'
import SvgIcon from '../../../framework/SvgIcon';
import './index.less';
import _ from 'lodash';
import HomeApi from '../../../../utils/apis/HomeApi';
export default function Weather(props) {
    const [weatherItem, setWeatherItem] = useState();
    const [visible, setVisible] = useState(false);


    useEffect(() => {
        HomeApi.realTimeWeather().then(resp => {
            const item = resp.data?.[0];
            setWeatherItem(item);
        });
    }, [])

    const date = new Date();

    return <>

        {weatherItem && <div className={`layout-h center`}>
            <div className='layout-h center'>
                {(weatherItem.icon >= 0 && weatherItem.icon <= 46) ?
                    <img style={{
                        width: 24
                    }} src={`${process.env.PUBLIC_URL}/images/weather/W${weatherItem.icon}.png`} alt={weatherItem.conditionDay} /> : <span>{weatherItem.conditionDay}</span>}
                &nbsp;&nbsp;
                <span>{weatherItem.condition}</span>
                &nbsp;&nbsp;
                <span>{weatherItem.temp} ℃</span>

            </div>
        </div>
        }
    </>;
}   