功能：采购审批凭证，发货，上传凭证

src/api/interface/orderManageType.ts

@@ -1243,7 +1243,7 @@ export type confirmOrderType = InterFunction<
     /**
      * 订单实付总额
      */
-    orderTotalAmount: number;
+    orderTotalAmount?: number;
     /**
      * 卖家备注
      */
@@ -1334,6 +1334,126 @@ export type approvalOrderType = InterFunction<
 >;
 
 // 采购订单-列表
+type purchaseOrderItemType = {
+  id: number;
+  orderNo: string;
+  backUserAccountId: number;
+  thirdUserAccountId: number;
+  uavOrderId: number;
+  orderAmount: number;
+  statusCode: number;
+  createTime: number;
+  userRemark: null;
+  sellerRemark: null;
+  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;
+  }[];
+  uavOrderExpressDTO: {
+    id: number;
+    uavOrderId: number;
+    sendExpNo: string;
+    sendExpCode: string;
+    takeName: string;
+    takePhone: string;
+    takeRegion: string;
+    takeAddress: string;
+    sendTime: number;
+    receiveTime: null;
+    receive: number;
+  };
+  uavOrderPayDTOS: Array<unknown>;
+  contractInfoDTO?: {
+    id: number;
+    unionId: string;
+    orderNo: string;
+    contractNo: string;
+    contractTitle: string;
+    signStatus: number;
+    singerTime: null;
+    createTime: string;
+    updateTime: string;
+    archiveDate: null;
+    aremark: string;
+    bremark: null;
+    atransactionId: string;
+    btransactionId: null;
+  };
+  companyName: string;
+  thirdPhoneNum: string;
+  payDTOS: {
+    /**
+     * 审核状态，0待审批，1通过，2未通过
+     */
+    checkStatus?: number;
+    /**
+     * 提交时间
+     */
+    createTime?: Date;
+    /**
+     * id
+     */
+    id?: number;
+    /**
+     * 支付凭证
+     */
+    payImgList: string;
+    /**
+     * 备注信息
+     */
+    payRemark?: string;
+    /**
+     * 未通过原因
+     */
+    refuseReason?: string;
+    /**
+     * 订单id
+     */
+    uavOrderId?: number;
+  }[];
+};
 export type listPurchaseOrderType = InterListFunction<
   {
     /**
@@ -1361,67 +1481,7 @@ export type listPurchaseOrderType = InterListFunction<
      */
     uid?: string;
   },
-  {
-    id: number;
-    orderNo: string;
-    backUserAccountId: number;
-    thirdUserAccountId: number;
-    uavOrderId: number;
-    orderAmount: number;
-    statusCode: number;
-    createTime: string;
-    userRemark: null;
-    sellerRemark: null;
-    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;
-    }[];
-    uavOrderExpressDTO: null;
-    uavOrderPayDTOS: null;
-    contractInfoDTO: null;
-  }
+  purchaseOrderItemType
 >;
 // 采购订单-详情
 export type purchaseOrderDetailType = InterFunction<
@@ -1431,79 +1491,7 @@ export type purchaseOrderDetailType = InterFunction<
      */
     id: number;
   },
-  {
-    id: number;
-    orderNo: string;
-    backUserAccountId: number;
-    thirdUserAccountId: number;
-    uavOrderId: number;
-    orderAmount: number;
-    statusCode: number;
-    createTime: number;
-    userRemark: null;
-    sellerRemark: null;
-    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;
-    }[];
-    uavOrderExpressDTO: {
-      id: number;
-      uavOrderId: number;
-      sendExpNo: string;
-      sendExpCode: string;
-      takeName: string;
-      takePhone: string;
-      takeRegion: string;
-      takeAddress: string;
-      sendTime: number;
-      receiveTime: null;
-      receive: number;
-    };
-    uavOrderPayDTOS: Array<unknown>;
-    contractInfoDTO: null;
-  }
+  purchaseOrderItemType
 >;
 // 采购订单-确认
 export type confirmPOrderType = InterFunction<
@@ -1523,3 +1511,81 @@ export type confirmPOrderType = InterFunction<
   },
   any
 >;
