import useCreateCronExpression, {CronDayTimeProps, CronDefinDayProps} from "./Hook/useCreateCronExpression";
import React, {useState} from "react";
import {Button, Checkbox, Select} from "antd";
import {CheckboxChangeEvent} from "antd/es/checkbox";
import type { RadioChangeEvent } from 'antd';
import { Radio } from 'antd';

function CronMaker()
{
    const [everyMin, setEveryMin] = useState<number>(10);
    const [everyHour, setEveryHour] = useState<number>(1);


    const [everyDayHour, setEveryDayHour] = useState<number>(0);
    const [everyDayMin, setEveryDayMin] = useState<number>(0);

    const [weekDayHour, setWeekDayHour] = useState<number>(0);
    const [weekDayMin, setWeekDayMin] = useState<number>(0);

    const [weekEndHour, setWeekEndHour] = useState<number>(0);
    const [weekEndMin, setWeekEndMin] = useState<number>(0);

    const [monDay, setMonDay] = useState<boolean>(false);
    const [tuesDay, setTuesDay] = useState<boolean>(false);
    const [wednesDay, setWednesDay] = useState<boolean>(false);
    const [thursday, setThursday] = useState<boolean>(false);
    const [friday, setFriday] = useState<boolean>(false);
    const [saturday, setSaturday] = useState<boolean>(false);
    const [sunday, setSunday] = useState<boolean>(false);

    const [defineDayHour, setDefineDayHour] = useState<number>(0);
    const [defineDayMin, setDefineDayMin] = useState<number>(0);

    const [menuStr, setMenuStr] = useState<string>("EveryMin");
    const {cronExpression, cronExpressionText
        , createCronEveryMinExpression
        , createCronEveryHourExpression
        , createCronEveryDayExpression
        , createCronEveryWeekDayExpression
        , createCronEveryWeekEndExpression
        , createCronDefineDayExpression
        , initExpression
    } = useCreateCronExpression();

    const everyDayHourChange = (value: number) => {
        setEveryDayHour(value);
    };



    const everyDayMinChange = (value: number) => {
        setEveryDayMin(value);
    };

    const everyDayTimeChange = () =>
    {
        const defineTime:CronDayTimeProps = {
            hour:everyDayHour,
            minute:everyDayMin,
        }
        createCronEveryDayExpression(defineTime);
    }

    const weekDayHourChange = (value: number) => {
        setWeekDayHour(value);
    };

    const weekDayMinChange = (value: number) => {
        setWeekDayMin(value);
    };

    const weekDayTimeChange = () =>
    {
        const defineTime:CronDayTimeProps = {
            hour:weekDayHour,
            minute:weekDayMin,
        }
        createCronEveryWeekDayExpression(defineTime);
    }


    const defineDayHourChange = (value: number) => {
        setDefineDayHour(value);
    };

    const defineDayMinChange = (value: number) => {
        setDefineDayMin(value);
    };

    const defineDayChange = () =>
    {
        const defineTime:CronDayTimeProps = {
            hour:defineDayHour,
            minute:defineDayMin,
        }

        const defineDayParam:CronDefinDayProps ={
            monDay : monDay,
            tuesDay : tuesDay,
            wednesDay : wednesDay,
            thursday : thursday,
            friday : friday,
            saturday : saturday,
            sunday : sunday,
            cronDayTime : defineTime,
        }
        createCronDefineDayExpression(defineDayParam);
    }

    const everyMinChange = (value: number) => {
        setEveryMin(value);
    };

    const everyMinApply = () =>
    {
        createCronEveryMinExpression(everyMin);
    }

    const everyHourChange = (value: number) => {
        setEveryHour(value);
    };

    const everyHourApply = () =>
    {
        createCronEveryHourExpression(everyHour);
    }

    const onChangeMonday = (e: CheckboxChangeEvent) => {
        setMonDay(e.target.checked);
    };

    const onChangeTuesday = (e: CheckboxChangeEvent) => {
        setTuesDay(e.target.checked);
    };

    const onChangeWednesday = (e: CheckboxChangeEvent) => {
        setWednesDay(e.target.checked);
    };

    const onChangeThursday = (e: CheckboxChangeEvent) => {
        setThursday(e.target.checked);
    };

    const onChangeFriday = (e: CheckboxChangeEvent) => {
        setFriday(e.target.checked);
    };

    const onChangeSaturday = (e: CheckboxChangeEvent) => {
        setSaturday(e.target.checked);
    };

    const onChangeSunDay = (e: CheckboxChangeEvent) => {
        setSunday(e.target.checked);
    };


    const weekEndHourChange = (value: number) => {
        setWeekEndHour(value);
    };

    const weekEndMinChange = (value: number) => {
        setWeekEndMin(value);
    };

    const weekEndTimeChange = () =>
    {
        const defineTime:CronDayTimeProps = {
            hour:weekEndHour,
            minute:weekEndMin,
        }
        createCronEveryWeekEndExpression(defineTime);
    }
    const onChangeMenu = (e: RadioChangeEvent) => {
        initExpression();
        setMenuStr(e.target.value);
    };

    return (
        <div style={{margin:"10px", width:"370px"}}>
            <div style={{marginBottom:"10px"}}>
            <Radio.Group onChange={onChangeMenu} defaultValue={menuStr}>
                <Radio.Button value="EveryMin">매분</Radio.Button>
                <Radio.Button value="EveryHour">매시간</Radio.Button>
                <Radio.Button value="EveryDay">매일</Radio.Button>
                <Radio.Button value="WeekDay">평일</Radio.Button>
                <Radio.Button value="WeekEnd">주말</Radio.Button>
                <Radio.Button value="DefineDay">날짜지정</Radio.Button>
            </Radio.Group>
            </div>
        { menuStr === "EveryMin" &&
            <div>
                <Select
                    defaultValue={everyMin}
                    style={{ width: 60 }}
                    onChange={everyMinChange}
                    options={[
                        { value: 1, label: '1' },
                        { value: 2, label: '2' },
                        { value: 3, label: '3' },
                        { value: 4, label: '4' },
                        { value: 5, label: '5' },
                        { value: 6, label: '6' },
                        { value: 7, label: '7' },
                        { value: 8, label: '8' },
                        { value: 9, label: '9' },
                        { value: 10, label: '10' },
                        { value: 15, label: '15' },
                        { value: 30, label: '30' },
                    ]}
                />분 마다 실행
                <div style={{textAlign:"right"}}>
                    <Button type={"primary"} onClick={everyMinApply}>적용</Button>
                </div>
            </div>
        }
        {
            menuStr === "EveryHour" &&
            <div>
                <Select
                    defaultValue={everyHour}
                    style={{ width: 60 }}
                    onChange={everyHourChange}
                    options={[
                        { value: 1, label: '1' },
                        { value: 2, label: '2' },
                        { value: 3, label: '3' },
                        { value: 4, label: '4' },
                        { value: 5, label: '5' },
                        { value: 6, label: '6' },
                        { value: 7, label: '7' },
                        { value: 8, label: '8' },
                        { value: 9, label: '9' },
                        { value: 10, label: '10' },
                        { value: 11, label: '11' },
                        { value: 12, label: '12' },
                    ]}
                />시간 마다 실행
                <div style={{textAlign:"right"}}>
                    <Button type={"primary"} onClick={everyHourApply}>적용</Button>
                </div>
            </div>
        }
        {
            menuStr === "EveryDay" &&
            <div>
                매일 <Select
                defaultValue={everyDayHour}
                style={{ width: 60 }}
                onChange={everyDayHourChange}
                options={[
                    { value: 0, label: '00' },
                    { value: 1, label: '01' },
                    { value: 2, label: '02' },
                    { value: 3, label: '03' },
                    { value: 4, label: '04' },
                    { value: 5, label: '05' },
                    { value: 6, label: '06' },
                    { value: 7, label: '07' },
                    { value: 8, label: '08' },
                    { value: 9, label: '09' },
                    { value: 10, label: '10' },
                    { value: 11, label: '11' },
                    { value: 12, label: '12' },
                    { value: 13, label: '13' },
                    { value: 14, label: '14' },
                    { value: 15, label: '15' },
                    { value: 16, label: '16' },
                    { value: 17, label: '17' },
                    { value: 18, label: '18' },
                    { value: 19, label: '19' },
                    { value: 20, label: '20' },
                    { value: 21, label: '21' },
                    { value: 22, label: '22' },
                    { value: 23, label: '23' },
                ]}
            />시
                <Select
                    defaultValue={everyDayMin}
                    style={{ width: 60 }}
                    onChange={everyDayMinChange}
                    options={[
                        { value: 0, label: '00' },
                        { value: 1, label: '01' },
                        { value: 2, label: '02' },
                        { value: 3, label: '03' },
                        { value: 4, label: '04' },
                        { value: 5, label: '05' },
                        { value: 6, label: '06' },
                        { value: 7, label: '07' },
                        { value: 8, label: '08' },
                        { value: 9, label: '09' },
                        { value: 10, label: '10' },
                        { value: 11, label: '11' },
                        { value: 12, label: '12' },
                        { value: 13, label: '13' },
                        { value: 14, label: '14' },
                        { value: 15, label: '15' },
                        { value: 16, label: '16' },
                        { value: 17, label: '17' },
                        { value: 18, label: '18' },
                        { value: 19, label: '19' },
                        { value: 20, label: '20' },
                        { value: 21, label: '21' },
                        { value: 22, label: '22' },
                        { value: 23, label: '23' },
                        { value: 24, label: '24' },
                        { value: 25, label: '25' },
                        { value: 26, label: '26' },
                        { value: 27, label: '27' },
                        { value: 28, label: '28' },
                        { value: 29, label: '29' },
                        { value: 30, label: '30' },
                        { value: 31, label: '31' },
                        { value: 32, label: '32' },
                        { value: 33, label: '33' },
                        { value: 34, label: '34' },
                        { value: 35, label: '35' },
                        { value: 36, label: '36' },
                        { value: 37, label: '37' },
                        { value: 38, label: '38' },
                        { value: 39, label: '39' },
                        { value: 40, label: '40' },
                        { value: 41, label: '41' },
                        { value: 42, label: '42' },
                        { value: 43, label: '43' },
                        { value: 44, label: '44' },
                        { value: 45, label: '45' },
                        { value: 46, label: '46' },
                        { value: 47, label: '47' },
                        { value: 48, label: '48' },
                        { value: 49, label: '49' },
                        { value: 50, label: '50' },
                        { value: 51, label: '51' },
                        { value: 52, label: '52' },
                        { value: 53, label: '53' },
                        { value: 54, label: '54' },
                        { value: 55, label: '55' },
                        { value: 56, label: '56' },
                        { value: 57, label: '57' },
                        { value: 58, label: '58' },
                        { value: 59, label: '59' },
                    ]}
                /> 분 마다 실행
                <div style={{textAlign:"right"}}>
                    <Button type={"primary"} onClick={everyDayTimeChange}>적용</Button>
                </div>
            </div>
        }
        {
            menuStr === "WeekDay" &&
            <div>
                평일 <Select
                defaultValue={weekDayHour}
                style={{ width: 60 }}
                onChange={weekDayHourChange}
                options={[
                    { value: 0, label: '00' },
                    { value: 1, label: '01' },
                    { value: 2, label: '02' },
                    { value: 3, label: '03' },
                    { value: 4, label: '04' },
                    { value: 5, label: '05' },
                    { value: 6, label: '06' },
                    { value: 7, label: '07' },
                    { value: 8, label: '08' },
                    { value: 9, label: '09' },
                    { value: 10, label: '10' },
                    { value: 11, label: '11' },
                    { value: 12, label: '12' },
                    { value: 13, label: '13' },
                    { value: 14, label: '14' },
                    { value: 15, label: '15' },
                    { value: 16, label: '16' },
                    { value: 17, label: '17' },
                    { value: 18, label: '18' },
                    { value: 19, label: '19' },
                    { value: 20, label: '20' },
                    { value: 21, label: '21' },
                    { value: 22, label: '22' },
                    { value: 23, label: '23' },
                ]}
            />시
                <Select
                    defaultValue={weekDayMin}
                    style={{ width: 60 }}
                    onChange={weekDayMinChange}
                    options={[
                        { value: 0, label: '00' },
                        { value: 1, label: '01' },
                        { value: 2, label: '02' },
                        { value: 3, label: '03' },
                        { value: 4, label: '04' },
                        { value: 5, label: '05' },
                        { value: 6, label: '06' },
                        { value: 7, label: '07' },
                        { value: 8, label: '08' },
                        { value: 9, label: '09' },
                        { value: 10, label: '10' },
                        { value: 11, label: '11' },
                        { value: 12, label: '12' },
                        { value: 13, label: '13' },
                        { value: 14, label: '14' },
                        { value: 15, label: '15' },
                        { value: 16, label: '16' },
                        { value: 17, label: '17' },
                        { value: 18, label: '18' },
                        { value: 19, label: '19' },
                        { value: 20, label: '20' },
                        { value: 21, label: '21' },
                        { value: 22, label: '22' },
                        { value: 23, label: '23' },
                        { value: 24, label: '24' },
                        { value: 25, label: '25' },
                        { value: 26, label: '26' },
                        { value: 27, label: '27' },
                        { value: 28, label: '28' },
                        { value: 29, label: '29' },
                        { value: 30, label: '30' },
                        { value: 31, label: '31' },
                        { value: 32, label: '32' },
                        { value: 33, label: '33' },
                        { value: 34, label: '34' },
                        { value: 35, label: '35' },
                        { value: 36, label: '36' },
                        { value: 37, label: '37' },
                        { value: 38, label: '38' },
                        { value: 39, label: '39' },
                        { value: 40, label: '40' },
                        { value: 41, label: '41' },
                        { value: 42, label: '42' },
                        { value: 43, label: '43' },
                        { value: 44, label: '44' },
                        { value: 45, label: '45' },
                        { value: 46, label: '46' },
                        { value: 47, label: '47' },
                        { value: 48, label: '48' },
                        { value: 49, label: '49' },
                        { value: 50, label: '50' },
                        { value: 51, label: '51' },
                        { value: 52, label: '52' },
                        { value: 53, label: '53' },
                        { value: 54, label: '54' },
                        { value: 55, label: '55' },
                        { value: 56, label: '56' },
                        { value: 57, label: '57' },
                        { value: 58, label: '58' },
                        { value: 59, label: '59' },
                    ]}
                /> 분 마다 실행
                <div style={{textAlign:"right"}}>
                    <Button type={"primary"} onClick={weekDayTimeChange}>적용</Button>
                </div>
            </div>
        }
        {
            menuStr === "WeekEnd" &&
            <div>
                주말 <Select
                defaultValue={weekEndHour}
                style={{ width: 60 }}
                onChange={weekEndHourChange}
                options={[
                    { value: 0, label: '00' },
                    { value: 1, label: '01' },
                    { value: 2, label: '02' },
                    { value: 3, label: '03' },
                    { value: 4, label: '04' },
                    { value: 5, label: '05' },
                    { value: 6, label: '06' },
                    { value: 7, label: '07' },
                    { value: 8, label: '08' },
                    { value: 9, label: '09' },
                    { value: 10, label: '10' },
                    { value: 11, label: '11' },
                    { value: 12, label: '12' },
                    { value: 13, label: '13' },
                    { value: 14, label: '14' },
                    { value: 15, label: '15' },
                    { value: 16, label: '16' },
                    { value: 17, label: '17' },
                    { value: 18, label: '18' },
                    { value: 19, label: '19' },
                    { value: 20, label: '20' },
                    { value: 21, label: '21' },
                    { value: 22, label: '22' },
                    { value: 23, label: '23' },
                ]}
            />시
                <Select
                    defaultValue={weekEndMin}
                    style={{ width: 60 }}
                    onChange={weekEndMinChange}
                    options={[
                        { value: 0, label: '00' },
                        { value: 1, label: '01' },
                        { value: 2, label: '02' },
                        { value: 3, label: '03' },
                        { value: 4, label: '04' },
                        { value: 5, label: '05' },
                        { value: 6, label: '06' },
                        { value: 7, label: '07' },
                        { value: 8, label: '08' },
                        { value: 9, label: '09' },
                        { value: 10, label: '10' },
                        { value: 11, label: '11' },
                        { value: 12, label: '12' },
                        { value: 13, label: '13' },
                        { value: 14, label: '14' },
                        { value: 15, label: '15' },
                        { value: 16, label: '16' },
                        { value: 17, label: '17' },
                        { value: 18, label: '18' },
                        { value: 19, label: '19' },
                        { value: 20, label: '20' },
                        { value: 21, label: '21' },
                        { value: 22, label: '22' },
                        { value: 23, label: '23' },
                        { value: 24, label: '24' },
                        { value: 25, label: '25' },
                        { value: 26, label: '26' },
                        { value: 27, label: '27' },
                        { value: 28, label: '28' },
                        { value: 29, label: '29' },
                        { value: 30, label: '30' },
                        { value: 31, label: '31' },
                        { value: 32, label: '32' },
                        { value: 33, label: '33' },
                        { value: 34, label: '34' },
                        { value: 35, label: '35' },
                        { value: 36, label: '36' },
                        { value: 37, label: '37' },
                        { value: 38, label: '38' },
                        { value: 39, label: '39' },
                        { value: 40, label: '40' },
                        { value: 41, label: '41' },
                        { value: 42, label: '42' },
                        { value: 43, label: '43' },
                        { value: 44, label: '44' },
                        { value: 45, label: '45' },
                        { value: 46, label: '46' },
                        { value: 47, label: '47' },
                        { value: 48, label: '48' },
                        { value: 49, label: '49' },
                        { value: 50, label: '50' },
                        { value: 51, label: '51' },
                        { value: 52, label: '52' },
                        { value: 53, label: '53' },
                        { value: 54, label: '54' },
                        { value: 55, label: '55' },
                        { value: 56, label: '56' },
                        { value: 57, label: '57' },
                        { value: 58, label: '58' },
                        { value: 59, label: '59' },
                    ]}
                /> 분 마다 실행
                <div style={{textAlign:"right"}}>
                    <Button type={"primary"} onClick={weekEndTimeChange}>적용</Button>
                </div>
            </div>
        }
        {
            menuStr === "DefineDay" &&
            <div>
                <Checkbox onChange={onChangeMonday}>월요일</Checkbox>
                <Checkbox onChange={onChangeTuesday}>화요일</Checkbox>
                <Checkbox onChange={onChangeWednesday}>수요일</Checkbox>
                <Checkbox onChange={onChangeThursday}>목요일</Checkbox>
                <Checkbox onChange={onChangeFriday}>금요일</Checkbox>
                <Checkbox onChange={onChangeSaturday}>토요일</Checkbox>
                <Checkbox onChange={onChangeSunDay}>일요일</Checkbox>

                <Select
                    defaultValue={defineDayHour}
                    style={{ width: 60 }}
                    onChange={defineDayHourChange}
                    options={[
                        { value: 0, label: '00' },
                        { value: 1, label: '01' },
                        { value: 2, label: '02' },
                        { value: 3, label: '03' },
                        { value: 4, label: '04' },
                        { value: 5, label: '05' },
                        { value: 6, label: '06' },
                        { value: 7, label: '07' },
                        { value: 8, label: '08' },
                        { value: 9, label: '09' },
                        { value: 10, label: '10' },
                        { value: 11, label: '11' },
                        { value: 12, label: '12' },
                        { value: 13, label: '13' },
                        { value: 14, label: '14' },
                        { value: 15, label: '15' },
                        { value: 16, label: '16' },
                        { value: 17, label: '17' },
                        { value: 18, label: '18' },
                        { value: 19, label: '19' },
                        { value: 20, label: '20' },
                        { value: 21, label: '21' },
                        { value: 22, label: '22' },
                        { value: 23, label: '23' },
                    ]}
                />시
                <Select
                    defaultValue={defineDayMin}
                    style={{ width: 60 }}
                    onChange={defineDayMinChange}
                    options={[
                        { value: 0, label: '00' },
                        { value: 1, label: '01' },
                        { value: 2, label: '02' },
                        { value: 3, label: '03' },
                        { value: 4, label: '04' },
                        { value: 5, label: '05' },
                        { value: 6, label: '06' },
                        { value: 7, label: '07' },
                        { value: 8, label: '08' },
                        { value: 9, label: '09' },
                        { value: 10, label: '10' },
                        { value: 11, label: '11' },
                        { value: 12, label: '12' },
                        { value: 13, label: '13' },
                        { value: 14, label: '14' },
                        { value: 15, label: '15' },
                        { value: 16, label: '16' },
                        { value: 17, label: '17' },
                        { value: 18, label: '18' },
                        { value: 19, label: '19' },
                        { value: 20, label: '20' },
                        { value: 21, label: '21' },
                        { value: 22, label: '22' },
                        { value: 23, label: '23' },
                        { value: 24, label: '24' },
                        { value: 25, label: '25' },
                        { value: 26, label: '26' },
                        { value: 27, label: '27' },
                        { value: 28, label: '28' },
                        { value: 29, label: '29' },
                        { value: 30, label: '30' },
                        { value: 31, label: '31' },
                        { value: 32, label: '32' },
                        { value: 33, label: '33' },
                        { value: 34, label: '34' },
                        { value: 35, label: '35' },
                        { value: 36, label: '36' },
                        { value: 37, label: '37' },
                        { value: 38, label: '38' },
                        { value: 39, label: '39' },
                        { value: 40, label: '40' },
                        { value: 41, label: '41' },
                        { value: 42, label: '42' },
                        { value: 43, label: '43' },
                        { value: 44, label: '44' },
                        { value: 45, label: '45' },
                        { value: 46, label: '46' },
                        { value: 47, label: '47' },
                        { value: 48, label: '48' },
                        { value: 49, label: '49' },
                        { value: 50, label: '50' },
                        { value: 51, label: '51' },
                        { value: 52, label: '52' },
                        { value: 53, label: '53' },
                        { value: 54, label: '54' },
                        { value: 55, label: '55' },
                        { value: 56, label: '56' },
                        { value: 57, label: '57' },
                        { value: 58, label: '58' },
                        { value: 59, label: '59' },
                    ]}
                /> 분 마다 실행
                <div style={{textAlign:"right"}}>
                    <Button type={"primary"} onClick={defineDayChange}>적용</Button>
                </div>
            </div>
        }









            <div>
                {cronExpression}
            </div>
            <div>
                {cronExpressionText}
            </div>
        </div>
    )

}
export default CronMaker;