From cd67e854d4715bc92a16dc7bffdbde7be1da9957 Mon Sep 17 00:00:00 2001 From: vincentlu <t1341870251@gmail.com> Date: 星期四, 27 三月 2025 13:02:37 +0800 Subject: [PATCH] # --- zy-acs-flow/src/page/agv/show/AgvShowTask.jsx | 119 ++++++++++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 96 insertions(+), 23 deletions(-) diff --git a/zy-acs-flow/src/page/agv/show/AgvShowTask.jsx b/zy-acs-flow/src/page/agv/show/AgvShowTask.jsx index d9ddbb4..c5474b4 100644 --- a/zy-acs-flow/src/page/agv/show/AgvShowTask.jsx +++ b/zy-acs-flow/src/page/agv/show/AgvShowTask.jsx @@ -16,39 +16,108 @@ Divider, List, ListItem, + ListItemAvatar, + ListItemText, + ListItemSecondaryAction, } from '@mui/material'; import { formatDistance } from 'date-fns'; import request from '@/utils/request'; import { useTheme } from '@mui/material/styles'; -import { getTaskStsColor } from '@/utils/common'; +import { getTaskStsColor } from '@/utils/color-util'; +import ListEmptyTip from "../../components/ListEmptyTip"; -const TaskItem = ({ record }) => { +const TaskItem = ({ record, now }) => { const translate = useTranslate(); const theme = useTheme(); + return ( <> - <ListItem disableGutters> + <ListItem button> <Stack direction="row" spacing={1} alignItems="center" width="100%"> - <Avatar - alt={record.seqNum} - sx={{ - '& img': { objectFit: 'contain' }, - fontSize: '0.9rem', - bgcolor: getTaskStsColor(record.taskSts$), - }} - > - {record.seqNum} - </Avatar> + <ListItemAvatar> + <Avatar + alt={record.seqNum} + variant="rounded" + sx={{ + '& img': { objectFit: 'contain' }, + fontSize: '0.9rem', + width: 40, + height: 25, + bgcolor: getTaskStsColor(record.taskSts$), + }} + > + {record.seqNum} + </Avatar> + </ListItemAvatar> + <ListItemText + primary={<> + <Stack direction={'row'}> + <Typography + variant="body1" + color="textSecondary" + component="span" + sx={{ fontWeight: '600' }} + > + {record.taskType$} + </Typography> + <Typography + variant="caption" + color="textSecondary" + component="span" + > + - {record.taskTypeEl} + </Typography> + </Stack> + + </>} + secondary={ + <> + <Typography + variant="body2" + color="textSecondary" + component="span" + sx={{ fontWeight: 'bold' }} + > + {record.taskSts$} + </Typography> + </> + } + /> + <ListItemText + variant="body2" + color="textSecondary" + primary={<> + <Typography + variant="body2" + color="textPrimary" + component="span" + > + {record.oriLoc$ || ''}{record.oriSta$ || ''} - {record.destLoc$ || ''}{record.destSta$ || ''} + </Typography> + </>} + secondary={`code: ${record.destCode$ || ''}`} + /> + <ListItemSecondaryAction> + <Typography + variant="body2" + color="textSecondary" + component="span" + > + last update {' '} + {formatDistance(record.createTime, now)} ago{' '} + </Typography> + </ListItemSecondaryAction> </Stack> </ListItem> </> ) } -export const AgvShowTask = ({ agvId, pageSize = 20 }) => { +export const AgvShowTask = ({ agvId, pageSize = 10 }) => { const [currCount, setCurrCount] = useState(pageSize); const [records, setRecords] = useState(null); const [total, setTotal] = useState(0); + const translate = useTranslate(); useEffect(() => { const http = async () => { @@ -93,18 +162,23 @@ </Stack> ); } + const now = Date.now(); return ( <> {records.length > 0 ? ( - <Box m={2}> + <Box > <List> {records.map(record => { return ( - <TaskItem - key={record.id} - record={record} - /> + <React.Fragment key={record.id}> + <TaskItem + key={record.id} + record={record} + now={now} + /> + <Divider /> + </React.Fragment> ) })} {currCount < total && ( @@ -116,16 +190,15 @@ ) } fullWidth + sx={{ mt: 1 }} > - Load more activity + {translate('common.action.loadMore')} </Button> )} </List> </Box> ) : ( - <Typography> - no data found - </Typography> + <ListEmptyTip /> )} </> -- Gitblit v1.9.1