From 515dc2664c481e3a65245b71aa1ff4a4d6bfb64f Mon Sep 17 00:00:00 2001
From: skyouc
Date: 星期五, 21 三月 2025 15:32:06 +0800
Subject: [PATCH] Merge branch 'devlop' of http://47.97.1.152:5880/r/wms-master into devlop

---
 rsf-admin/src/page/basicInfo/matnr/PrintModal.jsx |  152 +++++++++++++++++++++++++++++++++++++++++++++-----
 1 files changed, 137 insertions(+), 15 deletions(-)

diff --git a/rsf-admin/src/page/basicInfo/matnr/PrintModal.jsx b/rsf-admin/src/page/basicInfo/matnr/PrintModal.jsx
index 46c4d0d..83df0e0 100644
--- a/rsf-admin/src/page/basicInfo/matnr/PrintModal.jsx
+++ b/rsf-admin/src/page/basicInfo/matnr/PrintModal.jsx
@@ -29,11 +29,11 @@
     TextField,
     Box,
     Button,
-    Paper,
-    TableContainer,
-    Table,
-    TableHead,
-    TableBody,
+    Radio,
+    RadioGroup,
+    FormControlLabel,
+    FormControl,
+    FormLabel,
     TableRow,
     TableCell,
     Tooltip,
@@ -52,15 +52,14 @@
 import { DataGrid } from '@mui/x-data-grid';
 import StatusSelectInput from "../../components/StatusSelectInput";
 
+import { useReactToPrint } from "react-to-print";
 
-
-const InitModal = ({ open, setOpen }) => {
+const PrintModal = ({ open, setOpen }) => {
     const refresh = useRefresh();
     const translate = useTranslate();
-
-
     const notify = useNotify();
-
+    const contentRef = useRef(null);
+    const reactToPrintFn = useReactToPrint({ contentRef });
 
     const handleClose = (event, reason) => {
         if (reason !== "backdropClick") {
@@ -68,22 +67,145 @@
         }
     };
 
+    const [value, setValue] = useState('temp1');
+
+    const handleChange = (event) => {
+        setValue(event.target.value);
+    };
+
+    const handlePrint = () => {
+        // handleClose()
+        reactToPrintFn()
+    };
+
     return (
         <Dialog open={open} maxWidth="sm" fullWidth>
             <DialogCloseButton onClose={handleClose} />
             <DialogTitle>{translate('toolbar.print')}</DialogTitle>
-            <DialogContent sx={{ mt: 2 }}>
-                1
+            <DialogContent >
+                <FormControl >
+                    <RadioGroup
+                        row
+                        aria-labelledby="demo-controlled-radio-buttons-group"
+                        name="controlled-radio-buttons-group"
+                        value={value}
+                        onChange={handleChange}
+                        size="small"
+                        sx={{ justifyContent: 'center' }}
+                    >
+                        <FormControlLabel value="temp1" control={<Radio />} label="妯℃澘1" size="small" />
+                    </RadioGroup>
+                </FormControl>
+
+                <Box>
+                    <div style={{ textAlign: 'center' }}>
+                        <PrintTemp />
+                    </div>
+                    <style>{`
+                    @media print {
+                    .print-content {
+                            display: block!important;
+                        }
+                    }`} </style>
+                    <div ref={contentRef} className="print-content" style={{ textAlign: 'center', display: 'none' }}>
+                        <PrintTemp />
+                    </div>
+                </Box>
             </DialogContent>
             <DialogActions sx={{ position: 'sticky', bottom: 0, backgroundColor: 'background.paper', zIndex: 1000 }}>
                 <Box sx={{ width: '100%', display: 'flex', justifyContent: 'space-between' }}>
-                    <Button onClick={handleClose} variant="contained" startIcon={<SaveIcon />}>
+                    <Button onClick={handlePrint} variant="contained" startIcon={<SaveIcon />}>
                         {translate('toolbar.confirm')}
                     </Button>
                 </Box>
             </DialogActions>
-        </Dialog>
+        </Dialog >
     );
 }
 
-export default InitModal;
\ No newline at end of file
+export default PrintModal;
+
+const PrintTemp = (props) => {
+    const [data, setData] = useState([{
+        barcode: '/img/barcode.jpeg',
+        product: 'xxxxxx-xx/xx',
+        remark: 'xx'
+    }]);
+    return (
+        <>
+            {data.map((item, index) => (
+                <table
+                    key={index}
+                    className="contain"
+                    style={{
+                        overflow: 'hidden',
+                        fontSize: 'small',
+                        tableLayout: 'fixed',
+                        width: '280px',
+                        borderCollapse: 'collapse',
+                        borderSpacing: 0,
+                        margin: '0 auto',
+                        marginTop: '10px',
+                    }}
+                >
+                    <tbody>
+                        <tr style={{ height: '74px' }}>
+                            <td align="center" colSpan={3} style={{ border: '1px solid black' }} >
+                                鍟嗗搧缂栫爜
+                            </td>
+                            <td
+                                align="center"
+                                className="barcode"
+                                colSpan={9}
+                                style={{ border: '1px solid black' }}
+                            >
+                                <img className="template-code" src={item.barcode} style={{ width: '90%', verticalAlign: 'middle' }} alt="Barcode" />
+                                <div style={{ letterSpacing: '2px', marginTop: '1px', textAlign: 'center' }}>
+                                    <span>{'xxxxxx'}</span>
+                                </div>
+                            </td>
+                        </tr>
+                        <tr style={{ height: '74px' }}>
+                            <td
+                                align="center"
+                                colSpan={3}
+                                style={{ border: '1px solid black' }}
+                            >
+                                鍟嗗搧
+                            </td>
+                            <td
+                                align="center"
+                                colSpan={5}
+                                style={{
+                                    overflow: 'hidden',
+                                    whiteSpace: 'nowrap',
+                                    textOverflow: 'ellipsis',
+                                    border: '1px solid black'
+                                }}
+                            >
+                                {item.product}
+                            </td>
+                            <td
+                                align="center"
+                                colSpan={2}
+                                style={{ border: '1px solid black' }}
+                            >
+                                澶囨敞
+                            </td>
+                            <td
+                                align="center"
+                                colSpan={2}
+                                style={{ border: '1px solid black' }}
+                            >
+                                {item.remark}
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            ))}
+
+        </>
+    )
+}
+
+

--
Gitblit v1.9.1