#

luxiaotao1123

2024-09-26 a4b850a43524d96647231c109ad07637bc6936bf

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
import React, { useState, useRef, useEffect, useMemo } from "react";
import {
    DateField,
    EditButton,
    DeleteButton,
    ReferenceField,
    SelectField,
    ShowButton,
    TextField,
    UrlField,
    useRecordContext,
    useTranslate,
} from 'react-admin';
import { Link as RouterLink, useLocation } from 'react-router-dom';
import {
    Box,
    Button,
    Card,
    CardContent,
    Skeleton,
    Stack,
    Typography,
    Divider,
    Grid,
} from '@mui/material';
import { formatDistance } from 'date-fns';
import StatusField from "../../components/StatusField";
import AccessTimeIcon from '@mui/icons-material/AccessTime';
 
export const AgvShowAside = (props) => {
    const translate = useTranslate();
    const record = useRecordContext();
    if (!record) return null;
 
    return (
        <Box width={400} display={{ xs: 'none', lg: 'block' }}>
            {record && (
                <Box ml={2}>
                    <Card>
                        <CardContent>
                            <Stack direction="row" spacing={1}>
                                <EditButton />
                            </Stack>
                            <Stack direction="row" mt={1}>
                                <DeleteButton mutationMode="optimistic" />
                            </Stack>
                            <Box mt={1} />
                            <Typography variant="subtitle2" gutterBottom>
                                {translate('common.edit.side.title')}
                            </Typography>
                            <Divider sx={{ mb: 2 }} />
                            <Grid container rowSpacing={2} columnSpacing={1}>
                                <Grid item xs={12} display="flex" gap={1}>
                                    <StatusField label="Status" />
                                </Grid>
                                <Grid item xs={12} display="flex" gap={1}>
                                    <Stack
                                        direction="row"
                                        alignItems="center"
                                        gap={1}
                                        minHeight={24}
                                    >
                                        <AccessTimeIcon fontSize="small" color="disabled" />
                                        <Typography variant="body2">
                                            {translate('common.field.createTime')}
                                        </Typography>
                                        <DateField
                                            record={record}
                                            source="createTime"
                                            showTime
                                        />
                                    </Stack>
                                </Grid>
                                <Grid item xs={12} display="flex" gap={1}>
                                    <Stack
                                        direction="row"
                                        alignItems="center"
                                        gap={1}
                                        minHeight={24}
                                    >
                                        <AccessTimeIcon fontSize="small" color="disabled" />
                                        <Typography variant="body2">
                                            {translate('common.field.updateTime')}
                                        </Typography>
                                        <DateField
                                            record={record}
                                            source="updateTime"
                                            showTime
                                        />
                                    </Stack>
                                </Grid>
                            </Grid>
                        </CardContent>
                    </Card>
                </Box>
            )}
        </Box>
    );
}