diff --git a/src/Components/Layout/Dashboard.jsx b/src/Components/Layout/Dashboard.jsx index 74565b0..8658bc3 100755 --- a/src/Components/Layout/Dashboard.jsx +++ b/src/Components/Layout/Dashboard.jsx @@ -9,7 +9,7 @@ import TabContent from "../hooks/TabContent"; import menuData from "../TreeChart/menuData.json"; import SidebarMenuWrapper from "./SidebarMenuWrapper"; -// Создаем стилизованные компоненты +// Стилизованные компоненты const DashboardContainer = styled(Box)(({ theme }) => ({ display: 'flex', height: '100vh', @@ -82,49 +82,36 @@ const Dashboard = ({ isDarkMode, setIsDarkMode }) => { const handleMenuSelect = (item) => { const tabId = `tab_${item.id}`; const tabTitle = item.title || 'Новая вкладка'; + const tabContent =
Контент для {item.title}
; - const generateTabContentForItem = (item) => { - return ( - - {item.title} - {item.description && ( - {item.description} - )} - {item.metric && ( - - Метрика: {item.metric} - {/* Здесь можно добавить визуализацию метрики */} - - )} - - ); - }; - - // Проверяем, существует ли уже такая вкладка const existingTab = tabs.find(tab => tab.id === tabId); if (!existingTab) { - const newTab = { - id: tabId, - title: tabTitle, - content: generateTabContentForItem(item), - type: 'menuItem', - itemData: item // Сохраняем данные элемента для возможного обновления - }; - - handleOpenTab(newTab); + handleOpenTab(tabId, tabTitle, tabContent); // Передаем аргументы отдельно } else { setActiveTab(tabId); } }; + // Вспомогательная функция для получения всех дочерних элементов + const getAllChildren = (node) => { + let children = []; + if (node.items && node.items.length > 0) { + node.items.forEach((child) => { + children.push(child); + children = children.concat(getAllChildren(child)); + }); + } + return children; + }; + return ( - {/* Сайдбар - теперь используется SidebarMenuWrapper */} + {/* Сайдбар */} {/* Основной контент */} @@ -160,6 +147,7 @@ const Dashboard = ({ isDarkMode, setIsDarkMode }) => { treeData1={treeData1} tabContent={tabContent} handleOpenTab={handleOpenTab} + tabs={tabs} /> diff --git a/src/Components/Layout/SidebarMenu.jsx b/src/Components/Layout/SidebarMenu.jsx index a9aad6c..579ce0c 100644 --- a/src/Components/Layout/SidebarMenu.jsx +++ b/src/Components/Layout/SidebarMenu.jsx @@ -122,7 +122,7 @@ const SidebarMenu = ({ collapsed={collapsed} level={0} onEdit={onEditItem} - onSelect={onSelectItem} + onSelectItem={onSelectItem} /> )} diff --git a/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx b/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx index 9b3e01e..6fd6607 100644 --- a/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx +++ b/src/Components/Layout/SidebarMenuComponents/MenuItem.jsx @@ -12,8 +12,7 @@ import { MenuItem as MuiMenuItem } from "@mui/material"; import { ExpandLess, ExpandMore, Folder, FolderOpen, Edit } from "@mui/icons-material"; -import { getStatusColor } from "../../TreeChart/dataUtils"; -import StatusIndicator from "./StatusIndicator" +import StatusIndicator from "./StatusIndicator"; const StyledListItem = styled(ListItem)(({ theme, level }) => ({ cursor: "pointer", @@ -55,25 +54,17 @@ const MenuItem = ({ item, onSelectItem, level = 0, collapsed, onEdit }) => { setIsOpen(!isOpen); }; - const handleItemClick = (e) => { - e.stopPropagation(); - - // Если есть обработчик выбора и элемент можно выбрать - if (onSelectItem && (!item.items || item.items.length === 0)) { + const handleClick = () => { + if (onSelectItem) { onSelectItem(item); } - - // Если есть подэлементы - переключаем раскрытие - if (item.items && item.items.length > 0) { - setIsOpen(!isOpen); - } }; return ( <> { )} - {/* Контекстное меню */} { {item.items.map((child, index) => ( { ); }; -export default MenuItem; \ No newline at end of file +export default MenuItem; diff --git a/src/Components/hooks/TabContent.jsx b/src/Components/hooks/TabContent.jsx index a1c8102..cfc050b 100644 --- a/src/Components/hooks/TabContent.jsx +++ b/src/Components/hooks/TabContent.jsx @@ -4,11 +4,11 @@ import FlowChart from "../TreeChart/FlowChart"; import { getStatusColor } from "../TreeChart/dataUtils"; -const TabContent = ({ activeTab, statusHistories, treeData1, tabContent, handleOpenTab }) => { +const TabContent = ({ activeTab, tabs, statusHistories, treeData1, tabContent, handleOpenTab }) => { // Функция для подсчета количества элементов каждого статуса const countStatuses = (data) => { const counts = { green: 0, yellow: 0, orange: 0, red: 0 }; - + const countRecursive = (node) => { if (node.status) { counts[node.status]++; @@ -17,7 +17,7 @@ const TabContent = ({ activeTab, statusHistories, treeData1, tabContent, handleO node.items.forEach(child => countRecursive(child)); } }; - + countRecursive(data); return counts; }; @@ -38,11 +38,11 @@ const TabContent = ({ activeTab, statusHistories, treeData1, tabContent, handleO - + {/* Контейнер для индикаторов статусов */} -
@@ -63,7 +63,7 @@ const TabContent = ({ activeTab, statusHistories, treeData1, tabContent, handleO
))} - + @@ -71,7 +71,7 @@ const TabContent = ({ activeTab, statusHistories, treeData1, tabContent, handleO } else if (activeTab === "Визуализация") { return handleOpenTab(id, title)} />; } else { - const tabData = tabContent[activeTab]; + const tabData = tabs.find(t => t.id === activeTab); return tabData ? tabData.content :

Нет данных

; } }; diff --git a/src/Components/hooks/useTabs.jsx b/src/Components/hooks/useTabs.jsx index 2df5f13..23a6570 100644 --- a/src/Components/hooks/useTabs.jsx +++ b/src/Components/hooks/useTabs.jsx @@ -11,11 +11,11 @@ const useTabs = (initialTab) => { if (existingTabIndex >= 0) { return prevTabs.map((tab, index) => ({ ...tab, - content: content || tab.content, + title: title || tab.title, + content: content || tab.content, active: index === existingTabIndex })); } - // Добавляем новую вкладку return [ ...prevTabs.map(tab => ({ ...tab, active: false })),