Sha256: 9f8d2f06ac5ef2c666910a3c5b9c4664a71d9ea1a7af8b7cf48d5955f3c65a22
Contents?: true
Size: 1.26 KB
Versions: 59
Compression:
Stored size: 1.26 KB
Contents
import React from 'react';
import PropTypes from 'prop-types';
import { Grid, DonutChart } from 'patternfly-react';
import { translate as __ } from 'foremanReact/common/I18n';
import './statusChart.scss';
const StatusChart = ({ completed }) => {
const donutConfigData = {
columns: [
[__('Completed'), completed],
[__('Remain'), 100 - completed],
],
order: null,
};
const pfGetUtilizationDonutTooltipContents = d => {
const {
0: { name, value },
} = d;
return `<span class="donut-tooltip-pf" style="white-space: nowrap;">${value}% ${name}</span>`;
};
const donutConfigTooltip = {
contents: pfGetUtilizationDonutTooltipContents,
};
return (
<Grid.Col sm={4}>
<div className="status-chart">
<DonutChart
id="donut-chart-1"
size={{
width: 210,
height: 210,
}}
data={donutConfigData}
tooltip={donutConfigTooltip}
title={{
type: 'percent',
primary: `${completed}%`,
secondary: __('Completed'),
}}
/>
</div>
</Grid.Col>
);
};
StatusChart.propTypes = {
completed: PropTypes.number,
};
StatusChart.defaultProps = {
completed: 0,
};
export default StatusChart;
Version data entries
59 entries across 59 versions & 1 rubygems