forked from CITKParus/P8-Panels
64 lines
2.5 KiB
JavaScript
64 lines
2.5 KiB
JavaScript
/*
|
||
Парус 8 - Панели мониторинга - Циклограмма
|
||
Компонент: Заголовок
|
||
*/
|
||
|
||
//---------------------
|
||
//Подключение библиотек
|
||
//---------------------
|
||
|
||
import React from "react"; //Классы React
|
||
import PropTypes from "prop-types"; //Контроль свойств компонента
|
||
import { NDEFAULT_HEADER_HEIGHT } from "./p8p_cyclogram_constants"; //Константы циклограммы
|
||
import { P8PCyclogramHeaderColumn } from "./p8p_cyclogram_column"; //Колонка циклограммы
|
||
import { P8PCyclogramColumnsLines } from "./p8p_cyclogram_column_lines"; //Линии колонок таблицы
|
||
|
||
//-----------
|
||
//Тело модуля
|
||
//-----------
|
||
|
||
//Заголовок
|
||
const P8PCyclogramHeader = ({ columns, shift, maxWidth, maxHeight, columnRenderer, headerBlock }) => {
|
||
//Инициализируем старт текущей колонки
|
||
let prevColumnEnd = 0;
|
||
return (
|
||
<g className="header" ref={headerBlock}>
|
||
<rect x="0" y="0" width={maxWidth} height={NDEFAULT_HEADER_HEIGHT} fill="#ffffff" stroke="#e0e0e0" strokeWidth="1.4"></rect>
|
||
{columns.map((column, index) => {
|
||
//Аккумулируем окончание последней колонки с учетом сдвига
|
||
prevColumnEnd = index !== 0 ? prevColumnEnd + (columns[index - 1].end - columns[index - 1].start) * shift : 0;
|
||
return (
|
||
<P8PCyclogramHeaderColumn
|
||
column={column}
|
||
shift={shift}
|
||
start={prevColumnEnd}
|
||
maxHeight={maxHeight}
|
||
lastElement={columns.length - 1 === index}
|
||
columnRenderer={columnRenderer}
|
||
key={index}
|
||
/>
|
||
);
|
||
})}
|
||
<g className="columnsDividers">
|
||
<P8PCyclogramColumnsLines columns={columns} shift={shift} y1={0} y2={NDEFAULT_HEADER_HEIGHT} />
|
||
</g>
|
||
</g>
|
||
);
|
||
};
|
||
|
||
//Контроль свойств - Заголовок
|
||
P8PCyclogramHeader.propTypes = {
|
||
columns: PropTypes.array.isRequired,
|
||
shift: PropTypes.number.isRequired,
|
||
maxWidth: PropTypes.number.isRequired,
|
||
maxHeight: PropTypes.number.isRequired,
|
||
columnRenderer: PropTypes.func,
|
||
headerBlock: PropTypes.object
|
||
};
|
||
|
||
//----------------
|
||
//Интерфейс модуля
|
||
//----------------
|
||
|
||
export { P8PCyclogramHeader };
|