From d96cb8a176a2cd7406de97b9a6e321f8ecd4c707 Mon Sep 17 00:00:00 2001
From: skyouc
Date: 星期一, 31 三月 2025 07:59:54 +0800
Subject: [PATCH] Merge branch 'devlop' of http://47.97.1.152:5880/r/wms-master into devlop

---
 rsf-admin/src/page/asnOrder/AsnWareModal.jsx |  374 ++++++++++++++++++++--------------------------------
 1 files changed, 145 insertions(+), 229 deletions(-)

diff --git a/rsf-admin/src/page/asnOrder/AsnWareModal.jsx b/rsf-admin/src/page/asnOrder/AsnWareModal.jsx
index 8bd3975..d4591f8 100644
--- a/rsf-admin/src/page/asnOrder/AsnWareModal.jsx
+++ b/rsf-admin/src/page/asnOrder/AsnWareModal.jsx
@@ -1,24 +1,4 @@
-import React, { useState, useRef, useEffect, useMemo } from "react";
-import {
-    CreateBase,
-    useTranslate,
-    TextInput,
-    NumberInput,
-    BooleanInput,
-    DateInput,
-    SaveButton,
-    SelectInput,
-    ReferenceInput,
-    ReferenceArrayInput,
-    AutocompleteInput,
-    Toolbar,
-    required,
-    useDataProvider,
-    useNotify,
-    Form,
-    useCreateController,
-    useRefresh,
-} from 'react-admin';
+import React, { useState, useEffect } from "react";
 import {
     Dialog,
     DialogActions,
@@ -30,32 +10,23 @@
     Box,
     Button,
     Paper,
-    TableContainer,
-    Table,
-    TableHead,
-    TableBody,
-    TableRow,
-    TableCell,
-    Checkbox,
     styled
-
-
 } from '@mui/material';
 import DialogCloseButton from "../components/DialogCloseButton";
-import StatusSelectInput from "../components/StatusSelectInput";
 import ConfirmButton from "../components/ConfirmButton";
-import MemoInput from "../components/MemoInput";
-import { useForm, Controller, useWatch, FormProvider, useFormContext } from "react-hook-form";
-import SaveIcon from '@mui/icons-material/Save';
+import { useTranslate, useNotify, useRefresh } from 'react-admin';
 import request from '@/utils/request';
+import { DataGrid } from '@mui/x-data-grid';
+import SaveIcon from '@mui/icons-material/Save';
+import TreeSelectInput from "@/page/components/TreeSelectInput";
 const AsnWareModal = (props) => {
-    const { open, setOpen } = props;
+    const { open, setOpen, data, setData } = props;
 
     const translate = useTranslate();
     const notify = useNotify();
     const refresh = useRefresh();
 
-    const asnId = ''
+    const asnId = '';
 
     const handleClose = (event, reason) => {
         if (reason !== "backdropClick") {
@@ -64,11 +35,12 @@
     };
 
     const [formData, setFormData] = useState({
-        type: '',
-        wkType: ''
+        name: '',
+        code: ''
     });
 
-    const [tabelData, setTableData] = useState([{ id: 1 }, { id: 2 }]);
+    const [tableData, setTableData] = useState([]);
+    const [dyFields, setDyFields] = useState([]);
     const [selectedRows, setSelectedRows] = useState([]);
 
     const handleChange = (e) => {
@@ -79,13 +51,55 @@
         }));
     };
 
+    const reset = () => {
+        setFormData({
+            name: '',
+            code: ''
+        })
+    }
+
     const handleSubmit = () => {
-        console.log(formData);
+        const hasarr = data.map(el => +el.matnrId)
+        const selectedData = selectedRows.filter(item => !hasarr.includes(item)).map(id => (tableData.find(row => row.id === id)));
+        const value = selectedData.map((el => {
+            const dynamicFields = dyFields.reduce((acc, item) => {
+                acc[item.fields] = el['extendFields']?.[item.fields] || '';
+                return acc;
+            }, {});
+            return {
+                matnrId: el.id,
+                maktx: el.name,
+                maktxCode: el.code,
+                stockUnit: el.stockUnit || '',
+                purUnit: el.purchaseUnit || '',
+                ...dynamicFields
+            }
+        }))
+        setData([...data, ...value]);
+        setOpen(false);
+        reset();
     };
 
+    const getData = async () => {
+        const res = await request.post(`/matnr/page`, {
+            ...formData,
+            current: 1,
+            pageSize: 199,
+            orderBy: "create_time desc"
+        });
+        if (res?.data?.code === 200) {
+            setTableData(res.data.data.records);
+        } else {
+            notify(res.data.msg);
+        }
+    };
 
