|  |  | 
 |  |  |     Select, | 
 |  |  |     MenuItem | 
 |  |  |  | 
 |  |  |  | 
 |  |  | } from '@mui/material'; | 
 |  |  |  | 
 |  |  | import { DataGrid, useGridApiRef, GRID_DATE_COL_DEF,  GRID_DATETIME_COL_DEF,  getGridDateOperators, useGridApiContext } from '@mui/x-data-grid'; | 
 |  |  | import { useForm, Controller, useWatch, FormProvider, useFormContext } from "react-hook-form"; | 
 |  |  | import { LocalizationProvider, DatePicker, DateTimePicker } from '@mui/x-date-pickers'; | 
 |  |  | import DialogCloseButton from "../../components/DialogCloseButton"; | 
 |  |  | import StatusSelectInput from "../../components/StatusSelectInput"; | 
 |  |  | import ConfirmButton from "../../components/ConfirmButton"; | 
 |  |  | import AsnWareModal from "./AsnWareModal"; | 
 |  |  | import { useForm, Controller, useWatch, FormProvider, useFormContext } from "react-hook-form"; | 
 |  |  | import SaveIcon from '@mui/icons-material/Save'; | 
 |  |  | import request from '@/utils/request'; | 
 |  |  | import { Add, Edit, Delete } from '@mui/icons-material'; | 
 |  |  | import _, { set } from 'lodash'; | 
 |  |  | import { DataGrid, useGridApiRef } from '@mui/x-data-grid'; | 
 |  |  | import { DemoContainer } from '@mui/x-date-pickers/internals/demo'; | 
 |  |  | import DictionarySelect from "../../components/DictionarySelect"; | 
 |  |  | import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; | 
 |  |  | import ConfirmButton from "../../components/ConfirmButton"; | 
 |  |  | import { Add, Edit, Delete } from '@mui/icons-material'; | 
 |  |  | import DictSelect from "../../components/DictSelect"; | 
 |  |  | import SaveIcon from '@mui/icons-material/Save'; | 
 |  |  | import AsnWareModal from "./AsnWareModal"; | 
 |  |  | import request from '@/utils/request'; | 
 |  |  | import _, { set } from 'lodash'; | 
 |  |  | import "./asnOrder.css"; | 
 |  |  |  | 
 |  |  |  | 
 |  |  | const AsnOrderModal = (props) => { | 
 |  |  |     const { open, setOpen, asnId, billReload } = props; | 
 |  |  | 
 |  |  |             ...prevData, | 
 |  |  |             [name]: value | 
 |  |  |         })); | 
 |  |  |         console.log(formData); | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |     const resetData = () => { | 
 |  |  | 
 |  |  |     const setFinally = () => { | 
 |  |  |         const rows = tableRef.current.state.editRows; | 
 |  |  |         for (const key in rows) { | 
 |  |  |             const find = tabelData.find(item => item.matnrId === +key); | 
 |  |  |             const find = tabelData.find(item => item.id === +key); | 
 |  |  |             find.anfme = rows[key].anfme.value; | 
 |  |  |         } | 
 |  |  |         setTableData([...tabelData]); | 
 |  |  | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     const requestGetBody = async () => { | 
 |  |  |         const res = await request.post(`/asnOrderItem/page`, { asnId }); | 
 |  |  |         const res = await request.post(`/asnOrderItem/page`, { orderId: asnId }); | 
 |  |  |         if (res?.data?.code === 200) { | 
 |  |  |             setTableData(res.data.data.records) | 
 |  |  |         } else { | 
 |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     const handleDeleteItem = () => { | 
 |  |  |         const newTableData = _.filter(tabelData, (item) => !selectedRows.includes(item.matnrId)); | 
 |  |  |         const newTableData = _.filter(tabelData, (item) => !selectedRows.includes(item.id)); | 
 |  |  |         setTableData(newTableData); | 
 |  |  |     } | 
 |  |  |  | 
 |  |  | 
 |  |  |                 aria-hidden | 
 |  |  |                 fullWidth | 
 |  |  |                 disableRestoreFocus | 
 |  |  |                 maxWidth="lg"   // 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 
 |  |  |                 maxWidth="xl"   // 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 
 |  |  |             > | 
 |  |  |                 <DialogTitle id="form-dialog-title" sx={{ | 
 |  |  |                     position: 'sticky', | 
 |  |  | 
 |  |  |                                         label={translate("table.field.asnOrder.type")} | 
 |  |  |                                         value={formData.type} | 
 |  |  |                                         onChange={(e) => handleChange(e.target.value, 'type')} | 
 |  |  |                                         dictTypeCode="sys_in_stock_type" | 
 |  |  |                                         dictTypeCode="sys_order_type" | 
 |  |  |                                         group='1' | 
 |  |  |                                         required | 
 |  |  |                                     /> | 
 |  |  |                                 </Grid> | 
 |  |  | 
 |  |  |                                         required | 
 |  |  |                                     /> | 
 |  |  |                                 </Grid> | 
 |  |  |                                 <Grid item md={3}> | 
 |  |  |                                 <Grid item md={2}> | 
 |  |  |                                     <TextField | 
 |  |  |                                         label={translate("table.field.asnOrder.poCode")} | 
 |  |  |                                         value={formData.poCode} | 
 |  |  |                                         variant="filled" | 
 |  |  |                                         onChange={(e) => handleChange(e.target.value, 'poCode')} | 
 |  |  |                                     /> | 
 |  |  |                                 </Grid> | 
 |  |  |                                 <Grid item md={3}> | 
 |  |  |                                 <Grid item md={2}> | 
 |  |  |                                     <TextField | 
 |  |  |                                         label={translate("table.field.asnOrder.logisNo")} | 
 |  |  |                                         value={formData.logisNo} | 
 |  |  |                                         variant="filled" | 
 |  |  |                                         onChange={(e) => handleChange(e.target.value, 'logisNo')} | 
 |  |  |                                     /> | 
 |  |  |                                 </Grid> | 
 |  |  |  | 
 |  |  |                                 <Grid item md={3}> | 
 |  |  |                                     {/* <TextField | 
 |  |  |                                         label={translate("table.field.asnOrder.arrTime")} | 
 |  |  |                                         value={formData.arrTime} | 
 |  |  |                                         onChange={(e) => handleChange(e.target.value, 'arrTime')} | 
 |  |  |                                     /> */} | 
 |  |  |                                     <DateInput | 
 |  |  |                                         source="arrTime" | 
 |  |  |                                         label="table.field.asnOrder.arrTime" | 
 |  |  |                                         value={formData.arrTime} | 
 |  |  |                                         onChange={(e) => handleChange(e.target.value, 'arrTime')} | 
 |  |  |                                     /> | 
 |  |  |  | 
 |  |  |                                 </Grid> | 
 |  |  |                             </Grid> | 
 |  |  |                         </Form> | 
 |  |  | 
 |  |  |                         </Button> | 
 |  |  |                     </Toolbar> | 
 |  |  |                 </DialogActions> | 
 |  |  |  | 
 |  |  |             </Dialog> | 
 |  |  |  | 
 |  |  |             <AsnWareModal | 
 |  |  |                 open={createDialog} | 
 |  |  |                 setOpen={setCreateDialog} | 
 |  |  | 
 |  |  | } | 
 |  |  |  | 
 |  |  | export default AsnOrderModal; | 
 |  |  |  | 
 |  |  |  | 
 |  |  | const dateColumnType = { | 
 |  |  |     ...GRID_DATE_COL_DEF, | 
 |  |  |     resizable: false, | 
 |  |  |     renderEditCell: (params) => { | 
 |  |  |         return <GridEditDateCell {...params} />; | 
 |  |  |     }, | 
 |  |  |     // filterOperators: getGridDateOperators(false).map((item) => ({ | 
 |  |  |     //     ...item, | 
 |  |  |     //     InputComponent: GridFilterDateInput, | 
 |  |  |     //     InputComponentProps: { showTime: false }, | 
 |  |  |     // })), | 
 |  |  |     // valueFormatter: (value) => { | 
 |  |  |     //     if (value) { | 
 |  |  |     //         return format(value, 'yyyy-MM-dd', { locale }); | 
 |  |  |     //     } | 
 |  |  |     //     return ''; | 
 |  |  |     // }, | 
 |  |  | } | 
 |  |  |  | 
 |  |  | const SelectInputSplrNameEditCell = (params) => { | 
 |  |  |     const [formData, setFormData] = useState([{}]) | 
 |  |  | 
 |  |  |         } = await request.post("companys/page", parmas); | 
 |  |  |         if (code === 200) { | 
 |  |  |             setFormData(data.records) | 
 |  |  |             console.log(data.records) | 
 |  |  |         } else { | 
 |  |  |             notify(msg); | 
 |  |  |         } | 
 |  |  | 
 |  |  |                         value: selectedSupplier.id, | 
 |  |  |                     }); | 
 |  |  |                 } | 
 |  |  |  | 
 |  |  |             } | 
 |  |  |  | 
 |  |  |             } | 
 |  |  | 
 |  |  |     ); | 
 |  |  | }; | 
 |  |  |  | 
 |  |  |  | 
 |  |  | const GridEditDateCell = ({ id, field, value, colDef, hasFocus }) => { | 
 |  |  |     const apiRef = useGridApiContext(); | 
 |  |  |     const inputRef = React.useRef(null); | 
 |  |  |     const Component = colDef.type === 'dateTime' ? DateTimePicker : DatePicker; | 
 |  |  |  | 
 |  |  |     const handleChange = (newValue) => { | 
 |  |  |         apiRef.current.setEditCellValue({ id, field, value: newValue }); | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |     // useEnhancedEffect(() => { | 
 |  |  |     //     if (hasFocus) { | 
 |  |  |     //         inputRef.current.focus(); | 
 |  |  |     //     } | 
 |  |  |     // }, [hasFocus]); | 
 |  |  |  | 
 |  |  |     return ( | 
 |  |  |         <LocalizationProvider dateAdapter={AdapterDayjs}> | 
 |  |  |             <DemoContainer components={['DatePicker']}> | 
 |  |  |                 <DatePicker label="Basic date picker" /> | 
 |  |  |             </DemoContainer> | 
 |  |  |         </LocalizationProvider> | 
 |  |  |         // <Component | 
 |  |  |         //     value={value} | 
 |  |  |         //     autoFocus | 
 |  |  |         //     onChange={handleChange} | 
 |  |  |         //     slotProps={{ | 
 |  |  |         //         textField: { | 
 |  |  |         //             inputRef, | 
 |  |  |         //             variant: 'standard', | 
 |  |  |         //             fullWidth: true, | 
 |  |  |         //             sx: { | 
 |  |  |         //                 padding: '0 9px', | 
 |  |  |         //                 justifyContent: 'center', | 
 |  |  |         //             }, | 
 |  |  |         //             InputProps: { | 
 |  |  |         //                 disableUnderline: true, | 
 |  |  |         //                 sx: { fontSize: 'inherit' }, | 
 |  |  |         //             }, | 
 |  |  |         //         }, | 
 |  |  |         //     }} | 
 |  |  |         // /> | 
 |  |  |     ); | 
 |  |  | } | 
 |  |  |  | 
 |  |  |  | 
 |  |  | const SelectInputSplrCodeEditCell = (params) => { | 
 |  |  |     const [formData, setFormData] = useState([{}]) | 
 |  |  |     useEffect(() => { | 
 |  |  | 
 |  |  |         } = await request.post("companys/page", parmas); | 
 |  |  |         if (code === 200) { | 
 |  |  |             setFormData(data.records) | 
 |  |  |             console.log(data.records) | 
 |  |  |         } else { | 
 |  |  |             notify(msg); | 
 |  |  |         } | 
 |  |  | 
 |  |  |             valueFormatter: (val) => val < 0 ? 0 : val, | 
 |  |  |             headerClassName: "custom", | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'splrCode', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.splrCode') + "*", | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |             editable: true, | 
 |  |  |             renderEditCell: (params) => ( | 
 |  |  |                 <SelectInputSplrCodeEditCell {...params} /> | 
 |  |  |             ), | 
 |  |  |             headerClassName: "custom", | 
 |  |  |         }, | 
 |  |  |         // { | 
 |  |  |         //     field: 'splrCode', | 
 |  |  |         //     headerName: translate('table.field.asnOrderItem.splrCode') + "*", | 
 |  |  |         //     minWidth: 100, | 
 |  |  |         //     flex: 1, | 
 |  |  |         //     editable: true, | 
 |  |  |         //     renderEditCell: (params) => ( | 
 |  |  |         //         <SelectInputSplrCodeEditCell {...params} /> | 
 |  |  |         //     ), | 
 |  |  |         //     headerClassName: "custom", | 
 |  |  |         // }, | 
 |  |  |         { | 
 |  |  |             field: 'splrName', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.splrName') + "*", | 
 |  |  | 
 |  |  |             ), | 
 |  |  |             headerClassName: "custom", | 
 |  |  |         }, | 
 |  |  |         // { | 
 |  |  |         //     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: 'poCode', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.poDetlCode') + "*", | 
 |  |  |             field: 'platItemId', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.platItemId') + "*", | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |             editable: true, | 
 |  |  |             headerClassName: "custom", | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |             field: 'splrBatch', | 
 |  |  |             headerName: translate('table.field.asnOrderItem.splrBatch'), | 
 |  |  |             minWidth: 100, | 
 |  |  |             flex: 1, | 
 |  |  |             editable: true, | 
 |  |  |             headerClassName: "custom", | 
 |  |  |  | 
 |  |  |         }, | 
 |  |  |  | 
 |  |  |         // { | 
 |  |  |         //     field: 'poCode', | 
 |  |  |         //     headerName: translate('table.field.asnOrderItem.poDetlCode') + "*", | 
 |  |  |         //     minWidth: 100, | 
 |  |  |         //     flex: 1, | 
 |  |  |         //     editable: true, | 
 |  |  |         //     headerClassName: "custom", | 
 |  |  |         // }, | 
 |  |  |  | 
 |  |  |         { | 
 |  |  |             field: 'stockUnit', | 
 |  |  | 
 |  |  |             editable: false, | 
 |  |  |         }, | 
 |  |  |         // { | 
 |  |  |         //     field: 'prodTime', | 
 |  |  |         //     headerName: translate('table.field.asnOrderItem.prodTime'), | 
 |  |  |         //     minWidth: 200, | 
 |  |  |         //     flex: 1, | 
 |  |  |         //     ...dateColumnType, | 
 |  |  |         //     editable: true, | 
 |  |  |         //     headerClassName: "custom", | 
 |  |  |         // }, | 
 |  |  |         // { | 
 |  |  |         //     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, | 
 |  |  |         }, | 
 |  |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  |         // { | 
 |  |  |         //     field: 'purUnit', | 
 |  |  |         //     headerName: translate('table.field.asnOrderItem.purUnit'), | 
 |  |  |         //     minWidth: 100, | 
 |  |  |         //     flex: 1, | 
 |  |  |         //     editable: false, | 
 |  |  |         // }, | 
 |  |  |     ]) | 
 |  |  |  | 
 |  |  |     const action = { | 
 |  |  | 
 |  |  |                 </IconButton> | 
 |  |  |             </Tooltip> | 
 |  |  |         ), | 
 |  |  |  | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     let cdata = useRef([]); | 
 |  |  | 
 |  |  |         } = await request.get("/fields/enable/list"); | 
 |  |  |         if (code === 200) { | 
 |  |  |             const cols = data.map(el => ({ | 
 |  |  |                 field: el.fields, | 
 |  |  |                 field:  el.fields, | 
 |  |  |                 valueGetter: (value, row) => { | 
 |  |  |                     if (value != null && value != undefined) { | 
 |  |  |                         return value; | 
 |  |  |                     } | 
 |  |  |                     if (row.extendFields == null  ||row.extendFields[el.fields] == null) { | 
 |  |  |                         return '' | 
 |  |  |                     } else { | 
 |  |  |                         return `${row.extendFields[el.fields] == null ? '' : row.extendFields[el.fields]}`; | 
 |  |  |                     } | 
 |  |  |                 }, | 
 |  |  |                 headerName: el.fieldsAlise, | 
 |  |  |                 minWidth: 100, | 
 |  |  |                 flex: 1, | 
 |  |  |                 editable: false | 
 |  |  |                 editable: true | 
 |  |  |             })) | 
 |  |  |             setColumns([...columns, ...cols, action]) | 
 |  |  |         } else { | 
 |  |  | 
 |  |  |         } | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     const handleDelete = (row) => { | 
 |  |  |         const newData = _.filter(cdata.current, (item) => item.matnrId !== row.matnrId); | 
 |  |  |         const newData = _.filter(cdata.current, (item) => item.id !== row.id); | 
 |  |  |         setTableData(newData); | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     const processRowUpdate = (newRow, oldRow) => { | 
 |  |  |         const rows = tabelData.map((r) => | 
 |  |  |             r.matnrId === newRow.matnrId ? { ...newRow } : r | 
 |  |  |             r.id === newRow.id ? { ...newRow } : r | 
 |  |  |         ) | 
 |  |  |         setTableData(rows) | 
 |  |  |         // setTableData((prevData) => | 
 |  |  | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     const handleSelectionChange = (ids) => { | 
 |  |  |     const handleSelectionChange = (ids) => {         | 
 |  |  |         setSelectedRows(ids) | 
 |  |  |  | 
 |  |  |     }; | 
 |  |  | 
 |  |  |                 rows={tabelData} | 
 |  |  |                 columns={columns} | 
 |  |  |                 disableRowSelectionOnClick | 
 |  |  |                 getRowId={(row) => row.matnrId} | 
 |  |  |                 getRowId={(row) => row.id} | 
 |  |  |                 disableColumnFilter | 
 |  |  |                 disableColumnSelector | 
 |  |  |                 disableColumnSorting | 
 |  |  | 
 |  |  |                         }, | 
 |  |  |                     }, | 
 |  |  |                 }} | 
 |  |  |                 pageSizeOptions={[10, 25, 50, 100]} | 
 |  |  |                 pageSizeOptions={[15, 25, 50, 100]} | 
 |  |  |                 editMode="row" | 
 |  |  |                 checkboxSelection | 
 |  |  |                 onRowSelectionModelChange={handleSelectionChange} |