seb/dashfront
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

u

Browse Source
This commit is contained in:
seb
2026-10-18 03:25:57 +02:00
parent dc73905a19
commit 1b4b31b016
3 changed files with 62 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/routes/infos/ArticleHistoryPage.jsx
View File

@@ -52,7 +52,7 @@ export function createDummyTestArticleHistory() {
const rowGridSx = { const rowGridSx = {
display: 'grid', display: 'grid',
gridTemplateColumns: gridTemplateColumns:
'minmax(60px, max-content) minmax(150px, max-content) minmax(120px, max-content) minmax(160px, 1.2fr) minmax(240px, 2fr) minmax(120px, max-content)', 'minmax(150px, max-content) minmax(130px, max-content) minmax(180px, 1.2fr) minmax(260px, 2fr)',
gridTemplateRows: '0px 1fr', gridTemplateRows: '0px 1fr',
rowGap: 0, rowGap: 0,
columnGap: 2, columnGap: 2,
@@ -86,23 +86,17 @@ function renderInvisibleDummyRow(dummy) {
return ( return (
<> <>
<Box aria-hidden sx={{ gridColumn: 1, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 1, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.id}</Typography>
</Box>
<Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{formatDateTime(d.date)}</Typography> <Typography variant="body2">{formatDateTime(d.date)}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.sku}</Typography> <Typography variant="body2">{d.sku}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.name}</Typography> <Typography variant="body2">{d.name}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 5, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.text}</Typography> <Typography variant="body2">{d.text}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 6, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.user}</Typography>
</Box>
</> </>
); );
} }
@@ -121,23 +115,17 @@ class ArticleHistoryRow extends PureComponent {
> >
{renderInvisibleDummyRow(dummy)} {renderInvisibleDummyRow(dummy)}
<Box sx={{ gridColumn: 1, gridRow: 2 }}> <Box sx={{ gridColumn: 1, gridRow: 2 }}>
<Skeleton variant="text" width="80%" height={20} /> <Skeleton variant="text" width="90%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 2, gridRow: 2 }}> <Box sx={{ gridColumn: 2, gridRow: 2 }}>
<Skeleton variant="text" width="90%" height={20} />
</Box>
<Box sx={{ gridColumn: 3, gridRow: 2 }}>
<Skeleton variant="text" width="85%" height={20} /> <Skeleton variant="text" width="85%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 4, gridRow: 2 }}> <Box sx={{ gridColumn: 3, gridRow: 2 }}>
<Skeleton variant="text" width="70%" height={20} /> <Skeleton variant="text" width="70%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 5, gridRow: 2 }}> <Box sx={{ gridColumn: 4, gridRow: 2 }}>
<Skeleton variant="text" width="90%" height={20} /> <Skeleton variant="text" width="90%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 6, gridRow: 2 }}>
<Skeleton variant="text" width="60%" height={20} />
</Box>
</ListItemButton> </ListItemButton>
); );
} }
@@ -163,19 +151,15 @@ class ArticleHistoryRow extends PureComponent {
> >
{renderInvisibleDummyRow(dummy)} {renderInvisibleDummyRow(dummy)}
{/* 1. Datum */}
<Box sx={{ gridColumn: 1, gridRow: 2, minWidth: 0 }}> <Box sx={{ gridColumn: 1, gridRow: 2, minWidth: 0 }}>
<Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}>
{item.id}
</Typography>
</Box>
<Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
<Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}> <Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}>
{formatDateTime(item.date || item.createdAt)} {formatDateTime(item.date || item.createdAt)}
</Typography> </Typography>
</Box> </Box>
<Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}> {/* 2. SKU */}
<Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
{item.sku ? ( {item.sku ? (
<Typography <Typography
variant="body2" variant="body2"
@@ -203,25 +187,21 @@ class ArticleHistoryRow extends PureComponent {
)} )}
</Box> </Box>
<Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0 }}> {/* 3. Artikelname */}
<Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}>
<Typography variant="body2" sx={{ fontWeight: 500, ...ellipsisSx }}> <Typography variant="body2" sx={{ fontWeight: 500, ...ellipsisSx }}>
{item.name || item.articlename || '–'} {item.name || item.articlename || '–'}
</Typography> </Typography>
</Box> </Box>
<Box sx={{ gridColumn: 5, gridRow: 2, minWidth: 0 }}> {/* 4. Änderung / Ereignis */}
<Tooltip title={item.text || item.message || ''} placement="top-start" enterDelay={500}> <Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0 }}>
<Tooltip title={item.historytext || item.text || item.message || ''} placement="top-start" enterDelay={500}>
<Typography variant="body2" sx={ellipsisSx}> <Typography variant="body2" sx={ellipsisSx}>
{item.text || item.message || '–'} {item.historytext || item.text || item.message || '–'}
</Typography> </Typography>
</Tooltip> </Tooltip>
</Box> </Box>
<Box sx={{ gridColumn: 6, gridRow: 2, minWidth: 0 }}>
<Typography variant="body2" color="text.secondary" sx={ellipsisSx}>
{userName}
</Typography>
</Box>
</ListItemButton> </ListItemButton>
); );
} }
@@ -525,12 +505,10 @@ export default class ArticleHistoryPage extends PureComponent {
}} }}
> >
{renderInvisibleDummyRow(this.headerItem)} {renderInvisibleDummyRow(this.headerItem)}
<Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>ID</Box> <Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>Datum</Box>
<Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Datum</Box> <Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Artikel-Nr.</Box>
<Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Artikel-Nr.</Box> <Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Artikelname</Box>
<Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx }}>Artikelname</Box> <Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx }}>Änderung / Ereignis</Box>
<Box sx={{ gridColumn: 5, gridRow: 2, ...headerCellSx }}>Änderung / Ereignis</Box>
<Box sx={{ gridColumn: 6, gridRow: 2, ...headerCellSx }}>Benutzer</Box>
</Box> </Box>
} }
onPageChange={this.handlePageChange} onPageChange={this.handlePageChange}

