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
100
101
102
| import { useState } from 'react';
| import {
| Form,
| ReferenceField,
| useNotify,
| useTheme,
| useTranslate,
| } from 'react-admin';
| import {
| Box,
| Divider,
| Stack,
| Tooltip,
| Typography,
| Avatar,
| } from '@mui/material';
| import { format, formatRelative } from 'date-fns';
| import { blueGrey } from '@mui/material/colors';
|
| export const Action = ({ data }) => {
| const notify = useNotify();
| const translate = useTranslate();
| const theme = useTheme();
| const [isHover, setHover] = useState(false);
|
| return (
| <Box
| onMouseEnter={() => setHover(true)}
| onMouseLeave={() => setHover(false)}
| pb={1}
| >
| <Stack direction="row" spacing={1} alignItems="center" width="100%">
| <Avatar
| sx={{
| width: 20,
| height: 20,
| fontSize: '.9rem'
| }}
| >
| {data.priority}
| </Avatar>
| <Typography color="textPrimary" variant="body2" sx={{ transform: 'scale(1.1)', pl: 1, pr: .1 }}>
| {data.actionType$}
| </Typography>
| <Typography
| variant="body2"
| color="textSecondary"
| >
| ({data.actionSts$ || '-'})
| </Typography>
| <Box flex={1}></Box>
| <Typography
| color="textSecondary"
| variant="body2"
| component="span"
| >
| {/* {formatRelative(new Date(data.ioTime), new Date())} */}
| {/* {format(data.ioTime, 'yyyy-MM-dd HH:mm:ss') || '-'} */}
| No.{data.uuid}
| </Typography>
| </Stack>
| <Stack
| direction="row"
| sx={{
| paddingTop: '0.5em',
| display: 'flex',
| '& p:empty': {
| minHeight: '0.75em',
| },
| }}
| >
| <Typography
| variant="body2"
| color="textSecondary"
| >
| {translate('table.field.action.taskId')}: {data.taskId$ || '-'}
| </Typography>
| <Divider orientation="vertical" flexItem sx={{ marginX: 1 }} />
| <Typography
| variant="body2"
| color="textSecondary"
| >
| {translate('table.field.action.code')}: {data.code || '-'}
| </Typography>
| <Divider orientation="vertical" flexItem sx={{ marginX: 1 }} />
| <Typography
| variant="body2"
| color="textSecondary"
| >
| {translate('table.field.action.val')}: {data.val || '-'}
| </Typography>
| <Divider orientation="vertical" flexItem sx={{ marginX: 1 }} />
| <Typography
| variant="body2"
| color="textSecondary"
| >
| {translate('table.field.action.params')}: {data.param || '-'}
| </Typography>
| </Stack>
| </Box>
| );
| };
|
|
