| | |
| | | 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'; |
| | | |
| | | 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} |
| | | sx={{ |
| | | '& img': { objectFit: 'contain' }, |
| | | fontSize: '0.9rem', |
| | | width: 40, |
| | | height: 40, |
| | | bgcolor: getTaskStsColor(record.taskSts$), |
| | | }} |
| | | > |
| | | {record.seqNum} |
| | | </Avatar> |
| | | </ListItemAvatar> |
| | | <ListItemText |
| | | primary={`${record.first_name} ${record.last_name}`} |
| | | secondary={ |
| | | <> |
| | | {record.title} |
| | | |
| | | </> |
| | | } |
| | | /> |
| | | <ListItemSecondaryAction> |
| | | <Typography |
| | | variant="body2" |
| | | color="textSecondary" |
| | | component="span" |
| | | > |
| | | last activity{' '} |
| | | {formatDistance(record.createTime, now)} ago{' '} |
| | | </Typography> |
| | | </ListItemSecondaryAction> |
| | | </Stack> |
| | | </ListItem> |
| | | </> |
| | |
| | | </Stack> |
| | | ); |
| | | } |
| | | const now = Date.now(); |
| | | |
| | | return ( |
| | | <> |
| | | {records.length > 0 ? ( |
| | | <Box m={2}> |
| | | <Box m={1}> |
| | | <List> |
| | | {records.map(record => { |
| | | return ( |
| | | <TaskItem |
| | | key={record.id} |
| | | record={record} |
| | | /> |
| | | <> |
| | | <TaskItem |
| | | key={record.id} |
| | | record={record} |
| | | now={now} |
| | | /> |
| | | <Divider /> |
| | | </> |
| | | |
| | | ) |
| | | })} |
| | | |
| | | {currCount < total && ( |
| | | <Button |
| | | onClick={() => |
| | |
| | | ) |
| | | } |
| | | fullWidth |
| | | sx={{ mt: 1 }} |
| | | > |
| | | Load more activity |
| | | </Button> |