From 56e8529fc6ef8fee3d7494b24f33165cb79e4cc2 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期一, 07 十月 2024 09:43:00 +0800
Subject: [PATCH] #

---
 zy-acs-flow/src/page/mission/MissionResend.jsx |  229 +++++++++++++++++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 220 insertions(+), 9 deletions(-)

diff --git a/zy-acs-flow/src/page/mission/MissionResend.jsx b/zy-acs-flow/src/page/mission/MissionResend.jsx
index 09a2a2b..1d9518f 100644
--- a/zy-acs-flow/src/page/mission/MissionResend.jsx
+++ b/zy-acs-flow/src/page/mission/MissionResend.jsx
@@ -1,17 +1,12 @@
 import React, { useState, useRef, useEffect, useMemo, useCallback } from "react";
 import {
     useTranslate,
-    EditButton,
-    ReferenceArrayField,
-    ReferenceField,
-    ReferenceManyField,
     ShowBase,
     useDataProvider,
     useNotify,
     useRecordContext,
     useRedirect,
     useRefresh,
-    useUpdate,
 } from 'react-admin';
 import {
     Box,
@@ -24,14 +19,22 @@
     Typography,
     Avatar,
     useTheme,
+    TableContainer,
+    Table,
+    TableBody,
+    TableCell,
+    TableHead,
+    TableRow,
+    Paper,
+    Toolbar,
+    Tooltip,
+    Checkbox,
+    IconButton,
 } from '@mui/material';
+import { alpha } from '@mui/material/styles';
 import { Link } from 'react-router-dom';
 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 ArrowBackIosNewIcon from '@mui/icons-material/ArrowBackIosNew';
 
 const MissionResend = ({ open, id }) => {
@@ -133,6 +136,8 @@
                             </Box>
                         )}
 
+                        <ActionTable actionIds={record?.actionIds} />
+
                     </Box>
                 </Box>
             </Stack>
@@ -140,4 +145,210 @@
     )
 };
 
