修复：意向订单流程操作问题

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

@@ -67,7 +67,7 @@ const ApprovalOrder: FC<ModalProps & selfProps> = ({
   return (
     <Modal open={open} title='凭证审批' onOk={handleOk} onCancel={handleCancel}>
       <Form
-        labelCol={{ span: 2 }}
+        labelCol={{ span: 3 }}
         wrapperCol={{ span: 19 }}
         initialValues={{ checkStatus: 1 }}
         form={form}
@@ -85,19 +85,17 @@ const ApprovalOrder: FC<ModalProps & selfProps> = ({
         ) : (
           ''
         )}
+        <Form.Item label='凭证图片'>
+          <div className='pay-img-wrap'>
+            {JSON.parse(getApproveObj()?.payImgList || '[]').map((i: any, j: number) => (
+              <Image src={i.filePath} key={j} width={100} height={100} />
+            ))}
+          </div>
+        </Form.Item>
+        <Form.Item label='凭证说明'>
+          <span style={{ wordBreak: 'break-all' }}>{getApproveObj()?.payRemark}</span>
+        </Form.Item>
       </Form>
-      {
-        <Row>
-          <Col span={2}>凭证：</Col>
-          <Col span={19}>
-            <div className='pay-img-wrap'>
-              {JSON.parse(getApproveObj()?.payImgList || '[]').map((i: any, j: number) => (
-                <Image src={i.filePath} key={j} width={100} height={100} />
-              ))}
-            </div>
-          </Col>
-        </Row>
-      }
     </Modal>
   );
 };

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

@@ -22,13 +22,15 @@ import { FddInterfaceAPI, OrderManageAPI } from '~/api';
 import IframeModal from '~/components/modal/iframeModal';
 import { decode } from 'js-base64';
 import { UploadFile } from 'antd/es/upload/interface';
-import { userFddInfoType } from '~/api/interface/fddInterfaceType';
+import { uploadContractType, userFddInfoType } from '~/api/interface/fddInterfaceType';
 import { useNavigate } from 'react-router-dom';
 
 // 商城订单对象类型
 type mallOrderItemType = InterListType<mallOrderListType>[0];
 // fdd实名认证信息类型
 type fddAuthType = InterDataType<userFddInfoType>;
+// 合同返回类型
+type contractType = InterDataType<uploadContractType>;
 
 interface selfProps {
   onCancel: () => void;
@@ -45,6 +47,8 @@ const SureOrder: FC<ModalProps & selfProps> = ({ open, onOk, onCancel, orderItem
     totalSalary: number;
     cashAmt: number;
   }>();
+  // 实付总额
+  const [totalAmountPaid, setTotalAmountPaid] = useState<string | number>('');
   const [contractForm] = Form.useForm<{ contractUrl: string; contractTitle: string }>();
   const tableColumns: ColumnsType<mallOrderItemType['skuDTOList'][0]> = [
     {
@@ -78,42 +82,56 @@ const SureOrder: FC<ModalProps & selfProps> = ({ open, onOk, onCancel, orderItem
   ];
   // 签署合同地址
   const [contractFileList, setContractFileList] = useState<UploadFile[]>([]);
+  const [contractInfo, setContractInfo] = useState<contractType>();
   const [contractUrl, setContractUrl] = useState<string>('');
   // fdd实名认证信息
   const [fddAuthInfo, setFddAuthInfo] = useState<fddAuthType[0]>();
   const [iframeModalShow, setIframeModalShow] = useState<boolean>(false);
 
-  // 合同文件上传成功回调
+  // 合同上传
   const uploadSuccess = (value: any) => {
-    setContractFileList(value);
-    contractForm.setFieldValue('contractUrl', value[0].url);
-  };
-  // 合同上传fdd
-  const uploadContract = () => {
-    if (orderItem) {
-      contractForm
-        .validateFields()
-        .then((values) => {
-          if (fddAuthInfo?.entVerifyStatus === 4) {
-            FddInterfaceAPI.uploadContract({
-              docUrl: values.contractUrl,
-              orderNo: orderItem.orderNo,
-              port: 1,
-              title: values.contractTitle,
-            }).then(({ result }) => {
-              signContract(result.contractNo);
+    contractForm
+      .validateFields(['contractTitle'])
+      .then((values) => {
+        if (fddAuthInfo?.entVerifyStatus === 4) {
+          FddInterfaceAPI.uploadContract({
+            docUrl: value[0].url,
+            orderNo: orderItem.orderNo,
+            port: 1,
+            title: values.contractTitle,
+          })
+            .then(({ result }) => {
+              setContractFileList(value);
+              contractForm.setFieldValue('contractUrl', value[0].url);
+              setContractInfo(result);
+            })
+            .catch(() => {
+              setContractFileList([]);
             });
-          } else {
-            message.warning('请先完成认证');
-            setTimeout(() => {
-              navigate('/systemManage/realNameAuth');
-            }, 500);
-          }
-        })
-        .catch((error: any) => {
-          message.warning(error?.errorFields[0]?.errors[0]);
-        });
-    }
+        } else {
+          message.warning('请先完成认证');
+          setTimeout(() => {
+            navigate('/systemManage/realNameAuth');
+          }, 500);
+        }
+      })
+      .catch((error: any) => {
+        setContractFileList([]);
+        message.warning(error?.errorFields[0]?.errors[0]);
+      });
+  };
+  //签署合同
+  const signContractClick = () => {
+    contractForm
+      .validateFields()
+      .then(() => {
+        if (contractInfo) {
+          signContract(contractInfo.contractNo);
+        }
+      })
+      .catch((error: any) => {
+        message.warning(error?.errorFields[0]?.errors[0]);
+      });
   };
   // 获取fdd实名认证信息
   const getAppUserFddInfo = () => {
@@ -142,12 +160,24 @@ const SureOrder: FC<ModalProps & selfProps> = ({ open, onOk, onCancel, orderItem
         if (result) {
           orderInfoForm.setFieldsValue({
             cashAmt: result.cashAmt,
-            totalSalary: result.totalSalary,
           });
+          orderTotalAmountInputEvent();
         }
       },
     );
   };
+  // 获取实付款总额
+  const orderTotalAmountInputEvent = () => {
+    const amount =
+      orderInfoForm.getFieldValue('orderTotalAmount') >
+      (orderInfoForm.getFieldValue('cashAmt') || 0)
+        ? '￥' +
+          (
+            orderInfoForm.getFieldValue('orderTotalAmount') - orderInfoForm.getFieldValue('cashAmt')
+          ).toLocaleString()
+        : 0;
+    setTotalAmountPaid(amount);
+  };
   const handleOk = () => {
     if (orderItem) {
       Promise.all([orderInfoForm.validateFields(), contractForm.validateFields()])
@@ -218,20 +248,22 @@ const SureOrder: FC<ModalProps & selfProps> = ({ open, onOk, onCancel, orderItem
               <div className='order-info-form'>
                 <Form wrapperCol={{ span: 10 }} labelCol={{ span: 3 }} form={orderInfoForm}>
                   <Form.Item
-                    label='实付总额'
+                    label='订单总额'
                     name='orderTotalAmount'
                     rules={[{ required: true, message: '请输入实付总额' }]}
                   >
-                    <Input placeholder='请输入实付总额' suffix='元' maxLength={30} />
+                    <Input
+                      placeholder='请输入订单总额'
+                      suffix='元'
+                      maxLength={30}
+                      onChange={orderTotalAmountInputEvent}
+                    />
                   </Form.Item>
                   {type === 1 ? (
                     <>
                       <Form.Item label='云享金' name='cashAmt'>
                         <Input placeholder='请输入抵扣云享金' suffix='元' disabled />
                       </Form.Item>
-                      <Form.Item label='佣金' name='totalSalary'>
-                        <Input placeholder='请输入抵扣佣金' suffix='元' disabled />
-                      </Form.Item>
                       <Form.Item
                         label='订单交期'
                         name='deliveryTime'
@@ -243,6 +275,7 @@ const SureOrder: FC<ModalProps & selfProps> = ({ open, onOk, onCancel, orderItem
                   ) : (
                     ''
                   )}
+                  <Form.Item label='实付总额'>{totalAmountPaid}</Form.Item>
                 </Form>
               </div>
             </Col>
@@ -283,7 +316,7 @@ const SureOrder: FC<ModalProps & selfProps> = ({ open, onOk, onCancel, orderItem
                 <Col span={5}></Col>
                 <Col>
                   <div>
-                    <Button type='primary' size='small' onClick={uploadContract}>
+                    <Button type='primary' size='small' onClick={signContractClick}>
                       签署合同
                     </Button>
                     <span style={{ color: 'red' }}>（上传合同后需完成签署!）</span>

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

@@ -39,5 +39,16 @@
       }
     }
   }
+  .pay-remark{
+    display: flex;
+    .label{
+      white-space: nowrap;
+    }
+    .value{
+      line-height: 15px;
+      word-break: break-all;
+      width: 200px;
+    }
+  }
 }
 

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

@@ -173,47 +173,59 @@ const ProcurementOrderDetail = () => {
           {purchaseOrderDetail?.uavOrderExpressDTO.sendExpNo || '--'}
         </Descriptions.Item>
         <Descriptions.Item label='物流进度：'>
-          <div>
-            <Steps
-              direction='vertical'
-              current={0}
-              progressDot
-              items={[
-                {
-                  title: purchaseOrderDetail?.kdnExpDTO?.traces?.[0].acceptStation,
-                  description: purchaseOrderDetail?.kdnExpDTO?.traces?.[0].acceptTime,
-                },
-                {
-                  title: `送至${
-                    purchaseOrderDetail?.uavOrderExpressDTO?.takeRegion.split('/').join('') ||
-                    '' + purchaseOrderDetail?.uavOrderExpressDTO?.takeAddress
-                  }`,
-                },
-              ]}
-            />
-          </div>
-          <div>
-            <Button type='link' onClick={showStepModal}>
-              查看详情
-            </Button>
-          </div>
+          {purchaseOrderDetail?.kdnExpDTO?.traces?.length ? (
+            <>
+              <div>
+                <Steps
+                  direction='vertical'
+                  current={0}
+                  progressDot
+                  items={[
+                    {
+                      title: purchaseOrderDetail?.kdnExpDTO?.traces?.[0]?.acceptStation,
+                      description: purchaseOrderDetail?.kdnExpDTO?.traces?.[0]?.acceptTime,
+                    },
+                    {
+                      title: `送至${
+                        purchaseOrderDetail?.uavOrderExpressDTO?.takeRegion.split('/').join('') ||
+                        '' + purchaseOrderDetail?.uavOrderExpressDTO?.takeAddress
+                      }`,
+                    },
+                  ]}
+                />
+              </div>
+              <div>
+                <Button type='link' onClick={showStepModal}>
+                  查看详情
+                </Button>
+              </div>
+            </>
+          ) : (
+            '--'
+          )}
         </Descriptions.Item>
       </Descriptions>
       <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 className='pay-wrap' key={index}>
+              <div className='pay-item'>
+                <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>
-              <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 className='pay-remark'>
+                <div className='label'> 第{index + 1}次上传凭证说明：</div>
+                <div className='value'>{v.payRemark}</div>
               </div>
             </div>
           ))}

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

@@ -91,7 +91,7 @@ const UploadPayment: FC<ModalProps & selfProps> = ({ open, currentOrderItem, onC
             <UploadOutlined />
           </Uploader>
         </Form.Item>
-        <Form.Item label='备注' name='payRemark'>
+        <Form.Item label='凭证说明' name='payRemark'>
           <Input.TextArea placeholder='请输入备注' maxLength={70} rows={4} showCount />
         </Form.Item>
       </Form>

src/pages/orderManage/productOrder/orderDetail/comp/detailPurchaser/index.scss

@@ -6,6 +6,7 @@
     }
     .value{
       line-height: 15px;
+      word-break: break-all;
     }
   }
   .pay-img-wrap{

src/pages/orderManage/productOrder/orderDetail/comp/detailPurchaser/index.tsx

@@ -78,26 +78,27 @@ const DetailPurchaser: React.FC<PropsType> = ({ detail }) => {
         <>
           <div className='detail-title'>付款凭证</div>
           {detail?.payDTOList.map((v, index) => (
-            <div key={index} className='pay-img-wrap'>
-              <div className='detail-text'>
-                第{index + 1}次上传
-                <span style={{ color: 'red' }}>
-                  ({v.checkStatus === 0 ? '待审批' : v.checkStatus === 1 ? '已通过' : '未通过'})
-                </span>
-                ：
+            <div key={index}>
+              <div className='pay-img-wrap'>
+                <div className='detail-text'>
+                  第{index + 1}次上传
+                  <span style={{ color: 'red' }}>
+                    ({v.checkStatus === 0 ? '待审批' : v.checkStatus === 1 ? '已通过' : '未通过'})
+                  </span>
+                  ：
+                </div>
+                <div className='detail-image'>
+                  {JSON.parse(v.payImgList).map((i: any, j: number) => (
+                    <Image key={j} className='image' src={i.filePath} alt='付款凭证' />
+                  ))}
+                </div>
               </div>
-              <div className='detail-image'>
-                {JSON.parse(v.payImgList).map((i: any, j: number) => (
-                  <Image key={j} className='image' src={i.filePath} alt='付款凭证' />
-                ))}
+              <div className='detail-text remark'>
+                <div className='label'> 第{index + 1}次上传凭证说明：</div>
+                <div className='value'>{v.payRemark}</div>
               </div>
             </div>
           ))}
-
-          <div className='detail-text remark'>
-            <div className='label'>凭证备注：</div>
-            <div className='value'>{detail?.payDTOList[0].payRemark}</div>
-          </div>
         </>
       ) : (
         ''

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

-import { FC } from 'react';
-import { Modal, ModalProps } from 'antd';
-
-interface selfProps {
-  onCancel: () => void;
-  onOk: () => void;
-}
-const TailPaymentOrder: FC<ModalProps & selfProps> = ({ open, onOk, onCancel }) => {
-  const handleOk = () => {
-    onOk();
-  };
-  const handleCancel = () => {
-    onCancel();
-  };
-  return <Modal open={open} title='确认尾款' onOk={handleOk} onCancel={handleCancel} />;
-};
-export default TailPaymentOrder;

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

@@ -333,13 +333,7 @@ function ProductOrderView() {
       dataIndex: 'statusCode',
       align: 'center',
       render: (text) => (
-        <TableItem
-          tr={
-            <div className='goods-text'>
-              {orderStatusList.find((i) => i.value === text)?.label || text}
-            </div>
-          }
-        />
+        <TableItem tr={<div>{orderStatusList.find((i) => i.value === text)?.label || text}</div>} />
       ),
     },
     {