Skip to content

M
merchant-manage-ui
Commit 332fdff5 authored by 李腾's avatar 李腾
Browse files
Options

Merge branch 'feature/multiLogistics20221104' into 'master' 

Feature/multi logistics20221104

See merge request !66
parents a29bd851 f8f580e6
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 815 additions and 146 deletions
config/env.config.js
View file @ 332fdff5
const isProduction = process.env.NODE_ENV === 'production'; const isProduction = process.env.NODE_ENV === 'production';
const isPre = process.env.PRE_ENV === 'pre'; const isPre = process.env.PRE_ENV === 'pre';
const environment = 'sc'; const environment = 'yxm2';
const envAPi = { const envAPi = {
api: `https://security-${environment}.liangkebang.net`, //'https://security-xyqb.liangkebang.net', api: `https://security-${environment}.liangkebang.net`, //'https://security-xyqb.liangkebang.net',
kdspOpApi: `https://sc-merchant-api-${environment}.liangkebang.net`, kdspOpApi: `https://sc-merchant-api-${environment}.liangkebang.net`,
......
src/pages/AfterSaleManage/components/LogisticsRecordModal.jsx
View file @ 332fdff5
import React, { useState, forwardRef, useImperativeHandle, useEffect } from 'react'; import React, { useState, forwardRef, useImperativeHandle, useEffect } from 'react';
import { Modal, Timeline, notification, Spin } from 'antd'; import { Modal, Timeline, notification, Spin, Collapse } from 'antd';
import { getLogisticsRecord } from '../services'; import { getLogisticsRecord, apiDeliveriesTraceList } from '../services';
import styles from '../index.less';
const { Panel } = Collapse;
const LogisticsRecordModal = (props, ref) => { const LogisticsRecordModal = (props, ref) => {
// const { } = props; // const { } = props;
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
const [result, setResult] = useState({});
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [dataList, setDataList] = useState([]);
const [isSingle, setIsSingle] = useState(false);
const getRecordList = async orderNo => { const getRecordList = async params => {
const tempObj = {
detailList: [],
key: Date.now(),
};
setLoading(true); setLoading(true);
const res = await getLogisticsRecord({ orderNo }); const res = await apiDeliveriesTraceList(params);
setLoading(false); setLoading(false);
if (!res) { if (!res) {
notification.info({ message: '暂无物流信息' }); notification.info({ message: '暂无物流信息' });
return; return;
} }
const { logisticsName, logisticsBillNo, logisticsList = [] } = res.data;
tempObj.expressCompanyName = logisticsName; setDataList(res.data);
tempObj.deliveryNo = logisticsBillNo;
logisticsList.forEach(v => {
tempObj.detailList = [...tempObj.detailList, ...v.detailList];
});
setResult(tempObj);
}; };
const open = orderNo => { const open = (record, type) => {
setVisible(true); setVisible(true);
getRecordList(orderNo); getRecordList(record);
if (type === 'single') {
setIsSingle(true);
}
}; };
const onCancel = () => { const onCancel = () => {
setVisible(false); setVisible(false);
setResult([]); setTimeout(() => {
setDataList([]);
}, 1000);
}; };
useImperativeHandle(ref, () => ({ useImperativeHandle(ref, () => ({
open, open,
...@@ -59,18 +59,70 @@ const LogisticsRecordModal = (props, ref) => { ...@@ -59,18 +59,70 @@ const LogisticsRecordModal = (props, ref) => {
return ( return (
<Modal {...modalProps}> <Modal {...modalProps}>
<Spin spinning={loading}> <Spin spinning={loading}>
{result.detailList?.length ? ( {dataList.length ? (
<Timeline> dataList.map((dataItem, dataIndex) => (
{result?.detailList?.map((item, index) => ( <div className={styles['logistics-record']}>
<Timeline.Item color={index > 0 ? 'gray' : 'blue'} key={index.toString()}> {!isSingle ? (
<p>{item.desc}</p> <div className={styles['logistics-record__topbar']}>包裹{dataIndex + 1}</div>
<p>{item.logisticsTime}</p> ) : (
</Timeline.Item> ''
))} )}
</Timeline> <div className={styles['logistics-record__head']}>
<span className={styles.name}>物流公司：{dataItem.expressCompanyName}</span>
<span className={styles.no}>物流单号：{dataItem.expressNo}</span>
</div>
{dataItem.traceList.map(traceItem => (
<Timeline>
{traceItem?.detailList.length ? (
traceItem?.detailList?.map((item, index) => (
<Timeline.Item color={index > 0 ? 'gray' : 'blue'} key={index.toString()}>
<p>{item.desc}</p>
<p>{item.time}</p>
</Timeline.Item>
))
) : (
<div style={emptyStyle}>暂无物流信息</div>
)}
</Timeline>
))}
</div>
))
) : ( ) : (
<div style={emptyStyle}>暂无物流信息</div> <div style={emptyStyle}>暂无物流信息</div>
)} )}
{/* 折叠 */}
{/* <Collapse defaultActiveKey={['0']} ghost >
{dataList.length ? (
dataList.map((dataItem, dataIndex) => (
<Panel showArrow={false} header={<div className={styles['logistics-record__topbar']}>包裹{dataIndex + 1}</div>} key={dataIndex.toString()}>
<div className={styles['logistics-record']}>
<div className={styles['logistics-record__head']}>
<span className={styles.name}>物流公司：{dataItem.expressCompanyName}</span>
<span className={styles.no}>物流单号：{dataItem.expressNo}</span>
</div>
{dataItem.traceList.map(traceItem => (
<Timeline>
{traceItem?.detailList.length ? (
traceItem?.detailList?.map((item, index) => (
<Timeline.Item color={index > 0 ? 'gray' : 'blue'} key={index.toString()}>
<p>{item.desc}</p>
<p>{item.time}</p>
</Timeline.Item>
))
) : (
<div style={emptyStyle}>暂无物流信息</div>
)}
</Timeline>
))}
</div>
</Panel>
))
) : (
<div style={emptyStyle}>暂无物流信息</div>
)}
</Collapse> */}
</Spin> </Spin>
</Modal> </Modal>
); );
......
src/pages/AfterSaleManage/components/auditModal.jsx
View file @ 332fdff5
...@@ -105,7 +105,8 @@ const AuditModal = props => { ...@@ -105,7 +105,8 @@ const AuditModal = props => {
}; };
const openLogisticsRecord = () => { const openLogisticsRecord = () => {
logisticsRecordModalRef.current.open(formData.orderNo); const { orderNo, skuNo } = formData;
logisticsRecordModalRef.current.open({ orderNo, skuNo });
}; };
const layout = { const layout = {
......
src/pages/AfterSaleManage/index.jsx
View file @ 332fdff5
...@@ -16,6 +16,7 @@ import RejectModal from './components/rejectModal'; ...@@ -16,6 +16,7 @@ import RejectModal from './components/rejectModal';
import LogisticsCom from '../orderManage/pendingDeliveryOrder/components/LogisticsCom'; import LogisticsCom from '../orderManage/pendingDeliveryOrder/components/LogisticsCom';
import CancelAuditModal from './components/CancelAuditModal'; import CancelAuditModal from './components/CancelAuditModal';
import CancelDetailTable from './components/CancelDetailTable'; import CancelDetailTable from './components/CancelDetailTable';
import LogisticsRecordModal from './components/LogisticsRecordModal';
import { getColumns, getFormConfig, TAB_MAPPING_DATA } from './data.js'; import { getColumns, getFormConfig, TAB_MAPPING_DATA } from './data.js';
import { getDetail } from '@/pages/afterSale/appeal/services'; import { getDetail } from '@/pages/afterSale/appeal/services';
...@@ -44,6 +45,7 @@ const AfterSale = props => { ...@@ -44,6 +45,7 @@ const AfterSale = props => {
const actionRef = useRef(); const actionRef = useRef();
const formRef = useRef(); const formRef = useRef();
const logisticsRecordModalRef = useRef();
const [tableParams, setTableParams] = useState({}); const [tableParams, setTableParams] = useState({});
const [currentTab, setCurrentTab] = useState(''); const [currentTab, setCurrentTab] = useState('');
// const [appealDetailModal, setAppealDetailModal] = useState(false); // const [appealDetailModal, setAppealDetailModal] = useState(false);
...@@ -125,32 +127,35 @@ const AfterSale = props => { ...@@ -125,32 +127,35 @@ const AfterSale = props => {
}; };
// 审核 // 审核
const openAudit = async ({ serviceNo, serviceType, orderNo }) => { const openAudit = async ({ serviceNo, serviceType, orderNo, skuNo }) => {
const data = await auditInfoApi({ serviceNo }); const data = await auditInfoApi({ serviceNo });
setAuditInfo({ ...data?.data, serviceNo, serviceType, orderNo }); setAuditInfo({ ...data?.data, serviceNo, serviceType, orderNo, skuNo });
setVisible(true); setVisible(true);
}; };
// 查看物流 // 查看物流
const handleCom = async ({ expressCompanyCode, deliveryNo }) => { const handleCom = async record => {
const tempObj = { console.log('record', record);
detailList: [], const { expressCompanyCode, deliveryNo: expressNo } = record;
key: Date.now(), logisticsRecordModalRef.current.open({ expressCompanyCode, expressNo }, 'single');
}; // const tempObj = {
const data = await trackInfo({ expressCompanyCode, logisticsNo: deliveryNo }); // detailList: [],
if (!data) { // key: Date.now(),
notification.info({ message: '暂无物流信息' }); // };
return; // const data = await trackInfo({ expressCompanyCode, logisticsNo: deliveryNo });
} // if (!data) {
tempObj.expressCompanyName = data.logisticsName; // notification.info({ message: '暂无物流信息' });
tempObj.deliveryNo = data.logisticsBillNo; // return;
if (data.logisticsList?.length) { // }
data.logisticsList.forEach(v => { // tempObj.expressCompanyName = data.logisticsName;
tempObj.detailList = [...tempObj.detailList, ...v.detailList]; // tempObj.deliveryNo = data.logisticsBillNo;
}); // if (data.logisticsList?.length) {
} // data.logisticsList.forEach(v => {
setLogisticsComModalVisible(true); // tempObj.detailList = [...tempObj.detailList, ...v.detailList];
setLogisticsComList(tempObj); // });
// }
// setLogisticsComModalVisible(true);
// setLogisticsComList(tempObj);
}; };
// 物流拦截 // 物流拦截
...@@ -439,6 +444,8 @@ const AfterSale = props => { ...@@ -439,6 +444,8 @@ const AfterSale = props => {
onCancel={closeModal} onCancel={closeModal}
dataSource={cancelDetailInfo} dataSource={cancelDetailInfo}
/> />
<LogisticsRecordModal ref={logisticsRecordModalRef} />
</PageHeaderWrapper> </PageHeaderWrapper>
); );
}; };
......
src/pages/AfterSaleManage/index.less
View file @ 332fdff5
...@@ -59,3 +59,24 @@ ...@@ -59,3 +59,24 @@
} }
} }
} }
.logistics-record {
&__topbar {
margin-bottom: 15px;
padding-left: 10px;
color: #000;
font-weight: bold;
font-size: 16px;
border-left: 10px solid #2391fe;
}
&__head {
padding-bottom: 25px;
color: #000;
font-weight: 500;
font-size: 14px;
line-height: 1;
.no {
margin-left: 20px;
}
}
}
src/pages/AfterSaleManage/services.js
View file @ 332fdff5
...@@ -131,6 +131,21 @@ export async function getLogisticsRecord(params) { ...@@ -131,6 +131,21 @@ export async function getLogisticsRecord(params) {
}); });
} }
/**
* 多物流发货-查询物流轨迹
* @see http://yapi.quantgroups.com/project/389/interface/api/46120
*/
export function apiDeliveriesTraceList(data) {
return request.post('/api/merchants/deliveries/trace/list', {
data: stringify(data),
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
prefix: kdspApi,
});
}
// 查询售后待办数量 // 查询售后待办数量
export function getAfterPendingNum(data) { export function getAfterPendingNum(data) {
return request.post('/api/kdsp/op/afs/getPendingNum', { return request.post('/api/kdsp/op/afs/getPendingNum', {
......
src/pages/orderManage/pendingDeliveryOrder/components/LogisticsCom.jsx
View file @ 332fdff5
...@@ -31,7 +31,7 @@ const LogisticsCom = props => { ...@@ -31,7 +31,7 @@ const LogisticsCom = props => {
// eslint-disable-next-line react/no-array-index-key // eslint-disable-next-line react/no-array-index-key
<Timeline.Item color={index > 0 ? 'gray' : 'blue'} key={index}> <Timeline.Item color={index > 0 ? 'gray' : 'blue'} key={index}>
<p>{item.desc}</p> <p>{item.desc}</p>
<p>{item.logisticsTime}</p> <p>{item.time}</p>
</Timeline.Item> </Timeline.Item>
))} ))}
</Timeline> </Timeline>
......
src/pages/orderManage/pendingDeliveryOrder/components/MultiLogisticsModal/index.less 0 → 100644
View file @ 332fdff5
.sku-list-module {
margin-bottom: 20px;
padding: 10px 20px;
border: 1px solid #f2f2f2;
&__index {
margin-bottom: 5px;
font-weight: 700;
font-size: 14px;
}
}
.sku-list-box {
padding-bottom: 10px;
.sku-list {
display: flex;
// padding-bottom: 19px;
&__goods-name {
flex: 1;
margin-bottom: 0 !important;
}
&__goods-count {
width: 100px;
margin-bottom: 5px !important;
}
}
}
.operation {
font-size: 24px;
text-align: center;
> * {
margin: 0 10px;
}
}
src/pages/orderManage/pendingDeliveryOrder/index.jsx
View file @ 332fdff5
...@@ -12,6 +12,8 @@ import LogisticsForm from './components/LogisticsForm'; ...@@ -12,6 +12,8 @@ import LogisticsForm from './components/LogisticsForm';
import PopoverDom from './components/PreviewImage'; import PopoverDom from './components/PreviewImage';
import LogisticsCom from './components/LogisticsCom'; import LogisticsCom from './components/LogisticsCom';
import DelayDeliverGoods from './components/DelayDeliverGoods'; import DelayDeliverGoods from './components/DelayDeliverGoods';
import MultiLogisticsModal from './components/MultiLogisticsModal';
import { import {
queryToSend, queryToSend,
queryExpress, queryExpress,
...@@ -19,6 +21,8 @@ import { ...@@ -19,6 +21,8 @@ import {
getLogistics, getLogistics,
downOrder, downOrder,
getJDLogisticsInfo, getJDLogisticsInfo,
apiQueryOrderInfo,
apiDeliveriesTraceList,
} from './service'; } from './service';
const { confirm } = Modal; const { confirm } = Modal;
...@@ -58,25 +62,34 @@ const TableList = props => { ...@@ -58,25 +62,34 @@ const TableList = props => {
// const endDisabledDate = current => // const endDisabledDate = current =>
// current && (current.diff(startTime, 'days') > 30 || current.diff(startTime, 'days') < 0); // current && (current.diff(startTime, 'days') > 30 || current.diff(startTime, 'days') < 0);
const multiLogisticsModalRef = useRef();
const actionRef = useRef(); const actionRef = useRef();
const ref = useRef(FormInstance); const ref = useRef(FormInstance);
const handleCom = async (record, skuItem) => { const handleCom = async (skuInfo, expressInfo) => {
const tempObj = { const tempObj = {
expressCompanyCode: skuItem?.expressCompanyCode ?? '', expressCompanyCode: expressInfo?.expressCompanyCode ?? '',
expressCompanyName: skuItem.expressCompanyName ?? '', expressCompanyName: expressInfo.expressCompanyName ?? '',
deliveryNo: skuItem?.deliveryNo ?? '', deliveryNo: expressInfo?.expressNo ?? '',
detailList: [], detailList: [],
key: Date.now(), key: Date.now(),
}; };
const data = await getJDLogisticsInfo(skuItem.orderSkuId);
const res = await apiDeliveriesTraceList({
expressCompanyCode: expressInfo.expressCompanyCode,
expressNo: expressInfo.expressNo,
orderNo: skuInfo.orderNo,
});
const data = res.data[0];
console.log(data);
if (!data) { if (!data) {
notification.info({ message: '暂无物流信息' }); notification.info({ message: '暂无物流信息' });
return; return;
} }
tempObj.expressCompanyName = data?.logisticsName || tempObj.expressCompanyName; tempObj.expressCompanyName = data?.expressCompanyName || tempObj.expressCompanyName;
tempObj.deliveryNo = data?.logisticsBillNo || tempObj.deliveryNo; tempObj.deliveryNo = data?.expressNo || tempObj.deliveryNo;
if (data.logisticsList?.length) { if (data.traceList?.length) {
data.logisticsList.forEach(v => { data.traceList.forEach(v => {
tempObj.detailList = [...tempObj.detailList, ...v.detailList]; tempObj.detailList = [...tempObj.detailList, ...v.detailList];
}); });
} }
...@@ -109,30 +122,60 @@ const TableList = props => { ...@@ -109,30 +122,60 @@ const TableList = props => {
const renderContent = (record, key) => { const renderContent = (record, key) => {
if (record.mchOrderSkuVoList) { if (record.mchOrderSkuVoList) {
return record?.mchOrderSkuVoList.map((item, index) => ( return record?.mchOrderSkuVoList.map((item, index) => {
<p const tableContentHeight = item?.expressList?.length || 1;
className={[
'tableContent', return (
index < record?.mchOrderSkuVoList?.length - 1 ? 'border' : null, <div
].join(' ')} // eslint-disable-next-line prefer-template
key={item.orderSkuId} style={{ height: tableContentHeight * 60 + 'px' }}
> className={[
{key === 'skuName' ? <PopoverDom name={item[key]} url={item.imageUrl} /> : ''} 'tableContent',
{key === 'action' && props.type === 2 ? ( index < record?.mchOrderSkuVoList?.length - 1 ? 'border' : null,
<Button ].join(' ')}
size="small" key={item.orderSkuId}
type="primary" >
onClick={() => { {key === 'skuName' ? <PopoverDom name={item[key]} url={item.imageUrl} /> : ''}
handleCom(record, item); {key === 'expressCompanyName' ? (
}} <div className="expressList">
> {item.expressList?.map((info, idx) => (
查看物流 <span
</Button> className={[
) : ( 'subContent',
item[key] idx < item.expressList?.length - 1 ? 'border' : null,
)} ].join(' ')}
</p> >
)); {info.expressCompanyName}
</span>
))}
</div>
) : (
''
)}
{key === 'deliveryNo' ? (
<div className="expressList">
{item.expressList?.map((info, idx) => (
<a
onClick={() => {
handleCom(item, info);
}}
className={[
'subContent',
idx < item.expressList?.length - 1 ? 'border' : null,
].join(' ')}
>
{info.expressNo}
</a>
))}
</div>
) : (
''
)}
{item[key]}
</div>
);
});
} }
return ''; return '';
}; };
...@@ -148,7 +191,7 @@ const TableList = props => { ...@@ -148,7 +191,7 @@ const TableList = props => {
const columns = [ const columns = [
{ {
title: '订单ID', title: '订单号',
dataIndex: 'orderNo', dataIndex: 'orderNo',
key: 'orderNo', key: 'orderNo',
order: 6, order: 6,
...@@ -322,7 +365,7 @@ const TableList = props => { ...@@ -322,7 +365,7 @@ const TableList = props => {
title: '物流公司', title: '物流公司',
dataIndex: 'expressCompanyName', dataIndex: 'expressCompanyName',
key: 'expressCompanyName', key: 'expressCompanyName',
width: 100, width: 120,
className: 'colStyle', className: 'colStyle',
hideInSearch: true, hideInSearch: true,
render: (_, record) => renderContent(record, 'expressCompanyName'), render: (_, record) => renderContent(record, 'expressCompanyName'),
...@@ -331,20 +374,20 @@ const TableList = props => { ...@@ -331,20 +374,20 @@ const TableList = props => {
title: '物流单号', title: '物流单号',
dataIndex: 'deliveryNo', dataIndex: 'deliveryNo',
key: 'deliveryNo', key: 'deliveryNo',
width: 180, width: 210,
className: 'colStyle', className: 'colStyle',
hideInSearch: true, hideInSearch: true,
render: (_, record) => renderContent(record, 'deliveryNo'), render: (_, record) => renderContent(record, 'deliveryNo'),
}, },
{ // {
title: '物流信息', // title: '物流信息',
dataIndex: 'action', // dataIndex: 'action',
key: 'action', // key: 'action',
width: 150, // width: 150,
hideInSearch: true, // hideInSearch: true,
className: 'colStyle', // className: 'colStyle',
render: (_, record) => renderContent(record, 'action'), // render: (_, record) => renderContent(record, 'action'),
}, // },
{ {
title: '订单状态', title: '订单状态',
dataIndex: 'orderStatusDesc', dataIndex: 'orderStatusDesc',
...@@ -400,19 +443,30 @@ const TableList = props => { ...@@ -400,19 +443,30 @@ const TableList = props => {
marginBottom: '10px', marginBottom: '10px',
}} }}
onClick={async () => { onClick={async () => {
const skuListData = await getGoods(record?.orderId); // const skuListData = await getGoods(record?.orderId);
let logisticsData = [{}]; // let logisticsData = [{}];
setSkuList(skuListData); // setSkuList(skuListData);
const data = await getLogistics(record?.orderId); // const data = await getLogistics(record?.orderId);
logisticsData = data.map(item => ({ // logisticsData = data.map(item => ({
selectedGoods: item?.skus?.map(sku => sku?.orderSkuId), // selectedGoods: item?.skus?.map(sku => sku?.orderSkuId),
selectedCompany: item.expressCompanyCode // selectedCompany: item.expressCompanyCode
? `${item?.expressCompanyCode}-${item?.expressCompanyName}` // ? `${item?.expressCompanyCode}-${item?.expressCompanyName}`
: null, // : null,
orderNum: item?.deliveryNo, // orderNum: item?.deliveryNo,
})); // }));
setLogisticsData(logisticsData); // setLogisticsData(logisticsData);
handleModalVisible(true); // handleModalVisible(true);
const res = await apiQueryOrderInfo({
orderNo: record.orderNo,
});
multiLogisticsModalRef.current.open(
{
...record,
packageList: res.data.packageList || [],
},
actionRef,
);
}} }}
> >
{props.type === 2 ? '更新物流信息' : '填写物流信息'} {props.type === 2 ? '更新物流信息' : '填写物流信息'}
...@@ -566,6 +620,8 @@ const TableList = props => { ...@@ -566,6 +620,8 @@ const TableList = props => {
orderId={delayOrderIDs} orderId={delayOrderIDs}
onCancel={e => onCancelDelay(e)} onCancel={e => onCancelDelay(e)}
/> />
<MultiLogisticsModal companys={companys} ref={multiLogisticsModalRef} />
</PageHeaderWrapper> </PageHeaderWrapper>
); );
}; };
......
src/pages/orderManage/pendingDeliveryOrder/index.less
View file @ 332fdff5
...@@ -5,12 +5,30 @@ ...@@ -5,12 +5,30 @@
.tableContent { .tableContent {
display: flex; display: flex;
align-items: center; align-items: center;
height: 60px; // height: 60px;
padding: 16px; min-height: 60px;
padding: 0 12px;
} }
.border { .border {
border-bottom: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8;
} }
.subContent {
flex: 1;
padding: 12px;
overflow: hidden;
line-height: 36px;
white-space: nowrap;
text-overflow: ellipsis;
}
.expressList {
display: flex;
flex-direction: column;
width: calc(100% + 24px);
height: 100%;
margin: -12px;
}
tbody .colStyle { tbody .colStyle {
padding: 0; padding: 0;
} }
......
src/pages/orderManage/pendingDeliveryOrder/service.js
View file @ 332fdff5
...@@ -62,7 +62,7 @@ export async function getLogistics(orderId) { ...@@ -62,7 +62,7 @@ export async function getLogistics(orderId) {
export async function uploadFile(file) { export async function uploadFile(file) {
const params = new FormData(); const params = new FormData();
params.append('file', file); params.append('file', file);
const data = await request.post('/api/kdsp/op/mch-order/order-logistics-batch-import', { const data = await request.post('/api/merchants/orders/deliveries/batches/import', {
data: params, data: params,
prefix: config.kdspApi, prefix: config.kdspApi,
}); });
...@@ -71,7 +71,8 @@ export async function uploadFile(file) { ...@@ -71,7 +71,8 @@ export async function uploadFile(file) {
export function downTemplate() { export function downTemplate() {
window.location.href = window.location.href =
// 'https://kdspstatic.q-gp.com/%E8%AE%A2%E5%8D%95%E7%89%A9%E6%B5%81%E4%BF%A1%E6%81%AF%E5%AF%BC%E5%85%A5%E6%A8%A1%E6%9D%BF-v1.xlsx'; // 'https://kdspstatic.q-gp.com/%E8%AE%A2%E5%8D%95%E7%89%A9%E6%B5%81%E4%BF%A1%E6%81%AF%E5%AF%BC%E5%85%A5%E6%A8%A1%E6%9D%BF-v1.xlsx';
'https://kdspstatic.q-gp.com/order_import_templatev2.xlsx'; // 'https://kdspstatic.q-gp.com/order_import_templatev2.xlsx';
'https://sc-img.q-gp.com/orders/templates/batch_deliveries.xlsx';
} }
export async function downOrder(params) { export async function downOrder(params) {
const data = await request.post('/api/kdsp/op/mch-order/order-export', { const data = await request.post('/api/kdsp/op/mch-order/order-export', {
...@@ -151,3 +152,86 @@ export function apiDelayDeliverGoods(data) { ...@@ -151,3 +152,86 @@ export function apiDelayDeliverGoods(data) {
prefix: config.kdspApi, prefix: config.kdspApi,
}); });
} }
/**
* 多物流发货-查询多物流订单信息
* @param {*} params
* @returns
* @see http://yapi.quantgroups.com/project/389/interface/api/45840
*/
export function apiQueryOrderInfo(params) {
// return new Promise(resolve => {
// setTimeout(() => {
// resolve({
// packageList: [
// {
// expressCompanyCode: 'yunda',
// expressCompanyName: '',
// expressNo: 'YUNDA012345678',
// serialNumber: '0011223344',
// skuInfoList: [
// {
// skuNo: ['529355424931841'],
// quantity: '2',
// },
// {
// skuNo: ['530724210084865'],
// quantity: '12',
// },
// ],
// },
// {
// expressCompanyCode: 'yunda',
// expressCompanyName: '',
// expressNo: 'YUNDA012345678',
// serialNumber: '0011223344',
// skuInfoList: [
// {
// skuNo: ['529355424931841'],
// quantity: '2',
// },
// ],
// },
// ],
// });
// }, 1000);
// });
return request.get('/api/merchants/orders/deliveries/packages/detail', {
params,
prefix: config.kdspApi,
});
}
/**
* 多物流发货-新建发货/更新发货信息
* @param {*} data
* @returns
* @see http://yapi.quantgroups.com/project/389/interface/api/45816
*/
export function apiDeliveriesAdd(data) {
return request.post('/api/merchants/orders/deliveries/add', {
data,
prefix: config.kdspApi,
});
}
export function apiDeliveriesEdit(data) {
return request.post('/api/merchants/orders/deliveries/edit', {
data,
prefix: config.kdspApi,
});
}
/**
* 多物流发货-查询物流轨迹
* @see http://yapi.quantgroups.com/project/389/interface/api/46120
*/
export function apiDeliveriesTraceList(data) {
return request.post('/api/merchants/deliveries/trace/list', {
data: stringify(data),
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
prefix: config.kdspApi,
});
}
src/pages/orderManage/queryOrder/components/CustomTable/index.jsx
View file @ 332fdff5
...@@ -45,7 +45,7 @@ const CustomTable = props => { ...@@ -45,7 +45,7 @@ const CustomTable = props => {
subDataItem && subDataItem[key] !== undefined ? subDataItem[key] : dataSourceItem[key]; subDataItem && subDataItem[key] !== undefined ? subDataItem[key] : dataSourceItem[key];
let rowSpan = 1; let rowSpan = 1;
// 设置了自动合并 && 只设置第一条数据的值，其他的返回<></</> // 设置了自动合并 && 只设置第一条数据的值，其他的返回<></>
if (column.rowSpanMode === 'auto' && subData) { if (column.rowSpanMode === 'auto' && subData) {
rowSpan = subData.length; rowSpan = subData.length;
if (subDataIndex > 0) { if (subDataIndex > 0) {
......
src/pages/orderManage/queryOrder/index.jsx
View file @ 332fdff5
import { Form, Tabs, Input, Button, Pagination } from 'antd'; import { Form, Tabs, Input, Button, Pagination, notification } from 'antd';
import React, { useState, useEffect, useRef } from 'react'; import React, { useState, useEffect, useRef } from 'react';
import { PageHeaderWrapper } from '@ant-design/pro-layout'; import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { connect } from 'dva'; import { connect } from 'dva';
import { QUERY_ORDER } from '@/../config/permission.config'; import { QUERY_ORDER } from '@/../config/permission.config';
import { values } from 'lodash';
import style from './index.less'; import style from './index.less';
import { CustomTable } from './components/CustomTable/index'; import { CustomTable } from './components/CustomTable/index';
import { FormSearch, SEARCH_TYPE } from './components/FormSearch/index'; import { FormSearch, SEARCH_TYPE } from './components/FormSearch/index';
import LogisticsForm from './components/LogisticsFormModel'; import MultiLogisticsModal from '../pendingDeliveryOrder/components/MultiLogisticsModal';
import LogisticsCom from '../pendingDeliveryOrder/components/LogisticsCom';
import DetailModal from './components/DetailModal/index'; import DetailModal from './components/DetailModal/index';
import { queryOrderList, getGoods, getLogistics, queryExpress, queryToSend } from './service'; import { queryOrderList, getGoods, getLogistics, queryExpress, queryToSend } from './service';
import { apiQueryOrderInfo, apiDeliveriesTraceList } from '../pendingDeliveryOrder/service';
import { ORDER_SEARCH_TYPE, ORDER_TYPE, ORDER_STATUS } from './const'; import { ORDER_SEARCH_TYPE, ORDER_TYPE, ORDER_STATUS } from './const';
const { TabPane } = Tabs; const { TabPane } = Tabs;
...@@ -20,16 +23,15 @@ const OrderList = props => { ...@@ -20,16 +23,15 @@ const OrderList = props => {
const canEditable = permissions[QUERY_ORDER.EDITABLE]; const canEditable = permissions[QUERY_ORDER.EDITABLE];
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const detailModalRef = useRef(); const detailModalRef = useRef();
const multiLogisticsModalRef = useRef();
/** @module 发货弹框 */ /** @module 发货弹框 */
// 物流公司数据 // 物流公司数据
const [companys, setCompanys] = useState([]); const [companys, setCompanys] = useState([]);
// 物流弹出框展示
const [LogisticsModalVisible, handleModalVisible] = useState(false); /** @module 查看物流记录 */
// 订单下商品列表 const [LogisticsComList, setLogisticsComList] = useState({});
const [skuList, setSkuList] = useState([]); const [LogisticsComModalVisible, handleComModalVisible] = useState(false);
// 当前物流数据
const [LogisticsData, setLogisticsData] = useState([{}]);
/** @module 表格区域 */ /** @module 表格区域 */
const [tableData, setTableData] = useState([]); const [tableData, setTableData] = useState([]);
...@@ -95,12 +97,50 @@ const OrderList = props => { ...@@ -95,12 +97,50 @@ const OrderList = props => {
}); });
} }
// 获取物流记录信息
const handleCom = async (skuInfo, expressInfo) => {
const tempObj = {
expressCompanyCode: expressInfo?.expressCompanyCode ?? '',
expressCompanyName: expressInfo.expressCompanyName ?? '',
deliveryNo: expressInfo?.expressNo ?? '',
detailList: [],
key: Date.now(),
};
const res = await apiDeliveriesTraceList({
expressCompanyCode: expressInfo.expressCompanyCode,
expressNo: expressInfo.expressNo,
orderNo: skuInfo.orderNo,
});
const data = res.data[0];
console.log(data);
if (!data) {
notification.info({ message: '暂无物流信息' });
return;
}
tempObj.expressCompanyName = data?.expressCompanyName || tempObj.expressCompanyName;
tempObj.deliveryNo = data?.expressNo || tempObj.deliveryNo;
if (data.traceList?.length) {
data.traceList.forEach(v => {
tempObj.detailList = [...tempObj.detailList, ...v.detailList];
});
}
handleComModalVisible(true);
setLogisticsComList(tempObj);
};
// 重载 // 重载
const reload = () => { const reload = () => {
handleModalVisible(false);
getOrderList(); getOrderList();
}; };
const actionRef = {
current: {
reload,
},
};
// 获取物流公司列表 // 获取物流公司列表
const getCompanys = async () => { const getCompanys = async () => {
const res = await queryExpress(); const res = await queryExpress();
...@@ -267,9 +307,27 @@ const OrderList = props => { ...@@ -267,9 +307,27 @@ const OrderList = props => {
}, },
{ {
title: '配送方式', title: '配送方式',
dataIndex: 'deliveryType', dataIndex: 'deliveryMethodList',
rowSpanMode: 'auto', // rowSpanMode: 'auto',
width: 150, width: 150,
render: ({ value, record, subRecord }) => {
console.log(value);
const info = {
orderNo: record.orderNoStr,
};
return value?.map(item => (
<p>
{item.expressCompanyName}/
<a
onClick={() => {
handleCom(info, item);
}}
>
{item.expressNo}
</a>
</p>
));
},
}, },
{ {
title: '售后', title: '售后',
...@@ -315,19 +373,23 @@ const OrderList = props => { ...@@ -315,19 +373,23 @@ const OrderList = props => {
<Button <Button
type="primary" type="primary"
onClick={async () => { onClick={async () => {
const skuListData = await getGoods(record?.orderId); const res = await apiQueryOrderInfo({
let logisticsData = [{}]; orderNo: record.orderNoStr,
setSkuList(skuListData); });
const res = await getLogistics(record?.orderId);
logisticsData = res.map(item => ({ multiLogisticsModalRef.current.open(
selectedGoods: item?.skus?.map(sku => sku?.orderSkuId), {
selectedCompany: item.expressCompanyCode ...record,
? `${item?.expressCompanyCode}-${item?.expressCompanyName}` orderNo: record.orderNoStr,
: null, mchOrderSkuVoList: record.skuVos.map(item => ({
orderNum: item?.deliveryNo, ...item,
})); skuNo: item.skuId?.toString(),
setLogisticsData(logisticsData); orderNo: record.orderNoStr,
handleModalVisible(true); })),
packageList: res.data.packageList || [],
},
actionRef,
);
}} }}
> >
{text} {text}
...@@ -406,15 +468,14 @@ const OrderList = props => { ...@@ -406,15 +468,14 @@ const OrderList = props => {
)} )}
</div> </div>
<LogisticsForm <LogisticsCom
onSubmit={reload} onSubmit={reload}
skuList={skuList} onCancel={() => handleComModalVisible(false)}
companys={companys} modalVisible={LogisticsComModalVisible}
onCancel={() => handleModalVisible(false)} value={LogisticsComList}
modalVisible={LogisticsModalVisible} key={LogisticsComList.key}
value={LogisticsData}
/> />
<MultiLogisticsModal companys={companys} ref={multiLogisticsModalRef} />
<DetailModal ref={detailModalRef} /> <DetailModal ref={detailModalRef} />
</PageHeaderWrapper> </PageHeaderWrapper>
); );
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment