verou1
2025-03-10 50f4e2c3a3c5c9d4edafab346c58e3862b7610eb
rsf-admin/src/page/basicInfo/whMat/whMatCreate.jsx
@@ -10,7 +10,7 @@
    AutocompleteInput,
    required,
    NumberInput,
} from 'react-admin';
} from "react-admin";
import {
    Dialog,
    DialogActions,
@@ -28,49 +28,48 @@
    TableHead,
    Paper,
    Checkbox,
    Button
} from '@mui/material';
  Button,
} from "@mui/material";
import DialogCloseButton from "@/page/components/DialogCloseButton";
import { styled } from '@mui/material/styles';
import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
import { styled } from "@mui/material/styles";
import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
import { Search } from "@mui/icons-material";
import { tr } from "date-fns/locale";
import WhTable from "./whTable";
const columns = [
    {
        id: 'matnrCode',
        label: 'table.field.whMat.matnrCode',
    id: "matnrCode",
    label: "table.field.whMat.matnrCode",
        minWidth: 160,
    },
    {
        id: 'matnrName',
        label: 'table.field.whMat.matnrName',
    id: "matnrName",
    label: "table.field.whMat.matnrName",
    },
    {
        id: 'matnrGroupId',
        label: 'table.field.whMat.matnrGroupId',
    id: "matnrGroupId",
    label: "table.field.whMat.matnrGroupId",
    },
    {
        id: 'spec',
        label: 'table.field.whMat.spec',
    id: "spec",
    label: "table.field.whMat.spec",
    },
    {
        id: 'color',
        label: 'table.field.whMat.color',
    id: "color",
    label: "table.field.whMat.color",
    },
    {
        id: 'size',
        label: 'table.field.whMat.size',
    id: "size",
    label: "table.field.whMat.size",
    },
    {
        id: 'minWeight',
        label: 'table.field.whMat.minWeight',
    id: "minWeight",
    label: "table.field.whMat.minWeight",
    },
    {
        id: 'maxWeight',
        label: 'table.field.whMat.maxWeight',
    id: "maxWeight",
    label: "table.field.whMat.maxWeight",
    },
];
@@ -100,23 +99,36 @@
                    maxWidth="lg"   // 'xs' | 'sm' | 'md' | 'lg' | 'xl'
                >
                    <Form record={editRecord} onSubmit={onSubmit}>
                        <DialogTitle id="form-dialog-title" sx={{
                            position: 'sticky',
            <DialogTitle
              id="form-dialog-title"
              sx={{
                position: "sticky",
                            top: 0,
                            backgroundColor: 'background.paper',
                            zIndex: 1000
                backgroundColor: "background.paper",
                zIndex: 1000,
                        }}
                        >
                            {editRecord ? translate('update.title') : translate('create.title')}
                            <Box sx={{ position: 'absolute', top: 8, right: 8, zIndex: 1001 }}>
              {editRecord
                ? translate("update.title")
                : translate("create.title")}
              <Box
                sx={{ position: "absolute", top: 8, right: 8, zIndex: 1001 }}
              >
                                <DialogCloseButton onClose={handleClose} />
                            </Box>
                        </DialogTitle>
                        <DialogContent sx={{ mt: 2 }}>
                            <WhMatCreateContent />
                        </DialogContent>
                        <DialogActions sx={{ position: 'sticky', bottom: 0, backgroundColor: 'background.paper', zIndex: 1000 }}>
                            <Toolbar sx={{ width: '100%', justifyContent: 'space-between' }}  >
            <DialogActions
              sx={{
                position: "sticky",
                bottom: 0,
                backgroundColor: "background.paper",
                zIndex: 1000,
              }}
            >
              <Toolbar sx={{ width: "100%", justifyContent: "space-between" }}>
                                <SaveButton />
                            </Toolbar>
                        </DialogActions>
@@ -127,18 +139,18 @@
    );
};
const StyledTableRow = styled(TableRow)(({ theme }) => ({
    '& .MuiButtonBase-root': {
        padding: '0px 0px'
    }
  "& .MuiButtonBase-root": {
    padding: "0px 0px",
  },
}));
const StyledTableCell = styled(TableCell)(({ theme }) => ({
    '& .MuiButtonBase-root': {
        padding: '0px 0px'
  "& .MuiButtonBase-root": {
    padding: "0px 0px",
    },
    overflow: 'hidden',
    textOverflow: 'ellipsis',
    whiteSpace: 'nowrap',
  overflow: "hidden",
  textOverflow: "ellipsis",
  whiteSpace: "nowrap",
    maxWidth: 600,
}));
@@ -147,7 +159,7 @@
    const isOpen = openNodes[row.id] || false;
    const [checked, setChecked] = useState(false);
    const toggleNode = (id) => {
        setOpenNodes(prevState => ({ ...prevState, [id]: !prevState[id] }));
    setOpenNodes((prevState) => ({ ...prevState, [id]: !prevState[id] }));
    };
    return (
        <React.Fragment>
@@ -157,14 +169,14 @@
                        <IconButton
                            aria-label="expand row"
                            size="small"
                            style={{ marginLeft: (depth * 16 + 8) }}
              style={{ marginLeft: depth * 16 + 8 }}
                            onClick={() => toggleNode(row.id)}
                        >
                            {isOpen ? <KeyboardArrowDownIcon /> : <KeyboardArrowRightIcon />}
                        </IconButton>
                    )}
                </StyledTableCell>
                <StyledTableCell style={{ paddingLeft: (depth * 16 + 16) }}>
        <StyledTableCell style={{ paddingLeft: depth * 16 + 16 }}>
                    <Checkbox
                        key={row.id}
                        checked={row.checked}
