95 lines
4.5 KiB
JavaScript

/*
Парус 8 - Панели мониторинга - Редактор панелей
Компоненты: Таблица (редактор настроек)
*/
//---------------------
//Подключение библиотек
//---------------------
import React, { useEffect, useState } from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import { P8PEditorBox } from "../../../../components/editors/p8p_editor_box"; //Контейнер редактора
import { P8PEditorSubHeader } from "../../../../components/editors/p8p_editor_sub_header"; //Заголовок раздела редактора
import { P8P_DATA_SOURCE_SHAPE } from "../../../../components/editors/p8p_data_source_common"; //Общие ресурсы источника данных
import { P8PDataSource } from "../../../../components/editors/p8p_data_source"; //Источник данных
import { P8PActions } from "../../../../components/editors/p8p_actions"; //Действия
import { P8PConditions } from "../../../../components/editors/p8p_conditions"; //Условия
import { P8P_CA_TABLE_VALUE_TYPES, P8P_CA_TABLE_ACTION_AREAS } from "./action"; //Общие ресурсы действий таблицы
import { P8P_CC_TABLE_COND_FIELDS, P8P_CC_TABLE_RES_FIELDS } from "./conditions"; //Общие ресурсы условий таблицы
import { P8P_CA_SHAPE, P8P_CAS_INITIAL } from "../../../../components/editors/p8p_component_action/common"; //Общие ресурсы действий
import { P8P_CCS_INITIAL, P8P_CC_SHAPE } from "../../../../components/editors/p8p_component_condition/common"; //Общие ресурсы компонента "Редактор условия"
//-----------
//Тело модуля
//-----------
//Таблица (редактор настроек)
const TableEditor = ({
id,
dataSource = null,
valueProviders = {},
conditions = P8P_CCS_INITIAL,
actions = P8P_CAS_INITIAL,
onSettingsChange = null
} = {}) => {
//Собственное состояние - текущие настройки
const [settings, setSettings] = useState(null);
//При сохранении изменений элемента
const handleDataSourceChange = dataSource => setSettings(pv => ({ ...pv, dataSource: { ...dataSource } }));
//При изменении действий
const handleActionsChange = actions => setSettings(pv => ({ ...pv, actions }));
//При изменении условий
const handleConditionsChange = conditions => setSettings(pv => ({ ...pv, conditions }));
//При сохранении настроек
const handleSave = (closeEditor = false) => onSettingsChange && onSettingsChange({ id, settings, closeEditor });
//При изменении компонента
useEffect(() => {
settings?.id != id && setSettings({ id, dataSource, conditions, actions });
}, [settings, id, dataSource, conditions, actions]);
//Формирование представления
return (
<P8PEditorBox title={"Параметры таблицы"} onSave={handleSave}>
<P8PEditorSubHeader title={"Источник данных"} />
<P8PDataSource dataSource={settings?.dataSource} valueProviders={valueProviders} onChange={handleDataSourceChange} />
<P8PEditorSubHeader title={"Условия"} />
<P8PConditions
conditions={settings?.conditions}
condFields={P8P_CC_TABLE_COND_FIELDS}
resFields={P8P_CC_TABLE_RES_FIELDS}
onChange={handleConditionsChange}
/>
<P8PEditorSubHeader title={"Действия"} />
<P8PActions
actions={settings?.actions}
valueProviders={valueProviders}
areas={P8P_CA_TABLE_ACTION_AREAS}
valueTypes={P8P_CA_TABLE_VALUE_TYPES}
onChange={handleActionsChange}
/>
</P8PEditorBox>
);
};
//Контроль свойств компонента - Таблица (редактор настроек)
TableEditor.propTypes = {
id: PropTypes.string.isRequired,
dataSource: P8P_DATA_SOURCE_SHAPE,
valueProviders: PropTypes.object,
conditions: PropTypes.arrayOf(P8P_CC_SHAPE),
actions: PropTypes.arrayOf(P8P_CA_SHAPE),
onSettingsChange: PropTypes.func
};
//----------------
//Интерфейс модуля
//----------------
export default TableEditor;