From 56ca28233a84c5aa3ca93cae266b2d008ea348e1 Mon Sep 17 00:00:00 2001
From: lbq <1065079612@qq.com>
Date: 星期三, 24 十二月 2025 09:54:13 +0800
Subject: [PATCH] Web页面优化
---
rsf-admin/src/page/dashboard/NbList.jsx | 199 ++++++++++++++++++++++++++++++++++---------------
1 files changed, 137 insertions(+), 62 deletions(-)
diff --git a/rsf-admin/src/page/dashboard/NbList.jsx b/rsf-admin/src/page/dashboard/NbList.jsx
index 3794797..a2b879b 100644
--- a/rsf-admin/src/page/dashboard/NbList.jsx
+++ b/rsf-admin/src/page/dashboard/NbList.jsx
@@ -21,12 +21,27 @@
return (
<Card sx={{
flex: 1,
+ boxShadow: 2,
+ maxWidth: 598,
+ marginTop: 1
}}>
- <CardHeader title={translate('page.dashboard.list.stock')} />
- <Box sx={{ maxHeight: 500, overflowY: 'auto',}}>
- <List dense={true}>
+ <CardHeader
+ title={translate('page.dashboard.list.stock')}
+ sx={{
+ pb: 1,
+ '& .MuiCardHeader-title': {
+ fontSize: '1.1rem',
+ fontWeight: 600,
+ }
+ }}
+ />
+ <Box sx={{ maxHeight: 500, overflowY: 'auto' }}>
+ <List dense={true} sx={{ py: 0 }}>
{deadStock.map(record => (
- <PendingOrder key={`record?.id + ${Math.random().toString(36).substr(2, 9)} `} order={record} />
+ <PendingOrder
+ key={`${record?.id}_${Math.random().toString(36).substr(2, 9)}`}
+ order={record}
+ />
))}
</List>
</Box>
@@ -37,71 +52,131 @@
export const PendingOrder = (props) => {
const { order } = props;
const translate = useTranslate();
- // const { referenceRecord: customer, isPending } = useReference({
- // reference: 'customers',
- // id: order.id,
- // });
return (
- <ListItem disablePadding>
- {/* component={Link} to={`/locItem/${order.id}`} */}
- <ListItemButton >
- {/* <ListItemAvatar>
- {isPending ? (
- <Avatar />
- ) : (
- <Avatar
- src={`${customer?.avatar}?size=32x32`}
- sx={{ bgcolor: 'background.paper' }}
- alt={`${customer?.first_name} ${customer?.last_name}`}
- />
- )}
- </ListItemAvatar> */}
- {/* <ListItemText
- primary={new Date(order.createTime).toLocaleString('en-GB')}
- secondary={translate('page.dashboard.list.stock', {
- name: order.maktx
- })}
- >
-
- </ListItemText> */}
- <Grid container item md={12}>
- <Box sx={{ display: 'flex' }}>
- <Box sx={{ display: 'flex', padding: '1em' }}>
- <Typography color="textSecondary">{translate("table.field.asnOrderItem.matnrCode")}锛�</Typography>
- <Typography color="textSecondary">{order?.matnrCode}</Typography>
+ <ListItem
+ disablePadding
+ sx={{
+ borderBottom: '1px solid',
+ borderColor: 'divider',
+ '&:last-child': {
+ borderBottom: 'none',
+ }
+ }}
+ >
+ <ListItemButton
+ sx={{
+ py: 1.5,
+ '&:hover': {
+ backgroundColor: 'action.hover',
+ }
+ }}
+ >
+ <Grid container spacing={1}>
+ {/* 绗竴琛岋細鐗╂枡缂栫爜鍜屽悕绉� */}
+ <Grid item xs={12} sx={{ display: 'flex', alignItems: 'center' }}>
+ <Box sx={{ display: 'flex', alignItems: 'center', minWidth: 0, flex: 1 }}>
+ <Typography
+ variant="body2"
+ sx={{
+ fontWeight: 600,
+ color: 'primary.main',
+ minWidth: '120px',
+ flexShrink: 0,
+ }}
+ >
+ {translate("table.field.asnOrderItem.matnrCode")}锛�
+ </Typography>
+ <Typography
+ variant="body2"
+ sx={{
+ color: 'text.primary',
+ overflow: 'hidden',
+ textOverflow: 'ellipsis',
+ whiteSpace: 'nowrap',
+ }}
+ >
+ {order?.matnrCode}
+ </Typography>
</Box>
- </Box>
- <Box sx={{ display: 'flex' }}>
- <Box sx={{ display: 'flex', padding: '1em' }}>
- <Typography color="textSecondary">{translate("table.field.asnOrderItem.maktx")}锛�</Typography>
- <Typography color="textSecondary" maxWidth="200" overflow="hidden">{order?.maktx}</Typography>
+
+ <Box sx={{ display: 'flex', alignItems: 'center', minWidth: 0, flex: 1 }}>
+ <Typography
+ variant="body2"
+ sx={{
+ fontWeight: 600,
+ color: 'primary.main',
+ minWidth: '80px',
+ flexShrink: 0,
+ }}
+ >
+ {translate("table.field.asnOrderItem.maktx")}锛�
+ </Typography>
+ <Typography
+ variant="body2"
+ sx={{
+ color: 'text.primary',
+ overflow: 'hidden',
+ textOverflow: 'ellipsis',
+ whiteSpace: 'nowrap',
+ }}
+ title={order?.maktx} // 娣诲姞title鎻愮ず瀹屾暣鍐呭
+ >
+ {order?.maktx}
+ </Typography>
</Box>
- </Box>
- <Box sx={{ display: 'flex' }}>
- <Box sx={{ display: 'flex', padding: '1em' }}>
- <Typography color="textSecondary">{translate("table.field.asnOrderItem.anfme")}锛�</Typography>
- <Typography color="textSecondary">{order?.anfme}</Typography>
+ </Grid>
+
+ {/* 绗簩琛岋細鏁伴噺鍜屾棩鏈� */}
+ <Grid item xs={12} sx={{ display: 'flex', alignItems: 'center' }}>
+ <Box sx={{ display: 'flex', alignItems: 'center', minWidth: 0, flex: 1 }}>
+ <Typography
+ variant="body2"
+ sx={{
+ fontWeight: 600,
+ color: 'primary.main',
+ minWidth: '120px',
+ flexShrink: 0,
+ }}
+ >
+ {translate("table.field.asnOrderItem.anfme")}锛�
+ </Typography>
+ <Typography
+ variant="body2"
+ sx={{
+ color: 'text.primary',
+ fontWeight: 500,
+ }}
+ >
+ {order?.anfme}
+ </Typography>
</Box>
- </Box>
- <Box sx={{ display: 'flex' }}>
- <Box sx={{ display: 'flex', padding: '1em' }}>
- <Typography color="textSecondary">{translate("table.field.locItem.deadTime")}锛�</Typography>
- <Typography color="textSecondary">{order?.deadTime}</Typography>
+
+ <Box sx={{ display: 'flex', alignItems: 'center', minWidth: 0, flex: 1 }}>
+ <Typography
+ variant="body2"
+ sx={{
+ fontWeight: 600,
+ color: 'primary.main',
+ minWidth: '120px',
+ flexShrink: 0,
+ }}
+ >
+ {translate("table.field.locItem.deadTime")}锛�
+ </Typography>
+ <Typography
+ variant="body2"
+ sx={{
+ color: order?.deadTime ? 'error.main' : 'text.secondary',
+ fontWeight: order?.deadTime ? 600 : 400,
+ fontFamily: 'monospace',
+ }}
+ >
+ {order?.deadTime || '-'}
+ </Typography>
</Box>
- </Box>
+ </Grid>
</Grid>
- {/* <ListItemSecondaryAction>
- <Box
- component="span"
- sx={{
- marginRight: '1em',
- color: 'text.primary',
- }}
- >
- {order.deadTime}
- </Box>
- </ListItemSecondaryAction> */}
</ListItemButton>
</ListItem>
);
--
Gitblit v1.9.1