#

luxiaotao1123

2024-11-04 7f70cb15d035f0c233b9e62b9e43aa985317c908

 zy-acs-flow/src/page/mission/MissionShow.jsx

@@ -1,6 +1,6 @@
import React, { useState, useRef, useEffect, useMemo, useCallback } from "react";
import {
    DeleteButton,
    useTranslate,
    EditButton,
    ReferenceArrayField,
    ReferenceField,
@@ -22,8 +22,17 @@
    Divider,
    Stack,
    Typography,
    Avatar,
    useTheme,
} from '@mui/material';
import DialogCloseButton from "../components/DialogCloseButton";
import { blueGrey, blue } from '@mui/material/colors';
import MoveToInboxIcon from '@mui/icons-material/MoveToInbox';
import { format } from 'date-fns';
import { TaskList } from "./TaskList";
import { ActionsIterator } from "../action/ActionsIterator";
import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos';


const MissionShow = ({ open, id }) => {
    const redirect = useRedirect();
@@ -32,40 +41,39 @@
    };

    return (
        <>
            <Dialog
                open={open}
                onClose={handleClose}
                fullWidth
                maxWidth="md"
                sx={{
                    '& .MuiDialog-container': {
                        alignItems: 'flex-start',
                    },
                }}
            >
                <DialogContent sx={{ padding: 0 }}>
                    {!!id ? (
                        <ShowBase id={id}>
                            <MissionShowContent handleClose={handleClose} />
                        </ShowBase>
                    ) : null}
                </DialogContent>
            </Dialog>
        </>
        <Dialog
            open={open}
            onClose={handleClose}
            fullWidth
            maxWidth="md"
            sx={{
                '& .MuiDialog-container': {
                    alignItems: 'flex-start',
                },
            }}
        >
            <DialogContent sx={{ padding: 0 }}>
                {!!id ? (
                    <ShowBase id={id}>
                        <MissionShowContent handleClose={handleClose} />
                    </ShowBase>
                ) : null}
            </DialogContent>
        </Dialog>
    )
}

