159 lines
5.7 KiB
JavaScript
159 lines
5.7 KiB
JavaScript
/*
|
||
Парус 8 - Панели мониторинга - Редактор запросов
|
||
Пользовательские хуки для работы с метаданными запроса
|
||
*/
|
||
|
||
//---------------------
|
||
//Подключение библиотек
|
||
//---------------------
|
||
|
||
import { useState, useContext, useEffect } from "react"; //Классы React
|
||
import { BackEndСtx } from "../../context/backend"; //Контекст взаимодействия с сервером
|
||
import { NODE_TYPE } from "./common"; //Общие ресурсы и константы редактора
|
||
|
||
//------------------------------------
|
||
//Вспомогательные функции и компоненты
|
||
//------------------------------------
|
||
|
||
//Конвертация серверного описания сущностей запроса в элементы диаграммы
|
||
const serverEntity2QueryDiagramNodes = entity => {
|
||
const groupWidth = 250;
|
||
const nameColumnHeight = 50;
|
||
const columns = entity?.XATTRS?.XATTR || [];
|
||
const columnsCount = columns.length;
|
||
const groupHeight = nameColumnHeight + columnsCount * 50;
|
||
|
||
const groupNode = {
|
||
id: entity.id,
|
||
type: NODE_TYPE.ENTITY,
|
||
data: { ...entity },
|
||
position: { x: entity.x, y: entity.y },
|
||
style: {
|
||
width: groupWidth,
|
||
height: groupHeight
|
||
},
|
||
draggable: true
|
||
};
|
||
|
||
const columnNodes = columns.map((column, index, columns) => {
|
||
const x = 1;
|
||
const y = 50 * (index + 1);
|
||
const width = groupWidth - 2;
|
||
const height = 50;
|
||
|
||
const isLast = index === columns.length - 1;
|
||
const defaultColumnStyles = {
|
||
borderBottom: "1px solid #dee2e6"
|
||
};
|
||
const lastColumnStyles = {
|
||
borderBottom: "none"
|
||
};
|
||
const otherStyles = isLast ? lastColumnStyles : defaultColumnStyles;
|
||
|
||
return {
|
||
id: column.id,
|
||
type: NODE_TYPE.ATTRIBUTE,
|
||
data: {
|
||
...column,
|
||
included: false,
|
||
parentEntity: entity.id
|
||
},
|
||
position: { x, y },
|
||
parentId: entity.id,
|
||
extent: "parent",
|
||
style: {
|
||
width,
|
||
height,
|
||
...otherStyles
|
||
},
|
||
draggable: false,
|
||
selectable: true
|
||
};
|
||
});
|
||
|
||
return [groupNode, ...columnNodes];
|
||
};
|
||
|
||
//Конвертация серверного описания запроса в данные для редактора диаграмм
|
||
const serverQueryData2QueryDiagram = (entities, relations) => {
|
||
const result = { entities: [], relations: [...relations] };
|
||
entities.forEach(entity => {
|
||
const nodes = serverEntity2QueryDiagramNodes(entity);
|
||
result.entities = [...result.entities, ...nodes];
|
||
});
|
||
return result;
|
||
};
|
||
|
||
//-----------
|
||
//Тело модуля
|
||
//-----------
|
||
|
||
//Работа с метаданными запроса
|
||
const useQuery = query => {
|
||
//Собственное состояние - флаг инициализированности
|
||
const [isInit, setInit] = useState(false);
|
||
|
||
//Собственное состояние - флаг загрузки
|
||
const [isLoading, setLoading] = useState(false);
|
||
|
||
//Собственное состояние - флаг необходимости обновления
|
||
const [refresh, setRefresh] = useState(true);
|
||
|
||
//Собственное состояние - данные диаграммы
|
||
const [queryDiagram, setQueryDiagram] = useState(null);
|
||
|
||
//Собственное состояние - данные настроек
|
||
const [queryOption, setQueryOption] = useState(null);
|
||
|
||
//Подключение к контексту взаимодействия с сервером
|
||
const { executeStored } = useContext(BackEndСtx);
|
||
|
||
//Обновление данных
|
||
const doRefresh = () => setRefresh(true);
|
||
|
||
//При необходимости получить/обновить данные
|
||
useEffect(() => {
|
||
//Загрузка данных с сервера
|
||
const loadData = async () => {
|
||
try {
|
||
setLoading(true);
|
||
const data = await executeStored({
|
||
stored: "PKG_P8PANELS_QE.QUERY",
|
||
args: { NRN: query },
|
||
respArg: "COUT",
|
||
isArray: name => ["XENT", "XATTR", "XRL", "XARG"].includes(name),
|
||
loader: true
|
||
});
|
||
setQueryDiagram(serverQueryData2QueryDiagram(data?.XENTS?.XENT || [], data?.XRLS?.XRL || []));
|
||
setQueryOption({ args: data?.XOPT?.XARGS?.XARG || [], cond: data?.XOPT?.XCOND || null });
|
||
setInit(true);
|
||
} finally {
|
||
setRefresh(false);
|
||
setLoading(false);
|
||
}
|
||
};
|
||
//Если надо обновить
|
||
if (refresh)
|
||
if (query)
|
||
//Если есть для чего получать данные
|
||
loadData();
|
||
//Нет идентификатора запроса - нет данных
|
||
else {
|
||
setQueryDiagram(null);
|
||
setQueryOption(null);
|
||
}
|
||
}, [refresh, query, executeStored]);
|
||
|
||
//При изменении входных свойств - поднимаем флаг обновления
|
||
useEffect(() => setRefresh(true), [query]);
|
||
|
||
//Возвращаем интерфейс хука
|
||
return [queryDiagram, queryOption, doRefresh, isLoading, isInit];
|
||
};
|
||
|
||
//----------------
|
||
//Интерфейс модуля
|
||
//----------------
|
||
|
||
export { useQuery };
|