48 lines
1.1 KiB
JavaScript
48 lines
1.1 KiB
JavaScript
import { makeStyles } from '@material-ui/core'
|
|
import React, { memo, useState } from 'react'
|
|
|
|
import { CashOut } from 'src/components/inputs/cashbox/Cashbox'
|
|
|
|
import { NumberInput } from '../base'
|
|
const useStyles = makeStyles({
|
|
flex: {
|
|
display: 'flex'
|
|
},
|
|
cashCassette: {
|
|
width: 80,
|
|
height: 36,
|
|
marginRight: 16
|
|
}
|
|
})
|
|
|
|
const CashCassetteInput = memo(({ decimalPlaces, threshold, ...props }) => {
|
|
const classes = useStyles()
|
|
const { name, onChange, onBlur, value } = props.field
|
|
const { touched, errors } = props.form
|
|
const [notes, setNotes] = useState(value)
|
|
const error = !!(touched[name] && errors[name])
|
|
return (
|
|
<div className={classes.flex}>
|
|
<CashOut
|
|
className={classes.cashCassette}
|
|
notes={notes}
|
|
editingMode={true}
|
|
threshold={threshold}
|
|
/>
|
|
<NumberInput
|
|
name={name}
|
|
onChange={e => {
|
|
setNotes(e.target.value)
|
|
return onChange(e)
|
|
}}
|
|
onBlur={onBlur}
|
|
value={value}
|
|
error={error}
|
|
decimalPlaces={decimalPlaces}
|
|
{...props}
|
|
/>
|
|
</div>
|
|
)
|
|
})
|
|
|
|
export default CashCassetteInput
|