功能：商城订单列表联调

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

+.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

+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

-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

+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

+.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);
     }