frontend/src/components/MapView.js - master - Krams/nodemon

frontend/src/components/MapView.js
48 строк2 KB
Krams
first_commit
08 июн 2025, 12:17
08 июн 2025, 12:1725d7395
// Компонент для отображения схемы расположения шкафов с узлами и блоками
import React from 'react';
import RackView from './RackView';

/**
 * @param {Array} nodes - Массив узлов
 * @param {Array} blocks - Массив блоков
 * @param {boolean} selectionMode - Режим выбора узлов
 * @param {Array} selectedNodes - Массив выбранных узлов
 * @param {Function} toggleNodeSelection - Функция переключения выбора узла
 */
const MapView = ({ nodes, blocks, selectionMode, selectedNodes, toggleNodeSelection }) => {
  // Преобразуем массивы в плоскую структуру
  nodes = nodes.flat(Infinity);
  blocks = blocks.flat(Infinity);
  const racksCount = 9;

  // Получение блоков для конкретного шкафа
  const getRackBlocks = (rackNum) => {
    const blocksPerRack = 4;
    const start = (rackNum - 1) * blocksPerRack;
    const end = start + blocksPerRack;
    return blocks.slice(start, end);
  };

  // Получение узлов для конкретного шкафа
  const getRackNodes = (rackNum) => nodes.filter(node => +node.rack === rackNum);

  return (
    <div className="racks-container">
      {Array.from({ length: racksCount }, (_, rackIndex) => rackIndex + 1)
        .filter(rackNum => rackNum !== 8) // Пропускаем шкаф №8
        .map(rackNum => (
          <RackView
            key={rackNum}
            rackNum={rackNum}
            nodes={getRackNodes(rackNum)}
            blocks={getRackBlocks(rackNum)}
            selectionMode={selectionMode}
            selectedNodes={selectedNodes}
            toggleNodeSelection={toggleNodeSelection}
          />
        ))}
    </div>
  );
};

export default MapView;