Blame view

src/pages/OrderPrint/OrderPrintModal.tsx 4.12 KB
1
import { RESPONSE_CODE } from '@/constants/enum';
zhongnanhuang authored
2
import '@/pages/OrderPrint/index.less';
zhongnanhuang authored
3
4
import {
  postServiceOrderPrintOrder,
zhongnanhuang authored
5
  postServiceOrderProcurePrint,
zhongnanhuang authored
6
7
  postServiceOrderSupplierPrint,
} from '@/services';
8
9
import { ExclamationCircleFilled } from '@ant-design/icons';
import { Modal, Select, Space, message } from 'antd';
zhongnanhuang authored
10
import printJS from 'print-js';
11
import { useState } from 'react';
zhongnanhuang authored
12
import { CHECK_TYPE } from '../Order/constant';
zhongnanhuang authored
13
import { printerCSS } from './PrinterCSS';
14
15
16
import DalangPrinter from './components/DalangPrinter';
import HoujiePrinter from './components/HoujiePrinter';
import ZhuguangPrinter from './components/ZhuguangPrinter';
zhongnanhuang authored
17
zhongnanhuang authored
18
19
20
21
22
23
24
25
export default ({
  mainOrder,
  subOrders,
  isRePrint,
  setVisible,
  printOptType,
  onClose,
}) => {
26
27
28
29
30
  const [printerType, setPrinterType] = useState('Houjie');
  const { confirm } = Modal;
  const handleChange = (value: string) => {
    setPrinterType(value);
  };
zhongnanhuang authored
31
32
33
34
35
36
37
38
39
40
41
42
  /**
   * 是供应商打印还是普通打印
   * @param typeString
   * @returns
   */
  function optType(typeString: string) {
    if (printOptType === typeString) {
      return true;
    }

    return false;
  }
43
  const showPropsConfirm = () => {
zhongnanhuang authored
44
45
46
    if (isRePrint) {
      return;
    }
47
    confirm({
zhongnanhuang authored
48
      title: '打印出货单',
49
      icon: <ExclamationCircleFilled />,
zhongnanhuang authored
50
51
      content: '请确认订单信息是否正确。点击打印后订单状态将变为待发货状态。',
      okText: '打印',
52
53
54
55
56
57
58
59
60
      okType: 'primary',
      okButtonProps: {},
      cancelText: '取消',
      async onOk() {
        let body = {
          subIds: subOrders.map((item) => {
            return item.id;
          }),
        };
zhongnanhuang authored
61
62
63
64
65
66
67
68
69
        let res;
        if (optType(CHECK_TYPE.SUPPLIER)) {
          res = await postServiceOrderSupplierPrint({
            data: {
              ids: subOrders.map((item) => {
                return item.id;
              }),
            },
          });
zhongnanhuang authored
70
71
72
73
74
75
76
77
        } else if (optType(CHECK_TYPE.PROCURE)) {
          res = await postServiceOrderProcurePrint({
            data: {
              ids: subOrders.map((item) => {
                return item.id;
              }),
            },
          });
zhongnanhuang authored
78
79
80
81
        } else {
          res = await postServiceOrderPrintOrder({ data: body });
        }
82
        if (res.result === RESPONSE_CODE.SUCCESS) {
zhongnanhuang authored
83
84
85
86
87
88
89
90
91
          //printJS打印出货单
          printJS({
            printable: 'printArea', // 元素id,不支持多个
            scanStyles: false,
            type: 'html',
            targetStyle: ['* '],
            targetStyles: ['*'],
            style: printerCSS(),
          });
92
93
94
95
96
97
98
99
100
          message.success(res.message);
          onClose();
        }
      },
      onCancel() {
        message.info('取消打印出货单');
      },
    });
  };
zhongnanhuang authored
101
102
103
104
105
106
107

  return (
    <Modal
      title="打印出货单"
      centered
      open
      onOk={() => {
zhongnanhuang authored
108
109
110
111
112
113
114
115
116
117
118
119
        if (isRePrint) {
          printJS({
            printable: 'printArea', // 元素id,不支持多个
            scanStyles: false,
            type: 'html',
            targetStyle: ['* '],
            targetStyles: ['*'],
            style: printerCSS(),
          });
          setVisible(false);
        }
        showPropsConfirm();
120
        // onClose();
zhongnanhuang authored
121
      }}
zhongnanhuang authored
122
      onCancel={() => setVisible(false)}
zhongnanhuang authored
123
124
      width={1000}
    >
125
126
127
128
129
130
131
      <Space direction="vertical" className="py-2">
        <span>打印类型</span>
        <Select
          defaultValue="Houjie"
          style={{ width: 'auto' }}
          onChange={handleChange}
          options={[
132
133
            { value: 'Houjie', label: '科路得出货单-厚街' },
            { value: 'Dalang', label: '科路得出货单-大朗' },
134
135
136
137
138
139
140
141
142
143
            { value: 'Zhuguang', label: '烛光出货单' },
          ]}
        />
      </Space>

      {printerType === 'Houjie' ? (
        <HoujiePrinter mainOrder={mainOrder} subOrders={subOrders} />
      ) : (
        ''
      )}
zhongnanhuang authored
144
145
146
147
148
149
      {printerType === 'Zhuguang' ? (
        <ZhuguangPrinter mainOrder={mainOrder} subOrders={subOrders} />
      ) : (
        ''
      )}
zhongnanhuang authored
150
151
152
153
154
155
      {printerType === 'Dalang' ? (
        <DalangPrinter mainOrder={mainOrder} subOrders={subOrders} />
      ) : (
        ''
      )}
zhongnanhuang authored
156
157
158
    </Modal>
  );
};