fix: 结算支付积分支付

src/pages/settlementManage/platformSettlement/accountPayable/index.tsx

@@ -112,8 +112,7 @@ const SettlementList = () => {
   };
 
   /**
-   * TODO
-   * 通联支付确认付款
+   * @通联支付确认付款
    */
   const handleUniversalPay = async () => {
     console.log(itemInfo);

src/pages/settlementManage/platformSettlement/components/OtherPayModal/index.less

@@ -13,6 +13,10 @@
   .item {
     margin-bottom: 16px;
 
+    &:last-of-type {
+      margin-bottom: 0px;
+    }
+
     &-title {
       color: #909399;
     }

src/pages/settlementManage/platformSettlement/components/OtherPayModal/index.tsx

@@ -54,7 +54,7 @@ const OtherPayModal: React.FC<Iprops> = (props: Iprops) => {
         {
           list.map((_item) => {
             return (
-              <div className={styles.item}>
+              <div className={styles.item} key={_item.title}>
                 <span className={styles['item-title']}>{_item.title}</span>
                 <span className={styles['item-value']}>{_item.value}</span>
               </div>

src/pages/settlementManage/platformSettlement/score/list/index.tsx

-/*
- * @Author: Bill
- * @Date: 2020-10-20 11:04:07
- * @Description: 应付账款结算
- */
-
-import React, { useCallback, useEffect, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { PageHeaderWrapper } from '@ant-design/pro-layout'
 import { Card, Button, Modal, DatePicker, Tag, Space } from 'antd';
 import NiceForm from '@/components/NiceForm';
@@ -13,16 +7,15 @@ import { ISchema, createFormActions } from '@formily/antd';
 import { StandardTable } from 'god';
 import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
 import { schema } from './schema';
-import StatusTag from '../../components/StatusTag';
 import { Moment } from 'moment';
-import { ColumnsType } from 'antd/es/table';
-import EyePreview from '@/components/EyePreview';
 import moment from 'moment';
 import UploadVoucherModal from '../../components/UploadVoucherModal';
-import useFetchColumns from '../../hooks/useFetchColumns';
 import Voucher from '../../components/Voucher';
-import { getSettleAccountsPlatformScoreSettlementGetPayablePayProve, getSettleAccountsPlatformScoreSettlementPagePayableSettlement, postSettleAccountsPlatformScoreSettlementPay } from '@/services/SettleV2Api';
+import { getSettleAccountsPlatformScoreSettlementGetPayablePayProve, getSettleAccountsPlatformScoreSettlementPagePayableSettlement, postSettleAccountsPlatformScoreSettlementPay, postSettleAccountsPlatformSettlementCommunicationPay } from '@/services/SettleV2Api';
 import { postReportSettlementScoreManualSettlement } from '@/services/ReportV2Api';
+import OtherPayModal from '../../components/OtherPayModal';
+import useHandleSettlementList from './useHandleSettlementList';
+import ViewUniversalPay from '../../components/ViewUniversalPay';
 
 interface SearchParams {
   settlementName?: string,
@@ -40,19 +33,28 @@ const { RangePicker } = DatePicker
 const formActions = createFormActions();
 const SCORE_PAYER = 6;
 const SettlementList = () => {
-  const {
-    handlePay,
-    viewVisible,
-    viewModalonCancel,
-    handleViewPayModal,
-    payModalOnCancel,
-    payModalVisible,
-    balanceInfo,
-    payVoucherInfo
-  } = useFetchColumns();
-
   const [files, setFiles] = useState<any>([]);
   const ref = useRef<any>({})
+  const [confirmUniversalPayLoading, setConfirmUniversalPayLoading] = useState<boolean>(false);
+  const { itemInfo, columns, handleClose, modals } = useHandleSettlementList()
+  const universalPayInfo1 = useMemo(() => ({
+    name: itemInfo?.settlementName || '',
+    amount: itemInfo?.amount || 0,
+    statusName: itemInfo?.statusName || '',
+    payWayName: '通联支付',
+    settlementDate: itemInfo?.settlementDate || ''
+  }), [itemInfo])
+
+  const universalPayInfoData = useMemo(() => {
+    return {
+      name: itemInfo?.settlementName || '',
+      amount: itemInfo?.amount || 0,
+      payMethods: '通联支付'
+    }
+  }, [itemInfo])
+
+
+
 
   const fetchListData = async (params) => {
     // /settle/accounts/platform/settlement/pagePayableSettlement
@@ -63,65 +65,27 @@ const SettlementList = () => {
     const res = await getSettleAccountsPlatformScoreSettlementPagePayableSettlement(searchData)
     return res.data;
   }
-  const columns: ColumnsType<any> = [
-    {
-      title: '结算单号',
-      dataIndex: 'settlementNo',
-      render: (text, record) => {
-        const url = `/settlementManage/platformSettlement/balanced/scorePayable/detail?id=${record.id}`;
-        return (
-          <EyePreview url={url}>
-            {text}
-          </EyePreview>
-        )
-      }
-    },
-    {title: '结算日期', dataIndex: 'settlementDate'},
-    {title: '结算方式', dataIndex: 'settlementWayName'},
-    {title: '结算方', dataIndex: 'settlementName'},
-    {title: '总单数', dataIndex: 'totalCount'},
-    {title: '结算积分', dataIndex: 'score'},
-    {
-      title: '兑换比率',
-      dataIndex: 'ratio',
-      render: (text, record) => {
-        return (record.ratio) + "%";
-      }
-    },
-    {title: '结算金额', dataIndex: 'amount'},
-    {title: '结算时间', dataIndex: 'settlementTime'},
-    {title: '支付方式', dataIndex: 'payWayName'},
-    {
-      title: '结算状态', dataIndex: 'status',
-      filters: [
-        { text: '待对账', value: 1 },
-        { text: '待付款', value: 2 },
-        { text: '待收款', value: 3 },
-        { text: '已完成', value: 4 },
-      ],
-      onFilter: (value, record: any) => record.status == value,
-      render: (text, record: any) => {
-        return (
-          <StatusTag status={record.status || 1} />
-        )
-      }
-    },
-    {
-      title: '操作',
-      render: (text, record: any) => {
-        if (record.status === 1) {
-          return <a onClick={() => handleManualsettlement(record.id)}>手动结算</a>
-        }
-        // 待付款
-        if (record.status === 2) {
-          return <a onClick={() => handlePay({id: record.id, settlementId: record.memberId, roleId: record.roleId})}>付款</a>
-        }
-        return <a onClick={() => handleViewPayModal({id: record.id})}>查看付款凭证</a>
+
+
+  /**
+   * @通联支付确认付款
+   */
+   const handleUniversalPay = async () => {
+    console.log(itemInfo);
+    try {
+      setConfirmUniversalPayLoading(true)
+      const { code } = await postSettleAccountsPlatformSettlementCommunicationPay({id: itemInfo?.id!})
+
+      if (code === 1000) {
+        handleClose('universalPay')
+        formActions.submit();
       }
+    } finally {
+      setConfirmUniversalPayLoading(false)
     }
-  ]
+  }
 
-    /**
+  /**
    *
    * @param params 手动结算
    */
@@ -141,11 +105,16 @@ const SettlementList = () => {
     }
   }, [])
 
+
   useEffect(() => {
-    if (payVoucherInfo !== null) {
-      fetchVouchers(payVoucherInfo.id);
+    if (itemInfo !== null && modals['manualSettlement']) {
+      handleManualsettlement(itemInfo.id)
+      return
+    }
+    if (itemInfo !== null && modals.viewPay) {
+      fetchVouchers(itemInfo.id);
     }
-  }, [payVoucherInfo])
+  }, [itemInfo]);
 
     /**
   * 上传凭证
@@ -203,17 +172,31 @@ const SettlementList = () => {
           }
         />
       </Card>
-      <UploadVoucherModal
-        visible={payModalVisible}
-        id={balanceInfo?.id}
-        roleId={balanceInfo?.roleId}
-        settlementId={balanceInfo?.settlementId}
+
+       <UploadVoucherModal
+        visible={modals.uploadPayVoucher}
+        id={itemInfo?.id}
+        roleId={itemInfo?.roleId}
+        settlementId={itemInfo?.memberId}
         handleUpload={handleUploadVoucher}
-        onCancel={payModalOnCancel}
+        onCancel={() => handleClose('uploadPayVoucher')}
       />
-      <Modal width={548} title="查看付款凭证" onCancel={viewModalonCancel} visible={viewVisible} footer={null}>
+      <Modal width={548} title="查看付款凭证" onCancel={() => handleClose('viewPay')} visible={modals.viewPay} footer={null}>
         <Voucher files={files} />
       </Modal>
+      <ViewUniversalPay
+        visible={modals['viewUniversalPay']}
+        balanceInfo={universalPayInfo1}
+        onClose={() => handleClose('viewUniversalPay')}
+        onOk={() => handleClose('viewUniversalPay')}
+      />
+      <OtherPayModal
+        visible={modals.universalPay}
+        onClose={() => handleClose('universalPay')}
+        onConfirm={handleUniversalPay}
+        balanceInfo={universalPayInfoData}
+        confirmLoading={confirmUniversalPayLoading}
+      />
     </PageHeaderWrapper>
   )
 }

src/pages/settlementManage/platformSettlement/score/list/useHandleSettlementList.tsx

+import EyePreview from '@/components/EyePreview';
+import { priceFormat } from '@/utils/numberFomat'
+import StatusTag from '@/components/StatusTag';
+import React, { useMemo, useState } from 'react';
+import { useCallback } from 'react';
+import { GetSettleAccountsPlatformSettlementPagePayableSettlementResponseDetail } from '@/services/SettleV2Api';
+import { ColumnsType } from 'antd/lib/table';
+
+const STATUS_COLOR = ["default", "warning", "primary", "danger", "success"];
+
+const STATUS_TEXT = {
+  1: '待对账',
+  2: '待付款',
+  3: '待收款',
+  4: '已完成'
+}
+
+type ModalsType = {
+  /** 查看付款 */
+  viewPay: boolean,
+  /** 查看通联支付 */
+  viewUniversalPay: boolean,
+  /** 手动结算 */
+  manualSettlement: boolean,
+  /** 上传付款凭证 */
+  uploadPayVoucher: boolean,
+  /** 通联支付付款 */
+  universalPay: boolean
+}
+
+function useHandleSettlementList() {
+  const [itemInfo, setItemInfo] = useState<GetSettleAccountsPlatformSettlementPagePayableSettlementResponseDetail | null>(null)
+  const [modals, setModals] = useState<ModalsType>({
+    viewPay: false,
+    viewUniversalPay: false,
+    manualSettlement: false,
+    uploadPayVoucher: false,
+    universalPay: false
+  })
+
+
+  const handleOpen = useCallback((key: keyof ModalsType) => {
+    setModals({
+      ...modals,
+      [key]: true
+    })
+  }, [])
+
+  const handleClose = useCallback((key: keyof ModalsType) => {
+    setModals({
+      ...modals,
+      [key]: false
+    })
+  }, [])
+
+  const handleAction = (record: GetSettleAccountsPlatformSettlementPagePayableSettlementResponseDetail, key: keyof ModalsType) => {
+    setItemInfo(record);
+    console.log("key", key);
+    handleOpen(key);
+  }
+
+  const columns: ColumnsType<any> = [
+    {
+      title: '结算单号',
+      dataIndex: 'settlementNo',
+      render: (text, record) => {
+        const url = `/settlementManage/platformSettlement/balanced/scorePayable/detail?id=${record.id}`;
+        return (
+          <EyePreview url={url}>
+            {text}
+          </EyePreview>
+        )
+      }
+    },
+    {title: '结算日期', dataIndex: 'settlementDate'},
+    {title: '结算方式', dataIndex: 'settlementWayName'},
+    {title: '结算方', dataIndex: 'settlementName'},
+    {title: '总单数', dataIndex: 'totalCount'},
+    {title: '结算积分', dataIndex: 'score'},
+    {
+      title: '兑换比率',
+      dataIndex: 'ratio',
+      render: (text, record) => {
+        return (record.ratio) + "%";
+      }
+    },
+    {title: '结算金额', dataIndex: 'amount'},
+    {title: '结算时间', dataIndex: 'settlementTime'},
+    {title: '支付方式', dataIndex: 'payWayName'},
+    {
+      title: '结算状态', dataIndex: 'status',
+      filters: [
+        { text: '待对账', value: 1 },
+        { text: '待付款', value: 2 },
+        { text: '待收款', value: 3 },
+        { text: '已完成', value: 4 },
+      ],
+      onFilter: (value, record: any) => record.status == value,
+      render: (text, record: any) => {
+        return (
+          <StatusTag type={STATUS_COLOR[record.status] as 'success'} title={STATUS_TEXT[record.status]} />
+        )
+      }
+    },
+    {
+      title: '操作',
+      render: (text: string, record: any) => {
+        const isUniversalPay = record.payWay === 2;
+          // 待对账的时候可以手动结算
+        if (record.status === 1) {
+          return <a onClick={() => handleAction(record, "manualSettlement")}>手动结算</a>
+        }
+        if (record.status === 2) {
+          return (
+            <a onClick={() => handleAction(record, isUniversalPay ? 'universalPay' : 'uploadPayVoucher')}>
+              付款
+            </a>
+          )
+        }
+        return <a onClick={() => handleAction(record, isUniversalPay ? 'viewUniversalPay' : 'viewPay')}>查看付款凭证</a>
+
+      }
+
+    }
+  ]
+
+  const cacheItemInfo = useMemo(() => itemInfo, [itemInfo])
+
+  return {
+    columns,
+    handleOpen,
+    handleClose,
+    itemInfo: cacheItemInfo,
+    modals,
+  }
+}
+
+export default useHandleSettlementList