50 lines
1.2 KiB
JavaScript

import { Flex, Typography, Tag, Space } from 'antd'
import PropTypes from 'prop-types'
const { Text } = Typography
const NetGrossDisplay = ({ value, prefix = '', suffix = '' }) => {
const net = parseFloat(value?.net)
const gross = parseFloat(value?.gross)
return (
<Flex gap={'middle'} align='center' style={{ height: '100%' }}>
<Flex wrap>
<Text style={{ marginRight: 4 }}>
{net != null && net !== '' ? (
prefix + net.toFixed(2).toString() + suffix
) : (
<Text type='secondary'>n/a</Text>
)}
</Text>
<Space>
<Tag>Net</Tag>
</Space>
</Flex>
<Flex wrap>
<Text style={{ marginRight: 4 }}>
{gross != null && gross !== '' ? (
prefix + gross.toFixed(2).toString() + suffix
) : (
<Text type='secondary'>n/a</Text>
)}
</Text>
<Space>
<Tag>Gross</Tag>
</Space>
</Flex>
</Flex>
)
}
NetGrossDisplay.propTypes = {
value: PropTypes.shape({
net: PropTypes.number,
gross: PropTypes.number
}),
prefix: PropTypes.string,
suffix: PropTypes.string
}
export default NetGrossDisplay