78 lines
2.5 KiB
JavaScript
78 lines
2.5 KiB
JavaScript
import React, { lazy, Suspense } from "react";
|
||
|
||
const PrometheusChart = lazy(() => import('../../Charts/PrometheusChart'));
|
||
|
||
// Вкладки, для которых нужно отобразить график
|
||
const tabsWithCharts = ["188", "189"];
|
||
|
||
// Маппинг id на метрики
|
||
const metricMapping = {
|
||
188: "zvks_apiforsnmp_measure_277",
|
||
189: "zvks_apiforsnmp_measure_36",
|
||
};
|
||
|
||
const generateTabContent = (data) => {
|
||
const tabContent = {};
|
||
|
||
console.log("jsonData:", data);
|
||
console.log("jsonData.items:", data.items);
|
||
|
||
const generateContent = (nodes) => {
|
||
nodes.forEach((node) => {
|
||
console.log("Обрабатываем узел:", node);
|
||
|
||
// Если у узла есть вложенные элементы, рекурсивно обрабатываем их
|
||
if (node.items && node.items.length > 0) {
|
||
console.log("Идём вглубь:", node.items);
|
||
generateContent(node.items);
|
||
}
|
||
|
||
// Если у узла есть id, добавляем его в tabContent
|
||
if (node.id) {
|
||
console.log("Добавляем в tabContent:", node.id);
|
||
|
||
let content = (
|
||
<div>
|
||
<h2>{node.title}</h2>
|
||
<p>Контент для {node.title}.</p>
|
||
</div>
|
||
);
|
||
|
||
// Если id узла есть в списке tabsWithCharts, добавляем график
|
||
if (tabsWithCharts.includes(node.id)) {
|
||
console.log("Добавляем график для:", node.id);
|
||
|
||
// Получаем метрику для текущего id
|
||
const metricName = metricMapping[node.id];
|
||
|
||
content = (
|
||
<div>
|
||
<h2>{node.title}</h2>
|
||
<p>Контент для {node.title}.</p>
|
||
<Suspense fallback={<div>Загрузка графика...</div>}>
|
||
<PrometheusChart metricName={metricName} />
|
||
</Suspense>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
// Сохраняем контент для текущего id
|
||
tabContent[node.id] = {
|
||
title: node.title,
|
||
content: content,
|
||
};
|
||
}
|
||
});
|
||
};
|
||
|
||
// Начинаем обработку с корневого уровня
|
||
if (data.items && data.items.length > 0) {
|
||
generateContent(data.items);
|
||
} else {
|
||
console.warn("Данные отсутствуют или массив items пуст");
|
||
}
|
||
|
||
return tabContent;
|
||
};
|
||
|
||
export default generateTabContent; // Экспортируем только функцию
|