58
src/routes/infos/GlobalHistoryPage.jsx
View File

@@ -52,7 +52,7 @@ export function createDummyTestGlobalHistory() {
const rowGridSx = { const rowGridSx = {
display: 'grid', display: 'grid',
gridTemplateColumns: gridTemplateColumns:
'minmax(60px, max-content) minmax(150px, max-content) minmax(110px, max-content) minmax(140px, max-content) minmax(240px, 2fr) minmax(120px, max-content)', 'minmax(150px, max-content) minmax(110px, max-content) minmax(140px, max-content) minmax(240px, 1fr)',
gridTemplateRows: '0px 1fr', gridTemplateRows: '0px 1fr',
rowGap: 0, rowGap: 0,
columnGap: 2, columnGap: 2,
@@ -86,23 +86,17 @@ function renderInvisibleDummyRow(dummy) {
return ( return (
<> <>
<Box aria-hidden sx={{ gridColumn: 1, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 1, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.id}</Typography>
</Box>
<Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{formatDateTime(d.date)}</Typography> <Typography variant="body2">{formatDateTime(d.date)}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.type}</Typography> <Typography variant="body2">{d.type}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.reference}</Typography> <Typography variant="body2">{d.reference}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 5, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.text}</Typography> <Typography variant="body2">{d.text}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 6, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.user}</Typography>
</Box>
</> </>
); );
} }
@@ -121,23 +115,17 @@ class GlobalHistoryRow extends PureComponent {
> >
{renderInvisibleDummyRow(dummy)} {renderInvisibleDummyRow(dummy)}
<Box sx={{ gridColumn: 1, gridRow: 2 }}> <Box sx={{ gridColumn: 1, gridRow: 2 }}>
<Skeleton variant="text" width="80%" height={20} /> <Skeleton variant="text" width="90%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 2, gridRow: 2 }}> <Box sx={{ gridColumn: 2, gridRow: 2 }}>
<Skeleton variant="text" width="90%" height={20} />
</Box>
<Box sx={{ gridColumn: 3, gridRow: 2 }}>
<Skeleton variant="rounded" width={70} height={22} /> <Skeleton variant="rounded" width={70} height={22} />
</Box> </Box>
<Box sx={{ gridColumn: 4, gridRow: 2 }}> <Box sx={{ gridColumn: 3, gridRow: 2 }}>
<Skeleton variant="text" width="80%" height={20} /> <Skeleton variant="text" width="80%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 5, gridRow: 2 }}> <Box sx={{ gridColumn: 4, gridRow: 2 }}>
<Skeleton variant="text" width="90%" height={20} /> <Skeleton variant="text" width="90%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 6, gridRow: 2 }}>
<Skeleton variant="text" width="60%" height={20} />
</Box>
</ListItemButton> </ListItemButton>
); );
} }
@@ -167,19 +155,15 @@ class GlobalHistoryRow extends PureComponent {
> >
{renderInvisibleDummyRow(dummy)} {renderInvisibleDummyRow(dummy)}
{/* 1. Datum */}
<Box sx={{ gridColumn: 1, gridRow: 2, minWidth: 0 }}> <Box sx={{ gridColumn: 1, gridRow: 2, minWidth: 0 }}>
<Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}>
{item.id}
</Typography>
</Box>
<Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
<Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}> <Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}>
{formatDateTime(item.date || item.createdAt)} {formatDateTime(item.date || item.createdAt)}
</Typography> </Typography>
</Box> </Box>
<Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}> {/* 2. Typ */}
<Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
<Chip <Chip
size="small" size="small"
label={typeStr} label={typeStr}
@@ -193,7 +177,8 @@ class GlobalHistoryRow extends PureComponent {
/> />
</Box> </Box>
<Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0 }}> {/* 3. Referenz / Key */}
<Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}>
{isArticle ? ( {isArticle ? (
<Typography <Typography
variant="body2" variant="body2"
@@ -221,19 +206,14 @@ class GlobalHistoryRow extends PureComponent {
)} )}
</Box> </Box>
<Box sx={{ gridColumn: 5, gridRow: 2, minWidth: 0 }}> {/* 4. Meldung / Beschreibung */}
<Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0 }}>
<Tooltip title={item.text || item.value || ''} placement="top-start" enterDelay={500}> <Tooltip title={item.text || item.value || ''} placement="top-start" enterDelay={500}>
<Typography variant="body2" sx={ellipsisSx}> <Typography variant="body2" sx={ellipsisSx}>
{item.text || item.value || '–'} {item.text || item.value || '–'}
</Typography> </Typography>
</Tooltip> </Tooltip>
</Box> </Box>
<Box sx={{ gridColumn: 6, gridRow: 2, minWidth: 0 }}>
<Typography variant="body2" color="text.secondary" sx={ellipsisSx}>
{userName}
</Typography>
</Box>
</ListItemButton> </ListItemButton>
); );
} }
@@ -537,12 +517,10 @@ export default class GlobalHistoryPage extends PureComponent {
}} }}
> >
{renderInvisibleDummyRow(this.headerItem)} {renderInvisibleDummyRow(this.headerItem)}
<Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>ID</Box> <Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>Datum</Box>
<Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Datum</Box> <Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Typ</Box>
<Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Typ</Box> <Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Referenz / Key</Box>
<Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx }}>Referenz / Key</Box> <Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx }}>Meldung / Beschreibung</Box>
<Box sx={{ gridColumn: 5, gridRow: 2, ...headerCellSx }}>Meldung / Beschreibung</Box>
<Box sx={{ gridColumn: 6, gridRow: 2, ...headerCellSx }}>Benutzer</Box>
</Box> </Box>
} }
onPageChange={this.handlePageChange} onPageChange={this.handlePageChange}

