import { useState } from "react";
import { Greenhouse, HeatingMode, WateringMode } from "../../core/api/data-contracts";
import { Select, Button, Form, Input } from "antd";

export interface GreenhouseSettingsFormProps {
    updateSettings: (settings: Greenhouse) => void,
    id: number
}

const GreenhouseSettingsForm = (props: GreenhouseSettingsFormProps) => {
    const { updateSettings, id } = props;
    const [settings, setSettings] = useState<Greenhouse>({
        id: Number(id!),
        wateringMode: WateringMode.Value0,
        heatingMode: HeatingMode.Value0,
    });
    return (
        <div className="p-8">
            <h1 className="text-2xl font-bold mb-4">Настройки</h1>
            <Form
                name="basic"
                layout="vertical"
                initialValues={{ remember: true }}
                onFinish={(values: any) => updateSettings({ ...settings, ...values })}
                onFinishFailed={(error: any) => console.log(error)}
            >
                <Form.Item
                    label="Режим полива"
                    name="wateringMode"
                    rules={[{ required: true, message: 'Выберите режим полива' }]}
                >
                    <Select
                        value={settings.wateringMode}
                        onChange={(value) => setSettings({ ...settings, wateringMode: value })}
                    >
                        <Select.Option value={WateringMode.Value0}>Ручной</Select.Option>
                        <Select.Option value={WateringMode.Value1}>Автоматический</Select.Option>
                    </Select>
                </Form.Item>

                <Form.Item
                    label="Режим нагрева"
                    name="heatingMode"
                    rules={[{ required: true, message: 'Выберите режим нагрева' }]}
                >
                    <Select
                        value={settings.heatingMode}
                        onChange={(value) => setSettings({ ...settings, heatingMode: value })}
                    >
                        <Select.Option value={HeatingMode.Value0}>Ручной</Select.Option>
                        <Select.Option value={HeatingMode.Value1}>Автоматический</Select.Option>
                    </Select>
                </Form.Item>

                <Form.Item
                    label="Минимальная температура"
                    name="minTemperature"
                    rules={[{ required: true, message: 'Введите минимальную температуру' }]}
                >
                    <Input type="number" />
                </Form.Item>

                <Form.Item
                    label="Максимальная температура"
                    name="maxTemperature"
                    rules={[{ required: true, message: 'Введите максимальную температуру' }]}
                >
                    <Input type="number" />
                </Form.Item>

                <Form.Item
                    label="Минимальная влажность почвы"
                    name="minHumidity"
                    rules={[{ required: true, message: 'Введите минимальную влажность почвы' }]}
                >
                    <Input type="number" />
                </Form.Item>

                <Form.Item
                    label="Максимальная влажность почвы"
                    name="maxHumidity"
                    rules={[{ required: true, message: 'Введите максимальную влажность почвы' }]}
                >
                    <Input type="number" />
                </Form.Item>

                <Form.Item>
                    <Button type="primary" htmlType="submit">
                        Обновить настройки
                    </Button>
                </Form.Item>
            </Form>
        </div>
    );
};

export default GreenhouseSettingsForm;