|  |  | 
 |  |  |     Grid, | 
 |  |  |     TextField, | 
 |  |  |     Box, | 
 |  |  |     Button, | 
 |  |  |     Paper, | 
 |  |  |     styled, | 
 |  |  |     RadioGroup, | 
 |  |  | 
 |  |  |     FormControlLabel, | 
 |  |  | } from '@mui/material'; | 
 |  |  | import DialogCloseButton from "../../components/DialogCloseButton"; | 
 |  |  | import ConfirmButton from "../../components/ConfirmButton"; | 
 |  |  | import { useTranslate, useNotify, useRefresh } from 'react-admin'; | 
 |  |  | import { useTranslate, useNotify, useRefresh , Button} from 'react-admin'; | 
 |  |  | import request from '@/utils/request'; | 
 |  |  | import { DataGrid, useGridApiRef } from '@mui/x-data-grid'; | 
 |  |  | import SaveIcon from '@mui/icons-material/Save'; | 
 |  |  | import TreeSelectInput from "@/page/components/TreeSelectInput"; | 
 |  |  | import { throttle } from 'lodash'; | 
 |  |  |  | 
 |  |  | const AsnSelModal = (props) => { | 
 |  |  |     const { open, setOpen } = props; | 
 |  |  | 
 |  |  |                 backgroundColor: 'background.paper', | 
 |  |  |                 zIndex: 1000 | 
 |  |  |             }}> | 
 |  |  |                 选择asn单 | 
 |  |  |                 {/* 选择asn单 */} | 
 |  |  |                 <Box sx={{ position: 'absolute', top: 8, right: 8, zIndex: 1001 }}> | 
 |  |  |                     <DialogCloseButton onClose={handleClose} /> | 
 |  |  |                 </Box> | 
 |  |  | 
 |  |  |                     <Grid container spacing={2}> | 
 |  |  |                         <Grid item md={4}> | 
 |  |  |                             <TextField | 
 |  |  |                                 label={translate('table.field.asnOrder.code')} | 
 |  |  |                                 label={translate('table.field.warehouseAreasItem.asnCode')} | 
 |  |  |                                 name="asnCode" | 
 |  |  |                                 value={formData.asnCode} | 
 |  |  |                                 onChange={handleChange} | 
 |  |  |                                 size="small" | 
 |  |  |                             /> | 
 |  |  |                         </Grid> | 
 |  |  |                         <Grid item md={7} sx={{margin: 'auto'}}> <Button variant="contained" onClick={handleSearch} label={'toolbar.query'}></Button></Grid> | 
 |  |  |                     </Grid> | 
 |  |  |                 </Box> | 
 |  |  |                 <Box sx={{ mt: 2 }}> | 
 |  |  |                     <Stack direction="row" spacing={2}> | 
 |  |  |                         <Button variant="contained" onClick={handleSearch}>搜索</Button> | 
 |  |  |                     </Stack> | 
 |  |  |                 </Box> | 
 |  |  |                 <Box sx={{ mt: 2, height: 400, width: '100%' }}> | 
 |  |  |                     <AsnSelModalTable | 
 |  |  | 
 |  |  |                 </Box> | 
 |  |  |             </DialogContent> | 
 |  |  |             <DialogActions sx={{ position: 'sticky', bottom: 0, backgroundColor: 'background.paper', zIndex: 1000 }}> | 
 |  |  |                 <Box sx={{ width: '100%', display: 'flex', justifyContent: 'space-between' }}> | 
 |  |  |                     <Button onClick={handleSubmit} variant="contained" startIcon={<SaveIcon />}> | 
 |  |  |                         {translate('toolbar.confirm')} | 
 |  |  |                 <Box sx={{ width: '100%', display: 'flex', justifyContent: 'end' }}> | 
 |  |  |                     <Button onClick={handleSubmit} variant="contained" startIcon={<SaveIcon />} label={'toolbar.confirm'}> | 
 |  |  |                     </Button> | 
 |  |  |                 </Box> | 
 |  |  |             </DialogActions> | 
 |  |  | 
 |  |  |  | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     const [columns, setColumns] = useState([ | 
 |  |  |         // { field: 'id', headerName: 'ID', width: 100 }, | 
 |  |  |         { field: 'code', headerName: translate('table.field.asnOrder.code'), width: 200 }, | 
 |  |  |         { field: 'type$', headerName: translate('table.field.asnOrder.type') }, | 
 |  |  |         { field: 'wkType$', headerName: translate('table.field.asnOrder.wkType') }, | 
 |  |  |         { field: 'anfme', headerName: translate('table.field.asnOrder.anfme') }, | 
 |  |  |         { field: 'qty', headerName: translate('table.field.asnOrder.qty') }, | 
 |  |  |         { field: 'logisNo', headerName: translate('table.field.asnOrder.logisNo') }, | 
 |  |  |         { field: 'asnCode', headerName: translate('table.field.warehouseAreasItem.asnCode'), width: 180 }, | 
 |  |  |         // { field: 'areaId', headerName: translate('table.field.warehouseAreasItem.type') }, | 
 |  |  |         { field: 'areaName', headerName: translate('table.field.warehouseAreasItem.areaName'), width: 200 }, | 
 |  |  |         { field: 'anfme', headerName: translate('table.field.warehouseAreasItem.anfme') }, | 
 |  |  |         { field: 'qty', headerName: translate('table.field.warehouseAreasItem.qty') }, | 
 |  |  |         { field: 'unit', headerName: translate('table.field.warehouseAreasItem.unit') }, | 
 |  |  |     ]) | 
 |  |  |  | 
 |  |  |  |