+const headCells = [
+    {
+        id: 'name',
+        numeric: false,
+        disablePadding: true,
+        label: 'Dessert聽(100g serving)',
+    },
+    {
+        id: 'calories',
+        numeric: true,
+        disablePadding: false,
+        label: 'Calories',
+    },
+    {
+        id: 'fat',
+        numeric: true,
+        disablePadding: false,
+        label: 'Fat聽(g)',
+    },
+    {
+        id: 'carbs',
+        numeric: true,
+        disablePadding: false,
+        label: 'Carbs聽(g)',
+    },
+    {
+        id: 'protein',
+        numeric: true,
+        disablePadding: false,
+        label: 'Protein聽(g)',
+    },
+];
+
+const ActionTable = ({ actionIds }) => {
+    const dataProvider = useDataProvider();
+    const [actions, setActions] = useState([]);
+    const [selected, setSelected] = React.useState([]);
+
+    useEffect(() => {
+        if (actionIds?.length > 0) {
+            dataProvider.getMany('action', { ids: actionIds }).then(res => {
+                if (res.data?.length > 0) {
+                    setActions(res.data);
+                }
+            })
+        }
+    }, [actionIds])
+
+    const handleSelectAllClick = (event) => {
+        if (event.target.checked) {
+            const newSelected = actions.map((n) => n.id);
+            setSelected(newSelected);
+            return;
+        }
+        setSelected([]);
+    };
+
+    const handleClick = (event, id) => {
+        const selectedIndex = selected.indexOf(id);
+        let newSelected = [];
+
+        if (selectedIndex === -1) {
+            newSelected = newSelected.concat(selected, id);
+        } else if (selectedIndex === 0) {
+            newSelected = newSelected.concat(selected.slice(1));
+        } else if (selectedIndex === selected.length - 1) {
+            newSelected = newSelected.concat(selected.slice(0, -1));
+        } else if (selectedIndex > 0) {
+            newSelected = newSelected.concat(
+                selected.slice(0, selectedIndex),
+                selected.slice(selectedIndex + 1),
+            );
+        }
+        setSelected(newSelected);
+    };
+
+
+    return (
+        <>
+            <Box sx={{ width: '100%' }}>
+                <Paper sx={{ width: '100%', mb: 2 }}>
+                    <Toolbar
+                        sx={[
+                            {
+                                pl: { sm: 2 },
+                                pr: { xs: 1, sm: 1 },
+                            },
+                            selected.length > 0 && {
+                                bgcolor: (theme) =>
+                                    alpha(theme.palette.primary.main, theme.palette.action.activatedOpacity),
+                            },
+                        ]}
+                    >
+                        {selected.length > 0 ? (
+                            <Typography
+                                sx={{ flex: '1 1 100%' }}
+                                color="inherit"
+                                variant="subtitle1"
+                                component="div"
+                            >
+                                {selected.length} selected
+                            </Typography>
+                        ) : (
+                            <Typography
+                                sx={{ flex: '1 1 100%' }}
+                                variant="h6"
+                                id="tableTitle"
+                                component="div"
+                            >
+                                Actions
+                            </Typography>
+                        )}
+                        {selected.length > 0 && (
+                            <Tooltip title="Delete">
+                                <IconButton>
+                                    <Button
+                                        onClick={() => {
+                                            alert('clicked');
+                                        }}
+                                    >
+                                        ss
+                                    </Button>
+                                </IconButton>
+                            </Tooltip>
+                        )}
+                    </Toolbar>
+                    <TableContainer>
+                        <Table
+                            sx={{ minWidth: 750 }}
+                            aria-labelledby="tableTitle"
+                            // size={dense ? 'small' : 'medium'}
+                            size="small"
+                        >
+                            <TableHead>
+                                <TableRow>
+                                    <TableCell padding="checkbox">
+                                        <Checkbox
+                                            color="primary"
+                                            indeterminate={selected.length > 0 && selected.length < actions.length}
+                                            checked={actions.length > 0 && selected.length === actions.length}
+                                            onChange={handleSelectAllClick}
+                                            inputProps={{
+                                                'aria-label': 'select all desserts',
+                                            }}
+                                        />
+                                    </TableCell>
+                                    {headCells.map((headCell) => (
+                                        <TableCell
+                                            key={headCell.id}
+                                            align={headCell.numeric ? 'right' : 'left'}
+                                            padding={headCell.disablePadding ? 'none' : 'normal'}
+                                        >
+                                            {headCell.label}
+                                        </TableCell>
+                                    ))}
+                                </TableRow>
+                            </TableHead>
+                            <TableBody>
+                                {actions?.map((row, index) => {
+                                    const isItemSelected = selected.includes(row.id);
+                                    const labelId = `action-table-checkbox-${index}`;
+
+                                    return (
+                                        <TableRow
+                                            hover
+                                            onClick={(event) => handleClick(event, row.id)}
+                                            role="checkbox"
+                                            aria-checked={isItemSelected}
+                                            tabIndex={-1}
+                                            key={row.id}
+                                            selected={isItemSelected}
+                                            sx={{ cursor: 'pointer' }}
+                                        >
+                                            <TableCell padding="checkbox">
+                                                <Checkbox
+                                                    color="primary"
+                                                    checked={isItemSelected}
+                                                    inputProps={{
+                                                        'aria-labelledby': labelId,
+                                                    }}
+                                                />
+                                            </TableCell>
+                                            <TableCell
+                                                component="th"
+                                                id={labelId}
+                                                scope="row"
+                                                padding="none"
+                                            >
+                                                {row.name}
+                                            </TableCell>
+                                            <TableCell align="right">{row.calories}</TableCell>
+                                            <TableCell align="right">{row.fat}</TableCell>
+                                            <TableCell align="right">{row.carbs}</TableCell>
+                                            <TableCell align="right">{row.protein}</TableCell>
+                                        </TableRow>
+                                    );
+                                })}
+                            </TableBody>
+                        </Table>
+                    </TableContainer>
+                </Paper>
+            </Box>
+        </>
+    )
+}
+
 export default MissionResend;
\ No newline at end of file

--
Gitblit v1.9.1