97 lines
4.1 KiB
TypeScript
97 lines
4.1 KiB
TypeScript
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; |