forked from CITKParus/P8-Panels
main #2
@ -78,10 +78,22 @@ const P8P_GANTT_TASK_COLOR_SHAPE = PropTypes.shape({
|
|||||||
desc: PropTypes.string.isRequired
|
desc: PropTypes.string.isRequired
|
||||||
});
|
});
|
||||||
|
|
||||||
|
//Высота заголовка
|
||||||
|
const TITLE_HEIGHT = "44px";
|
||||||
|
|
||||||
|
//Высота панели масштабирования
|
||||||
|
const ZOOM_HEIGHT = "56px";
|
||||||
|
|
||||||
//Стили
|
//Стили
|
||||||
const STYLES = {
|
const STYLES = {
|
||||||
TASK_EDITOR_CONTENT: { minWidth: 400, overflowX: "auto" },
|
TASK_EDITOR_CONTENT: { minWidth: 400, overflowX: "auto" },
|
||||||
TASK_EDITOR_LIST: { width: "100%", minWidth: 300, maxWidth: 700, bgcolor: "background.paper" }
|
TASK_EDITOR_LIST: { width: "100%", minWidth: 300, maxWidth: 700, bgcolor: "background.paper" },
|
||||||
|
GANTT_TITLE: { height: TITLE_HEIGHT },
|
||||||
|
GANTT_ZOOM: { height: ZOOM_HEIGHT },
|
||||||
|
GANTT: (noData, title, zoomBar) => ({
|
||||||
|
height: `calc(100% - ${zoomBar ? ZOOM_HEIGHT : "0px"} - ${title ? TITLE_HEIGHT : "0px"})`,
|
||||||
|
display: noData ? "none" : ""
|
||||||
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
//--------------------------------
|
//--------------------------------
|
||||||
@ -318,7 +330,7 @@ P8PGanttTaskEditor.propTypes = {
|
|||||||
|
|
||||||
//Диаграмма Ганта
|
//Диаграмма Ганта
|
||||||
const P8PGantt = ({
|
const P8PGantt = ({
|
||||||
height,
|
containerStyle,
|
||||||
title,
|
title,
|
||||||
titleStyle,
|
titleStyle,
|
||||||
onTitleClick,
|
onTitleClick,
|
||||||
@ -408,10 +420,16 @@ const P8PGantt = ({
|
|||||||
|
|
||||||
//Генерация содержимого
|
//Генерация содержимого
|
||||||
return (
|
return (
|
||||||
<div>
|
<div style={{ ...(containerStyle ? containerStyle : {}) }}>
|
||||||
{state.gantt && state.noData ? <P8PAppInlineError text={noDataFoundText} /> : null}
|
{state.gantt && state.noData ? <P8PAppInlineError text={noDataFoundText} /> : null}
|
||||||
{state.gantt && !state.noData && title ? (
|
{state.gantt && !state.noData && title ? (
|
||||||
<Typography p={1} sx={{ ...(titleStyle ? titleStyle : {}) }} align="center" color="textSecondary" variant="subtitle1">
|
<Typography
|
||||||
|
p={1}
|
||||||
|
sx={{ ...STYLES.GANTT_TITLE, ...(titleStyle ? titleStyle : {}) }}
|
||||||
|
align="center"
|
||||||
|
color="textSecondary"
|
||||||
|
variant="subtitle1"
|
||||||
|
>
|
||||||
{onTitleClick ? (
|
{onTitleClick ? (
|
||||||
<Link component="button" variant="body2" underline="hover" onClick={() => onTitleClick()}>
|
<Link component="button" variant="body2" underline="hover" onClick={() => onTitleClick()}>
|
||||||
{title}
|
{title}
|
||||||
@ -422,7 +440,7 @@ const P8PGantt = ({
|
|||||||
</Typography>
|
</Typography>
|
||||||
) : null}
|
) : null}
|
||||||
{state.gantt && !state.noData && zoomBar ? (
|
{state.gantt && !state.noData && zoomBar ? (
|
||||||
<Box p={1}>
|
<Box p={1} sx={STYLES.GANTT_ZOOM}>
|
||||||
<IconButton onClick={() => handleZoomChange(-1)} disabled={state.zoom == 0}>
|
<IconButton onClick={() => handleZoomChange(-1)} disabled={state.zoom == 0}>
|
||||||
<Icon>zoom_in</Icon>
|
<Icon>zoom_in</Icon>
|
||||||
</IconButton>
|
</IconButton>
|
||||||
@ -450,7 +468,7 @@ const P8PGantt = ({
|
|||||||
cancelBtnCaption={cancelTaskEditorBtnCaption}
|
cancelBtnCaption={cancelTaskEditorBtnCaption}
|
||||||
/>
|
/>
|
||||||
) : null}
|
) : null}
|
||||||
<div style={{ height, display: state.noData ? "none" : "" }}>
|
<div style={STYLES.GANTT(state.noData, title, zoomBar)}>
|
||||||
<svg id="__gantt__" width="100%"></svg>
|
<svg id="__gantt__" width="100%"></svg>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -459,7 +477,7 @@ const P8PGantt = ({
|
|||||||
|
|
||||||
//Контроль свойств - Диаграмма Ганта
|
//Контроль свойств - Диаграмма Ганта
|
||||||
P8PGantt.propTypes = {
|
P8PGantt.propTypes = {
|
||||||
height: PropTypes.string.isRequired,
|
containerStyle: PropTypes.object,
|
||||||
title: PropTypes.string,
|
title: PropTypes.string,
|
||||||
titleStyle: PropTypes.object,
|
titleStyle: PropTypes.object,
|
||||||
onTitleClick: PropTypes.func,
|
onTitleClick: PropTypes.func,
|
||||||
|
Loading…
x
Reference in New Issue
Block a user