From c458dd9c84a66ba50cb83adaa3967823ea9effd8 Mon Sep 17 00:00:00 2001
From: skyouc
Date: 星期三, 11 六月 2025 11:26:23 +0800
Subject: [PATCH] 出库单明细搜索报错问题修复

---
 rsf-admin/src/page/orders/outStock/OutStockPublic.jsx |  372 +++++++++++++++++++++++++++++++++-------------------
 1 files changed, 233 insertions(+), 139 deletions(-)

diff --git a/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx b/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx
index b3b7062..3a9f70b 100644
--- a/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx
+++ b/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx
@@ -1,4 +1,4 @@
-import { Box, Card, Grid, LinearProgress, Select, MenuItem, ListItemText, Tooltip, IconButton } from "@mui/material";
+import { Box, Card, Grid, LinearProgress, Select, MenuItem, ListItemText } from "@mui/material";
 import React, { useState, useRef, useEffect, useMemo } from "react";
 import {
     List,
@@ -38,7 +38,7 @@
     useRefresh,
     useRedirect,
 } from 'react-admin';
-import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE, DEFAULT_ITEM_PAGE_SIZE } from '@/config/setting';
+import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE, DEFAULT_ITEM_PAGE_SIZE, DEFAULT_TYPE } from '@/config/setting';
 import { styled } from '@mui/material/styles';
 import { DataGrid, useGridApiContext, GridActionsCellItem, useGridApiRef } from '@mui/x-data-grid';
 import request from '@/utils/request';
@@ -46,6 +46,8 @@
 import CloseSharpIcon from '@mui/icons-material/CloseSharp';
 import ConfirmButton from '../../components/ConfirmButton';
 import { Delete, Edit, Add } from '@mui/icons-material';
+import OutStockSiteDialog from "./OutStockSiteDialog";
+import { color } from "framer-motion";
 
 const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({
     '& .css-1vooibu-MuiSvgIcon-root': {
@@ -59,27 +61,47 @@
     }
 }));
 
-
 const OutStockPublic = (props) => {
     const { record, open, setOpen } = props;
     const notify = useNotify();
     const gridRef = useGridApiRef();
     const [rows, setRows] = useState({});
     const translate = useTranslate();
-    const [selectedIds, setSelectedIds] = React.useState([]);
+    const [selectedIds, setSelectedIds] = useState([]);
     const [formData, setFormData] = useState({
-        orderId: record?.id
+        orderId: record?.id,
+        waveId: DEFAULT_TYPE
     });
+    const [dialog, setDialog] = useState(false);
+    const [selectedValue, setSelectedValue] = useState({});
+
+    const handleClickOpen = () => {
+        setDialog(true);
+    };
+
+    const handleClose = (value) => {
+        setDialog(false);
+        setSelectedValue(value);
+        const newRows = rows.map(item => {
+            return {
+                ...item,
+                siteNo: value?.site
+            }
+        })
+        setRows(newRows);
+    };
+
     useEffect(() => {
-        getWaveRule()
-    }, [formData, open])
+        if (open) {
+            getWaveRule()
+        }
+    }, [open, formData])
 
     const getWaveRule = async () => {
         if (formData.waveId == null && formData.waveId == undefined) {
             return
         }
         const { data: { code, data, msg } } = await request.post('/outStock/order/getOutTaskItems', { ...formData });
-
         if (code === 200) {
             setRows(data)
         } else {
@@ -94,7 +116,6 @@
         }));
     };
 
-    gridRef.current = useGridApiRef();
 
     return (
         <>
@@ -110,6 +131,7 @@
                                     <AutocompleteInput
                                         label="table.field.waveRule.type"
                                         onChange={(e) => handleChange(e, 'waveId')}
+                                        defaultValue={15}
                                         value={formData.type}
                                         validate={required()}
                                     />
@@ -158,45 +180,228 @@
                     <Grid item xl={6.3} gap={2}>
                         <Card>
                             <Box sx={{ height: 500, width: '100%' }}>
-                                <DataGrid
+                                <PreviewTable
                                     rows={rows}
-                                    columns={columns}
-                                    apiRef={gridRef}
-                                    initialState={{
-                                        pagination: {
-                                            paginationModel: {
-                                                pageSize: 15,
-                                            },
-                                        },
-                                    }}
-                                    checkboxSelection
-                                    pageSizeOptions={[15, 25, 35, 45]}
-                                    onRowSelectionModelChange={(ids) => {
-                                        setSelectedIds(ids)
-                                    }}
+                                    gridRef={gridRef}
+                                    setRows={setRows}
+                                    record={record}
+                                    selectedIds={selectedIds}
+                                    setDialog={setDialog}
+                                    setSelectedIds={setSelectedIds}
                                 />
                             </Box>
                             <Box sx={{ textAlign: 'center' }}>
                                 <CloseButton setOpen={setOpen} />
-                                <SubmitButton selectedIds={selectedIds} setSelectedIds={setSelectedIds} gridRef={gridRef} />
+                                <SubmitButton selectedIds={selectedIds} setSelectedIds={setSelectedIds} gridRef={gridRef} record={record} />
                             </Box>
                         </Card>
                     </Grid>
+                </Grid>
+                <Grid>
+                    <OutStockSiteDialog
+                        selectedValue={selectedValue}
+                        open={dialog}
+                        onClose={handleClose}
+                    />
                 </Grid>
             </Box>
         </>
     );
 }
 
