c6a95b0d |
import React from 'react';
import { Rectangle } from 'recharts';
import theme from '../theme';
export default class Job extends React.PureComponent {
render() {
const {
x,
y,
payload: {
formerStartTime,
formerEndTime,
startTime,
endTime
},
xAxis: {
niceTicks,
width: axisWidth
}
} = this.props;
if (!endTime) return null;
const duration = Math.abs(endTime - startTime);
if (!duration) return null;
const formerDuration = Math.abs(
(typeof formerEndTime === 'undefined' ? endTime : formerEndTime)
- (typeof formerStartTime === 'undefined' ? startTime : formerStartTime)
);
const width = (axisWidth / (niceTicks.length - 1)) * duration;
const height = theme.gantt.job.height;
return <Box x={x + 5} y={y + 5} width={width} height={height} text={formerDuration} />
}
}
class Box extends React.PureComponent {
render() {
const { x, y, width, height, text } = this.props;
const { fill, stroke, textColor } = theme.gantt.job;
return (
<React.Fragment>
<Rectangle x={x} y={y - (height / 2)} width={width} height={height} fill={fill} stroke={stroke} />
<text x={x + (width / 2)} y={y} textAnchor="middle" alignmentBaseline="central" fill={textColor}>{text}</text>
</React.Fragment>
);
}
} |