import { useState, useEffect } from 'react'
import './index.less';
import dayjs from 'dayjs'

const toWeek = (day) => {

    switch (day) {
        case 1:
            return '星期一';
        case 2:
            return '星期二';
        case 3:
            return '星期三';
        case 4:
            return '星期四';
        case 5:
            return '星期五';
        case 6:
            return '星期六';
        case 0:
            return '星期日';
        default:
            return '';
    }
}

export default function MixDate(props) {
    const [date, setDate] = useState(new Date());

    const currentMinutes = date.getMinutes();

    useEffect(() => {
        const interval = setInterval(() => {
            const newDate = new Date();
            const minutes = newDate.getMinutes();
            if (minutes !== currentMinutes) {
                setDate(newDate);
            }
        }, 1000);
        return () => {
            clearInterval(interval);
        }
    }, [currentMinutes])

    return <div className='layout-v mix-date'>
        <div>{toWeek(date.getDay())}</div>
        <div>{dayjs(date).format('YYYY-MM-DD')}</div>
    </div>;
}