canrd-main / canrd-erp-front · Commits

Commit deed1a0c845495454d12cb3f7ad8c47942f1ef4d

Authored by zhongnanhuang
1 parent 05f7cc90
build: skipped

feat: update

Inline Side-by-side
Showing 8 changed files with 239 additions and 68 deletions
.umirc.ts
  View file @deed1a0
... ... @@ -13,9 +13,9 @@ export default defineConfig({
13 13 },
14 14 proxy: {
15 15 '/api/': {
16   - target: 'http://localhost:8085/',
  16 + // target: 'http://localhost:8085/',
17 17 // target: 'http://192.168.1.6:8085/',
18   - // target: 'http://39.108.227.113:8085/',
  18 + target: 'http://39.108.227.113:8085/',
19 19 changeOrigin: true,
20 20 pathRewrite: { '^/api': '' },
21 21 },
... ...
src/app.ts
  View file @deed1a0
... ... @@ -12,7 +12,7 @@ import './style/global.css';
12 12 // 更多信息见文档：https://umijs.org/docs/api/runtime-config#getinitialstate
13 13 export async function getInitialState(): Promise<{ name: string }> {
14 14 // getUserInfo();
15   - return { name: '@umijs/max' };
  15 + return { name: '' };
16 16 }
17 17  
18 18 export const layout = () => {
... ...
src/pages/Order/components/AttachmentModal.tsx
  View file @deed1a0
1 1 import { getAliYunOSSFileNameFromUrl } from '@/utils';
2 2 import { ModalForm, ProFormUploadDragger } from '@ant-design/pro-components';
3   -import { Button, Form } from 'antd';
  3 +import { Button, Empty, Form } from 'antd';
4 4 import { cloneDeep } from 'lodash';
5 5 import { useEffect, useState } from 'react';
6 6  
... ... @@ -52,28 +52,32 @@ export default ({ data, onClose }) =&gt; {
52 52 },
53 53 }}
54 54 >
55   - <ProFormUploadDragger
56   - name="listAnnex"
57   - action="/api/service/order/fileProcess"
58   - disabled
59   - fieldProps={{
60   - headers: { Authorization: localStorage.getItem('token') },
61   - // onRemove: (file) => {
62   - // const index = fileList[listMeta.index].indexOf(file);
63   - // console.log(index);
64   - // const newFileList = fileList.slice();
65   - // newFileList.splice(index, 1);
66   - // setFileList(newFileList);
67   - // },
68   - // beforeUpload: (file) => {
69   - // fileList[listMeta.index] = [...fileList[listMeta.index], file as RcFile];
70   - // setFileList(fileList);
71   - // return true;
72   - // },
73   - fileList,
74   - // defaultFileList: itemFileList
75   - }}
76   - />
  55 + {newListAnnex?.length <= 0 ? (
  56 + <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
  57 + ) : (
  58 + <ProFormUploadDragger
  59 + name="listAnnex"
  60 + action="/api/service/order/fileProcess"
  61 + disabled
  62 + fieldProps={{
  63 + headers: { Authorization: localStorage.getItem('token') },
  64 + // onRemove: (file) => {
  65 + // const index = fileList[listMeta.index].indexOf(file);
  66 + // console.log(index);
  67 + // const newFileList = fileList.slice();
  68 + // newFileList.splice(index, 1);
  69 + // setFileList(newFileList);
  70 + // },
  71 + // beforeUpload: (file) => {
  72 + // fileList[listMeta.index] = [...fileList[listMeta.index], file as RcFile];
  73 + // setFileList(fileList);
  74 + // return true;
  75 + // },
  76 + fileList,
  77 + // defaultFileList: itemFileList
  78 + }}
  79 + />
  80 + )}
77 81 </ModalForm>
78 82 );
79 83 };
... ...
src/pages/Order/components/DeliverInfoDrawer.tsx 0 → 100644
  View file @deed1a0
  1 +import { Col, Drawer, Row } from 'antd';
  2 +
  3 +export default ({ data, onClose }) => {
  4 + console.log(data);
  5 + return (
  6 + <>
  7 + <Drawer
  8 + width={500}
  9 + title="基本信息"
  10 + placement="right"
  11 + onClose={onClose}
  12 + open
  13 + >
  14 + <Row gutter={[16, 24]}>
  15 + <Col span={6}>
  16 + <span className="text-[#333333]">收货人</span>
  17 + </Col>
  18 + <Col span={18}>{data.customerName}</Col>
  19 + <Col span={6}>
  20 + <span className="className='text-[#333333]'">联系方式</span>
  21 + </Col>
  22 + <Col span={18}>{data.customerContactNumber}</Col>
  23 +
  24 + <Col span={6}>
  25 + <span className="className='text-[#333333]'">收货地址</span>
  26 + </Col>
  27 + <Col span={18}>{data.customerShippingAddress}</Col>
  28 +
  29 + <Col span={6}>
  30 + <span className="className='text-[#333333]'">单位联系人</span>
  31 + </Col>
  32 + <Col span={18}>{data.institutionContactName}</Col>
  33 + <Col span={6}>
  34 + <span className="className='text-[#333333]'">单位名称</span>
  35 + </Col>
  36 + <Col span={18}>{data.institution}</Col>
  37 + <Col span={6}>
  38 + <span className="className='text-[#333333]'">开户银行</span>
  39 + </Col>
  40 + <Col span={18}>{data.bank}</Col>
  41 +
  42 + <Col span={6}>
  43 + <span className="className='text-[#333333]'">银行账号</span>
  44 + </Col>
  45 + <Col span={18}>{data.bankAccountNumber}</Col>
  46 + <Col span={6}>
  47 + <span className="className='text-[#333333]'">开票识别号</span>
  48 + </Col>
  49 + <Col span={18}>{data.invoiceIdentificationNumber}</Col>
  50 + </Row>
  51 + </Drawer>
  52 + </>
  53 + );
  54 +};