+    useEffect(() => {
+        getData();
+    }, [open]);
 
     const handleSearch = () => {
+        getData()
     };
 
     return (
@@ -95,7 +109,7 @@
             aria-labelledby="form-dialog-title"
             fullWidth
             disableRestoreFocus
-            maxWidth="lg"   // 'xs' | 'sm' | 'md' | 'lg' | 'xl'
+            maxWidth="lg"
         >
             <DialogTitle id="form-dialog-title" sx={{
                 position: 'sticky',
@@ -111,230 +125,132 @@
             <DialogContent sx={{ mt: 2 }}>
                 <Box component="form" onSubmit={handleSubmit} sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}>
                     <Grid container spacing={2}>
-                        <Grid item xs={4}>
+                        <Grid item md={4}>
                             <TextField
-                                label={translate('table.field.asnOrder.type')}
-                                name="type"
-                                value={formData.type}
+                                label={translate('table.field.matnr.name')}
+                                name="name"
+                                value={formData.name}
                                 onChange={handleChange}
-                                variant="outlined"
                                 size="small"
                             />
                         </Grid>
-
-                        <Grid item xs={4}>
+                        <Grid item md={4}>
                             <TextField
-                                label={translate('table.field.asnOrder.wkType')}
-                                name="wkType"
-                                value={formData.wkType}
+                                label={translate('table.field.matnr.code')}
+                                name="code"
+                                value={formData.code}
                                 onChange={handleChange}
-                                variant="outlined"
                                 size="small"
+                            />
+                        </Grid>
+                        <Grid item md={4}>
+                            <TreeSelectInput
+                                label="table.field.matnr.groupId"
+                                value={formData.groupId}
+                                resource={'matnrGroup'}
+                                source="groupId"
+                                name="groupId"
+                                onChange={handleChange}
                             />
                         </Grid>
                     </Grid>
                 </Box>
-
                 <Box sx={{ mt: 2 }}>
                     <Stack direction="row" spacing={2}>
                         <Button variant="contained" onClick={handleSearch}>鎼滅储</Button>
                     </Stack>
-
                 </Box>
-
-                <Box sx={{ mt: 2 }}>
-                    <AsnWareModalTable tabelData={tabelData} setTableData={setTableData} selectedRows={selectedRows}
-                        setSelectedRows={setSelectedRows}></AsnWareModalTable>
+                <Box sx={{ mt: 2, height: 400, width: '100%' }}>
+                    <AsnWareModalTable
+                        tableData={tableData}
+                        setTableData={setTableData}
+                        dyFields={dyFields}
+                        setDyFields={setDyFields}
+                        selectedRows={selectedRows}
+                        setSelectedRows={setSelectedRows}
+                    />
                 </Box>
             </DialogContent>
             <DialogActions sx={{ position: 'sticky', bottom: 0, backgroundColor: 'background.paper', zIndex: 1000 }}>
-                <Toolbar sx={{ width: '100%', justifyContent: 'space-between' }}  >
+                <Box sx={{ width: '100%', display: 'flex', justifyContent: 'space-between' }}>
                     <Button onClick={handleSubmit} variant="contained" startIcon={<SaveIcon />}>
-                        纭
+                        {translate('toolbar.confirm')}
                     </Button>
-                </Toolbar>
+                </Box>
             </DialogActions>
-
-
         </Dialog>
-    )
-}
+    );
+};
 
 export default AsnWareModal;
 
