/*
    Парус 8 - Панели мониторинга - РО - Редактор настройки регламентированного отчёта
    Компонент панели: Форма
*/

//---------------------
//Подключение библиотек
//---------------------

import React, { useEffect, useState } from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { Dialog, DialogTitle, DialogContent, DialogActions, Button } from "@mui/material"; //Интерфейсные компоненты
import { BUTTONS } from "../../../../app.text"; //Общие текстовые ресурсы
import { FORM_FILED, FormField } from "./form_field"; //Элемент формы

//-----------
//Тело модуля
//-----------

//Форма
const Form = ({ title, fields = [], children, onOk, onCancel, onClose }) => {
    //Состояние формы
    const [state, setState] = useState({});

    //При изменении элемента формы
    const handleFieldChange = (name, value) => setState(pv => ({ ...pv, [name]: value }));

    //При нажатии на "ОК" формы
    const handleOk = () => onOk && onOk(state);

    //При нажатии на "Отмена" формы
    const handleCancel = () => onCancel && onCancel();

    //При нажатии на "Закрыть" формы
    const handleClose = () => (onClose ? onClose() : onCancel ? onCancel() : null);

    //При подключении к старнице
    useEffect(() => {
        setState(fields.reduce((res, f) => ({ ...res, [f.elementCode]: f.elementValue == undefined ? null : f.elementValue }), {}));
        // eslint-disable-next-line react-hooks/exhaustive-deps
    }, []);

    //Формирование представления
    return (
        <Dialog onClose={handleClose} open>
            <DialogTitle>{title}</DialogTitle>
            <DialogContent>
                {fields.map((f, i) => (
                    <FormField key={i} {...f} elementValue={state[f.elementCode]} formValues={state} onChange={handleFieldChange} />
                ))}
                {children}
            </DialogContent>
            <DialogActions>
                {onOk && <Button onClick={handleOk}>{BUTTONS.OK}</Button>}
                {onCancel && <Button onClick={handleCancel}>{BUTTONS.CANCEL}</Button>}
                {onClose && <Button onClick={handleClose}>{BUTTONS.CLOSE}</Button>}
            </DialogActions>
        </Dialog>
    );
};

//Контроль свойств - Форма
Form.propTypes = {
    title: PropTypes.string.isRequired,
    fields: PropTypes.arrayOf(PropTypes.shape(FORM_FILED)),
    children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]),
    onOk: PropTypes.func,
    onCancel: PropTypes.func,
    onClose: PropTypes.func
};

//----------------
//Интерфейс модуля
//----------------

export { Form };