+// 采购订单-上传付款凭证
+export type uploadPOrderType = InterFunction<
+  {
+    /**
+     * 审核状态，0待审批，1通过，2未通过
+     */
+    checkStatus?: number;
+    /**
+     * 支付凭证
+     */
+    payImgList?: string;
+    /**
+     * 备注信息
+     */
+    payRemark?: string;
+    /**
+     * 订单id
+     */
+    uavOrderId?: number;
+  },
+  any
+>;
+// 采购订单-审核
+export type uavPoCheckPayType = InterFunction<
+  {
+    /**
+     * 审核状态，0待审批，1通过，2未通过
+     */
+    checkStatus?: number;
+    /**
+     * id
+     */
+    id?: number;
+    /**
+     * 未通过原因
+     */
+    refuseReason?: string;
+    /**
+     * 订单id
+     */
+    uavOrderId?: number;
+  },
+  any
+>;
+// 采购订单-发货
+export type uavPoSendType = InterFunction<
+  {
+    /**
+     * 快递编码
+     */
+    sendExpCode?: string;
+    /**
+     * 快递编号
+     */
+    sendExpNo?: string;
+    /**
+     * 发货-收货详细地址
+     */
+    takeAddress?: string;
+    /**
+     * 取货人
+     */
+    takeName?: string;
+    /**
+     * 取货人号码
+     */
+    takePhone?: string;
+    /**
+     * 地区信息
+     */
+    takeRegion?: string;
+    /**
+     * 订单id
+     */
+    uavOrderId?: number;
+  },
+  any
+>;

src/api/modules/orderManage.ts

@@ -32,6 +32,9 @@ import {
   serviceOrderFormListType,
   serviceOrderStatusType,
   serviceOrderType,
+  uavPoCheckPayType,
+  uavPoSendType,
+  uploadPOrderType,
   walletAmountType,
 } from '~/api/interface/orderManageType';
 
@@ -142,4 +145,10 @@ export class OrderManageAPI {
     axios.get('/oms/uav-po/getPurchaseOrder', { params });
   //   采购订单-确认
   static confirmPOrder: confirmPOrderType = (data) => axios.post('/oms/uav-po/confirmPOrder', data);
+  //   采购订单-上传付款凭证
+  static uploadPOrder: uploadPOrderType = (data) => axios.post('/oms/uav-po/upLoadPay', data);
+  // 采购订单-审核
+  static uavPoCheckPay: uavPoCheckPayType = (data) => axios.post('/oms/uav-po/checkPay', data);
+  //   采购订单-发货
+  static uavPoSend: uavPoSendType = (data) => axios.post('/oms/uav-po/send', data);
 }

src/pages/orderManage/productOrder/orderList/components/approvalOrder/index.tsx → src/components/order/productOrder/approvalOrder/index.tsx

@@ -11,20 +11,25 @@ import {
   RadioChangeEvent,
   message,
 } from 'antd';
-import { mallOrderListType } from '~/api/interface/orderManageType';
-import { InterListType } from '~/api/interface';
 import './index.scss';
 import { OrderManageAPI } from '~/api';
 
 interface selfProps {
   onCancel: () => void;
   onOk: () => void;
-  mallOrderItem: mallOrderItemType | undefined;
+  mallOrderItem: any;
+  type: number; //0:采购订单，1：商城订单
 }
 // 订单对象类型
-type mallOrderItemType = InterListType<mallOrderListType>[0];
+// type mallOrderItemType = InterListType<mallOrderListType>[0];
 
-const ApprovalOrder: FC<ModalProps & selfProps> = ({ open, onCancel, onOk, mallOrderItem }) => {
+const ApprovalOrder: FC<ModalProps & selfProps> = ({
+  open,
+  onCancel,
+  onOk,
+  mallOrderItem,
+  type,
+}) => {
   const [form] = Form.useForm<{ checkStatus: number; refuseReason: string }>();
   const [checkStatus, setCheckStatus] = useState<number>(1);
   const radioChange = (e: RadioChangeEvent) => {
@@ -32,13 +37,15 @@ const ApprovalOrder: FC<ModalProps & selfProps> = ({ open, onCancel, onOk, mallO
   };
   // 获取需要审批的凭证
   const getApproveObj = () => {
-    return mallOrderItem?.payDTOList?.find((v) => v.checkStatus === 0);
+    return type === 1
+      ? mallOrderItem?.payDTOList?.find((v: any) => v.checkStatus === 0)
+      : mallOrderItem?.payDTOS?.find((v: any) => v.checkStatus === 0);
   };
 
   const handleOk = () => {
     if (mallOrderItem) {
       form.validateFields().then((values) => {
-        OrderManageAPI.approvalOrder({
+        OrderManageAPI[type === 1 ? 'approvalOrder' : 'uavPoCheckPay']({
           uavOrderId: mallOrderItem?.id,
           checkStatus: values.checkStatus,
           refuseReason: values.refuseReason || undefined,

src/pages/orderManage/productOrder/orderList/components/shipmentsOrder/index.tsx → src/components/order/productOrder/shipmentsOrder/index.tsx

@@ -12,11 +12,18 @@ type sendMallType = Omit<Exclude<InterReqType<mallOrderSendType>, undefined>, 't
 };
 
 interface selfProps {
-  currentOrderItem: mallOrderType | undefined;
+  currentOrderItem: any;
   onCancel: () => void;
   onOk: () => void;
+  type: number; //0:采购订单，1：商城订单
 }
-const ShipmentsOrder: FC<ModalProps & selfProps> = ({ onOk, onCancel, open, currentOrderItem }) => {
+const ShipmentsOrder: FC<ModalProps & selfProps> = ({
+  onOk,
+  onCancel,
+  open,
+  currentOrderItem,
+  type,
+}) => {
   const [form] = Form.useForm<sendMallType>();
   const [listExpressInfo, setListExpressInfo] = useState<{ label: string; value: string }[]>([]);
 
@@ -29,9 +36,9 @@ const ShipmentsOrder: FC<ModalProps & selfProps> = ({ onOk, onCancel, open, curr
 
   const handleOk = () => {
     form.validateFields().then((value) => {
-      OrderManageAPI.mallOrderSend({
+      OrderManageAPI[type === 1 ? 'mallOrderSend' : 'uavPoSend']({
         ...value,
-        uavOrderId: currentOrderItem?.id,
+        uavOrderId: type === 1 ? currentOrderItem?.id : currentOrderItem.uavOrderId,
         id: currentOrderItem?.uavOrderExpressDTO.id,
         takeRegion: value?.takeRegion?.join('/'),
       }).then(({ code }) => {

src/components/order/productOrder/sureOrder/index.tsx

@@ -132,6 +132,8 @@ const SureOrder: FC<ModalProps & selfProps> = ({ open, onOk, onCancel, orderItem
           OrderManageAPI[type === 1 ? 'confirmOrder' : 'confirmPOrder']({
             ...values[0],
             id: orderItem.id,
+            orderAmount: type === 1 ? undefined : values[0].orderTotalAmount,
+            orderTotalAmount: type === 1 ? values[0].orderTotalAmount : undefined,
           }).then(({ code, message: msg }) => {
             if (code === '200') {
               message.success('确认订单成功');

src/pages/orderManage/procurementOrder/orderDetail/index.scss

@@ -24,5 +24,20 @@
       }
     }
   }
+  .pay-item{
+    display: flex;
+    margin-bottom: 10px;
+    &-label{
+
+    }
+    &-content{
+      display: flex;
+      align-items: center;
+      .ant-image{
+        margin-right: 10px;
+        margin-bottom: 10px;
+      }
+    }
+  }
 }
 

src/pages/orderManage/procurementOrder/orderDetail/index.tsx

 import { Button, Descriptions, Image, Table } from 'antd';
 import { useNavigate, useSearchParams } from 'react-router-dom';
-import { OrderManageAPI } from '~/api';
+import { FddInterfaceAPI, OrderManageAPI } from '~/api';
 import React, { useEffect, useState } from 'react';
 import { purchaseOrderDetailType } from '~/api/interface/orderManageType';
 import { InterDataType } from '~/api/interface';
 import dayjs from 'dayjs';
 import { ColumnsType } from 'antd/es/table';
 import './index.scss';
+import { decode } from 'js-base64';
+import FileSaver from 'file-saver';
 
 // 采购订单详情返回类型
 type detailType = InterDataType<purchaseOrderDetailType>;
@@ -23,7 +25,7 @@ const ProcurementOrderDetail = () => {
       align: 'center',
       width: '20%',
       render: (_text, record) => (
-        <div className='mall-sku-item'>
+        <div className='procurement-sku-item'>
           <Image src={record.skuImage} className='sku-img' />
           <div className='sku-info'>
             <div className='info-name'>{record.tradeName}</div>
@@ -80,6 +82,28 @@ const ProcurementOrderDetail = () => {
   const backRoute = () => {
     navigate(-1);
   };
+
+  //   合同预览
+  const contractPreview = () => {
+    if (purchaseOrderDetail?.contractInfoDTO?.contractNo) {
+      FddInterfaceAPI.viewContract({
+        contractId: purchaseOrderDetail?.contractInfoDTO?.contractNo,
+      }).then(({ result }) => {
+        window.open(decode(result), '_blank');
+      });
+    }
+  };
+  // 合同下载
+  const downloadContract = () => {
+    if (purchaseOrderDetail?.contractInfoDTO?.contractNo) {
+      FddInterfaceAPI.downloadContract({
+        contractId: purchaseOrderDetail?.contractInfoDTO?.contractNo,
+      }).then(({ result }) => {
+        FileSaver.saveAs(decode(result), `${purchaseOrderDetail?.contractInfoDTO?.contractNo}.pdf`);
+      });
+    }
+  };
+
   useEffect(() => {
     getPurchaseOrderDetail(Number(searchParams.get('id')));
     getOrderStatusList();
@@ -96,20 +120,23 @@ const ProcurementOrderDetail = () => {
           </Button>
         }
       >
-        <Descriptions.Item label='供应商名称：'>供应商名称：</Descriptions.Item>
-        <Descriptions.Item label='供应商电话：'>供应商电话：</Descriptions.Item>
-        <Descriptions.Item label='Live'>Hangzhou, Zhejiang</Descriptions.Item>
+        <Descriptions.Item label='供应商名称：'>
+          {purchaseOrderDetail?.companyName}
+        </Descriptions.Item>
+        <Descriptions.Item label='供应商电话：'>
+          {purchaseOrderDetail?.thirdPhoneNum}
+        </Descriptions.Item>
       </Descriptions>
       <Descriptions title='订单' style={{ marginTop: '10px' }} column={3}>
         <Descriptions.Item label='订单编号：' labelStyle={{ color: '#000' }}>
           {purchaseOrderDetail?.orderNo}
         </Descriptions.Item>
-        <Descriptions.Item label='创建时间：' labelStyle={{ color: '#000' }} span={2}>
+        <Descriptions.Item label='创建时间：' labelStyle={{ color: '#000' }}>
           {dayjs(purchaseOrderDetail?.createTime).format('YYYY-MM-DD HH:mm:ss')}
         </Descriptions.Item>
-        {/*<Descriptions.Item label='合同编号：' labelStyle={{ color: '#000' }}>*/}
-        {/*  3*/}
-        {/*</Descriptions.Item>*/}
+        <Descriptions.Item label='合同编号：' labelStyle={{ color: '#000' }}>
+          {purchaseOrderDetail?.contractInfoDTO?.contractNo || '--'}
+        </Descriptions.Item>
         <Descriptions.Item span={3}>
           <Table
             size='small'
@@ -139,10 +166,39 @@ const ProcurementOrderDetail = () => {
         </Descriptions.Item>
         <Descriptions.Item label='物流进度：'>--</Descriptions.Item>
       </Descriptions>
-      <Descriptions title='凭证' bordered style={{ marginTop: '10px' }}>
-        <Descriptions.Item label='付款凭证：'>供应商名称：</Descriptions.Item>
-        <Descriptions.Item label='验收商品：'>供应商电话：</Descriptions.Item>
-        <Descriptions.Item label='合同信息：'>Hangzhou, Zhejiang</Descriptions.Item>
+      <Descriptions title='凭证及合同' bordered style={{ marginTop: '10px' }}>
+        <Descriptions.Item label='付款凭证：'>
+          {purchaseOrderDetail?.payDTOS.map((v, index) => (
+            <div className='pay-item' key={index}>
+              <div className='pay-item-laebl'>
+                第{index + 1}次上传{' '}
+                <span style={{ color: 'red' }}>
+                  ({v.checkStatus === 0 ? '待审批' : v.checkStatus === 1 ? '已通过' : '未通过'})
+                </span>
+                ：
+              </div>
+              <div className='pay-item-content'>
+                {JSON.parse(v.payImgList).map((i: any, j: number) => (
+                  <Image key={j} src={i.filePath} width={100} height={100} />
+                ))}
+              </div>
+            </div>
+          ))}
+        </Descriptions.Item>
+        <Descriptions.Item label='合同信息：'>
+          {purchaseOrderDetail?.contractInfoDTO ? (
+            <>
+              <Button type='link' onClick={contractPreview}>
+                查看
+              </Button>
+              <Button type='link' onClick={downloadContract}>
+                下载
+              </Button>
+            </>
+          ) : (
+            '--'
+          )}
+        </Descriptions.Item>
       </Descriptions>
     </div>
   );

src/pages/orderManage/procurementOrder/orderList/components/uploadPayment/index.tsx

+import { Form, Input, message, Modal, ModalProps } from 'antd';
+import { FC, useState } from 'react';
+import { Uploader } from '~/components/uploader';
+import { UploadOutlined } from '@ant-design/icons';
+import { UploadFile } from 'antd/es/upload/interface';
+import { OrderManageAPI } from '~/api';
+import { listPurchaseOrderType } from '~/api/interface/orderManageType';
+import { InterListType } from '~/api/interface';
+
+// 采购订单列表返回类型
+type procurementOrderType = InterListType<listPurchaseOrderType>[0];
+interface selfProps {
+  onOk: () => void;
+  onCancel: () => void;
+  currentOrderItem: procurementOrderType | undefined;
+}
+const UploadPayment: FC<ModalProps & selfProps> = ({ open, currentOrderItem, onCancel, onOk }) => {
+  const [form] = Form.useForm<{ payImgList: string; payRemark: string }>();
+  const [fileList, setFileList] = useState<UploadFile[]>([]);
+  // 上传成功
+  const uploadSuccess = (value: any) => {
+    setFileList([...value]);
+    form.setFieldValue('payImgList', JSON.stringify(value.map((v: any) => ({ filePath: v.url }))));
+  };
+  const handleOk = () => {
+    if (currentOrderItem) {
+      form.validateFields().then((values) => {
+        OrderManageAPI.uploadPOrder({ ...values, uavOrderId: currentOrderItem.id }).then(
+          ({ code }) => {
+            if (code === '200') {
+              message.success('上传凭证成功'), form.resetFields();
+              setFileList([]);
+              onOk();
+            }
+          },
+        );
+      });
+    }
+  };
+  const handleCancel = () => {
+    form.resetFields();
+    setFileList([]);
+    onCancel();
+  };
+  return (
+    <Modal open={open} onOk={handleOk} onCancel={handleCancel} title='上传付款凭证'>
+      <Form form={form} labelCol={{ span: 2 }} wrapperCol={{ span: 20 }}>
+        <Form.Item
+          label='凭证'
+          rules={[{ required: true, message: '请上传付款凭证' }]}
+          name='payImgList'
+        >
+          <Uploader
+            fileUpload
+            listType='picture-card'
+            onChange={uploadSuccess}
+            fileLength={4}
+            defaultFileList={fileList}
+          >
+            <UploadOutlined />
+          </Uploader>
+        </Form.Item>
+        <Form.Item label='备注' name='payRemark'>
+          <Input.TextArea placeholder='请输入备注' maxLength={70} rows={4} showCount />
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+};
+export default UploadPayment;

src/pages/orderManage/procurementOrder/orderList/index.tsx

 import SearchBox from '~/components/search-box';
 import { Button, Image, Table } from 'antd';
 import { useEffect, useState } from 'react';
-import { OrderManageAPI } from '~/api';
+import { FddInterfaceAPI, OrderManageAPI } from '~/api';
 import { ColumnsType } from 'antd/es/table/InternalTable';
 import { useNavigate } from 'react-router-dom';
 import { InterListType, InterReqListType, PaginationProps } from '~/api/interface';
@@ -12,6 +12,11 @@ import './index.scss';
 import { filterObjAttr } from '~/utils';
 import dayjs from 'dayjs';
 import qs from 'query-string';
+import IframeModal from '~/components/modal/iframeModal';
+import { decode } from 'js-base64';
+import UploadPayment from '~/pages/orderManage/procurementOrder/orderList/components/uploadPayment';
+import ApprovalOrder from '~/components/order/productOrder/approvalOrder';
+import ShipmentsOrder from '~/components/order/productOrder/shipmentsOrder';
 
 // 采购订单列表返回类型
 type procurementOrderListType = InterListType<listPurchaseOrderType>;
@@ -32,14 +37,44 @@ const ProcurementOrderList = () => {
       },
     },
     {
+      btnStr: '签署合同',
+      status: 300,
+      btnClick: (record: procurementOrderListType[0]) => {
+        setCurrentOrderItem(record);
+        getPurchaseOrderDetail(record.id).then((result: procurementOrderListType[0]) => {
+          if (result.contractInfoDTO) {
+            contractSign(result.contractInfoDTO?.contractNo);
+          }
+        });
+      },
+    },
+    {
+      btnStr: '上传付款凭证',
+      status: 400,
+      btnClick: (record: procurementOrderListType[0]) => {
+        setCurrentOrderItem(record);
+        setUploadPaymentShow(true);
+      },
+    },
+    {
       btnStr: '凭证审批',
       status: 420,
-      btnClick: (record: procurementOrderListType[0]) => {},
+      btnClick: (record: procurementOrderListType[0]) => {
+        setCurrentOrderItem({ ...record });
+        setApprovalOrderShow(true);
+      },
     },
     {
       btnStr: '发货',
       status: 500,
-      btnClick: (record: procurementOrderListType[0]) => {},
+      btnClick: (record: procurementOrderListType[0]) => {
+        getPurchaseOrderDetail(record.id).then((result: procurementOrderListType[0]) => {
+          if (result) {
+            setCurrentOrderItem({ ...result });
+            setShipmentsOrderShow(true);
+          }
+        });
+      },
     },
   ];
   // 订单状态
@@ -50,7 +85,6 @@ const ProcurementOrderList = () => {
   >([]);
   // 当前选择的是第几个按钮
   const [statusCodeButtonIndex, setStatusCodeButtonIndex] = useState<number>(0);
-
   // 表格数据
   const [tableData, setTableData] = useState<procurementOrderListType>([]);
   const [currentOrderItem, setCurrentOrderItem] = useState<procurementOrderListType[0]>();
@@ -110,7 +144,16 @@ const ProcurementOrderList = () => {
     {
       title: '供应商信息',
       align: 'center',
-      render: () => <TableItem />,
+      render: (_text: any, record) => (
+        <TableItem
+          tr={
+            <div>
+              <div>{record.companyName}</div>
+              <div>{record.thirdPhoneNum}</div>
+            </div>
+          }
+        />
+      ),
     },
     {
       title: '订单状态',
@@ -133,7 +176,16 @@ const ProcurementOrderList = () => {
     },
     {
       title: '操作',
-      align: 'center',
+      onHeaderCell: () => ({
+        style: {
+          textAlign: 'center',
+        },
+      }),
+      onCell: () => ({
+        style: {
+          textAlign: 'right',
+        },
+      }),
       render: (_text: any, record) => (
         <TableItem
           tr={
@@ -159,6 +211,13 @@ const ProcurementOrderList = () => {
   ];
   // 订单流程操作
   const [sureOrderShow, setSureOrderShow] = useState<boolean>(false);
+  const [iframeModalShow, setIframeModalShow] = useState<boolean>(false);
+  const [uploadPaymentShow, setUploadPaymentShow] = useState<boolean>(false);
+  const [approvalOrderShow, setApprovalOrderShow] = useState<boolean>(false);
+  const [shipmentsOrderShow, setShipmentsOrderShow] = useState<boolean>(false);
+
+  // 合同地址
+  const [contractUrl, setContractUrl] = useState<string>('');
 
   // 获取当前操作按钮
   const getCurrentOperateBtn = (status: number) => {
@@ -186,6 +245,11 @@ const ProcurementOrderList = () => {
       setTableData(result.list || []);
     });
   };
+  // 获取采购订单详情
+  const getPurchaseOrderDetail = async (id: number) => {
+    const { result } = await OrderManageAPI.getPurchaseOrderDetail({ id });
+    return Promise.resolve(result);
+  };
   // 分页
   const paginationChange = (pageNo: number, pageSize: number) => {
     pagination.pageNo = pageNo;
@@ -205,11 +269,11 @@ const ProcurementOrderList = () => {
   const searchSuccess = (value: any) => {
     pagination.pageNo = 1;
     pagination.pageSize = 10;
-    const reqData = filterObjAttr(value, ['rangeTime']);
+    const reqData = { ...filterObjAttr(value, ['rangeTime']), ...query };
     setQuery({ ...reqData });
     getListPurchaseOrder(reqData);
   };
-  // 采购订单详情
+  // 跳转采购订单详情
   const toProcurementOrderDetail = (record: procurementOrderListType[0]) => {
     navigate({
       pathname: '/orderManage/procurementOrder/detail',
@@ -219,16 +283,55 @@ const ProcurementOrderList = () => {
 
   // 确认订单
   const sureOrderOk = () => {
+    getListPurchaseOrder(query);
     setSureOrderShow(false);
   };
   const sureOrderCancel = () => {
     setSureOrderShow(false);
   };
+  // 签署合同
+  const contractSign = (contractId: string) => {
+    FddInterfaceAPI.signContract({ contractId, port: 1 }).then(({ result }) => {
+      if (result) {
+        setContractUrl(decode(result));
+        setIframeModalShow(true);
+      }
+    });
+  };
+  const iframeModalCancel = () => {
+    setIframeModalShow(false);
+    getListPurchaseOrder(query);
+  };
+  // 上传付款凭证
+  const uploadPaymentCancel = () => {
+    setUploadPaymentShow(false);
+  };
+  const uploadPaymentOk = () => {
+    setUploadPaymentShow(false);
+    getListPurchaseOrder(query);
+  };
 
   useEffect(() => {
     getOrderStatusList();
     getListPurchaseOrder();
   }, []);
+  // 凭证审批
+  const approvalOrderOk = () => {
+    setApprovalOrderShow(false);
+  };
+  const approvalOrderCancel = () => {
+    setApprovalOrderShow(false);
+    getListPurchaseOrder(query);
+  };
+  // 发货
+  const shipmentsOrderCancel = () => {
+    setShipmentsOrderShow(false);
+  };
+  const shipmentsOrderOk = () => {
+    setShipmentsOrderShow(false);
+    getListPurchaseOrder(query);
+  };
+
   return (
     <div className='procurement-order-list'>
       <SearchBox
@@ -278,6 +381,7 @@ const ProcurementOrderList = () => {
           showTotal: (total, range) => `当前 ${range[0]}-${range[1]} 条记录 / 共 ${total} 条数据`,
         }}
       />
+      {/*确认订单*/}
       <SureOrder
         open={sureOrderShow}
         onCancel={sureOrderCancel}
@@ -285,6 +389,36 @@ const ProcurementOrderList = () => {
         orderItem={currentOrderItem}
         type={0}
       />
+      {/*签署合同*/}
+      <IframeModal
+        url={contractUrl}
+        title='合同签署'
+        open={iframeModalShow}
+        onCancel={iframeModalCancel}
+      />
+      {/*上传凭证*/}
+      <UploadPayment
+        open={uploadPaymentShow}
+        onCancel={uploadPaymentCancel}
+        onOk={uploadPaymentOk}
+        currentOrderItem={currentOrderItem}
+      />
+      {/*凭证审批*/}
+      <ApprovalOrder
+        mallOrderItem={currentOrderItem}
+        type={0}
+        open={approvalOrderShow}
+        onCancel={approvalOrderCancel}
+        onOk={approvalOrderOk}
+      />
+      {/*发货*/}
+      <ShipmentsOrder
+        open={shipmentsOrderShow}
+        onCancel={shipmentsOrderCancel}
+        onOk={shipmentsOrderOk}
+        currentOrderItem={currentOrderItem}
+        type={0}
+      />
     </div>
   );
 };

src/pages/orderManage/productOrder/orderList/index.tsx

@@ -8,8 +8,8 @@ import { OrderManageAPI } from '~/api';
 import { mallOrderListType } from '~/api/interface/orderManageType';
 import { InterListType, InterReqType } from '~/api/interface';
 import SureOrder from '~/components/order/productOrder/sureOrder';
-import ApprovalOrder from './components/approvalOrder';
-import ShipmentsOrder from './components/shipmentsOrder';
+import ApprovalOrder from '~/components/order/productOrder/approvalOrder';
+import ShipmentsOrder from '~/components/order/productOrder/shipmentsOrder';
 import RemarkModal from '~/pages/orderManage/productOrder/orderList/components/remarkModal';
 import TableItem from '~/components/order/selfTableItem';
 import { filterObjAttr } from '~/utils';
@@ -482,6 +482,7 @@ function ProductOrderView() {
         onCancel={approvalOrderCancel}
         onOk={approvalOrderOk}
         mallOrderItem={currentOrderItem}
+        type={1}
       />
       {/*发货*/}
       <ShipmentsOrder
@@ -489,6 +490,7 @@ function ProductOrderView() {
         onCancel={shipmentsOrderCancel}
         onOk={shipmentsOrderOk}
         currentOrderItem={currentOrderItem}
+        type={1}
       />
       {/*卖家备注*/}
       <RemarkModal