| | |
| | | <List> |
| | | {records.map(record => { |
| | | return ( |
| | | <> |
| | | <React.Fragment key={record.id}> |
| | | <TaskItem |
| | | key={record.id} |
| | | record={record} |
| | | now={now} |
| | | /> |
| | | <Divider /> |
| | | </> |
| | | |
| | | </React.Fragment> |
| | | ) |
| | | })} |
| | | {currCount < total && ( |
| | |
| | | import { blueGrey } from '@mui/material/colors'; |
| | | import MoveToInboxIcon from '@mui/icons-material/MoveToInbox'; |
| | | import { format } from 'date-fns'; |
| | | import { TaskList } from "./TaskList"; |
| | | |
| | | const MissionShow = ({ open, id }) => { |
| | | const redirect = useRedirect(); |
| | |
| | | </Box> |
| | | </Box> |
| | | |
| | | {!!record.contact_ids?.length && ( |
| | | {!!record.taskIds?.length && ( |
| | | <Box m={2}> |
| | | <Box |
| | | display="flex" |
| | |
| | | color="textSecondary" |
| | | variant="caption" |
| | | > |
| | | Contacts |
| | | Tasks |
| | | </Typography> |
| | | <ReferenceArrayField |
| | | source="contact_ids" |
| | | reference="contacts_summary" |
| | | > |
| | | <ContactList /> |
| | | <TaskList taskIds={record.taskIds} /> |
| | | </ReferenceArrayField> |
| | | </Box> |
| | | </Box> |
New file |
| | |
| | | import React, { useState, useRef, useEffect, useMemo, useCallback } from "react"; |
| | | import { Link, Stack, Typography, Avatar } from '@mui/material'; |
| | | import { |
| | | useDataProvider, |
| | | useTranslate, |
| | | } from 'react-admin'; |
| | | import { getTaskStsColor } from '@/utils/color-util'; |
| | | |
| | | export const TaskList = ({ taskIds }) => { |
| | | const dataProvider = useDataProvider(); |
| | | |
| | | const [tasks, setTasks] = useState([]); |
| | | |
| | | useEffect(() => { |
| | | if (taskIds?.length > 0) { |
| | | dataProvider.getMany('task', { ids: taskIds }).then(res => { |
| | | if (res.data?.length > 0) { |
| | | setTasks(res.data); |
| | | } |
| | | }) |
| | | } |
| | | }, [taskIds]) |
| | | |
| | | if (!taskIds?.length) return <div style={{ height: '2em' }} />; |
| | | |
| | | return ( |
| | | <Stack direction="row" flexWrap="wrap" gap={3} mt={1}> |
| | | {tasks.map(task => ( |
| | | <Stack direction="row" key={task.id} gap={1}> |
| | | <Avatar |
| | | alt={task.seqNum} |
| | | // variant="square" |
| | | sx={{ |
| | | '& img': { objectFit: 'contain' }, |
| | | fontSize: '1rem', |
| | | width: 55, |
| | | height: 40, |
| | | bgcolor: getTaskStsColor(task.taskSts$), |
| | | }} |
| | | > |
| | | {task.seqNum} |
| | | </Avatar> |
| | | <Stack> |
| | | <Typography variant="body2" color="inherit"> |
| | | {task.taskType$} |
| | | </Typography> |
| | | <Typography variant="caption" color="text.secondary"> |
| | | {task.oriDesc || ''} - {task.destDesc || ''} |
| | | </Typography> |
| | | </Stack> |
| | | </Stack> |
| | | ))} |
| | | </Stack> |
| | | ); |
| | | }; |
| | |
| | | overflow: 'hidden', |
| | | textOverflow: 'ellipsis', |
| | | }}> |
| | | {Common.camelToPascalWithSpaces(translate('table.field.segment.id'))}: {record.id} |
| | | {Common.camelToPascalWithSpaces(translate('common.field.id'))}: {record.id} |
| | | </Typography> |
| | | {/* inherit, primary, secondary, textPrimary, textSecondary, error */} |
| | | <Typography variant="h6" gutterBottom align="right" > |
| | |
| | | |
| | | private List<String> taskNos = new ArrayList<>(); |
| | | |
| | | private List<Long> taskIds = new ArrayList<>(); |
| | | |
| | | private Integer backpack; |
| | | |
| | | private String destCode; |
| | |
| | | // vo.setSendTime(action.getStartTime()); |
| | | vo.setBusNo(task.getBusId$()); |
| | | vo.setActionCount(actionList.size()); |
| | | vo.setTaskIds(list.stream().map(Segment::getTaskId).collect(Collectors.toList())); |
| | | return vo; |
| | | } |
| | | |