+const PreviewTable = ({ rows, gridRef, setRows, record, selectedIds, setSelectedIds, setDialog }) => {
+    gridRef.current = useGridApiRef();
+    const translate = useTranslate();
+
+    const columns = [
+        // { field: 'id', headerName: 'ID', width: 40 },
+        { field: 'locCode', headerName: '搴撲綅', width: 110 },
+        { field: 'barcode', headerName: '瀹瑰櫒', width: 120 },
+        { field: 'matnrCode', headerName: '鐗╂枡缂栫爜', width: 120 },
+        { field: 'batch', headerName: '鎵规', width: 90 },
+        { field: 'unit', headerName: '鍗曚綅', width: 60 },
+        { field: 'outQty', headerName: '鍑哄簱鏁伴噺', width: 110, },
+        {
+            field: 'anfme', headerName: '搴撳瓨鏁伴噺', width: 110,
+            renderCell: (params) => (
+                <OutStockAnfme value={params.value} />
+            )
+        },
+        {
+            field: 'siteNo',
+            headerName: '鍑哄簱鍙�',
+            width: 90,
+            type: 'singleSelect',
+            editable: true,
+            renderCell: (params) => (
+                <OutStockSiteNo value={params.value} />
+            ),
+            renderEditCell: (params) => (
+                <OutStockSite {...params} />
+            ),
+        },
+        {
+            field: 'actions',
+            type: 'actions',
+            headerName: '鎿嶄綔',
+            with: 120,
+            getActions: (params) => [
+                <GridActionsCellItem
+                    icon={<Delete />}
+                    label="Delete"
+                    onClick={() => handleDelete(params.row, rows, setRows)}
+                />,
+            ]
+        },
+    ]
+
+    /**
+     * 鍒犻櫎浜嬩欢
+     * @param {*} params 
+     */
+    const handleDelete = (params, rows, setRows) => {
+        const outRows = rows.filter(row => {
+            return row.id !== params.id
+        })
+        setRows(outRows)
+    }
+
+    const OutStockAnfme = React.memo(function OutStockAnfme(props) {
+        const { value } = props;
+        return (
+            value > 0 ?
+                <Box
+                    sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}
+                >
+                    <span>{value}</span>
+                </Box> :
+                <Box
+                    sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}
+                >
+                    <span style={{color: 'red'}}>{translate('common.edit.title.insuffInventory')}</span>
+                </Box>
+        );
+    });
+
+    const OutStockSiteNo = React.memo(function OutStockSiteNo(props) {
+        const { value } = props;
+        if (!value) {
+            return null;
+        }
+        return (
+            <Box
+                sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}
+            >
+                <span>{value}</span>
+            </Box>
+        );
+    });
+
+    const CustomToolBar = () => {
+        const selectSiteNo = () => {
+            setDialog(true)
+        }
+
+        return (
+            selectedIds.length > 0 ? <Box sx={{
+                p: 1,
+                display: 'flex',
+                justifyContent: 'flex-end',
+                borderTop: '1px solid rgba(224, 224, 224, 1)'
+            }}>
+                <Button
+                    onClick={selectSiteNo}
+                    variant="outlined"
+                    label="toolbar.modiftySite"
+                    size="medium"
+                    sx={{ mr: 1 }} />
+            </Box> : <></>
+        );
+    }
+
+    const OutStockSite = (params) => {
+        const { id, field, siteNo, row: { staNos } } = params;
+        const apiRef = useGridApiContext();
+        const handleChange = async (event) => {
+            await apiRef.current.setEditCellValue(
+                { id, field, value: event.target.value },
+                event,
+            );
+            apiRef.current.stopCellEditMode({ id, field });
+        };
+
+        const handleClose = (event, reason) => {
+            if (reason === 'backdropClick') {
+                apiRef.current.stopCellEditMode({ id, field });
+            }
+        };
+
+        return (
+            <Select
+                value={siteNo}
+                onChange={handleChange}
+                MenuProps={{
+                    onClose: handleClose,
+                }}
+                sx={{
+                    height: '100%',
+                    '& .MuiSelect-select': {
+                        display: 'flex',
+                        alignItems: 'center',
+                        pl: 1,
+                    },
+                }}
+                autoFocus
+                fullWidth
+                open
+            >
+                {staNos.map((option) => {
+                    return (
+                        <MenuItem
+                            key={option}
+                            value={option.staNo}
+                        >
+                            <ListItemText sx={{ overflow: 'hidden' }} primary={option.staNo} />
+                        </MenuItem>
+                    );
+                })}
+            </Select >
+        )
+    }
+
+    return (
+        <DataGrid
+            rows={rows}
+            columns={columns}
+            slots={{ toolbar: CustomToolBar }}
+            apiRef={gridRef}
+            initialState={{
+                pagination: {
+                    paginationModel: {
+                        pageSize: 15,
+                    },
+                },
+            }}
+            checkboxSelection
+            disableRowSelectionOnClick
+            pageSizeOptions={[15, 25, 35, 45]}
+            onRowSelectionModelChange={(ids) => {
+                setSelectedIds(ids)
+            }}
+        />
+    )
+}
+
+
 
 //鎻愪氦鎸夐挳
