import { RESPONSE_CODE } from '@/constants/enum'; import '@/pages/OrderPrint/index.less'; import { postServiceOrderPrintOrder, postServiceOrderProcurePrint, postServiceOrderSupplierPrint, } from '@/services'; import { ExclamationCircleFilled } from '@ant-design/icons'; import { Modal, Select, Space, message } from 'antd'; import printJS from 'print-js'; import { useState } from 'react'; import { CHECK_TYPE } from '../Order/constant'; import { printerCSS } from './PrinterCSS'; import DalangPrinter from './components/DalangPrinter'; import HoujiePrinter from './components/HoujiePrinter'; import ZhuguangPrinter from './components/ZhuguangPrinter'; export default ({ mainOrder, subOrders, isRePrint, setVisible, printOptType, onClose, }) => { const [printerType, setPrinterType] = useState('Houjie'); const { confirm } = Modal; const handleChange = (value: string) => { setPrinterType(value); }; /** * 是供应商打印还是普通打印 * @param typeString * @returns */ function optType(typeString: string) { if (printOptType === typeString) { return true; } return false; } const showPropsConfirm = () => { if (isRePrint) { return; } confirm({ title: '打印出货单', icon: <ExclamationCircleFilled />, content: '请确认订单信息是否正确。点击打印后订单状态将变为待发货状态。', okText: '打印', okType: 'primary', okButtonProps: {}, cancelText: '取消', async onOk() { let body = { subIds: subOrders.map((item) => { return item.id; }), }; let res; if (optType(CHECK_TYPE.SUPPLIER)) { res = await postServiceOrderSupplierPrint({ data: { ids: subOrders.map((item) => { return item.id; }), }, }); } else if (optType(CHECK_TYPE.PROCURE)) { res = await postServiceOrderProcurePrint({ data: { ids: subOrders.map((item) => { return item.id; }), }, }); } else { res = await postServiceOrderPrintOrder({ data: body }); } if (res.result === RESPONSE_CODE.SUCCESS) { //printJS打印出货单 printJS({ printable: 'printArea', // 元素id,不支持多个 scanStyles: false, type: 'html', targetStyle: ['* '], targetStyles: ['*'], style: printerCSS(), }); message.success(res.message); onClose(); } }, onCancel() { message.info('取消打印出货单'); }, }); }; return ( <Modal title="打印出货单" centered open onOk={() => { if (isRePrint) { printJS({ printable: 'printArea', // 元素id,不支持多个 scanStyles: false, type: 'html', targetStyle: ['* '], targetStyles: ['*'], style: printerCSS(), }); setVisible(false); } showPropsConfirm(); // onClose(); }} onCancel={() => setVisible(false)} width={1000} > <Space direction="vertical" className="py-2"> <span>打印类型</span> <Select defaultValue="Houjie" style={{ width: 'auto' }} onChange={handleChange} options={[ { value: 'Houjie', label: '科路得出货单-厚街' }, { value: 'Dalang', label: '科路得出货单-大朗' }, { value: 'Zhuguang', label: '烛光出货单' }, ]} /> </Space> {printerType === 'Houjie' ? ( <HoujiePrinter mainOrder={mainOrder} subOrders={subOrders} /> ) : ( '' )} {printerType === 'Zhuguang' ? ( <ZhuguangPrinter mainOrder={mainOrder} subOrders={subOrders} /> ) : ( '' )} {printerType === 'Dalang' ? ( <DalangPrinter mainOrder={mainOrder} subOrders={subOrders} /> ) : ( '' )} </Modal> ); };