|
|
1
|
import { RESPONSE_CODE } from '@/constants/enum';
|
|
|
2
|
import '@/pages/OrderPrint/index.less';
|
|
|
3
4
5
|
import { postServiceOrderPrintOrder } from '@/services';
import { ExclamationCircleFilled } from '@ant-design/icons';
import { Modal, Select, Space, message } from 'antd';
|
|
|
6
|
import printJS from 'print-js';
|
|
|
7
8
9
10
|
import { useState } from 'react';
import DalangPrinter from './components/DalangPrinter';
import HoujiePrinter from './components/HoujiePrinter';
import ZhuguangPrinter from './components/ZhuguangPrinter';
|
|
|
11
|
|
|
|
12
|
export default ({ mainOrder, subOrders, isRePrint, onClose }) => {
|
|
|
13
14
15
16
17
18
|
const [printerType, setPrinterType] = useState('Houjie');
const { confirm } = Modal;
const handleChange = (value: string) => {
setPrinterType(value);
};
const showPropsConfirm = () => {
|
|
|
19
20
21
|
if (isRePrint) {
return;
}
|
|
|
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
|
confirm({
title: '确认打印出货单',
icon: <ExclamationCircleFilled />,
content: '您是否已打印出货单？',
okText: '是的我已打印',
okType: 'primary',
okButtonProps: {},
cancelText: '取消',
async onOk() {
let body = {
subIds: subOrders.map((item) => {
return item.id;
}),
};
const res = await postServiceOrderPrintOrder({ data: body });
if (res.result === RESPONSE_CODE.SUCCESS) {
message.success(res.message);
onClose();
}
},
onCancel() {
message.info('取消打印出货单');
},
});
};
|
|
|
47
48
49
50
51
52
53
54
55
56
|
return (
<Modal
title="打印出货单"
centered
open
onOk={() => {
//printJS打印出货单
printJS({
printable: 'printArea', // 元素id,不支持多个
|
|
|
57
|
scanStyles: true,
|
|
|
58
59
60
61
|
type: 'html',
targetStyle: ['* '],
targetStyles: ['*'],
style:
|
|
|
62
63
64
|
'@page{size:auto;margin: 0mm;}' +
'@media print { body{margin:0 auto;padding:0;#title{font-size:24px}}' +
'body{zoom:1.6;margin:0;', // landscape 默认横向打印
|
|
|
65
66
67
|
onPrintDialogClose: () => {
showPropsConfirm();
},
|
|
|
68
69
|
});
|
|
|
70
|
// onClose();
|
|
|
71
72
73
74
|
}}
onCancel={() => onClose()}
width={1000}
>
|
|
|
75
76
77
78
79
80
81
|
<Space direction="vertical" className="py-2">
<span>打印类型</span>
<Select
defaultValue="Houjie"
style={{ width: 'auto' }}
onChange={handleChange}
options={[
|
|
|
82
83
|
{ value: 'Houjie', label: '科路得出货单-厚街' },
{ value: 'Dalang', label: '科路得出货单-大朗' },
|
|
|
84
85
86
87
88
89
90
91
92
93
|
{ value: 'Zhuguang', label: '烛光出货单' },
]}
/>
</Space>
{printerType === 'Houjie' ? (
<HoujiePrinter mainOrder={mainOrder} subOrders={subOrders} />
) : (
''
)}
|
|
|
94
|
|
|
|
95
96
97
98
99
|
{printerType === 'Zhuguang' ? (
<ZhuguangPrinter mainOrder={mainOrder} subOrders={subOrders} />
) : (
''
)}
|
|
|
100
|
|
|
|
101
102
103
104
105
|
{printerType === 'Dalang' ? (
<DalangPrinter mainOrder={mainOrder} subOrders={subOrders} />
) : (
''
)}
|
|
|
106
107
108
|
</Modal>
);
};
|