forked from ddrilling/asb_cloud_front
42 lines
1.3 KiB
JavaScript
42 lines
1.3 KiB
JavaScript
import {ValueDisplay} from '../../components/Display'
|
||
import {ControlOutlined} from '@ant-design/icons'
|
||
import {Popover} from 'antd'
|
||
|
||
export const ChartTimeOnlineFooter = ({ data, lineGroup }) => {
|
||
const getFooterData = (name) => {
|
||
const dataIdx = data && lineGroup?.find(line => line?.footer === name)?.xAccessorName
|
||
return (<ValueDisplay value={data?.[dataIdx]}/>)
|
||
}
|
||
|
||
let spValues = getFooterData('SP')
|
||
const idleValues = getFooterData('IDLE')
|
||
|
||
const popContent = lineGroup?.filter(line => line.footer === true).map(line => (
|
||
<div key={line.label}>
|
||
{line.label}
|
||
<ValueDisplay value={data?.[line.xAccessorName]}/>
|
||
</div>
|
||
))
|
||
|
||
return(
|
||
<div>
|
||
{popContent?.length > 0 ? (
|
||
<Popover content={popContent}>
|
||
<div className={'chart-footer'}>
|
||
<ControlOutlined className={'display_label'}/>
|
||
<div style={{display: 'flex', flexDirection: 'column'}}>{spValues}</div>
|
||
</div>
|
||
</Popover>
|
||
) : (
|
||
<div style={{display: 'flex', justifyContent: 'flex-end'}}>
|
||
<div style={{display: 'flex', flexDirection: 'column'}}>{spValues}</div>
|
||
</div>
|
||
)}
|
||
<div style={{display: 'flex'}}>
|
||
<span className='display_label'>х.х.</span>
|
||
<div style={{display: 'flex', flexDirection: 'column'}}>{idleValues}</div>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|