#

luxiaotao1123

2024-09-21 0453a0bc5329d3bd4ff6d731d4bbd64890f722b3

#

 zy-acs-flow/src/page/agv/show/AgvShowTask.jsx

@@ -1,6 +1,6 @@
import React, { useState, useRef, useEffect, useMemo } from "react";
import {
    ShowBase,
    useTranslate,
    TabbedShowLayout,
    useShowContext,
} from 'react-admin';
@@ -14,9 +14,36 @@
    Avatar,
    Skeleton,
    Divider,
    List,
    ListItem,
} 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 translate = useTranslate();
    const theme = useTheme();
    return (
        <>
            <ListItem disableGutters>
                <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>
                </Stack>
            </ListItem>
        </>
    )
}

export const AgvShowTask = ({ agvId, pageSize = 20 }) => {
    const [currCount, setCurrCount] = useState(pageSize);
@@ -25,16 +52,21 @@

    useEffect(() => {
        const http = async () => {
            const res = await request.post('task/page', { agvId: agvId, pageSize: currCount });
            const res = await request.post('task/page', {
                agvId: agvId,
                pageSize: currCount,
                orderBy: 'create_time desc',
            });
            const { code, msg, data } = res.data;
            if (code === 200) {
                setTotal(data.total);
                setRecords(data.records);
            } else {
                setTotal(0);
                setRecords(null);
            }
        }
        if (agvId) { http(); }
        if (agvId) { http() }
    }, [agvId, currCount]);

    if (!records) {
@@ -65,28 +97,30 @@
    return (
        <>
            {records.length > 0 ? (
                <Box>
                    {records.map(record => {
                        return (
                            <TaskItem
                                key={record.id}
                                record={record}
                            />
                        )
                    })}
                    {currCount < total && (
                        <Button
                            onClick={() =>
                                setCurrCount(
                                    currCount =>
                                        currCount + pageSize
                                )
                            }
                            fullWidth
                        >
                            Load more activity
                        </Button>
                    )}
                <Box m={2}>
                    <List>
                        {records.map(record => {
                            return (
                                <TaskItem
                                    key={record.id}
                                    record={record}
                                />
                            )
                        })}
                        {currCount < total && (
                            <Button
                                onClick={() =>
                                    setCurrCount(
                                        currCount =>
                                            currCount + pageSize
                                    )
                                }
                                fullWidth
                            >
                                Load more activity
                            </Button>
                        )}
                    </List>
                </Box>
            ) : (
                <Typography>
@@ -97,16 +131,3 @@
        </>
    )
}

const TaskItem = ({ record }) => {

    return (
        <>
            <Typography

            >
                {record.seqNum}
            </Typography>
        </>
    )
}

 zy-acs-flow/src/utils/common.js

@@ -1,3 +1,4 @@
import * as Colors from '@mui/material/colors';

export const extractNavMenus = (data) => {
    if (!data) {
@@ -49,4 +50,22 @@
        }
    });
    return result;
};
};

export const getTaskStsColor = (taskStatus) => {
    if (!taskStatus) {
        return Colors.grey[500];
    }
    switch (taskStatus) {
        case '等待中':
            return Colors.amber[500];
        case '已分配':
            return Colors.blue[500];
        case '进行中':
            return Colors.green[500];
        case '已完成':
            return Colors.blueGrey[500];
        default:
            return Colors.amber[500];
    }
}