canrd-main / canrd-erp-front · Commits

Commit 3b579acc45491d06454dfb21314b314c5d36c049

Authored by zhongnanhuang
2 parents 312df31c 417c7279
build: skipped

Merge branch 'znh231122' into 'develop' 

Znh231122



See merge request !5
Inline Side-by-side
Showing 11 changed files with 2090 additions and 225 deletions
package-lock.json
  View file @3b579ac
@@ -13,7 +13,8 @@ @@ -13,7 +13,8 @@
13 "@umijs/max": "^4.0.87", 13 "@umijs/max": "^4.0.87",
14 "antd": "^5.10.2", 14 "antd": "^5.10.2",
15 "axios": "^1.6.1", 15 "axios": "^1.6.1",
16 - "lodash": "^4.17.21" 16 + "lodash": "^4.17.21",
  17 + "print-js": "^1.6.0"
17 }, 18 },
18 "devDependencies": { 19 "devDependencies": {
19 "@inspir/pluto": "^1.0.5", 20 "@inspir/pluto": "^1.0.5",
@@ -14526,6 +14527,11 @@ @@ -14526,6 +14527,11 @@
14526 "renderkid": "^3.0.0" 14527 "renderkid": "^3.0.0"
14527 } 14528 }
14528 }, 14529 },
  14530 + "node_modules/print-js": {
  14531 + "version": "1.6.0",
  14532 + "resolved": "https://registry.npmjs.org/print-js/-/print-js-1.6.0.tgz",
  14533 + "integrity": "sha512-BfnOIzSKbqGRtO4o0rnj/K3681BSd2QUrsIZy/+WdCIugjIswjmx3lDEZpXB2ruGf9d4b3YNINri81+J0FsBWg=="
  14534 + },
14529 "node_modules/process": { 14535 "node_modules/process": {
14530 "version": "0.11.10", 14536 "version": "0.11.10",
14531 "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz", 14537 "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -29855,6 +29861,11 @@ @@ -29855,6 +29861,11 @@
29855 "renderkid": "^3.0.0" 29861 "renderkid": "^3.0.0"
29856 } 29862 }
29857 }, 29863 },
  29864 + "print-js": {
  29865 + "version": "1.6.0",
  29866 + "resolved": "https://registry.npmjs.org/print-js/-/print-js-1.6.0.tgz",
  29867 + "integrity": "sha512-BfnOIzSKbqGRtO4o0rnj/K3681BSd2QUrsIZy/+WdCIugjIswjmx3lDEZpXB2ruGf9d4b3YNINri81+J0FsBWg=="
  29868 + },
