|  |  | 
 |  |  |   ReferenceArrayInput, | 
 |  |  |   AutocompleteInput, | 
 |  |  |   DeleteButton, | 
 |  |  |   Button | 
 |  |  |   Button, | 
 |  |  | } from 'react-admin'; | 
 |  |  | import { Box, Typography, Card, Stack } from '@mui/material'; | 
 |  |  | import { styled } from '@mui/material/styles'; | 
 |  |  | import AsnOrderCreate from "./AsnOrderCreate"; | 
 |  |  | import AsnOrderModal from "./AsnOrderModal"; | 
 |  |  | import AsnOrderPanel from "./AsnOrderPanel"; | 
 |  |  | import EmptyData from "../components/EmptyData"; | 
 |  |  | import MyCreateButton from "../components/MyCreateButton"; | 
 |  |  | 
 |  |  | import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting'; | 
 |  |  | import * as Common from '@/utils/common'; | 
 |  |  | import ConstructionIcon from "@mui/icons-material/Construction"; | 
 |  |  | import UploadloadIcon from "@mui/icons-material/Upload"; | 
 |  |  | import FileDownloadIcon from '@mui/icons-material/FileDownload'; | 
 |  |  | import EditIcon from '@mui/icons-material/Edit'; | 
 |  |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  | const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({ | 
 |  |  |   '& .css-1vooibu-MuiSvgIcon-root': { | 
 |  |  | 
 |  |  |  | 
 |  |  |   const [createDialog, setCreateDialog] = useState(false); | 
 |  |  |   const [drawerVal, setDrawerVal] = useState(false); | 
 |  |  |   const [modalType, setmodalType] = useState(0); | 
 |  |  |  | 
 |  |  |   const navigate = useNavigate(); | 
 |  |  |   const assign = (record) => { | 
 |  |  |     navigate(`/asnOrderItem?asnId=${record.id}`); | 
 |  |  |   }; | 
 |  |  |  | 
 |  |  |   const importList = () => { }; | 
 |  |  |  | 
 |  |  |   const inspection = () => { }; | 
 |  |  |  | 
 |  |  |   const print = () => { }; | 
 |  |  |   const print = () => { | 
 |  |  |     const imageUrls = ['https://www.baidu.com/img/flexible/logo/pc/result@2.png',] | 
 |  |  |     const iframe = document.createElement('iframe'); | 
 |  |  |     iframe.style.display = 'none'; | 
 |  |  |     document.body.appendChild(iframe); | 
 |  |  |  | 
 |  |  |     const iframeDoc = iframe.contentDocument || iframe.contentWindow.document; | 
 |  |  |     iframeDoc.open(); | 
 |  |  |     iframeDoc.write('<html><head><title>Print Images</title></head><body>'); | 
 |  |  |  | 
 |  |  |     // 将图片插入到 iframe 中 | 
 |  |  |     imageUrls.forEach((imageUrl) => { | 
 |  |  |       iframeDoc.write(`<img src="${imageUrl}" style="margin: 10px;">`); | 
 |  |  |     }); | 
 |  |  |  | 
 |  |  |     iframeDoc.write('</body></html>'); | 
 |  |  |     iframeDoc.close(); | 
 |  |  |  | 
 |  |  |     // 等待图片加载完成后触发打印 | 
 |  |  |     iframe.contentWindow.onload = () => { | 
 |  |  |       iframe.contentWindow.print(); | 
 |  |  |       // 打印完成后移除 iframe | 
 |  |  |       document.body.removeChild(iframe); | 
 |  |  |     }; | 
 |  |  |   }; | 
 |  |  |  | 
 |  |  |  | 
 |  |  |   return ( | 
 |  |  |     <Box display="flex"> | 
 |  |  | 
 |  |  |           marginRight: drawerVal ? `${PAGE_DRAWER_WIDTH}px` : 0, | 
 |  |  |         }} | 
 |  |  |         title={"menu.asnOrder"} | 
 |  |  |         empty={<EmptyData onClick={() => { setCreateDialog(true) }} />} | 
 |  |  |         empty={<EmptyData onClick={() => { setCreateDialog(true); setmodalType(0) }} />} | 
 |  |  |         filters={filters} | 
 |  |  |         sort={{ field: "create_time", order: "desc" }} | 
 |  |  |         actions={( | 
 |  |  |           <TopToolbar> | 
 |  |  |             <Button onClick={importList} label={"ra.action.import"}> | 
 |  |  |               <UploadloadIcon /> | 
 |  |  |             </Button> | 
 |  |  |  | 
 |  |  |             <Button onClick={inspection} label={"toolbar.inspection"}> | 
 |  |  |               <ConstructionIcon /> | 
 |  |  |             </Button> | 
 |  |  |             <FilterButton /> | 
 |  |  |             <MyCreateButton onClick={() => { setCreateDialog(true) }} /> | 
 |  |  |             <MyCreateButton onClick={() => { setCreateDialog(true); setmodalType(0) }} /> | 
 |  |  |             <SelectColumnsButton preferenceKey='asnOrder' /> | 
 |  |  |  | 
 |  |  |             <MyExportButton /> | 
 |  |  |           </TopToolbar> | 
 |  |  |         )} | 
 |  |  | 
 |  |  |           preferenceKey='asnOrder' | 
 |  |  |           bulkActionButtons={() => <BulkDeleteButton mutationMode={OPERATE_MODE} />} | 
 |  |  |           rowClick={(id, resource, record) => false} | 
 |  |  |           expand={() => <AsnOrderPanel />} | 
 |  |  |           expand={(e) => <AsnOrderPanel key={Math.floor(Math.random() * 100)} />} | 
 |  |  |           expandSingle={true} | 
 |  |  |           omit={['id', 'createTime', 'createBy', 'memo']} | 
 |  |  |         > | 
 |  |  |           <NumberField source="id" /> | 
 |  |  |           <MyField | 
 |  |  |             source="code" | 
 |  |  |             label="table.field.asnOrder.code" | 
 |  |  |             onClick={(event, record, val) => { | 
 |  |  |               event.stopPropagation(); | 
 |  |  |               assign(record); | 
 |  |  |             }} | 
 |  |  |           /> | 
 |  |  |           <TextField source="code" label="table.field.asnOrder.code" /> | 
 |  |  |           <TextField source="poCode" label="table.field.asnOrder.poCode" /> | 
 |  |  |           <NumberField source="poId" label="table.field.asnOrder.poId" /> | 
 |  |  |           <TextField source="type" label="table.field.asnOrder.type" /> | 
 |  |  | 
 |  |  |           <DateField source="createTime" label="common.field.createTime" showTime /> | 
 |  |  |           <BooleanField source="statusBool" label="common.field.status" sortable={false} /> | 
 |  |  |           <TextField source="memo" label="common.field.memo" sortable={false} /> | 
 |  |  |           <WrapperField cellClassName="opt" label="common.field.opt"> | 
 |  |  |           <WrapperField cellClassName="opt" label="common.field.opt" > | 
 |  |  |             <Button label="toolbar.print" onClick={print}> | 
 |  |  |               <FileDownloadIcon /> | 
 |  |  |             </Button> | 
 |  |  |             <EditButton sx={{ padding: '1px', fontSize: '.75rem' }} /> | 
 |  |  |             {/* <EditButton sx={{ padding: '1px', fontSize: '.75rem' }} /> */} | 
 |  |  |             <MyButton setCreateDialog={setCreateDialog} setmodalType={setmodalType} /> | 
 |  |  |             {/* <Button | 
 |  |  |               color="primary" | 
 |  |  |               startIcon={<EditIcon />} | 
 |  |  |               onClick={(event, record) => handleEditClick(record)} | 
 |  |  |               sx={{ ml: 1 }} | 
 |  |  |               label={'ra.action.edit'} | 
 |  |  |             > | 
 |  |  |             </Button> */} | 
 |  |  |             <DeleteButton sx={{ padding: '1px', fontSize: '.75rem' }} mutationMode={OPERATE_MODE} /> | 
 |  |  |           </WrapperField> | 
 |  |  |         </StyledDatagrid> | 
 |  |  |       </List> | 
 |  |  |       <AsnOrderCreate | 
 |  |  |       <AsnOrderModal | 
 |  |  |         open={createDialog} | 
 |  |  |         setOpen={setCreateDialog} | 
 |  |  |         asnId={modalType} | 
 |  |  |       /> | 
 |  |  |       <PageDrawer | 
 |  |  |         title='AsnOrder Detail' | 
 |  |  | 
 |  |  |         setDrawerVal={setDrawerVal} | 
 |  |  |       > | 
 |  |  |       </PageDrawer> | 
 |  |  |     </Box> | 
 |  |  |     </Box > | 
 |  |  |   ) | 
 |  |  | } | 
 |  |  |  | 
 |  |  | export default AsnOrderList; | 
 |  |  |  | 
 |  |  | const MyButton = ({ setCreateDialog, setmodalType }) => { | 
 |  |  |   const record = useRecordContext(); | 
 |  |  |   const handleEditClick = () => { | 
 |  |  |     const id = record.id; | 
 |  |  |     setmodalType(id); | 
 |  |  |     setCreateDialog(true); | 
 |  |  |  | 
 |  |  |   }; | 
 |  |  |   return ( | 
 |  |  |     <Button | 
 |  |  |       color="primary" | 
 |  |  |       startIcon={<EditIcon />} | 
 |  |  |       onClick={() => handleEditClick()} | 
 |  |  |       sx={{ ml: 1 }} | 
 |  |  |       label={'ra.action.edit'} | 
 |  |  |     > | 
 |  |  |     </Button> | 
 |  |  |   ) | 
 |  |  | } |