diff --git a/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.js b/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.js index 1fbd83cc..f41ddf82 100644 --- a/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.js +++ b/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.js @@ -3,11 +3,8 @@ import classnames from 'classnames' import React from 'react' import Chip from 'src/components/Chip' -import { Link } from 'src/components/buttons' import { Info2, Label1, Label2 } from 'src/components/typography' -import TextInputFormik from '../base/TextInput' - import { cashboxStyles, gridStyles } from './Cashbox.styles' const cashboxClasses = makeStyles(cashboxStyles) @@ -21,10 +18,11 @@ const Cashbox = ({ labelClassName, applyColorVariant, applyFiatBalanceAlertsStyling, - omitInnerPercentage + omitInnerPercentage, + isLow }) => { - const classes = cashboxClasses({ percent, cashOut, applyColorVariant }) - const threshold = 51 + const classes = cashboxClasses({ percent, cashOut, applyColorVariant, isLow }) + const ltHalf = percent <= 51 const showCashBox = { [classes.fiatBalanceAlertCashbox]: applyFiatBalanceAlertsStyling, @@ -34,12 +32,12 @@ const Cashbox = ({ return (
- {!omitInnerPercentage && percent <= threshold && ( + {!omitInnerPercentage && ltHalf && ( {percent.toFixed(0)}% )}
- {!omitInnerPercentage && percent > threshold && ( + {!omitInnerPercentage && !ltHalf && ( {percent.toFixed(0)}% )}
@@ -71,59 +69,28 @@ const CashIn = ({ currency, notes, total }) => { ) } -const CashInFormik = ({ - capacity = 1000, - onEmpty, - field: { - value: { notes, deviceId } - }, - form: { setFieldValue } -}) => { - const classes = gridClasses() - - return ( - <> -
-
- -
-
-
- { - onEmpty({ - variables: { - deviceId, - action: 'emptyCashInBills' - } - }).then(() => setFieldValue('cashin.notes', 0)) - }} - className={classes.link} - color={'primary'}> - Empty - -
-
-
- - ) -} - const CashOut = ({ capacity = 500, denomination = 0, currency, notes, className, - editingMode = false + editingMode = false, + threshold }) => { const percent = (100 * notes) / capacity + const isLow = percent < threshold const classes = gridClasses() return ( <>
- +
{!editingMode && (
@@ -146,42 +113,4 @@ const CashOut = ({ ) } -const CashOutFormik = ({ capacity = 500, ...props }) => { - const { - name, - onChange, - onBlur, - value: { notes } - } = props.field - const { touched, errors } = props.form - - const error = !!(touched[name] && errors[name]) - - const percent = (100 * notes) / capacity - const classes = gridClasses() - - return ( - <> -
-
- -
-
-
- -
-
-
- - ) -} - -export { Cashbox, CashIn, CashInFormik, CashOut, CashOutFormik } +export { Cashbox, CashIn, CashOut } diff --git a/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.styles.js b/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.styles.js index cebc8b4f..5556af4c 100644 --- a/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.styles.js +++ b/new-lamassu-admin/src/components/inputs/cashbox/Cashbox.styles.js @@ -11,10 +11,9 @@ const colors = { } } -const colorPicker = ({ percent, cashOut, applyColorVariant }) => { - if (applyColorVariant) return colors[cashOut ? 'cashOut' : 'cashIn'].full +const colorPicker = ({ cashOut, applyColorVariant, isLow }) => { return colors[cashOut ? 'cashOut' : 'cashIn'][ - percent >= 50 ? 'full' : 'empty' + applyColorVariant || !isLow ? 'full' : 'empty' ] } diff --git a/new-lamassu-admin/src/components/inputs/formik/CashCassetteInput.js b/new-lamassu-admin/src/components/inputs/formik/CashCassetteInput.js index 5002b0fb..80e82e77 100644 --- a/new-lamassu-admin/src/components/inputs/formik/CashCassetteInput.js +++ b/new-lamassu-admin/src/components/inputs/formik/CashCassetteInput.js @@ -15,7 +15,7 @@ const useStyles = makeStyles({ } }) -const CashCassetteInput = memo(({ decimalPlaces, ...props }) => { +const CashCassetteInput = memo(({ decimalPlaces, threshold, ...props }) => { const classes = useStyles() const { name, onChange, onBlur, value } = props.field const { touched, errors } = props.form @@ -27,6 +27,7 @@ const CashCassetteInput = memo(({ decimalPlaces, ...props }) => { className={classes.cashCassette} notes={notes} editingMode={true} + threshold={threshold} /> { - const data = { machine, config } const classes = useStyles() - const cashout = data?.config && fromNamespace('cashOut')(data.config) - const locale = data?.config && fromNamespace('locale')(data.config) + const cashout = config && fromNamespace('cashOut')(config) + const locale = config && fromNamespace('locale')(config) + const fillingPercentageSettings = + config && fromNamespace('notifications', config) const fiatCurrency = locale?.fiatCurrency const getCashoutSettings = deviceId => fromNamespace(deviceId)(cashout) @@ -93,6 +94,7 @@ const CashCassettes = ({ machine, config, refetchData }) => { denomination={getCashoutSettings(deviceId)?.top} currency={{ code: fiatCurrency }} notes={value} + threshold={fillingPercentageSettings.fillingPercentageCassette1} /> ), input: NumberInput, @@ -112,6 +114,7 @@ const CashCassettes = ({ machine, config, refetchData }) => { denomination={getCashoutSettings(deviceId)?.bottom} currency={{ code: fiatCurrency }} notes={value} + threshold={fillingPercentageSettings.fillingPercentageCassette2} /> ) }, diff --git a/new-lamassu-admin/src/pages/Maintenance/CashCassettes.js b/new-lamassu-admin/src/pages/Maintenance/CashCassettes.js index d138065c..d5d8d969 100644 --- a/new-lamassu-admin/src/pages/Maintenance/CashCassettes.js +++ b/new-lamassu-admin/src/pages/Maintenance/CashCassettes.js @@ -113,6 +113,7 @@ const CashCassettes = () => { const machines = R.path(['machines'])(data) ?? [] const config = R.path(['config'])(data) ?? {} + const fillingPercentageSettings = fromNamespace('notifications', config) const [setCassetteBills, { error }] = useMutation(SET_CASSETTE_BILLS, { refetchQueries: () => ['getData'] }) @@ -198,11 +199,13 @@ const CashCassettes = () => { denomination={getCashoutSettings(id)?.top} currency={{ code: fiatCurrency }} notes={value} + threshold={fillingPercentageSettings.fillingPercentageCassette1} /> ), input: CashCassetteInput, inputProps: { - decimalPlaces: 0 + decimalPlaces: 0, + threshold: fillingPercentageSettings.fillingPercentageCassette1 } }, { @@ -217,12 +220,14 @@ const CashCassettes = () => { denomination={getCashoutSettings(id)?.bottom} currency={{ code: fiatCurrency }} notes={value} + threshold={fillingPercentageSettings.fillingPercentageCassette2} /> ) }, input: CashCassetteInput, inputProps: { - decimalPlaces: 0 + decimalPlaces: 0, + threshold: fillingPercentageSettings.fillingPercentageCassette2 } }, {