112 lines
4.7 KiB
JavaScript
112 lines
4.7 KiB
JavaScript
/*
|
||
Парус 8 - Панели мониторинга - Редактор панелей
|
||
Компоненты: Индикатор (представление)
|
||
*/
|
||
|
||
//---------------------
|
||
//Подключение библиотек
|
||
//---------------------
|
||
|
||
import React from "react"; //Классы React
|
||
import PropTypes from "prop-types"; //Контроль свойств компонента
|
||
import { Paper } from "@mui/material"; //Интерфейсные элементы
|
||
import { P8PIndicator } from "../../../../components/p8p_indicator"; //Компонент индикатора
|
||
import { useDataSource, useConditions, useComponentHandlers } from "../../../../components/editors/p8p_data_source_hooks"; //Хуки для данных
|
||
import { P8P_DATA_SOURCE_SHAPE } from "../../../../components/editors/p8p_data_source_common"; //Общие ресурсы источника данных
|
||
import {
|
||
P8P_COMPONENT_INLINE_MESSAGE_TYPE,
|
||
P8P_COMPONENT_INLINE_MESSAGE,
|
||
P8PComponentInlineMessage
|
||
} from "../../../../components/editors/p8p_component_inline_message"; //Информационное сообщение внутри компонента
|
||
import { P8P_CC_SHAPE } from "../../../../components/editors/p8p_component_condition/common"; //Общие ресурсы условий
|
||
import { P8P_CA_SHAPE } from "../../../../components/editors/p8p_component_action/common"; //Общие ресурсы действий
|
||
import { P8P_COMPONENT_SETTINGS_RESP_ARGS } from "../../../../components/editors/p8p_component_settings"; //Дополнительный функционал источников данных
|
||
import { getIndicatorHandlers } from "./action"; //Общие ресурсы действий индикатора
|
||
|
||
//---------
|
||
//Константы
|
||
//---------
|
||
|
||
//Иконка компонента
|
||
const COMPONENT_ICON = "speed";
|
||
|
||
//Наименование компонента
|
||
const COMPONENT_NAME = "Индикатор";
|
||
|
||
//Стили
|
||
const STYLES = {
|
||
CONTAINER: clickable => ({
|
||
height: "100%",
|
||
...(clickable
|
||
? {
|
||
cursor: "pointer"
|
||
}
|
||
: {})
|
||
})
|
||
};
|
||
|
||
//-----------
|
||
//Тело модуля
|
||
//-----------
|
||
|
||
//Индикатор (представление)
|
||
const Indicator = ({ dataSource = null, values = {}, conditions = [], actions = [], onValuesChange = null }) => {
|
||
//Собственное состояние - данные
|
||
const [indicator, error, haveConfing, haveData] = useDataSource({
|
||
dataSource,
|
||
values,
|
||
componentRespArg: P8P_COMPONENT_SETTINGS_RESP_ARGS.INDICATOR
|
||
});
|
||
|
||
//Собственное состояние - данные с учетом условий
|
||
const [indicatorOrigin] = useConditions({ componentData: indicator, conditions });
|
||
|
||
//Собственное состояние - обработчики компонента
|
||
const [handlers] = useComponentHandlers({ actions, onValuesChange });
|
||
|
||
//Обработчики областей
|
||
const { onComponentClick, onCaptionClick, onValueClick } = getIndicatorHandlers(handlers);
|
||
|
||
//Формирование представления
|
||
return (
|
||
<Paper
|
||
{...(haveConfing && haveData
|
||
? { sx: { ...STYLES.CONTAINER(onComponentClick) } }
|
||
: { className: "component-view__container component-view__container__empty" })}
|
||
elevation={6}
|
||
onClick={event => onComponentClick && onComponentClick({ event, values })}
|
||
>
|
||
{haveConfing && haveData ? (
|
||
<P8PIndicator
|
||
{...indicatorOrigin}
|
||
onValueClick={onValueClick ? event => onValueClick({ event, values }) : null}
|
||
onCaptionClick={onCaptionClick ? event => onCaptionClick({ event, values }) : null}
|
||
elevation={0}
|
||
/>
|
||
) : (
|
||
<P8PComponentInlineMessage
|
||
icon={COMPONENT_ICON}
|
||
name={COMPONENT_NAME}
|
||
message={!haveConfing ? P8P_COMPONENT_INLINE_MESSAGE.NO_SETTINGS : error ? error : P8P_COMPONENT_INLINE_MESSAGE.NO_DATA_FOUND}
|
||
type={error ? P8P_COMPONENT_INLINE_MESSAGE_TYPE.ERROR : P8P_COMPONENT_INLINE_MESSAGE_TYPE.COMMON}
|
||
/>
|
||
)}
|
||
</Paper>
|
||
);
|
||
};
|
||
|
||
//Контроль свойств компонента - Индикатор (представление)
|
||
Indicator.propTypes = {
|
||
dataSource: P8P_DATA_SOURCE_SHAPE,
|
||
values: PropTypes.object,
|
||
conditions: PropTypes.arrayOf(P8P_CC_SHAPE),
|
||
actions: PropTypes.arrayOf(P8P_CA_SHAPE),
|
||
onValuesChange: PropTypes.func
|
||
};
|
||
|
||
//----------------
|
||
//Интерфейс модуля
|
||
//----------------
|
||
|
||
export default Indicator;
|