const CLOSE_TOP_WITH_ARCHIVED = 14;
const MissionShowContent = ({ handleClose }) => {
    const theme = useTheme();
    const record = useRecordContext();
    const translate = useTranslate();
    if (!record) return null;
    console.log(record);

    return (
        <>
            <DialogCloseButton
                onClose={handleClose}
                top={12}
            />
            <Stack gap={1}>
                <Box display="flex" p={2}>
@@ -76,15 +84,25 @@
                            mb={4}
                        >
                            <Stack direction="row" alignItems="center" gap={2}>
                                <Avatar
                                    sx={{
                                        width: 30,
                                        height: 30,
                                        bgcolor: theme.palette.primary.main,
                                    }}
                                >
                                    {record.agv}
                                </Avatar>
                                <Typography variant="h5">
                                    {record.name}
                                    {record.groupNo}
                                </Typography>
                            </Stack>
                            <Stack
                                gap={1}
                                direction="row"
                                pr={record.archived_at ? 0 : 6}
                                pr={6}
                            >
                                <ResendButton record={record} />
                            </Stack>
                        </Stack>

@@ -94,7 +112,7 @@
                                    color="textSecondary"
                                    variant="caption"
                                >
                                    Expected closing date
                                    {translate('table.field.mission.lastSendDate')}
                                </Typography>
                                <Stack
                                    direction="row"
@@ -102,15 +120,8 @@
                                    gap={1}
                                >
                                    <Typography variant="body2">
                                        {format(record.sendTime, 'yyyy-MM-dd HH:mm:ss') || '-'}
                                    </Typography>
                                    {new Date(record.expected_closing_date) <
                                        new Date() ? (
                                        <Chip
                                            label="Past"
                                            color="error"
                                            size="small"
                                        />
                                    ) : null}
                                </Stack>
                            </Box>

@@ -119,43 +130,39 @@
                                    color="textSecondary"
                                    variant="caption"
                                >
                                    Budget
                                    {translate('table.field.bus.busNo')}
                                </Typography>
                                <Typography variant="body2">
                                    {record.busNo || '-'}
                                </Typography>
                            </Box>

                            {record.category && (
                                <Box
                                    display="flex"
                                    mr={5}
                                    flexDirection="column"
                                >
                                    <Typography
                                        color="textSecondary"
                                        variant="caption"
                                    >
                                        Category
                                    </Typography>
                                    <Typography variant="body2">
                                        {record.category}
                                    </Typography>
                                </Box>
                            )}

                            <Box display="flex" mr={5} flexDirection="column">
                                <Typography
                                    color="textSecondary"
                                    variant="caption"
                                >
                                    Stage
                                    {translate('table.field.segment.posType')}
                                </Typography>
                                <Typography variant="body2">
                                    {translate(`page.mission.enums.posType.${record.posType}`)}
                                </Typography>
                            </Box>

                            <Box display="flex" mr={5} flexDirection="column">
                                <Typography
                                    color="textSecondary"
                                    variant="caption"
                                >
                                    {translate('table.field.mission.actionCount')}
                                </Typography>
                                <Typography variant="body2">
                                    {record.actionCount || 'unknown'}
                                </Typography>
                            </Box>
                        </Box>

                        {!!record.contact_ids?.length && (
                        {!!record.taskIds?.length && (
                            <Box m={2}>
                                <Box
                                    display="flex"
@@ -167,40 +174,78 @@
                                        color="textSecondary"
                                        variant="caption"
                                    >
                                        Contacts
                                        {translate('table.field.mission.task')}
                                    </Typography>
                                    <ReferenceArrayField
                                        source="contact_ids"
                                        reference="contacts_summary"
                                    >
                                        <ContactList />
                                        <TaskList taskIds={record.taskIds} />
                                    </ReferenceArrayField>
                                </Box>
                            </Box>
                        )}

                        {record.description && (
                        {!!record.codeList?.length && (
                            <Box m={2} sx={{ whiteSpace: 'pre-line' }}>
                                <Typography
                                    color="textSecondary"
                                    variant="caption"
                                >
                                    Description
                                    {translate('table.field.mission.runPath')}
                                </Typography>
                                <Typography variant="body2">
                                    {record.description}
                                <Typography variant="body2" sx={{ whiteSpace: 'normal', overflow: 'hidden', display: 'flex', flexWrap: 'wrap' }}>
                                    [&nbsp;{record.codeList.map((code, index) => (
                                        <span key={index} style={{
                                            color: record.currCode === code ? theme.palette.primary.main : 'inherit',
                                        }}>
                                            {code}{index < record.codeList.length - 1 && ','}&nbsp;
                                        </span>
                                    ))}&nbsp;]
                                </Typography>
                            </Box>
                        )}

                        <Box m={2}>
                            <Typography
                                color="textSecondary"
                                variant="caption"
                            >
                                {translate('table.field.mission.actions')}
                            </Typography>
                            <Divider />
                            <ActionsIterator actionIds={record.actionIds} />
                        </Box>
                    </Box>
                </Box>
            </Stack>
        </>
    )
}
};

const ResendButton = ({ record }) => {
    const dataProvider = useDataProvider();
    const redirect = useRedirect();
    const notify = useNotify();
    const refresh = useRefresh();
    const translate = useTranslate();

    const handleClick = () => {
        redirect(`/mission/${record.id}/resend`, undefined, undefined, undefined, {
            _scrollToTop: false,
        });
    };

    return (
        <Button
            onClick={handleClick}
            // startIcon={<MoveToInboxIcon />}
            endIcon={<ArrowForwardIosIcon />}
            size="small"
        >
            {translate('common.action.resend')}
        </Button>
    );
};

export default MissionShow;