From d086af5559dba52095d23e425be87d8f11f24814 Mon Sep 17 00:00:00 2001
From: zjj <3272660260@qq.com>
Date: 星期四, 17 七月 2025 16:32:47 +0800
Subject: [PATCH] #菜单、po单
---
rsf-admin/src/page/basicInfo/matnr/PrintModal.jsx | 149 ++++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 133 insertions(+), 16 deletions(-)
diff --git a/rsf-admin/src/page/basicInfo/matnr/PrintModal.jsx b/rsf-admin/src/page/basicInfo/matnr/PrintModal.jsx
index 83df0e0..99d2114 100644
--- a/rsf-admin/src/page/basicInfo/matnr/PrintModal.jsx
+++ b/rsf-admin/src/page/basicInfo/matnr/PrintModal.jsx
@@ -53,13 +53,31 @@
import StatusSelectInput from "../../components/StatusSelectInput";
import { useReactToPrint } from "react-to-print";
+import jsbarcode from 'jsbarcode'
+import { el } from "date-fns/locale";
-const PrintModal = ({ open, setOpen }) => {
+const PrintModal = ({ open, setOpen, rows }) => {
const refresh = useRefresh();
const translate = useTranslate();
const notify = useNotify();
- const contentRef = useRef(null);
- const reactToPrintFn = useReactToPrint({ contentRef });
+ const contentRef = useRef();
+ const reactToPrintFn = useReactToPrint({
+ content: () => {
+ return contentRef.current
+ },
+ documentTitle: `鐗╂枡淇℃伅`,
+ pageStyle: `
+ @page {
+
+ margin: 10mm;
+ }
+ @media print {
+ html, body {
+ width: 70mm; // A4妯悜瀹藉害
+ height: 40mm; // A4妯悜楂樺害
+ }
+ }`
+ });
const handleClose = (event, reason) => {
if (reason !== "backdropClick") {
@@ -98,8 +116,76 @@
</FormControl>
<Box>
- <div style={{ textAlign: 'center' }}>
- <PrintTemp />
+ <div style={{ textAlign: 'center', display: 'flex', justifyContent: 'center' }}>
+ <table
+ className="contain"
+ style={{
+ overflow: 'hidden',
+ fontSize: 'small',
+ tableLayout: 'fixed',
+ width: '280px',
+ borderCollapse: 'collapse', // 鍚堝苟杈规
+ border: '1px solid black' // 璁剧疆琛ㄦ牸鏁翠綋杈规
+ }}
+ >
+ <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={'/img/barcode.jpeg'} style={{ width: '90%' }} 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'
+ }}
+ >
+ {'xxxxxxxx'}
+ </td>
+ <td
+ align="center"
+ colSpan={2}
+ style={{ border: '1px solid black' }}
+ >
+ 澶囨敞
+ </td>
+ <td
+ align="center"
+ colSpan={2}
+ style={{ border: '1px solid black' }}
+ >
+ {'xx'}
+ </td>
+ </tr>
+ </tbody>
+ </table>
</div>
<style>{`
@media print {
@@ -108,7 +194,7 @@
}
}`} </style>
<div ref={contentRef} className="print-content" style={{ textAlign: 'center', display: 'none' }}>
- <PrintTemp />
+ <PrintTemp key={'bb'} rows={rows} />
</div>
</Box>
</DialogContent>
@@ -125,12 +211,42 @@
export default PrintModal;
-const PrintTemp = (props) => {
- const [data, setData] = useState([{
- barcode: '/img/barcode.jpeg',
- product: 'xxxxxx-xx/xx',
- remark: 'xx'
- }]);
+const PrintTemp = ({ rows }) => {
+ const notify = useNotify();
+ const [data, setData] = useState([]);
+ const http = async () => {
+ const res = await request.post(`/matnrs/many/${rows?.join()}`);
+ if (res?.data?.code === 200) {
+ let val = res.data.data.map((el => {
+ return {
+ barcode: '/img/barcode.jpeg',
+ code: el.code,
+ name: el.name,
+ memo: el.memo
+ }
+ }))
+ setData(val)
+ setTimeout(() => {
+ val.forEach((el) => {
+ jsbarcode(`#barcode${el.code}`, el.code, { height: 30 });
+ });
+ }, 10);
+
+
+
+ } else {
+ notify(res.data.msg);
+ }
+ }
+
+ useEffect(() => {
+ if (rows?.length > 0) {
+ http();
+ }
+
+ }, [rows]);
+
+
return (
<>
{data.map((item, index) => (
@@ -141,7 +257,7 @@
overflow: 'hidden',
fontSize: 'small',
tableLayout: 'fixed',
- width: '280px',
+ width: '520px',
borderCollapse: 'collapse',
borderSpacing: 0,
margin: '0 auto',
@@ -159,9 +275,10 @@
colSpan={9}
style={{ border: '1px solid black' }}
>
+ {/* <img id={"barcode" + item.code} style={{ width: '70%', verticalAlign: 'middle' }} /> */}
<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>
+ <span>{item.code}</span>
</div>
</td>
</tr>
@@ -183,7 +300,7 @@
border: '1px solid black'
}}
>
- {item.product}
+ {item.name}
</td>
<td
align="center"
@@ -197,7 +314,7 @@
colSpan={2}
style={{ border: '1px solid black' }}
>
- {item.remark}
+ {item.memo}
</td>
</tr>
</tbody>
--
Gitblit v1.9.1