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 |  398 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 394 insertions(+), 4 deletions(-)

diff --git a/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx b/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx
index 6a4a626..3a9f70b 100644
--- a/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx
+++ b/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx
@@ -1,3 +1,4 @@
+import { Box, Card, Grid, LinearProgress, Select, MenuItem, ListItemText } from "@mui/material";
 import React, { useState, useRef, useEffect, useMemo } from "react";
 import {
     List,
@@ -12,7 +13,6 @@
     ExportButton,
     BulkDeleteButton,
     WrapperField,
-    Toolbar,
     useRecordContext,
     useTranslate,
     useNotify,
@@ -33,19 +33,409 @@
     AutocompleteInput,
     DeleteButton,
     SimpleForm,
+    required,
     Form,
-    SaveButton,
     useRefresh,
-    useGetList,
+    useRedirect,
 } from 'react-admin';
+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';
+import ConfirmationNumberOutlinedIcon from '@mui/icons-material/ConfirmationNumberOutlined';
+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': {
+        height: '.9em'
+    },
+    '& .RaDatagrid-row': {
+        cursor: 'auto'
+    },
+    '& .column-maktx': {
+        width: 200
+    }
+}));
 
 const OutStockPublic = (props) => {
+    const { record, open, setOpen } = props;
+    const notify = useNotify();
+    const gridRef = useGridApiRef();
+    const [rows, setRows] = useState({});
+    const translate = useTranslate();
+    const [selectedIds, setSelectedIds] = useState([]);
+    const [formData, setFormData] = useState({
+        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(() => {
+        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 {
+            notify(msg);
+        }
+    }
+
+    const handleChange = (value, name) => {
+        setFormData((prevData) => ({
+            ...prevData,
+            [name]: value
+        }));
+    };
+
 
     return (
         <>
-        
+            <Box>
+                <Grid sx={{ display: "flex" }} container rowSpacing={2} columnSpacing={2}>
+                    <Grid item xl={5.7} gap={2} >
+                        <Card>
+                            <Form>
+                                <ReferenceInput
+                                    source="type"
+                                    reference="waveRule"
+                                >
+                                    <AutocompleteInput
+                                        label="table.field.waveRule.type"
+                                        onChange={(e) => handleChange(e, 'waveId')}
+                                        defaultValue={15}
+                                        value={formData.type}
+                                        validate={required()}
+                                    />
+                                </ReferenceInput>
+                            </Form>
+                            <List
+                                resource="outStockItem"
+                                storeKey='outStockItem'
+                                sx={{
+                                    flexGrow: 1,
+                                    transition: (theme) =>
+                                        theme.transitions.create(['all'], {
+                                            duration: theme.transitions.duration.enteringScreen,
+                                        }),
+                                }}
+                                title={"menu.outStockItem"}
+                                empty={false}
+                                filter={{ asnId: record?.id, deleted: 0 }}
+                                sort={{ field: "create_time", order: "desc" }}
+                                actions={false}
+                                perPage={DEFAULT_ITEM_PAGE_SIZE}
+                            >
+                                <LinearProgress
+                                    sx={{ height: "2px", position: 'absolute', top: 0, left: 0, right: 0, }}
+                                />
+                                <StyledDatagrid
+                                    preferenceKey='outStockItem'
+                                    bulkActionButtons={false}
+                                    rowClick={false}
+                                    omit={['id', 'splrName', 'qty', 'poCode', 'workQty']}
+                                >
+                                    <NumberField source="id" />
+                                    <TextField source="asnCode" label="table.field.outStockItem.asnCode" />
+                                    <TextField source="poCode" label="table.field.outStockItem.poCode" />
+                                    <TextField source="matnrCode" label="table.field.outStockItem.matnrCode" />
+                                    <TextField source="maktx" label="table.field.outStockItem.maktx" />
+                                    <NumberField source="anfme" label="table.field.outStockItem.anfme" />
+                                    <NumberField source="workQty" label="table.field.outStockItem.workQty" />
+                                    <NumberField source="qty" label="table.field.outStockItem.qty" />
+                                    <TextField source="stockUnit" label="table.field.outStockItem.stockUnit" />
+                                    <TextField source="splrName" label="table.field.outStockItem.splrName" />
+                                </StyledDatagrid>
+                            </List>
+                        </Card>
+                    </Grid>
+                    <Grid item xl={6.3} gap={2}>
+                        <Card>
+                            <Box sx={{ height: 500, width: '100%' }}>
+                                <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} />
+                            </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, record }) => {
+    const notify = useNotify();
+    const refresh = useRefresh();
+    const redirect = useRedirect();
+    const submit = async () => {
+        const items = gridRef.current?.getSortedRows();
+        const { data: { code, data, msg } } = await request.post('/outStock/generate/tasks', { items, outId: record?.id });
+        if (code == 200) {
+            refresh();
+            redirect("/task")
+        } else {
+            notify(msg);
+        }
+    }
+    return (
+        <ConfirmButton
+            label="toolbar.confirm"
+            variant="contained"
+            size="medium"
+            onConfirm={submit}
+            startIcon={<ConfirmationNumberOutlinedIcon />}
+        />
+    )
+}
+
+//鍏抽棴鎸夐挳
+const CloseButton = ({ setOpen }) => {
+    const close = () => {
+        setOpen(false)
+    }
+    return (
+        <Button
+            label="toolbar.close"
+            variant="outlined"
+            size="medium"
+            onClick={close}
+            startIcon={<CloseSharpIcon />}
+            sx={{ margin: '3.5em' }} />
+    )
+}
+
 export default OutStockPublic;
+
+

--
Gitblit v1.9.1