@@ -172,25 +184,25 @@
                    />
                </StyledTableCell>
                {columns.map((column, idx) => {
                    if (column.id !== 'actions') {
          if (column.id !== "actions") {
                        const value = row[column.id];
                        return (
                            <>
                                <StyledTableCell
                                    key={column.id}
                                    align={column.align || 'left'}
                  align={column.align || "left"}
                                    // style={{ paddingLeft: idx === 0 && (depth * 16 + 16) }}
                                    onClick={() => toggleNode(row.id)}
                                >
                                    {column.format ? column.format(value) : value}
                                </StyledTableCell>
                            </>
                        )
            );
                    }
                })}
            </StyledTableRow>
            {row.children && isOpen && (
      {row.children &&
        isOpen &&
                row.children.map((child) => (
                    <TreeTableRow
                        key={child.id}
@@ -199,8 +211,7 @@
                        openNodes={openNodes}
                        setOpenNodes={setOpenNodes}
                    />
                ))
            )}
        ))}
        </React.Fragment>
    );
};
@@ -210,64 +221,166 @@
    const [selAll, setSelAll] = useState(false);
    const [treeData, setTreeData] = useState([
        {
            id: 1, matnrCode: 'root1', matnrName: '根节点', matnrGroupId: 'admin', sort: 1, checked: false, children: [
      id: 1,
      matnrCode: "root1",
      matnrName: "根节点",
      matnrGroupId: "admin",
      sort: 1,
      checked: false,
      children: [
                {
                    id: 29, matnrCode: 'root29', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: [
                        { id: 30, matnrCode: 'root30', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
                        { id: 31, matnrCode: 'root31', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
                        { id: 32, matnrCode: 'root32', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
                        { id: 33, matnrCode: 'root33', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
                        { id: 34, matnrCode: 'root34', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
                        { id: 35, matnrCode: 'root35', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
                    ]
          id: 29,
          matnrCode: "root29",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: [
            {
              id: 30,
              matnrCode: "root30",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
                },
                { id: 24, matnrCode: 'root24', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
                { id: 25, matnrCode: 'root25', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
                { id: 26, matnrCode: 'root26', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
                { id: 27, matnrCode: 'root27', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
                { id: 28, matnrCode: 'root28', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
            ]
            {
              id: 31,
              matnrCode: "root31",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
        },
        { id: 2, matnrCode: 'root2', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 3, matnrCode: 'root3', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 4, matnrCode: 'root4', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 5, matnrCode: 'root5', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 6, matnrCode: 'root6', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 7, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 8, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 9, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 10, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 11, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 12, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 13, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 14, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 15, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 16, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 17, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 18, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 19, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 20, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 21, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 22, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
        { id: 23, matnrCode: 'root', fullName: '根节点', leader: 'admin', sort: 1, checked: false, children: null },
            {
              id: 32,
              matnrCode: "root32",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
            },
            {
              id: 33,
              matnrCode: "root33",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
            },
            {
              id: 34,
              matnrCode: "root34",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
            },
            {
              id: 35,
              matnrCode: "root35",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
            },
          ],
        },
        {
          id: 24,
          matnrCode: "root24",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: null,
        },
        {
          id: 25,
          matnrCode: "root25",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: null,
        },
        {
          id: 26,
          matnrCode: "root26",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: null,
        },
        {
          id: 27,
          matnrCode: "root27",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: null,
        },
        {
          id: 28,
          matnrCode: "root28",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: null,
        },
      ],
    },
    {
      id: 2,
      matnrCode: "root2",
      fullName: "根节点",
      leader: "admin",
      sort: 1,
      checked: false,
      children: null,
    },
    {
      id: 3,
      matnrCode: "root3",
      fullName: "根节点",
      leader: "admin",
      sort: 1,
      checked: false,
      children: null,
    },
    {
      id: 4,
      matnrCode: "root4",
      fullName: "根节点",
      leader: "admin",
      sort: 1,
      checked: false,
      children: null,
    },
    ]);
    const [openNodes, setOpenNodes] = React.useState({});
    const handleSearch = () => {
        console.log('handleSearch');
    }
    console.log("handleSearch");
  };
    const selectAll = () => {
        selAll ? setSelAll(false) : setSelAll(true);
    }
  };
    useEffect(() => {
        console.log(selAll);
        const setAllChecked = (nodes, checked) => {
            nodes.forEach(node => {
      nodes.forEach((node) => {
                node.checked = !checked;
                if (node.children) {
                    setAllChecked(node.children, checked);
@@ -282,26 +395,166 @@
        }
    }, [selAll]);
  const [treeDatas, setTreeDatas] = useState([
    {
      id: 1,
      matnrCode: "root1",
      matnrName: "根节点",
      matnrGroupId: "admin",
      sort: 1,
      checked: false,
      children: [
        {
          id: 29,
          matnrCode: "root29",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: [
            {
              id: 30,
              matnrCode: "root30",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
            },
            {
              id: 31,
              matnrCode: "root31",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
            },
            {
              id: 32,
              matnrCode: "root32",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
            },
            {
              id: 33,
              matnrCode: "root33",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
            },
            {
              id: 34,
              matnrCode: "root34",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
            },
            {
              id: 35,
              matnrCode: "root35",
              fullName: "根节点",
              leader: "admin",
              sort: 1,
              checked: false,
              children: null,
            },
          ],
        },
        {
          id: 24,
          matnrCode: "root24",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: null,
        },
        {
          id: 25,
          matnrCode: "root25",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: null,
        },
        {
          id: 26,
          matnrCode: "root26",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: null,
        },
        {
          id: 27,
          matnrCode: "root27",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: null,
        },
        {
          id: 28,
          matnrCode: "root28",
          fullName: "根节点",
          leader: "admin",
          sort: 1,
          checked: false,
          children: null,
        },
      ],
    },
    {
      id: 2,
      matnrCode: "root2",
      fullName: "根节点",
      leader: "admin",
      sort: 1,
      checked: false,
      children: null,
    },
    {
      id: 3,
      matnrCode: "root3",
      fullName: "根节点",
      leader: "admin",
      sort: 1,
      checked: false,
      children: null,
    },
    {
      id: 4,
      matnrCode: "root4",
      fullName: "根节点",
      leader: "admin",
      sort: 1,
      checked: false,
      children: null,
    },
  ]);
    return (
        <>
            <Grid container rowSpacing={2} columnSpacing={2}>
                <Grid item xs={3} display="flex" gap={1}>
                    <TextInput
                        label="table.field.whMat.matnrCode"
                        source="matnrCode"
                    />
          <TextInput label="table.field.whMat.matnrCode" source="matnrCode" />
                </Grid>
                <Grid item xs={3} display="flex" gap={1}>
                    <TextInput
                        label="table.field.whMat.matnrName"
                        source="matnrName"
                    />
          <TextInput label="table.field.whMat.matnrName" source="matnrName" />
                </Grid>
                <Grid item xs={3} display="flex" gap={1}>
                    <ReferenceInput
                        source="groupId"
                        reference="matnrGroup"
                    >
          <ReferenceInput source="groupId" reference="matnrGroup">
                        <AutocompleteInput
                            label="table.field.whMat.matnrGroupId"
                            optionText="name"
@@ -310,35 +563,20 @@
                    </ReferenceInput>
                </Grid>
                <Grid item xs={3} display="flex" gap={1}>
                    <TextInput
                        label="table.field.whMat.spec"
                        source="spec"
                    />
          <TextInput label="table.field.whMat.spec" source="spec" />
                </Grid>
                <Grid item xs={3} display="flex" gap={1}>
                    <TextInput
                        label="table.field.whMat.color"
                        source="color"
                    />
          <TextInput label="table.field.whMat.color" source="color" />
                </Grid>
                <Grid item xs={3} display="flex" gap={1}>
                    <TextInput
                        label="table.field.whMat.size"
                        source="size"
                    />
          <TextInput label="table.field.whMat.size" source="size" />
                </Grid>
                <Grid item xs={3} display="flex" gap={1}>
                    <TextInput
                        label="table.field.whMat.minWeight"
                        source="minWeight"
                    />
          <TextInput label="table.field.whMat.minWeight" source="minWeight" />
                </Grid>
                <Grid item xs={3} display="flex" gap={1}>
                    <TextInput
                        label="table.field.whMat.maxWeight"
                        source="maxWeight"
                    />
          <TextInput label="table.field.whMat.maxWeight" source="maxWeight" />
                </Grid>
            </Grid>
            <Box sx={{ mt: 2, mb: 2 }}>
@@ -349,7 +587,7 @@
                        startIcon={<Search />}
                        onClick={handleSearch}
                    >
                        {translate('ra.action.search')}
            {translate("ra.action.search")}
                    </Button>
                </Stack>
            </Box>
@@ -364,7 +602,7 @@
                            {columns.map((column, idx) => (
                                <StyledTableCell
                                    key={idx}
                                    align={column.align || 'left'}
                  align={column.align || "left"}
                                    style={{
                                        minWidth: column.minWidth,
                                    }}
@@ -375,7 +613,8 @@
                        </TableRow>
                    </TableHead>
                    <TableBody>
                        {treeData && treeData.length > 0 && (
            {treeData &&
              treeData.length > 0 &&
                            treeData.map((row) => (
                                <TreeTableRow
                                    key={row.id}
@@ -383,13 +622,12 @@
                                    openNodes={openNodes}
                                    setOpenNodes={setOpenNodes}
                                />
                            ))
                        )}
              ))}
                    </TableBody>
                </Table>
            </TableContainer>
      <WhTable data={treeDatas} />
        </>
    );
};