From 175b4f993d4deda47dba91df91d83e4d168a5dff Mon Sep 17 00:00:00 2001 From: DmitriyA Date: Thu, 20 Mar 2025 03:53:16 -0400 Subject: [PATCH 1/6] =?UTF-8?q?=D0=A3=D0=BB=D1=83=D1=87=D1=88=D0=B8=D0=BB?= =?UTF-8?q?=20=D0=B8=D0=BD=D1=82=D0=B5=D1=80=D1=84=D0=B5=D0=B9=D1=81,=20?= =?UTF-8?q?=D0=B4=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=B2=D0=B8=20=D0=B2=D1=8B?= =?UTF-8?q?=D0=B4=D0=B5=D0=BB=D0=B5=D0=BD=D0=B8=D0=B5=20=D0=B8=20=D0=BF?= =?UTF-8?q?=D0=BE=D0=B9=D0=BD=D1=82=D0=B5=D1=80=20=D0=B4=D0=BB=D1=8F=20?= =?UTF-8?q?=D0=B1=D0=BE=D0=BA=D0=BE=D0=B2=D0=BE=D0=B3=D0=BE=20=D0=BC=D0=B5?= =?UTF-8?q?=D0=BD=D1=8E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Charts/PrometheusChart.jsx | 2 +- .../Layout/SidebarMenuComponents/MenuItem.jsx | 48 +++++++++++++++++-- 2 files changed, 44 insertions(+), 6 deletions(-) diff --git a/src/Charts/PrometheusChart.jsx b/src/Charts/PrometheusChart.jsx index 2fdf9e3..d3a151b 100755 --- a/src/Charts/PrometheusChart.jsx +++ b/src/Charts/PrometheusChart.jsx @@ -92,7 +92,7 @@ const PrometheusChart = ({ metricName }) => { else if (range <= 86400) step = 120; else step = 300; - const response = await axios.get('https://192.168.2.43:3000/metrics', { + const response = await axios.get('http://192.168.2.39:3000/metrics', { params: { metric: metricName, start, end, step }, }); diff --git a/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx b/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx index 82f5f5d..6909c79 100644 --- a/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx +++ b/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx @@ -30,13 +30,51 @@ const MenuItem = ({ item, onSelectItem }) => { return ( <> - + -
- {hasChildren ? (isOpen ? : ) : } -
+ {hasChildren ? ( +
+ {isOpen ? : } +
+ ) : ( +
+ {/* Здесь можно добавить другую иконку или оставить пустым */} +
+ )} - + {hasChildren && (isOpen ? : )} {hasChildren && ( -- 2.40.1 From 13101ac57c79107362177c18ff5275140cd3c178 Mon Sep 17 00:00:00 2001 From: DmitriyA Date: Thu, 20 Mar 2025 09:31:54 -0400 Subject: [PATCH 2/6] Rewrote the graph using react-flow --- package.json | 3 +- src/Components/Layout/SidebarMenu.jsx | 2 +- .../Layout/SidebarMenuComponents/MenuItem.jsx | 15 +- src/Components/TreeChart/FlowChart.jsx | 177 ++ src/Components/TreeChart/TreeChart.jsx | 170 +- .../TreeChart/TreeChartComponents/Label.jsx | 21 + .../TreeChart/TreeChartComponents/Link.jsx | 16 + .../TreeChart/TreeChartComponents/Node.jsx | 19 + .../TreeChartComponents/NodePosition.jsx | 30 + src/Components/TreeChart/menuData.json | 1666 ++++++++--------- src/Components/UI/TreeTable.jsx | 10 +- src/Components/hooks/TabContent.jsx | 3 +- src/Style/dark-theme.css | 2 +- 13 files changed, 1181 insertions(+), 953 deletions(-) create mode 100644 src/Components/TreeChart/FlowChart.jsx create mode 100644 src/Components/TreeChart/TreeChartComponents/Label.jsx create mode 100644 src/Components/TreeChart/TreeChartComponents/Link.jsx create mode 100644 src/Components/TreeChart/TreeChartComponents/Node.jsx create mode 100644 src/Components/TreeChart/TreeChartComponents/NodePosition.jsx diff --git a/package.json b/package.json index 508687a..b6412fd 100755 --- a/package.json +++ b/package.json @@ -23,7 +23,8 @@ "@emotion/react": "^11.14.0", "@emotion/styled": "^11.14.0", "@mui/material": "^6.4.7", - "@mui/icons-material": "^6.4.8" + "@mui/icons-material": "^6.4.8", + "reactflow": "^11.11.4" }, "devDependencies": { "@eslint/js": "^9.17.0", diff --git a/src/Components/Layout/SidebarMenu.jsx b/src/Components/Layout/SidebarMenu.jsx index 60acb84..3c7f0d6 100644 --- a/src/Components/Layout/SidebarMenu.jsx +++ b/src/Components/Layout/SidebarMenu.jsx @@ -23,7 +23,7 @@ const SidebarMenu = ({ data, onOpenTab, sidebarWidth, startResizing }) => { }} > -

Меню

+

Меню

 diff --git a/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx b/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx index 6909c79..d8d48d6 100644 --- a/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx +++ b/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx @@ -1,5 +1,5 @@ import React from "react"; -import { Drawer, List, ListItem, ListItemIcon, ListItemText, Collapse } from "@mui/material"; +import { ListItem, ListItemIcon, ListItemText, Collapse, List } from "@mui/material"; import { ExpandLess, ExpandMore, Folder, FolderOpen } from "@mui/icons-material"; // Функция для сбора всех потомков @@ -14,7 +14,7 @@ const getAllChildren = (node) => { return children; }; -const MenuItem = ({ item, onSelectItem }) => { +const MenuItem = ({ item, onSelectItem, level = 0 }) => { // Добавлен параметр level для отслеживания уровня вложенности const [isOpen, setIsOpen] = React.useState(false); const hasChildren = Array.isArray(item.items) && item.items.length > 0; @@ -35,8 +35,10 @@ const MenuItem = ({ item, onSelectItem }) => { onClick={hasChildren ? handleToggle : handleOpenTab} sx={{ cursor: "pointer", // Курсор pointer везде + pl: 2 + level * 2, // Сдвиг в зависимости от уровня вложенности "&:hover": { backgroundColor: "#f5f5f5", // Подсветка при наведении на весь элемент + }, }} > @@ -50,6 +52,8 @@ const MenuItem = ({ item, onSelectItem }) => { padding: "4px", // Отступы для увеличения области hover "&:hover": { backgroundColor: "#e0e0e0", // Подсветка при наведении на иконку + // transform: 2, + }, }} > @@ -81,7 +85,12 @@ const MenuItem = ({ item, onSelectItem }) => { {item.items.map((child, index) => ( - + ))} diff --git a/src/Components/TreeChart/FlowChart.jsx b/src/Components/TreeChart/FlowChart.jsx new file mode 100644 index 0000000..63e3c85 --- /dev/null +++ b/src/Components/TreeChart/FlowChart.jsx @@ -0,0 +1,177 @@ +import React, { useCallback, useEffect, useState, useMemo } from 'react'; +import ReactFlow, { Controls, Background, useNodesState, useEdgesState } from 'reactflow'; +import 'reactflow/dist/style.css'; +import { statusManager1, getStatusColor } from './dataUtils'; + +const FlowChart = ({ data }) => { + const [nodes, setNodes, onNodesChange] = useNodesState([]); + const [edges, setEdges, onEdgesChange] = useEdgesState([]); + const [collapsedNodes, setCollapsedNodes] = useState(new Set()); // Состояние для свернутых узлов + const [nodePositions, setNodePositions] = useState({}); // Состояние для сохранения позиций узлов + + // Обновление статусов + useEffect(() => { + const updateStatuses = (data) => { + statusManager1.updateStatuses(data); + }; + + updateStatuses(data); // Обновляем статусы только при изменении данных + }, [data]); // Зависимость от data + + // Функция для построения радиального графа + const parseData = useCallback( + (data) => { + const nodes = []; + const edges = []; + + const centerX = 500; // Центр графа по X + const centerY = 400; // Центр графа по Y + const levelRadius = 150; // Расстояние между уровнями + + // Основная рекурсивная функция + const traverse = (item, parentId = null, level = 0, angleStart = 0, angleEnd = 2 * Math.PI) => { + const nodeId = item.id; + + // Угол узла на круге + const angle = (angleStart + angleEnd) / 2; // Угол для текущего узла + const nodeX = centerX + Math.cos(angle) * level * levelRadius; + const nodeY = centerY + Math.sin(angle) * level * levelRadius; + + // Используем сохраненную позицию, если она есть + const savedPosition = nodePositions[nodeId]; + const position = savedPosition || { x: nodeX, y: nodeY }; + + const node = { + id: nodeId, + position, + style: { + width: 50, + height: 50, + borderRadius: '50%', // Делаем круги + backgroundColor: getStatusColor(item.status), + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + color: 'white', + border: '2px solid #fff', + }, + data: { label: item.title }, + }; + + nodes.push(node); + + // Создаем ребро к родителю + if (parentId) { + edges.push({ id: `${parentId}-${nodeId}`, source: parentId, target: nodeId }); + } + + // Дочерние узлы (если узел не свернут) + if (item.items && item.items.length > 0 && !collapsedNodes.has(nodeId)) { + const angleStep = (angleEnd - angleStart) / item.items.length; // Шаг угла для дочерних узлов + item.items.forEach((child, index) => { + // Равномерно распределяем дочерние узлы вокруг родителя + traverse( + child, + nodeId, + level + 1, + angleStart + index * angleStep, // Начальный угол для дочернего узла + angleStart + (index + 1) * angleStep // Конечный угол для дочернего узла + ); + }); + } + }; + + // Начинаем с центрального узла + const centerNode = { + id: data.id, + position: { x: centerX, y: centerY }, + style: { + width: 50, + height: 50, + borderRadius: '50%', + backgroundColor: getStatusColor(data.status), + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + color: 'white', + border: '2px solid #fff', + }, + data: { label: data.title }, + }; + + nodes.push(centerNode); + + // Обрабатываем дочерние узлы центрального узла + if (data.items && data.items.length > 0 && !collapsedNodes.has(data.id)) { + const angleStep = (2 * Math.PI) / data.items.length; // Равномерно распределяем вокруг центра + data.items.forEach((child, index) => { + traverse( + child, + data.id, + 1, // Уровень 1 (первый круг вокруг центра) + index * angleStep, // Начальный угол + (index + 1) * angleStep // Конечный угол + ); + }); + } + + return { nodes, edges }; + }, + [collapsedNodes, nodePositions] // Зависимость от collapsedNodes и nodePositions + ); + + // Обработчик клика по узлу + const onNodeClick = useCallback( + (event, node) => { + const nodeId = node.id; + const newCollapsedNodes = new Set(collapsedNodes); + + if (newCollapsedNodes.has(nodeId)) { + newCollapsedNodes.delete(nodeId); // Разворачиваем узел + } else { + newCollapsedNodes.add(nodeId); // Сворачиваем узел + } + + setCollapsedNodes(newCollapsedNodes); // Обновляем состояние + }, + [collapsedNodes] + ); + + // Обработчик завершения перетаскивания узла + const onNodeDragStop = useCallback( + (event, node) => { + // Сохраняем новую позицию узла + setNodePositions((prevPositions) => ({ + ...prevPositions, + [node.id]: node.position, + })); + }, + [] + ); + + // Обновляем узлы и ребра при изменении данных + useEffect(() => { + const { nodes: initialNodes, edges: initialEdges } = parseData(data); + setNodes(initialNodes); + setEdges(initialEdges); + }, [data, parseData, setNodes, setEdges]); + + return ( +
+ + + + +
+ ); +}; + +export default React.memo(FlowChart); // Оптимизация рендера \ No newline at end of file diff --git a/src/Components/TreeChart/TreeChart.jsx b/src/Components/TreeChart/TreeChart.jsx index f8b0ae0..dad7ed9 100755 --- a/src/Components/TreeChart/TreeChart.jsx +++ b/src/Components/TreeChart/TreeChart.jsx @@ -1,110 +1,55 @@ -import React, { useRef, useEffect, useMemo } from "react"; +import React, { useRef, useEffect, useMemo, useState } from "react"; import * as d3 from "d3"; -import "../../Style/TreeChart.css"; +import { calculateNodePositions } from "./TreeChartComponents/NodePosition"; import { getStatusColor } from "./dataUtils"; -const TreeChart = ({ data, onNodeClick }) => { +const TreeChart = ({ data }) => { const chartRef = useRef(); const nodePositions = useRef(new Map()); + const [treeData, setTreeData] = useState(data); + // Пересчитываем позиции узлов при изменении данных const { root, nodes, links } = useMemo(() => { - if (!data || !data.items) return { root: null, nodes: [], links: [] }; - - const root = d3.hierarchy(data, (d) => d.items); - const maxDepth = d3.max(root.descendants(), (d) => d.depth); - - // Фильтруем узлы, исключая последний уровень - const nodes = root.descendants().filter((d) => d.depth < maxDepth); - - // Фильтруем связи - const links = nodes.filter((d) => d.parent).map((d) => ({ - source: d.parent, - target: d, - })); - - // Размещаем узлы иерархически - const center = { x: 0, y: 0 }; // Центральная точка - const baseRadius = 150; // Базовый радиус для 1-го уровня - const branchOffset = 80; // Смещение узлов вдоль ветки - const angleOffset = Math.PI / 4; // Угол смещения для дочерних ветвей - const spreadFactor = 1.5; // Коэффициент растяжения для последних узлов - - nodes.forEach((node) => { - const prev = nodePositions.current.get(node.data.id); - if (prev) { - node.x = prev.x; - node.y = prev.y; - } else { - if (node.depth === 0) { - // Центральный узел - node.x = center.x; - node.y = center.y; - } else if (node.depth === 1) { - // Первый уровень - равномерно по окружности - const parent = node.parent; - const index = parent.children.indexOf(node); - const totalSiblings = parent.children.length; - - const radius = baseRadius * node.depth; - const sectorAngle = (Math.PI * 2) / totalSiblings; - const angle = index * sectorAngle; - - node.x = parent.x + radius * Math.cos(angle); - node.y = parent.y + radius * Math.sin(angle); - node.angle = angle; // Запоминаем угол для веток - } else { - // Второй уровень и дальше - ветка растет в направлении родителя - const parent = node.parent; - const siblings = parent.children || []; - const index = siblings.indexOf(node); - const totalSiblings = siblings.length; - - const direction = parent.angle || 0; - const offsetAngle = ((index - (totalSiblings - 1) / 2) * angleOffset) / totalSiblings; - - let distance = branchOffset; - if (!node.children || node.children.length === 0) { - // Если это последний узел, увеличиваем расстояние - distance *= spreadFactor + node.depth * 0.2; // Чем глубже, тем больше разброс - } - - node.x = parent.x + distance * Math.cos(direction + offsetAngle); - node.y = parent.y + distance * Math.sin(direction + offsetAngle); - node.angle = direction + offsetAngle; - } - } - nodePositions.current.set(node.data.id, { x: node.x, y: node.y }); - }); - - - - - return { root, nodes, links }; - }, [data]); + return calculateNodePositions(treeData, nodePositions.current); + }, [treeData]); useEffect(() => { if (!chartRef.current) return; + // Удаляем старый граф перед отрисовкой нового + d3.select(chartRef.current).selectAll("*").remove(); + + // Определяем границы графа + const xMin = d3.min(nodes, (d) => d.x) || -500; + const xMax = d3.max(nodes, (d) => d.x) || 500; + const yMin = d3.min(nodes, (d) => d.y) || -500; + const yMax = d3.max(nodes, (d) => d.y) || 500; + + const width = xMax - xMin + 200; + const height = yMax - yMin + 200; + const svg = d3.select(chartRef.current) - .attr("width", 2000) - .attr("height", 2000) - .attr("viewBox", [-500, -500, 1500, 1500]) - .attr("style", "max-width: 100%; height: auto;"); + .attr("width", "100%") + .attr("height", "100%") + .attr("viewBox", `${xMin - 100} ${yMin - 100} ${width} ${height}`) + .attr("style", "max-width: 100%; height: auto;") + .call(d3.zoom() + .scaleExtent([0.5, 5]) + .on("zoom", (event) => { + svg.select("g").attr("transform", event.transform); + }) + ); - svg.append("g").attr("class", "links"); - svg.append("g").attr("class", "nodes"); - svg.append("g").attr("class", "labels"); + const g = svg.append("g"); - // Очищаем предыдущие элементы - svg.selectAll(".links line").remove(); - svg.selectAll(".nodes circle").remove(); - svg.selectAll(".labels text").remove(); + g.append("g").attr("class", "links"); + g.append("g").attr("class", "nodes"); + g.append("g").attr("class", "labels"); // Рисуем связи - const linkGroup = svg.select(".links"); - const link = linkGroup + g.select(".links") .selectAll("line") - .data(links, (d) => `${d.source.data.id}-${d.target.data.id}`) + .data(links) .join("line") .attr("stroke", "#999") .attr("stroke-opacity", 0.6) @@ -114,40 +59,33 @@ const TreeChart = ({ data, onNodeClick }) => { .attr("y2", (d) => d.target.y); // Рисуем узлы - const nodeGroup = svg.select(".nodes"); - const node = nodeGroup + g.select(".nodes") .selectAll("circle") - .data(nodes, (d) => d.data.id) + .data(nodes) .join("circle") .attr("fill", (d) => getStatusColor(d.data.status)) .attr("stroke", "#fff") .attr("r", 7) .attr("cx", (d) => d.x) .attr("cy", (d) => d.y) + .on("click", (event, d) => toggleNode(d)) .call(drag()); - node.on("click", (event, d) => { - if (onNodeClick) { - onNodeClick(d.data.id, d.data.title); - } - }); - // Рисуем текстовые метки - const labelGroup = svg.select(".labels"); - const text = labelGroup + g.select(".labels") .selectAll("text") - .data(nodes, (d) => d.data.id) + .data(nodes) .join("text") - .text((d) => (nodes.length > 50 ? "" : d.data.title)) // Скрываем текст, если узлов много + .text((d) => (nodes.length > 50 ? "" : d.data.title)) .attr("dx", 12) .attr("dy", 4) - .style("user-select", "none") // Запрет выделения текста - .style("pointer-events", "none") // Запрет взаимодействия с текстом - .style("fill", "var(--TreeChart-text-color)") // Используем переменную для цвета текста + .style("user-select", "none") + .style("pointer-events", "none") + .style("fill", "var(--TreeChart-text-color)") .attr("x", (d) => d.x + 12) .attr("y", (d) => d.y + 4); - }, [root, links, nodes, onNodeClick]); + }, [root, links, nodes]); const drag = () => { function dragstarted(event, d) { @@ -159,13 +97,11 @@ const TreeChart = ({ data, onNodeClick }) => { d.y = event.y; d3.select(this).attr("cx", d.x).attr("cy", d.y); - // Обновляем текстовую метку d3.select(this.parentNode) .select("text") .attr("x", d.x + 12) .attr("y", d.y + 4); - // Обновляем связи d3.select(chartRef.current) .selectAll(".links line") .filter((link) => link.source === d || link.target === d) @@ -183,7 +119,21 @@ const TreeChart = ({ data, onNodeClick }) => { return d3.drag().on("start", dragstarted).on("drag", dragged).on("end", dragended); }; + const toggleNode = (d) => { + d.data.collapsed = !d.data.collapsed; + + if (d.data.collapsed) { + d._children = d.data.children; + d.data.children = []; + } else { + d.data.children = d._children; + d._children = null; + } + + setTreeData({ ...treeData }); + }; + return ; }; -export default TreeChart; \ No newline at end of file +export default TreeChart; diff --git a/src/Components/TreeChart/TreeChartComponents/Label.jsx b/src/Components/TreeChart/TreeChartComponents/Label.jsx new file mode 100644 index 0000000..50fda20 --- /dev/null +++ b/src/Components/TreeChart/TreeChartComponents/Label.jsx @@ -0,0 +1,21 @@ +import React from "react"; + +const Label = ({ node }) => { + return ( + + {node.data.title} + + ); +}; + +export default Label; \ No newline at end of file diff --git a/src/Components/TreeChart/TreeChartComponents/Link.jsx b/src/Components/TreeChart/TreeChartComponents/Link.jsx new file mode 100644 index 0000000..653539a --- /dev/null +++ b/src/Components/TreeChart/TreeChartComponents/Link.jsx @@ -0,0 +1,16 @@ +import React from "react"; + +const Link = ({ link }) => { + return ( + + ); +}; + +export default Link; \ No newline at end of file diff --git a/src/Components/TreeChart/TreeChartComponents/Node.jsx b/src/Components/TreeChart/TreeChartComponents/Node.jsx new file mode 100644 index 0000000..3291608 --- /dev/null +++ b/src/Components/TreeChart/TreeChartComponents/Node.jsx @@ -0,0 +1,19 @@ +import React from "react"; +import * as d3 from "d3"; +import { getStatusColor } from "../dataUtils"; + +const Node = ({ node, onNodeClick, drag }) => { + return ( + drag(event, node)} + onClick={() => onNodeClick(node.data.id, node.data.title)} + /> + ); +}; + +export default Node; \ No newline at end of file diff --git a/src/Components/TreeChart/TreeChartComponents/NodePosition.jsx b/src/Components/TreeChart/TreeChartComponents/NodePosition.jsx new file mode 100644 index 0000000..2a7fd4d --- /dev/null +++ b/src/Components/TreeChart/TreeChartComponents/NodePosition.jsx @@ -0,0 +1,30 @@ +import * as d3 from "d3"; + +export const calculateNodePositions = (data, nodePositions) => { + if (!data || !data.items) return { root: null, nodes: [], links: [] }; + + const root = d3.hierarchy(data, (d) => d.items); + const treeLayout = d3.tree().size([4000 * Math.PI, 300]); // Угловое распределение (радиан, радиус) + + treeLayout(root); // Заполняем координаты + + const nodes = root.descendants(); + const links = nodes + .filter((d) => d.parent) + .map((d) => ({ + source: d.parent, + target: d, + })); + + // Преобразуем полярные координаты в декартовые + nodes.forEach((node) => { + const angle = node.x; // x теперь угол (радианы) + const radius = node.y; // y теперь радиус + nodePositions.set(node.data.id, { + x: radius * Math.cos(angle), + y: radius * Math.sin(angle), + }); + }); + + return { root, nodes, links }; +}; diff --git a/src/Components/TreeChart/menuData.json b/src/Components/TreeChart/menuData.json index aabfefc..1d4c364 100755 --- a/src/Components/TreeChart/menuData.json +++ b/src/Components/TreeChart/menuData.json @@ -399,381 +399,381 @@ "id": "media_server_2", "items": [ { - "id": "18", + "id": "182", "title": "Graviton S2082I (device$18)", "items": [ { - "id": "4", + "id": "42", "title": "OS Linux (module$4) АО", "items": [ { - "id": "190", + "id": "1902", "title": "Загрузка процессора за 1 минуту" }, { - "id": "191", + "id": "1912", "title": "Загрузка процессора за 5 минут" }, { - "id": "192", + "id": "1922", "title": "Загрузка процессора за 15 минут" }, { - "id": "197", + "id": "1972", "title": "Общий объем SWAP-файла" }, { - "id": "198", + "id": "1982", "title": "Используемый объем SWAP-файла" }, { - "id": "199", + "id": "1992", "title": "Общий объем физической оперативной памяти" }, { - "id": "200", + "id": "2002", "title": "Доступный объем физической оперативной памяти" }, { - "id": "201", + "id": "2012", "title": "Свободный объем физической и виртуальной оперативной памяти" }, { - "id": "202", + "id": "2022", "title": "Буферизованный объем оперативной памяти" }, { - "id": "203", + "id": "2032", "title": "Кэшированый объем оперативной памяти" }, { - "id": "274", + "id": "2742", "title": "Используемый объем SWAP-файла" }, { - "id": "275", + "id": "2752", "title": "Время затраченное процессором на процессы с пониженным приоритетом" }, { - "id": "276", + "id": "2762", "title": "Время затраченное процессором на процессы ядра ОС" }, { - "id": "277", + "id": "2772", "title": "Время простоя процессора" }, { - "id": "278", + "id": "2782", "title": "Общая емкость жестких дисков" }, { - "id": "279", + "id": "2792", "title": "Доступная емкость жестких дисков" } ] }, { - "id": "5", + "id": "52", "title": "Vinteo (module$5) ПО", "items": [ { - "id": "31", + "id": "312", "title": "Общее количество участников" }, { - "id": "32", + "id": "322", "title": "Ожидание соединения" }, { - "id": "33", + "id": "332", "title": "Зарегистрированные абоненты" }, { - "id": "34", + "id": "342", "title": "Количество пользоватей HLS" }, { - "id": "35", + "id": "352", "title": "Общее количество P2P комнат" }, { - "id": "36", + "id": "362", "title": "Общее количество конференций" }, { - "id": "37", + "id": "372", "title": "Общее количество активных конференций" }, { - "id": "38", + "id": "382", "title": "Статус записи" }, { - "id": "39", + "id": "392", "title": "Общее количество сохранённых записей" } ] }, { - "id": "280", + "id": "2802", "title": "Сетевой адаптер №1 (port$261) Eth_1", "items": [ { - "id": "207", + "id": "2072", "title": "Скорость порта Eth_1" }, { - "id": "209", + "id": "2092", "title": "Административное состояние порта Eth_1" }, { - "id": "210", + "id": "2102", "title": "Оперативное состояние порта Eth_1" }, { - "id": "211", + "id": "2112", "title": "Общее количество отправленных октетов Eth_1" }, { - "id": "212", + "id": "2122", "title": "Количество входящих Multicast пакетов Eth_1" }, { - "id": "213", + "id": "2132", "title": "Количество иcходящих Multiicast пакетов Eth_1" }, { - "id": "214", + "id": "2142", "title": "Количество входящих Broadcast пакетов Eth_1" }, { - "id": "215", + "id": "2152", "title": "Количество иcходящих Broadcast пакетов Eth_1" }, { - "id": "216", + "id": "2162", "title": "Количество входящих Unicast пакетов Eth_1" }, { - "id": "217", + "id": "2172", "title": "Количество иcходящих Unicast пакетов Eth_1" }, { - "id": "218", + "id": "2182", "title": "Количество входящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "219", + "id": "2192", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "220", + "id": "2202", "title": "Количество входящих пакетов с ошибкой Eth_1" }, { - "id": "221", + "id": "2212", "title": "Количество исходящих пакетов с ошибкой Eth_1" }, { - "id": "222", + "id": "2222", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_1" } ] }, { - "id": "281", + "id": "2812", "title": "Сетевой адаптер №2 (port$262) Eth_2", "items": [ { - "id": "224", + "id": "2242", "title": "Скорость порта Eth_2" }, { - "id": "226", + "id": "2262", "title": "Административное состояние порта Eth_2" }, { - "id": "227", + "id": "2272", "title": "Оперативное состояние порта Eth_2" }, { - "id": "228", + "id": "2282", "title": "Общее количество отправленных октетов Eth_2" }, { - "id": "229", + "id": "2292", "title": "Количество входящих Multicast пакетов Eth_2" }, { - "id": "230", + "id": "2302", "title": "Количество иcходящих Multiicast пакетов Eth_2" }, { - "id": "231", + "id": "2312", "title": "Количество входящих Broadcast пакетов Eth_2" }, { - "id": "232", + "id": "2322", "title": "Количество иcходящих Broadcast пакетов Eth_2" }, { - "id": "233", + "id": "2332", "title": "Количество входящих Unicast пакетов Eth_2" }, { - "id": "234", + "id": "2342", "title": "Количество иcходящих Unicast пакетов Eth_2" }, { - "id": "235", + "id": "2352", "title": "Количество входящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "236", + "id": "2362", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "237", + "id": "2372", "title": "Количество входящих пакетов с ошибкой Eth_2" }, { - "id": "238", + "id": "2382", "title": "Количество исходящих пакетов с ошибкой Eth_2" }, { - "id": "239", + "id": "2392", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_2" } ] }, { - "id": "282", + "id": "2822", "title": "Сетевой адаптер №3 (port$263) Eth_3", "items": [ { - "id": "241", + "id": "2412", "title": "Скорость порта Eth_3" }, { - "id": "243", + "id": "2432", "title": "Административное состояние порта Eth_3" }, { - "id": "244", + "id": "2442", "title": "Оперативное состояние порта Eth_3" }, { - "id": "245", + "id": "2452", "title": "Общее количество отправленных октетов Eth_3" }, { - "id": "246", + "id": "2462", "title": "Количество входящих Multicast пакетов Eth_3" }, { - "id": "247", + "id": "2472", "title": "Количество иcходящих Multiicast пакетов Eth_3" }, { - "id": "248", + "id": "2482", "title": "Количество входящих Broadcast пакетов Eth_3" }, { - "id": "249", + "id": "2492", "title": "Количество иcходящих Broadcast пакетов Eth_3" }, { - "id": "250", + "id": "2502", "title": "Количество входящих Unicast пакетов Eth_3" }, { - "id": "251", + "id": "2512", "title": "Количество иcходящих Unicast пакетов Eth_3" }, { - "id": "252", + "id": "2522", "title": "Количество входящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "253", + "id": "2532", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "254", + "id": "2542", "title": "Количество входящих пакетов с ошибкой Eth_3" }, { - "id": "255", + "id": "2552", "title": "Количество исходящих пакетов с ошибкой Eth_3" }, { - "id": "256", + "id": "2562", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_3" } ] }, { - "id": "283", + "id": "2832", "title": "Сетевой адаптер №4 (port$264) Eth_4", "items": [ { - "id": "258", + "id": "2582", "title": "Скорость порта Eth_4" }, { - "id": "260", + "id": "2602", "title": "Административное состояние порта Eth_4" }, { - "id": "261", + "id": "2612", "title": "Оперативное состояние порта Eth_4" }, { - "id": "262", + "id": "2622", "title": "Общее количество отправленных октетов Eth_4" }, { - "id": "263", + "id": "2632", "title": "Количество входящих Multicast пакетов Eth_4" }, { - "id": "264", + "id": "2642", "title": "Количество иcходящих Multiicast пакетов Eth_4" }, { - "id": "265", + "id": "2652", "title": "Количество входящих Broadcast пакетов Eth_4" }, { - "id": "266", + "id": "2662", "title": "Количество иcходящих Broadcast пакетов Eth_4" }, { - "id": "267", + "id": "2672", "title": "Количество входящих Unicast пакетов Eth_4" }, { - "id": "268", + "id": "2682", "title": "Количество иcходящих Unicast пакетов Eth_4" }, { - "id": "269", + "id": "2692", "title": "Количество входящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "270", + "id": "2702", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "271", + "id": "2712", "title": "Количество входящих пакетов с ошибкой Eth_4" }, { - "id": "272", + "id": "2722", "title": "Количество исходящих пакетов с ошибкой Eth_4" }, { - "id": "273", + "id": "2732", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_4" } ] @@ -787,381 +787,381 @@ "id": "system_server_1", "items": [ { - "id": "18", + "id": "183", "title": "Graviton S2082I (device$18)", "items": [ { - "id": "4", + "id": "43", "title": "OS Linux (module$4) АО", "items": [ { - "id": "190", + "id": "1903", "title": "Загрузка процессора за 1 минуту" }, { - "id": "191", + "id": "1913", "title": "Загрузка процессора за 5 минут" }, { - "id": "192", + "id": "1923", "title": "Загрузка процессора за 15 минут" }, { - "id": "197", + "id": "1973", "title": "Общий объем SWAP-файла" }, { - "id": "198", + "id": "1983", "title": "Используемый объем SWAP-файла" }, { - "id": "199", + "id": "1993", "title": "Общий объем физической оперативной памяти" }, { - "id": "200", + "id": "2003", "title": "Доступный объем физической оперативной памяти" }, { - "id": "201", + "id": "2013", "title": "Свободный объем физической и виртуальной оперативной памяти" }, { - "id": "202", + "id": "2023", "title": "Буферизованный объем оперативной памяти" }, { - "id": "203", + "id": "2033", "title": "Кэшированый объем оперативной памяти" }, { - "id": "274", + "id": "2743", "title": "Используемый объем SWAP-файла" }, { - "id": "275", + "id": "2753", "title": "Время затраченное процессором на процессы с пониженным приоритетом" }, { - "id": "276", + "id": "2763", "title": "Время затраченное процессором на процессы ядра ОС" }, { - "id": "277", + "id": "2773", "title": "Время простоя процессора" }, { - "id": "278", + "id": "2783", "title": "Общая емкость жестких дисков" }, { - "id": "279", + "id": "2793", "title": "Доступная емкость жестких дисков" } ] }, { - "id": "5", + "id": "53", "title": "Vinteo (module$5) ПО", "items": [ { - "id": "31", + "id": "313", "title": "Общее количество участников" }, { - "id": "32", + "id": "323", "title": "Ожидание соединения" }, { - "id": "33", + "id": "333", "title": "Зарегистрированные абоненты" }, { - "id": "34", + "id": "343", "title": "Количество пользоватей HLS" }, { - "id": "35", + "id": "353", "title": "Общее количество P2P комнат" }, { - "id": "36", + "id": "363", "title": "Общее количество конференций" }, { - "id": "37", + "id": "373", "title": "Общее количество активных конференций" }, { - "id": "38", + "id": "383", "title": "Статус записи" }, { - "id": "39", + "id": "393", "title": "Общее количество сохранённых записей" } ] }, { - "id": "280", + "id": "2803", "title": "Сетевой адаптер №1 (port$261) Eth_1", "items": [ { - "id": "207", + "id": "2073", "title": "Скорость порта Eth_1" }, { - "id": "209", + "id": "2093", "title": "Административное состояние порта Eth_1" }, { - "id": "210", + "id": "2103", "title": "Оперативное состояние порта Eth_1" }, { - "id": "211", + "id": "2113", "title": "Общее количество отправленных октетов Eth_1" }, { - "id": "212", + "id": "2123", "title": "Количество входящих Multicast пакетов Eth_1" }, { - "id": "213", + "id": "2133", "title": "Количество иcходящих Multiicast пакетов Eth_1" }, { - "id": "214", + "id": "2143", "title": "Количество входящих Broadcast пакетов Eth_1" }, { - "id": "215", + "id": "2153", "title": "Количество иcходящих Broadcast пакетов Eth_1" }, { - "id": "216", + "id": "2163", "title": "Количество входящих Unicast пакетов Eth_1" }, { - "id": "217", + "id": "2173", "title": "Количество иcходящих Unicast пакетов Eth_1" }, { - "id": "218", + "id": "2183", "title": "Количество входящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "219", + "id": "2193", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "220", + "id": "2203", "title": "Количество входящих пакетов с ошибкой Eth_1" }, { - "id": "221", + "id": "2213", "title": "Количество исходящих пакетов с ошибкой Eth_1" }, { - "id": "222", + "id": "2223", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_1" } ] }, { - "id": "281", + "id": "2813", "title": "Сетевой адаптер №2 (port$262) Eth_2", "items": [ { - "id": "224", + "id": "2243", "title": "Скорость порта Eth_2" }, { - "id": "226", + "id": "2263", "title": "Административное состояние порта Eth_2" }, { - "id": "227", + "id": "2273", "title": "Оперативное состояние порта Eth_2" }, { - "id": "228", + "id": "2283", "title": "Общее количество отправленных октетов Eth_2" }, { - "id": "229", + "id": "2293", "title": "Количество входящих Multicast пакетов Eth_2" }, { - "id": "230", + "id": "2303", "title": "Количество иcходящих Multiicast пакетов Eth_2" }, { - "id": "231", + "id": "2313", "title": "Количество входящих Broadcast пакетов Eth_2" }, { - "id": "232", + "id": "2323", "title": "Количество иcходящих Broadcast пакетов Eth_2" }, { - "id": "233", + "id": "2333", "title": "Количество входящих Unicast пакетов Eth_2" }, { - "id": "234", + "id": "2343", "title": "Количество иcходящих Unicast пакетов Eth_2" }, { - "id": "235", + "id": "2353", "title": "Количество входящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "236", + "id": "2363", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "237", + "id": "2373", "title": "Количество входящих пакетов с ошибкой Eth_2" }, { - "id": "238", + "id": "2383", "title": "Количество исходящих пакетов с ошибкой Eth_2" }, { - "id": "239", + "id": "2393", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_2" } ] }, { - "id": "282", + "id": "2823", "title": "Сетевой адаптер №3 (port$263) Eth_3", "items": [ { - "id": "241", + "id": "2413", "title": "Скорость порта Eth_3" }, { - "id": "243", + "id": "2433", "title": "Административное состояние порта Eth_3" }, { - "id": "244", + "id": "2443", "title": "Оперативное состояние порта Eth_3" }, { - "id": "245", + "id": "2453", "title": "Общее количество отправленных октетов Eth_3" }, { - "id": "246", + "id": "2463", "title": "Количество входящих Multicast пакетов Eth_3" }, { - "id": "247", + "id": "2473", "title": "Количество иcходящих Multiicast пакетов Eth_3" }, { - "id": "248", + "id": "2483", "title": "Количество входящих Broadcast пакетов Eth_3" }, { - "id": "249", + "id": "2493", "title": "Количество иcходящих Broadcast пакетов Eth_3" }, { - "id": "250", + "id": "2503", "title": "Количество входящих Unicast пакетов Eth_3" }, { - "id": "251", + "id": "2513", "title": "Количество иcходящих Unicast пакетов Eth_3" }, { - "id": "252", + "id": "2523", "title": "Количество входящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "253", + "id": "2533", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "254", + "id": "2543", "title": "Количество входящих пакетов с ошибкой Eth_3" }, { - "id": "255", + "id": "2553", "title": "Количество исходящих пакетов с ошибкой Eth_3" }, { - "id": "256", + "id": "2563", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_3" } ] }, { - "id": "283", + "id": "2833", "title": "Сетевой адаптер №4 (port$264) Eth_4", "items": [ { - "id": "258", + "id": "2583", "title": "Скорость порта Eth_4" }, { - "id": "260", + "id": "2603", "title": "Административное состояние порта Eth_4" }, { - "id": "261", + "id": "2613", "title": "Оперативное состояние порта Eth_4" }, { - "id": "262", + "id": "2623", "title": "Общее количество отправленных октетов Eth_4" }, { - "id": "263", + "id": "2633", "title": "Количество входящих Multicast пакетов Eth_4" }, { - "id": "264", + "id": "2643", "title": "Количество иcходящих Multiicast пакетов Eth_4" }, { - "id": "265", + "id": "2653", "title": "Количество входящих Broadcast пакетов Eth_4" }, { - "id": "266", + "id": "2663", "title": "Количество иcходящих Broadcast пакетов Eth_4" }, { - "id": "267", + "id": "2673", "title": "Количество входящих Unicast пакетов Eth_4" }, { - "id": "268", + "id": "2683", "title": "Количество иcходящих Unicast пакетов Eth_4" }, { - "id": "269", + "id": "2693", "title": "Количество входящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "270", + "id": "2703", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "271", + "id": "2713", "title": "Количество входящих пакетов с ошибкой Eth_4" }, { - "id": "272", + "id": "2723", "title": "Количество исходящих пакетов с ошибкой Eth_4" }, { - "id": "273", + "id": "2733", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_4" } ] @@ -1175,381 +1175,381 @@ "id": "system_server_2", "items": [ { - "id": "18", + "id": "184", "title": "Graviton S2082I (device$18)", "items": [ { - "id": "4", + "id": "44", "title": "OS Linux (module$4) АО", "items": [ { - "id": "190", + "id": "1904", "title": "Загрузка процессора за 1 минуту" }, { - "id": "191", + "id": "1914", "title": "Загрузка процессора за 5 минут" }, { - "id": "192", + "id": "1924", "title": "Загрузка процессора за 15 минут" }, { - "id": "197", + "id": "1974", "title": "Общий объем SWAP-файла" }, { - "id": "198", + "id": "1984", "title": "Используемый объем SWAP-файла" }, { - "id": "199", + "id": "1994", "title": "Общий объем физической оперативной памяти" }, { - "id": "200", + "id": "2004", "title": "Доступный объем физической оперативной памяти" }, { - "id": "201", + "id": "2014", "title": "Свободный объем физической и виртуальной оперативной памяти" }, { - "id": "202", + "id": "2024", "title": "Буферизованный объем оперативной памяти" }, { - "id": "203", + "id": "2034", "title": "Кэшированый объем оперативной памяти" }, { - "id": "274", + "id": "2744", "title": "Используемый объем SWAP-файла" }, { - "id": "275", + "id": "2754", "title": "Время затраченное процессором на процессы с пониженным приоритетом" }, { - "id": "276", + "id": "2764", "title": "Время затраченное процессором на процессы ядра ОС" }, { - "id": "277", + "id": "2774", "title": "Время простоя процессора" }, { - "id": "278", + "id": "2784", "title": "Общая емкость жестких дисков" }, { - "id": "279", + "id": "2794", "title": "Доступная емкость жестких дисков" } ] }, { - "id": "5", + "id": "54", "title": "Vinteo (module$5) ПО", "items": [ { - "id": "31", + "id": "314", "title": "Общее количество участников" }, { - "id": "32", + "id": "324", "title": "Ожидание соединения" }, { - "id": "33", + "id": "334", "title": "Зарегистрированные абоненты" }, { - "id": "34", + "id": "344", "title": "Количество пользоватей HLS" }, { - "id": "35", + "id": "354", "title": "Общее количество P2P комнат" }, { - "id": "36", + "id": "364", "title": "Общее количество конференций" }, { - "id": "37", + "id": "374", "title": "Общее количество активных конференций" }, { - "id": "38", + "id": "384", "title": "Статус записи" }, { - "id": "39", + "id": "394", "title": "Общее количество сохранённых записей" } ] }, { - "id": "280", + "id": "2804", "title": "Сетевой адаптер №1 (port$261) Eth_1", "items": [ { - "id": "207", + "id": "2074", "title": "Скорость порта Eth_1" }, { - "id": "209", + "id": "2094", "title": "Административное состояние порта Eth_1" }, { - "id": "210", + "id": "2104", "title": "Оперативное состояние порта Eth_1" }, { - "id": "211", + "id": "2114", "title": "Общее количество отправленных октетов Eth_1" }, { - "id": "212", + "id": "2124", "title": "Количество входящих Multicast пакетов Eth_1" }, { - "id": "213", + "id": "2134", "title": "Количество иcходящих Multiicast пакетов Eth_1" }, { - "id": "214", + "id": "2144", "title": "Количество входящих Broadcast пакетов Eth_1" }, { - "id": "215", + "id": "2154", "title": "Количество иcходящих Broadcast пакетов Eth_1" }, { - "id": "216", + "id": "2164", "title": "Количество входящих Unicast пакетов Eth_1" }, { - "id": "217", + "id": "2174", "title": "Количество иcходящих Unicast пакетов Eth_1" }, { - "id": "218", + "id": "2184", "title": "Количество входящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "219", + "id": "2194", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "220", + "id": "2204", "title": "Количество входящих пакетов с ошибкой Eth_1" }, { - "id": "221", + "id": "2214", "title": "Количество исходящих пакетов с ошибкой Eth_1" }, { - "id": "222", + "id": "2224", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_1" } ] }, { - "id": "281", + "id": "2814", "title": "Сетевой адаптер №2 (port$262) Eth_2", "items": [ { - "id": "224", + "id": "2244", "title": "Скорость порта Eth_2" }, { - "id": "226", + "id": "2264", "title": "Административное состояние порта Eth_2" }, { - "id": "227", + "id": "2274", "title": "Оперативное состояние порта Eth_2" }, { - "id": "228", + "id": "2284", "title": "Общее количество отправленных октетов Eth_2" }, { - "id": "229", + "id": "2294", "title": "Количество входящих Multicast пакетов Eth_2" }, { - "id": "230", + "id": "2304", "title": "Количество иcходящих Multiicast пакетов Eth_2" }, { - "id": "231", + "id": "2314", "title": "Количество входящих Broadcast пакетов Eth_2" }, { - "id": "232", + "id": "2324", "title": "Количество иcходящих Broadcast пакетов Eth_2" }, { - "id": "233", + "id": "2334", "title": "Количество входящих Unicast пакетов Eth_2" }, { - "id": "234", + "id": "2344", "title": "Количество иcходящих Unicast пакетов Eth_2" }, { - "id": "235", + "id": "2354", "title": "Количество входящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "236", + "id": "2364", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "237", + "id": "2374", "title": "Количество входящих пакетов с ошибкой Eth_2" }, { - "id": "238", + "id": "2384", "title": "Количество исходящих пакетов с ошибкой Eth_2" }, { - "id": "239", + "id": "2394", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_2" } ] }, { - "id": "282", + "id": "2824", "title": "Сетевой адаптер №3 (port$263) Eth_3", "items": [ { - "id": "241", + "id": "2414", "title": "Скорость порта Eth_3" }, { - "id": "243", + "id": "2434", "title": "Административное состояние порта Eth_3" }, { - "id": "244", + "id": "2444", "title": "Оперативное состояние порта Eth_3" }, { - "id": "245", + "id": "2454", "title": "Общее количество отправленных октетов Eth_3" }, { - "id": "246", + "id": "2464", "title": "Количество входящих Multicast пакетов Eth_3" }, { - "id": "247", + "id": "2474", "title": "Количество иcходящих Multiicast пакетов Eth_3" }, { - "id": "248", + "id": "2484", "title": "Количество входящих Broadcast пакетов Eth_3" }, { - "id": "249", + "id": "2494", "title": "Количество иcходящих Broadcast пакетов Eth_3" }, { - "id": "250", + "id": "2504", "title": "Количество входящих Unicast пакетов Eth_3" }, { - "id": "251", + "id": "2514", "title": "Количество иcходящих Unicast пакетов Eth_3" }, { - "id": "252", + "id": "2524", "title": "Количество входящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "253", + "id": "2534", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "254", + "id": "2544", "title": "Количество входящих пакетов с ошибкой Eth_3" }, { - "id": "255", + "id": "2554", "title": "Количество исходящих пакетов с ошибкой Eth_3" }, { - "id": "256", + "id": "2564", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_3" } ] }, { - "id": "283", + "id": "2834", "title": "Сетевой адаптер №4 (port$264) Eth_4", "items": [ { - "id": "258", + "id": "2584", "title": "Скорость порта Eth_4" }, { - "id": "260", + "id": "2604", "title": "Административное состояние порта Eth_4" }, { - "id": "261", + "id": "2614", "title": "Оперативное состояние порта Eth_4" }, { - "id": "262", + "id": "2624", "title": "Общее количество отправленных октетов Eth_4" }, { - "id": "263", + "id": "2634", "title": "Количество входящих Multicast пакетов Eth_4" }, { - "id": "264", + "id": "2644", "title": "Количество иcходящих Multiicast пакетов Eth_4" }, { - "id": "265", + "id": "2654", "title": "Количество входящих Broadcast пакетов Eth_4" }, { - "id": "266", + "id": "2664", "title": "Количество иcходящих Broadcast пакетов Eth_4" }, { - "id": "267", + "id": "2674", "title": "Количество входящих Unicast пакетов Eth_4" }, { - "id": "268", + "id": "2684", "title": "Количество иcходящих Unicast пакетов Eth_4" }, { - "id": "269", + "id": "2694", "title": "Количество входящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "270", + "id": "2704", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "271", + "id": "2714", "title": "Количество входящих пакетов с ошибкой Eth_4" }, { - "id": "272", + "id": "2724", "title": "Количество исходящих пакетов с ошибкой Eth_4" }, { - "id": "273", + "id": "2734", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_4" } ] @@ -1566,384 +1566,384 @@ "items": [ { "title": "Сервер Управления", - "id": "media_server_1", + "id": "media_server_12", "items": [ { - "id": "18", + "id": "1822", "title": "Graviton S2082I (device$18)", "items": [ { - "id": "4", + "id": "423", "title": "OS Linux (module$4) АО", "items": [ { - "id": "190", + "id": "1909", "title": "Загрузка процессора за 1 минуту" }, { - "id": "191", + "id": "1919", "title": "Загрузка процессора за 5 минут" }, { - "id": "192", + "id": "1929", "title": "Загрузка процессора за 15 минут" }, { - "id": "197", + "id": "1979", "title": "Общий объем SWAP-файла" }, { - "id": "198", + "id": "1989", "title": "Используемый объем SWAP-файла" }, { - "id": "199", + "id": "1999", "title": "Общий объем физической оперативной памяти" }, { - "id": "200", + "id": "2009", "title": "Доступный объем физической оперативной памяти" }, { - "id": "201", + "id": "2019", "title": "Свободный объем физической и виртуальной оперативной памяти" }, { - "id": "202", + "id": "2029", "title": "Буферизованный объем оперативной памяти" }, { - "id": "203", + "id": "2039", "title": "Кэшированый объем оперативной памяти" }, { - "id": "274", + "id": "2749", "title": "Используемый объем SWAP-файла" }, { - "id": "275", + "id": "2759", "title": "Время затраченное процессором на процессы с пониженным приоритетом" }, { - "id": "276", + "id": "2769", "title": "Время затраченное процессором на процессы ядра ОС" }, { - "id": "277", + "id": "2779", "title": "Время простоя процессора" }, { - "id": "278", + "id": "2789", "title": "Общая емкость жестких дисков" }, { - "id": "279", + "id": "2799", "title": "Доступная емкость жестких дисков" } ] }, { - "id": "5", + "id": "59", "title": "Vinteo (module$5) ПО", "items": [ { - "id": "31", + "id": "319", "title": "Общее количество участников" }, { - "id": "32", + "id": "329", "title": "Ожидание соединения" }, { - "id": "33", + "id": "339", "title": "Зарегистрированные абоненты" }, { - "id": "34", + "id": "349", "title": "Количество пользоватей HLS" }, { - "id": "35", + "id": "359", "title": "Общее количество P2P комнат" }, { - "id": "36", + "id": "369", "title": "Общее количество конференций" }, { - "id": "37", + "id": "379", "title": "Общее количество активных конференций" }, { - "id": "38", + "id": "389", "title": "Статус записи" }, { - "id": "39", + "id": "399", "title": "Общее количество сохранённых записей" } ] }, { - "id": "280", + "id": "2809", "title": "Сетевой адаптер №1 (port$261) Eth_1", "items": [ { - "id": "207", + "id": "2079", "title": "Скорость порта Eth_1" }, { - "id": "209", + "id": "2099", "title": "Административное состояние порта Eth_1" }, { - "id": "210", + "id": "2109", "title": "Оперативное состояние порта Eth_1" }, { - "id": "211", + "id": "2119", "title": "Общее количество отправленных октетов Eth_1" }, { - "id": "212", + "id": "2129", "title": "Количество входящих Multicast пакетов Eth_1" }, { - "id": "213", + "id": "2139", "title": "Количество иcходящих Multiicast пакетов Eth_1" }, { - "id": "214", + "id": "2149", "title": "Количество входящих Broadcast пакетов Eth_1" }, { - "id": "215", + "id": "2159", "title": "Количество иcходящих Broadcast пакетов Eth_1" }, { - "id": "216", + "id": "2169", "title": "Количество входящих Unicast пакетов Eth_1" }, { - "id": "217", + "id": "2179", "title": "Количество иcходящих Unicast пакетов Eth_1" }, { - "id": "218", + "id": "2189", "title": "Количество входящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "219", + "id": "2199", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "220", + "id": "2209", "title": "Количество входящих пакетов с ошибкой Eth_1" }, { - "id": "221", + "id": "2219", "title": "Количество исходящих пакетов с ошибкой Eth_1" }, { - "id": "222", + "id": "2229", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_1" } ] }, { - "id": "281", + "id": "2819", "title": "Сетевой адаптер №2 (port$262) Eth_2", "items": [ { - "id": "224", + "id": "2249", "title": "Скорость порта Eth_2" }, { - "id": "226", + "id": "2269", "title": "Административное состояние порта Eth_2" }, { - "id": "227", + "id": "2279", "title": "Оперативное состояние порта Eth_2" }, { - "id": "228", + "id": "2289", "title": "Общее количество отправленных октетов Eth_2" }, { - "id": "229", + "id": "2299", "title": "Количество входящих Multicast пакетов Eth_2" }, { - "id": "230", + "id": "2309", "title": "Количество иcходящих Multiicast пакетов Eth_2" }, { - "id": "231", + "id": "2319", "title": "Количество входящих Broadcast пакетов Eth_2" }, { - "id": "232", + "id": "2329", "title": "Количество иcходящих Broadcast пакетов Eth_2" }, { - "id": "233", + "id": "2339", "title": "Количество входящих Unicast пакетов Eth_2" }, { - "id": "234", + "id": "2349", "title": "Количество иcходящих Unicast пакетов Eth_2" }, { - "id": "235", + "id": "2359", "title": "Количество входящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "236", + "id": "2369", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "237", + "id": "2379", "title": "Количество входящих пакетов с ошибкой Eth_2" }, { - "id": "238", + "id": "2389", "title": "Количество исходящих пакетов с ошибкой Eth_2" }, { - "id": "239", + "id": "2399", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_2" } ] }, { - "id": "282", + "id": "2829", "title": "Сетевой адаптер №3 (port$263) Eth_3", "items": [ { - "id": "241", + "id": "2419", "title": "Скорость порта Eth_3" }, { - "id": "243", + "id": "2439", "title": "Административное состояние порта Eth_3" }, { - "id": "244", + "id": "2449", "title": "Оперативное состояние порта Eth_3" }, { - "id": "245", + "id": "2459", "title": "Общее количество отправленных октетов Eth_3" }, { - "id": "246", + "id": "2469", "title": "Количество входящих Multicast пакетов Eth_3" }, { - "id": "247", + "id": "2479", "title": "Количество иcходящих Multiicast пакетов Eth_3" }, { - "id": "248", + "id": "2489", "title": "Количество входящих Broadcast пакетов Eth_3" }, { - "id": "249", + "id": "2499", "title": "Количество иcходящих Broadcast пакетов Eth_3" }, { - "id": "250", + "id": "2509", "title": "Количество входящих Unicast пакетов Eth_3" }, { - "id": "251", + "id": "2519", "title": "Количество иcходящих Unicast пакетов Eth_3" }, { - "id": "252", + "id": "2529", "title": "Количество входящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "253", + "id": "2539", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "254", + "id": "2549", "title": "Количество входящих пакетов с ошибкой Eth_3" }, { - "id": "255", + "id": "2559", "title": "Количество исходящих пакетов с ошибкой Eth_3" }, { - "id": "256", + "id": "2569", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_3" } ] }, { - "id": "283", + "id": "2839", "title": "Сетевой адаптер №4 (port$264) Eth_4", "items": [ { - "id": "258", + "id": "2589", "title": "Скорость порта Eth_4" }, { - "id": "260", + "id": "2609", "title": "Административное состояние порта Eth_4" }, { - "id": "261", + "id": "2619", "title": "Оперативное состояние порта Eth_4" }, { - "id": "262", + "id": "2629", "title": "Общее количество отправленных октетов Eth_4" }, { - "id": "263", + "id": "2639", "title": "Количество входящих Multicast пакетов Eth_4" }, { - "id": "264", + "id": "2649", "title": "Количество иcходящих Multiicast пакетов Eth_4" }, { - "id": "265", + "id": "2659", "title": "Количество входящих Broadcast пакетов Eth_4" }, { - "id": "266", + "id": "2669", "title": "Количество иcходящих Broadcast пакетов Eth_4" }, { - "id": "267", + "id": "2679", "title": "Количество входящих Unicast пакетов Eth_4" }, { - "id": "268", + "id": "2689", "title": "Количество иcходящих Unicast пакетов Eth_4" }, { - "id": "269", + "id": "2699", "title": "Количество входящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "270", + "id": "2709", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "271", + "id": "2719", "title": "Количество входящих пакетов с ошибкой Eth_4" }, { - "id": "272", + "id": "2729", "title": "Количество исходящих пакетов с ошибкой Eth_4" }, { - "id": "273", + "id": "2739", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_4" } ] @@ -1954,384 +1954,384 @@ }, { "title": "Сервер Управления", - "id": "media_server_2", + "id": "media_server_29", "items": [ { - "id": "18", + "id": "18391", "title": "Graviton S2082I (device$18)", "items": [ { - "id": "4", + "id": "4391", "title": "OS Linux (module$4) АО", "items": [ { - "id": "190", + "id": "19091", "title": "Загрузка процессора за 1 минуту" }, { - "id": "191", + "id": "19191", "title": "Загрузка процессора за 5 минут" }, { - "id": "192", + "id": "19291", "title": "Загрузка процессора за 15 минут" }, { - "id": "197", + "id": "19791", "title": "Общий объем SWAP-файла" }, { - "id": "198", + "id": "19891", "title": "Используемый объем SWAP-файла" }, { - "id": "199", + "id": "19991", "title": "Общий объем физической оперативной памяти" }, { - "id": "200", + "id": "20091", "title": "Доступный объем физической оперативной памяти" }, { - "id": "201", + "id": "20191", "title": "Свободный объем физической и виртуальной оперативной памяти" }, { - "id": "202", + "id": "20291", "title": "Буферизованный объем оперативной памяти" }, { - "id": "203", + "id": "20391", "title": "Кэшированый объем оперативной памяти" }, { - "id": "274", + "id": "27491", "title": "Используемый объем SWAP-файла" }, { - "id": "275", + "id": "27591", "title": "Время затраченное процессором на процессы с пониженным приоритетом" }, { - "id": "276", + "id": "27691", "title": "Время затраченное процессором на процессы ядра ОС" }, { - "id": "277", + "id": "27791", "title": "Время простоя процессора" }, { - "id": "278", + "id": "27891", "title": "Общая емкость жестких дисков" }, { - "id": "279", + "id": "27991", "title": "Доступная емкость жестких дисков" } ] }, { - "id": "5", + "id": "591", "title": "Vinteo (module$5) ПО", "items": [ { - "id": "31", + "id": "3191", "title": "Общее количество участников" }, { - "id": "32", + "id": "3291", "title": "Ожидание соединения" }, { - "id": "33", + "id": "3391", "title": "Зарегистрированные абоненты" }, { - "id": "34", + "id": "3491", "title": "Количество пользоватей HLS" }, { - "id": "35", + "id": "3591", "title": "Общее количество P2P комнат" }, { - "id": "36", + "id": "3691", "title": "Общее количество конференций" }, { - "id": "37", + "id": "3791", "title": "Общее количество активных конференций" }, { - "id": "38", + "id": "3891", "title": "Статус записи" }, { - "id": "39", + "id": "3991", "title": "Общее количество сохранённых записей" } ] }, { - "id": "280", + "id": "28091", "title": "Сетевой адаптер №1 (port$261) Eth_1", "items": [ { - "id": "207", + "id": "20791", "title": "Скорость порта Eth_1" }, { - "id": "209", + "id": "20991", "title": "Административное состояние порта Eth_1" }, { - "id": "210", + "id": "21091", "title": "Оперативное состояние порта Eth_1" }, { - "id": "211", + "id": "21191", "title": "Общее количество отправленных октетов Eth_1" }, { - "id": "212", + "id": "21291", "title": "Количество входящих Multicast пакетов Eth_1" }, { - "id": "213", + "id": "21391", "title": "Количество иcходящих Multiicast пакетов Eth_1" }, { - "id": "214", + "id": "21491", "title": "Количество входящих Broadcast пакетов Eth_1" }, { - "id": "215", + "id": "21591", "title": "Количество иcходящих Broadcast пакетов Eth_1" }, { - "id": "216", + "id": "21691", "title": "Количество входящих Unicast пакетов Eth_1" }, { - "id": "217", + "id": "21791", "title": "Количество иcходящих Unicast пакетов Eth_1" }, { - "id": "218", + "id": "21891", "title": "Количество входящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "219", + "id": "21991", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "220", + "id": "22091", "title": "Количество входящих пакетов с ошибкой Eth_1" }, { - "id": "221", + "id": "22191", "title": "Количество исходящих пакетов с ошибкой Eth_1" }, { - "id": "222", + "id": "22291", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_1" } ] }, { - "id": "281", + "id": "28191", "title": "Сетевой адаптер №2 (port$262) Eth_2", "items": [ { - "id": "224", + "id": "22491", "title": "Скорость порта Eth_2" }, { - "id": "226", + "id": "22691", "title": "Административное состояние порта Eth_2" }, { - "id": "227", + "id": "22791", "title": "Оперативное состояние порта Eth_2" }, { - "id": "228", + "id": "22891", "title": "Общее количество отправленных октетов Eth_2" }, { - "id": "229", + "id": "22991", "title": "Количество входящих Multicast пакетов Eth_2" }, { - "id": "230", + "id": "23091", "title": "Количество иcходящих Multiicast пакетов Eth_2" }, { - "id": "231", + "id": "23191", "title": "Количество входящих Broadcast пакетов Eth_2" }, { - "id": "232", + "id": "23291", "title": "Количество иcходящих Broadcast пакетов Eth_2" }, { - "id": "233", + "id": "23391", "title": "Количество входящих Unicast пакетов Eth_2" }, { - "id": "234", + "id": "23491", "title": "Количество иcходящих Unicast пакетов Eth_2" }, { - "id": "235", + "id": "23591", "title": "Количество входящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "236", + "id": "23691", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "237", + "id": "23791", "title": "Количество входящих пакетов с ошибкой Eth_2" }, { - "id": "238", + "id": "23891", "title": "Количество исходящих пакетов с ошибкой Eth_2" }, { - "id": "239", + "id": "23991", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_2" } ] }, { - "id": "282", + "id": "28291", "title": "Сетевой адаптер №3 (port$263) Eth_3", "items": [ { - "id": "241", + "id": "24191", "title": "Скорость порта Eth_3" }, { - "id": "243", + "id": "24391", "title": "Административное состояние порта Eth_3" }, { - "id": "244", + "id": "24491", "title": "Оперативное состояние порта Eth_3" }, { - "id": "245", + "id": "24591", "title": "Общее количество отправленных октетов Eth_3" }, { - "id": "246", + "id": "24691", "title": "Количество входящих Multicast пакетов Eth_3" }, { - "id": "247", + "id": "24791", "title": "Количество иcходящих Multiicast пакетов Eth_3" }, { - "id": "248", + "id": "24891", "title": "Количество входящих Broadcast пакетов Eth_3" }, { - "id": "249", + "id": "24991", "title": "Количество иcходящих Broadcast пакетов Eth_3" }, { - "id": "250", + "id": "25091", "title": "Количество входящих Unicast пакетов Eth_3" }, { - "id": "251", + "id": "25191", "title": "Количество иcходящих Unicast пакетов Eth_3" }, { - "id": "252", + "id": "25291", "title": "Количество входящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "253", + "id": "25391", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "254", + "id": "25491", "title": "Количество входящих пакетов с ошибкой Eth_3" }, { - "id": "255", + "id": "25591", "title": "Количество исходящих пакетов с ошибкой Eth_3" }, { - "id": "256", + "id": "25691", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_3" } ] }, { - "id": "283", + "id": "28391", "title": "Сетевой адаптер №4 (port$264) Eth_4", "items": [ { - "id": "258", + "id": "25891", "title": "Скорость порта Eth_4" }, { - "id": "260", + "id": "26091", "title": "Административное состояние порта Eth_4" }, { - "id": "261", + "id": "26191", "title": "Оперативное состояние порта Eth_4" }, { - "id": "262", + "id": "26291", "title": "Общее количество отправленных октетов Eth_4" }, { - "id": "263", + "id": "26391", "title": "Количество входящих Multicast пакетов Eth_4" }, { - "id": "264", + "id": "26491", "title": "Количество иcходящих Multiicast пакетов Eth_4" }, { - "id": "265", + "id": "26591", "title": "Количество входящих Broadcast пакетов Eth_4" }, { - "id": "266", + "id": "26691", "title": "Количество иcходящих Broadcast пакетов Eth_4" }, { - "id": "267", + "id": "26791", "title": "Количество входящих Unicast пакетов Eth_4" }, { - "id": "268", + "id": "26891", "title": "Количество иcходящих Unicast пакетов Eth_4" }, { - "id": "269", + "id": "26991", "title": "Количество входящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "270", + "id": "27091", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "271", + "id": "27191", "title": "Количество входящих пакетов с ошибкой Eth_4" }, { - "id": "272", + "id": "27291", "title": "Количество исходящих пакетов с ошибкой Eth_4" }, { - "id": "273", + "id": "27391", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_4" } ] @@ -2345,381 +2345,381 @@ "id": "media_server_3", "items": [ { - "id": "18", + "id": "1848", "title": "Graviton S2082I (device$18)", "items": [ { - "id": "4", + "id": "48", "title": "OS Linux (module$4) АО", "items": [ { - "id": "190", + "id": "1908", "title": "Загрузка процессора за 1 минуту" }, { - "id": "191", + "id": "1918", "title": "Загрузка процессора за 5 минут" }, { - "id": "192", + "id": "1928", "title": "Загрузка процессора за 15 минут" }, { - "id": "197", + "id": "1978", "title": "Общий объем SWAP-файла" }, { - "id": "198", + "id": "1988", "title": "Используемый объем SWAP-файла" }, { - "id": "199", + "id": "1998", "title": "Общий объем физической оперативной памяти" }, { - "id": "200", + "id": "2008", "title": "Доступный объем физической оперативной памяти" }, { - "id": "201", + "id": "2018", "title": "Свободный объем физической и виртуальной оперативной памяти" }, { - "id": "202", + "id": "2028", "title": "Буферизованный объем оперативной памяти" }, { - "id": "203", + "id": "2038", "title": "Кэшированый объем оперативной памяти" }, { - "id": "274", + "id": "2748", "title": "Используемый объем SWAP-файла" }, { - "id": "275", + "id": "2758", "title": "Время затраченное процессором на процессы с пониженным приоритетом" }, { - "id": "276", + "id": "2768", "title": "Время затраченное процессором на процессы ядра ОС" }, { - "id": "277", + "id": "2778", "title": "Время простоя процессора" }, { - "id": "278", + "id": "2788", "title": "Общая емкость жестких дисков" }, { - "id": "279", + "id": "2798", "title": "Доступная емкость жестких дисков" } ] }, { - "id": "5", + "id": "58", "title": "Vinteo (module$5) ПО", "items": [ { - "id": "31", + "id": "318", "title": "Общее количество участников" }, { - "id": "32", + "id": "328", "title": "Ожидание соединения" }, { - "id": "33", + "id": "338", "title": "Зарегистрированные абоненты" }, { - "id": "34", + "id": "348", "title": "Количество пользоватей HLS" }, { - "id": "35", + "id": "358", "title": "Общее количество P2P комнат" }, { - "id": "36", + "id": "368", "title": "Общее количество конференций" }, { - "id": "37", + "id": "378", "title": "Общее количество активных конференций" }, { - "id": "38", + "id": "388", "title": "Статус записи" }, { - "id": "39", + "id": "398", "title": "Общее количество сохранённых записей" } ] }, { - "id": "280", + "id": "2808", "title": "Сетевой адаптер №1 (port$261) Eth_1", "items": [ { - "id": "207", + "id": "2078", "title": "Скорость порта Eth_1" }, { - "id": "209", + "id": "2098", "title": "Административное состояние порта Eth_1" }, { - "id": "210", + "id": "2108", "title": "Оперативное состояние порта Eth_1" }, { - "id": "211", + "id": "2118", "title": "Общее количество отправленных октетов Eth_1" }, { - "id": "212", + "id": "2128", "title": "Количество входящих Multicast пакетов Eth_1" }, { - "id": "213", + "id": "2138", "title": "Количество иcходящих Multiicast пакетов Eth_1" }, { - "id": "214", + "id": "2148", "title": "Количество входящих Broadcast пакетов Eth_1" }, { - "id": "215", + "id": "2158", "title": "Количество иcходящих Broadcast пакетов Eth_1" }, { - "id": "216", + "id": "2168", "title": "Количество входящих Unicast пакетов Eth_1" }, { - "id": "217", + "id": "2178", "title": "Количество иcходящих Unicast пакетов Eth_1" }, { - "id": "218", + "id": "2188", "title": "Количество входящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "219", + "id": "2198", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "220", + "id": "2208", "title": "Количество входящих пакетов с ошибкой Eth_1" }, { - "id": "221", + "id": "2218", "title": "Количество исходящих пакетов с ошибкой Eth_1" }, { - "id": "222", + "id": "2228", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_1" } ] }, { - "id": "281", + "id": "2818", "title": "Сетевой адаптер №2 (port$262) Eth_2", "items": [ { - "id": "224", + "id": "2248", "title": "Скорость порта Eth_2" }, { - "id": "226", + "id": "2268", "title": "Административное состояние порта Eth_2" }, { - "id": "227", + "id": "2278", "title": "Оперативное состояние порта Eth_2" }, { - "id": "228", + "id": "2288", "title": "Общее количество отправленных октетов Eth_2" }, { - "id": "229", + "id": "2298", "title": "Количество входящих Multicast пакетов Eth_2" }, { - "id": "230", + "id": "2308", "title": "Количество иcходящих Multiicast пакетов Eth_2" }, { - "id": "231", + "id": "2318", "title": "Количество входящих Broadcast пакетов Eth_2" }, { - "id": "232", + "id": "2328", "title": "Количество иcходящих Broadcast пакетов Eth_2" }, { - "id": "233", + "id": "2338", "title": "Количество входящих Unicast пакетов Eth_2" }, { - "id": "234", + "id": "2348", "title": "Количество иcходящих Unicast пакетов Eth_2" }, { - "id": "235", + "id": "2358", "title": "Количество входящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "236", + "id": "2368", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "237", + "id": "2378", "title": "Количество входящих пакетов с ошибкой Eth_2" }, { - "id": "238", + "id": "2388", "title": "Количество исходящих пакетов с ошибкой Eth_2" }, { - "id": "239", + "id": "2398", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_2" } ] }, { - "id": "282", + "id": "2828", "title": "Сетевой адаптер №3 (port$263) Eth_3", "items": [ { - "id": "241", + "id": "2418", "title": "Скорость порта Eth_3" }, { - "id": "243", + "id": "2438", "title": "Административное состояние порта Eth_3" }, { - "id": "244", + "id": "2448", "title": "Оперативное состояние порта Eth_3" }, { - "id": "245", + "id": "2458", "title": "Общее количество отправленных октетов Eth_3" }, { - "id": "246", + "id": "2468", "title": "Количество входящих Multicast пакетов Eth_3" }, { - "id": "247", + "id": "2478", "title": "Количество иcходящих Multiicast пакетов Eth_3" }, { - "id": "248", + "id": "2488", "title": "Количество входящих Broadcast пакетов Eth_3" }, { - "id": "249", + "id": "2498", "title": "Количество иcходящих Broadcast пакетов Eth_3" }, { - "id": "250", + "id": "2508", "title": "Количество входящих Unicast пакетов Eth_3" }, { - "id": "251", + "id": "2518", "title": "Количество иcходящих Unicast пакетов Eth_3" }, { - "id": "252", + "id": "2528", "title": "Количество входящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "253", + "id": "2538", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "254", + "id": "2548", "title": "Количество входящих пакетов с ошибкой Eth_3" }, { - "id": "255", + "id": "2558", "title": "Количество исходящих пакетов с ошибкой Eth_3" }, { - "id": "256", + "id": "2568", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_3" } ] }, { - "id": "283", + "id": "2838", "title": "Сетевой адаптер №4 (port$264) Eth_4", "items": [ { - "id": "258", + "id": "2588", "title": "Скорость порта Eth_4" }, { - "id": "260", + "id": "2608", "title": "Административное состояние порта Eth_4" }, { - "id": "261", + "id": "2618", "title": "Оперативное состояние порта Eth_4" }, { - "id": "262", + "id": "2628", "title": "Общее количество отправленных октетов Eth_4" }, { - "id": "263", + "id": "2638", "title": "Количество входящих Multicast пакетов Eth_4" }, { - "id": "264", + "id": "2648", "title": "Количество иcходящих Multiicast пакетов Eth_4" }, { - "id": "265", + "id": "2658", "title": "Количество входящих Broadcast пакетов Eth_4" }, { - "id": "266", + "id": "2668", "title": "Количество иcходящих Broadcast пакетов Eth_4" }, { - "id": "267", + "id": "2678", "title": "Количество входящих Unicast пакетов Eth_4" }, { - "id": "268", + "id": "2688", "title": "Количество иcходящих Unicast пакетов Eth_4" }, { - "id": "269", + "id": "2698", "title": "Количество входящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "270", + "id": "2708", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "271", + "id": "2718", "title": "Количество входящих пакетов с ошибкой Eth_4" }, { - "id": "272", + "id": "2728", "title": "Количество исходящих пакетов с ошибкой Eth_4" }, { - "id": "273", + "id": "2738", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_4" } ] @@ -2736,384 +2736,384 @@ "items": [ { "title": "Резервное копирование данных", - "id": "media_server_1", + "id": "media_server_13", "items": [ { - "id": "18", + "id": "185", "title": "Graviton S2082I (device$18)", "items": [ { - "id": "4", + "id": "45", "title": "OS Linux (module$4) АО", "items": [ { - "id": "190", + "id": "1905", "title": "Загрузка процессора за 1 минуту" }, { - "id": "191", + "id": "1915", "title": "Загрузка процессора за 5 минут" }, { - "id": "192", + "id": "1925", "title": "Загрузка процессора за 15 минут" }, { - "id": "197", + "id": "1975", "title": "Общий объем SWAP-файла" }, { - "id": "198", + "id": "1985", "title": "Используемый объем SWAP-файла" }, { - "id": "199", + "id": "1995", "title": "Общий объем физической оперативной памяти" }, { - "id": "200", + "id": "2005", "title": "Доступный объем физической оперативной памяти" }, { - "id": "201", + "id": "2015", "title": "Свободный объем физической и виртуальной оперативной памяти" }, { - "id": "202", + "id": "2025", "title": "Буферизованный объем оперативной памяти" }, { - "id": "203", + "id": "2035", "title": "Кэшированый объем оперативной памяти" }, { - "id": "274", + "id": "2745", "title": "Используемый объем SWAP-файла" }, { - "id": "275", + "id": "2755", "title": "Время затраченное процессором на процессы с пониженным приоритетом" }, { - "id": "276", + "id": "2765", "title": "Время затраченное процессором на процессы ядра ОС" }, { - "id": "277", + "id": "2775", "title": "Время простоя процессора" }, { - "id": "278", + "id": "2785", "title": "Общая емкость жестких дисков" }, { - "id": "279", + "id": "2795", "title": "Доступная емкость жестких дисков" } ] }, { - "id": "5", + "id": "55", "title": "Vinteo (module$5) ПО", "items": [ { - "id": "31", + "id": "315", "title": "Общее количество участников" }, { - "id": "32", + "id": "325", "title": "Ожидание соединения" }, { - "id": "33", + "id": "335", "title": "Зарегистрированные абоненты" }, { - "id": "34", + "id": "345", "title": "Количество пользоватей HLS" }, { - "id": "35", + "id": "355", "title": "Общее количество P2P комнат" }, { - "id": "36", + "id": "365", "title": "Общее количество конференций" }, { - "id": "37", + "id": "375", "title": "Общее количество активных конференций" }, { - "id": "38", + "id": "385", "title": "Статус записи" }, { - "id": "39", + "id": "395", "title": "Общее количество сохранённых записей" } ] }, { - "id": "280", + "id": "2805", "title": "Сетевой адаптер №1 (port$261) Eth_1", "items": [ { - "id": "207", + "id": "2075", "title": "Скорость порта Eth_1" }, { - "id": "209", + "id": "2095", "title": "Административное состояние порта Eth_1" }, { - "id": "210", + "id": "2105", "title": "Оперативное состояние порта Eth_1" }, { - "id": "211", + "id": "2115", "title": "Общее количество отправленных октетов Eth_1" }, { - "id": "212", + "id": "2125", "title": "Количество входящих Multicast пакетов Eth_1" }, { - "id": "213", + "id": "2135", "title": "Количество иcходящих Multiicast пакетов Eth_1" }, { - "id": "214", + "id": "2145", "title": "Количество входящих Broadcast пакетов Eth_1" }, { - "id": "215", + "id": "2155", "title": "Количество иcходящих Broadcast пакетов Eth_1" }, { - "id": "216", + "id": "2165", "title": "Количество входящих Unicast пакетов Eth_1" }, { - "id": "217", + "id": "2175", "title": "Количество иcходящих Unicast пакетов Eth_1" }, { - "id": "218", + "id": "2185", "title": "Количество входящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "219", + "id": "2195", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "220", + "id": "2205", "title": "Количество входящих пакетов с ошибкой Eth_1" }, { - "id": "221", + "id": "2215", "title": "Количество исходящих пакетов с ошибкой Eth_1" }, { - "id": "222", + "id": "2225", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_1" } ] }, { - "id": "281", + "id": "2815", "title": "Сетевой адаптер №2 (port$262) Eth_2", "items": [ { - "id": "224", + "id": "2245", "title": "Скорость порта Eth_2" }, { - "id": "226", + "id": "2265", "title": "Административное состояние порта Eth_2" }, { - "id": "227", + "id": "2275", "title": "Оперативное состояние порта Eth_2" }, { - "id": "228", + "id": "2285", "title": "Общее количество отправленных октетов Eth_2" }, { - "id": "229", + "id": "2295", "title": "Количество входящих Multicast пакетов Eth_2" }, { - "id": "230", + "id": "2305", "title": "Количество иcходящих Multiicast пакетов Eth_2" }, { - "id": "231", + "id": "2315", "title": "Количество входящих Broadcast пакетов Eth_2" }, { - "id": "232", + "id": "2325", "title": "Количество иcходящих Broadcast пакетов Eth_2" }, { - "id": "233", + "id": "2335", "title": "Количество входящих Unicast пакетов Eth_2" }, { - "id": "234", + "id": "2345", "title": "Количество иcходящих Unicast пакетов Eth_2" }, { - "id": "235", + "id": "2355", "title": "Количество входящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "236", + "id": "2365", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "237", + "id": "2375", "title": "Количество входящих пакетов с ошибкой Eth_2" }, { - "id": "238", + "id": "2385", "title": "Количество исходящих пакетов с ошибкой Eth_2" }, { - "id": "239", + "id": "2395", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_2" } ] }, { - "id": "282", + "id": "2825", "title": "Сетевой адаптер №3 (port$263) Eth_3", "items": [ { - "id": "241", + "id": "2415", "title": "Скорость порта Eth_3" }, { - "id": "243", + "id": "2435", "title": "Административное состояние порта Eth_3" }, { - "id": "244", + "id": "2445", "title": "Оперативное состояние порта Eth_3" }, { - "id": "245", + "id": "2455", "title": "Общее количество отправленных октетов Eth_3" }, { - "id": "246", + "id": "2465", "title": "Количество входящих Multicast пакетов Eth_3" }, { - "id": "247", + "id": "2475", "title": "Количество иcходящих Multiicast пакетов Eth_3" }, { - "id": "248", + "id": "2485", "title": "Количество входящих Broadcast пакетов Eth_3" }, { - "id": "249", + "id": "2495", "title": "Количество иcходящих Broadcast пакетов Eth_3" }, { - "id": "250", + "id": "2505", "title": "Количество входящих Unicast пакетов Eth_3" }, { - "id": "251", + "id": "2515", "title": "Количество иcходящих Unicast пакетов Eth_3" }, { - "id": "252", + "id": "2525", "title": "Количество входящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "253", + "id": "2535", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "254", + "id": "2545", "title": "Количество входящих пакетов с ошибкой Eth_3" }, { - "id": "255", + "id": "2555", "title": "Количество исходящих пакетов с ошибкой Eth_3" }, { - "id": "256", + "id": "2565", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_3" } ] }, { - "id": "283", + "id": "2835", "title": "Сетевой адаптер №4 (port$264) Eth_4", "items": [ { - "id": "258", + "id": "2585", "title": "Скорость порта Eth_4" }, { - "id": "260", + "id": "2605", "title": "Административное состояние порта Eth_4" }, { - "id": "261", + "id": "2615", "title": "Оперативное состояние порта Eth_4" }, { - "id": "262", + "id": "2625", "title": "Общее количество отправленных октетов Eth_4" }, { - "id": "263", + "id": "2635", "title": "Количество входящих Multicast пакетов Eth_4" }, { - "id": "264", + "id": "2645", "title": "Количество иcходящих Multiicast пакетов Eth_4" }, { - "id": "265", + "id": "2655", "title": "Количество входящих Broadcast пакетов Eth_4" }, { - "id": "266", + "id": "2665", "title": "Количество иcходящих Broadcast пакетов Eth_4" }, { - "id": "267", + "id": "2675", "title": "Количество входящих Unicast пакетов Eth_4" }, { - "id": "268", + "id": "2685", "title": "Количество иcходящих Unicast пакетов Eth_4" }, { - "id": "269", + "id": "2695", "title": "Количество входящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "270", + "id": "2705", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "271", + "id": "2715", "title": "Количество входящих пакетов с ошибкой Eth_4" }, { - "id": "272", + "id": "2725", "title": "Количество исходящих пакетов с ошибкой Eth_4" }, { - "id": "273", + "id": "2735", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_4" } ] @@ -3124,384 +3124,384 @@ }, { "title": "Восстановление данных", - "id": "media_server_2", + "id": "media_server_26", "items": [ { - "id": "18", + "id": "186", "title": "Graviton S2082I (device$18)", "items": [ { - "id": "4", + "id": "46", "title": "OS Linux (module$4) АО", "items": [ { - "id": "190", + "id": "1906", "title": "Загрузка процессора за 1 минуту" }, { - "id": "191", + "id": "1916", "title": "Загрузка процессора за 5 минут" }, { - "id": "192", + "id": "1926", "title": "Загрузка процессора за 15 минут" }, { - "id": "197", + "id": "1976", "title": "Общий объем SWAP-файла" }, { - "id": "198", + "id": "1986", "title": "Используемый объем SWAP-файла" }, { - "id": "199", + "id": "1996", "title": "Общий объем физической оперативной памяти" }, { - "id": "200", + "id": "2006", "title": "Доступный объем физической оперативной памяти" }, { - "id": "201", + "id": "2016", "title": "Свободный объем физической и виртуальной оперативной памяти" }, { - "id": "202", + "id": "2026", "title": "Буферизованный объем оперативной памяти" }, { - "id": "203", + "id": "2036", "title": "Кэшированый объем оперативной памяти" }, { - "id": "274", + "id": "2746", "title": "Используемый объем SWAP-файла" }, { - "id": "275", + "id": "2756", "title": "Время затраченное процессором на процессы с пониженным приоритетом" }, { - "id": "276", + "id": "2766", "title": "Время затраченное процессором на процессы ядра ОС" }, { - "id": "277", + "id": "2776", "title": "Время простоя процессора" }, { - "id": "278", + "id": "2786", "title": "Общая емкость жестких дисков" }, { - "id": "279", + "id": "2796", "title": "Доступная емкость жестких дисков" } ] }, { - "id": "5", + "id": "56", "title": "Vinteo (module$5) ПО", "items": [ { - "id": "31", + "id": "316", "title": "Общее количество участников" }, { - "id": "32", + "id": "326", "title": "Ожидание соединения" }, { - "id": "33", + "id": "336", "title": "Зарегистрированные абоненты" }, { - "id": "34", + "id": "346", "title": "Количество пользоватей HLS" }, { - "id": "35", + "id": "356", "title": "Общее количество P2P комнат" }, { - "id": "36", + "id": "366", "title": "Общее количество конференций" }, { - "id": "37", + "id": "376", "title": "Общее количество активных конференций" }, { - "id": "38", + "id": "386", "title": "Статус записи" }, { - "id": "39", + "id": "396", "title": "Общее количество сохранённых записей" } ] }, { - "id": "280", + "id": "2806", "title": "Сетевой адаптер №1 (port$261) Eth_1", "items": [ { - "id": "207", + "id": "2076", "title": "Скорость порта Eth_1" }, { - "id": "209", + "id": "2096", "title": "Административное состояние порта Eth_1" }, { - "id": "210", + "id": "2106", "title": "Оперативное состояние порта Eth_1" }, { - "id": "211", + "id": "2116", "title": "Общее количество отправленных октетов Eth_1" }, { - "id": "212", + "id": "2126", "title": "Количество входящих Multicast пакетов Eth_1" }, { - "id": "213", + "id": "2136", "title": "Количество иcходящих Multiicast пакетов Eth_1" }, { - "id": "214", + "id": "2146", "title": "Количество входящих Broadcast пакетов Eth_1" }, { - "id": "215", + "id": "2156", "title": "Количество иcходящих Broadcast пакетов Eth_1" }, { - "id": "216", + "id": "2166", "title": "Количество входящих Unicast пакетов Eth_1" }, { - "id": "217", + "id": "2176", "title": "Количество иcходящих Unicast пакетов Eth_1" }, { - "id": "218", + "id": "2186", "title": "Количество входящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "219", + "id": "2196", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "220", + "id": "2206", "title": "Количество входящих пакетов с ошибкой Eth_1" }, { - "id": "221", + "id": "2216", "title": "Количество исходящих пакетов с ошибкой Eth_1" }, { - "id": "222", + "id": "2226", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_1" } ] }, { - "id": "281", + "id": "2816", "title": "Сетевой адаптер №2 (port$262) Eth_2", "items": [ { - "id": "224", + "id": "2246", "title": "Скорость порта Eth_2" }, { - "id": "226", + "id": "2266", "title": "Административное состояние порта Eth_2" }, { - "id": "227", + "id": "2276", "title": "Оперативное состояние порта Eth_2" }, { - "id": "228", + "id": "2286", "title": "Общее количество отправленных октетов Eth_2" }, { - "id": "229", + "id": "2296", "title": "Количество входящих Multicast пакетов Eth_2" }, { - "id": "230", + "id": "2306", "title": "Количество иcходящих Multiicast пакетов Eth_2" }, { - "id": "231", + "id": "2316", "title": "Количество входящих Broadcast пакетов Eth_2" }, { - "id": "232", + "id": "2326", "title": "Количество иcходящих Broadcast пакетов Eth_2" }, { - "id": "233", + "id": "2336", "title": "Количество входящих Unicast пакетов Eth_2" }, { - "id": "234", + "id": "2346", "title": "Количество иcходящих Unicast пакетов Eth_2" }, { - "id": "235", + "id": "2356", "title": "Количество входящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "236", + "id": "2366", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "237", + "id": "2376", "title": "Количество входящих пакетов с ошибкой Eth_2" }, { - "id": "238", + "id": "2386", "title": "Количество исходящих пакетов с ошибкой Eth_2" }, { - "id": "239", + "id": "2396", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_2" } ] }, { - "id": "282", + "id": "2826", "title": "Сетевой адаптер №3 (port$263) Eth_3", "items": [ { - "id": "241", + "id": "2416", "title": "Скорость порта Eth_3" }, { - "id": "243", + "id": "2436", "title": "Административное состояние порта Eth_3" }, { - "id": "244", + "id": "2446", "title": "Оперативное состояние порта Eth_3" }, { - "id": "245", + "id": "2456", "title": "Общее количество отправленных октетов Eth_3" }, { - "id": "246", + "id": "2466", "title": "Количество входящих Multicast пакетов Eth_3" }, { - "id": "247", + "id": "2476", "title": "Количество иcходящих Multiicast пакетов Eth_3" }, { - "id": "248", + "id": "2486", "title": "Количество входящих Broadcast пакетов Eth_3" }, { - "id": "249", + "id": "2496", "title": "Количество иcходящих Broadcast пакетов Eth_3" }, { - "id": "250", + "id": "2506", "title": "Количество входящих Unicast пакетов Eth_3" }, { - "id": "251", + "id": "2516", "title": "Количество иcходящих Unicast пакетов Eth_3" }, { - "id": "252", + "id": "2526", "title": "Количество входящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "253", + "id": "2536", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "254", + "id": "2546", "title": "Количество входящих пакетов с ошибкой Eth_3" }, { - "id": "255", + "id": "2556", "title": "Количество исходящих пакетов с ошибкой Eth_3" }, { - "id": "256", + "id": "2566", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_3" } ] }, { - "id": "283", + "id": "2836", "title": "Сетевой адаптер №4 (port$264) Eth_4", "items": [ { - "id": "258", + "id": "2586", "title": "Скорость порта Eth_4" }, { - "id": "260", + "id": "2606", "title": "Административное состояние порта Eth_4" }, { - "id": "261", + "id": "2616", "title": "Оперативное состояние порта Eth_4" }, { - "id": "262", + "id": "2626", "title": "Общее количество отправленных октетов Eth_4" }, { - "id": "263", + "id": "2636", "title": "Количество входящих Multicast пакетов Eth_4" }, { - "id": "264", + "id": "2646", "title": "Количество иcходящих Multiicast пакетов Eth_4" }, { - "id": "265", + "id": "2656", "title": "Количество входящих Broadcast пакетов Eth_4" }, { - "id": "266", + "id": "2666", "title": "Количество иcходящих Broadcast пакетов Eth_4" }, { - "id": "267", + "id": "2676", "title": "Количество входящих Unicast пакетов Eth_4" }, { - "id": "268", + "id": "2686", "title": "Количество иcходящих Unicast пакетов Eth_4" }, { - "id": "269", + "id": "2696", "title": "Количество входящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "270", + "id": "2706", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "271", + "id": "2716", "title": "Количество входящих пакетов с ошибкой Eth_4" }, { - "id": "272", + "id": "2726", "title": "Количество исходящих пакетов с ошибкой Eth_4" }, { - "id": "273", + "id": "2736", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_4" } ] @@ -3512,384 +3512,384 @@ }, { "title": "Настройка расписания", - "id": "media_server_3", + "id": "media_server_36", "items": [ { - "id": "18", + "id": "187", "title": "Graviton S2082I (device$18)", "items": [ { - "id": "4", + "id": "47", "title": "OS Linux (module$4) АО", "items": [ { - "id": "190", + "id": "1907", "title": "Загрузка процессора за 1 минуту" }, { - "id": "191", + "id": "1917", "title": "Загрузка процессора за 5 минут" }, { - "id": "192", + "id": "1927", "title": "Загрузка процессора за 15 минут" }, { - "id": "197", + "id": "1977", "title": "Общий объем SWAP-файла" }, { - "id": "198", + "id": "1987", "title": "Используемый объем SWAP-файла" }, { - "id": "199", + "id": "1997", "title": "Общий объем физической оперативной памяти" }, { - "id": "200", + "id": "2007", "title": "Доступный объем физической оперативной памяти" }, { - "id": "201", + "id": "2017", "title": "Свободный объем физической и виртуальной оперативной памяти" }, { - "id": "202", + "id": "2027", "title": "Буферизованный объем оперативной памяти" }, { - "id": "203", + "id": "2037", "title": "Кэшированый объем оперативной памяти" }, { - "id": "274", + "id": "2747", "title": "Используемый объем SWAP-файла" }, { - "id": "275", + "id": "2757", "title": "Время затраченное процессором на процессы с пониженным приоритетом" }, { - "id": "276", + "id": "2767", "title": "Время затраченное процессором на процессы ядра ОС" }, { - "id": "277", + "id": "2777", "title": "Время простоя процессора" }, { - "id": "278", + "id": "2787", "title": "Общая емкость жестких дисков" }, { - "id": "279", + "id": "2797", "title": "Доступная емкость жестких дисков" } ] }, { - "id": "5", + "id": "57", "title": "Vinteo (module$5) ПО", "items": [ { - "id": "31", + "id": "317", "title": "Общее количество участников" }, { - "id": "32", + "id": "327", "title": "Ожидание соединения" }, { - "id": "33", + "id": "337", "title": "Зарегистрированные абоненты" }, { - "id": "34", + "id": "347", "title": "Количество пользоватей HLS" }, { - "id": "35", + "id": "357", "title": "Общее количество P2P комнат" }, { - "id": "36", + "id": "367", "title": "Общее количество конференций" }, { - "id": "37", + "id": "377", "title": "Общее количество активных конференций" }, { - "id": "38", + "id": "387", "title": "Статус записи" }, { - "id": "39", + "id": "397", "title": "Общее количество сохранённых записей" } ] }, { - "id": "280", + "id": "2807", "title": "Сетевой адаптер №1 (port$261) Eth_1", "items": [ { - "id": "207", + "id": "2077", "title": "Скорость порта Eth_1" }, { - "id": "209", + "id": "2097", "title": "Административное состояние порта Eth_1" }, { - "id": "210", + "id": "2107", "title": "Оперативное состояние порта Eth_1" }, { - "id": "211", + "id": "2117", "title": "Общее количество отправленных октетов Eth_1" }, { - "id": "212", + "id": "2127", "title": "Количество входящих Multicast пакетов Eth_1" }, { - "id": "213", + "id": "2137", "title": "Количество иcходящих Multiicast пакетов Eth_1" }, { - "id": "214", + "id": "2147", "title": "Количество входящих Broadcast пакетов Eth_1" }, { - "id": "215", + "id": "2157", "title": "Количество иcходящих Broadcast пакетов Eth_1" }, { - "id": "216", + "id": "2167", "title": "Количество входящих Unicast пакетов Eth_1" }, { - "id": "217", + "id": "2177", "title": "Количество иcходящих Unicast пакетов Eth_1" }, { - "id": "218", + "id": "2187", "title": "Количество входящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "219", + "id": "2197", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_1" }, { - "id": "220", + "id": "2207", "title": "Количество входящих пакетов с ошибкой Eth_1" }, { - "id": "221", + "id": "2217", "title": "Количество исходящих пакетов с ошибкой Eth_1" }, { - "id": "222", + "id": "2227", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_1" } ] }, { - "id": "281", + "id": "2817", "title": "Сетевой адаптер №2 (port$262) Eth_2", "items": [ { - "id": "224", + "id": "2247", "title": "Скорость порта Eth_2" }, { - "id": "226", + "id": "2267", "title": "Административное состояние порта Eth_2" }, { - "id": "227", + "id": "2277", "title": "Оперативное состояние порта Eth_2" }, { - "id": "228", + "id": "2287", "title": "Общее количество отправленных октетов Eth_2" }, { - "id": "229", + "id": "2297", "title": "Количество входящих Multicast пакетов Eth_2" }, { - "id": "230", + "id": "2307", "title": "Количество иcходящих Multiicast пакетов Eth_2" }, { - "id": "231", + "id": "2317", "title": "Количество входящих Broadcast пакетов Eth_2" }, { - "id": "232", + "id": "2327", "title": "Количество иcходящих Broadcast пакетов Eth_2" }, { - "id": "233", + "id": "2337", "title": "Количество входящих Unicast пакетов Eth_2" }, { - "id": "234", + "id": "2347", "title": "Количество иcходящих Unicast пакетов Eth_2" }, { - "id": "235", + "id": "2357", "title": "Количество входящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "236", + "id": "2367", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_2" }, { - "id": "237", + "id": "2377", "title": "Количество входящих пакетов с ошибкой Eth_2" }, { - "id": "238", + "id": "2387", "title": "Количество исходящих пакетов с ошибкой Eth_2" }, { - "id": "239", + "id": "2397", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_2" } ] }, { - "id": "282", + "id": "2827", "title": "Сетевой адаптер №3 (port$263) Eth_3", "items": [ { - "id": "241", + "id": "2417", "title": "Скорость порта Eth_3" }, { - "id": "243", + "id": "2437", "title": "Административное состояние порта Eth_3" }, { - "id": "244", + "id": "2447", "title": "Оперативное состояние порта Eth_3" }, { - "id": "245", + "id": "2457", "title": "Общее количество отправленных октетов Eth_3" }, { - "id": "246", + "id": "2467", "title": "Количество входящих Multicast пакетов Eth_3" }, { - "id": "247", + "id": "2477", "title": "Количество иcходящих Multiicast пакетов Eth_3" }, { - "id": "248", + "id": "2487", "title": "Количество входящих Broadcast пакетов Eth_3" }, { - "id": "249", + "id": "2497", "title": "Количество иcходящих Broadcast пакетов Eth_3" }, { - "id": "250", + "id": "2507", "title": "Количество входящих Unicast пакетов Eth_3" }, { - "id": "251", + "id": "2517", "title": "Количество иcходящих Unicast пакетов Eth_3" }, { - "id": "252", + "id": "2527", "title": "Количество входящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "253", + "id": "2537", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_3" }, { - "id": "254", + "id": "2547", "title": "Количество входящих пакетов с ошибкой Eth_3" }, { - "id": "255", + "id": "2557", "title": "Количество исходящих пакетов с ошибкой Eth_3" }, { - "id": "256", + "id": "2567", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_3" } ] }, { - "id": "283", + "id": "2837", "title": "Сетевой адаптер №4 (port$264) Eth_4", "items": [ { - "id": "258", + "id": "2587", "title": "Скорость порта Eth_4" }, { - "id": "260", + "id": "2607", "title": "Административное состояние порта Eth_4" }, { - "id": "261", + "id": "2617", "title": "Оперативное состояние порта Eth_4" }, { - "id": "262", + "id": "2627", "title": "Общее количество отправленных октетов Eth_4" }, { - "id": "263", + "id": "2637", "title": "Количество входящих Multicast пакетов Eth_4" }, { - "id": "264", + "id": "2647", "title": "Количество иcходящих Multiicast пакетов Eth_4" }, { - "id": "265", + "id": "2657", "title": "Количество входящих Broadcast пакетов Eth_4" }, { - "id": "266", + "id": "2667", "title": "Количество иcходящих Broadcast пакетов Eth_4" }, { - "id": "267", + "id": "2677", "title": "Количество входящих Unicast пакетов Eth_4" }, { - "id": "268", + "id": "2687", "title": "Количество иcходящих Unicast пакетов Eth_4" }, { - "id": "269", + "id": "2697", "title": "Количество входящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "270", + "id": "2707", "title": "Количество иcходящих пакетов помеченные как отброшенные Eth_4" }, { - "id": "271", + "id": "2717", "title": "Количество входящих пакетов с ошибкой Eth_4" }, { - "id": "272", + "id": "2727", "title": "Количество исходящих пакетов с ошибкой Eth_4" }, { - "id": "273", + "id": "2737", "title": "Количество входящих пакетов с неизвестным или неподдерживаемым протоколом Eth_4" } ] diff --git a/src/Components/UI/TreeTable.jsx b/src/Components/UI/TreeTable.jsx index ddcb5a0..ab856cc 100755 --- a/src/Components/UI/TreeTable.jsx +++ b/src/Components/UI/TreeTable.jsx @@ -222,9 +222,13 @@ const TreeTable = ({ data }) => { {renderData(filteredData)} - + {isLogVisible && (

Лог статусов

diff --git a/src/Components/hooks/TabContent.jsx b/src/Components/hooks/TabContent.jsx index bd33c2c..5747736 100644 --- a/src/Components/hooks/TabContent.jsx +++ b/src/Components/hooks/TabContent.jsx @@ -1,6 +1,7 @@ import SystemStatusChart from "../../Charts/SystemStatusChart"; import TreeTable from "../UI/TreeTable"; import TreeChart from "../TreeChart/TreeChart"; +import FlowChart from "../TreeChart/FlowChart"; const TabContent = ({ activeTab, statusHistories, treeData1, tabContent, handleOpenTab }) => { if (activeTab === "Главная") { @@ -22,7 +23,7 @@ const TabContent = ({ activeTab, statusHistories, treeData1, tabContent, handleO
); } else if (activeTab === "Визуализация") { - return handleOpenTab(id, title)} />; + return handleOpenTab(id, title)} />; } else { const tabData = tabContent[activeTab]; return tabData ? tabData.content :

Нет данных

; diff --git a/src/Style/dark-theme.css b/src/Style/dark-theme.css index e1b5215..fc21f59 100644 --- a/src/Style/dark-theme.css +++ b/src/Style/dark-theme.css @@ -12,7 +12,7 @@ --modal-background: #2d2d2d; --modal--btn-background: #333333; --modal-text: #FFFFFF; - --table-border: #444444; + --table-border: #c70a0a; --table-header-background: #2d2d2d; --table-cell-background: #333333; --table-text-color: #E0E0E0; -- 2.40.1 From 2d714b598562245f5818ae847a5b7eb0489bdee9 Mon Sep 17 00:00:00 2001 From: DmitriyA Date: Tue, 25 Mar 2025 08:54:21 -0400 Subject: [PATCH 3/6] added the logo, refactored the graph --- package.json | 3 +- public/system_monitor_icon.svg | 26 +- src/App.jsx | 37 +- src/Components/Layout/Dashboard.jsx | 2 +- src/Components/TreeChart/FlowChart.jsx | 196 +++-------- .../FlowChartComponents/DataParser.jsx | 104 ++++++ .../FlowChartComponents/NodeWrapper.jsx | 26 ++ .../FlowChartComponents/nodeUtils.jsx | 3 + .../FlowChartComponents/useFlowChart.jsx | 46 +++ .../FlowChartComponents/useNodeHandlers.jsx | 24 ++ src/Components/TreeChart/TreeChart.jsx | 139 -------- .../TreeChart/TreeChartComponents/Label.jsx | 21 -- .../TreeChart/TreeChartComponents/Link.jsx | 16 - .../TreeChart/TreeChartComponents/Node.jsx | 19 -- .../TreeChartComponents/NodePosition.jsx | 30 -- src/Components/UI/LoginModal.jsx | 1 + src/Components/hooks/TabContent.jsx | 2 +- src/assets/images/logo.svg | 319 ++++++++++++++++++ vite.config.js | 8 +- 19 files changed, 625 insertions(+), 397 deletions(-) mode change 100755 => 100644 public/system_monitor_icon.svg create mode 100644 src/Components/TreeChart/FlowChartComponents/DataParser.jsx create mode 100644 src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx create mode 100644 src/Components/TreeChart/FlowChartComponents/nodeUtils.jsx create mode 100644 src/Components/TreeChart/FlowChartComponents/useFlowChart.jsx create mode 100644 src/Components/TreeChart/FlowChartComponents/useNodeHandlers.jsx delete mode 100755 src/Components/TreeChart/TreeChart.jsx delete mode 100644 src/Components/TreeChart/TreeChartComponents/Label.jsx delete mode 100644 src/Components/TreeChart/TreeChartComponents/Link.jsx delete mode 100644 src/Components/TreeChart/TreeChartComponents/Node.jsx delete mode 100644 src/Components/TreeChart/TreeChartComponents/NodePosition.jsx create mode 100644 src/assets/images/logo.svg diff --git a/package.json b/package.json index b6412fd..8c3fa88 100755 --- a/package.json +++ b/package.json @@ -24,7 +24,8 @@ "@emotion/styled": "^11.14.0", "@mui/material": "^6.4.7", "@mui/icons-material": "^6.4.8", - "reactflow": "^11.11.4" + "reactflow": "^11.11.4", + "vite-plugin-svgr": "^4.3.0" }, "devDependencies": { "@eslint/js": "^9.17.0", diff --git a/public/system_monitor_icon.svg b/public/system_monitor_icon.svg old mode 100755 new mode 100644 index be3a475..ba02f29 --- a/public/system_monitor_icon.svg +++ b/public/system_monitor_icon.svg @@ -1,15 +1,11 @@ - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + + diff --git a/src/App.jsx b/src/App.jsx index 2b0954c..b0345dd 100755 --- a/src/App.jsx +++ b/src/App.jsx @@ -3,7 +3,7 @@ import { ThemeProvider, CssBaseline, Switch, Box } from "@mui/material"; import Dashboard from "./Components/Layout/Dashboard"; import LoginModal from "./Components/UI/LoginModal"; import { lightTheme, darkTheme } from "./Style/theme"; -import "./Style/LoginModal.css"; +import Logo from './assets/images/logo.svg?react'; // Импорт как компонента function App() { const [isAuthenticated, setIsAuthenticated] = useState(false); @@ -23,9 +23,38 @@ function App() { {!isAuthenticated && showLoginModal ? ( - setShowLoginModal(false)} /> + <> + {/* Логотип */} + + + + + setShowLoginModal(false)} + /> + ) : ( - + setIsDarkMode((prev) => !prev)} /> @@ -36,4 +65,4 @@ function App() { ); } -export default App; +export default App; \ No newline at end of file diff --git a/src/Components/Layout/Dashboard.jsx b/src/Components/Layout/Dashboard.jsx index 1db005c..77b2715 100755 --- a/src/Components/Layout/Dashboard.jsx +++ b/src/Components/Layout/Dashboard.jsx @@ -59,7 +59,7 @@ const Dashboard = () => {
{/* Сайдбар */}
- +
diff --git a/src/Components/TreeChart/FlowChart.jsx b/src/Components/TreeChart/FlowChart.jsx index 63e3c85..082cdd6 100644 --- a/src/Components/TreeChart/FlowChart.jsx +++ b/src/Components/TreeChart/FlowChart.jsx @@ -1,170 +1,70 @@ -import React, { useCallback, useEffect, useState, useMemo } from 'react'; -import ReactFlow, { Controls, Background, useNodesState, useEdgesState } from 'reactflow'; +import React, { useEffect, useMemo } from 'react'; +import ReactFlow, { Controls, Background } from 'reactflow'; import 'reactflow/dist/style.css'; -import { statusManager1, getStatusColor } from './dataUtils'; +import { debounce } from 'lodash'; +import { useFlowChart } from './FlowChartComponents/useFlowChart'; +import { useNodeHandlers } from './FlowChartComponents/useNodeHandlers'; +import { useDataParser } from './FlowChartComponents/DataParser'; +import NodeWrapper from './FlowChartComponents/NodeWrapper'; // Исправленный импорт + +// Определяем кастомные типы узлов +const nodeTypes = { + customNode: NodeWrapper // Тип должен соответствовать тому, что вы указываете в parseData +}; const FlowChart = ({ data }) => { - const [nodes, setNodes, onNodesChange] = useNodesState([]); - const [edges, setEdges, onEdgesChange] = useEdgesState([]); - const [collapsedNodes, setCollapsedNodes] = useState(new Set()); // Состояние для свернутых узлов - const [nodePositions, setNodePositions] = useState({}); // Состояние для сохранения позиций узлов + const { + nodes, + edges, + nodePositions, + setNodes, + setEdges, + onNodesChange, + onEdgesChange, + setNodePositions, + collapsedNodes, + toggleNodeCollapse + } = useFlowChart(data); - // Обновление статусов - useEffect(() => { - const updateStatuses = (data) => { - statusManager1.updateStatuses(data); - }; + const { parseData } = useDataParser(nodePositions, collapsedNodes); - updateStatuses(data); // Обновляем статусы только при изменении данных - }, [data]); // Зависимость от data - - // Функция для построения радиального графа - const parseData = useCallback( - (data) => { - const nodes = []; - const edges = []; - - const centerX = 500; // Центр графа по X - const centerY = 400; // Центр графа по Y - const levelRadius = 150; // Расстояние между уровнями - - // Основная рекурсивная функция - const traverse = (item, parentId = null, level = 0, angleStart = 0, angleEnd = 2 * Math.PI) => { - const nodeId = item.id; - - // Угол узла на круге - const angle = (angleStart + angleEnd) / 2; // Угол для текущего узла - const nodeX = centerX + Math.cos(angle) * level * levelRadius; - const nodeY = centerY + Math.sin(angle) * level * levelRadius; - - // Используем сохраненную позицию, если она есть - const savedPosition = nodePositions[nodeId]; - const position = savedPosition || { x: nodeX, y: nodeY }; - - const node = { - id: nodeId, - position, - style: { - width: 50, - height: 50, - borderRadius: '50%', // Делаем круги - backgroundColor: getStatusColor(item.status), - display: 'flex', - alignItems: 'center', - justifyContent: 'center', - color: 'white', - border: '2px solid #fff', - }, - data: { label: item.title }, - }; - - nodes.push(node); - - // Создаем ребро к родителю - if (parentId) { - edges.push({ id: `${parentId}-${nodeId}`, source: parentId, target: nodeId }); - } - - // Дочерние узлы (если узел не свернут) - if (item.items && item.items.length > 0 && !collapsedNodes.has(nodeId)) { - const angleStep = (angleEnd - angleStart) / item.items.length; // Шаг угла для дочерних узлов - item.items.forEach((child, index) => { - // Равномерно распределяем дочерние узлы вокруг родителя - traverse( - child, - nodeId, - level + 1, - angleStart + index * angleStep, // Начальный угол для дочернего узла - angleStart + (index + 1) * angleStep // Конечный угол для дочернего узла - ); - }); - } - }; - - // Начинаем с центрального узла - const centerNode = { - id: data.id, - position: { x: centerX, y: centerY }, - style: { - width: 50, - height: 50, - borderRadius: '50%', - backgroundColor: getStatusColor(data.status), - display: 'flex', - alignItems: 'center', - justifyContent: 'center', - color: 'white', - border: '2px solid #fff', - }, - data: { label: data.title }, - }; - - nodes.push(centerNode); - - // Обрабатываем дочерние узлы центрального узла - if (data.items && data.items.length > 0 && !collapsedNodes.has(data.id)) { - const angleStep = (2 * Math.PI) / data.items.length; // Равномерно распределяем вокруг центра - data.items.forEach((child, index) => { - traverse( - child, - data.id, - 1, // Уровень 1 (первый круг вокруг центра) - index * angleStep, // Начальный угол - (index + 1) * angleStep // Конечный угол - ); - }); - } - - return { nodes, edges }; - }, - [collapsedNodes, nodePositions] // Зависимость от collapsedNodes и nodePositions + const debouncedSetNodePositions = useMemo( + () => debounce(setNodePositions, 100), + [setNodePositions] ); - // Обработчик клика по узлу - const onNodeClick = useCallback( - (event, node) => { - const nodeId = node.id; - const newCollapsedNodes = new Set(collapsedNodes); + const { onNodeDrag, onNodeDragStop } = useNodeHandlers(debouncedSetNodePositions); - if (newCollapsedNodes.has(nodeId)) { - newCollapsedNodes.delete(nodeId); // Разворачиваем узел - } else { - newCollapsedNodes.add(nodeId); // Сворачиваем узел - } - - setCollapsedNodes(newCollapsedNodes); // Обновляем состояние - }, - [collapsedNodes] - ); - - // Обработчик завершения перетаскивания узла - const onNodeDragStop = useCallback( - (event, node) => { - // Сохраняем новую позицию узла - setNodePositions((prevPositions) => ({ - ...prevPositions, - [node.id]: node.position, - })); - }, - [] - ); - - // Обновляем узлы и ребра при изменении данных useEffect(() => { const { nodes: initialNodes, edges: initialEdges } = parseData(data); setNodes(initialNodes); setEdges(initialEdges); }, [data, parseData, setNodes, setEdges]); + const onNodeClick = (event, node) => { + if (node.data.hasChildren) { + toggleNodeCollapse(node.id); + } + }; + + useEffect(() => { + return () => { + debouncedSetNodePositions.cancel(); + }; + }, [debouncedSetNodePositions]); + return ( -
+
@@ -174,4 +74,4 @@ const FlowChart = ({ data }) => { ); }; -export default React.memo(FlowChart); // Оптимизация рендера \ No newline at end of file +export default React.memo(FlowChart); \ No newline at end of file diff --git a/src/Components/TreeChart/FlowChartComponents/DataParser.jsx b/src/Components/TreeChart/FlowChartComponents/DataParser.jsx new file mode 100644 index 0000000..73855cd --- /dev/null +++ b/src/Components/TreeChart/FlowChartComponents/DataParser.jsx @@ -0,0 +1,104 @@ +import { useCallback } from 'react'; +import { isLeafNode } from './nodeUtils'; +import { getStatusColor } from '../dataUtils'; + +export const useDataParser = (nodePositions, collapsedNodes) => { + const getNodeStyle = useCallback((item, isLeaf) => ({ + width: isLeaf ? 40 : 50, + height: isLeaf ? 40 : 50, + borderRadius: '50%', + backgroundColor: getStatusColor(item.status), + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + color: 'black', + border: '2px solid #fff', + fontSize: isLeaf ? '0.8rem' : '1rem' + }), []); + + const getCenterNodeStyle = useCallback((item) => ({ + width: 60, + height: 60, + borderRadius: '50%', + backgroundColor: getStatusColor(item.status), + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + color: 'black', + border: '2px solid #fff', + fontSize: '1.2rem' + }), []); + + const parseData = useCallback((data) => { + if (!data) return { nodes: [], edges: [] }; + + const nodes = []; + const edges = []; + const centerX = 500; + const centerY = 400; + const baseLevelRadius = 150; + + const traverse = (item, parentId = null, level = 0, angleStart = 0, angleEnd = 2 * Math.PI, parentRadius = 0) => { + if (!item || collapsedNodes[parentId]) return; // Пропускаем свёрнутые узлы + + const nodeId = item.id; + const items = item.items || []; + const isLeaf = isLeafNode(item); + + const savedPosition = nodePositions[nodeId]; + let position = savedPosition || { + x: Math.round(centerX + Math.cos((angleStart + angleEnd) / 2) * (parentRadius + baseLevelRadius)), + y: Math.round(centerY + Math.sin((angleStart + angleEnd) / 2) * (parentRadius + baseLevelRadius)) + }; + + const node = { + id: nodeId, + position, + style: getNodeStyle(item, isLeaf), + data: { label: item.title, hasChildren: items.length > 0, collapsed: collapsedNodes[nodeId] } + }; + + nodes.push(node); + + if (parentId) { + edges.push({ + id: `${parentId}-${nodeId}`, + source: parentId, + target: nodeId, + style: { stroke: isLeaf ? '#aaa' : '#666', strokeWidth: isLeaf ? 1 : 2 } + }); + } + + if (!collapsedNodes[nodeId] && items.length > 0) { + const spreadAngle = angleEnd - angleStart; + items.forEach((child, index) => { + if (!child) return; + const itemAngleStart = angleStart + (index / items.length) * spreadAngle; + const itemAngleEnd = angleStart + ((index + 1) / items.length) * spreadAngle; + traverse(child, nodeId, level + 1, itemAngleStart, itemAngleEnd, parentRadius + baseLevelRadius); + }); + } + }; + + const centerNode = { + id: data.id, + position: nodePositions[data.id] || { x: centerX, y: centerY }, + style: getCenterNodeStyle(data), + data: { label: data.title, hasChildren: data.items.length > 0, collapsed: collapsedNodes[data.id] } + }; + + nodes.push(centerNode); + + if (!collapsedNodes[data.id] && data.items.length > 0) { + const angleStep = (2 * Math.PI) / data.items.length; + data.items.forEach((child, index) => { + if (!child) return; + traverse(child, data.id, 1, index * angleStep, (index + 1) * angleStep, 0); + }); + } + + return { nodes, edges }; + }, [nodePositions, collapsedNodes, getNodeStyle, getCenterNodeStyle]); + + return { parseData }; +}; \ No newline at end of file diff --git a/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx b/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx new file mode 100644 index 0000000..af1283d --- /dev/null +++ b/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx @@ -0,0 +1,26 @@ +import React, { memo } from 'react'; + +const NodeWrapper = memo(({ id, data, selected, style }) => { + return ( +
+ {data.label} + {data.hasChildren && ( + + {data.collapsed ? '+' : '-'} + + )} +
+ ); +}); + +export default NodeWrapper; diff --git a/src/Components/TreeChart/FlowChartComponents/nodeUtils.jsx b/src/Components/TreeChart/FlowChartComponents/nodeUtils.jsx new file mode 100644 index 0000000..5aab37a --- /dev/null +++ b/src/Components/TreeChart/FlowChartComponents/nodeUtils.jsx @@ -0,0 +1,3 @@ +export const isLeafNode = (item) => { + return !item.items || item.items.length === 0; +}; \ No newline at end of file diff --git a/src/Components/TreeChart/FlowChartComponents/useFlowChart.jsx b/src/Components/TreeChart/FlowChartComponents/useFlowChart.jsx new file mode 100644 index 0000000..b435fb5 --- /dev/null +++ b/src/Components/TreeChart/FlowChartComponents/useFlowChart.jsx @@ -0,0 +1,46 @@ +import { useState, useCallback, useEffect } from 'react'; +import { useNodesState, useEdgesState } from 'reactflow'; +import { statusManager1 } from '../dataUtils'; + +export const useFlowChart = (initialData) => { + const [nodes, setNodes, onNodesChange] = useNodesState([]); + const [edges, setEdges, onEdgesChange] = useEdgesState([]); + const [nodePositions, setNodePositions] = useState({}); + const [collapsedNodes, setCollapsedNodes] = useState({}); // Добавили + + const toggleNodeCollapse = useCallback((nodeId) => { + setCollapsedNodes((prev) => ({ + ...prev, + [nodeId]: !prev[nodeId] + })); + }, []); + + const initializeNodePositions = useCallback((nodes) => { + const positions = {}; + nodes.forEach(node => { + positions[node.id] = node.position; + }); + setNodePositions(positions); + }, []); + + useEffect(() => { + const updateStatuses = (data) => { + statusManager1.updateStatuses(data); + }; + updateStatuses(initialData); + }, [initialData]); + + return { + nodes, + edges, + nodePositions, + setNodes, + setEdges, + onNodesChange, + onEdgesChange, + setNodePositions, + collapsedNodes, + toggleNodeCollapse, + initializeNodePositions + }; +}; diff --git a/src/Components/TreeChart/FlowChartComponents/useNodeHandlers.jsx b/src/Components/TreeChart/FlowChartComponents/useNodeHandlers.jsx new file mode 100644 index 0000000..80e4fd0 --- /dev/null +++ b/src/Components/TreeChart/FlowChartComponents/useNodeHandlers.jsx @@ -0,0 +1,24 @@ +import { useCallback } from 'react'; + +export const useNodeHandlers = (debouncedSetNodePositions) => { + const onNodeDrag = useCallback((event, node) => { + // Фиксируем позицию сразу при перемещении + node.position = { + x: Math.round(node.position.x), + y: Math.round(node.position.y) + }; + }, []); + + const onNodeDragStop = useCallback((event, node) => { + node.position = { + x: Math.round(node.position.x), + y: Math.round(node.position.y) + }; + debouncedSetNodePositions(prev => ({ + ...prev, + [node.id]: node.position + })); + }, [debouncedSetNodePositions]); + + return { onNodeDrag, onNodeDragStop }; +}; \ No newline at end of file diff --git a/src/Components/TreeChart/TreeChart.jsx b/src/Components/TreeChart/TreeChart.jsx deleted file mode 100755 index dad7ed9..0000000 --- a/src/Components/TreeChart/TreeChart.jsx +++ /dev/null @@ -1,139 +0,0 @@ -import React, { useRef, useEffect, useMemo, useState } from "react"; -import * as d3 from "d3"; -import { calculateNodePositions } from "./TreeChartComponents/NodePosition"; -import { getStatusColor } from "./dataUtils"; - -const TreeChart = ({ data }) => { - const chartRef = useRef(); - const nodePositions = useRef(new Map()); - const [treeData, setTreeData] = useState(data); - - // Пересчитываем позиции узлов при изменении данных - const { root, nodes, links } = useMemo(() => { - return calculateNodePositions(treeData, nodePositions.current); - }, [treeData]); - - useEffect(() => { - if (!chartRef.current) return; - - // Удаляем старый граф перед отрисовкой нового - d3.select(chartRef.current).selectAll("*").remove(); - - // Определяем границы графа - const xMin = d3.min(nodes, (d) => d.x) || -500; - const xMax = d3.max(nodes, (d) => d.x) || 500; - const yMin = d3.min(nodes, (d) => d.y) || -500; - const yMax = d3.max(nodes, (d) => d.y) || 500; - - const width = xMax - xMin + 200; - const height = yMax - yMin + 200; - - const svg = d3.select(chartRef.current) - .attr("width", "100%") - .attr("height", "100%") - .attr("viewBox", `${xMin - 100} ${yMin - 100} ${width} ${height}`) - .attr("style", "max-width: 100%; height: auto;") - .call(d3.zoom() - .scaleExtent([0.5, 5]) - .on("zoom", (event) => { - svg.select("g").attr("transform", event.transform); - }) - ); - - const g = svg.append("g"); - - g.append("g").attr("class", "links"); - g.append("g").attr("class", "nodes"); - g.append("g").attr("class", "labels"); - - // Рисуем связи - g.select(".links") - .selectAll("line") - .data(links) - .join("line") - .attr("stroke", "#999") - .attr("stroke-opacity", 0.6) - .attr("x1", (d) => d.source.x) - .attr("y1", (d) => d.source.y) - .attr("x2", (d) => d.target.x) - .attr("y2", (d) => d.target.y); - - // Рисуем узлы - g.select(".nodes") - .selectAll("circle") - .data(nodes) - .join("circle") - .attr("fill", (d) => getStatusColor(d.data.status)) - .attr("stroke", "#fff") - .attr("r", 7) - .attr("cx", (d) => d.x) - .attr("cy", (d) => d.y) - .on("click", (event, d) => toggleNode(d)) - .call(drag()); - - // Рисуем текстовые метки - g.select(".labels") - .selectAll("text") - .data(nodes) - .join("text") - .text((d) => (nodes.length > 50 ? "" : d.data.title)) - .attr("dx", 12) - .attr("dy", 4) - .style("user-select", "none") - .style("pointer-events", "none") - .style("fill", "var(--TreeChart-text-color)") - .attr("x", (d) => d.x + 12) - .attr("y", (d) => d.y + 4); - - }, [root, links, nodes]); - - const drag = () => { - function dragstarted(event, d) { - d3.select(this).raise().attr("stroke", "#000"); - } - - function dragged(event, d) { - d.x = event.x; - d.y = event.y; - d3.select(this).attr("cx", d.x).attr("cy", d.y); - - d3.select(this.parentNode) - .select("text") - .attr("x", d.x + 12) - .attr("y", d.y + 4); - - d3.select(chartRef.current) - .selectAll(".links line") - .filter((link) => link.source === d || link.target === d) - .attr("x1", (link) => link.source.x) - .attr("y1", (link) => link.source.y) - .attr("x2", (link) => link.target.x) - .attr("y2", (link) => link.target.y); - } - - function dragended(event, d) { - d3.select(this).attr("stroke", "#fff"); - nodePositions.current.set(d.data.id, { x: d.x, y: d.y }); - } - - return d3.drag().on("start", dragstarted).on("drag", dragged).on("end", dragended); - }; - - const toggleNode = (d) => { - d.data.collapsed = !d.data.collapsed; - - if (d.data.collapsed) { - d._children = d.data.children; - d.data.children = []; - } else { - d.data.children = d._children; - d._children = null; - } - - setTreeData({ ...treeData }); - }; - - return ; -}; - -export default TreeChart; diff --git a/src/Components/TreeChart/TreeChartComponents/Label.jsx b/src/Components/TreeChart/TreeChartComponents/Label.jsx deleted file mode 100644 index 50fda20..0000000 --- a/src/Components/TreeChart/TreeChartComponents/Label.jsx +++ /dev/null @@ -1,21 +0,0 @@ -import React from "react"; - -const Label = ({ node }) => { - return ( - - {node.data.title} - - ); -}; - -export default Label; \ No newline at end of file diff --git a/src/Components/TreeChart/TreeChartComponents/Link.jsx b/src/Components/TreeChart/TreeChartComponents/Link.jsx deleted file mode 100644 index 653539a..0000000 --- a/src/Components/TreeChart/TreeChartComponents/Link.jsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from "react"; - -const Link = ({ link }) => { - return ( - - ); -}; - -export default Link; \ No newline at end of file diff --git a/src/Components/TreeChart/TreeChartComponents/Node.jsx b/src/Components/TreeChart/TreeChartComponents/Node.jsx deleted file mode 100644 index 3291608..0000000 --- a/src/Components/TreeChart/TreeChartComponents/Node.jsx +++ /dev/null @@ -1,19 +0,0 @@ -import React from "react"; -import * as d3 from "d3"; -import { getStatusColor } from "../dataUtils"; - -const Node = ({ node, onNodeClick, drag }) => { - return ( - drag(event, node)} - onClick={() => onNodeClick(node.data.id, node.data.title)} - /> - ); -}; - -export default Node; \ No newline at end of file diff --git a/src/Components/TreeChart/TreeChartComponents/NodePosition.jsx b/src/Components/TreeChart/TreeChartComponents/NodePosition.jsx deleted file mode 100644 index 2a7fd4d..0000000 --- a/src/Components/TreeChart/TreeChartComponents/NodePosition.jsx +++ /dev/null @@ -1,30 +0,0 @@ -import * as d3 from "d3"; - -export const calculateNodePositions = (data, nodePositions) => { - if (!data || !data.items) return { root: null, nodes: [], links: [] }; - - const root = d3.hierarchy(data, (d) => d.items); - const treeLayout = d3.tree().size([4000 * Math.PI, 300]); // Угловое распределение (радиан, радиус) - - treeLayout(root); // Заполняем координаты - - const nodes = root.descendants(); - const links = nodes - .filter((d) => d.parent) - .map((d) => ({ - source: d.parent, - target: d, - })); - - // Преобразуем полярные координаты в декартовые - nodes.forEach((node) => { - const angle = node.x; // x теперь угол (радианы) - const radius = node.y; // y теперь радиус - nodePositions.set(node.data.id, { - x: radius * Math.cos(angle), - y: radius * Math.sin(angle), - }); - }); - - return { root, nodes, links }; -}; diff --git a/src/Components/UI/LoginModal.jsx b/src/Components/UI/LoginModal.jsx index 98405a8..61c154d 100755 --- a/src/Components/UI/LoginModal.jsx +++ b/src/Components/UI/LoginModal.jsx @@ -1,6 +1,7 @@ import React, { useState } from "react"; import Modal from "./Modal"; import "../../Style/LoginModal.css"; +import Logo from '../../assets/images/logo.svg?react'; import TextField from '@mui/material/TextField'; const LoginModal = ({ onLogin, onClose }) => { diff --git a/src/Components/hooks/TabContent.jsx b/src/Components/hooks/TabContent.jsx index 5747736..10e58a0 100644 --- a/src/Components/hooks/TabContent.jsx +++ b/src/Components/hooks/TabContent.jsx @@ -1,6 +1,6 @@ import SystemStatusChart from "../../Charts/SystemStatusChart"; import TreeTable from "../UI/TreeTable"; -import TreeChart from "../TreeChart/TreeChart"; + import FlowChart from "../TreeChart/FlowChart"; const TabContent = ({ activeTab, statusHistories, treeData1, tabContent, handleOpenTab }) => { diff --git a/src/assets/images/logo.svg b/src/assets/images/logo.svg new file mode 100644 index 0000000..c767d1c --- /dev/null +++ b/src/assets/images/logo.svg @@ -0,0 +1,319 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/vite.config.js b/vite.config.js index b034150..7011d63 100755 --- a/vite.config.js +++ b/vite.config.js @@ -1,11 +1,15 @@ import { defineConfig } from 'vite' import react from '@vitejs/plugin-react' +import svgr from 'vite-plugin-svgr' // https://vite.dev/config/ export default defineConfig({ - plugins: [react()], + plugins: [ + react(), + svgr() + ], server: { host: true, allowedHosts: ['dev.msf.enode'] } -}) +}) \ No newline at end of file -- 2.40.1 From 5ed1b448e5d679f0b6b8455445471356e039c560 Mon Sep 17 00:00:00 2001 From: DmitriyA Date: Tue, 25 Mar 2025 11:48:10 -0400 Subject: [PATCH 4/6] refactored the graph 2 --- src/Components/TreeChart/FlowChart.jsx | 31 ++++++--- .../FlowChartComponents/DataParser.jsx | 62 +++++++---------- .../FlowChartComponents/NodeWrapper.jsx | 67 ++++++++++++++----- 3 files changed, 101 insertions(+), 59 deletions(-) diff --git a/src/Components/TreeChart/FlowChart.jsx b/src/Components/TreeChart/FlowChart.jsx index 082cdd6..d4d2370 100644 --- a/src/Components/TreeChart/FlowChart.jsx +++ b/src/Components/TreeChart/FlowChart.jsx @@ -1,15 +1,14 @@ -import React, { useEffect, useMemo } from 'react'; +import React, { useEffect, useMemo, useRef } from 'react'; import ReactFlow, { Controls, Background } from 'reactflow'; import 'reactflow/dist/style.css'; import { debounce } from 'lodash'; import { useFlowChart } from './FlowChartComponents/useFlowChart'; import { useNodeHandlers } from './FlowChartComponents/useNodeHandlers'; import { useDataParser } from './FlowChartComponents/DataParser'; -import NodeWrapper from './FlowChartComponents/NodeWrapper'; // Исправленный импорт +import NodeWrapper from './FlowChartComponents/NodeWrapper'; -// Определяем кастомные типы узлов const nodeTypes = { - customNode: NodeWrapper // Тип должен соответствовать тому, что вы указываете в parseData + customNode: NodeWrapper // Должно совпадать с type в useDataParser }; const FlowChart = ({ data }) => { @@ -27,6 +26,7 @@ const FlowChart = ({ data }) => { } = useFlowChart(data); const { parseData } = useDataParser(nodePositions, collapsedNodes); + const initialized = useRef(false); const debouncedSetNodePositions = useMemo( () => debounce(setNodePositions, 100), @@ -39,7 +39,24 @@ const FlowChart = ({ data }) => { const { nodes: initialNodes, edges: initialEdges } = parseData(data); setNodes(initialNodes); setEdges(initialEdges); - }, [data, parseData, setNodes, setEdges]); + + if (!initialized.current && data) { + const findAndCollapseLastLevelParents = (items) => { + items.forEach(item => { + if (item.items?.length > 0) { + const hasGrandchildren = item.items.some(child => child.items?.length > 0); + if (!hasGrandchildren) { + toggleNodeCollapse(item.id); + } else { + findAndCollapseLastLevelParents(item.items); + } + } + }); + }; + findAndCollapseLastLevelParents(data.items || []); + initialized.current = true; + } + }, [data, parseData, setNodes, setEdges, toggleNodeCollapse]); const onNodeClick = (event, node) => { if (node.data.hasChildren) { @@ -48,9 +65,7 @@ const FlowChart = ({ data }) => { }; useEffect(() => { - return () => { - debouncedSetNodePositions.cancel(); - }; + return () => debouncedSetNodePositions.cancel(); }, [debouncedSetNodePositions]); return ( diff --git a/src/Components/TreeChart/FlowChartComponents/DataParser.jsx b/src/Components/TreeChart/FlowChartComponents/DataParser.jsx index 73855cd..658f1ea 100644 --- a/src/Components/TreeChart/FlowChartComponents/DataParser.jsx +++ b/src/Components/TreeChart/FlowChartComponents/DataParser.jsx @@ -1,34 +1,7 @@ import { useCallback } from 'react'; import { isLeafNode } from './nodeUtils'; -import { getStatusColor } from '../dataUtils'; export const useDataParser = (nodePositions, collapsedNodes) => { - const getNodeStyle = useCallback((item, isLeaf) => ({ - width: isLeaf ? 40 : 50, - height: isLeaf ? 40 : 50, - borderRadius: '50%', - backgroundColor: getStatusColor(item.status), - display: 'flex', - alignItems: 'center', - justifyContent: 'center', - color: 'black', - border: '2px solid #fff', - fontSize: isLeaf ? '0.8rem' : '1rem' - }), []); - - const getCenterNodeStyle = useCallback((item) => ({ - width: 60, - height: 60, - borderRadius: '50%', - backgroundColor: getStatusColor(item.status), - display: 'flex', - alignItems: 'center', - justifyContent: 'center', - color: 'black', - border: '2px solid #fff', - fontSize: '1.2rem' - }), []); - const parseData = useCallback((data) => { if (!data) return { nodes: [], edges: [] }; @@ -39,7 +12,7 @@ export const useDataParser = (nodePositions, collapsedNodes) => { const baseLevelRadius = 150; const traverse = (item, parentId = null, level = 0, angleStart = 0, angleEnd = 2 * Math.PI, parentRadius = 0) => { - if (!item || collapsedNodes[parentId]) return; // Пропускаем свёрнутые узлы + if (!item || collapsedNodes[parentId]) return; const nodeId = item.id; const items = item.items || []; @@ -54,8 +27,15 @@ export const useDataParser = (nodePositions, collapsedNodes) => { const node = { id: nodeId, position, - style: getNodeStyle(item, isLeaf), - data: { label: item.title, hasChildren: items.length > 0, collapsed: collapsedNodes[nodeId] } + type: 'customNode', // Важно для кастомного рендеринга + data: { + label: item.title, + status: item.status, + hasChildren: items.length > 0, + collapsed: collapsedNodes[nodeId], + isLeaf, + isCenterNode: parentId === null // Центральный узел + } }; nodes.push(node); @@ -65,14 +45,16 @@ export const useDataParser = (nodePositions, collapsedNodes) => { id: `${parentId}-${nodeId}`, source: parentId, target: nodeId, - style: { stroke: isLeaf ? '#aaa' : '#666', strokeWidth: isLeaf ? 1 : 2 } + style: { + stroke: isLeaf ? '#aaa' : '#666', + strokeWidth: isLeaf ? 1 : 2 + } }); } if (!collapsedNodes[nodeId] && items.length > 0) { const spreadAngle = angleEnd - angleStart; items.forEach((child, index) => { - if (!child) return; const itemAngleStart = angleStart + (index / items.length) * spreadAngle; const itemAngleEnd = angleStart + ((index + 1) / items.length) * spreadAngle; traverse(child, nodeId, level + 1, itemAngleStart, itemAngleEnd, parentRadius + baseLevelRadius); @@ -80,25 +62,33 @@ export const useDataParser = (nodePositions, collapsedNodes) => { } }; + // Центральный узел const centerNode = { id: data.id, position: nodePositions[data.id] || { x: centerX, y: centerY }, - style: getCenterNodeStyle(data), - data: { label: data.title, hasChildren: data.items.length > 0, collapsed: collapsedNodes[data.id] } + type: 'customNode', + data: { + label: data.title, + status: data.status, + hasChildren: data.items.length > 0, + collapsed: collapsedNodes[data.id], + isLeaf: false, + isCenterNode: true + } }; nodes.push(centerNode); + // Обработка дочерних узлов if (!collapsedNodes[data.id] && data.items.length > 0) { const angleStep = (2 * Math.PI) / data.items.length; data.items.forEach((child, index) => { - if (!child) return; traverse(child, data.id, 1, index * angleStep, (index + 1) * angleStep, 0); }); } return { nodes, edges }; - }, [nodePositions, collapsedNodes, getNodeStyle, getCenterNodeStyle]); + }, [nodePositions, collapsedNodes]); return { parseData }; }; \ No newline at end of file diff --git a/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx b/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx index af1283d..7ee61a0 100644 --- a/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx +++ b/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx @@ -1,26 +1,63 @@ -import React, { memo } from 'react'; +import React from 'react'; +import { getStatusColor } from '../dataUtils'; + +const NodeWrapper = ({ id, data, selected }) => { + // Параметры стиля + const size = data.isCenterNode ? 80 : (data.isLeaf ? 60 : 70); + const fontSize = data.isCenterNode ? '1.2rem' : (data.isLeaf ? '0.8rem' : '1rem'); + const backgroundColor = getStatusColor(data.status); + + // Базовый стиль узла + const nodeStyle = { + width: size, + height: size, + borderRadius: '50%', + backgroundColor, + border: `2px solid ${selected ? '#1890ff' : '#fff'}`, + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + fontSize, + color: '#000', + position: 'relative', + boxShadow: selected ? '0 0 8px rgba(24, 144, 255, 0.5)' : 'none', + transition: 'all 0.2s ease' + }; -const NodeWrapper = memo(({ id, data, selected, style }) => { return ( -
- {data.label} +
+
+ {data.label} +
+ {data.hasChildren && ( - {data.collapsed ? '+' : '-'} - +
)}
); -}); +}; -export default NodeWrapper; +export default React.memo(NodeWrapper); \ No newline at end of file -- 2.40.1 From c077449b2c7d102070957ee10c2c7c3dc7727d78 Mon Sep 17 00:00:00 2001 From: DmitriyA Date: Wed, 26 Mar 2025 05:16:43 -0400 Subject: [PATCH 5/6] redesign of graphs and visualizations --- src/Charts/PrometheusChart.jsx | 166 ++++++++++++++---- src/Components/TreeChart/FlowChart.jsx | 17 +- .../FlowChartComponents/DataParser.jsx | 62 ++++--- .../FlowChartComponents/NodeWrapper.jsx | 92 +++++----- src/Components/UI/LoginModal.jsx | 1 - src/Style/DatePicker.css | 0 src/Style/range-selector.css | 54 ++++++ 7 files changed, 287 insertions(+), 105 deletions(-) delete mode 100755 src/Style/DatePicker.css create mode 100644 src/Style/range-selector.css diff --git a/src/Charts/PrometheusChart.jsx b/src/Charts/PrometheusChart.jsx index d3a151b..ddb1b65 100755 --- a/src/Charts/PrometheusChart.jsx +++ b/src/Charts/PrometheusChart.jsx @@ -217,41 +217,143 @@ const PrometheusChart = ({ metricName }) => { }); return ( -
-
- - -
-
- -
- - setStartDate(date)} - showTimeSelect - timeFormat="HH:mm" - timeIntervals={15} - dateFormat="yyyy-MM-dd HH:mm" - /> +
+ {/* Заголовок графика */} +

