97 lines
3.6 KiB
JavaScript
97 lines
3.6 KiB
JavaScript
/*
|
|
Парус 8 - Панели мониторинга - Редактор панелей
|
|
Компоненты: Таблица (представление)
|
|
*/
|
|
|
|
//---------------------
|
|
//Подключение библиотек
|
|
//---------------------
|
|
|
|
import React from "react"; //Классы React
|
|
import PropTypes from "prop-types"; //Контроль свойств компонента
|
|
import { Paper } from "@mui/material"; //Интерфейсные элементы
|
|
import { APP_STYLES } from "../../../../../app.styles"; //Типовые стили
|
|
import { P8PDataGrid } from "../../../../components/p8p_data_grid"; //Таблица данных
|
|
import { P8P_DATA_GRID_CONFIG_PROPS } from "../../../../config_wrapper"; //Подключение компонентов к настройкам приложения
|
|
import { useComponentDataSource } from "../components_hooks"; //Хуки для данных
|
|
import { DATA_SOURCE_SHAPE } from "../editors_common"; //Общие объекты компонентов
|
|
import { COMPONENT_MESSAGE_TYPE, COMPONENT_MESSAGES, ComponentInlineMessage } from "../views_common"; //Общие компоненты представлений
|
|
import "../../panels_editor.css"; //Стили редактора
|
|
|
|
//---------
|
|
//Константы
|
|
//---------
|
|
|
|
//Иконка компонента
|
|
const COMPONENT_ICON = "table_view";
|
|
|
|
//Наименование компонента
|
|
const COMPONENT_NAME = "Таблица";
|
|
|
|
//Стили
|
|
const STYLES = {
|
|
CONTAINER: { display: "flex", height: "100%", overflow: "hidden" },
|
|
DATA_GRID: { width: "100%" },
|
|
DATA_GRID_CONTAINER: {
|
|
height: `calc(100%)`,
|
|
...APP_STYLES.SCROLL
|
|
}
|
|
};
|
|
|
|
//-----------
|
|
//Тело модуля
|
|
//-----------
|
|
|
|
//Таблица (представление)
|
|
const Table = ({ dataSource = null, values = {} } = {}) => {
|
|
//Собственное состояние - данные
|
|
const [data, error] = useComponentDataSource({ dataSource, values });
|
|
|
|
//Флаг настроенности таблицы
|
|
const haveConfing = dataSource?.stored ? true : false;
|
|
|
|
//Флаг наличия данных
|
|
const haveData = data?.init === true && !error ? true : false;
|
|
|
|
//Данные таблицы
|
|
const dataGrid = data?.XDATA_GRID || {};
|
|
|
|
//Формирование представления
|
|
return (
|
|
<Paper
|
|
{...(haveConfing && haveData
|
|
? { sx: { ...STYLES.CONTAINER } }
|
|
: { className: "component-view__container component-view__container__empty" })}
|
|
elevation={6}
|
|
>
|
|
{haveConfing && haveData ? (
|
|
<P8PDataGrid
|
|
{...P8P_DATA_GRID_CONFIG_PROPS}
|
|
{...dataGrid}
|
|
style={STYLES.DATA_GRID}
|
|
containerComponentProps={{ sx: STYLES.DATA_GRID_CONTAINER, elevation: 0 }}
|
|
/>
|
|
) : (
|
|
<ComponentInlineMessage
|
|
icon={COMPONENT_ICON}
|
|
name={COMPONENT_NAME}
|
|
message={!haveConfing ? COMPONENT_MESSAGES.NO_SETTINGS : error ? error : COMPONENT_MESSAGES.NO_DATA_FOUND}
|
|
type={error ? COMPONENT_MESSAGE_TYPE.ERROR : COMPONENT_MESSAGE_TYPE.COMMON}
|
|
/>
|
|
)}
|
|
</Paper>
|
|
);
|
|
};
|
|
|
|
//Контроль свойств компонента - Таблица (представление)
|
|
Table.propTypes = {
|
|
dataSource: DATA_SOURCE_SHAPE,
|
|
values: PropTypes.object
|
|
};
|
|
|
|
//----------------
|
|
//Интерфейс модуля
|
|
//----------------
|
|
|
|
export default Table;
|