80
src/routes/infos/LedgerHistoryPage.jsx
View File

@@ -53,7 +53,7 @@ export function createDummyTestLedgerHistory() {
const rowGridSx = { const rowGridSx = {
display: 'grid', display: 'grid',
gridTemplateColumns: gridTemplateColumns:
'minmax(60px, max-content) minmax(150px, max-content) minmax(110px, max-content) minmax(130px, max-content) minmax(90px, max-content) minmax(220px, 2fr) minmax(120px, max-content)', 'minmax(150px, max-content) minmax(110px, max-content) minmax(130px, max-content) minmax(90px, max-content) minmax(220px, 1fr)',
gridTemplateRows: '0px 1fr', gridTemplateRows: '0px 1fr',
rowGap: 0, rowGap: 0,
columnGap: 2, columnGap: 2,
@@ -87,26 +87,20 @@ function renderInvisibleDummyRow(dummy) {
return ( return (
<> <>
<Box aria-hidden sx={{ gridColumn: 1, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 1, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.id}</Typography>
</Box>
<Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{formatDateTime(d.created_at || d.date)}</Typography> <Typography variant="body2">{formatDateTime(d.created_at || d.date)}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.transaction_type}</Typography> <Typography variant="body2">{d.transaction_type}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.sku}</Typography> <Typography variant="body2">{d.sku}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 5, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">+{d.amount}</Typography> <Typography variant="body2">+{d.amount}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 6, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}> <Box aria-hidden sx={{ gridColumn: 5, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.transaction_text}</Typography> <Typography variant="body2">{d.transaction_text}</Typography>
</Box> </Box>
<Box aria-hidden sx={{ gridColumn: 7, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
<Typography variant="body2">{d.user}</Typography>
</Box>
</> </>
); );
} }
@@ -137,26 +131,20 @@ class LedgerHistoryRow extends PureComponent {
> >
{renderInvisibleDummyRow(dummy)} {renderInvisibleDummyRow(dummy)}
<Box sx={{ gridColumn: 1, gridRow: 2 }}> <Box sx={{ gridColumn: 1, gridRow: 2 }}>
<Skeleton variant="text" width="80%" height={20} /> <Skeleton variant="text" width="90%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 2, gridRow: 2 }}> <Box sx={{ gridColumn: 2, gridRow: 2 }}>
<Skeleton variant="text" width="90%" height={20} />
</Box>
<Box sx={{ gridColumn: 3, gridRow: 2 }}>
<Skeleton variant="rounded" width={70} height={22} /> <Skeleton variant="rounded" width={70} height={22} />
</Box> </Box>
<Box sx={{ gridColumn: 4, gridRow: 2 }}> <Box sx={{ gridColumn: 3, gridRow: 2 }}>
<Skeleton variant="text" width="80%" height={20} /> <Skeleton variant="text" width="80%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 5, gridRow: 2 }}> <Box sx={{ gridColumn: 4, gridRow: 2 }}>
<Skeleton variant="text" width="70%" height={20} /> <Skeleton variant="text" width="70%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 6, gridRow: 2 }}> <Box sx={{ gridColumn: 5, gridRow: 2 }}>
<Skeleton variant="text" width="90%" height={20} /> <Skeleton variant="text" width="90%" height={20} />
</Box> </Box>
<Box sx={{ gridColumn: 7, gridRow: 2 }}>
<Skeleton variant="text" width="60%" height={20} />
</Box>
</ListItemButton> </ListItemButton>
); );
} }
@@ -195,27 +183,15 @@ class LedgerHistoryRow extends PureComponent {
> >
{renderInvisibleDummyRow(dummy)} {renderInvisibleDummyRow(dummy)}
{/* 1. ID */} {/* 1. Datum */}
<Box sx={{ gridColumn: 1, gridRow: 2, minWidth: 0 }}> <Box sx={{ gridColumn: 1, gridRow: 2, minWidth: 0 }}>
<Typography
variant="body2"
color="text.secondary"
title={item.prev_hash ? `Hash-Version: ${item.hash_version ?? 1}\nVorheriger Hash: ${item.prev_hash}` : undefined}
sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}
>
{item.id}
</Typography>
</Box>
{/* 2. Datum */}
<Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
<Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}> <Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}>
{formatDateTime(item.created_at || item.date || item.createdAt)} {formatDateTime(item.created_at || item.date || item.createdAt)}
</Typography> </Typography>
</Box> </Box>
{/* 3. Typ */} {/* 2. Typ */}
<Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}> <Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
<Chip <Chip
size="small" size="small"
label={typeLabel} label={typeLabel}
@@ -229,13 +205,14 @@ class LedgerHistoryRow extends PureComponent {
/> />
</Box> </Box>
{/* 4. SKU */} {/* 3. SKU */}
<Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0 }}> <Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}>
{hasSku ? ( {hasSku ? (
<Typography <Typography
variant="body2" variant="body2"
component="a" component="a"
href={`/artikel/${encodeURIComponent(sku)}`} href={`/artikel/${encodeURIComponent(sku)}`}
title={item.name ? `${item.name} (${sku})` : sku}
onClick={(e) => { onClick={(e) => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
@@ -258,8 +235,8 @@ class LedgerHistoryRow extends PureComponent {
)} )}
</Box> </Box>
{/* 5. Menge / Betrag */} {/* 4. Menge / Betrag */}
<Box sx={{ gridColumn: 5, gridRow: 2, minWidth: 0, textAlign: 'right', pr: 1 }}> <Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0, textAlign: 'right', pr: 1 }}>
<Typography <Typography
variant="body2" variant="body2"
sx={{ sx={{
@@ -273,19 +250,12 @@ class LedgerHistoryRow extends PureComponent {
</Typography> </Typography>
</Box> </Box>
{/* 6. Buchungstext */} {/* 5. Buchungstext */}
<Box sx={{ gridColumn: 6, gridRow: 2, minWidth: 0 }}> <Box sx={{ gridColumn: 5, gridRow: 2, minWidth: 0 }}>
<Typography variant="body2" title={bookingText} sx={ellipsisSx}> <Typography variant="body2" title={bookingText} sx={ellipsisSx}>
{bookingText} {bookingText}
</Typography> </Typography>
</Box> </Box>
{/* 7. Benutzer */}
<Box sx={{ gridColumn: 7, gridRow: 2, minWidth: 0 }}>
<Typography variant="body2" color="text.secondary" sx={ellipsisSx}>
{userName}
</Typography>
</Box>
</ListItemButton> </ListItemButton>
); );
} }
@@ -592,13 +562,11 @@ export default class LedgerHistoryPage extends PureComponent {
}} }}
> >
{renderInvisibleDummyRow(this.headerItem)} {renderInvisibleDummyRow(this.headerItem)}
<Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>ID</Box> <Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>Datum</Box>
<Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Datum</Box> <Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Typ</Box>
<Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Typ</Box> <Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Artikel-Nr.</Box>
<Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx }}>Artikel-Nr.</Box> <Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx, textAlign: 'right', pr: 1 }}>Menge</Box>
<Box sx={{ gridColumn: 5, gridRow: 2, ...headerCellSx, textAlign: 'right', pr: 1 }}>Menge</Box> <Box sx={{ gridColumn: 5, gridRow: 2, ...headerCellSx }}>Buchungstext</Box>
<Box sx={{ gridColumn: 6, gridRow: 2, ...headerCellSx }}>Buchungstext</Box>
<Box sx={{ gridColumn: 7, gridRow: 2, ...headerCellSx }}>Benutzer</Box>
</Box> </Box>
} }
onPageChange={this.handlePageChange} onPageChange={this.handlePageChange}