lamassu/lamassu-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix: broken header when horizontal scrolling

Browse source
This commit is contained in:
csrapr 2021-03-23 18:01:06 +00:00 • committed by Josh Harvey
parent 55a2ede718
commit ff4c7ed595
2 changed files with 11 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

4
new-lamassu-admin/src/pages/Machines/MachineComponents/Transactions/DataTable.js
View file

@ -104,7 +104,7 @@ const DataTable = ({
useEffect(() => setExpanded(initialExpanded), [initialExpanded]) useEffect(() => setExpanded(initialExpanded), [initialExpanded])
const coreWidth = R.compose(R.sum, R.map(R.prop('width')))(elements) const coreWidth = R.compose(R.sum, R.map(R.prop('width')))(elements)
const expWidth = 1000 - coreWidth const expWidth = 850 - coreWidth
const width = coreWidth + (expandable ? expWidth : 0) const width = coreWidth + (expandable ? expWidth : 0)
const classes = useStyles({ width }) const classes = useStyles({ width })
@ -166,7 +166,7 @@ const DataTable = ({
{() => ( {() => (
<List <List
// this has to be in a style because of how the component works // this has to be in a style because of how the component works
style={{ overflow: 'inherit', outline: 'none' }} style={{ overflowX: 'inherit', outline: 'none' }}
{...props} {...props}
height={data.length * 62 + extraHeight} height={data.length * 62 + extraHeight}
width={width} width={width}

16
new-lamassu-admin/src/pages/Machines/MachineComponents/Transactions/Transactions.js
View file

@ -50,6 +50,9 @@ const GET_TRANSACTIONS = gql`
customerIdCardPhotoPath customerIdCardPhotoPath
customerFrontCameraPath customerFrontCameraPath
customerPhone customerPhone
discount
customerId
isAnonymous
} }
} }
` `
@ -95,13 +98,13 @@ const Transactions = ({ id }) => {
const elements = [ const elements = [
{ {
header: '', header: '',
width: 62, width: 0,
size: 'sm', size: 'sm',
view: it => (it.txClass === 'cashOut' ? <TxOutIcon /> : <TxInIcon />) view: it => (it.txClass === 'cashOut' ? <TxOutIcon /> : <TxInIcon />)
}, },
{ {
header: 'Customer', header: 'Customer',
width: 162, width: 122,
size: 'sm', size: 'sm',
view: getCustomerDisplayName view: getCustomerDisplayName
}, },
@ -128,20 +131,20 @@ const Transactions = ({ id }) => {
className: classes.overflowTd, className: classes.overflowTd,
size: 'sm', size: 'sm',
textAlign: 'left', textAlign: 'left',
width: 170 width: 140
}, },
{ {
header: 'Date (UTC)', header: 'Date (UTC)',
view: it => moment.utc(it.created).format('YYYY-MM-DD'), view: it => moment.utc(it.created).format('YYYY-MM-DD'),
textAlign: 'left', textAlign: 'left',
size: 'sm', size: 'sm',
width: 150 width: 140
}, },
{ {
header: 'Status', header: 'Status',
view: it => getStatus(it), view: it => getStatus(it),
size: 'sm', size: 'sm',
width: 80 width: 20
} }
] ]
@ -162,8 +165,7 @@ const Transactions = ({ id }) => {
loading={loading || id === null} loading={loading || id === null}
emptyText="No transactions so far" emptyText="No transactions so far"
elements={elements} elements={elements}
// need to splice because back end query could return double NUM_LOG_RESULTS because it doesnt merge the txIn and the txOut results before applying the limit data={R.path(['transactions'])(txResponse)}
data={R.path(['transactions'])(txResponse)} // .splice(0,NUM_LOG_RESULTS)}
Details={DetailsRow} Details={DetailsRow}
expandable expandable
/> />