verou
2025-03-30 e427f61669e3d7adae588dd5c0d3d349dfccea58
rsf-admin/src/page/asnOrder/AsnOrderModal.jsx
@@ -53,15 +53,16 @@
import { Add, Edit, Delete } from '@mui/icons-material';
import _ from 'lodash';
import { DataGrid } from '@mui/x-data-grid';
import DictionarySelect from "../components/DictionarySelect";
import DictSelect from "../components/DictSelect";
const AsnOrderModal = (props) => {
    const { open, setOpen, asnId } = props;
    const translate = useTranslate();
    const notify = useNotify();
    const refresh = useRefresh();
    const [createDialog, setCreateDialog] = useState(false);
    useEffect(() => {
@@ -75,19 +76,20 @@
        if (reason !== "backdropClick") {
            setOpen(false);
            refresh();
            setFormData({ type: '' })
            setFormData({ type: '', wkType: '' })
            setTableData([])
        }
    };
    const [formData, setFormData] = useState({
        type: '',
        wkType: '',
    });
    const [tabelData, setTableData] = useState([]);
    const handleChange = (e) => {
        const { name, value } = e.target;
    const handleChange = (value, name) => {
        setFormData((prevData) => ({
            ...prevData,
            [name]: value
@@ -95,16 +97,34 @@
    };
    const handleSubmit = async () => {
        const parmas = {
            "orders": formData,
            "items": tabelData,
        }
        const res = await request.post(`/asnOrder/items/save`, parmas);
        if (res?.data?.code === 200) {
            setOpen(false);
        if (asnId === 0) {
            const parmas = {
                "orders": formData,
                "items": tabelData,
            }
            const res = await request.post(`/asnOrder/items/save`, parmas);
            if (res?.data?.code === 200) {
                setOpen(false);
                refresh();
            } else {
                notify(res.data.msg);
            }
        } else {
            notify(res.data.msg);
            const parmas = {
                "orders": formData,
                "items": tabelData,
            }
            const res = await request.post(`/asnOrder/items/update`, parmas);
            if (res?.data?.code === 200) {
                setOpen(false);
                refresh();
            } else {
                notify(res.data.msg);
            }
        }
    };
@@ -125,7 +145,6 @@
        } else {
            notify(res.data.msg);
        }
    }
    const requestGetBody = async () => {
@@ -137,6 +156,12 @@
        }
    }
    const [selectedRows, setSelectedRows] = useState([]);
    const handleDeleteItem = () => {
        const newTableData = _.filter(tabelData, (item) => !selectedRows.includes(item.matnrId));
        setTableData(newTableData);
    }
    return (
        <>
@@ -161,51 +186,51 @@
                    </Box>
                </DialogTitle>
                <DialogContent sx={{ mt: 2 }}>
                    <Box component="form" sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}>
                        <form>
                    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}>
                        <Form>
                            <Grid container spacing={2}>
                                <Grid item xs={4}>
                                    <TextField
                                        label={translate('table.field.asnOrder.type')}
                                        name="type"
                                <Grid item md={4}>
                                    <DictSelect
                                        label={translate("table.field.asnOrder.type")}
                                        value={formData.type}
                                        onChange={handleChange}
                                        variant="outlined"
                                        size="small"
                                        validate={required()}
                                        onChange={(e) => handleChange(e.target.value, 'type')}
                                        dictTypeCode="sys_order_type"
                                        required
                                    />
                                </Grid>
                                {/* <Grid item xs={4}>
                                <TextField
                                    label={translate('table.field.asnOrder.wkType')}
                                    name="wkType"
                                    value={formData.wkType}
                                    onChange={handleChange}
                                    variant="outlined"
                                    size="small"
                                />
                            </Grid> */}
                                <Grid item md={4}>
                                    <DictSelect
                                        label={translate("table.field.asnOrder.wkType")}
                                        value={formData.wkType}
                                        onChange={(e) => handleChange(e.target.value, 'wkType')}
                                        dictTypeCode="sys_business_type"
                                        required
                                    />
                                </Grid>
                            </Grid>
                        </form>
                        </Form>
                    </Box>
                    <Box sx={{ mt: 2 }}>
                        <Stack direction="row" spacing={2}>
                            <Button variant="contained" onClick={() => setCreateDialog(true)}>新增物料</Button>
                            {asnId !== '' && <ConfirmButton label={'删除'} variant="outlined" color="error" onConfirm={handleDelete} />}
                            {/* {asnId !== '' && <ConfirmButton label={'删除'} variant="outlined" color="error" onConfirm={handleDelete} />} */}
                            <ConfirmButton label={'删除'} variant="outlined" color="error" onConfirm={handleDeleteItem} />
                        </Stack>
                    </Box>
                    <Box sx={{ mt: 2 }}>
                        <AsnOrderModalTable tabelData={tabelData} setTableData={setTableData} ></AsnOrderModalTable>
                        <AsnOrderModalTable tabelData={tabelData} setTableData={setTableData} asnId={asnId} selectedRows={selectedRows} setSelectedRows={setSelectedRows} ></AsnOrderModalTable>
                    </Box>
                </DialogContent>
                <DialogActions sx={{ position: 'sticky', bottom: 0, backgroundColor: 'background.paper', zIndex: 1000 }}>
                    <Toolbar sx={{ width: '100%', justifyContent: 'space-between' }}  >
                        <Button onClick={handleSubmit} variant="contained" startIcon={<SaveIcon />}>
                            确认
                            {translate('toolbar.confirm')}
                        </Button>
                    </Toolbar>
                </DialogActions>
@@ -224,34 +249,29 @@
export default AsnOrderModal;
const AsnOrderModalTable = ({ tabelData, setTableData }) => {
const AsnOrderModalTable = ({ tabelData, setTableData, asnId, selectedRows, setSelectedRows }) => {
    const translate = useTranslate();
    const notify = useNotify();
    const columns = [
        {
            field: 'action',
            headerName: '操作',
            minWidth: 100,
            sticky: 'right',
            flex: 1,
            renderCell: (params) => (
                <Tooltip title="Delete">
                    <IconButton onClick={() => handleDelete(params.row)}>
                        <Delete />
                    </IconButton>
                </Tooltip>
            ),
        },
    const [columns, setColumns] = useState([
        {
            field: 'matnrId',
            headerName: translate('table.field.asnOrderItem.matnrId'),
            minWidth: 100,
            flex: 1,
            editable: false, // 假设 matnrId 不可编辑
            editable: false,
        },
        {
            field: 'matnk',
            headerName: translate('table.field.asnOrderItem.matnk'),
            field: 'maktx',
            headerName: translate('table.field.asnOrderItem.maktx'),
            minWidth: 100,
            flex: 1,
            editable: true,
        },
        {
            field: 'maktxCode',
            headerName: translate('table.field.asnOrderItem.maktxCode'),
            minWidth: 100,
            flex: 1,
            editable: true,
@@ -261,18 +281,16 @@
            headerName: translate('table.field.asnOrderItem.poDetlId'),
            minWidth: 100,
            flex: 1,
            editable: true,
        },
        {
            field: 'poDetlCode',
            headerName: translate('table.field.asnOrderItem.poDetlCode'),
            minWidth: 100,
            flex: 1,
            editable: true,
        },
        {
            field: 'anfme',
            headerName: translate('table.field.asnOrderItem.anfme'),
            headerName: translate('table.field.asnOrderItem.purQty'),
            minWidth: 100,
            flex: 1,
            editable: true,
@@ -282,21 +300,21 @@
            headerName: translate('table.field.asnOrderItem.stockUnit'),
            minWidth: 100,
            flex: 1,
            editable: true,
            editable: false,
        },
        {
            field: 'purQty',
            headerName: translate('table.field.asnOrderItem.purQty'),
            minWidth: 100,
            flex: 1,
            editable: true,
        },
        // {
        //     field: 'purQty',
        //     headerName: translate('table.field.asnOrderItem.purQty'),
        //     minWidth: 100,
        //     flex: 1,
        //     editable: true,
        // },
        {
            field: 'purUnit',
            headerName: translate('table.field.asnOrderItem.purUnit'),
            minWidth: 100,
            flex: 1,
            editable: true,
            editable: false,
        },
        {
            field: 'splrCode',
@@ -313,20 +331,6 @@
            editable: true,
        },
        {
            field: 'qrcode',
            headerName: translate('table.field.asnOrderItem.qrcode'),
            minWidth: 100,
            flex: 1,
            editable: true,
        },
        {
            field: 'barcode',
            headerName: translate('table.field.asnOrderItem.barcode'),
            minWidth: 100,
            flex: 1,
            editable: true,
        },
        {
            field: 'packName',
            headerName: translate('table.field.asnOrderItem.packName'),
            minWidth: 100,
@@ -334,26 +338,79 @@
            editable: true,
        },
    ];
    ])
    const action = {
        field: 'action',
        headerName: '操作',
        width: 70,
        lockPosition: 'left',
        renderCell: (params) => (
            <Tooltip title="Delete">
                <IconButton onClick={() => handleDelete(params.row)}>
                    <Delete />
                </IconButton>
            </Tooltip>
        ),
    }
    let cdata = useRef([]);
    useEffect(() => {
        getDynamicFields();
    }, []);
    useEffect(() => {
        cdata.current = tabelData
    }, [tabelData]);
    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: true
            }))
            setColumns([...columns, ...cols, action])
        } else {
            notify(msg);
        }
    }
    const handleDelete = (row) => {
        const newData = _.filter(tabelData, (item) => item.matnrId !== row.matnrId);
        const newData = _.filter(cdata.current, (item) => item.matnrId !== row.matnrId);
        setTableData(newData);
    };
    const handleEdit = (field, row, value) => {
        setTableData((prevData) =>
            prevData.map((r) =>
                r.matnrId === row.matnrId ? { ...r, [field]: value } : r
            )
        );
    };
    const processRowUpdate = (newRow, oldRow) => {
        const field = Object.keys(newRow).find((key) => newRow[key] !== oldRow[key]);
        handleEdit(field, oldRow, newRow[field]);
        setTableData((prevData) =>
            prevData.map((r) =>
                r.matnrId === newRow.matnrId ? { ...newRow } : r
            )
        );
        return newRow;
    };
    const handleSelectionChange = (ids) => {
        setSelectedRows(ids)
    };
    return (
@@ -368,6 +425,16 @@
                disableColumnSorting
                disableMultipleColumnsSorting
                processRowUpdate={processRowUpdate}
                autoPageSize
                editMode="row"
                checkboxSelection
                onRowSelectionModelChange={handleSelectionChange}
                selectionModel={selectedRows}
                sx={{
                    '& .MuiDataGrid-cell input': {
                        border: '1px solid #ccc'
                    },
                }}
            />
        </div>
    );