Skip to content

A
admin
提交 0fa78a51 作者: 龚洪江
操作

功能：商城订单列表联调

上级 6e8c5d9f
正在显示 包含 810 行增加 和 250 行删除
src/api/interface/orderManageType.ts
......@@ -192,7 +192,7 @@ export type orderDetailType = InterFunction<
actualRefund: number;
createTime: string;
id: number;
orderInfo: {};
orderInfo: any;
orderInfoId: number;
orderVcu: {
id: number;
......@@ -339,6 +339,20 @@ export type listExpressInfoType = InterFunction<
exCode: string;
}[]
>;
// 物流动态信息
export type logisticsDynamicsType = InterFunction<
{
/**
* exCode
*/
exCode: string;
/**
* exNo
*/
exNo: string;
},
any
>;
// web/小程序 确认收货-订单
export type renterTakeOrderType = InterFunction<
{
......@@ -862,3 +876,316 @@ export type flowDictionaryAndTimeType = InterFunction<
};
}
>;
// 商城订单-列表（新）
type mallOrderType = {
/**
* 卖家企业名称
*/
companyName?: string;
/**
* 确认收货时间
*/
confirmReceiptTime?: Date;
/**
* 下单时间
*/
createTime: string;
/**
* 订单交期
*/
deliveryTime?: Date;
/**
* id
*/
id: number;
kdnExpDTO?: {
logisticCode?: string;
shipperCode?: string;
stateEx?: string;
traces?: {
acceptStation?: string;
acceptTime?: string;
action?: string;
location?: string;
}[];
};
/**
* 订单编号
*/
orderNo?: string;
/**
* 订单实付总额
*/
orderTotalAmount?: number;
/**
* 订单类型，0正常订单、1意向订单
*/
orderType?: number;
/**
* 其他方式支付额度
*/
otherAmount?: number;
/**
* 用户支付凭证
*/
payDTOList?: {
/**
* 审核状态，0待审批，1通过，2未通过
*/
checkStatus?: number;
/**
* 提交时间
*/
createTime?: Date;
/**
* id
*/
id?: number;
/**
* 支付凭证
*/
payImgList?: string;
/**
* 备注信息
*/
payRemark?: string;
/**
* 未通过原因
*/
refuseReason?: string;
/**
* 订单id
*/
uavOrderId?: number;
}[];
/**
* 支付时间
*/
payTime?: Date;
/**
* 支付方式，wechatpay微信，alipay支付宝
*/
payType?: string;
/**
* 评价状态
*/
remarkStatus?: number;
/**
* 卖家备注
*/
sellerRemark?: string;
/**
* 抵扣云享金余额
*/
shareAmount?: number;
/**
* 订单规格列表
*/
skuDTOList: {
/**
* 下单时间
*/
createTime?: Date;
/**
* 订单规格id
*/
id?: number;
/**
* 商品id
*/
mallGoodsId?: number;
/**
* 购买数量
*/
orderNum: number;
/**
* 商品规格id
*/
priceStockId?: number;
/**
* 商品规格
*/
productSpec: string;
/**
* 商品规格图片
*/
skuImage?: string;
/**
* 商品规格编号
*/
skuNo?: string;
/**
* 商品名称
*/
tradeName?: string;
/**
* 订单id
*/
uavOrderId?: number;
/**
* 单价
*/
unitPrice?: number;
}[];
/**
* 订单状态
*/
statusCode: number;
/**
* 卖家id
*/
thirdBackUserAccountId?: number;
uavOrderExpressDTO: {
/**
* id
*/
id: number;
/**
* 是否已取件，0未取，1已取
*/
receive?: number;
/**
* 取件时间
*/
receiveTime?: Date;
/**
* 快递编码
*/
sendExpCode?: string;
/**
* 快递编号
*/
sendExpNo?: string;
/**
* 发货-收货详细地址
*/
takeAddress: string;
/**
* 取货人
*/
takeName: string;
/**
* 取货人号码
*/
takePhone: string;
/**
* 地区信息
*/
takeRegion: string;
/**
* 订单id
*/
uavOrderId: number;
};
/**
* 最近修改时间
*/
updateTime?: Date;
/**
* 买家id
*/
userAccountId?: number;
/**
* 收货地址id
*/
userAddressId?: number;
/**
* 买家备注
*/
userRemark?: string;
/**
* 修改版本
*/
version?: number;
/**
* 抵扣钱包余额
*/
walletAmount?: number;
};
export type mallOrderListType = InterListFunction<
{
/**
* 结束时间
*/
endTime?: string;
/**
* 关键字-订单编号
*/
keyword?: string;
/**
* 开始时间
*/
startTime?: string;
/**
* 订单状态码
*/
statusCode?: number;
/**
* 用户uid
*/
uid?: string;
},
mallOrderType
>;
// 商城订单-详情（新）
export type mallOrderDetailType = InterFunction<{ id: number }, mallOrderType>;
// 商城订单-状态字典（新）
export type mallOrderStatusType = InterFunction<
any,
{
code: number;
nextCode: number;
status: string;
id: number;
}[]
>;
// 商城订单-发货
export type mallOrderSendType = InterFunction<
{
/**
* 快递编码
*/
sendExpCode?: string;
/**
* 快递编号
*/
sendExpNo?: string;
/**
* 发货-收货详细地址
*/
takeAddress?: string;
/**
* 取货人
*/
takeName?: string;
/**
* 取货人号码
*/
takePhone?: string;
/**
* 地区信息
*/
takeRegion?: string;
/**
* 订单id
*/
uavOrderId?: number;
},
any
>;
// 商城订单-卖家备注
export type sellerRemarkType = InterFunction<
{
/**
* content
*/
content: string;
/**
* id
*/
id: number;
},
any
>;
src/api/modules/orderManage.ts
......@@ -8,6 +8,11 @@ import {
listPageManagerVerOne,
listPcWechatOrderType,
listTranStatusType,
logisticsDynamicsType,
mallOrderDetailType,
mallOrderListType,
mallOrderSendType,
mallOrderStatusType,
orderDetailType,
orderImageDetailType,
orderListStatus,
......@@ -15,6 +20,7 @@ import {
platFormCloseOrderType,
refundOrderType,
renterTakeOrderType,
sellerRemarkType,
sendOrderWareType,
serviceOrderFormDetailsType,
serviceOrderFormListType,
......@@ -54,6 +60,9 @@ export class OrderManageAPI {
// v1.0.1 物流公司列表-字典
static listExpressInfo: listExpressInfoType = (params) =>
axios.get('/oms/express/listExpressInfo', { params });
// 物流动态信息
static getLogisticsDynamics: logisticsDynamicsType = (params) =>
axios.get('/oms/express/logisticsDynamics', { params });
// web-小程序——订单详情相关图片信息
static orderImageDetail: orderImageDetailType = (params) =>
......@@ -96,4 +105,17 @@ export class OrderManageAPI {
// 需求订单-进度条
static getFlowDictionary: flowDictionaryType = () =>
axios.get('/release/requirements/flowDictionary');
// 商城订单-列表（新）
static getMallOrderList: mallOrderListType = (data) => axios.post('/oms/uav-order/list', data);
// 商城订单-状态字典（新）
static getMallOrderStatusList: mallOrderStatusType = () => axios.get('/oms/uav-order/statusList');
// 商城订单-详情（新）
static getMallOrderDetail: mallOrderDetailType = (params) =>
axios.get('/oms/uav-order/detail', { params });
// 商城订单-发货（新）
static mallOrderSend: mallOrderSendType = (data) => axios.post('/oms/uav-order/send', data);
// 商城订单-卖家备注
static sellerRemark: sellerRemarkType = (params) =>
axios.get('/oms/uav-order/sellerRemark', { params });
}
src/pages/depleteManage/withDrawList/index.tsx
......@@ -128,6 +128,7 @@ const WithDrawManage = () => {
},
];
const [tableData, setTableData] = useState<withdrawalApplyType>([]);
const [loading, setLoading] = useState<boolean>(false);
const [pagination, setPagination] = useState<PaginationProps & { totalCount: number }>({
pageNo: 1,
pageSize: 10,
......@@ -141,11 +142,13 @@ const WithDrawManage = () => {
// 获取提现列表
const getListPageWithdrawalApply = (query?: withdrawalApplyParameterType) => {
setLoading(true);
DepleteManageTypeAPI.getListPageWithdrawalApply({
pageNo: pagination.pageNo,
pageSize: pagination.pageSize,
...query,
}).then(({ result }) => {
setLoading(false);
pagination.totalCount = result.totalCount;
setPagination({ ...pagination });
setTableData(result.list || []);
......@@ -189,6 +192,7 @@ const WithDrawManage = () => {
columns={tableColumns}
rowKey='id'
dataSource={tableData}
loading={loading}
pagination={{
total: pagination.totalCount,
pageSize: pagination.pageSize,
......
src/pages/orderManage/productOrder/orderDetail/comp/detailDelivery/index.tsx
import React, { useEffect } from 'react';
import { Button } from 'antd';
import { getMallOrderDetailById } from '~/api/interface/orderManageType';
import React, { useEffect, useState } from 'react';
import { Button, Steps } from 'antd';
import { mallOrderDetailType } from '~/api/interface/orderManageType';
import { InterDataType } from '~/api/interface';
import { OrderManageAPI } from '~/api';
import LogisticsStepModal from '../logisticsStepModal';
// 接口返回的类型
type DataType = InterDataType<getMallOrderDetailById>;
type DataType = InterDataType<mallOrderDetailType>;
// 参数类型
type PropsType = {
detail: DataType;
detail: DataType | undefined;
};
const DetailDelivery: React.FC<PropsType> = (props) => {
const { detail } = props;
// 物流列表
const [expressList, setExpressList] = React.useState<{ label: string; value: string }[]>([]);
// 获取物流信息
const getListExpressInfo = async () => {
const res = await OrderManageAPI.listExpressInfo({});
if (res && res.code === '200') {
setExpressList(res.result.map((item) => ({ label: item.exName, value: item.exCode })));
// console.log(res);
}
const DetailDelivery: React.FC<PropsType> = ({ detail }) => {
const [logisticsStepModalShow, setLogisticsStepModalShow] = useState<boolean>(false);
const [listExpressInfo, setListExpressInfo] = useState<{ label: string; value: string }[]>([]);
//获取物流公司列表
const getExpressList = () => {
OrderManageAPI.listExpressInfo().then(({ result }) => {
setListExpressInfo(result?.map((v) => ({ label: v.exName, value: v.exCode })) || []);
});
};
// 转换物流信息
const getExpressInfo = (code: string | undefined | null) => {
return expressList.find((item) => item.value === code)?.label || code;
const showStepModal = () => {
setLogisticsStepModalShow(true);
};
const logisticsStepModalCancel = () => {
setLogisticsStepModalShow(false);
};
// componentDidMount
useEffect(() => {
getListExpressInfo().then();
getExpressList();
}, []);
return (
<div className={'detail-delivery detail-half'}>
<div className={'detail-title'}>发货信息</div>
<div className={'detail-text'}>收货人：{detail?.receipt?.takeName}</div>
<div className={'detail-text'}>手机号：{detail?.receipt?.takePhone}</div>
<div className={'detail-text'}>收货地址：{detail?.receipt?.detailAddress}</div>
<div className={'detail-text'}>物流单号：{detail?.receipt?.sendExNo}</div>
<div className={'detail-text'}>物流公司：{getExpressInfo(detail?.receipt?.sendExCode)}</div>
<div className={'detail-text'}>
物流进度：-- <Button type={'link'}>查看详情</Button>
</div>
<div className={'detail-title'}>归还信息</div>
<div className={'detail-text'}>收货人：{detail?.receipt?.renName}</div>
<div className={'detail-text'}>手机号：{detail?.receipt?.renPhone}</div>
<div className={'detail-text'}>收货地址：{detail?.receipt?.renAddress}</div>
<div className={'detail-text'}>物流单号：{detail?.receipt?.renExNo}</div>
<div className={'detail-text'}>物流公司：{getExpressInfo(detail?.receipt?.renExCode)}</div>
<div className={'detail-text'}>
物流进度：-- <Button type={'link'}>查看详情</Button>
return (
<div className='detail-delivery detail-half'>
<div className='detail-title'>发货信息</div>
<div className='detail-text'>收货人：{detail?.uavOrderExpressDTO?.takeName}</div>
<div className='detail-text'>手机号：{detail?.uavOrderExpressDTO?.takePhone}</div>
<div className='detail-text'>
收货地址：
{(detail?.uavOrderExpressDTO.takeRegion.split('/').join('') || '') +
detail?.uavOrderExpressDTO.takeAddress}
</div>
{detail?.uavOrderExpressDTO?.sendExpCode && (
<>
<div className='detail-text'>物流单号：{detail?.uavOrderExpressDTO?.sendExpNo}</div>
<div className='detail-text'>
物流公司：
{
listExpressInfo.find((v) => v.value === detail?.uavOrderExpressDTO?.sendExpCode)
?.label
}
</div>
<div className='detail-text' style={{ display: 'flex' }}>
<span>物流进度：</span>
<div>
<Steps
direction='vertical'
current={0}
progressDot
items={[
{
title: detail?.kdnExpDTO?.traces?.[0].acceptStation,
description: detail?.kdnExpDTO?.traces?.[0].acceptTime,
},
{
title: `送至${
detail?.uavOrderExpressDTO?.takeRegion.split('/').join('') +
detail?.uavOrderExpressDTO?.takeAddress
}`,
},
]}
/>
</div>
<div>
<Button type='link' onClick={showStepModal}>
查看详情
</Button>
</div>
</div>
</>
)}
<LogisticsStepModal
open={logisticsStepModalShow}
onCancel={logisticsStepModalCancel}
logisticsStep={detail?.kdnExpDTO}
/>
</div>
);
};
......
src/pages/orderManage/productOrder/orderDetail/comp/detailInformation/index.scss 0 → 100644
.mall-sku-item{
display: flex;
align-items: center;
margin-bottom: 10px;
.sku-img{
width: 48px;
height: 48px;
}
.sku-info{
margin-left: 10px;
line-height: 16px;
text-align: left;
.info-name{
color:#1677ff
}
.info-spec{
margin-top: 10px;
span:not(:last-child){
&:after{
content: '；';
}
}
}
}
}
src/pages/orderManage/productOrder/orderDetail/comp/detailInformation/index.tsx
import React, { useEffect, useState } from 'react';
import { Table } from 'antd';
import { Image, Table } from 'antd';
import { ColumnsType } from 'antd/es/table';
import { InterDataType } from '~/api/interface';
import { orderDetailType } from '~/api/interface/orderManageType';
import dayjs from 'dayjs';
import { mallOrderDetailType } from '~/api/interface/orderManageType';
import './index.scss';
import { OrderManageAPI } from '~/api';
// 表格数据类型
type TableType = any;
// 接口返回的类型
type DataType = InterDataType<orderDetailType>;
type DataType = InterDataType<mallOrderDetailType>;
// 参数类型
type PropsType = {
detail: DataType;
detail: DataType | undefined;
};
const DetailInformation: React.FC<PropsType> = (props) => {
const { detail } = props;
// 表格数据
const [tableData, setTableData] = useState<TableType>([]);
// 表格结构
const columns: ColumnsType<TableType[0]> = [
const columns: ColumnsType<DataType['skuDTOList'][0]> = [
{
title: '商品',
dataIndex: 'wareTitle',
align: 'center',
width: '20%',
render: (_text, record) => (
<div className='mall-sku-item'>
<Image src={record.skuImage} className='sku-img' />
<div className='sku-info'>
<div className='info-name'>{record.tradeName}</div>
<div className='info-spec'>
{Object.entries(JSON.parse(record.productSpec)).map((v, index) => (
<span key={index}>{v.join('：')}</span>
))}
</div>
</div>
</div>
),
},
{
title: '单价(元)',
title: '单价（元）',
dataIndex: 'unitPrice',
align: 'center',
render: (text) => `￥${text?.toLocaleString()}`,
},
{
title: '数量',
dataIndex: 'wareNum',
dataIndex: 'orderNum',
align: 'center',
},
{
title: '订单状态',
dataIndex: 'waiting',
align: 'center',
render: () => orderStatusList.find((v) => v.value === detail?.statusCode)?.label,
},
{
title: '应收款',
dataIndex: 'shouldPay',
title: '订单金额（元）',
align: 'center',
render: (text) => `￥${text?.toLocaleString()}`,
render: () => `￥${detail?.orderTotalAmount}`,
},
];
// 订单状态
const [orderStatusList, setOrderStatusList] = useState<{ value: number; label: string }[]>([]);
// 获取订单状态
const getOrderStatus = () => {
OrderManageAPI.getMallOrderStatusList().then(({ result }) => {
if (result) {
const list = result.map((item) => ({ value: item.code, label: item.status }));
setOrderStatusList(list);
}
});
};
useEffect(() => {
if (!detail) return;
setTableData([
{
id: 1,
wareTitle: detail?.wareTitle,
unitPrice: detail?.unitPrice,
wareNum: detail?.wareNum,
waiting: detail?.waiting,
shouldPay: detail?.shouldPay,
},
]);
}, [detail]);
getOrderStatus();
}, []);
return (
<div className={'detail-information'}>
<div className={'detail-title'}>订单明细</div>
<div className={'detail-text'}>
<span className={'item'}>订单编号：{detail?.orderNo}</span>
<span className={'item'} style={{ display: 'none' }}>
合同编号：UAV202334741131
</span>
<span className={'item'}>
订单租期：
{dayjs(detail?.startDate).format('YYYY-MM-DD')}
{' ~ '}
{dayjs(detail?.endDate).format('YYYY-MM-DD')}
</span>
<span className={'item'}>创建时间：{detail?.createTime}</span>
<div className='detail-information'>
<div className='detail-title'>订单明细</div>
<div className='detail-text'>
<span className='item'>订单编号：{detail?.orderNo}</span>
<span className='item'>创建时间：{detail?.createTime}</span>
{/*<span className={'item'} style={{ display: 'none' }}>*/}
{/* 合同编号：UAV202334741131*/}
{/*</span>*/}
{/*<span className={'item'}>*/}
{/* 订单租期：*/}
{/* {dayjs(detail?.startDate).format('YYYY-MM-DD')}*/}
{/* {' ~ '}*/}
{/* {dayjs(detail?.endDate).format('YYYY-MM-DD')}*/}
{/*</span>*/}
</div>
<Table
style={{ margin: '20px auto', width: '90%' }}
size='small'
dataSource={tableData}
dataSource={detail?.skuDTOList || []}
columns={columns}
rowKey='id'
bordered
pagination={false}
// rowSelection={{ selectedRowKeys, onChange: onSelectChange }}
/>
<div className='detail-price'>
实收款<span className={'num'}>￥ {detail?.actualPay}</span>元
</div>
</div>
);
};
......
src/pages/orderManage/productOrder/orderDetail/comp/detailPurchaser/index.tsx
import React from 'react';
import { Button, Image } from 'antd';
import { getMallOrderDetailById } from '~/api/interface/orderManageType';
import { getMallOrderDetailById, mallOrderDetailType } from '~/api/interface/orderManageType';
import { InterDataType } from '~/api/interface';
// 接口返回的类型
type DataType = InterDataType<getMallOrderDetailById>;
type DataType = InterDataType<mallOrderDetailType>;
// 参数类型
type PropsType = {
detail: DataType;
detail: DataType | undefined;
};
const DetailPurchaser: React.FC<PropsType> = (props) => {
const { detail } = props;
const DetailPurchaser: React.FC<PropsType> = ({ detail }) => {
return (
<div className={'detail-purchaser detail-half'}>
<div className={'detail-title'}>买家信息</div>
<div className={'detail-text'}>UID：{detail?.uid}</div>
<div className={'detail-text'}>姓名： {detail?.userName}</div>
<div className={'detail-text'}>手机号： {detail?.phoneNum}</div>
{/*<div className={'detail-text'}>企业： 浙江科比特创新科技有限公司</div>*/}
<div className={'detail-text'}>备注： {detail?.remark}</div>
<div className={'detail-text'}>UID：</div>
<div className={'detail-text'}>姓名： </div>
<div className={'detail-text'}>手机号： </div>
<div className={'detail-text'}>备注：</div>
<div style={{ display: 'none' }}>
<div className={'detail-title'}>合同信息</div>
<div className={'detail-text'}>合同编号： UAV202334741131</div>
<div className={'detail-text'}>合同状态： 已归档</div>
<div className={'detail-text'}>
合同操作：
<Button type={'link'}>平台签署</Button>
<Button type={'link'}>查看</Button>
<Button type={'link'}>下载</Button>
</div>
</div>
{/*<div style={{ display: 'none' }}>*/}
{/* <div className={'detail-title'}>合同信息</div>*/}
{/* <div className={'detail-text'}>合同编号： UAV202334741131</div>*/}
{/* <div className={'detail-text'}>合同状态： 已归档</div>*/}
{/* <div className={'detail-text'}>*/}
{/* 合同操作：*/}
{/* <Button type={'link'}>平台签署</Button>*/}
{/* <Button type={'link'}>查看</Button>*/}
{/* <Button type={'link'}>下载</Button>*/}
{/* </div>*/}
{/*</div>*/}
<div className={'detail-title'}>付款凭证</div>
<div className={'detail-text'}>预付款：</div>
<div className={'detail-image'}>
{[
'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',
'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',
].map((i, j) => (
<Image key={j} className={'image'} src={i} alt='付款凭证' />
))}
</div>
<div className={'detail-text'}>尾款：</div>
<div className={'detail-image'}>
{[
'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',
'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',
].map((i, j) => (
<Image key={j} className={'image'} src={i} alt='付款凭证' />
))}
</div>
<div className={'detail-text'}>全款：</div>
<div className={'detail-image'}>
{[
'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',
'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',
].map((i, j) => (
<Image key={j} className={'image'} src={i} alt='付款凭证' />
))}
</div>
{/*<div className={'detail-title'}>付款凭证</div>*/}
{/*<div className={'detail-text'}>预付款：</div>*/}
{/*<div className={'detail-image'}>*/}
{/* {[*/}
{/* 'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',*/}
{/* 'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',*/}
{/* ].map((i, j) => (*/}
{/* <Image key={j} className={'image'} src={i} alt='付款凭证' />*/}
{/* ))}*/}
{/*</div>*/}
{/*<div className={'detail-text'}>尾款：</div>*/}
{/*<div className={'detail-image'}>*/}
{/* {[*/}
{/* 'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',*/}
{/* 'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',*/}
{/* ].map((i, j) => (*/}
{/* <Image key={j} className={'image'} src={i} alt='付款凭证' />*/}
{/* ))}*/}
{/*</div>*/}
{/*<div className={'detail-text'}>全款：</div>*/}
{/*<div className={'detail-image'}>*/}
{/* {[*/}
{/* 'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',*/}
{/* 'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/infrastructure-05-05.png',*/}
{/* ].map((i, j) => (*/}
{/* <Image key={j} className={'image'} src={i} alt='付款凭证' />*/}
{/* ))}*/}
{/*</div>*/}
</div>
);
};
......
src/pages/orderManage/productOrder/orderDetail/comp/logisticsStepModal/index.tsx 0 → 100644
import { Modal, ModalProps, Steps } from 'antd';
import React, { FC } from 'react';
import { InterDataType } from '~/api/interface';
import { mallOrderDetailType } from '~/api/interface/orderManageType';
// 商品订单详情返回类型
type DataType = InterDataType<mallOrderDetailType>;
interface selfProps {
logisticsStep: DataType['kdnExpDTO'];
}
const LogisticsStepModal: FC<ModalProps & selfProps> = ({ open, onCancel, logisticsStep }) => {
return (
<Modal open={open} title='物流进度' onCancel={onCancel} footer={false}>
<Steps
direction='vertical'
current={(logisticsStep?.traces?.length || 1) - 1}
progressDot
items={logisticsStep?.traces?.map((v) => ({
title: v.acceptStation,
description: v.acceptTime,
}))}
/>
</Modal>
);
};
export default LogisticsStepModal;
src/pages/orderManage/productOrder/orderDetail/index.scss
......@@ -3,24 +3,7 @@
box-sizing: border-box;
.order-head {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
.head-text {
font-size: 13px;
font-weight: 600;
color: #000000;
div {
margin-bottom: 10px;
span {
margin-right: 20px;
}
}
}
text-align: right;
}
.detail-wrap {
......
src/pages/orderManage/productOrder/orderDetail/index.tsx
......@@ -5,12 +5,12 @@ import './index.scss';
import DetailDelivery from './comp/detailDelivery';
import DetailPurchaser from './comp/detailPurchaser';
import DetailInformation from './comp/detailInformation';
import { getMallOrderDetailById } from '~/api/interface/orderManageType';
import { mallOrderDetailType } from '~/api/interface/orderManageType';
import { InterDataType } from '~/api/interface';
import { OrderManageAPI } from '~/api';
// 接口返回的类型
type DataType = InterDataType<getMallOrderDetailById>;
type DataType = InterDataType<mallOrderDetailType>;
function ProductOrderDetail() {
// 路由钩子
......@@ -19,59 +19,34 @@ function ProductOrderDetail() {
const [searchParams] = useSearchParams();
// 接收到的参数
const id = searchParams.get('id');
// 订单状态
const [orderStatusList, setOrderStatusList] = useState<{ value: number; label: string }[]>([]);
// 返回上一页
const handleBack = () => {
navigate(-1);
};
// 订单详情
const [orderDetail, setOrderDetail] = useState<DataType>(null!);
const [orderDetail, setOrderDetail] = useState<DataType>();
// 获取订单详情
const getOrderDetail = async () => {
const res = await OrderManageAPI.getMallOrderDetailById({
orderId: Number(id),
const res = await OrderManageAPI.getMallOrderDetail({
id: Number(id),
});
if (res && res.code === '200') {
setOrderDetail(res.result);
}
};
// 获取订单状态
const getOrderStatus = async () => {
const res = await OrderManageAPI.orderListStatus({});
if (res && res.code === '200') {
const list = res.result.map((item) => ({ value: item.code, label: item.status }));
setOrderStatusList(list);
}
};
// componentDidMount
useEffect(() => {
getOrderStatus().then();
getOrderDetail().then();
// console.log('拿到的id是 --->', id);
}, [id]);
}, []);
return (
<div className={'order-detail'}>
<div className={'order-head'}>
<div className='head-text'>
<div>
<span>订单编号：{orderDetail?.orderNo}</span>
{/*<span>合同编号：UAV202334741131</span>*/}
</div>
<div>
<span>
当前状态：
{orderStatusList?.find((i) => i.value === orderDetail?.statusCode)?.label ||
orderDetail?.statusCode}
</span>
<span>创建时间：{orderDetail?.createTime}</span>
</div>
</div>
<Button type={'primary'} onClick={() => handleBack()}>
<div className='order-detail'>
<div className='order-head'>
<Button type='primary' onClick={() => handleBack()}>
返回
</Button>
</div>
<div className={'detail-wrap'}>
<div className='detail-wrap'>
<DetailPurchaser detail={orderDetail} />
<DetailDelivery detail={orderDetail} />
<DetailInformation detail={orderDetail} />
......
src/pages/orderManage/productOrder/orderList/components/distributionOrder/index.tsx deleted 100644 → 0
import { Form, Modal, ModalProps, Select } from 'antd';
import { FC } from 'react';
interface selfProps {
onCancel: () => void;
onOk: () => void;
}
const DistributionOrder: FC<ModalProps & selfProps> = ({ open, onCancel, onOk }) => {
const handleOk = () => {
onOk();
};
const handleCancel = () => {
onCancel();
};
return (
<Modal open={open} title='分配订单' onOk={handleOk} onCancel={handleCancel}>
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 16 }}>
<Form.Item label='订单编号'></Form.Item>
<Form.Item label='订单名称'></Form.Item>
<Form.Item label='分配运营' rules={[{ required: true, message: '请选择运营人员' }]}>
<Select placeholder='请选择运营人员'></Select>
</Form.Item>
</Form>
</Modal>
);
};
export default DistributionOrder;
src/pages/orderManage/productOrder/orderList/components/remarkModal/index.tsx 0 → 100644
import { FC, useEffect } from 'react';
import { Form, Modal, ModalProps, Input, message } from 'antd';
import { InterListType } from '~/api/interface';
import { mallOrderListType } from '~/api/interface/orderManageType';
import { OrderManageAPI } from '~/api';
type mallOrderType = InterListType<mallOrderListType>[0];
interface selfProps {
onOk: () => void;
onCancel: () => void;
mallOrderItem: mallOrderType | undefined;
}
const RemarkModal: FC<ModalProps & selfProps> = ({ open, onCancel, onOk, mallOrderItem }) => {
const [form] = Form.useForm<{ content: string }>();
const handleOk = () => {
if (mallOrderItem) {
form.validateFields().then((value) => {
OrderManageAPI.sellerRemark({ ...value, id: mallOrderItem.id }).then(({ code }) => {
if (code === '200') {
message.success('操作成功');
onOk();
form.resetFields();
}
});
});
}
};
const handleCancel = () => {
form.resetFields();
onCancel();
};
useEffect(() => {
if (mallOrderItem) {
form.setFieldValue('content', mallOrderItem.sellerRemark || undefined);
}
}, [mallOrderItem]);
return (
<Modal open={open} onOk={handleOk} onCancel={handleCancel} title='备注'>
<Form labelCol={{ span: 2 }} wrapperCol={{ span: 20 }} form={form}>
<Form.Item label='备注' name='content'>
<Input.TextArea placeholder='请输入备注' maxLength={70} showCount />
</Form.Item>
</Form>
</Modal>
);
};
export default RemarkModal;
src/pages/orderManage/productOrder/orderList/components/shipmentsOrder/index.tsx
import { FC } from 'react';
import { Cascader, Form, Input, Modal, ModalProps, Select } from 'antd';
import { FC, useEffect, useState } from 'react';
import { Cascader, Form, Input, message, Modal, ModalProps, Select } from 'antd';
import { CommonAPI, OrderManageAPI } from '~/api';
import { InterDataType, InterListType, InterReqType } from '~/api/interface';
import { getSecondDistrictInfoType } from '~/api/interface/commonType';
import { mallOrderListType, mallOrderSendType } from '~/api/interface/orderManageType';
// 地址返回类型
type locationType = InterDataType<getSecondDistrictInfoType>;
type mallOrderType = InterListType<mallOrderListType>[0];
// 发货请求类型
type sendMallType = InterReqType<mallOrderSendType>;
interface selfProps {
currentOrderItem: mallOrderType | undefined;
onCancel: () => void;
onOk: () => void;
}
const ShipmentsOrder: FC<ModalProps & selfProps> = ({ onOk, onCancel, open }) => {
const ShipmentsOrder: FC<ModalProps & selfProps> = ({ onOk, onCancel, open, currentOrderItem }) => {
const [form] = Form.useForm<sendMallType>();
const [listExpressInfo, setListExpressInfo] = useState<{ label: string; value: string }[]>([]);
const [location, setLocation] = useState<locationType>([]);
//获取物流公司列表
const getExpressList = () => {
OrderManageAPI.listExpressInfo().then(({ result }) => {
setListExpressInfo(result?.map((v) => ({ label: v.exName, value: v.exCode })) || []);
});
};
// 获取地址信息
const getLocation = () => {
CommonAPI.getSecondDistrictInfo().then(({ result }) => {
setLocation(result || []);
});
};
const handleOk = () => {
onOk();
form.validateFields().then((value) => {
OrderManageAPI.mallOrderSend({ ...value, uavOrderId: currentOrderItem?.id }).then(
({ code }) => {
if (code === '200') {
message.success('发货成功');
form.resetFields();
onOk();
}
},
);
});
};
const handleCancel = () => {
form.resetFields();
onCancel();
};
useEffect(() => {
if (open) {
getLocation();
getExpressList();
}
}, [open]);
useEffect(() => {
if (currentOrderItem && open) {
form.setFieldsValue({
takeName: currentOrderItem.uavOrderExpressDTO.takeName,
takePhone: currentOrderItem.uavOrderExpressDTO.takePhone,
takeRegion: currentOrderItem.uavOrderExpressDTO.takeRegion,
takeAddress: currentOrderItem.uavOrderExpressDTO.takeAddress,
});
}
}, [currentOrderItem]);
return (
<Modal open={open} title='发货' onOk={handleOk} onCancel={handleCancel}>
<Form
......@@ -20,6 +77,7 @@ const ShipmentsOrder: FC<ModalProps & selfProps> = ({ onOk, onCancel, open }) =>
wrapperCol={{ span: 16 }}
initialValues={{ remember: true }}
autoComplete='off'
form={form}
>
<Form.Item
label='物流公司'
......@@ -31,7 +89,7 @@ const ShipmentsOrder: FC<ModalProps & selfProps> = ({ onOk, onCancel, open }) =>
},
]}
>
<Select placeholder='请选择物流公司' allowClear></Select>
<Select placeholder='请选择物流公司' allowClear options={listExpressInfo}></Select>
</Form.Item>
<Form.Item
label='物流编号'
......@@ -43,31 +101,35 @@ const ShipmentsOrder: FC<ModalProps & selfProps> = ({ onOk, onCancel, open }) =>
},
]}
>
<Input placeholder='请输入物流编号' allowClear />
<Input placeholder='请输入物流编号' allowClear maxLength={50} />
</Form.Item>
<Form.Item
label='用户姓名'
name='takeName'
// rules={[
// {
// validator: validateUserName,
// required: true,
// },
// ]}
rules={[
{
required: true,
message: '请输入用户姓名',
},
]}
>
<Input placeholder='请输入用户姓名' allowClear />
<Input placeholder='请输入用户姓名' allowClear maxLength={30} />
</Form.Item>
<Form.Item
label='手机号'
name='takePhone'
// rules={[
// {
// validator: validatePhone,
// required: true,
// },
// ]}
rules={[
{
required: true,
message: '请输入手机号',
},
{
pattern: /^1[3-9]\d{9}$/,
message: '手机号格式不正确',
},
]}
>
<Input placeholder='请输入手机号' allowClear />
<Input placeholder='请输入手机号' allowClear maxLength={30} />
</Form.Item>
<Form.Item
label='收货地址'
......@@ -80,7 +142,7 @@ const ShipmentsOrder: FC<ModalProps & selfProps> = ({ onOk, onCancel, open }) =>
]}
>
<Cascader
// options={location}
options={location}
placeholder='请选择收货地址'
allowClear
fieldNames={{
......@@ -96,11 +158,11 @@ const ShipmentsOrder: FC<ModalProps & selfProps> = ({ onOk, onCancel, open }) =>
rules={[
{
required: false,
message: '请输入收货地址',
message: '请输入详细地址',
},
]}
>
<Input.TextArea maxLength={70} showCount placeholder='请输入收货地址' allowClear />
<Input.TextArea maxLength={70} showCount placeholder='请输入详细地址' allowClear />
</Form.Item>
</Form>
</Modal>
......
src/pages/orderManage/productOrder/orderList/index.scss 0 → 100644
.order-table-item {
.item-td {
position: absolute;
top: 0;
left: 0;
height: 40px;
width: 100%;
background: rgba(22, 119, 255, 0.1);
line-height: 40px;
}
.item-tr {
min-height: 50px;
width: 100%;
margin-top: 50px;
.mall-sku-item{
display: flex;
align-items: center;
margin-bottom: 10px;
.sku-img{
width: 48px;
height: 48px;
}
.sku-info{
margin-left: 10px;
line-height: 16px;
text-align: left;
.info-name{
color:#1677ff
}
.info-spec{
margin-top: 10px;
span:not(:last-child){
&:after{
content: '；';
}
}
}
}
}
}
.goods-text {
height: 60px;
width: 100%;
text-align: center;
line-height: 60px;
}
}
src/router/router.tsx
......@@ -195,6 +195,7 @@ export interface RouteObjectType {
customIcon?: boolean;
title: string;
develop?: boolean;
pid?: number;
};
}
// 加载页面
......@@ -264,6 +265,7 @@ export const routerList: Array<RouteObjectType> = [
title: '实名认证详情',
hidden: true,
icon: <SolutionOutlined />,
pid: 260,
},
},
{
......@@ -275,6 +277,7 @@ export const routerList: Array<RouteObjectType> = [
title: '邀请列表',
icon: <SolutionOutlined />,
hidden: true,
pid: 200,
},
},
{
......@@ -285,7 +288,6 @@ export const routerList: Array<RouteObjectType> = [
id: 26200,
title: '现金管理',
icon: <RedEnvelopeOutlined />,
hidden: true,
},
},
{
......@@ -293,10 +295,11 @@ export const routerList: Array<RouteObjectType> = [
element: withLoadingComponent(<CustomMoneyDetail />),
errorElement: <ErrorPage />,
meta: {
id: 26200,
id: 26210,
title: '现金变更',
icon: <RedEnvelopeOutlined />,
hidden: true,
pid: 26200,
},
},
{
......@@ -340,6 +343,7 @@ export const routerList: Array<RouteObjectType> = [
title: '认证日志',
hidden: true,
icon: <UserOutlined />,
pid: 1810,
},
},
{
......@@ -351,6 +355,7 @@ export const routerList: Array<RouteObjectType> = [
title: '飞手详情',
hidden: true,
icon: <UserOutlined />,
pid: 1810,
},
},
{
......@@ -362,6 +367,7 @@ export const routerList: Array<RouteObjectType> = [
title: '飞手审批',
hidden: true,
icon: <UserOutlined />,
pid: 1810,
},
},
],
......@@ -395,6 +401,7 @@ export const routerList: Array<RouteObjectType> = [
title: '需求详情',
hidden: true,
icon: <MonitorOutlined />,
pid: 410,
},
},
{
......@@ -416,6 +423,7 @@ export const routerList: Array<RouteObjectType> = [
title: '宣传管理详情',
icon: <SketchOutlined />,
hidden: true,
pid: 420,
},
},
{
......@@ -457,6 +465,7 @@ export const routerList: Array<RouteObjectType> = [
title: '招标快讯详情',
icon: <CoffeeOutlined />,
hidden: true,
pid: 450,
},
},
{
......@@ -468,6 +477,7 @@ export const routerList: Array<RouteObjectType> = [
title: '用户反馈',
icon: <CoffeeOutlined />,
hidden: true,
pid: 450,
},
},
{
......@@ -533,6 +543,7 @@ export const routerList: Array<RouteObjectType> = [
title: '商城订单 / 详情',
icon: <ShoppingOutlined />,
hidden: true,
pid: 810,
},
},
{
......@@ -553,8 +564,8 @@ export const routerList: Array<RouteObjectType> = [
id: 10070,
title: '采购订单详情',
icon: <ShoppingOutlined />,
develop: true,
hidden: true,
pid: 840,
},
},
{
......@@ -576,6 +587,7 @@ export const routerList: Array<RouteObjectType> = [
title: '租赁订单 / 详情',
icon: <ShopOutlined />,
hidden: true,
pid: 820,
},
},
{
......@@ -597,6 +609,7 @@ export const routerList: Array<RouteObjectType> = [
title: '服务订单 / 详情',
icon: <CreditCardOutlined />,
hidden: true,
pid: 830,
},
},
{
......@@ -628,7 +641,7 @@ export const routerList: Array<RouteObjectType> = [
title: '需求订单详情',
icon: <CreditCardOutlined />,
hidden: true,
develop: true,
pid: 850,
},
},
],
......@@ -658,10 +671,11 @@ export const routerList: Array<RouteObjectType> = [
element: withLoadingComponent(<ServiceDetailView />),
errorElement: <ErrorPage />,
meta: {
id: 1020,
id: 1025,
icon: <SmileOutlined />,
title: '服务详情',
hidden: true,
pid: 1020,
},
},
// {
......@@ -694,6 +708,7 @@ export const routerList: Array<RouteObjectType> = [
icon: <SmileOutlined />,
title: '商城商品新增',
hidden: true,
pid: 1040,
},
},
{
......@@ -705,6 +720,7 @@ export const routerList: Array<RouteObjectType> = [
icon: <SmileOutlined />,
title: '商城商品编辑',
hidden: true,
pid: 1040,
},
},
{
......@@ -716,6 +732,7 @@ export const routerList: Array<RouteObjectType> = [
icon: <SmileOutlined />,
title: '商城商品详情',
hidden: true,
pid: 1040,
},
},
{
......@@ -737,6 +754,7 @@ export const routerList: Array<RouteObjectType> = [
icon: <SmileOutlined />,
title: '产品详情',
hidden: true,
pid: 1050,
},
},
{
......@@ -780,6 +798,7 @@ export const routerList: Array<RouteObjectType> = [
icon: <SmileOutlined />,
title: '租赁商品新增',
hidden: true,
pid: 1030,
},
},
{
......@@ -791,6 +810,7 @@ export const routerList: Array<RouteObjectType> = [
icon: <SmileOutlined />,
title: '租赁商品编辑',
hidden: true,
pid: 1030,
},
},
{
......@@ -802,6 +822,7 @@ export const routerList: Array<RouteObjectType> = [
icon: <SmileOutlined />,
title: '租赁商品详情',
hidden: true,
pid: 1030,
},
},
{
......@@ -833,6 +854,7 @@ export const routerList: Array<RouteObjectType> = [
icon: <SmileOutlined />,
title: '品牌管理/型号',
hidden: true,
pid: 2020,
},
},
],
......@@ -908,6 +930,7 @@ export const routerList: Array<RouteObjectType> = [
title: '分类详情',
icon: '',
hidden: true,
pid: 1240,
},
},
// {
......@@ -980,6 +1003,7 @@ export const routerList: Array<RouteObjectType> = [
title: '个人积分明细',
icon: <MacCommandOutlined />,
hidden: true,
pid: 2210,
},
},
// {
......@@ -1229,6 +1253,7 @@ export const routerList: Array<RouteObjectType> = [
title: '权限信息',
icon: <UserOutlined />,
hidden: true,
pid: 1420,
},
},
{
......@@ -1250,6 +1275,7 @@ export const routerList: Array<RouteObjectType> = [
title: '单位详情',
icon: <BankOutlined />,
hidden: true,
pid: 1430,
},
},
{
......
src/utils/router.ts
......@@ -33,12 +33,12 @@ export const getRouteList = (router: routerItem[]) => {
}
return arr;
};
// 根据路由地址获取当前路由的id
// 根据路由地址获取当前路由的id(菜单栏专用，存在特殊处理)
export const getRouteID = (routerList: RouteObjectType[], path: string) => {
let id: number | string = '';
routerList.forEach((i) => {
if (i.path === path) {
id = i.meta?.id || '';
id = i.meta.hidden ? i.meta?.pid || '' : i.meta?.id || '';
} else if (i.children?.length && id === '') {
id = getRouteID(i.children, path);
}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论