-const SubmitButton = ({ selectedIds, setSelectedIds, gridRef }) => {
+const SubmitButton = ({ selectedIds, setSelectedIds, gridRef, record }) => {
     const notify = useNotify();
     const refresh = useRefresh();
-    const redirect = useRedirect();    
+    const redirect = useRedirect();
     const submit = async () => {
         const items = gridRef.current?.getSortedRows();
-        const { data: { code, data, msg } } = await request.post('/outStock/generate/tasks', { items });
+        const { data: { code, data, msg } } = await request.post('/outStock/generate/tasks', { items, outId: record?.id });
         if (code == 200) {
             refresh();
             redirect("/task")
@@ -230,117 +435,6 @@
             sx={{ margin: '3.5em' }} />
     )
 }
-
-const columns = [
-    { field: 'id', headerName: 'ID', width: 40 },
-    { field: 'locCode', headerName: '搴撲綅', width: 110 },
-    { field: 'barcode', headerName: '瀹瑰櫒', width: 120 },
-    { field: 'batch', headerName: '鎵规', width: 90 },
-    { field: 'unit', headerName: '鍗曚綅', width: 90 },
-    { field: 'outQty', headerName: '鏈鍑哄簱鏁伴噺', width: 110 },
-    {
-        field: 'siteNo',
-        headerName: '鍑哄簱鍙�',
-        width: 90,
-        type: 'singleSelect',
-        editable: true,
-        renderCell: (params) => (
-            <OutStockSiteNo value={params.value} />
-        ),
-        renderEditCell: (params) => (
-            <OutStockSite {...params} />
-        ),
-    },
-    {
-        field: 'actions',
-        type: 'actions',
-        headerName: '鎿嶄綔',
-        with: 120,
-        getActions: (params) => [
-            <GridActionsCellItem
-                icon={<Delete />}
-                label="Delete"
-                onClick={() => handleDelete(params.row.id)}
-            />,
-        ]
-    },
-]
-
-/**
- * 鍒犻櫎浜嬩欢
- * @param {*} params 
- */
-const handleDelete = (params) => {
-    console.log(params);
-
-}
-
-
-const OutStockSiteNo = React.memo(function OutStockSiteNo(props) {
-    const { value } = props;
-    if (!value) {
-        return null;
-    }
-    return (
-        <Box
-            sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}
-        >
-            <span>{value}</span>
-        </Box>
-    );
-});
-
-
-const OutStockSite = (params) => {
-    const { id, field, siteNo, row: { staNos } } = params;
-    const apiRef = useGridApiContext();
-    const handleChange = async (event) => {
-        await apiRef.current.setEditCellValue(
-            { id, field, value: event.target.value },
-            event,
-        );
-        apiRef.current.stopCellEditMode({ id, field });
-    };
-
-    const handleClose = (event, reason) => {
-        if (reason === 'backdropClick') {
-            apiRef.current.stopCellEditMode({ id, field });
-        }
-    };
-
-    return (
-        <Select
-            value={siteNo}
-            onChange={handleChange}
-            MenuProps={{
-                onClose: handleClose,
-            }}
-            sx={{
-                height: '100%',
-                '& .MuiSelect-select': {
-                    display: 'flex',
-                    alignItems: 'center',
-                    pl: 1,
-                },
-            }}
-            autoFocus
-            fullWidth
-            open
-        >
-            {staNos.map((option) => {
-                return (
-                    <MenuItem
-                        key={option}
-                        value={option.staNo}
-                    >
-                        <ListItemText sx={{ overflow: 'hidden' }} primary={option.staNo} />
-                    </MenuItem>
-                );
-            })}
-        </Select >
-    )
-}
-
 
 export default OutStockPublic;
 

--
Gitblit v1.9.1