| | |
| | | Stack, |
| | | Typography, |
| | | Avatar, |
| | | Skeleton, |
| | | Divider, |
| | | } from '@mui/material'; |
| | | import { formatDistance } from 'date-fns'; |
| | | import request from '@/utils/request'; |
| | |
| | | export const AgvShowTask = ({ agvId }) => { |
| | | |
| | | const [records, setRecords] = useState(null); |
| | | const [total, setTotal] = useState(0); |
| | | |
| | | useEffect(() => { |
| | | const http = async (agvId) => { |
| | | const res = await request.post('task/page', { agvId: agvId }); |
| | | const { code, msg, data } = res.data; |
| | | if (code === 200) { |
| | | setRecords(data); |
| | | setTotal(data.total); |
| | | setRecords(data.records); |
| | | } else { |
| | | setRecords(null); |
| | | } |
| | |
| | | } |
| | | }, [agvId]); |
| | | |
| | | if (!records) { |
| | | return ( |
| | | <Stack mt={0.5}> |
| | | {Array.from({ length: 5 }).map((_, index) => ( |
| | | <Stack spacing={2} sx={{ mt: 1 }} key={index}> |
| | | <Stack |
| | | direction="row" |
| | | spacing={2} |
| | | sx={{ alignItems: 'center' }} |
| | | > |
| | | <Skeleton |
| | | variant="circular" |
| | | width={20} |
| | | height={20} |
| | | /> |
| | | <Skeleton width="100%" /> |
| | | </Stack> |
| | | <Skeleton variant="rectangular" height={50} /> |
| | | <Divider /> |
| | | </Stack> |
| | | ))} |
| | | </Stack> |
| | | ); |
| | | } |
| | | |
| | | |
| | | return ( |
| | | <> |
| | | <h1>{JSON.stringify(records)}</h1> |
| | | {records.length > 0 ? ( |
| | | records.map(record => { |
| | | return ( |
| | | <Typography> |
| | | {record.seqNum} |
| | | </Typography> |
| | | ) |
| | | }) |
| | | ) : ( |
| | | <Typography> |
| | | no data found |
| | | </Typography> |
| | | )} |
| | | |
| | | </> |
| | | ) |
| | | } |