-const AsnWareModalTable = ({ tabelData, setTableData }) => {
+const AsnWareModalTable = ({ tableData, setTableData, selectedRows, setSelectedRows, dyFields, setDyFields }) => {
     const translate = useTranslate();
     const notify = useNotify();
-    const refresh = useRefresh();
 
-    const [selected, setSelected] = React.useState([]);
+    const [columns, setColumns] = useState([
+        // { field: 'id', headerName: 'ID', width: 100 },
+        { field: 'name', headerName: translate('table.field.matnr.name'), width: 300 },
+        { field: 'code', headerName: translate('table.field.matnr.code'), width: 100 },
+        { field: 'groupId$', headerName: translate('table.field.matnr.groupId'), width: 100 },
+        { field: 'spec', headerName: translate('table.field.matnr.spec'), width: 100 },
+        { field: 'model', headerName: translate('table.field.matnr.model'), width: 100 },
+        { field: 'weight', headerName: translate('table.field.matnr.weight'), width: 100 },
 
-    const columns = [
-        {
-            id: 'id',
-            label: 'ID',
-            minWidth: 100
-        },
-        {
-            id: 'name',
-            label: 'table.field.matnr.name',
-            minWidth: 100
-        },
-        {
-            id: 'code',
-            label: 'table.field.matnr.code',
-            minWidth: 100
-        },
-        {
-            id: 'spec',
-            label: 'table.field.matnr.spec',
-            minWidth: 100
-        },
-        {
-            id: 'model',
-            label: 'table.field.matnr.model',
-            minWidth: 100
-        },
-        {
-            id: 'weight',
-            label: 'table.field.matnr.weight',
-            minWidth: 100
-        },
-        {
-            id: 'color',
-            label: 'table.field.matnr.color',
-            minWidth: 100
-        },
-        {
-            id: 'size',
-            label: 'table.field.matnr.size',
-            minWidth: 100
-        },
-        {
-            id: 'describle',
-            label: 'table.field.matnr.describle',
-            minWidth: 100
-        },
-        {
-            id: 'nromNum',
-            label: 'table.field.matnr.nromNum',
-            minWidth: 100
-        },
-        {
-            id: 'unit',
-            label: 'table.field.matnr.unit',
-            minWidth: 100
-        },
-        {
-            id: 'purchaseUnit',
-            label: 'table.field.matnr.purUnit',
-            minWidth: 100
-        },
-        {
-            id: 'stockUnit',
-            label: 'table.field.matnr.stockUnit',
-            minWidth: 100
-        },
-        {
-            id: 'stockLeval$',
-            label: 'table.field.matnr.stockLevel',
-            minWidth: 100,
-            sortable: false
-        },
+        { field: 'describle', headerName: translate('table.field.matnr.describle'), width: 100 },
+        { field: 'nromNum', headerName: translate('table.field.matnr.nromNum'), width: 100 },
+        { field: 'unit', headerName: translate('table.field.matnr.unit'), width: 100 },
+        { field: 'purchaseUnit', headerName: translate('table.field.matnr.purUnit'), width: 100 },
+        { field: 'stockUnit', headerName: translate('table.field.matnr.stockUnit'), width: 100 },
+        { field: 'stockLeval$', headerName: translate('table.field.matnr.stockLevel'), width: 100, sortable: false },
+    ])
 
 
-    ];
 
-    const StyledTableRow = styled(TableRow)(({ theme }) => ({
-        "& .MuiButtonBase-root.": {
-            padding: "0px 0px",
-        },
-    }));
+    const handleSelectionChange = (ids) => {
+        setSelectedRows(ids)
 
-    const StyledTableCell = styled(TableCell)(({ theme }) => ({
-        "& .MuiButtonBase-root": {
-            padding: "0px 0px",
-        },
-        overflow: "hidden",
-        textOverflow: "ellipsis",
-        whiteSpace: "nowrap",
-        maxWidth: 600,
-    }));
-
-    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);
     };
 
-    // const handleSelectAllClick = (event) => {
-    //     if (event.target.checked) {
-    //         const newSelected = tabelData.map((n) => n.id);
-    //         setSelected(newSelected);
-    //         return;
-    //     }
-    //     setSelected([]);
-    // };
+    useEffect(() => {
+        getDynamicFields();
+    }, []);
+
+    const getDynamicFields = async () => {
+        const {
+            data: { code, data, msg },
+        } = await request.get("/fields/enable/list");
+        if (code === 200) {
+            const cols = data.map(el => ({
+                field: el.fields,
+                headerName: el.fieldsAlise,
+                minWidth: 100,
+                flex: 1,
+                editable: el.unique,
+                valueGetter: (value, row) => {
+                    return row.extendFields?.[el.fields] || '';
+                },
+            }))
+            setDyFields(data)
+            setColumns([...columns, ...cols])
+        } else {
+            notify(msg);
+        }
+    }
 
     return (
-        <TableContainer component={Paper} >
-            <Table size="small" >
-                <TableHead>
-                    <StyledTableRow key={'head'}>
-                        <TableCell padding="checkbox">
-                            <Checkbox
-                                color="primary"
-                            />
-                        </TableCell>
-                        {columns.map((column) => {
-                            const value = column.label;
-                            return (
-                                <StyledTableCell
-                                    key={column.id}
-                                    align={column.align || "left"}
-                                >
-                                    {column.format ? column.format(value) : translate(value)}
-                                </StyledTableCell>
-                            );
-
-                        })}
-                    </StyledTableRow>
-                </TableHead>
-
-                <TableBody>
-
-                    {tabelData.map((row) => {
-                        const isItemSelected = selected.includes(row.id);
-                        return (<StyledTableRow key={row.id || Math.random()} aria-checked={isItemSelected} selected={isItemSelected} onClick={(event) => handleClick(event, row.id)}>
-                            <TableCell padding="checkbox">
-                                <Checkbox
-                                    color="primary"
-                                    checked={isItemSelected}
-                                />
-                            </TableCell>
-                            {columns.map((column) => (
-                                <StyledTableCell key={column.id} >
-                                    {row[column.id]}
-                                </StyledTableCell>
-                            ))}
-                        </StyledTableRow>)
-                    })}
-
-                </TableBody>
-            </Table>
-        </TableContainer>
-    )
-}
+        <div style={{ height: 400, width: '100%' }}>
+            <DataGrid
+                size="small"
+                rows={tableData}
+                columns={columns}
+                checkboxSelection
+                onRowSelectionModelChange={handleSelectionChange}
+                selectionModel={selectedRows}
+                disableColumnMenu={true}
+                disableColumnSorting
+                disableMultipleColumnsSorting
+            />
+        </div>
+    );
+};
\ No newline at end of file

--
Gitblit v1.9.1