29858 "process": { 29869 "process": {
29859 "version": "0.11.10", 29870 "version": "0.11.10",
29860 "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz", 29871 "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
package.json
  View file @3b579ac
@@ -18,7 +18,8 @@ @@ -18,7 +18,8 @@
18 "@umijs/max": "^4.0.87", 18 "@umijs/max": "^4.0.87",
19 "antd": "^5.10.2", 19 "antd": "^5.10.2",
20 "axios": "^1.6.1", 20 "axios": "^1.6.1",
21 - "lodash": "^4.17.21" 21 + "lodash": "^4.17.21",
  22 + "print-js": "^1.6.0"
22 }, 23 },
23 "devDependencies": { 24 "devDependencies": {
24 "@inspir/pluto": "^1.0.5", 25 "@inspir/pluto": "^1.0.5",
src/pages/Order/components/ConfirmReceiptModal.tsx 0 → 100644
  View file @3b579ac
  1 +import { postServiceOrderConfirmReceipt } from '@/services';
  2 +import { UploadOutlined } from '@ant-design/icons';
  3 +import { ModalForm } from '@ant-design/pro-components';
  4 +import { Button, Form, Upload } from 'antd';
  5 +import { RcFile, UploadFile, UploadProps } from 'antd/es/upload';
  6 +import { useState } from 'react';
  7 +export default ({ data, onClose }) => {
  8 + const [form] = Form.useForm<{ name: string; company: string }>();
  9 + const [previewOpen, setPreviewOpen] = useState(false);
  10 + const [previewImage, setPreviewImage] = useState('');
  11 + const [previewTitle, setPreviewTitle] = useState('');
  12 + console.log(previewOpen);
  13 + console.log(previewImage);
  14 + console.log(previewTitle);
  15 + const getBase64 = (file: RcFile): Promise<string> =>
  16 + new Promise((resolve, reject) => {
  17 + const reader = new FileReader();
  18 + reader.readAsDataURL(file);
  19 + reader.onload = () => resolve(reader.result as string);
  20 + reader.onerror = (error) => reject(error);
  21 + });
  22 + // const beforeUpload = (file: RcFile) => {
  23 + // const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
  24 + // if (!isJpgOrPng) {
  25 + // message.error('You can only upload JPG/PNG file!');
  26 + // }
  27 + // const isLt2M = file.size / 1024 / 1024 < 2;
  28 + // if (!isLt2M) {
  29 + // message.error('Image must smaller than 2MB!');
  30 + // }
  31 + // return isJpgOrPng && isLt2M;
  32 + // };
  33 + const [fileList, setFileList] = useState<UploadFile[]>([]);
  34 + const [uploading, setUploading] = useState(false);
  35 +
  36 + const handlePreview = async (file: UploadFile) => {
  37 + if (!file.url && !file.preview) {
  38 + file.preview = await getBase64(file.originFileObj as RcFile);
  39 + }
  40 +
  41 + setPreviewImage(file.url || (file.preview as string));
  42 + setPreviewOpen(true);
  43 + setPreviewTitle(
  44 + file.name || file.url!.substring(file.url!.lastIndexOf('/') + 1),
  45 + );
  46 + };
  47 +
  48 + const handleUpload = async () => {
  49 + const formData = new FormData();
  50 + // fileList.forEach((file) => {
  51 + // formData.append('files[]', file as RcFile);
  52 + // });
  53 + formData.append('file', fileList[0] as RcFile);
  54 + formData.append('id', data.id);
  55 + setUploading(true);
  56 + // You can use any AJAX library you like
  57 + const res = await postServiceOrderConfirmReceipt({ data: formData });
  58 + console.log(res);
  59 +
  60 + setUploading(false);
  61 + };
  62 +
  63 + const props: UploadProps = {
  64 + onRemove: (file) => {
  65 + const index = fileList.indexOf(file);
  66 + const newFileList = fileList.slice();
  67 + newFileList.splice(index, 1);
  68 + setFileList(newFileList);
  69 + },
  70 + beforeUpload: (file) => {
  71 + setFileList([...fileList, file]);
  72 +
  73 + return false;
  74 + },
  75 + onPreview: handlePreview,
  76 + fileList,
  77 + };
  78 +
  79 + return (
  80 + <ModalForm<{
  81 + name: string;
  82 + company: string;
  83 + }>
  84 + width={500}
  85 + open
  86 + title="确认收货"
  87 + form={form}
  88 + autoFocusFirstInput
  89 + submitTimeout={2000}
  90 + onFinish={async () => {
  91 + onClose();
  92 + }}
  93 + >
  94 + <Upload {...props}>
  95 + <Button icon={<UploadOutlined />}>Select File</Button>
  96 + </Upload>
  97 + <Button
  98 + type="primary"
  99 + onClick={handleUpload}
  100 + disabled={fileList.length === 0}
  101 + loading={uploading}
  102 + style={{ marginTop: 16 }}
  103 + >
  104 + {uploading ? 'Uploading' : 'Start Upload'}
  105 + </Button>
  106 + </ModalForm>
  107 + );
  108 +};
src/pages/Order/components/FinancialDrawer.tsx
  View file @3b579ac
@@ -14,17 +14,10 @@ import { Form, message } from &#39;antd&#39;; @@ -14,17 +14,10 @@ import { Form, message } from &#39;antd&#39;;
14 // }); 14 // });
15 // }; 15 // };
16 16
17 -export default ({ onClose }) => {  
18 - // const [expandedRowKeys, setExpandedRowKeys] = useState<readonly Key[]>([]);  
19 - const [form] = Form.useForm<{ name: string; company: string }>();  
20 - // const actionRef = useRef<  
21 - // FormListActionType<{  
22 - // name: string;  
23 - // }>  
24 - // >();  
25 - //作为商品行号  
26 - // const rowRumber = useRef(0); 17 +export default ({ mainOrder, subOrders, onClose }) => {
  18 + console.log(subOrders);
27 19
  20 + const [form] = Form.useForm<{ name: string; company: string }>();
28 return ( 21 return (
29 <DrawerForm<{ 22 <DrawerForm<{
30 name: string; 23 name: string;
@@ -39,8 +32,7 @@ export default ({ onClose }) =&gt; { @@ -39,8 +32,7 @@ export default ({ onClose }) =&gt; {
39 maxWidth: window.innerWidth * 0.8, 32 maxWidth: window.innerWidth * 0.8,
40 minWidth: 400, 33 minWidth: 400,
41 }} 34 }}
42 - // layout="horizontal"  
43 - // labelCol={{ span: 8 }} 35 + initialValues={mainOrder}
44 form={form} 36 form={form}
45 autoFocusFirstInput 37 autoFocusFirstInput
46 drawerProps={{ 38 drawerProps={{
@@ -53,7 +45,7 @@ export default ({ onClose }) =&gt; { @@ -53,7 +45,7 @@ export default ({ onClose }) =&gt; {
53 console.log(values.name); 45 console.log(values.name);
54 message.success('提交成功'); 46 message.success('提交成功');
55 // 不返回不会关闭弹框 47 // 不返回不会关闭弹框
56 - // onClose(); 48 + onClose();
57 return true; 49 return true;
58 }} 50 }}
59 onOpenChange={(val) => { 51 onOpenChange={(val) => {
@@ -62,24 +54,27 @@ export default ({ onClose }) =&gt; { @@ -62,24 +54,27 @@ export default ({ onClose }) =&gt; {
62 > 54 >
63 <ProFormText 55 <ProFormText
64 width="lg" 56 width="lg"
65 - name="invoiceInformation" 57 + name="invoiceIdentificationNumber"
66 label="开票信息" 58 label="开票信息"
67 placeholder="请输入开票信息" 59 placeholder="请输入开票信息"
  60 + disabled
68 /> 61 />
69 <ProFormText 62 <ProFormText
70 width="lg" 63 width="lg"
71 name="bank" 64 name="bank"
72 label="开户银行" 65 label="开户银行"
73 placeholder="请输入开户银行" 66 placeholder="请输入开户银行"
  67 + disabled
74 /> 68 />
75 <ProFormText 69 <ProFormText
76 width="lg" 70 width="lg"
77 name="bankAccountNumber" 71 name="bankAccountNumber"
78 label="开户银行账号" 72 label="开户银行账号"
79 placeholder="请输入开户银行账号" 73 placeholder="请输入开户银行账号"
  74 + disabled
80 /> 75 />
81 - <ProFormDatePicker width="lg" name="contractTime" label="开票时间" />  
82 - <ProFormDatePicker width="lg" name="contractTime" label="收款时间" /> 76 + <ProFormDatePicker width="lg" name="invoicingTime" label="开票时间" />
  77 + <ProFormDatePicker width="lg" name="collectMoneyTime" label="收款时间" />
83 </DrawerForm> 78 </DrawerForm>
84 ); 79 );
85 }; 80 };
src/pages/Order/components/OrderDrawer.tsx
  View file @3b579ac
@@ -2,8 +2,9 @@ import { RESPONSE_CODE } from &#39;@/constants/enum&#39;; @@ -2,8 +2,9 @@ import { RESPONSE_CODE } from &#39;@/constants/enum&#39;;
2 import { 2 import {
3 postServiceOrderAddOrder, 3 postServiceOrderAddOrder,
4 postServiceOrderQueryProductInformation, 4 postServiceOrderQueryProductInformation,
  5 + postServiceOrderUpdateOrder,
5 } from '@/services'; 6 } from '@/services';
6 -import { enumToSelect } from '@/utils'; 7 +import { enumToSelect, getUserInfo } from '@/utils';
7 import { 8 import {
8 DrawerForm, 9 DrawerForm,
9 FormListActionType, 10 FormListActionType,
@@ -16,7 +17,7 @@ import { @@ -16,7 +17,7 @@ import {
16 ProFormTextArea, 17 ProFormTextArea,
17 } from '@ant-design/pro-components'; 18 } from '@ant-design/pro-components';
18 import { Form, message } from 'antd'; 19 import { Form, message } from 'antd';
19 -import { useEffect, useRef } from 'react'; 20 +import { useEffect, useRef, useState } from 'react';
20 import { 21 import {
21 INVOCING_STATUS_OPTIONS, 22 INVOCING_STATUS_OPTIONS,
22 PAYMENT_CHANNEL_OPTIONS, 23 PAYMENT_CHANNEL_OPTIONS,
@@ -24,7 +25,17 @@ import { @@ -24,7 +25,17 @@ import {
24 PRODUCT_BELONG_DEPARTMENT_OPTIONS, 25 PRODUCT_BELONG_DEPARTMENT_OPTIONS,
25 } from '../constant'; 26 } from '../constant';
26 27
27 -export default ({ onClose, data }) => { 28 +export default ({ onClose, data, isAdd }) => {
  29 + const [invoicingStatus, setInvoicingStatus] = useState('');
  30 +
  31 + //订单修改和新增的子订单列表命名是list
  32 + data.list = data.subOrderInformationLists;
  33 + if (!isAdd) {
  34 + data.paymentMethod = data.list[0].paymentMethod;
  35 + data.paymentChannel = data.list[0].paymentChannel;
  36 + data.invoicingStatus = data.list[0].invoicingStatus;
  37 + }
  38 +
28 const [form] = Form.useForm<{ 39 const [form] = Form.useForm<{
29 salesCode: ''; 40 salesCode: '';
30 customerName: ''; 41 customerName: '';
@@ -89,46 +100,11 @@ export default ({ onClose, data }) =&gt; { @@ -89,46 +100,11 @@ export default ({ onClose, data }) =&gt; {
89 }> 100 }>
90 open 101 open
91 width="35%" 102 width="35%"
92 - title="新建订单"  
93 - initialValues={{  
94 - customerName: '123',  
95 - customerContactNumber: '123',  
96 - institution: '123',  
97 - institutionContactName: '123',  
98 - customerShippingAddress: '123123',  
99 - totalPayment: '12312',  
100 - paymentChannel: 'BANK_TRANSFER',  
101 - paymentMethod: 'PAYMENT_IN_ADVANCE',  
102 - productBelongBusiness: 'EXPERIMENTAL_CONSUMABLES',  
103 - invoicingStatus: 'INVOICED',  
104 - invoiceIdentificationNumber: '12312',  
105 - invoicingTime: '2023-11-29 23:19:15',  
106 - bank: '123',  
107 - bankAccountNumber: '1231',  
108 - notes: '123',  
109 - list: [  
110 - {  
111 - productCode: 'qweq',  
112 - productName: 'qweqwe',  
113 - quantity: '99',  
114 - productPrice: '12313',  
115 - parameters: 'qweq',  
116 - subOrderPayment: '1231',  
117 - unit: 'qweq',  
118 - serialNumber: 'qwewqe',  
119 - notes: 'qweqw',  
120 - },  
121 - {  
122 - productName: 'asdsda',  
123 - productCode: 'dasda',  
124 - parameters: 'sdasa',  
125 - quantity: '99',  
126 - productPrice: '123',  
127 - unit: '123',  
128 - subOrderPayment: '123',  
129 - serialNumber: 'adadas',  
130 - },  
131 - ], 103 + title={isAdd ? '新建订单' : '修改订单'}
  104 + initialValues={() => {
  105 + if (!isAdd) {
  106 + return data;
  107 + }
132 }} 108 }}
133 resize={{ 109 resize={{
134 onResize() { 110 onResize() {
@@ -146,13 +122,21 @@ export default ({ onClose, data }) =&gt; { @@ -146,13 +122,21 @@ export default ({ onClose, data }) =&gt; {
146 }} 122 }}
147 submitTimeout={2000} 123 submitTimeout={2000}
148 onFinish={async (values) => { 124 onFinish={async (values) => {
149 - const data = await postServiceOrderAddOrder({ data: values }); 125 + let data = {};
  126 + if (isAdd) {
  127 + message.info('add');
  128 + data = await postServiceOrderAddOrder({ data: values });
  129 + } else {
  130 + message.info('update');
  131 + data = await postServiceOrderUpdateOrder({ data: values });
  132 + }
  133 +
150 if (data.result === RESPONSE_CODE.SUCCESS) { 134 if (data.result === RESPONSE_CODE.SUCCESS) {
151 message.success(data.message); 135 message.success(data.message);
  136 + // 不返回不会关闭弹框
  137 + onClose();
  138 + return true;
152 } 139 }
153 - // 不返回不会关闭弹框  
154 - onClose();  
155 - return true;  
156 }} 140 }}
157 onOpenChange={(val) => { 141 onOpenChange={(val) => {
158 return !val && onClose(); 142 return !val && onClose();
@@ -160,12 +144,20 @@ export default ({ onClose, data }) =&gt; { @@ -160,12 +144,20 @@ export default ({ onClose, data }) =&gt; {
160 > 144 >
161 <h2>订单基本信息</h2> 145 <h2>订单基本信息</h2>
162 <ProFormText 146 <ProFormText
  147 + name="id"
  148 + width="lg"
  149 + disabled
  150 + label="id"
  151 + placeholder="id"
  152 + hidden
  153 + />
  154 + <ProFormText
163 name="salesCode" 155 name="salesCode"
164 width="lg" 156 width="lg"
165 disabled 157 disabled
166 label="销售代表" 158 label="销售代表"
167 placeholder="请输入销售代表" 159 placeholder="请输入销售代表"
168 - initialValue="JOJO" 160 + initialValue={getUserInfo().nickName}
169 /> 161 />
170 <ProFormText 162 <ProFormText
171 name="customerName" 163 name="customerName"
@@ -220,33 +212,43 @@ export default ({ onClose, data }) =&gt; { @@ -220,33 +212,43 @@ export default ({ onClose, data }) =&gt; {
220 options={enumToSelect(PRODUCT_BELONG_DEPARTMENT_OPTIONS)} 212 options={enumToSelect(PRODUCT_BELONG_DEPARTMENT_OPTIONS)}
221 /> 213 />
222 <ProFormSelect 214 <ProFormSelect
223 - placeholder="选择是否要开票" 215 + placeholder="选择是否需要开票"
224 name="invoicingStatus" 216 name="invoicingStatus"
225 width="lg" 217 width="lg"
226 - label="是否要开票" 218 + label="是否需要开票"
227 options={enumToSelect(INVOCING_STATUS_OPTIONS)} 219 options={enumToSelect(INVOCING_STATUS_OPTIONS)}
  220 + onChange={(_, option) => {
  221 + setInvoicingStatus(option.value);
  222 + }}
228 /> 223 />
229 <ProFormText 224 <ProFormText
230 width="lg" 225 width="lg"
231 name="invoiceIdentificationNumber" 226 name="invoiceIdentificationNumber"
232 label="开票信息" 227 label="开票信息"
  228 + hidden={invoicingStatus !== 'INVOICED'}
233 placeholder="请输入开票信息" 229 placeholder="请输入开票信息"
234 /> 230 />
235 - <ProFormDateTimePicker  
236 - width="lg"  
237 - name="invoicingTime"  
238 - label="开票时间"  
239 - placeholder="请输入开票时间"  
240 - /> 231 + {getUserInfo().roleSmallVO?.code === 'admin' ? (
  232 + <ProFormDateTimePicker
  233 + width="lg"
  234 + name="invoicingTime"
  235 + label="开票时间"
  236 + placeholder="请输入开票时间"
  237 + />
  238 + ) : (
  239 + ''
  240 + )}
241 <ProFormText 241 <ProFormText
242 width="lg" 242 width="lg"
243 name="bank" 243 name="bank"
244 label="开户银行" 244 label="开户银行"
  245 + hidden={invoicingStatus !== 'INVOICED'}
245 placeholder="请输入开户银行" 246 placeholder="请输入开户银行"
246 /> 247 />
247 <ProFormText 248 <ProFormText
248 width="lg" 249 width="lg"
249 name="bankAccountNumber" 250 name="bankAccountNumber"
  251 + hidden={invoicingStatus !== 'INVOICED'}
250 label="银行账号" 252 label="银行账号"
251 placeholder="请输入银行账号" 253 placeholder="请输入银行账号"
252 /> 254 />
src/pages/Order/constant.ts
  View file @3b579ac
@@ -138,48 +138,70 @@ export const MAIN_ORDER_COLUMNS = [ @@ -138,48 +138,70 @@ export const MAIN_ORDER_COLUMNS = [
138 ]; 138 ];
139 139
140 export const SUB_ORDER_COLUMNS = [ 140 export const SUB_ORDER_COLUMNS = [
141 - { title: 'ID', dataIndex: 'id', key: 'id' },  
142 - { title: '商品编码', dataIndex: 'productCode', key: 'productCode' },  
143 - { title: '商品名称', dataIndex: 'productName', key: 'productName' },  
144 - { title: '商品参数', dataIndex: 'parameters', key: 'parameters' },  
145 - { title: '商品数量', dataIndex: 'quantity', key: 'quantity' }, 141 + { title: 'ID', dataIndex: 'id', key: 'id', width: 80 },
  142 + {
  143 + title: '商品编码',
  144 + dataIndex: 'productCode',
  145 + key: 'productCode',
  146 + width: 80,
  147 + },
  148 + {
  149 + title: '商品名称',
  150 + dataIndex: 'productName',
  151 + key: 'productName',
  152 + width: 80,
  153 + },
  154 + { title: '商品参数', dataIndex: 'parameters', key: 'parameters', width: 80 },
  155 + { title: '商品数量', dataIndex: 'quantity', key: 'quantity', width: 80 },
146 { 156 {
147 title: '子订单金额(￥)', 157 title: '子订单金额(￥)',
148 dataIndex: 'subOrderPayment', 158 dataIndex: 'subOrderPayment',
149 key: 'subOrderPayment', 159 key: 'subOrderPayment',
  160 + width: 80,
150 }, 161 },
151 { 162 {
152 title: '支付方式', 163 title: '支付方式',
153 dataIndex: 'paymentMethod', 164 dataIndex: 'paymentMethod',
154 key: 'paymentMethod', 165 key: 'paymentMethod',
  166 + width: 80,
155 }, 167 },
156 { 168 {
157 title: '支付渠道', 169 title: '支付渠道',
158 dataIndex: 'paymentChannel', 170 dataIndex: 'paymentChannel',
159 key: 'paymentChannel', 171 key: 'paymentChannel',
  172 + width: 80,
160 }, 173 },
161 { 174 {
162 title: '支付流水', 175 title: '支付流水',
163 dataIndex: 'paymentTransactionId', 176 dataIndex: 'paymentTransactionId',
164 key: 'paymentTransactionId', 177 key: 'paymentTransactionId',
  178 + width: 80,
165 }, 179 },
166 { 180 {
167 title: '物流方式', 181 title: '物流方式',
168 dataIndex: 'logisticsMethod', 182 dataIndex: 'logisticsMethod',
169 key: 'logisticsMethod', 183 key: 'logisticsMethod',
  184 + width: 80,
  185 + },
  186 + {
  187 + title: '物流单号',
  188 + dataIndex: 'serialNumber',
  189 + key: 'serialNumber',
  190 + width: 80,
170 }, 191 },
171 - { title: '物流单号', dataIndex: 'serialNumber', key: 'serialNumber' },  
172 { 192 {
173 title: '开票状态', 193 title: '开票状态',
174 dataIndex: 'invoicingStatus', 194 dataIndex: 'invoicingStatus',
175 key: 'invoicingStatus', 195 key: 'invoicingStatus',
176 component: 'tag', 196 component: 'tag',
  197 + width: 80,
177 }, 198 },
178 { 199 {
179 title: '订单状态', 200 title: '订单状态',
180 dataIndex: 'orderStatus', 201 dataIndex: 'orderStatus',
181 key: 'orderStatus', 202 key: 'orderStatus',
182 component: 'tag', 203 component: 'tag',
  204 + width: 80,
183 }, 205 },
184 ]; 206 ];
185 207
@@ -203,8 +225,8 @@ export const PRODUCT_BELONG_DEPARTMENT_OPTIONS = { @@ -203,8 +225,8 @@ export const PRODUCT_BELONG_DEPARTMENT_OPTIONS = {
203 }; 225 };
204 226
205 export const INVOCING_STATUS_OPTIONS = { 227 export const INVOCING_STATUS_OPTIONS = {
206 - UN_INVOICE: '未开票',  
207 - INVOICED: '已开票', 228 + UN_INVOICE: '否',
  229 + INVOICED: '是',
208 }; 230 };
209 231
210 export const LOGISTICS_STATUS_OPTIONS = { 232 export const LOGISTICS_STATUS_OPTIONS = {
src/pages/Order/index.tsx
  View file @3b579ac
1 import ButtonConfirm from '@/components/ButtomConfirm'; 1 import ButtonConfirm from '@/components/ButtomConfirm';
2 import { RESPONSE_CODE } from '@/constants/enum'; 2 import { RESPONSE_CODE } from '@/constants/enum';
3 import { 3 import {
4 - postServiceOrderExport,  
5 postServiceOrderOrderCancel, 4 postServiceOrderOrderCancel,
6 postServiceOrderPrintOrder, 5 postServiceOrderPrintOrder,
7 postServiceOrderQueryServiceOrder, 6 postServiceOrderQueryServiceOrder,
8 } from '@/services'; 7 } from '@/services';
9 import { orderExport } from '@/services/order'; 8 import { orderExport } from '@/services/order';
10 import { enumValueToLabel } from '@/utils'; 9 import { enumValueToLabel } from '@/utils';
11 -import { DownOutlined } from '@ant-design/icons'; 10 +import { DownOutlined, EllipsisOutlined } from '@ant-design/icons';
12 import { 11 import {
13 PageContainer, 12 PageContainer,
14 ProColumns, 13 ProColumns,
15 ProTable, 14 ProTable,
16 } from '@ant-design/pro-components'; 15 } from '@ant-design/pro-components';
  16 +import { history } from '@umijs/max';
17 import { 17 import {
  18 + Avatar,
18 Button, 19 Button,
19 Checkbox, 20 Checkbox,
20 Divider, 21 Divider,
@@ -27,8 +28,11 @@ import { @@ -27,8 +28,11 @@ import {
27 } from 'antd'; 28 } from 'antd';
28 import { cloneDeep } from 'lodash'; 29 import { cloneDeep } from 'lodash';
29 import { Key, useRef, useState } from 'react'; 30 import { Key, useRef, useState } from 'react';
  31 +import OrderPrintModal from '../OrderPrint/OrderPrintModal';
30 import CheckModal from './components/CheckModal'; 32 import CheckModal from './components/CheckModal';
  33 +import ConfirmReceiptModal from './components/ConfirmReceiptModal';
31 import DeliverModal from './components/DeliverModal'; 34 import DeliverModal from './components/DeliverModal';
  35 +import FinancialDrawer from './components/FinancialDrawer';
32 import OrderDrawer from './components/OrderDrawer'; 36 import OrderDrawer from './components/OrderDrawer';
33 import { 37 import {
34 INVOCING_STATUS_OPTIONS, 38 INVOCING_STATUS_OPTIONS,
@@ -45,11 +49,17 @@ import { OrderListItemType, OrderType } from &#39;./type.d&#39;; @@ -45,11 +49,17 @@ import { OrderListItemType, OrderType } from &#39;./type.d&#39;;
45 const OrderPage = () => { 49 const OrderPage = () => {
46 const [orderDrawerVisible, setOrderDrawerVisible] = useState<boolean>(false); 50 const [orderDrawerVisible, setOrderDrawerVisible] = useState<boolean>(false);
47 const [checkVisible, setCheckVisible] = useState<boolean>(false); 51 const [checkVisible, setCheckVisible] = useState<boolean>(false);
  52 + const [orderPrintVisible, setOrderPrintVisible] = useState<boolean>(false);
  53 + const [financialVisible, setFinancialVisible] = useState<boolean>(false);
  54 + const [confirmReceiptVisible, setConfirmReceiptVisible] =
  55 + useState<boolean>(false);
48 const [deliverVisible, setDeliverVisible] = useState<boolean>(false); 56 const [deliverVisible, setDeliverVisible] = useState<boolean>(false);
  57 + const [isOrderAddOpt, setIsOrderAddOpt] = useState<boolean>(false);
49 const [expandedRowKeys, setExpandedRowKeys] = useState<Key[]>([]); 58 const [expandedRowKeys, setExpandedRowKeys] = useState<Key[]>([]);
50 const [orderRow, setOrderRow] = useState<Partial<OrderType>>({}); 59 const [orderRow, setOrderRow] = useState<Partial<OrderType>>({});
51 const [mainOrderAllItemKeys, setMainOrderAllItemKeys] = useState([]); 60 const [mainOrderAllItemKeys, setMainOrderAllItemKeys] = useState([]);
52 const [rolePath, setRolePath] = useState([]); //当前角色权限（新增跟打印按钮） 61 const [rolePath, setRolePath] = useState([]); //当前角色权限（新增跟打印按钮）
  62 + const userInfo = JSON.parse(localStorage.getItem('userInfo'));
53 63
54 const [selectedRows, setSelectedRows] = useState({}); 64 const [selectedRows, setSelectedRows] = useState({});
55 const [selectedRowObj, setSelectedRowObj] = useState({}); 65 const [selectedRowObj, setSelectedRowObj] = useState({});
@@ -68,7 +78,6 @@ const OrderPage = () =&gt; { @@ -68,7 +78,6 @@ const OrderPage = () =&gt; {
68 setExpandedRowKeys([]); 78 setExpandedRowKeys([]);
69 return; 79 return;
70 } 80 }
71 -  
72 setExpandedRowKeys(mainOrderAllItemKeys); 81 setExpandedRowKeys(mainOrderAllItemKeys);
73 }; 82 };
74 // 主订单内容渲染 83 // 主订单内容渲染
@@ -169,7 +178,12 @@ const OrderPage = () =&gt; { @@ -169,7 +178,12 @@ const OrderPage = () =&gt; {
169 className="p-0" 178 className="p-0"
170 type="link" 179 type="link"
171 onClick={() => { 180 onClick={() => {
172 - window.print(); 181 + if (!selectedRowObj[record.id]?.length) {
  182 + return message.error('请选择选择子订单');
  183 + }
  184 + setSelectedRows(selectedRowObj[record.id]);
  185 + setOrderRow(record);
  186 + setOrderPrintVisible(true);
173 }} 187 }}
174 > 188 >
175 打印 189 打印
@@ -177,13 +191,21 @@ const OrderPage = () =&gt; { @@ -177,13 +191,21 @@ const OrderPage = () =&gt; {
177 ) : ( 191 ) : (
178 '' 192 ''
179 )} 193 )}
180 - {record.mainPath.includes('confirmReceipt') ? (  
181 - <ButtonConfirm 194 + {record.mainPath.includes('editOrder') ? (
  195 + <Button
  196 + type="link"
182 className="p-0" 197 className="p-0"
183 - title="确认开票？"  
184 - text="开票"  
185 - onConfirm={() => {}}  
186 - /> 198 + onClick={() => {
  199 + let selectedSubOrders = selectedRowObj[record.id];
  200 + setSelectedRows(selectedSubOrders);
  201 + if (selectedSubOrders === undefined) {
  202 + setSelectedRows(record.subOrderInformationLists);
  203 + }
  204 + setFinancialVisible(true);
  205 + }}
  206 + >
  207 + 开票
  208 + </Button>
187 ) : ( 209 ) : (
188 '' 210 ''
189 )} 211 )}
@@ -194,6 +216,7 @@ const OrderPage = () =&gt; { @@ -194,6 +216,7 @@ const OrderPage = () =&gt; {
194 onClick={() => { 216 onClick={() => {
195 setOrderDrawerVisible(true); 217 setOrderDrawerVisible(true);
196 setOrderRow(record); 218 setOrderRow(record);
  219 + setIsOrderAddOpt(false);
197 }} 220 }}
198 > 221 >
199 编辑 222 编辑
@@ -201,6 +224,7 @@ const OrderPage = () =&gt; { @@ -201,6 +224,7 @@ const OrderPage = () =&gt; {
201 ) : ( 224 ) : (
202 '' 225 ''
203 )} 226 )}
  227 +
204 {record.mainPath.includes('checkOrder') ? ( 228 {record.mainPath.includes('checkOrder') ? (
205 <Button 229 <Button
206 className="p-0" 230 className="p-0"
@@ -290,10 +314,8 @@ const OrderPage = () =&gt; { @@ -290,10 +314,8 @@ const OrderPage = () =&gt; {
290 return <Tag color={color}>{label}</Tag>; 314 return <Tag color={color}>{label}</Tag>;
291 }, 315 },
292 }; 316 };
293 - }  
294 -  
295 - //枚举字段处理  
296 - if ( 317 + } else if (
  318 + //枚举字段处理
297 item.key === 'paymentMethod' || 319 item.key === 'paymentMethod' ||
298 item.key === 'paymentChannel' || 320 item.key === 'paymentChannel' ||
299 item.key === 'logisticsMethod' 321 item.key === 'logisticsMethod'
@@ -311,8 +333,22 @@ const OrderPage = () =&gt; { @@ -311,8 +333,22 @@ const OrderPage = () =&gt; {
311 return label; 333 return label;
312 }, 334 },
313 }; 335 };
  336 + } else {
  337 + //普通字段，超出长度自动换行
  338 + return {
  339 + ...item,
  340 + render: (text: string) => {
  341 + return (
  342 + <div
  343 + style={{ wordWrap: 'break-word', wordBreak: 'break-all' }}
  344 + >
  345 + {text}
  346 + </div>
  347 + );
  348 + },
  349 + };
314 } 350 }
315 - return item; 351 + // return item;
316 }) 352 })
317 .concat([ 353 .concat([
318 { 354 {
@@ -359,26 +395,32 @@ const OrderPage = () =&gt; { @@ -359,26 +395,32 @@ const OrderPage = () =&gt; {
359 ) : ( 395 ) : (
360 '' 396 ''
361 )} 397 )}
362 - {optRecord.subPath.includes('confirmReceipt') ? (  
363 - <ButtonConfirm 398 + {optRecord.subPath.includes('editOrder') ? (
  399 + <Button
364 className="p-0" 400 className="p-0"
365 - title="确认开票？"  
366 - text="开票"  
367 - onConfirm={() => {}}  
368 - /> 401 + type="link"
  402 + onClick={() => {
  403 + setFinancialVisible(true);
  404 + setOrderRow(record);
  405 + setSelectedRows(selectedRowObj[record.id]);
  406 + }}
  407 + >
  408 + 编辑
  409 + </Button>
369 ) : ( 410 ) : (
370 '' 411 ''
371 )} 412 )}
372 - {optRecord.subPath.includes('updateOrder') ? ( 413 + {optRecord.subPath.includes('invocing') ? (
373 <Button 414 <Button
374 className="p-0" 415 className="p-0"
375 type="link" 416 type="link"
376 onClick={() => { 417 onClick={() => {
377 - setOrderDrawerVisible(true);  
378 - setOrderRow(optRecord); 418 + setFinancialVisible(true);
  419 + setOrderRow(record);
  420 + setSelectedRows(selectedRowObj[record.id]);
379 }} 421 }}
380 > 422 >
381 - 编辑 423 + 开票
382 </Button> 424 </Button>
383 ) : ( 425 ) : (
384 '' 426 ''
@@ -398,6 +440,21 @@ const OrderPage = () =&gt; { @@ -398,6 +440,21 @@ const OrderPage = () =&gt; {
398 '' 440 ''
399 )} 441 )}
400 442
  443 + {optRecord.subPath.includes('confirmReceipt') ? (
  444 + <Button
  445 + className="p-0"
  446 + type="link"
  447 + onClick={() => {
  448 + setConfirmReceiptVisible(true);
  449 + setOrderRow(optRecord);
  450 + }}
  451 + >
  452 + 确认收货
  453 + </Button>
  454 + ) : (
  455 + ''
  456 + )}
  457 +
401 {/* {optRecord.subPath.includes("OrderCancel") ? 458 {/* {optRecord.subPath.includes("OrderCancel") ?
402 <ButtonConfirm 459 <ButtonConfirm
403 className="p-0" 460 className="p-0"
@@ -474,24 +531,28 @@ const OrderPage = () =&gt; { @@ -474,24 +531,28 @@ const OrderPage = () =&gt; {
474 message.error('当前没有订单'); 531 message.error('当前没有订单');
475 return; 532 return;
476 } 533 }
477 - const data = await postServiceOrderExport({  
478 - data: { flag: true, ids: mainOrderAllItemKeys },  
479 - });  
480 - if (data.result === RESPONSE_CODE.SUCCESS) {  
481 - message.success(data.message);  
482 - } 534 + // const data = await postServiceOrderExport({
  535 + // data: { flag: true, ids: mainOrderAllItemKeys },
  536 + // });
  537 + // if (data.result === RESPONSE_CODE.SUCCESS) {
  538 + // message.success(data.message);
  539 + // }
  540 + let body = { flag: true, ids: mainOrderAllItemKeys };
  541 + orderExport(body);
483 }, 542 },
484 }, 543 },
485 { 544 {
486 label: '导出所有订单', 545 label: '导出所有订单',
487 key: '3', 546 key: '3',
488 onClick: async () => { 547 onClick: async () => {
489 - const data = await postServiceOrderExport({  
490 - data: { flag: false, ids: [] },  
491 - });  
492 - if (data.result === RESPONSE_CODE.SUCCESS) {  
493 - message.success(data.message);  
494 - } 548 + // const data = await postServiceOrderExport({
  549 + // data: { flag: false, ids: [] },
  550 + // });
  551 + // if (data.result === RESPONSE_CODE.SUCCESS) {
  552 + // message.success(data.message);
  553 + // }
  554 + let body = { flag: false, ids: [] };
  555 + orderExport(body);
495 }, 556 },
496 }, 557 },
497 ]; 558 ];
@@ -506,7 +567,10 @@ const OrderPage = () =&gt; { @@ -506,7 +567,10 @@ const OrderPage = () =&gt; {
506 <Button 567 <Button
507 type="primary" 568 type="primary"
508 key="out" 569 key="out"
509 - onClick={() => setOrderDrawerVisible(true)} 570 + onClick={() => {
  571 + setOrderDrawerVisible(true);
  572 + setIsOrderAddOpt(true);
  573 + }}
510 > 574 >
511 新增 575 新增
512 </Button>, 576 </Button>,
@@ -544,6 +608,35 @@ const OrderPage = () =&gt; { @@ -544,6 +608,35 @@ const OrderPage = () =&gt; {
544 <PageContainer 608 <PageContainer
545 header={{ 609 header={{
546 title: '订单管理', 610 title: '订单管理',
  611 + extra: [
  612 + <Avatar key="0" style={{ verticalAlign: 'middle' }} size="large">
  613 + {userInfo?.nickName}
  614 + </Avatar>,
  615 + <Dropdown
  616 + key="dropdown"
  617 + trigger={['click']}
  618 + menu={{
  619 + items: [
  620 + {
  621 + label: '退出登录',
  622 + key: '1',
  623 + onClick: () => {
  624 + localStorage.removeItem('token');
  625 + history.push('/login');
  626 + },
  627 + },
  628 + {
  629 + label: '修改密码',
  630 + key: '2',
  631 + },
  632 + ],
  633 + }}
  634 + >
  635 + <Button key="4" style={{ padding: '0 8px' }}>
  636 + <EllipsisOutlined />
  637 + </Button>
  638 + </Dropdown>,
  639 + ],
547 }} 640 }}
548 > 641 >
549 <ProTable 642 <ProTable
@@ -578,6 +671,7 @@ const OrderPage = () =&gt; { @@ -578,6 +671,7 @@ const OrderPage = () =&gt; {
578 filter, 671 filter,
579 data: params, 672 data: params,
580 }); 673 });
  674 +
581 let mainOrderIds = data?.data?.map((d) => d.id); 675 let mainOrderIds = data?.data?.map((d) => d.id);
582 if (mainOrderAllItemKeys === undefined) { 676 if (mainOrderAllItemKeys === undefined) {
583 setMainOrderAllItemKeys([]); 677 setMainOrderAllItemKeys([]);
@@ -603,6 +697,7 @@ const OrderPage = () =&gt; { @@ -603,6 +697,7 @@ const OrderPage = () =&gt; {
603 setOrderRow({}); 697 setOrderRow({});
604 mainTableRef.current?.reload(); 698 mainTableRef.current?.reload();
605 }} 699 }}
  700 + isAdd={isOrderAddOpt}
606 /> 701 />
607 )} 702 )}
608 703
@@ -628,6 +723,41 @@ const OrderPage = () =&gt; { @@ -628,6 +723,41 @@ const OrderPage = () =&gt; {
628 }} 723 }}
629 /> 724 />
630 )} 725 )}
  726 +
  727 + {financialVisible && (
  728 + <FinancialDrawer
  729 + mainOrder={orderRow}
  730 + subOrders={selectedRows}
  731 + onClose={() => {
  732 + setFinancialVisible(false);
  733 + setOrderRow({});
  734 + mainTableRef.current?.reload();
  735 + }}
  736 + />
  737 + )}
  738 +
  739 + {orderPrintVisible && (
  740 + <OrderPrintModal
  741 + mainOrder={orderRow}
  742 + subOrders={selectedRows}
  743 + onClose={() => {
  744 + setOrderPrintVisible(false);
  745 + setOrderRow({});
  746 + mainTableRef.current?.reload();
  747 + }}
  748 + />
  749 + )}
  750 +
  751 + {confirmReceiptVisible && (
  752 + <ConfirmReceiptModal
  753 + data={orderRow}
  754 + onClose={() => {
  755 + setConfirmReceiptVisible(false);
  756 + setOrderRow({});
  757 + mainTableRef.current?.reload();
  758 + }}
  759 + />
  760 + )}
631 </PageContainer> 761 </PageContainer>
632 ); 762 );
633 }; 763 };
src/pages/OrderPrint/OrderPrintModal.tsx 0 → 100644
  View file @3b579ac
  1 +import '@/pages/OrderPrint/index.less';
  2 +import { Modal } from 'antd';
  3 +import printJS from 'print-js';
  4 +
  5 +export default ({ mainOrder, subOrders, onClose }) => {
  6 + console.log(mainOrder);
  7 + console.log(subOrders);
  8 +
  9 + let columns = [];
  10 + for (let i = 0; i < subOrders.length; i++) {
  11 + let subOrder = subOrders[i];
  12 + columns.push(
  13 + <tr height="30" style={{ height: '15.00pt' }}>
  14 + <td height="30" style={{ height: '15.00pt' }}></td>
  15 + <td className="xl72">{i + 1}</td>
  16 + <td className="xl72">{subOrder.id}</td>
  17 + <td className="xl72">{subOrder.productName}</td>
  18 + <td className="xl72">{subOrder.parameters}</td>
  19 + <td className="xl72">{subOrder.unit}</td>
  20 + <td className="xl72">{subOrder.quantity}</td>
  21 + <td className="xl72">{subOrder.notes}</td>
  22 + </tr>,
  23 + );
  24 + }
  25 +
  26 + //补充空白行，使表格不少于六行
  27 + for (let i = subOrders.length; i < 6; i++) {
  28 + columns.push(
  29 + <tr height="30" style={{ height: '15.00pt' }}>
  30 + <td height="30" style={{ height: '15.00pt' }}></td>
  31 + <td className="xl72"></td>
  32 + <td className="xl72"></td>
  33 + <td className="xl72"></td>
  34 + <td className="xl72"></td>
  35 + <td className="xl72"></td>
  36 + <td className="xl72"></td>
  37 + <td className="xl72"></td>
  38 + </tr>,
  39 + );
  40 + }
  41 +
  42 + return (
  43 + <Modal
  44 + title="打印出货单"
  45 + centered
  46 + open
  47 + onOk={() => {
  48 + //printJS打印出货单
  49 + printJS({
  50 + printable: 'printArea', // 元素id,不支持多个
  51 + type: 'html',
  52 + targetStyle: ['* '],
  53 + targetStyles: ['*'],
  54 + style:
  55 + '@page{size:auto; margin: 0;}' +
  56 + '@media print { @page {size: landscape } }', // landscape 默认横向打印
  57 + });
  58 +
  59 + onClose();
  60 + }}
  61 + onCancel={() => onClose()}
  62 + width={1000}
  63 + >
  64 + <div
  65 + id="printArea"
  66 + className="flex items-center justify-center bg-gray-100"
  67 + >
  68 + <div className="w-full max-w-4xl p-10 my-10 bg-white border border-gray-300">
  69 + <table
  70 + className="p-10"
  71 + width="846"
  72 + border={0}
  73 + cellPadding={0}
  74 + cellSpacing={0}
  75 + style={{
  76 + width: '423.00pt',
  77 + borderCollapse: 'collapse',
  78 + tableLayout: 'fixed',
  79 + }}
  80 + >
  81 + <col
  82 + width="25.50"
  83 + style={{ msoWidthSource: 'userset', msoWidthAlt: 544 }}
  84 + />
  85 + <col
  86 + width="52.50"
  87 + style={{ msoWidthSource: 'userset', msoWidthAlt: 1120 }}
  88 + />
  89 + <col
  90 + width="115.50"
  91 + style={{ msoWidthSource: 'userset', msoWidthAlt: 2464 }}
  92 + />
  93 + <col
  94 + width="169.50"
  95 + style={{ msoWidthSource: 'userset', msoWidthAlt: 3616 }}
  96 + />
  97 + <col
  98 + width="165"
  99 + style={{ msoWidthSource: 'userset', msoWidthAlt: 3520 }}
  100 + />
  101 + <col
  102 + width="96"
  103 + style={{ msoWidthSource: 'userset', msoWidthAlt: 2048 }}
  104 + />
  105 + <col
  106 + width="114"
  107 + style={{ msoWidthSource: 'userset', msoWidthAlt: 2432 }}
  108 + />
  109 + <col width="108" style={{ width: '54.00pt' }} />
  110 + <tr height="42" style={{ height: '21.00pt' }}>
  111 + <td height="42" style={{ height: '21.00pt' }}></td>
  112 + <td
  113 + className="xl65"
  114 + colSpan="7"
  115 + style={{ borderRight: 'none', borderBottom: 'none' }}
  116 + >
  117 + 科 路 得
  118 + </td>
  119 + </tr>
  120 + <tr height="30" style={{ height: '15.00pt' }}>
  121 + <td height="30" style={{ height: '15.00pt' }}></td>
  122 + <td
  123 + className="xl66"
  124 + colSpan="7"
  125 + style={{ borderRight: 'none', borderBottom: 'none' }}
  126 + >
  127 + 网址：www.canrd.com
  128 + </td>
  129 + </tr>
  130 + <tr height="35" style={{ height: '17.50pt' }}>
  131 + <td height="35" style={{ height: '17.50pt' }}></td>
  132 + <td
  133 + className="xl67"
  134 + colSpan="7"
  135 + style={{ borderRight: 'none', borderBottom: 'none' }}
  136 + >
  137 + 销售出货单
  138 + </td>
  139 + </tr>
  140 + <tr height="30" style={{ height: '15.00pt' }}>
  141 + <td height="30" style={{ height: '15.00pt' }}></td>
  142 + <td
  143 + className="xl69"
  144 + colSpan="4"
  145 + style={{ borderRight: 'none', borderBottom: 'none' }}
  146 + >
  147 + 单位名称：{mainOrder.institution}
  148 + </td>
  149 + <td
  150 + className="xl69"
  151 + colSpan="3"
  152 + style={{ borderRight: 'none', borderBottom: 'none' }}
  153 + >
  154 + 单号：{mainOrder.id}
  155 + </td>
  156 + </tr>
  157 + <tr height="30" style={{ height: '15.00pt' }}>
  158 + <td height="30" style={{ height: '15.00pt' }}></td>
  159 + <td
  160 + className="xl69"
  161 + colSpan="4"
  162 + style={{ borderRight: 'none', borderBottom: 'none' }}
  163 + >
  164 + 联系人：{mainOrder.customerName}
  165 + </td>
  166 + <td
  167 + className="xl69"
  168 + colSpan="3"
  169 + style={{ borderRight: 'none', borderBottom: 'none' }}
  170 + >
  171 + 开单日期：{mainOrder.createTime}
  172 + </td>
  173 + </tr>
  174 + <tr height="30" style={{ height: '15.00pt' }}>
  175 + <td height="30" style={{ height: '15.00pt' }}></td>
  176 + <td
  177 + className="xl69"
  178 + colSpan="4"
  179 + style={{ borderRight: 'none', borderBottom: 'none' }}
  180 + >
  181 + 联系电话：{mainOrder.customerContactNumber}
  182 + </td>
  183 + <td
  184 + className="xl70"
  185 + colSpan={2}
  186 + style={{ msoIgnore: 'colSpan' }}
  187 + ></td>
  188 + <td className="xl70"></td>
  189 + </tr>
  190 + <tr height="30" style={{ height: '15.00pt' }}>
  191 + <td height="30" style={{ height: '15.00pt' }}></td>
  192 + <td
  193 + className="xl69"
  194 + colSpan="7"
  195 + style={{ borderRight: 'none', borderBottom: 'none' }}
  196 + >
  197 + 送货地址：{mainOrder.customerShippingAddress}
  198 + </td>
  199 + </tr>
  200 + <tr height="30" style={{ height: '15.00pt' }}>
  201 + <td height="30" style={{ height: '15.00pt' }}></td>
  202 + <td className="xl71">序号</td>
  203 + <td className="xl71">订单号</td>
  204 + <td className="xl71">货品名称</td>
  205 + <td className="xl71">规格</td>
  206 + <td className="xl71">单位</td>
  207 + <td className="xl71">数量</td>
  208 + <td className="xl71">备注</td>
  209 + </tr>
  210 +
  211 + {columns}
  212 +
  213 + <tr style={{ height: '19.00pt' }}>
  214 + <td style={{ height: '19.00pt' }}></td>
  215 + <td className="xl73">销货单位</td>
  216 + <td
  217 + className="xl74"
  218 + colSpan="3"
  219 + style={{
  220 + borderRight: '0.5pt solid windowtext',
  221 + borderBottom: '0.5pt solid windowtext',
  222 + }}
  223 + >
  224 + 发货地址：广东省东莞市厚街镇锦丰路9号科路得产业园
  225 + </td>
  226 + <td className="xl73">开户银行及账号</td>
  227 + <td
  228 + className="xl74"
  229 + colSpan={2}
  230 + style={{
  231 + borderRight: '0.5pt solid windowtext',
  232 + borderBottom: '0.5pt solid windowtext',
  233 + }}
  234 + >
  235 + 招商银行股份有限公司东莞东骏路支行
  236 + <br />
  237 + 账号：769906437110802
  238 + </td>
  239 + </tr>
  240 + <tr style={{ height: 30 }}>
  241 + <td height="30" style={{ height: '15.00pt' }}></td>
  242 + <td className="xl76" colSpan={2} style={{ msoIgnore: 'colSpan' }}>
  243 + 客户签名：
  244 + </td>
  245 + <td className="xl76">核准：屠亚辉</td>
  246 + <td
  247 + className="xl78"
  248 + colSpan={2}
  249 + style={{ borderRight: 'none', borderBottom: 'none' }}
  250 + >
  251 + 业务员：Peter
  252 + </td>
  253 + <td
  254 + className="xl78"
  255 + colSpan={2}
  256 + style={{ borderRight: 'none', borderBottom: 'none' }}
  257 + >
  258 + 开单人：张玉红
  259 + </td>
  260 + </tr>
  261 + <tr style={{ display: 'none', width: 0 }}>
  262 + <td width="26" style={{ width: 13 }}></td>
  263 + <td width="53" style={{ width: 26 }}></td>
  264 + <td width="116" style={{ width: 58 }}></td>
  265 + <td width="170" style={{ width: 85 }}></td>
  266 + <td width="165" style={{ width: 83 }}></td>
  267 + <td width="96" style={{ width: 48 }}></td>
  268 + <td width="114" style={{ width: 57 }}></td>
  269 + </tr>
  270 + </table>
  271 + </div>
  272 + </div>
  273 + </Modal>
  274 + );
  275 +};
src/pages/OrderPrint/index.less 0 → 100644
  View file @3b579ac
  1 +tr {
  2 + // mso-height-source: auto;
  3 + // mso-ruby-visibility: none;
  4 +}
  5 +
  6 +col {
  7 + // mso-width-source: auto;
  8 + // mso-ruby-visibility: none;
  9 +}
  10 +
  11 +br {
  12 + // mso-data-placement: same-cell;
  13 +}
  14 +
  15 +.font0 {
  16 + color: windowtext;
  17 + font-size: 12pt;
  18 + font-weight: 400;
  19 + font-style: normal;
  20 + text-decoration: none;
  21 + font-family: '宋体';
  22 + // //mso-generic-font-family: auto;
  23 + // //mso-font-charset: 134;
  24 +}
  25 +
  26 +.font1 {
  27 + color: windowtext;
  28 + font-size: 16pt;
  29 + font-weight: 400;
  30 + font-style: normal;
  31 + text-decoration: none;
  32 + font-family: '宋体';
  33 + // //mso-generic-font-family: auto;
  34 + // mso-font-charset: 134;
  35 +}
  36 +
  37 +.font2 {
  38 + color: windowtext;
  39 + font-size: 10pt;
  40 + font-weight: 400;
  41 + font-style: normal;
  42 + text-decoration: none;
  43 + font-family: '宋体';
  44 + ////mso-generic-font-family: auto;
  45 + //mso-font-charset: 134;
  46 +}
  47 +
  48 +.font3 {
  49 + color: windowtext;
  50 + font-size: 14pt;
  51 + font-weight: 400;
  52 + font-style: normal;
  53 + text-decoration: none;
  54 + font-family: '宋体';
  55 + ////mso-generic-font-family: auto;
  56 + //mso-font-charset: 134;
  57 +}
  58 +
  59 +.font4 {
  60 + color: windowtext;
  61 + font-size: 8pt;
  62 + font-weight: 400;
  63 + font-style: normal;
  64 + text-decoration: none;
  65 + font-family: '宋体';
  66 + ////mso-generic-font-family: auto;
  67 + //mso-font-charset: 134;
  68 +}
  69 +
  70 +.font5 {
  71 + color: #00f;
  72 + font-size: 11pt;
  73 + font-weight: 400;
  74 + font-style: normal;
  75 + text-decoration: underline;
  76 + //text-underline-style: single;
  77 + font-family: '宋体';
  78 + ////mso-generic-font-family: auto;
  79 + //mso-font-charset: 134;
  80 +}
  81 +
  82 +.font6 {
  83 + color: #800080;
  84 + font-size: 11pt;
  85 + font-weight: 400;
  86 + font-style: normal;
  87 + text-decoration: underline;
  88 + //text-underline-style: single;
  89 + font-family: '宋体';
  90 + ////mso-generic-font-family: auto;
  91 + //mso-font-charset: 134;
  92 +}
  93 +
  94 +.font7 {
  95 + color: #000;
  96 + font-size: 11pt;
  97 + font-weight: 400;
  98 + font-style: normal;
  99 + text-decoration: none;
  100 + font-family: '宋体';
  101 + ////mso-generic-font-family: auto;
  102 + //mso-font-charset: 134;
  103 +}
  104 +
  105 +.font8 {
  106 + color: #f00;
  107 + font-size: 11pt;
  108 + font-weight: 400;
  109 + font-style: normal;
  110 + text-decoration: none;
  111 + font-family: '宋体';
  112 + ////mso-generic-font-family: auto;
  113 + //mso-font-charset: 134;
  114 +}
  115 +
  116 +.font9 {
  117 + color: #44546a;
  118 + font-size: 18pt;
  119 + font-weight: 700;
  120 + font-style: normal;
  121 + text-decoration: none;
  122 + font-family: '宋体';
  123 + ////mso-generic-font-family: auto;
  124 + //mso-font-charset: 134;
  125 +}
  126 +
  127 +.font10 {
  128 + color: #7f7f7f;
  129 + font-size: 11pt;
  130 + font-weight: 400;
  131 + font-style: italic;
  132 + text-decoration: none;
  133 + font-family: '宋体';
  134 + ////mso-generic-font-family: auto;
  135 + //mso-font-charset: 134;
  136 +}
  137 +
  138 +.font11 {
  139 + color: #44546a;
  140 + font-size: 15pt;
  141 + font-weight: 700;
  142 + font-style: normal;
  143 + text-decoration: none;
  144 + font-family: '宋体';
  145 + ////mso-generic-font-family: auto;
  146 + //mso-font-charset: 134;
  147 +}
  148 +
  149 +.font12 {
  150 + color: #44546a;
  151 + font-size: 13pt;
  152 + font-weight: 700;
  153 + font-style: normal;
  154 + text-decoration: none;
  155 + font-family: '宋体';
  156 + ////mso-generic-font-family: auto;
  157 + //mso-font-charset: 134;
  158 +}
  159 +
  160 +.font13 {
  161 + color: #44546a;
  162 + font-size: 11pt;
  163 + font-weight: 700;
  164 + font-style: normal;
  165 + text-decoration: none;
  166 + font-family: '宋体';
  167 + ////mso-generic-font-family: auto;
  168 + //mso-font-charset: 134;
  169 +}
  170 +
  171 +.font14 {
  172 + color: #3f3f76;
  173 + font-size: 11pt;
  174 + font-weight: 400;
  175 + font-style: normal;
  176 + text-decoration: none;
  177 + font-family: '宋体';
  178 + ////mso-generic-font-family: auto;
  179 + //mso-font-charset: 134;
  180 +}
  181 +
  182 +.font15 {
  183 + color: #3f3f3f;
  184 + font-size: 11pt;
  185 + font-weight: 700;
  186 + font-style: normal;
  187 + text-decoration: none;
  188 + font-family: '宋体';
  189 + ////mso-generic-font-family: auto;
  190 + //mso-font-charset: 134;
  191 +}
  192 +
  193 +.font16 {
  194 + color: #fa7d00;
  195 + font-size: 11pt;
  196 + font-weight: 700;
  197 + font-style: normal;
  198 + text-decoration: none;
  199 + font-family: '宋体';
  200 + ////mso-generic-font-family: auto;
  201 + //mso-font-charset: 134;
  202 +}
  203 +
  204 +.font17 {
  205 + color: #fff;
  206 + font-size: 11pt;
  207 + font-weight: 700;
  208 + font-style: normal;
  209 + text-decoration: none;
  210 + font-family: '宋体';
  211 + ////mso-generic-font-family: auto;
  212 + //mso-font-charset: 134;
  213 +}
  214 +
  215 +.font18 {
  216 + color: #fa7d00;
  217 + font-size: 11pt;
  218 + font-weight: 400;
  219 + font-style: normal;
  220 + text-decoration: none;
  221 + font-family: '宋体';
  222 + ////mso-generic-font-family: auto;
  223 + //mso-font-charset: 134;
  224 +}
  225 +
  226 +.font19 {
  227 + color: #000;
  228 + font-size: 11pt;
  229 + font-weight: 700;
  230 + font-style: normal;
  231 + text-decoration: none;
  232 + font-family: '宋体';
  233 + ////mso-generic-font-family: auto;
  234 + //mso-font-charset: 134;
  235 +}
  236 +
  237 +.font20 {
  238 + color: #006100;
  239 + font-size: 11pt;
  240 + font-weight: 400;
  241 + font-style: normal;
  242 + text-decoration: none;
  243 + font-family: '宋体';
  244 + ////mso-generic-font-family: auto;
  245 + //mso-font-charset: 134;
  246 +}
  247 +
  248 +.font21 {
  249 + color: #9c0006;
  250 + font-size: 11pt;
  251 + font-weight: 400;
  252 + font-style: normal;
  253 + text-decoration: none;
  254 + font-family: '宋体';
  255 + ////mso-generic-font-family: auto;
  256 + //mso-font-charset: 134;
  257 +}
  258 +
  259 +.font22 {
  260 + color: #9c6500;
  261 + font-size: 11pt;
  262 + font-weight: 400;
  263 + font-style: normal;
  264 + text-decoration: none;
  265 + font-family: '宋体';
  266 + ////mso-generic-font-family: auto;
  267 + //mso-font-charset: 134;
  268 +}
  269 +
  270 +.font23 {
  271 + color: #fff;
  272 + font-size: 11pt;
  273 + font-weight: 400;
  274 + font-style: normal;
  275 + text-decoration: none;
  276 + font-family: '宋体';
  277 + ////mso-generic-font-family: auto;
  278 + //mso-font-charset: 134;
  279 +}
  280 +
  281 +.font24 {
  282 + color: #000;
  283 + font-size: 11pt;
  284 + font-weight: 400;
  285 + font-style: normal;
  286 + text-decoration: none;
  287 + font-family: '宋体';
  288 + ////mso-generic-font-family: auto;
  289 + //mso-font-charset: 134;
  290 +}
  291 +
  292 +.style0 {
  293 + //mso-number-format: "General";
  294 + text-align: general;
  295 + vertical-align: middle;
  296 + white-space: nowrap;
  297 + // mso-rotate: 0;
  298 + // //mso-pattern: auto;
  299 + // mso-background-source: auto;
  300 + color: windowtext;
  301 + font-size: 12pt;
  302 + font-weight: 400;
  303 + font-style: normal;
  304 + text-decoration: none;
  305 + font-family: '宋体';
  306 + ////mso-generic-font-family: auto;
  307 + //mso-font-charset: 134;
  308 + border: none;
  309 + //mso-protection: locked visible;
  310 + // mso-style-name: "常规";
  311 + // mso-style-id: 0;
  312 +}
  313 +
  314 +.style16 {
  315 + // mso-number-format: "_ * \#\,\#\#0\.00_ \;_ * \\-\#\,\#\#0\.00_ \;_ * \0022-\0022??_ \;_ \@_ ";
  316 + // mso-style-name: "千位分隔";
  317 + // mso-style-id: 3;
  318 +}
  319 +
  320 +.style17 {
  321 + // mso-number-format: "_ \0022\00A5\0022* \#\,\#\#0\.00_ \;_ \0022\00A5\0022* \\-\#\,\#\#0\.00_ \;_ \0022\00A5\0022* \0022-\0022??_ \;_ \@_ ";
  322 + // mso-style-name: "货币";
  323 + // mso-style-id: 4;
  324 +}
  325 +
  326 +.style18 {
  327 + // mso-number-format: "0%";
  328 + // mso-style-name: "百分比";
  329 + // mso-style-id: 5;
  330 +}
  331 +
  332 +.style19 {
  333 + // mso-number-format: "_ * \#\,\#\#0_ \;_ * \\-\#\,\#\#0_ \;_ * \0022-\0022_ \;_ \@_ ";
  334 + // mso-style-name: "千位分隔[0]";
  335 + // mso-style-id: 6;
  336 +}
  337 +
  338 +.style20 {
  339 + // mso-number-format: "_ \0022\00A5\0022* \#\,\#\#0_ \;_ \0022\00A5\0022* \\-\#\,\#\#0_ \;_ \0022\00A5\0022* \0022-\0022_ \;_ \@_ ";
  340 + // mso-style-name: "货币[0]";
  341 + // mso-style-id: 7;
  342 +}
  343 +
  344 +.style21 {
  345 + color: #00f;
  346 + font-size: 11pt;
  347 + font-weight: 400;
  348 + font-style: normal;
  349 + text-decoration: underline;
  350 + //text-underline-style: single;
  351 + font-family: '宋体';
  352 + ////mso-generic-font-family: auto;
  353 + //mso-font-charset: 134;
  354 + // mso-style-name: "超链接";
  355 + // mso-style-id: 8;
  356 +}
  357 +
  358 +.style22 {
  359 + color: #800080;
  360 + font-size: 11pt;
  361 + font-weight: 400;
  362 + font-style: normal;
  363 + text-decoration: underline;
  364 + //text-underline-style: single;
  365 + font-family: '宋体';
  366 + ////mso-generic-font-family: auto;
  367 + //mso-font-charset: 134;
  368 + // mso-style-name: "已访问的超链接";
  369 + // mso-style-id: 9;
  370 +}
  371 +
  372 +.style23 {
  373 + // //mso-pattern: auto none;
  374 + background: #ffc;
  375 + border: 0.5pt solid #b2b2b2;
  376 + // mso-style-name: "注释";
  377 +}
  378 +
  379 +.style24 {
  380 + color: #f00;
  381 + font-size: 11pt;
  382 + font-weight: 400;
  383 + font-style: normal;
  384 + text-decoration: none;
  385 + font-family: '宋体';
  386 + ////mso-generic-font-family: auto;
  387 + //mso-font-charset: 134;
  388 + // mso-style-name: "警告文本";
  389 +}
  390 +
  391 +.style25 {
  392 + color: #44546a;
  393 + font-size: 18pt;
  394 + font-weight: 700;
  395 + font-style: normal;
  396 + text-decoration: none;
  397 + font-family: '宋体';
  398 + ////mso-generic-font-family: auto;
  399 + //mso-font-charset: 134;
  400 + // mso-style-name: "标题";
  401 +}
  402 +
  403 +.style26 {
  404 + color: #7f7f7f;
  405 + font-size: 11pt;
  406 + font-weight: 400;
  407 + font-style: italic;
  408 + text-decoration: none;
  409 + font-family: '宋体';
  410 + ////mso-generic-font-family: auto;
  411 + //mso-font-charset: 134;
  412 + // mso-style-name: "解释性文本";
  413 +}
  414 +
  415 +.style27 {
  416 + color: #44546a;
  417 + font-size: 15pt;
  418 + font-weight: 700;
  419 + font-style: normal;
  420 + text-decoration: none;
  421 + font-family: '宋体';
  422 + ////mso-generic-font-family: auto;
  423 + //mso-font-charset: 134;
  424 + border-bottom: 1pt solid #5b9bd5;
  425 + // mso-style-name: "标题 1";
  426 +}
  427 +
  428 +.style28 {
  429 + color: #44546a;
  430 + font-size: 13pt;
  431 + font-weight: 700;
  432 + font-style: normal;
  433 + text-decoration: none;
  434 + font-family: '宋体';
  435 + ////mso-generic-font-family: auto;
  436 + //mso-font-charset: 134;
  437 + border-bottom: 1pt solid #5b9bd5;
  438 + // mso-style-name: "标题 2";
  439 +}
  440 +
  441 +.style29 {
  442 + color: #44546a;
  443 + font-size: 11pt;
  444 + font-weight: 700;
  445 + font-style: normal;
  446 + text-decoration: none;
  447 + font-family: '宋体';
  448 + ////mso-generic-font-family: auto;
  449 + //mso-font-charset: 134;
  450 + border-bottom: 1pt solid #acccea;
  451 + //mso-style-name: "标题 3";
  452 +}
  453 +
  454 +.style30 {
  455 + color: #44546a;
  456 + font-size: 11pt;
  457 + font-weight: 700;
  458 + font-style: normal;
  459 + text-decoration: none;
  460 + font-family: '宋体';
  461 + ////mso-generic-font-family: auto;
  462 + //mso-font-charset: 134;
  463 + //mso-style-name: "标题 4";
  464 +}
  465 +
  466 +.style31 {
  467 + ////mso-pattern: auto none;
  468 + background: #fc9;
  469 + color: #3f3f76;
  470 + font-size: 11pt;
  471 + font-weight: 400;
  472 + font-style: normal;
  473 + text-decoration: none;
  474 + font-family: '宋体';
  475 + ////mso-generic-font-family: auto;
  476 + //mso-font-charset: 134;
  477 + border: 0.5pt solid #7f7f7f;
  478 + //mso-style-name: "输入";
  479 +}
  480 +
  481 +.style32 {
  482 + ////mso-pattern: auto none;
  483 + background: #f2f2f2;
  484 + color: #3f3f3f;
  485 + font-size: 11pt;
  486 + font-weight: 700;
  487 + font-style: normal;
  488 + text-decoration: none;
  489 + font-family: '宋体';
  490 + ////mso-generic-font-family: auto;
  491 + //mso-font-charset: 134;
  492 + border: 0.5pt solid #3f3f3f;
  493 + //mso-style-name: "输出";
  494 +}
  495 +
  496 +.style33 {
  497 + ////mso-pattern: auto none;
  498 + background: #f2f2f2;
  499 + color: #fa7d00;
  500 + font-size: 11pt;
  501 + font-weight: 700;
  502 + font-style: normal;
  503 + text-decoration: none;
  504 + font-family: '宋体';
  505 + ////mso-generic-font-family: auto;
  506 + //mso-font-charset: 134;
  507 + border: 0.5pt solid #7f7f7f;
  508 + //mso-style-name: "计算";
  509 +}
  510 +
  511 +.style34 {
  512 + ////mso-pattern: auto none;
  513 + background: #a5a5a5;
  514 + color: #fff;
  515 + font-size: 11pt;
  516 + font-weight: 700;
  517 + font-style: normal;
  518 + text-decoration: none;
  519 + font-family: '宋体';
  520 + ////mso-generic-font-family: auto;
  521 + //mso-font-charset: 134;
  522 + border: 2pt double #3f3f3f;
  523 + //mso-style-name: "检查单元格";
  524 +}
  525 +
  526 +.style35 {
  527 + color: #fa7d00;
  528 + font-size: 11pt;
  529 + font-weight: 400;
  530 + font-style: normal;
  531 + text-decoration: none;
  532 + font-family: '宋体';
  533 + ////mso-generic-font-family: auto;
  534 + //mso-font-charset: 134;
  535 + border-bottom: 2pt double #ff8001;
  536 + //mso-style-name: "链接单元格";
  537 +}
  538 +
  539 +.style36 {
  540 + color: #000;
  541 + font-size: 11pt;
  542 + font-weight: 700;
  543 + font-style: normal;
  544 + text-decoration: none;
  545 + font-family: '宋体';
  546 + ////mso-generic-font-family: auto;
  547 + //mso-font-charset: 134;
  548 + border-top: 0.5pt solid #5b9bd5;
  549 + border-bottom: 2pt double #5b9bd5;
  550 + //mso-style-name: "汇总";
  551 +}
  552 +
  553 +.style37 {
  554 + ////mso-pattern: auto none;
  555 + background: #c6efce;
  556 + color: #006100;
  557 + font-size: 11pt;
  558 + font-weight: 400;
  559 + font-style: normal;
  560 + text-decoration: none;
  561 + font-family: '宋体';
  562 + ////mso-generic-font-family: auto;
  563 + //mso-font-charset: 134;
  564 + //mso-style-name: "好";
  565 +}
  566 +
  567 +.style38 {
  568 + ////mso-pattern: auto none;
  569 + background: #ffc7ce;
  570 + color: #9c0006;
  571 + font-size: 11pt;
  572 + font-weight: 400;
  573 + font-style: normal;
  574 + text-decoration: none;
  575 + font-family: '宋体';
  576 + ////mso-generic-font-family: auto;
  577 + //mso-font-charset: 134;
  578 + //mso-style-name: "差";
  579 +}
  580 +
  581 +.style39 {
  582 + ////mso-pattern: auto none;
  583 + background: #ffeb9c;
  584 + color: #9c6500;
  585 + font-size: 11pt;
  586 + font-weight: 400;
  587 + font-style: normal;
  588 + text-decoration: none;
  589 + font-family: '宋体';
  590 + ////mso-generic-font-family: auto;
  591 + //mso-font-charset: 134;
  592 + //mso-style-name: "适中";
  593 +}
  594 +
  595 +.style40 {
  596 + ////mso-pattern: auto none;
  597 + background: #5b9bd5;
  598 + color: #fff;
  599 + font-size: 11pt;
  600 + font-weight: 400;
  601 + font-style: normal;
  602 + text-decoration: none;
  603 + font-family: '宋体';
  604 + ////mso-generic-font-family: auto;
  605 + //mso-font-charset: 134;
  606 + //mso-style-name: "强调文字颜色 1";
  607 +}
  608 +
  609 +.style41 {
  610 + ////mso-pattern: auto none;
  611 + background: #ddebf7;
  612 + color: #000;
  613 + font-size: 11pt;
  614 + font-weight: 400;
  615 + font-style: normal;
  616 + text-decoration: none;
  617 + font-family: '宋体';
  618 + ////mso-generic-font-family: auto;
  619 + //mso-font-charset: 134;
  620 + //mso-style-name: "20% - 强调文字颜色 1";
  621 +}
  622 +
  623 +.style42 {
  624 + ////mso-pattern: auto none;
  625 + background: #bdd7ee;
  626 + color: #000;
  627 + font-size: 11pt;
  628 + font-weight: 400;
  629 + font-style: normal;
  630 + text-decoration: none;
  631 + font-family: '宋体';
  632 + ////mso-generic-font-family: auto;
  633 + //mso-font-charset: 134;
  634 + //mso-style-name: "40% - 强调文字颜色 1";
  635 +}
  636 +
  637 +.style43 {
  638 + ////mso-pattern: auto none;
  639 + background: #9bc2e6;
  640 + color: #fff;
  641 + font-size: 11pt;
  642 + font-weight: 400;
  643 + font-style: normal;
  644 + text-decoration: none;
  645 + font-family: '宋体';
  646 + ////mso-generic-font-family: auto;
  647 + //mso-font-charset: 134;
  648 + //mso-style-name: "60% - 强调文字颜色 1";
  649 +}
  650 +
  651 +.style44 {
  652 + ////mso-pattern: auto none;
  653 + background: #ed7d31;
  654 + color: #fff;
  655 + font-size: 11pt;
  656 + font-weight: 400;
  657 + font-style: normal;
  658 + text-decoration: none;
  659 + font-family: '宋体';
  660 + ////mso-generic-font-family: auto;
  661 + //mso-font-charset: 134;
  662 + //mso-style-name: "强调文字颜色 2";
  663 +}
  664 +
  665 +.style45 {
  666 + ////mso-pattern: auto none;
  667 + background: #fce4d6;
  668 + color: #000;
  669 + font-size: 11pt;
  670 + font-weight: 400;
  671 + font-style: normal;
  672 + text-decoration: none;
  673 + font-family: '宋体';
  674 + ////mso-generic-font-family: auto;
  675 + //mso-font-charset: 134;
  676 + //mso-style-name: "20% - 强调文字颜色 2";
  677 +}
  678 +
  679 +.style46 {
  680 + ////mso-pattern: auto none;
  681 + background: #f8cbad;
  682 + color: #000;
  683 + font-size: 11pt;
  684 + font-weight: 400;
  685 + font-style: normal;
  686 + text-decoration: none;
  687 + font-family: '宋体';
  688 + ////mso-generic-font-family: auto;
  689 + //mso-font-charset: 134;
  690 + //mso-style-name: "40% - 强调文字颜色 2";
  691 +}
  692 +
  693 +.style47 {
  694 + ////mso-pattern: auto none;
  695 + background: #f4b084;
  696 + color: #fff;
  697 + font-size: 11pt;
  698 + font-weight: 400;
  699 + font-style: normal;
  700 + text-decoration: none;
  701 + font-family: '宋体';
  702 + ////mso-generic-font-family: auto;
  703 + //mso-font-charset: 134;
  704 + //mso-style-name: "60% - 强调文字颜色 2";
  705 +}
  706 +
  707 +.style48 {
  708 + //mso-pattern: auto none;
  709 + background: #a5a5a5;
  710 + color: #fff;
  711 + font-size: 11pt;
  712 + font-weight: 400;
  713 + font-style: normal;
  714 + text-decoration: none;
  715 + font-family: '宋体';
  716 + ////mso-generic-font-family: auto;
  717 + //mso-font-charset: 134;
  718 + //mso-style-name: "强调文字颜色 3";
  719 +}
  720 +
  721 +.style49 {
  722 + //mso-pattern: auto none;
  723 + background: #ededed;
  724 + color: #000;
  725 + font-size: 11pt;
  726 + font-weight: 400;
  727 + font-style: normal;
  728 + text-decoration: none;
  729 + font-family: '宋体';
  730 + ////mso-generic-font-family: auto;
  731 + //mso-font-charset: 134;
  732 + //mso-style-name: "20% - 强调文字颜色 3";
  733 +}
  734 +
  735 +.style50 {
  736 + //mso-pattern: auto none;
  737 + background: #dbdbdb;
  738 + color: #000;
  739 + font-size: 11pt;
  740 + font-weight: 400;
  741 + font-style: normal;
  742 + text-decoration: none;
  743 + font-family: '宋体';
  744 + ////mso-generic-font-family: auto;
  745 + //mso-font-charset: 134;
  746 + //mso-style-name: "40% - 强调文字颜色 3";
  747 +}
  748 +
  749 +.style51 {
  750 + //mso-pattern: auto none;
  751 + background: #c9c9c9;
  752 + color: #fff;
  753 + font-size: 11pt;
  754 + font-weight: 400;
  755 + font-style: normal;
  756 + text-decoration: none;
  757 + font-family: '宋体';
  758 + ////mso-generic-font-family: auto;
  759 + //mso-font-charset: 134;
  760 + //mso-style-name: "60% - 强调文字颜色 3";
  761 +}
  762 +
  763 +.style52 {
  764 + //mso-pattern: auto none;
  765 + background: #ffc000;
  766 + color: #fff;
  767 + font-size: 11pt;
  768 + font-weight: 400;
  769 + font-style: normal;
  770 + text-decoration: none;
  771 + font-family: '宋体';
  772 + ////mso-generic-font-family: auto;
  773 + //mso-font-charset: 134;
  774 + //mso-style-name: "强调文字颜色 4";
  775 +}
  776 +
  777 +.style53 {
  778 + //mso-pattern: auto none;
  779 + background: #fff2cc;
  780 + color: #000;
  781 + font-size: 11pt;
  782 + font-weight: 400;
  783 + font-style: normal;
  784 + text-decoration: none;
  785 + font-family: '宋体';
  786 + ////mso-generic-font-family: auto;
  787 + //mso-font-charset: 134;
  788 + //mso-style-name: "20% - 强调文字颜色 4";
  789 +}
  790 +
  791 +.style54 {
  792 + //mso-pattern: auto none;
  793 + background: #ffe699;
  794 + color: #000;
  795 + font-size: 11pt;
  796 + font-weight: 400;
  797 + font-style: normal;
  798 + text-decoration: none;
  799 + font-family: '宋体';
  800 + ////mso-generic-font-family: auto;
  801 + //mso-font-charset: 134;
  802 + //mso-style-name: "40% - 强调文字颜色 4";
  803 +}
  804 +
  805 +.style55 {
  806 + //mso-pattern: auto none;
  807 + background: #ffd966;
  808 + color: #fff;
  809 + font-size: 11pt;
  810 + font-weight: 400;
  811 + font-style: normal;
  812 + text-decoration: none;
  813 + font-family: '宋体';
  814 + ////mso-generic-font-family: auto;
  815 + //mso-font-charset: 134;
  816 + //mso-style-name: "60% - 强调文字颜色 4";
  817 +}
  818 +
  819 +.style56 {
  820 + //mso-pattern: auto none;
  821 + background: #4472c4;
  822 + color: #fff;
  823 + font-size: 11pt;
  824 + font-weight: 400;
  825 + font-style: normal;
  826 + text-decoration: none;
  827 + font-family: '宋体';
  828 + ////mso-generic-font-family: auto;
  829 + //mso-font-charset: 134;
  830 + //mso-style-name: "强调文字颜色 5";
  831 +}
  832 +
  833 +.style57 {
  834 + //mso-pattern: auto none;
  835 + background: #d9e1f2;
  836 + color: #000;
  837 + font-size: 11pt;
  838 + font-weight: 400;
  839 + font-style: normal;
  840 + text-decoration: none;
  841 + font-family: '宋体';
  842 + ////mso-generic-font-family: auto;
  843 + //mso-font-charset: 134;
  844 + //mso-style-name: "20% - 强调文字颜色 5";
  845 +}
  846 +
  847 +.style58 {
  848 + //mso-pattern: auto none;
  849 + background: #b4c6e7;
  850 + color: #000;
  851 + font-size: 11pt;
  852 + font-weight: 400;
  853 + font-style: normal;
  854 + text-decoration: none;
  855 + font-family: '宋体';
  856 + ////mso-generic-font-family: auto;
  857 + //mso-font-charset: 134;
  858 + //mso-style-name: "40% - 强调文字颜色 5";
  859 +}
  860 +
  861 +.style59 {
  862 + //mso-pattern: auto none;
  863 + background: #8ea9db;
  864 + color: #fff;
  865 + font-size: 11pt;
  866 + font-weight: 400;
  867 + font-style: normal;
  868 + text-decoration: none;
  869 + font-family: '宋体';
  870 + ////mso-generic-font-family: auto;
  871 + //mso-font-charset: 134;
  872 + //mso-style-name: "60% - 强调文字颜色 5";
  873 +}
  874 +
  875 +.style60 {
  876 + //mso-pattern: auto none;
  877 + background: #70ad47;
  878 + color: #fff;
  879 + font-size: 11pt;
  880 + font-weight: 400;
  881 + font-style: normal;
  882 + text-decoration: none;
  883 + font-family: '宋体';
  884 + ////mso-generic-font-family: auto;
  885 + //mso-font-charset: 134;
  886 + //mso-style-name: "强调文字颜色 6";
  887 +}
  888 +
  889 +.style61 {
  890 + //mso-pattern: auto none;
  891 + background: #e2efda;
  892 + color: #000;
  893 + font-size: 11pt;
  894 + font-weight: 400;
  895 + font-style: normal;
  896 + text-decoration: none;
  897 + font-family: '宋体';
  898 + ////mso-generic-font-family: auto;
  899 + //mso-font-charset: 134;
  900 + //mso-style-name: "20% - 强调文字颜色 6";
  901 +}
  902 +
  903 +.style62 {
  904 + //mso-pattern: auto none;
  905 + background: #c6e0b4;
  906 + color: #000;
  907 + font-size: 11pt;
  908 + font-weight: 400;
  909 + font-style: normal;
  910 + text-decoration: none;
  911 + font-family: '宋体';
  912 + ////mso-generic-font-family: auto;
  913 + //mso-font-charset: 134;
  914 + //mso-style-name: "40% - 强调文字颜色 6";
  915 +}
  916 +
  917 +.style63 {
  918 + //mso-pattern: auto none;
  919 + background: #a9d08e;
  920 + color: #fff;
  921 + font-size: 11pt;
  922 + font-weight: 400;
  923 + font-style: normal;
  924 + text-decoration: none;
  925 + font-family: '宋体';
  926 + ////mso-generic-font-family: auto;
  927 + ////mso-font-charset: 134;
  928 + //mso-style-name: "60% - 强调文字颜色 6";
  929 +}
  930 +
  931 +td {
  932 + //mso-style-parent: style0;
  933 + padding-top: 1px;
  934 + padding-right: 1px;
  935 + padding-left: 1px;
  936 + // mso-ignore: padding;
  937 + //mso-number-format: "General";
  938 + text-align: general;
  939 + vertical-align: middle;
  940 + white-space: nowrap;
  941 + // mso-rotate: 0;
  942 + //mso-pattern: auto;
  943 + // mso-background-source: auto;
  944 + color: windowtext;
  945 + font-size: 12pt;
  946 + font-weight: 400;
  947 + font-style: normal;
  948 + text-decoration: none;
  949 + font-family: '宋体';
  950 + //mso-generic-font-family: auto;
  951 + ////mso-font-charset: 134;
  952 + border: none;
  953 + //mso-protection: locked visible;
  954 +}
  955 +
  956 +.xl65 {
  957 + //mso-style-parent: style0;
  958 + text-align: center;
  959 + font-size: 16pt;
  960 + ////mso-font-charset: 134;
  961 +}
  962 +
  963 +.xl66 {
  964 + //mso-style-parent: style0;
  965 + text-align: center;
  966 + font-size: 10pt;
  967 + ////mso-font-charset: 134;
  968 +}
  969 +
  970 +.xl67 {
  971 + //mso-style-parent: style0;
  972 + text-align: center;
  973 + font-size: 14pt;
  974 + //mso-font-charset: 134;
  975 +}
  976 +
  977 +.xl68 {
  978 + //mso-style-parent: style0;
  979 + text-align: center;
  980 + font-size: 14pt;
  981 + //mso-font-charset: 134;
  982 +}
  983 +
  984 +.xl69 {
  985 + //mso-style-parent: style0;
  986 + text-align: left;
  987 + font-size: 8pt;
  988 + //mso-font-charset: 134;
  989 +}
  990 +
  991 +.xl70 {
  992 + //mso-style-parent: style0;
  993 + text-align: left;
  994 + font-size: 8pt;
  995 + //mso-font-charset: 134;
  996 +}
  997 +
  998 +.xl71 {
  999 + //mso-style-parent: style0;
  1000 + text-align: center;
  1001 + font-size: 8pt;
  1002 + //mso-font-charset: 134;
  1003 + border: 0.5pt solid windowtext;
  1004 +}
  1005 +
  1006 +.xl72 {
  1007 + //mso-style-parent: style0;
  1008 + text-align: center;
  1009 + font-size: 8pt;
  1010 + //mso-font-charset: 134;
  1011 + border: 0.5pt solid windowtext;
  1012 +}
  1013 +
  1014 +.xl73 {
  1015 + //mso-style-parent: style0;
  1016 + white-space: normal;
  1017 + font-size: 8pt;
  1018 + //mso-font-charset: 134;
  1019 + border: 0.5pt solid windowtext;
  1020 +}
  1021 +
  1022 +.xl74 {
  1023 + //mso-style-parent: style0;
  1024 + text-align: center;
  1025 + white-space: normal;
  1026 + font-size: 8pt;
  1027 + //mso-font-charset: 134;
  1028 + border: 0.5pt solid windowtext;
  1029 +}
  1030 +
  1031 +.xl75 {
  1032 + //mso-style-parent: style0;
  1033 + text-align: center;
  1034 + white-space: normal;
  1035 + font-size: 8pt;
  1036 + //mso-font-charset: 134;
  1037 + border: 0.5pt solid windowtext;
  1038 +}
  1039 +
  1040 +.xl76 {
  1041 + //mso-style-parent: style0;
  1042 + font-size: 8pt;
  1043 + //mso-font-charset: 134;
  1044 +}
  1045 +
  1046 +.xl77 {
  1047 + //mso-style-parent: style0;
  1048 + font-size: 8pt;
  1049 + //mso-font-charset: 134;
  1050 +}
  1051 +
  1052 +.xl78 {
  1053 + //mso-style-parent: style0;
  1054 + text-align: center;
  1055 + font-size: 8pt;
  1056 + //mso-font-charset: 134;
  1057 +}
src/pages/OrderPrint/index.tsx
  View file @3b579ac
1 // App.js 1 // App.js
  2 +import '@/pages/OrderPrint/index.less';
  3 +// function Header() {
  4 +// return (
  5 +// <div className="flex items-start justify-between mb-6">
  6 +// <div className="text-sm">
  7 +// <p className="font-medium">网址: www.canrd.com</p>
  8 +// </div>
  9 +// <h1 className="text-3xl font-bold text-center">发票</h1>
  10 +// <div className="text-sm text-right">
  11 +// <p className="font-medium">QQ: 2902385824</p>
  12 +// </div>
  13 +// </div>
  14 +// );
  15 +// }
2 16
3 -function Header() {  
4 - return (  
5 - <div className="flex items-start justify-between mb-6">  
6 - <div className="text-sm">  
7 - <p className="font-medium">网址: www.canrd.com</p>  
8 - </div>  
9 - <h1 className="text-3xl font-bold text-center">发票</h1>  
10 - <div className="text-sm text-right">  
11 - <p className="font-medium">QQ: 2902385824</p>  
12 - </div>  
13 - </div>  
14 - );  
15 -} 17 +// function InvoiceDetails() {
  18 +// return (
  19 +// <div className="grid grid-cols-2 gap-4 mb-6 text-sm">
  20 +// <div>
  21 +// <p>单位名称: 某某科技有限公司</p>
  22 +// <p>联系人: 张三</p>
  23 +// <p>联系电话: 18583817221</p>
  24 +// <p>送货地址: 广东省东莞市</p>
  25 +// </div>
  26 +// <div className="text-right">
  27 +// <p>编号: Canrd-DZ-2023-1101-004</p>
  28 +// <p>开票日期: 2023年11月1日</p>
  29 +// </div>
  30 +// </div>
  31 +// );
  32 +// }
16 33
17 -function InvoiceDetails() {  
18 - return (  
19 - <div className="grid grid-cols-2 gap-4 mb-6 text-sm">  
20 - <div>  
21 - <p>单位名称: 某某科技有限公司</p>  
22 - <p>联系人: 张三</p>  
23 - <p>联系电话: 18583817221</p>  
24 - <p>送货地址: 广东省东莞市</p>  
25 - </div>  
26 - <div className="text-right">  
27 - <p>编号: Canrd-DZ-2023-1101-004</p>  
28 - <p>开票日期: 2023年11月1日</p>  
29 - </div>  
30 - </div>  
31 - );  
32 -} 34 +// function ProductsTable() {
  35 +// return (
  36 +// <div className="mb-6">
  37 +// <table className="w-full text-sm border border-gray-300 table-fixed">
  38 +// <thead>
  39 +// <tr className="">
  40 +// <th className="w-1/4 p-2 border border-gray-300 border-solid">
  41 +// 序号
  42 +// </th>
  43 +// <th className="w-1/6 p-2 border border-gray-300 border-solid">
  44 +// 订单号
  45 +// </th>
  46 +// <th className="w-1/6 p-2 border border-gray-300 border-solid">
  47 +// 货品名称
  48 +// </th>
  49 +// <th className="w-1/12 p-2 border border-gray-300 border-solid">
  50 +// 规格
  51 +// </th>
  52 +// <th className="w-1/6 p-2 border border-gray-300 border-solid">
  53 +// 单位
  54 +// </th>
  55 +// <th className="w-1/6 p-2 border border-gray-300 border-solid">
  56 +// 数量
  57 +// </th>
  58 +// <th className="w-1/4 p-2 border border-gray-300 border-solid">
  59 +// 备注
  60 +// </th>
  61 +// </tr>
  62 +// </thead>
  63 +// <tbody>
  64 +// <tr>
  65 +// <td className="p-2 whitespace-normal border border-gray-300 border-solid">
  66 +// 产品名称可能非常长，所以这里会自动换行
  67 +// </td>
  68 +// <td className="p-2 border border-gray-300 border-solid">
  69 +// 规格型号
  70 +// </td>
  71 +// <td className="p-2 border border-gray-300 border-solid">单位</td>
  72 +// <td className="p-2 border border-gray-300 border-solid">1</td>
  73 +// <td className="p-2 border border-gray-300 border-solid">400</td>
  74 +// <td className="p-2 border border-gray-300 border-solid">400</td>
  75 +// <td className="p-2 whitespace-normal border border-gray-300 border-solid">
  76 +// 备注信息可能也会很长，需要自动换行来适应内容
  77 +// </td>
  78 +// </tr>
  79 +// {/* 其他行 */}
  80 +// </tbody>
  81 +// </table>
  82 +// </div>
  83 +// );
  84 +// }
33 85
34 -function ProductsTable() {  
35 - return (  
36 - <div className="mb-6">  
37 - <table className="w-full text-sm border border-gray-300 table-fixed">  
38 - <thead>  
39 - <tr className="">  
40 - <th className="w-1/4 p-2 border border-gray-300 border-solid">  
41 - 序号  
42 - </th>  
43 - <th className="w-1/6 p-2 border border-gray-300 border-solid">  
44 - 订单号  
45 - </th>  
46 - <th className="w-1/6 p-2 border border-gray-300 border-solid">  
47 - 货品名称  
48 - </th>  
49 - <th className="w-1/12 p-2 border border-gray-300 border-solid">  
50 - 规格  
51 - </th>  
52 - <th className="w-1/6 p-2 border border-gray-300 border-solid">  
53 - 单位  
54 - </th>  
55 - <th className="w-1/6 p-2 border border-gray-300 border-solid">  
56 - 数量  
57 - </th>  
58 - <th className="w-1/4 p-2 border border-gray-300 border-solid">  
59 - 备注  
60 - </th>  
61 - </tr>  
62 - </thead>  
63 - <tbody>  
64 - <tr>  
65 - <td className="p-2 whitespace-normal border border-gray-300 border-solid">  
66 - 产品名称可能非常长，所以这里会自动换行  
67 - </td>  
68 - <td className="p-2 border border-gray-300 border-solid">  
69 - 规格型号  
70 - </td>  
71 - <td className="p-2 border border-gray-300 border-solid">单位</td>  
72 - <td className="p-2 border border-gray-300 border-solid">1</td>  
73 - <td className="p-2 border border-gray-300 border-solid">400</td>  
74 - <td className="p-2 border border-gray-300 border-solid">400</td>  
75 - <td className="p-2 whitespace-normal border border-gray-300 border-solid">  
76 - 备注信息可能也会很长，需要自动换行来适应内容  
77 - </td>  
78 - </tr>  
79 - {/* 其他行 */}  
80 - </tbody>  
81 - </table>  
82 - </div>  
83 - );  
84 -}  
85 -  
86 -function Footer() {  
87 - return (  
88 - <div className="text-sm">  
89 - <p>备注: 一些备注文本...</p>  
90 - <div className="flex items-center justify-between mt-4">  
91 - <div>  
92 - <p>销售人员: 签字</p>  
93 - </div>  
94 - <div>  
95 - <p>业务员: 签字</p>  
96 - </div>  
97 - <div>  
98 - <p>开票人: 签字</p>  
99 - <p className="font-medium">总计: ¥400</p>  
100 - </div>  
101 - </div>  
102 - </div>  
103 - );  
104 -} 86 +// function Footer() {
  87 +// return (
  88 +// <div className="text-sm">
  89 +// <p>备注: 一些备注文本...</p>
  90 +// <div className="flex items-center justify-between mt-4">
  91 +// <div>
  92 +// <p>销售人员: 签字</p>
  93 +// </div>
  94 +// <div>
  95 +// <p>业务员: 签字</p>
  96 +// </div>
  97 +// <div>
  98 +// <p>开票人: 签字</p>
  99 +// <p className="font-medium">总计: ¥400</p>
  100 +// </div>
  101 +// </div>
  102 +// </div>
  103 +// );
  104 +// }
105 105
106 function App() { 106 function App() {
107 return ( 107 return (
108 <div className="flex items-center justify-center min-h-screen bg-gray-100"> 108 <div className="flex items-center justify-center min-h-screen bg-gray-100">
109 <div className="w-full max-w-4xl p-10 bg-white border border-gray-300"> 109 <div className="w-full max-w-4xl p-10 bg-white border border-gray-300">
110 - <Header />  
111 - <InvoiceDetails />  
112 - <ProductsTable />  
113 - <Footer /> 110 + <table
  111 + width="846"
  112 + border={0}
  113 + cellPadding={0}
  114 + cellSpacing={0}
  115 + style={{
  116 + width: '423.00pt',
  117 + borderCollapse: 'collapse',
  118 + tableLayout: 'fixed',
  119 + }}
  120 + >
  121 + <col
  122 + width="25.50"
  123 + style={{ msoWidthSource: 'userset', msoWidthAlt: 544 }}
  124 + />
  125 + <col
  126 + width="52.50"
  127 + style={{ msoWidthSource: 'userset', msoWidthAlt: 1120 }}
  128 + />
  129 + <col
  130 + width="115.50"
  131 + style={{ msoWidthSource: 'userset', msoWidthAlt: 2464 }}
  132 + />
  133 + <col
  134 + width="169.50"
  135 + style={{ msoWidthSource: 'userset', msoWidthAlt: 3616 }}
  136 + />
  137 + <col
  138 + width="165"
  139 + style={{ msoWidthSource: 'userset', msoWidthAlt: 3520 }}
  140 + />
  141 + <col
  142 + width="96"
  143 + style={{ msoWidthSource: 'userset', msoWidthAlt: 2048 }}
  144 + />
  145 + <col
  146 + width="114"
  147 + style={{ msoWidthSource: 'userset', msoWidthAlt: 2432 }}
  148 + />
  149 + <col width="108" style={{ width: '54.00pt' }} />
  150 + <tr height="42" style={{ height: '21.00pt' }}>
  151 + <td height="42" style={{ height: '21.00pt' }}></td>
  152 + <td
  153 + className="xl65"
  154 + colSpan="7"
  155 + style={{ borderRight: 'none', borderBottom: 'none' }}
  156 + >
  157 + 科 路 得
  158 + </td>
  159 + </tr>
  160 + <tr height="30" style={{ height: '15.00pt' }}>
  161 + <td height="30" style={{ height: '15.00pt' }}></td>
  162 + <td
  163 + className="xl66"
  164 + colSpan="7"
  165 + style={{ borderRight: 'none', borderBottom: 'none' }}
  166 + >
  167 + 网址：www.canrd.com
  168 + </td>
  169 + </tr>
  170 + <tr height="35" style={{ height: '17.50pt' }}>
  171 + <td height="35" style={{ height: '17.50pt' }}></td>
  172 + <td
  173 + className="xl67"
  174 + colSpan="7"
  175 + style={{ borderRight: 'none', borderBottom: 'none' }}
  176 + >
  177 + 销售出货单
  178 + </td>
  179 + </tr>
  180 + <tr height="30" style={{ height: '15.00pt' }}>
  181 + <td height="30" style={{ height: '15.00pt' }}></td>
  182 + <td
  183 + className="xl69"
  184 + colSpan="4"
  185 + style={{ borderRight: 'none', borderBottom: 'none' }}
  186 + >
  187 + 单位名称：武汉大学
  188 + </td>
  189 + <td
  190 + className="xl69"
  191 + colSpan="3"
  192 + style={{ borderRight: 'none', borderBottom: 'none' }}
  193 + >
  194 + 单号：Canrd-DZ-2023-1101-004
  195 + </td>
  196 + </tr>
  197 + <tr height="30" style={{ height: '15.00pt' }}>
  198 + <td height="30" style={{ height: '15.00pt' }}></td>
  199 + <td
  200 + className="xl69"
  201 + colSpan="4"
  202 + style={{ borderRight: 'none', borderBottom: 'none' }}
  203 + >
  204 + 联系人：陈程
  205 + </td>
  206 + <td
  207 + className="xl69"
  208 + colSpan="3"
  209 + style={{ borderRight: 'none', borderBottom: 'none' }}
  210 + >
  211 + 开单日期：2023年11月1日
  212 + </td>
  213 + </tr>
  214 + <tr height="30" style={{ height: '15.00pt' }}>
  215 + <td height="30" style={{ height: '15.00pt' }}></td>
  216 + <td
  217 + className="xl69"
  218 + colSpan="4"
  219 + style={{ borderRight: 'none', borderBottom: 'none' }}
  220 + >
  221 + 联系电话：15623543176-6556
  222 + </td>
  223 + <td
  224 + className="xl70"
  225 + colSpan={2}
  226 + style={{ msoIgnore: 'colspan' }}
  227 + ></td>
  228 + <td className="xl70"></td>
  229 + </tr>
  230 + <tr height="30" style={{ height: '15.00pt' }}>
  231 + <td height="30" style={{ height: '15.00pt' }}></td>
  232 + <td
  233 + className="xl69"
  234 + colSpan="7"
  235 + style={{ borderRight: 'none', borderBottom: 'none' }}
  236 + >
  237 + 送货地址：广东省 深圳市龙岗区吉华街道联创科产业园3期33幢刘荣华[
  238 + </td>
  239 + </tr>
  240 + <tr height="30" style={{ height: '15.00pt' }}>
  241 + <td height="30" style={{ height: '15.00pt' }}></td>
  242 + <td className="xl71">序号</td>
  243 + <td className="xl71">订单号</td>
  244 + <td className="xl71">货品名称</td>
  245 + <td className="xl71">规格</td>
  246 + <td className="xl71">单位</td>
  247 + <td className="xl71">数量</td>
  248 + <td className="xl71">备注</td>
  249 + </tr>
  250 + <tr height="30" style={{ height: '15.00pt' }}>
  251 + <td height="30" style={{ height: '15.00pt' }}></td>
  252 + <td className="xl72">1</td>
  253 + <td className="xl72">231101005</td>
  254 + <td className="xl71">纽扣电池检测夹具</td>
  255 + <td className="xl71">20系列</td>
  256 + <td className="xl71">个</td>
  257 + <td className="xl72">1</td>
  258 + <td className="xl72"></td>
  259 + </tr>
  260 + <tr height="30" style={{ height: '15.00pt' }}>
  261 + <td height="30" style={{ height: '15.00pt' }}></td>
  262 + <td className="xl72">2</td>
  263 + <td className="xl72">231101005</td>
  264 + <td className="xl72">笔记本</td>
  265 + <td className="xl72"></td>
  266 + <td className="xl72">本</td>
  267 + <td className="xl72"></td>
  268 + <td className="xl72"></td>
  269 + </tr>
  270 + <tr height="30" style={{ height: '15.00pt' }}>
  271 + <td height="30" style={{ height: '15.00pt' }}></td>
  272 + <td className="xl72"></td>
  273 + <td className="xl72"></td>
  274 + <td className="xl72"></td>
  275 + <td className="xl71"></td>
  276 + <td className="xl71"></td>
  277 + <td className="xl72"></td>
  278 + <td className="xl72"></td>
  279 + </tr>
  280 + <tr height="30" style={{ height: '15.00pt' }}>
  281 + <td height="30" style={{ height: '15.00pt' }}></td>
  282 + <td className="xl72"></td>
  283 + <td className="xl72"></td>
  284 + <td className="xl72"></td>
  285 + <td className="xl72"></td>
  286 + <td className="xl72"></td>
  287 + <td className="xl72"></td>
  288 + <td className="xl72"></td>
  289 + </tr>
  290 + <tr height="30" style={{ height: '15.00pt' }}>
  291 + <td height="30" style={{ height: '15.00pt' }}></td>
  292 + <td className="xl72"></td>
  293 + <td className="xl72"></td>
  294 + <td className="xl72"></td>
  295 + <td className="xl72"></td>
  296 + <td className="xl72"></td>
  297 + <td className="xl72"></td>
  298 + <td className="xl72"></td>
  299 + </tr>
  300 + <tr height="30" style={{ height: '15.00pt' }}>
  301 + <td height="30" style={{ height: '15.00pt' }}></td>
  302 + <td className="xl72"></td>
  303 + <td className="xl72"></td>
  304 + <td className="xl72"></td>
  305 + <td className="xl72"></td>
  306 + <td className="xl72"></td>
  307 + <td className="xl72"></td>
  308 + <td className="xl72"></td>
  309 + </tr>
  310 + <tr style={{ height: '19.00pt' }}>
  311 + <td style={{ height: '19.00pt' }}></td>
  312 + <td className="xl73">销货单位</td>
  313 + <td
  314 + className="xl74"
  315 + colSpan="3"
  316 + style={{
  317 + borderRight: '0.5pt solid windowtext',
  318 + borderBottom: '0.5pt solid windowtext',
  319 + }}
  320 + >
  321 + 发货地址：广东省东莞市厚街镇锦丰路9号科路得产业园
  322 + </td>
  323 + <td className="xl73">开户银行及账号</td>
  324 + <td
  325 + className="xl74"
  326 + colSpan={2}
  327 + style={{
  328 + borderRight: '0.5pt solid windowtext',
  329 + borderBottom: '0.5pt solid windowtext',
  330 + }}
  331 + >
  332 + 招商银行股份有限公司东莞东骏路支行
  333 + <br />
  334 + 账号：769906437110802
  335 + </td>
  336 + </tr>
  337 + <tr style={{ height: 30 }}>
  338 + <td height="30" style={{ height: '15.00pt' }}></td>
  339 + <td className="xl76" colSpan={2} style={{ msoIgnore: 'colspan' }}>
  340 + 客户签名：
  341 + </td>
  342 + <td className="xl76">核准：屠亚辉</td>
  343 + <td
  344 + className="xl78"
  345 + colSpan={2}
  346 + style={{ borderRight: 'none', borderBottom: 'none' }}
  347 + >
  348 + 业务员：Peter
  349 + </td>
  350 + <td
  351 + className="xl78"
  352 + colSpan={2}
  353 + style={{ borderRight: 'none', borderBottom: 'none' }}
  354 + >
  355 + 开单人：张玉红
  356 + </td>
  357 + </tr>
  358 + <tr style={{ display: 'none', width: 0 }}>
  359 + <td width="26" style={{ width: 13 }}></td>
  360 + <td width="53" style={{ width: 26 }}></td>
  361 + <td width="116" style={{ width: 58 }}></td>
  362 + <td width="170" style={{ width: 85 }}></td>
  363 + <td width="165" style={{ width: 83 }}></td>
  364 + <td width="96" style={{ width: 48 }}></td>
  365 + <td width="114" style={{ width: 57 }}></td>
  366 + </tr>
  367 + </table>
114 </div> 368 </div>
115 </div> 369 </div>
116 ); 370 );
src/utils/index.ts
  View file @3b579ac
@@ -16,4 +16,14 @@ function enumValueToLabel(value: any, enumObj: any) { @@ -16,4 +16,14 @@ function enumValueToLabel(value: any, enumObj: any) {
16 return ''; 16 return '';
17 } 17 }
18 18
19 -export { customMessage, enumToSelect, enumValueToLabel }; 19 +//从缓存中获取用户信息
  20 +function getUserInfo() {
  21 + let userInfoString = localStorage.getItem('userInfo');
  22 + if (userInfoString === null) {
  23 + return {};
  24 + }
  25 +
  26 + return JSON.parse(userInfoString);
  27 +}
  28 +
  29 +export { customMessage, enumToSelect, enumValueToLabel, getUserInfo };