|  |  | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |     const [formData, setFormData] = useState({ | 
 |  |  |         code: '' | 
 |  |  |         asnCode: '' | 
 |  |  |     }); | 
 |  |  |  | 
 |  |  |     const [tableData, setTableData] = useState([]); | 
 |  |  |     const [selectedRow, setSelectedRow] = useState(null); | 
 |  |  |     const [selectedRows, setSelectedRows] = useState([]); | 
 |  |  |  | 
 |  |  |     const handleChange = (e) => { | 
 |  |  |         const { name, value } = e.target; | 
 |  |  | 
 |  |  |  | 
 |  |  |     const reset = () => { | 
 |  |  |         setFormData({ | 
 |  |  |             code: '' | 
 |  |  |             asnCode: '' | 
 |  |  |         }) | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     const handleSubmit = () => { | 
 |  |  |         console.log(selectedRow); | 
 |  |  |     const handleSubmit = async () => { | 
 |  |  |         const { data: { code, data, msg } } = await request.post(`/qlyInspect/selected`, { ids: selectedRows }); | 
 |  |  |  | 
 |  |  |         if (code === 200) { | 
 |  |  |             notify(msg); | 
 |  |  |             refresh() | 
 |  |  |         } else { | 
 |  |  |             notify(msg); | 
 |  |  |         } | 
 |  |  |         setOpen(false); | 
 |  |  |         reset(); | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |     const getData = async () => { | 
 |  |  |         const res = await request.post(`/asnOrder/page`, { | 
 |  |  |             ...formData, | 
 |  |  |             current: 1, | 
 |  |  |             pageSize: 100, | 
 |  |  |             orderBy: "create_time desc" | 
 |  |  |         }); | 
 |  |  |         const res = await request.post(`/qlyInspect/asn/list`, { asnCode: formData.asnCode }); | 
 |  |  |         if (res?.data?.code === 200) { | 
 |  |  |             setTableData(res.data.data.records); | 
 |  |  |             setTableData(res.data.data); | 
 |  |  |         } else { | 
 |  |  |             notify(res.data.msg); | 
 |  |  |         } | 
 |  |  | 
 |  |  |                         <Grid item md={4}> | 
 |  |  |                             <TextField | 
 |  |  |                                 label={translate('table.field.asnOrder.code')} | 
 |  |  |                                 name="code" | 
 |  |  |                                 value={formData.code} | 
 |  |  |                                 name="asnCode" | 
 |  |  |                                 value={formData.asnCode} | 
 |  |  |                                 onChange={handleChange} | 
 |  |  |                                 size="small" | 
 |  |  |                             /> | 
 |  |  | 
 |  |  |                     <AsnSelModalTable | 
 |  |  |                         tableData={tableData} | 
 |  |  |                         setTableData={setTableData} | 
 |  |  |                         selectedRow={selectedRow} | 
 |  |  |                         setSelectedRow={setSelectedRow} | 
 |  |  |                         selectedRows={selectedRows} | 
 |  |  |                         setSelectedRows={setSelectedRows} | 
 |  |  |                     /> | 
 |  |  |                 </Box> | 
 |  |  |             </DialogContent> | 
 |  |  | 
 |  |  |  | 
 |  |  | export default AsnSelModal; | 
 |  |  |  | 
 |  |  | const AsnSelModalTable = ({ tableData, setTableData, selectedRow, setSelectedRow }) => { | 
 |  |  | const AsnSelModalTable = ({ tableData, setTableData, selectedRows, setSelectedRows }) => { | 
 |  |  |     const translate = useTranslate(); | 
 |  |  |     const notify = useNotify(); | 
 |  |  |     const apiRef = useGridApiRef(); | 
 |  |  |  | 
 |  |  |     const handleRadioChange = (event, id) => { | 
 |  |  |         setSelectedRow(id); | 
 |  |  |     const handleSelectionChange = (ids) => { | 
 |  |  |         setSelectedRows(ids) | 
 |  |  |  | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     const [columns, setColumns] = useState([ | 
 |  |  |         // { field: 'id', headerName: 'ID', width: 100 }, | 
 |  |  |         { | 
 |  |  |             field: 'radio', | 
 |  |  |             headerName: '', | 
 |  |  |             width: 55, | 
 |  |  |             renderCell: (params) => { | 
 |  |  |                 return ( | 
 |  |  |                     <FormControlLabel | 
 |  |  |                         value={params.row.id} | 
 |  |  |                         control={<Radio />} | 
 |  |  |                         onChange={(event) => handleRadioChange(event, params.row.id)} | 
 |  |  |                     /> | 
 |  |  |                 ); | 
 |  |  |             }, | 
 |  |  |         }, | 
 |  |  |         { 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') }, | 
 |  |  | 
 |  |  |     ]) | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     const onRowClick = (e) => { | 
 |  |  |         setSelectedRow(e.id) | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     return ( | 
 |  |  |         <div style={{ height: 400, width: '100%' }}> | 
 |  |  |             <RadioGroup value={selectedRow} onChange={handleRadioChange}> | 
 |  |  |                 <DataGrid | 
 |  |  |                     size="small" | 
 |  |  |                     rows={tableData} | 
 |  |  |                     columns={columns} | 
 |  |  |                     onRowClick={onRowClick} | 
 |  |  |                     apiRef={apiRef} | 
 |  |  |                     disableColumnMenu={true} | 
 |  |  |                     disableColumnSorting | 
 |  |  |                     disableMultipleColumnsSorting | 
 |  |  |                 /> | 
 |  |  |             </RadioGroup> | 
 |  |  |             <DataGrid | 
 |  |  |                 size="small" | 
 |  |  |                 rows={tableData} | 
 |  |  |                 columns={columns} | 
 |  |  |                 checkboxSelection | 
 |  |  |                 onRowSelectionModelChange={handleSelectionChange} | 
 |  |  |                 selectionModel={selectedRows} | 
 |  |  |                 apiRef={apiRef} | 
 |  |  |                 disableColumnMenu={true} | 
 |  |  |                 disableColumnSorting | 
 |  |  |                 disableMultipleColumnsSorting | 
 |  |  |             /> | 
 |  |  |         </div> | 
 |  |  |     ); | 
 |  |  | }; |