/*
Парус 8 - Панели мониторинга - РО - Редактор настройки регламентированного отчёта
Дополнительная разметка и вёрстка клиентских элементов
*/
//---------------------
//Подключение библиотек
//---------------------
import React, { useState } from "react"; //Классы React
import PropTypes from "prop-types"; //Контроль свойств компонента
import {
IconButton,
Icon,
Link,
Card,
CardContent,
CardHeader,
Menu,
MenuItem,
Table,
TableRow,
TableCell,
TableBody,
Box,
Typography
} from "@mui/material"; //Интерфейсные компоненты
//---------
//Константы
//---------
//Стили
export const STYLES = {
BOX_ROW: { display: "flex", justifyContent: "center", alignItems: "center" },
LINK_STYLE: { component: "button", cursor: "pointer", width: "-webkit-fill-available" },
DATA_CELL: columnDef => ({
padding: "5px 5px",
fontSize: "0.775rem",
letterSpacing: "0.005em",
textAlign: "center",
wordBreak: "break-all",
backgroundColor: columnDef.name === "SROW_NAME" ? "#b4b4b4" : "trasparent"
}),
DATA_CELL_CARD: {
padding: "0px 3px 3px 0px",
border: "1px solid lightgrey",
borderRadius: "5%"
},
DATA_CELL_CARD_HEADER: {
padding: "0px"
},
DATA_CELL_CARD_SUBHEADER: {
textAlign: "left",
paddingLeft: "10px",
fontSize: "1rem",
fontWeight: "450"
},
DATA_CELL_CARD_CONTENT: listLength => {
return {
fontSize: "0.75rem",
padding: "5px 0px",
minHeight: "105px",
maxHeight: "105px",
overflowY: "auto",
"&::-webkit-scrollbar": {
width: "8px"
},
"&::-webkit-scrollbar-track": {
borderRadius: "8px",
backgroundColor: "#EBEBEB"
},
"&::-webkit-scrollbar-thumb": {
borderRadius: "8px",
backgroundColor: "#b4b4b4"
},
"&::-webkit-scrollbar-thumb:hover": {
backgroundColor: "#808080"
},
"&:last-child": {
paddingBottom: "0px"
},
...(listLength === 0 ? { display: "flex", justifyContent: "center", alignItems: "center" } : null)
};
},
DATA_CELL_CARD_CONTEXT_FONT: {
fontSize: "0.75rem"
},
DATA_CELL_CARD_CONTEXT_MARK: {
padding: "0px 0px 0px 10px",
borderBottom: "1px solid #EBEBEB"
},
DATA_CELL_CN: {
textOverflow: "ellipsis",
overflow: "hidden",
whiteSpace: "pre",
padding: "0px 5px",
maxWidth: "100px",
border: "none"
},
GRID_PANEL_CARD: { maxWidth: 400, flexDirection: "column", display: "flex" },
MARK_INFO: {
fontSize: "0.8rem",
textAlign: "left",
textOverflow: "ellipsis",
overflow: "hidden",
whiteSpace: "pre",
maxWidth: "max-content",
width: "-webkit-fill-available"
},
BUTTON_CN_INSERT: {
padding: "0px 8px",
marginBottom: "2px",
"& .MuiIcon-root": {
fontWeight: "bold",
fontSize: "1rem"
}
},
HEAD_CELL: {
backgroundColor: "#b4b4b4",
textAlign: "center"
},
HEAD_CELL_STACK: {
justifyContent: "space-around"
}
};
//------------------------------------
//Вспомогательные функции и компоненты
//------------------------------------
//Действия карты показателя
const DataCellCardActions = ({ columnDef, menuItems, cellData, markRn }) => {
//Собственное состояние
const [cardActions, setCardActions] = useState({ anchorMenuMethods: null, openMethods: false });
//По нажатию на открытие меню действий
const handleMethodsMenuButtonClick = event => {
setCardActions(pv => ({ ...pv, anchorMenuMethods: event.currentTarget, openMethods: true }));
};
//При закрытии меню
const handleMethodsMenuClose = () => {
setCardActions(pv => ({ ...pv, anchorMenuMethods: null, openMethods: false }));
};
return (