diff --git a/new-lamassu-admin/src/components/editableTable/Row.js b/new-lamassu-admin/src/components/editableTable/Row.js index 8bee37d8..8e224934 100644 --- a/new-lamassu-admin/src/components/editableTable/Row.js +++ b/new-lamassu-admin/src/components/editableTable/Row.js @@ -120,6 +120,7 @@ const ActionCol = ({ disabled, editing }) => { const ECol = ({ editing, focus, config, extraPaddingRight, extraPadding }) => { const { name, + names, bypassField, input, editable = true, @@ -128,6 +129,8 @@ const ECol = ({ editing, focus, config, extraPaddingRight, extraPadding }) => { width, textAlign, editingAlign = textAlign, + prefix, + PrefixComponent = Label2, suffix, SuffixComponent = Label2, textStyle = it => {}, @@ -136,6 +139,8 @@ const ECol = ({ editing, focus, config, extraPaddingRight, extraPadding }) => { inputProps = {} } = config + const fields = names ?? [name] + const { values } = useFormikContext() const isEditable = editable => { if (typeof editable === 'function') return editable(values) @@ -159,36 +164,48 @@ const ECol = ({ editing, focus, config, extraPaddingRight, extraPadding }) => { } return ( - - {isEditing && isField && !isHidden(values) && ( - - )} - {isEditing && !isField && !isHidden(values) && ( - - )} - {!isEditing && values && !isHidden(values) && ( -
- {view(values[name], values)} -
- )} - {suffix && !isHidden(values) && ( - - {suffix} - - )} - {isHidden(values) && } - +
+ {R.map(f => ( + + {prefix && !isHidden(values) && ( + + {typeof prefix === 'function' ? prefix(f) : prefix} + + )} + {isEditing && isField && !isHidden(values) && ( + + )} + {isEditing && !isField && !isHidden(values) && ( + + )} + {!isEditing && values && !isHidden(values) && ( +
+ {view(values[f], values)} +
+ )} + {suffix && !isHidden(values) && ( + + {suffix} + + )} + {isHidden(values) && } + + ))(fields)} +
) } diff --git a/new-lamassu-admin/src/components/editableTable/Row.styles.js b/new-lamassu-admin/src/components/editableTable/Row.styles.js index bd593a66..48c7a8f4 100644 --- a/new-lamassu-admin/src/components/editableTable/Row.styles.js +++ b/new-lamassu-admin/src/components/editableTable/Row.styles.js @@ -25,6 +25,21 @@ export default { suffix: { margin: [[0, 0, 0, 7]] }, + withPrefix: ({ textAlign }) => { + const justifyContent = textAlign === 'right' ? 'flex-end' : textAlign + return { + display: 'flex', + alignItems: 'center', + justifyContent + } + }, + prefix: { + margin: [[0, 7, 0, 0]] + }, size: ({ size }) => bySize(size), - bold + bold, + fields: { + display: 'flex', + flexDirection: 'column' + } } diff --git a/new-lamassu-admin/src/pages/Cashout/helper.js b/new-lamassu-admin/src/pages/Cashout/helper.js index 199e7751..f9dea41d 100644 --- a/new-lamassu-admin/src/pages/Cashout/helper.js +++ b/new-lamassu-admin/src/pages/Cashout/helper.js @@ -14,8 +14,7 @@ const widthsByNumberOfCassettes = { 4: { machine: 195, cassette: 190 }, 5: { machine: 175, cassette: 155 }, 6: { machine: 170, cassette: 130 }, - 7: { machine: 140, cassette: 125 }, - 8: { machine: 120, cassette: 125 } + 7: { machine: 140, cassette: 125 } } const DenominationsSchema = Yup.object().shape({ @@ -41,6 +40,42 @@ const DenominationsSchema = Yup.object().shape({ .min(1) .max(CURRENCY_MAX) .nullable() + .transform(transformNumber), + stacker1f: Yup.number() + .label('Stacker 1') + .min(1) + .max(CURRENCY_MAX) + .nullable() + .transform(transformNumber), + stacker1r: Yup.number() + .label('Stacker 1') + .min(1) + .max(CURRENCY_MAX) + .nullable() + .transform(transformNumber), + stacker2f: Yup.number() + .label('Stacker 2') + .min(1) + .max(CURRENCY_MAX) + .nullable() + .transform(transformNumber), + stacker2r: Yup.number() + .label('Stacker 2') + .min(1) + .max(CURRENCY_MAX) + .nullable() + .transform(transformNumber), + stacker3f: Yup.number() + .label('Stacker 3') + .min(1) + .max(CURRENCY_MAX) + .nullable() + .transform(transformNumber), + stacker3r: Yup.number() + .label('Stacker 3') + .min(1) + .max(CURRENCY_MAX) + .nullable() .transform(transformNumber) }) @@ -55,7 +90,7 @@ const getElements = (machines, locale = {}, classes) => { 0 ) const maxNumberOfCashUnits = Math.max( - ...R.map(it => it.numberOfCassettes + it.numberOfStackers * 2, machines), + ...R.map(it => it.numberOfCassettes + it.numberOfStackers, machines), 0 ) @@ -96,7 +131,7 @@ const getElements = (machines, locale = {}, classes) => { view: it => it, input: options?.length > 0 ? Autocomplete : NumberInput, inputProps: cassetteProps, - doubleHeader: 'Denominations', + doubleHeader: 'Denominations of Cassettes & Recyclers', isHidden: machine => it > machines.find(({ deviceId }) => deviceId === machine.id) @@ -110,44 +145,24 @@ const getElements = (machines, locale = {}, classes) => { R.until( R.gt(R.__, maxNumberOfStackers), it => { - elements.push( - { - name: `stacker${it}f`, - header: `Stacker ${it}F`, - size: 'sm', - stripe: true, - textAlign: 'right', - width: widthsByNumberOfCassettes[maxNumberOfCashUnits]?.cassette, - suffix: fiatCurrency, - bold: bold, - view: it => it, - input: options?.length > 0 ? Autocomplete : NumberInput, - inputProps: cassetteProps, - doubleHeader: 'Denominations', - isHidden: machine => - it > - machines.find(({ deviceId }) => deviceId === machine.id) - .numberOfStackers - }, - { - name: `stacker${it}r`, - header: `Stacker ${it}R`, - size: 'sm', - stripe: true, - textAlign: 'right', - width: widthsByNumberOfCassettes[maxNumberOfCashUnits]?.cassette, - suffix: fiatCurrency, - bold: bold, - view: it => it, - input: options?.length > 0 ? Autocomplete : NumberInput, - inputProps: cassetteProps, - doubleHeader: 'Denominations', - isHidden: machine => - it > - machines.find(({ deviceId }) => deviceId === machine.id) - .numberOfStackers - } - ) + elements.push({ + names: [`stacker${it}f`, `stacker${it}r`], + header: `Stacker ${it}`, + size: 'sm', + stripe: true, + textAlign: 'right', + width: widthsByNumberOfCassettes[maxNumberOfCashUnits]?.cassette, + prefix: it => (R.last(it) === 'f' ? 'F' : 'R'), + suffix: fiatCurrency, + bold: bold, + input: options?.length > 0 ? Autocomplete : NumberInput, + inputProps: cassetteProps, + doubleHeader: 'Denominations of Cassettes & Recyclers', + isHidden: machine => + it > + machines.find(({ deviceId }) => deviceId === machine.id) + .numberOfStackers + }) return R.add(1, it) }, 1