... ...
src/pages/Order/components/HistoryModal.tsx
  View file @deed1a0
1 1 import { postServiceOrderQueryHistoryOrderRecord } from '@/services';
2   -import { Button, Modal, Timeline } from 'antd';
  2 +import { enumValueToLabel, formatDateTime } from '@/utils';
  3 +import { Button, Col, Empty, Flex, Modal, Row } from 'antd';
  4 +import { useEffect, useState } from 'react';
  5 +import { HISTORY_OPT_TYPE, ORDER_STATUS_OPTIONS } from '../constant';
3 6  
4 7 export default ({ subOrders, onClose }) => {
5 8 let subOrderIds = subOrders?.map((subOrder: any) => {
6 9 return subOrder.id;
7 10 });
  11 + const [data, setData] = useState([]);
  12 + let i = 1;
8 13  
9 14 const handleOk = () => {
10 15 onClose();
... ... @@ -14,9 +19,13 @@ export default ({ subOrders, onClose }) =&gt; {
14 19 let res = await postServiceOrderQueryHistoryOrderRecord({
15 20 data: { ids: subOrderIds },
16 21 });
17   - console.log(res);
  22 + setData(res.data);
  23 + console.log(data);
18 24 };
19   - getHistory();
  25 +
  26 + useEffect(() => {
  27 + getHistory();
  28 + }, []);
20 29  
21 30 const handleCancel = () => {
22 31 onClose();
... ... @@ -35,23 +44,59 @@ export default ({ subOrders, onClose }) =&gt; {
35 44 </>
36 45 )}
37 46 >
38   - <Timeline
39   - className="pt-10"
40   - items={[
41   - {
42   - children: 'Create a services site 2015-09-01',
43   - },
44   - {
45   - children: 'Solve initial network problems 2015-09-01',
46   - },
47   - {
48   - children: 'Technical testing 2015-09-01',
49   - },
50   - {
51   - children: 'Network problems being solved 2015-09-01',
52   - },
53   - ]}
54   - />
  47 + <Row>
  48 + {data.map((item) => {
  49 + return (
  50 + <Col span={24} key="key">
  51 + <Flex vertical>
  52 + <span className="py-2 text-[#5E5E5E]">{'商品' + i++}</span>
  53 + <Flex vertical>
  54 + {item.historySubOrderRecordDto?.map((history) => {
  55 + return (
  56 + <div className="py-1" key="key">
  57 + <span className="pr-2 text-[#5E5E5E]">
  58 + {formatDateTime(history.createTime)}
  59 + </span>
  60 + <span className="text-[#3b83e5]">
  61 + {history.createByName}
  62 + </span>
  63 + 进行了
  64 + <span className="text-[#3b83e5]">
  65 + {HISTORY_OPT_TYPE.get(history.record)}
  66 + </span>
  67 + ，
  68 + {enumValueToLabel(
  69 + history.status,
  70 + ORDER_STATUS_OPTIONS,
  71 + ) === undefined
  72 + ? '子订单开票状态为'
  73 + : '子订单状态为'}
  74 + ：
  75 + <span className="text-[#3b83e5]">
  76 + {enumValueToLabel(
  77 + history.status,
  78 + ORDER_STATUS_OPTIONS,
  79 + ) === undefined
  80 + ? '已开票'
  81 + : enumValueToLabel(
  82 + history.status,
  83 + ORDER_STATUS_OPTIONS,
  84 + )}
  85 + </span>
  86 + </div>
  87 + );
  88 + })}
  89 + </Flex>
  90 + </Flex>
  91 + </Col>
  92 + );
  93 + })}
  94 + </Row>
  95 + {data?.length <= 0 ? (
  96 + <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
  97 + ) : (
  98 + ''
  99 + )}
55 100 </Modal>
56 101 </>
57 102 );
... ...
src/pages/Order/constant.ts
  View file @deed1a0
... ... @@ -98,6 +98,18 @@ export const SALES_CODE_OPTIONS = [
98 98 { label: 'JJ', value: 'JJ' },
99 99 ];
100 100  
  101 +export const HISTORY_OPT_TYPE = new Map<string, string>([
  102 + ['DELETE', '作废'],
  103 + ['UPDATE', '编辑'],
  104 + ['ADD', '创建'],
  105 + ['SEND', '发货'],
  106 + ['CHECK', '审核'],
  107 + ['CONFIRM_RECEIPT', '确认收货'],
  108 + ['PRINT_ORDER', '打印'],
  109 + ['INVOICING', '财务开票'],
  110 + ['EDIT_ORDER', '财务编辑'],
  111 +]);
  112 +
101 113 export const MAIN_ORDER_COLUMNS = [
102 114 {
103 115 title: '订单列表',
... ...
src/pages/Order/index.less
  View file @deed1a0
1 1 // 嵌套表格去掉左方多余部分
2   -.ant-table .ant-table-middle {
  2 +.order-page-container .ant-table .ant-table-middle {
3 3 margin-inline: 0 !important;
4 4 }
5 5  
6   -td {
  6 +.order-page-container td {
7 7 font-family: 'San Francisco', 'Helvetica Neue', Helvetica, Arial,
8 8 'Microsoft YaHei', 'PingFang SC', 'Hiragino Sans GB', 'Heiti SC',
9 9 'WenQuanYi Micro Hei', sans-serif;
... ... @@ -15,9 +15,9 @@ td {
15 15 padding: 0 !important;
16 16 }
17 17  
18   -table:hover,
19   -tr:hover,
20   -thead:hover {
  18 +.order-page-container table:hover,
  19 +.order-page-container tr:hover,
  20 +.order-page-container thead:hover {
21 21 background: none !important;
22 22 }
23 23  
... ... @@ -25,7 +25,7 @@ thead:hover {
25 25 background: none !important;
26 26 }
27 27  
28   -.ant-pro-card {
  28 +.order-page-container .ant-pro-card {
29 29 background-color: transparent;
30 30 }
31 31  
... ... @@ -33,15 +33,26 @@ thead:hover {
33 33 padding: 10px 0 0;
34 34 }
35 35  
  36 +.order-page-container .ant-pagination {
  37 + background-color: #fff !important;
  38 + padding: 10px;
  39 + border-radius: 8px;
  40 +}
  41 +
  42 +.order-page-container .ant-pro-table .ant-form {
  43 + background-color: #fff;
  44 + border-radius: 8px;
  45 +}
  46 +
36 47 #main-table .ant-table-tbody {
37 48 background-color: #f5f5f5;
38 49 }
39 50  
40   -.ant-pro-card-body {
  51 +.order-page-container .ant-pro-card-body {
41 52 padding: 0 !important;
42 53 }
43 54  
44   -.ant-table-thead .ant-table-cell {
  55 +.order-page-container .ant-table-thead .ant-table-cell {
45 56 background-color: #fff !important;
46 57 border-radius: 8px !important;
47 58 }
... ...
src/pages/Order/index.tsx
  View file @deed1a0
... ... @@ -38,6 +38,7 @@ import OrderPrintModal from &#39;../OrderPrint/OrderPrintModal&#39;;
38 38 import AttachmentModal from './components/AttachmentModal';
39 39 import CheckModal from './components/CheckModal';
40 40 import ConfirmReceiptModal from './components/ConfirmReceiptModal';
  41 +import DeliverInfoDrawer from './components/DeliverInfoDrawer';
41 42 import DeliverModal from './components/DeliverModal';
42 43 import FinancialDrawer from './components/FinancialDrawer';
43 44 import HistoryModal from './components/HistoryModal';
... ... @@ -78,6 +79,8 @@ const OrderPage = () =&gt; {
78 79 const [confirmReceiptVisible, setConfirmReceiptVisible] =
79 80 useState<boolean>(false);
80 81 const [deliverVisible, setDeliverVisible] = useState<boolean>(false);
  82 + const [deliverInfoDrawerVisible, setDeliverInfoDrawerVisible] =
  83 + useState<boolean>(false);
81 84 const [orderOptType, setOrderOptType] = useState<string>('');
82 85 const [isFinalcialEdit, setIsFinalcialEdit] = useState<boolean>(false);
83 86 const [expandedRowKeys, setExpandedRowKeys] = useState<Key[]>([]);
... ... @@ -199,11 +202,14 @@ const OrderPage = () =&gt; {
199 202 </span>
200 203 </div>
201 204 <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
202   - <span className="text-gray-500">参数：{optRecord.parameters}</span>
  205 + <span className="text-[#8C8C8C]">参数：{optRecord.parameters}</span>
203 206 </div>
204 207 <Flex title={optRecord.notes}>
205 208 <div className="max-w-[90%] whitespace-no-wrap overflow-hidden overflow-ellipsis">
206   - <span className="text-gray-500">备注：{optRecord.notes}</span>
  209 + <span className="text-[#8C8C8C]">
  210 + 备注：
  211 + {optRecord.notes === undefined ? '暂无备注' : optRecord.notes}
  212 + </span>
207 213 </div>
208 214 <EditTwoTone
209 215 onClick={() => {
... ... @@ -216,15 +222,15 @@ const OrderPage = () =&gt; {
216 222 </Flex>
217 223 <Flex className="w-[16%]" vertical gap="small">
218 224 <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
219   - <span className="text-gray-500">单价：</span>
  225 + <span className="text-[#8C8C8C]">单价：</span>
220 226 <span className="text-slate-700">￥{optRecord.productPrice}</span>
221 227 </div>
222 228 <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
223   - <span className="text-gray-500">数量：</span>
  229 + <span className="text-[#8C8C8C]">数量：</span>
224 230 <span className="text-slate-700">x{optRecord.quantity}</span>
225 231 </div>
226 232 <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
227   - <span className="text-gray-500">合计：</span>
  233 + <span className="text-[#8C8C8C]">合计：</span>
228 234 <span className="text-slate-700">
229 235 ￥{optRecord.subOrderPayment}
230 236 </span>
... ... @@ -307,6 +313,26 @@ const OrderPage = () =&gt; {
307 313 ''
308 314 )}
309 315  
  316 + {optRecord.subPath.includes('orderCancel') ? (
  317 + <ButtonConfirm
  318 + className="p-0"
  319 + title="确认作废？"
  320 + text="作废"
  321 + onConfirm={async () => {
  322 + let body = { ids: [optRecord.id], checkIsMainOrderId: false };
  323 + const data = await postServiceOrderOrderCancel({
  324 + data: body,
  325 + });
  326 + if (data.result === RESPONSE_CODE.SUCCESS) {
  327 + message.success(data.message);
  328 + refreshTable();
  329 + }
  330 + }}
  331 + />
  332 + ) : (
  333 + ''
  334 + )}
  335 +
310 336 {optRecord.subPath.includes('modifySendInformation') ? (
311 337 <Button
312 338 className="p-0"
... ... @@ -499,7 +525,7 @@ const OrderPage = () =&gt; {
499 525 >
500 526 <Space split={<Divider type="vertical" />}>
501 527 <div>
502   - <span className="text-gray-500">订单号：</span>
  528 + <span className="text-[#8C8C8C]">订单号：</span>
503 529 <span className="text-slate-700">{record.id}</span>
504 530 </div>
505 531 <span>{formatDateTime(record.createTime)}</span>
... ... @@ -507,18 +533,24 @@ const OrderPage = () =&gt; {
507 533 </Checkbox>
508 534 <Space split={<Divider type="vertical" />}>
509 535 <div>
510   - <span className="text-gray-500">代表：</span>
  536 + <span className="text-[#8C8C8C]">代表：</span>
511 537 <span className="text-slate-700">{record.salesCode}</span>
512 538 </div>
513 539 <span>
514   - <span className="text-gray-500">单位：</span>
  540 + <span className="text-[#8C8C8C]">单位：</span>
515 541 <span className="text-slate-700">{record.institution}</span>
516 542 </span>
517 543 <span>
518   - <span className="text-gray-500">联系人：</span>
  544 + <span className="text-[#8C8C8C]">联系人：</span>
519 545 <span className="text-slate-700">
520 546 {record.institutionContactName + ' '}
521   - <ContainerTwoTone />
  547 + <ContainerTwoTone
  548 + className="hover:curcor-pointer"
  549 + onClick={() => {
  550 + setDeliverInfoDrawerVisible(true);
  551 + setOrderRow(record);
  552 + }}
  553 + />
522 554 </span>
523 555 </span>
524 556 </Space>
... ... @@ -527,8 +559,10 @@ const OrderPage = () =&gt; {
527 559 <Flex className="pl-6" align="center">
528 560 <div title={record.notes}>
529 561 <div className="max-w-md whitespace-no-wrap overflow-hidden overflow-ellipsis">
530   - <span className="text-gray-500">备注：</span>
531   - <span className="ml-2">{record.notes}</span>
  562 + <span className="text-[#8C8C8C]">备注：</span>
  563 + <span className="ml-2">
  564 + {record.notes === undefined ? '暂无备注' : record.notes}
  565 + </span>
532 566 </div>
533 567 </div>
534 568 <EditTwoTone
... ... @@ -545,7 +579,7 @@ const OrderPage = () =&gt; {
545 579 <Flex justify="flex-end">
546 580 <Flex wrap="wrap" gap="middle" align="center">
547 581 <div>
548   - <span className="text-gray-500">总金额：￥</span>
  582 + <span className="text-[#8C8C8C]">总金额：￥</span>
549 583 <span className="text-lg font-medium">
550 584 {record.totalPayment}
551 585 </span>
... ... @@ -766,7 +800,7 @@ const OrderPage = () =&gt; {
766 800 ''
767 801 )}
768 802  
769   - {record.mainPath.includes('OrderCancel') ? (
  803 + {record.mainPath.includes('orderCancel') ? (
770 804 <ButtonConfirm
771 805 className="p-0"
772 806 title="确认作废？"
... ... @@ -927,6 +961,7 @@ const OrderPage = () =&gt; {
927 961  
928 962 return (
929 963 <PageContainer
  964 + className="order-page-container"
930 965 header={{
931 966 title: '订单管理',
932 967 extra: [
... ... @@ -1156,6 +1191,16 @@ const OrderPage = () =&gt; {
1156 1191 />
1157 1192 )}
1158 1193  
  1194 + {deliverInfoDrawerVisible && (
  1195 + <DeliverInfoDrawer
  1196 + data={orderRow}
  1197 + onClose={() => {
  1198 + setDeliverInfoDrawerVisible(false);
  1199 + setOrderRow({});
  1200 + }}
  1201 + />
  1202 + )}
  1203 +
1159 1204 {contextHolder}
1160 1205 </PageContainer>
1161 1206 );
... ...