+

+ + {/* Группа элементов управления */} +
+ {/* Стандартные диапазоны */} +
+ +
-
- - setEndDate(date)} - showTimeSelect - timeFormat="HH:mm" - timeIntervals={15} - dateFormat="yyyy-MM-dd HH:mm" - /> + + {/* Кастомный диапазон */} +
+
+ Или укажите свой диапазон: +
+
+
+ setStartDate(date)} + showTimeSelect + timeFormat="HH:mm" + timeIntervals={15} + dateFormat="yyyy-MM-dd HH:mm" + placeholderText="Начальная дата" + customInput={ + + } + /> +
+
+ setEndDate(date)} + showTimeSelect + timeFormat="HH:mm" + timeIntervals={15} + dateFormat="yyyy-MM-dd HH:mm" + placeholderText="Конечная дата" + customInput={ + + } + /> +
+ +
-
+ + {/* Индикатор текущего диапазона */} +
+ Текущий диапазон: {useCustomRange + ? `${startDate.toLocaleString()} - ${endDate.toLocaleString()}` + : selectedRange.label} +
+ + {/* График */} { @@ -40,11 +40,17 @@ const FlowChart = ({ data }) => { setNodes(initialNodes); setEdges(initialEdges); + // Автоматически сворачиваем узлы, которые являются родителями последнего уровня if (!initialized.current && data) { const findAndCollapseLastLevelParents = (items) => { items.forEach(item => { - if (item.items?.length > 0) { - const hasGrandchildren = item.items.some(child => child.items?.length > 0); + if (item.items && item.items.length > 0) { + // Проверяем, есть ли у детей свои дети + const hasGrandchildren = item.items.some(child => + child.items && child.items.length > 0 + ); + + // Если у детей нет своих детей - это родители последнего уровня if (!hasGrandchildren) { toggleNodeCollapse(item.id); } else { @@ -53,6 +59,7 @@ const FlowChart = ({ data }) => { } }); }; + findAndCollapseLastLevelParents(data.items || []); initialized.current = true; } @@ -65,7 +72,9 @@ const FlowChart = ({ data }) => { }; useEffect(() => { - return () => debouncedSetNodePositions.cancel(); + return () => { + debouncedSetNodePositions.cancel(); + }; }, [debouncedSetNodePositions]); return ( diff --git a/src/Components/TreeChart/FlowChartComponents/DataParser.jsx b/src/Components/TreeChart/FlowChartComponents/DataParser.jsx index 658f1ea..916bc97 100644 --- a/src/Components/TreeChart/FlowChartComponents/DataParser.jsx +++ b/src/Components/TreeChart/FlowChartComponents/DataParser.jsx @@ -1,7 +1,34 @@ import { useCallback } from 'react'; import { isLeafNode } from './nodeUtils'; +import { getStatusColor } from '../dataUtils'; export const useDataParser = (nodePositions, collapsedNodes) => { + const getNodeStyle = useCallback((item, isLeaf) => ({ + width: isLeaf ? 60 : 70, + height: isLeaf ? 60 : 70, + borderRadius: '50%', + backgroundColor: getStatusColor(item.status), + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + color: 'black', + border: '2px solid #fff', + fontSize: isLeaf ? '0.8rem' : '1rem' + }), []); + + const getCenterNodeStyle = useCallback((item) => ({ + width: 80, + height: 80, + borderRadius: '50%', + backgroundColor: getStatusColor(item.status), + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + color: 'black', + border: '2px solid #fff', + fontSize: '1.2rem' + }), []); + const parseData = useCallback((data) => { if (!data) return { nodes: [], edges: [] }; @@ -12,7 +39,7 @@ export const useDataParser = (nodePositions, collapsedNodes) => { const baseLevelRadius = 150; const traverse = (item, parentId = null, level = 0, angleStart = 0, angleEnd = 2 * Math.PI, parentRadius = 0) => { - if (!item || collapsedNodes[parentId]) return; + if (!item || collapsedNodes[parentId]) return; // Пропускаем свёрнутые узлы const nodeId = item.id; const items = item.items || []; @@ -26,15 +53,14 @@ export const useDataParser = (nodePositions, collapsedNodes) => { const node = { id: nodeId, + type: 'customNode', position, - type: 'customNode', // Важно для кастомного рендеринга data: { + ...item, label: item.title, - status: item.status, + style: getNodeStyle(item, isLeaf), // Переносим стили в data hasChildren: items.length > 0, - collapsed: collapsedNodes[nodeId], - isLeaf, - isCenterNode: parentId === null // Центральный узел + collapsed: collapsedNodes[nodeId] } }; @@ -45,16 +71,14 @@ export const useDataParser = (nodePositions, collapsedNodes) => { id: `${parentId}-${nodeId}`, source: parentId, target: nodeId, - style: { - stroke: isLeaf ? '#aaa' : '#666', - strokeWidth: isLeaf ? 1 : 2 - } + style: { stroke: isLeaf ? '#aaa' : '#666', strokeWidth: isLeaf ? 1 : 2 } }); } if (!collapsedNodes[nodeId] && items.length > 0) { const spreadAngle = angleEnd - angleStart; items.forEach((child, index) => { + if (!child) return; const itemAngleStart = angleStart + (index / items.length) * spreadAngle; const itemAngleEnd = angleStart + ((index + 1) / items.length) * spreadAngle; traverse(child, nodeId, level + 1, itemAngleStart, itemAngleEnd, parentRadius + baseLevelRadius); @@ -62,33 +86,27 @@ export const useDataParser = (nodePositions, collapsedNodes) => { } }; - // Центральный узел const centerNode = { id: data.id, + type: 'customNode', // Добавляем тип узла position: nodePositions[data.id] || { x: centerX, y: centerY }, - type: 'customNode', - data: { - label: data.title, - status: data.status, - hasChildren: data.items.length > 0, - collapsed: collapsedNodes[data.id], - isLeaf: false, - isCenterNode: true - } + style: getCenterNodeStyle(data), + data: { label: data.title, hasChildren: data.items.length > 0, collapsed: collapsedNodes[data.id] } }; + nodes.push(centerNode); - // Обработка дочерних узлов if (!collapsedNodes[data.id] && data.items.length > 0) { const angleStep = (2 * Math.PI) / data.items.length; data.items.forEach((child, index) => { + if (!child) return; traverse(child, data.id, 1, index * angleStep, (index + 1) * angleStep, 0); }); } return { nodes, edges }; - }, [nodePositions, collapsedNodes]); + }, [nodePositions, collapsedNodes, getNodeStyle, getCenterNodeStyle]); return { parseData }; }; \ No newline at end of file diff --git a/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx b/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx index 7ee61a0..d64d391 100644 --- a/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx +++ b/src/Components/TreeChart/FlowChartComponents/NodeWrapper.jsx @@ -1,63 +1,63 @@ -import React from 'react'; -import { getStatusColor } from '../dataUtils'; - -const NodeWrapper = ({ id, data, selected }) => { - // Параметры стиля - const size = data.isCenterNode ? 80 : (data.isLeaf ? 60 : 70); - const fontSize = data.isCenterNode ? '1.2rem' : (data.isLeaf ? '0.8rem' : '1rem'); - const backgroundColor = getStatusColor(data.status); - - // Базовый стиль узла - const nodeStyle = { - width: size, - height: size, - borderRadius: '50%', - backgroundColor, - border: `2px solid ${selected ? '#1890ff' : '#fff'}`, - display: 'flex', - alignItems: 'center', - justifyContent: 'center', - fontSize, - color: '#000', - position: 'relative', - boxShadow: selected ? '0 0 8px rgba(24, 144, 255, 0.5)' : 'none', - transition: 'all 0.2s ease' - }; +import React, { memo } from 'react'; +import { Handle } from 'reactflow'; +const NodeWrapper = memo(({ id, data, selected }) => { return ( -
+
+ {/* Хендл для входящих соединений */} + + + {/* Обёртка для текста с ограничением ширины */}
{data.label}
{data.hasChildren && ( -
{data.collapsed ? '+' : '-'} -
+ )} + + {/* Хендл для исходящих соединений */} +
); -}; +}); -export default React.memo(NodeWrapper); \ No newline at end of file +export default NodeWrapper; \ No newline at end of file diff --git a/src/Components/UI/LoginModal.jsx b/src/Components/UI/LoginModal.jsx index 61c154d..1068d55 100755 --- a/src/Components/UI/LoginModal.jsx +++ b/src/Components/UI/LoginModal.jsx @@ -17,7 +17,6 @@ const LoginModal = ({ onLogin, onClose }) => { try { // Отправляем данные на бэкенд - console.log("Отправляем данные:", { username, password }); const response = await fetch('http://192.168.2.39:3000/auth/login', { method: 'POST', headers: { diff --git a/src/Style/DatePicker.css b/src/Style/DatePicker.css deleted file mode 100755 index e69de29..0000000 diff --git a/src/Style/range-selector.css b/src/Style/range-selector.css new file mode 100644 index 0000000..9a8fc73 --- /dev/null +++ b/src/Style/range-selector.css @@ -0,0 +1,54 @@ +.range-selector { + display: flex; + flex-direction: column; + gap: 10px; + padding: 15px; + border: 1px solid #ccc; + border-radius: 8px; + background-color: #f9f9f9; + max-width: 500px; +} + +.range-selector label { + font-weight: bold; +} + +.range-selector select, +.range-selector button { + padding: 8px; + border: 1px solid #aaa; + border-radius: 5px; + background-color: white; + cursor: pointer; +} + +.custom-range { + display: flex; + flex-wrap: wrap; + gap: 10px; + justify-content: space-between; + align-items: center; +} + +.custom-range div { + display: flex; + flex-direction: column; +} + +.date-picker { + width: 180px; +} + +.apply-button { + background-color: #007bff; + color: white; + padding: 8px 12px; + border: none; + border-radius: 5px; + cursor: pointer; + margin-top: 5px; +} + +.apply-button:hover { + background-color: #0056b3; +} -- 2.40.1 From fc1db66288191e6a5eee48fcb98e0db1ce9880ac Mon Sep 17 00:00:00 2001 From: DmitriyA Date: Wed, 26 Mar 2025 05:16:52 -0400 Subject: [PATCH 6/6] redesign of graphs and visualizations --- src/Charts/Components/LineChartComponent.jsx | 55 ++++++++++++-------- src/Charts/PrometheusChart.jsx | 2 +- src/Style/range-selector.css | 54 ------------------- 3 files changed, 35 insertions(+), 76 deletions(-) diff --git a/src/Charts/Components/LineChartComponent.jsx b/src/Charts/Components/LineChartComponent.jsx index d684d1c..b1d6963 100755 --- a/src/Charts/Components/LineChartComponent.jsx +++ b/src/Charts/Components/LineChartComponent.jsx @@ -1,17 +1,15 @@ import React, { useState } from 'react'; -import { LineChart, XAxis, YAxis, CartesianGrid, Tooltip, Legend, Line, ResponsiveContainer } from 'recharts'; +import { LineChart, XAxis, YAxis, CartesianGrid, Tooltip, Line, ResponsiveContainer } from 'recharts'; const LineChartComponent = ({ chartData, metricName, colors, description, onRangeSelect, filteredData }) => { const [selectionStart, setSelectionStart] = useState(null); const [selectionEnd, setSelectionEnd] = useState(null); - // Создаем массив уникальных временных меток const allTimes = Object.values(chartData) .flat() .map(point => point.time) .filter((time, index, self) => self.indexOf(time) === index); - // Формируем данные для графика const data = allTimes.map(time => { const point = { time }; Object.keys(chartData).forEach(key => { @@ -21,10 +19,8 @@ const LineChartComponent = ({ chartData, metricName, colors, description, onRang return point; }); - // Используем отфильтрованные данные, если они есть const displayData = filteredData || data; - // Обработчик клика на графике const handleClick = (e) => { if (!e || !e.activeLabel) return; @@ -45,40 +41,57 @@ const LineChartComponent = ({ chartData, metricName, colors, description, onRang } }; - // Кастомный Tooltip для отображения значения + // Упрощенный Tooltip без указания instance const CustomTooltip = ({ active, payload, label }) => { if (active && payload && payload.length) { return ( -
-

{`Время: ${label}`}

- {payload.map((entry, index) => ( -

- {`Значение: ${entry.value}`} -

- ))} +
+

{`Время: ${label}`}

+

{`Значение: ${payload[0].value}`}

); } - return null; }; return (
- - - - - } /> - + + + + + } + cursor={{ stroke: '#ccc', strokeWidth: 1 }} + /> + {/* Убрали чтобы скрыть имена instance */} {Object.keys(chartData).map((key, index) => ( ))} diff --git a/src/Charts/PrometheusChart.jsx b/src/Charts/PrometheusChart.jsx index ddb1b65..d06db8e 100755 --- a/src/Charts/PrometheusChart.jsx +++ b/src/Charts/PrometheusChart.jsx @@ -125,7 +125,7 @@ const PrometheusChart = ({ metricName }) => { ? date.toLocaleString([], { day: '2-digit', month: '2-digit', hour: '2-digit', minute: '2-digit' }) : date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit' }); - const key = `${m.instance}-${m.device || m.scrape_job}`; + const key = m.instance; if (!updatedData[key]) updatedData[key] = {}; updatedData[key][formattedTime] = m.value; }); diff --git a/src/Style/range-selector.css b/src/Style/range-selector.css index 9a8fc73..e69de29 100644 --- a/src/Style/range-selector.css +++ b/src/Style/range-selector.css @@ -1,54 +0,0 @@ -.range-selector { - display: flex; - flex-direction: column; - gap: 10px; - padding: 15px; - border: 1px solid #ccc; - border-radius: 8px; - background-color: #f9f9f9; - max-width: 500px; -} - -.range-selector label { - font-weight: bold; -} - -.range-selector select, -.range-selector button { - padding: 8px; - border: 1px solid #aaa; - border-radius: 5px; - background-color: white; - cursor: pointer; -} - -.custom-range { - display: flex; - flex-wrap: wrap; - gap: 10px; - justify-content: space-between; - align-items: center; -} - -.custom-range div { - display: flex; - flex-direction: column; -} - -.date-picker { - width: 180px; -} - -.apply-button { - background-color: #007bff; - color: white; - padding: 8px 12px; - border: none; - border-radius: 5px; - cursor: pointer; - margin-top: 5px; -} - -.apply-button:hover { - background-color: #0056b3; -} -- 2.40.1