|  |  | 
 |  |  |     const translate = useTranslate(); | 
 |  |  |     const notify = useNotify(); | 
 |  |  |     const refresh = useRefresh(); | 
 |  |  |     const [disabled, setDisabled] = useState(false) | 
 |  |  |  | 
 |  |  |     const [createDialog, setCreateDialog] = useState(false); | 
 |  |  |  | 
 |  |  | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |     const handleSubmit = async () => { | 
 |  |  |         setDisabled(true) | 
 |  |  |         if (asnId === 0) { | 
 |  |  |             const parmas = { | 
 |  |  |                 "orders": formData, | 
 |  |  | 
 |  |  |                 "orders": formData, | 
 |  |  |                 "items": tabelData, | 
 |  |  |             } | 
 |  |  |             console.log(parmas); | 
 |  |  |             // const res = await request.post(`/asnOrder/items/save`, parmas); | 
 |  |  |             // if (res?.data?.code === 200) { | 
 |  |  |             //     setOpen(false); | 
 |  |  |             //     refresh(); | 
 |  |  |             // } else { | 
 |  |  |             //     notify(res.data.msg); | 
 |  |  |             // } | 
 |  |  |             // setOpen(false); | 
 |  |  |             const res = await request.post(`/asnOrder/items/update`, parmas); | 
 |  |  |             if (res?.data?.code === 200) { | 
 |  |  |                 setOpen(false); | 
 |  |  |                 refresh(); | 
 |  |  |             } else { | 
 |  |  |                 notify(res.data.msg); | 
 |  |  |             } | 
 |  |  |         } | 
 |  |  |  | 
 |  |  |         setDisabled(false) | 
 |  |  |  | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  | 
 |  |  |         } | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     const [selectedRows, setSelectedRows] = useState([]); | 
 |  |  |  | 
 |  |  |     const handleDeleteItem = () => { | 
 |  |  |         const newTableData = _.filter(tabelData, (item) => !selectedRows.includes(item.matnrId)); | 
 |  |  |         setTableData(newTableData); | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     return ( | 
 |  |  |         <> | 
 |  |  |             <Dialog | 
 |  |  | 
 |  |  |                     <Box sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}> | 
 |  |  |                         <Form> | 
 |  |  |                             <Grid container spacing={2}> | 
 |  |  |                                 <Grid item xs={4}> | 
 |  |  |                                 <Grid item md={4}> | 
 |  |  |                                     <DictSelect | 
 |  |  |                                         label={translate("table.field.asnOrder.type")} | 
 |  |  |                                         value={formData.type} | 
 |  |  | 
 |  |  |  | 
 |  |  |                                 </Grid> | 
 |  |  |  | 
 |  |  |                                 <Grid item xs={4}> | 
 |  |  |                                 <Grid item md={4}> | 
 |  |  |                                     <DictSelect | 
 |  |  |                                         label={translate("table.field.asnOrder.wkType")} | 
 |  |  |                                         value={formData.wkType} | 
 |  |  | 
 |  |  |                     <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} asnId={asnId} ></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 />}> | 
 |  |  |                         <Button disabled={disabled} onClick={handleSubmit} variant="contained" startIcon={<SaveIcon />}> | 
 |  |  |                             {translate('toolbar.confirm')} | 
 |  |  |                         </Button> | 
 |  |  |                     </Toolbar> | 
 |  |  | 
 |  |  |  | 
 |  |  | export default AsnOrderModal; | 
 |  |  |  | 
 |  |  | const AsnOrderModalTable = ({ tabelData, setTableData, asnId }) => { | 
 |  |  | const AsnOrderModalTable = ({ tabelData, setTableData, asnId, selectedRows, setSelectedRows }) => { | 
 |  |  |     const translate = useTranslate(); | 
 |  |  |     const notify = useNotify(); | 
 |  |  |  | 
 |  |  |     const [columns, setColumns] = useState([ | 
 |  |  |         { | 
 |  |  |             field: 'action', | 
 |  |  |             headerName: '操作', | 
 |  |  |             width: 70, | 
 |  |  |             lockPosition: 'left', | 
 |  |  |             renderCell: (params) => ( | 
 |  |  |                 <Tooltip title="Delete"> | 
 |  |  |                     <IconButton onClick={() => handleDelete(params.row)}> | 
 |  |  |                         <Delete /> | 
 |  |  |                     </IconButton> | 
 |  |  |                 </Tooltip> | 
 |  |  |             ), | 
 |  |  |  | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'matnrId', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.matnrId'), | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |             editable: false, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'maktx', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.maktx'), | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |             editable: true, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'poDetlId', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.poDetlId'), | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'poDetlCode', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.poDetlCode'), | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'anfme', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.anfme'), | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |             editable: true, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'stockUnit', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.stockUnit'), | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |             width: 250, | 
 |  |  |             editable: false, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'purQty', | 
 |  |  |             field: 'matnrCode', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.matnrCode'), | 
 |  |  |             width: 130, | 
 |  |  |             editable: false, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'anfme', | 
 |  |  |             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: false, | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'splrCode', | 
 |  |  | 
 |  |  |             flex: 1, | 
 |  |  |             editable: true, | 
 |  |  |         }, | 
 |  |  |         // { | 
 |  |  |         //     field: 'packName', | 
 |  |  |         //     headerName: translate('table.field.asnOrderItem.packName'), | 
 |  |  |         //     minWidth: 100, | 
 |  |  |         //     flex: 1, | 
 |  |  |         //     editable: true, | 
 |  |  |         // }, | 
 |  |  |         // { | 
 |  |  |         //     field: 'poDetlId', | 
 |  |  |         //     headerName: translate('table.field.asnOrderItem.poDetlId'), | 
 |  |  |         //     minWidth: 100, | 
 |  |  |         //     flex: 1, | 
 |  |  |         // }, | 
 |  |  |         { | 
 |  |  |             field: 'packName', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.packName'), | 
 |  |  |             field: 'platItemId', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.platItemId'), | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |             editable: true, | 
 |  |  |         }, | 
 |  |  |  | 
 |  |  |         { | 
 |  |  |             field: 'stockUnit', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.stockUnit'), | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |             editable: false, | 
 |  |  |         }, | 
 |  |  |         // { | 
 |  |  |         //     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: false, | 
 |  |  |         }, | 
 |  |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     ]) | 
 |  |  |  | 
 |  |  |     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([]); | 
 |  |  |  | 
 |  |  | 
 |  |  |                 headerName: el.fieldsAlise, | 
 |  |  |                 minWidth: 100, | 
 |  |  |                 flex: 1, | 
 |  |  |                 editable: el.unique | 
 |  |  |                 editable: false | 
 |  |  |             })) | 
 |  |  |             setColumns([...columns, ...cols]) | 
 |  |  |             setColumns([...columns, ...cols, action]) | 
 |  |  |         } else { | 
 |  |  |             notify(msg); | 
 |  |  |         } | 
 |  |  | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     const handleSelectionChange = (ids) => { | 
 |  |  |         setSelectedRows(ids) | 
 |  |  |  | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |     return ( | 
 |  |  |         <div style={{ height: 400, width: '100%' }}> | 
 |  |  |             <DataGrid | 
 |  |  | 
 |  |  |                 disableMultipleColumnsSorting | 
 |  |  |                 processRowUpdate={processRowUpdate} | 
 |  |  |                 autoPageSize | 
 |  |  |                 editMode="row" | 
 |  |  |                 checkboxSelection | 
 |  |  |                 onRowSelectionModelChange={handleSelectionChange} | 
 |  |  |                 selectionModel={selectedRows} | 
 |  |  |                 sx={{ | 
 |  |  |                     '& .MuiDataGrid-cell input': { | 
 |  |  |                         border: '1px solid #ccc' | 
 |  |  |                     }, | 
 |  |  |                 }} | 
 |  |  |             /> | 
 |  |  |         </div> | 
 |  |  |     ); |