feat:待确认支付结果

config/lingxi.theme.config.ts

@@ -4,7 +4,6 @@ const MAIN_FONT_TINY_COLOR = '#909399'
 
 export default {
   '@primary-color': MAIN_COLOR,
-
   // 公共padding变量
   '@padding-lg': '24px',
   '@padding-sm': '12px',

src/pages/transaction/components/orderPayResultModal/index.tsx

+import React, { useState, useEffect, useContext } from 'react'
+import { Modal, List, Avatar, Button, Space } from 'antd'
+import { usePageStatus } from '@/hooks/usePageStatus'
+import { OrderDetailContext } from '../../_public/order/context'
+import { PayOutWorkState } from '@/constants'
+import { PublicApi } from '@/services/api'
+import { history, Link } from 'umi'
+import OverflowText from '@/components/OverflowText'
+import { useHttpRequest } from '@/hooks/useHttpRequest'
+
+export interface OrderPayResultModalProps {
+  type: 'default' | 'preview',
+  currentRef: any
+}
+
+const OrderPayResultModal:React.FC<OrderPayResultModalProps> = ({type, currentRef}) => {
+  const { data } = useContext(OrderDetailContext)
+  const { id } = usePageStatus()
+  const [visible, setVisible] = useState(false)
+  const canCtlData = data?.paymentInformationResponses.find(v => v.externalState === PayOutWorkState.READY_CONFIRM_RESULT) || {}
+  const { run, loading } = useHttpRequest(PublicApi.postOrderConfirmedPaymentResultsOrder)
+  const transData = canCtlData.payOrderUrls?.split(',') || []
+  useEffect(() => {
+    if (currentRef) {
+      currentRef.current = {
+        visible,
+        setVisible
+      }
+    }
+  }, [])
+
+  const handleCancel = () => {
+    setVisible(false)
+  }
+
+  const handleConfirm = async (isReady) => {
+    const params = {
+      state: isReady,
+      id: Number(id),
+      paymentInformationId: canCtlData.id
+    }
+
+    const { code } = await run(params)
+    if (code === 1000) {
+      history.goBack()
+    }
+  }
+
+  return (
+    <Modal
+      title={type === 'default' ? '确认支付结果' : '查看支付结果'}
+      visible={visible}
+      onCancel={handleCancel}
+      confirmLoading={loading}
+      footer={(type === 'default' && transData) ? <Space>
+        <Button onClick={handleCancel}>取消</Button>
+        <Button onClick={() => handleConfirm(0)} type='dashed'>确认未到账</Button>
+        <Button onClick={() => handleConfirm(1)} type='primary'>确认到账</Button>
+      </Space> : null}
+    >
+      <List
+        itemLayout="horizontal"
+        dataSource={transData || []}
+        renderItem={(item: string) => (
+          <List.Item  style={{fontSize: 12}} extra={<a href={item} target='_blank'>预览</a>}>
+            <OverflowText style={{flex: '.9'}}>
+              {item}
+            </OverflowText>
+          </List.Item>
+        )}
+      />
+    </Modal>
+  )
+}
+
+OrderPayResultModal.defaultProps = {}
+
+export default OrderPayResultModal
\ No newline at end of file

src/pages/transaction/purchaseOrder/readyAddOrder/index.tsx

@@ -51,7 +51,7 @@ const ReadyAddOrder:React.FC<ReadyAddOrderProps> = (props) => {
       await PublicApi.postOrderProcurementOrderSubmitExamineAll({ids: rowSelectionCtl.selectedRowKeys})
       ref.current.reload()
     } else {
-      message.error('只能删除内部状态为未审核过的订单')
+      message.error('只能提交审核待新增的订单')
     }
   }
 
@@ -95,7 +95,7 @@ const ReadyAddOrder:React.FC<ReadyAddOrderProps> = (props) => {
               // onClick={() => history.push('/memberCenter/tranactionAbility/purchaseOrder/orderDetail')}
               onClick={() => history.push('/memberCenter/tranactionAbility/purchaseOrder/readyAddOrder/add')}
             >
-                新建
+              新建
             </Button>
             <Button onClick={handleBitchPush}>批量提交审核</Button>
             <DropDeleteDown>

src/pages/transaction/saleOrder/readyPayResult/detail/index.tsx

-import React from 'react';
+import React, { useState, useCallback, useRef } from 'react';
+import { OrderDetailContext } from '../../../_public/order/context';
+import { PublicApi } from '@/services/api';
+import { Button } from 'antd';
+import OrderDetailHeader from '@/pages/transaction/components/OrderDetailHeader';
+import OrderDetailWrapper from '@/pages/transaction/components/OrderDetailWrapper';
+import PreLoading from '@/components/PreLoading';
+import { useOrderDetail } from '../../../_public/order/effects/useOrderDetail';
+import ApprovedOrderModal from '../../../components/approvedOrderModal';
+import { history } from 'umi'
+import { useHttpRequest } from '@/hooks/useHttpRequest';
+import OrderDetailSection from '../../../components/orderDetailSection';
+import OrderPayResultModal from '@/pages/transaction/components/orderPayResultModal';
+
+const ReadyPayResultOrderDetail: React.FC = () => {
+  const { formContext, id, detailList } = useOrderDetail({type: 'saleOrder'})
+  const approvedRef = useRef<any>({})
+
+  const handleClick = useCallback(() => {
+    approvedRef.current.setVisible(true)
+  }, [])
 
-const ReadyPayResultDetail: React.FC = () => {
   return (
     <div>
-      待确认支付结果
+      <OrderDetailContext.Provider value={formContext}>
+        <OrderDetailHeader detailList={detailList} detailData={formContext.data} extraRight={
+          <Button type='primary' onClick={handleClick}>
+            确认支付结果
+          </Button>
+        } />
+
+        <OrderDetailWrapper>
+          <PreLoading loading={!formContext.data} active paragraph={{rows: 6}}>
+            <OrderDetailSection formContext={formContext} type='saleOrder'/>
+          </PreLoading>
+        </OrderDetailWrapper>
+
+        {/* 提交时触发的弹窗集合 */}
+        <OrderPayResultModal
+          currentRef={approvedRef}
+          type='default'
+        />
+      </OrderDetailContext.Provider>
     </div>
   );
 };
 
-export default ReadyPayResultDetail;
\ No newline at end of file
+export default ReadyPayResultOrderDetail;
\ No newline at end of file