出库单明细搜索报错问题修复

skyouc

2025-06-11 c458dd9c84a66ba50cb83adaa3967823ea9effd8

 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 {
@@ -109,6 +131,7 @@
                                    <AutocompleteInput
                                        label="table.field.waveRule.type"
                                        onChange={(e) => handleChange(e, 'waveId')}
                                        defaultValue={15}
                                        value={formData.type}
                                        validate={required()}
                                    />
@@ -157,30 +180,53 @@
                    <Grid item xl={6.3} gap={2}>
                        <Card>
                            <Box sx={{ height: 500, width: '100%' }}>
                                <PreviewTable rows={rows} gridRef={gridRef} setRows={setRows} record={record}/>
                                <PreviewTable
                                    rows={rows}
                                    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} record={record}/>
                                <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 }) => {
const PreviewTable = ({ rows, gridRef, setRows, record, selectedIds, setSelectedIds, setDialog }) => {
    gridRef.current = useGridApiRef();
    const translate = useTranslate();

    const columns = [
        { field: 'id', headerName: 'ID', width: 40 },
        // { 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: 90 },
        { field: 'outQty', headerName: '本次出库数量', width: 110 },
        { field: 'unit', headerName: '单位', width: 60 },
        { field: 'outQty', headerName: '出库数量', width: 110, },
        {
            field: 'anfme', headerName: '库存数量', width: 110,
            renderCell: (params) => (
                <OutStockAnfme value={params.value} />
            )
        },
        {
            field: 'siteNo',
            headerName: '出库口',
@@ -214,11 +260,28 @@
     * @param {*} params 
     */
    const handleDelete = (params, rows, setRows) => {
        const outRows = rows.filter(row => { 
             return row.id !== params.id 
        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;
@@ -233,6 +296,28 @@
            </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;
@@ -288,6 +373,7 @@
        <DataGrid
            rows={rows}
            columns={columns}
            slots={{ toolbar: CustomToolBar }}
            apiRef={gridRef}
            initialState={{
                pagination: {
@@ -297,6 +383,7 @@
                },
            }}
            checkboxSelection
            disableRowSelectionOnClick
            pageSizeOptions={[15, 25, 35, 45]}
            onRowSelectionModelChange={(ids) => {
                setSelectedIds(ids)
@@ -305,13 +392,14 @@
    )
}



//提交按钮
const SubmitButton = ({ selectedIds, setSelectedIds, gridRef, record }) => {
    const notify = useNotify();
    const refresh = useRefresh();
    const redirect = useRedirect();
    const submit = async () => {
        console.log(record);
        const items = gridRef.current?.getSortedRows();
        const { data: { code, data, msg } } = await request.post('/outStock/generate/tasks', { items, outId: record?.id });
        if (code == 200) {